Shift8から岡山WEBクリエイターズ 「ルネッサンス」についてのひとまずの結論

まだまだ仕事はおさまりませんが

いよいよ年末となってきましたが、私の方は一向に終わりが見えない状況です。なんとか29日には終われることを信じて、風邪をひかないように1週間を過ごしていきたいと思います。

皆さまにおかれましては、不審火なども多い季節ですので、くれぐれも火の元には十分ご注意くださいませ。昨日未明からの大火災については、日頃言いたいことを遠慮なく言う方の私としても、どういう風に鎮火されるのかに注目しております。

CSS Nite Shift8での登壇風景。右から原さん、矢野さん、坂本

撮影:飯田昌之さん

まずはShift8でWebデザイントレンドへの登壇

本来はShift8の感想を書きたいところだったのですが、デザイントレンドでの坂本の目の「ルネッサンス」を十分に説明することができませんでした。これは私の時間配分のミスともう少しわかりやすい言葉を選んでおけばよかったなと思っています。フォローアップメールでは補足させていただきましたが、参加された方には中途半端な感じを与えてしまったと思います。申し訳ありません。

そんなわけで、それをきちんと伝えるべくブログに書こうと思っていたのですが、その前に岡山WEBクリエイターズの年末スペシャルが先に来てしまったので、それも含めて今年考えたことをざっくりとまとめていきたいと思います。

大阪ではWebデザイントレンドの再演版の開催が決まっていますので、参加される方は、このダラダラとした記事を読んでこられると、また違った見方も出来るかもしれません。

同じようなサイトが多いのは工数が原因?

毎年デザイントレンドの本番前にはだいたい1,500サイト前後のスクリーンショットを見ています。Greativeの原さんが作ってくれているツールは、PCサイトのスクリーンショットを並べてくれているのですが、ここ数年はPCだけで見ていてもわからなかったり、JSでぐりぐり動くようなサイトは上手くスクリーンショットが撮れないこともあるので、実際にサイトを見てみなければわからないということが増えてきました。

それで気になるので、タブレットで開いたり、スマホで開いたりして、挙動を確かめています。準備の時間も倍くらいになったように感じています。

様々なサイトを見ていて強く感じたのは、どれもこれも同じように見えるということでした。上場企業のサイトは特に顕著なのですが、これは国内の中小企業のサイトでも同じ印象を受けています。マルチデバイスへの対応やフレームワークの普及など、要因はいろいろとあるのでしょうが、もう少し現場レベルの話をすると、工数が今までほど掛けられていないのではないかと思います。

PCだけで見られればいいよというサイトは、よほど条件が整わなければないと言ってもいいと思います。つまり様々なデバイスに対応する分、それだけ工数は掛かってしまうわけですが、だからと言ってクライアントの予算が急に増えたりするわけではないので、どうしてもどこかを削らなければならなくなってきます。それがビジュアル面に出ているのかなと邪推しています。

激動の時代から、なんとなく停滞しているような感じを強く受けてしまっている時に、頭の中に「暗黒の中世時代」という言葉が浮かんできました。ヨーロッパ中世が暗黒であったかどうかはまた別の問題なので、ここではあまり突っ込まないようにしてください。ですが、ルネッサンス期に比べると活気の感じられない時代で、その頃に蓄積されたものごとが、ルネッサンスが開花したんですよね。

やっぱりコンテンツですよ

12月20日に岡山で私が「海外サイトに学ぶ 2015年に使えそうなウェブデザインのギミック」といういかにも小細工みたいなセッションで「ルネッサーンス!」とか言ってる頃、名古屋と金沢ではコンテンツやSEOを主眼としたイベントが行われていました。

コンテンツが重要であることにまったく異論はありませんし、そうあるべきだと考えてはいるのですが、そこに力を使うのであれば、デザインはデザイナーだけの仕事ではなく、上流工程から考えていくべきものなんだと思います。

そこで長谷川恭久さんがShift8の基調講演での「みんなデザイナーです」という言葉が思い出されます。私も3年ほど前に恭久さんからの問いにこんな風に答えています。

ですので、コンテンツも含めて、プロジェクトに携わる人がみんなデザイナーだと思って、一つのサイトを作っていくという形が理想だとずっと思っていましたが、その出力されたコンテンツをどう視覚化してわかりやすく伝えるかはビジュアルを担当するデザイナーの力量が基本的には問われる部分です。

理想と現実のギャップ

とは言え、まあ予算がない、工数が掛けられないとなると、業務を効率化することで質の高いものを何とか作っていくしかないわけでして、フレームワークなどを使うというのはごく当たり前のことです。私もBootstrapだったり、HTML Kickstartだったり、a-blog cmsに付いてくるものだったりを使って、できるだけ早くやろうと試みてます。

現実にはフレームワークそのまんまみたいなデザインばかりが見られるような状況になってしまっています。見出しとボタンの色だけ変えて、でっかい写真を入れておけば、そこそこに見えるだろうというような感じですね。

しかもスマホくらいの画面サイズだとたいした装飾をするスペースもなく、画面上のコンテンツはどんどん洗練されて少なくなっていってます。もう写真くらいでしか表現できないのかと思ってしまいます。

今まではiPhone基準の320pxがもっとも小さいスクリーンサイズと考えていたものが、スマートウォッチなんかも含まれてくると、もうどこに飾りを入れていいか検討も付きません。

もうデザイナーの出番はないの?

先ほども申し上げた通り、理想通りに進めるのであれば、上流から案件に関わっていくのが理想ですし、そういう体制のところに参加でできれば、Webデザイナーの出番はまだいくらでもあります。ただし、画面サイズが小さい場合には出来ることが限られるという状況は変わらないでしょう。

では大画面でいろいろ盛り込めるかというと、コンテンツのコントロールが進むことで、ページ内の情報量が基本的に減っていく方向になるというのも避けられないと思います。

そこでアニメーションGIFですよ!

と言うことで、2015年はこれからはアニメの時代ではないかと思ったりするのです。この間からつぶやいたりしてたわけですが、割と真面目にそう思っていたわけです。

装飾が減ると、どのサイトも同じように見えます。これは当たり前です。そして工数も画面サイズも限られた状況であれば、すぐに出来て、豊かな表現ができるコンパクトなアニメーションテクニックを得意技として1つや2つ持っておくのをおすすめしたいと思います。

これは単に動いててすごいでしょうというDHTMLの時代みたいなことではなく、サイトの情報を他サイトより優位に見せたり、内容をよりスムーズに伝えるということを念頭に置いての利用です。

別にアニメーションGIFでなくとも、CSS3やSVGのアニメーションでいいと思います。animate.cssとか誰でも使えて簡単ですし、見出しだけちょこっと取り入れたいとか、写真の出し方だけ工夫するだけでもだいぶイメージは変わりますしね。

この辺りの表現は今までは環境の制約(もうあんまり気にしなくていいと思いますが)もあって、限られた場面でしか使われていなかったと思うのですが、どんどんやっていっていいのではないかなと思います。

そしてルネッサンスに戻る

まあサイトが動いてたりしたのは、Flashなんかでもあったわけなのですが、いくらWebの世界の進歩が早いとは言え、まったくの無から今までに見たこともないナビゲーションとかが生まれたわけではありません。最近では当たり前のようになったスライドして横からメニューが出るという挙動も、Web以外のところでは昔からあったもので、それに今の時代・デバイスのエッセンスが加わったことで、新しく見えるものができたということなのだと思います。

昔あったものと最新の技術を融合させて、新しいインターフェースや表現を生み出していくのは、来年以降のWebデザイナーにも今まで同様に求められるのではないかなと思ったりしています。

そんな動きが感じられるいくつかのサイトが、今年のデザイントレンドではイタリアのサイトから感じられたということで、きっと来年は新しい時代の兆しが見えるのではないかなという期待を込めて、来年はルネッサンスと表現させていただきました。

イタリアの夜明けを紹介

参考までに岡山で紹介したイタリアのサイトをここでご紹介しておきます。ぱっと見にはダメなものばかりなのですが、そのデザインの背景まで考えると、僕にはすごく魅力的なサイトです。文句なしにダメなのも混ぜてますが、そこは皆さんにご判断いただければ。

この並びだと最後のが一番いいですかね。ローディングで使われるフレームがそのままデザインに取り込まれてますし、どのデバイスで見てもだいたいきちんと見れるようになってます(スマホで横にするとPortrait onlyとか言われたりしますが)。

相変わらず取り留めのない感じになってしまいましたが、それではこの辺で。

最後になりましたが、やってしまったことが、なかったことになったり、時間が巻き戻ったりすることはないので、私も今後の登壇ではよりわかりやすい言葉を選ぶように気を付けたいと思います。

岡山の坂本の登壇風景

撮影:山下裕一さん