ウェブデザインにおける動きの演出について、WCANで発表しました

9月20日にWCAN 2014 Autumnで「ウェブデザインにおける動きの演出について」というタイトルで1セッション担当させていただきました。

普段のウェブ制作の仕事の中で、CSSやJSで動きをつける場面が増えてきた一方で、その辺りの情報をあまり整理できていなかったので、自分自身の勉強もかねてこのテーマを選びました。実ははじめは「クリエイティブマインドセット」を読んで、誰もがデザインに関わるべきですよというような話をしたかったのですが、7月の社内勉強会の時に私のプレゼンの準備不足もあり反応がいまいちだったので、もう少しわかりやすいテーマにしようとウェブデザインにおける動きというテーマにしました。8月の社内勉強会で一度プレビュー版を発表して、そこでの感想も参考にしながら本番用の内容の準備をしました。WCANの週の頭に社内で本番用の内容で今一度見てもらって伝わりにくかった部分を修正して、最後の最後、前日にサイトの分類を機能別じゃなくて目的別の方がいいなと思ってギリギリまでいじってました。

正直なところ人前で発表をすることは得意か苦手かで言ったら苦手な方で何度も失敗をした経験があります。なので今回は準備と練習はしっかりしようと心がけました。以前、CSS Niteの鷹野さんのプレゼンのセミナーに参加した際に紹介していただいた「スティーブ・ジョブス驚異のプレゼン」を読んで、なかなか全ての要素を反映させることも難しかったのですが自分なりに咀嚼してスライドをブラッシュアップさせました。今回動きの演出ということで、色々なサイトの動きを見せるために事例は全てデスクトップを動画で撮りました。私はMacBook Airの11インチを使っているのですが、1024x768の動画を撮るのにディスプレイの大きさが足りず困っていたらQuickResというアプリを教えてもらってこれが非常に便利でした。スライドの中で紹介していたGumroadの決済の画面は、このアプリを買ったときに見て面白いと思い内容に取り入れました。ただ、スライドをkeynoteで作っていたのですが、見た目がイマイチ気に入らなく、イラレのアートボードを駆使して作っていたら思いのほかスライド作成に時間がかかってしまって、本来は話す練習にもっと時間を使いたかったのですが、時間配分が反省点です。

本番では案の定緊張して、はじめ呂律がまわらなくて焦りましたが、台本を暗記するぐらいは練習していたので伝えたかった内容は漏らさず話すことができてよかったです。発表の準備は非常に手こずりましたが、いい経験をさせていただきました。

紹介したサイトや書籍

POINT1:UIアニメーション

POINT2:インタラクション

POINT3:伝え方とテスト

参考にした資料


yamada takuo

有限会社アップルップル デザイナー

カメラと自転車と本屋が好きです。愛知県岡崎市在住。