2013年7月25日，第40回を迎えた「HTML5とか勉強会」は普段と趣向を変えた「女性向けの優しい勉強会」として，LINEさんに会場をお借りして開催しました。

勉強会では「これからのWeb制作で大事なこと」をテーマに，Web制作への取り組み方や考え方についてのセッションがありました。本稿では，今回の内容についてレポートします。

見た目以上に大事なこれからのデザイン

はじめのセッションではツクロアの秋葉秀樹さんから，行動と時間軸を意識したデザインの考え方について紹介いただきました。

行動のデザインをする

現在の日本では「美しいものやカッコイイもの，オシャレなものや流行りのものをデザインするのがデザイナーの価値という偏った考え方がある」と秋葉さんは言います。デザインの先にあるユーザの行動をデザインするのもデザイナーの大事な役割だと説明しました。

都合のいい状態だけのデザインをやめよう

「都合のいい状態」だけをデザインすることはデザイナーにもクライアントにも良いことがないと，秋葉さんは言及しました。

ダミーテキストを使って見た目には綺麗なコンテンツレイアウトのデザインを作成した場合は，特に「都合のいい状態」になりがちとのことです。

実際のコンテンツを流しこんでみるとテキストの量によって一行で収まらなくなったり，見た目がバラバラになったりすることが多いと指摘しました。ダミーテキストなど仮のものを当てたデザインはやめて，できるだけ実コンテンツに近いものを使うようにするといいと紹介しました。

デザインを時間軸で考える

動画プレイヤーを例にあげて，時間軸でデザインするという考えについて紹介しました。

動画プレイヤーのUIデザインを一枚絵で作っただけでは“⁠再生が終わった後⁠”に何を表示すればいいのか，一枚のデザインからだけでは実装を行う人にはわからない部分があると秋葉さんは言います。行動のデザインとともに，時間軸でデザインを考えることもデザイナーのとしての役割だと紹介されました。

ユーザーに気づいてもらえるUI/UXデザイン

スマートフォンではPCブラウザでの操作と比べると「要素が動かせる」ことをユーザに気づかせるのが難しいと言います。並べ替えることができるメニューリストを例に，動かせることを気づかせるための試行錯誤などを紹介しました。

スマートフォンの操作にはタッチやタップ，スワイプやフリックなどの操作方法がありますが，メニューリストの並べ替えにはこれらの操作は適していません。この例ではロングタップをすることで並べ替え可能な状態になり，そのあと指を動かすことで並べ替えられるようにしています。ロングタップという操作ができるということを見た目から気づかせるのは難しいため，ユーザの操作ミスなどを見越して「ロングタップが発生するまでの時間を細かく調節して検証した」と述べていました。

問題解決のために手段を限定しない

デザインは人の行動や時間によって変化するということを意識することが大事だと秋葉さんは言います。inBrowserDesignといった手法なども出てきていますが，どのやり方が一番良いなど「手段を限定せずに問題解決にはあらゆる手段を使ってチャレンジしよう」と締めくくりました。

講演資料はこちらになります。講演の詳しい内容は動画をご覧ください。