第34回リクリセミナー「Webデザイントレンド in 大阪 2018」に参加しました
1月27日(土)、大阪ナレッジキャピタルカンファレンスルームにて開催された「第34回リクリセミナーWebデザイントレンド in 大阪 2018」に参加しました。デザインに特化したイベントということで、どんなお話が聞けるのか昨年からとても楽しみにしていました。
余談ですが、今回のような無音カメラのみ撮影OKのイベントではアプリ「Microsoft Pix」が活躍するそうです。今回はダウンロードしていなかったので写真は撮れませんでしたが、帰宅してから速攻iphoneに入れたので次からは活用していきます！
それでは本編を振り返っていきます
ウェブデザインとセルフブランディング２０１８〜あなたの感性とスキル、一生ものです〜
松田直樹さんと矢野りんさんによるトークです。まずは２０１７年の気になったこととして、以下の３つを上げられていました。
- ネット系プロダクト（google homeなど）
- AIの発達（adobe senseiなど）
- 世間とwebの流行（ドンキにVRが！）
実はこの日会場にいく途中にも、VRを使用したプロモーションをしているイベント会場を見かけました。少しまでまではなんでもロボットも空飛ぶ車も妄想に過ぎませんでしたが、現在はテクノロジーの発達によりそれらも夢物語ではなくなってきています。
そしてそれらが発達するにつれ、web運用はインフラとしての役割が強化されます。何かの体験を創り出し、レビューをもとに方向性を見直すのはどのテクノロジーにも共通するサイクルです。その中でいかにライフ・タイム・バリューを意識してアイデアを取り入れるべきか考察することが、今後はより一層問われるのだと思います。
育つデザイン
汎用性に優れた例として、非常口のデザインが取り上げられていました。誰にでも馴染みのあるマークですね。
次にこのマークを見てみましょう。文字情報がないにもかかわらず、私たちはこのマークを見て「非常口だ！」と瞬時に理解することができます。
実はこの非常口のデザインは、企画段階から将来的に形を変えても認識できるよう考えられていたそうです。初めて表示を見た人が、「非常口」という文字と示されているマークをセットでインプットすることを見込んで、ゆくゆくは文字がなくてもそれが何を示しているのかわかるようにするーこれは、ロゴデザインの可変性にも共通するアイデアなのではないでしょうか。
運用とコンテンツ
sns全盛期（？）の現代、広告の仕方についても一昔前から随分変化してきたように思います。トーク中でよく話されていた単語「パラダイムシフト」を調べてみると、「その時代や分野において当然のことと考えられていた認識や思想、社会全体の価値観などが革命的にもしくは劇的に変化すること」とありました。歴史はこの繰り返しですね。
このイベントでは、そんな現代に効果的な広告アイデアとして「思ったことや感じたことなどの感性も同時に伝える方法」が取り上げられていました。ちょっとやってみていいですか。
２）先日兄からこれでお年玉をもらったばかりなのに・・・
コインチェック、仮想通貨580億円消失のその後
※実話です
また、この発展型として「想起率」のお話も。想起率とは、あるワードから特定のブランドを選択肢として思い起こさせる割合のことだそうです。例えばこの人。
"Why Japanese people!?"
でお馴染みの厚切りジェイソンさん。本名はジェイソン・デイヴィッド・ダニエルソンというそうです。ところで皆さんは彼がなぜ厚切りジェイソンという芸名にしたかご存知でしょうか？
実は、人々がスーパーなどで「厚切りベーコン」や「厚切りステーキ」を見かけると同時に「厚切りジェイソン」が思い浮かぶのを狙っているのだそうです。「厚切り」というワードに自分のイメージを関連付けさせるという点で、想起率を利用して印象を広げている良い例ではないかと感じます。
フォントおじさん2018
すごいインパクトですよね、この「フォントおじさん」というワード。私はこのトークをお聞きしてから、フォントといえば関口さん！と思うようになりました。これもまた先ほどの想起率の一例ですね。（笑）
話題はTBSテレビ「マツコの知らない世界」から始まりました。どうやら2017年5月にこの番組の中で「フォントの世界」が取り上げられたそうです。3000種類のフォントを見分ける「絶対フォント感」を持つ須藤さんの特集だったそうですが、これだけでもものすごく気になります。しかし検索してみると、どうやらもう公式サイトでの配信は終了しているみたいでした。残念…。見たかったなあ。
ゴシック体と明朝体
「知っているフォントをあげてください」と質問すれば、その答えとして上がるのはこの2つが圧倒的なのではないでしょうか。ゴシック体も明朝体も、中学の美術の授業で模写した記憶があります。ちなみに上の「はんなり明朝」は数年前に見かけてから気になっているフォントです。和みます。
「ゴシック体は見やすさや視認性を重視した書体で、明朝体は肉声感がありリズムを生む書体」と聞くと、それは確かにそうだ、と思いますよね。実はこれらの文字に対してそのような印象を受ける理由は、「文章の文字の上部を結ぶラインが直線かデコボコか」にあるのだそうです。なるほど！納得しました。
その他にも、日常の様々なシーンで見かける文字を例に様々なフォントを解説して頂いたのですが、これがなんとも興味深く。わたし自身も、この有意義な時間を経てもっとフォントのことが知りたくなりました。
適切なフォントを選択すると…
最後に、関口さんは「適切なフォントを選択するとフォントの存在感は消える」とまとめられていました。実はこのような言い回しは舞台美術の音響などでも聞いたことのあるものです。文字や音のように、日常でも当たり前のように目にする（感じる）ものは、あくまで自然であることが一番ストレスフリーなのだということが伺えます。「馴染まない」と感じた時に初めて違和感を覚え、ベストならばその画面や場面を引き立てる。今までフォントにあまり注目して来なかったというのは、もしかしたら私の出会ってきた文字の大半がベストなフォントだったからなのかもしれません。
新春！春だ一番webデザイントレンド祭りスペシャル
原さん、矢野さん、坂本さん、深沢さんがそれぞれの目でwebデザイントレンドを紹介する90分。始まる前はちょっと時間長いかな？と思っていましたが、終わってみれば本当にあっという間の90分でした。「フッター街」「ピクニックシート」「シズル感」などこれまた初めて聞く単語がズラリ…。それぞれ簡単にメモしておきます。
- フッター街…フッターデザインの一種で、フッターの上に建物が並んだ街の素材を取り入れること。今回は上場企業のHPのトレンドの一つとして紹介。
- ピクニックシート…アニメーションの一種で、あるコンテンツが直線上にスライドして出現するタイプのもの。「ペローン」「シュパーン」などの擬態語で表されるくらいのスピード感。設計側は操作がしやすく、訪問者側は目を留めやすい。
- シズル感…人の感覚を刺激する感じのことを指し､広告やデザインの世界では、瑞々しさというような意味で使われたりする。（weblio辞書調べ）
また、スクリーンにはロシアやブラジルなどの他国のwebデザインや、VRを取り入れた体験型HPなどが映し出されました。これは大学で聞いた話なのですが、VRを取り入れる形で建築物の内部を説明する機会も増えているそうです。この形がもっとメジャーになれば、不動産のHPなどではネット上で物件を体験して比較できる日が来るかもしれません。
大きな構成の変化
次にwebデザインの大きな構造としての変化を紹介されていました。それぞれ簡単にまとめていきます。
フチありデザイン
フチありデザインとは名の通り、画面いっぱいに、もしくはサイドに一定幅のフチをつけるデザイン構造のことを指します。このフチの中にはボタンなども何も入っておらず、本当に「フチ」でした。またこの構造が見られるようになった背景としては、近年のデバイスのデザインの変化が上げられていました。
ガラケーはスマホに変わり、さらには一面を全て画面にしたiphoneXが登場。見直してみると、デバイス自体のフチがなくなっています。このことを考慮に入れると、確かにその補完としてのデザインのようにも思えますし、または単に訪問者の視線を計算したデザインのようにも思えます。
先日読んだ記事にもこのフチありデザインが取り扱われていました。
ランドスケープ
私はアプリでしか見かけたことがないのですが、近年はHPでもデバイスを横にしなければ見ることのできないサイトが増えているようです。これはユニバーサルデザイン的にはどうなのかな？とも思いますが、縦に長いスマホの画面を横にすることで、確かに横に長いパソコンの画面に寄せることができます。そこを利用して、パソコンで見た時のような迫力を優先して構成しているのですね。
息の長いサイドバー
サイドバーが縦に変化しているということで。これが息が長いと讃えられる理由はいたってシンプルで、いくつでも項目を追加できるというところでした。確かに横にバーを作ってしまうと幅に収まりきらない要素は何段かに分けなければなりませんし、その都度設計を改めるのも大変です。
これに加えて、私はレスポンシブの要素もあるのではないかと思いました。サイドバーが縦に長ければ、スマホで表示してもパソコンで表示してもそのギャップの差は少なく済み、利用者は同一のものと認識しやすい分使いやすく思うのではと予想しています。
まとめ
思考法のセミナーというよりは技術や心理・視覚効果に寄ったトークということもあり、感覚的に楽しめましたし、またこれから詳しく調べていきたいことも増えました。しかしQ&Aなどでもあったように、効果やイメージの適切な言葉が模索しにくいというデザイン特有の問題や、デザインの背景が仮説的になりやすい危険もあるようにも感じました。
昨年12月のWCANのライトニングトークで上田さんがおっしゃっていたように、「このデザインを選ぶ根拠」というのをしっかりと言語化していくためには、視覚効果をストックしていくだけでなく、色やフォント、構成の変化によって利用者の心理にどんな変化があるのか、そのデータも意識した方が良いのだと思います。
またwebがアプリやプロダクトのインフラとなっているという部分でも、これからwebに携わる中ではwebそのものを考えるだけでなく、テクノロジーの変化などの時代背景もしっかりと捉えていかなければならないのだと思いました。