このページは、外部サイト
CSS Nite公式サイト の情報をRSSフィード経由で取得して表示しているため、記事の一部分しか表示されていなかったり、画像などが正しく表示されなかったり、オリジナル記事が意図したデザインと異なっていたりする場合があります。
完全な状態のオリジナル記事は 「
Shift9:Webデザイン行く年来る年(CSS Nite LP43)フォローアップ(4)たにぐち まことさん(エイチツーオー・スペース)、松田 直樹さん(まぼろし)、矢野 りんさん(Baidu)」 からご覧ください。
2015年12月26日(土)、ソラシティホールで開催したShift9:Webデザイン行く年来る年(CSS Nite LP43)のフォローアップとして、たにぐち まことさん(エイチツーオー・スペース)、松田 直樹さん(まぼろし)、矢野 りんさん(Baidu)の『スマートデバイス』セッションのスライドなどを公開します。
メッセージ:矢野さん
ご参加くださりありがとうございました。今年はAndroid 6でiOS同様アプリの取得する権限をユーザーが個別に選択できるようになったり、強烈に解像度の高いiPad Proが追加されるなどいろいろな動きがありました。Appleはこれからも異なる解像度の端末をどんどんリリースしてくるでしょう。ネーティブアプリもWebとおなじようにフレキシブルな画面設計が必須ですね。
今年のセッションで矢野からはモバイルむけ画面デザイン最適化のために数値目標を持つことというお話をしました。モバイルのUIデザインを評価するばあい、単に「使いやすい」とか「便利」というのはあまり意味がありません。デザイナーが個人的に使いやすいと考えていてもリテンションレートが50%以下ならそれは使いやすいとは言えないのです。数値にかなった評価をするという考え方をぜひ活用してみてください。デザイン力で目標を達成することが、できるようになるでしょう!
来年はたくさん新しいことに挑戦して、年齢に関係なくうんと成長できる年になるようみなさんと一緒に頑張りたいです。またお会いしましょう!
メッセージ:松田さん
スマートフォンセッションの松田です。ご参加いただいた皆様、今年もありがとうございました。
今回はECサイト、特に入力フォームを中心とした傾向をご紹介いたしました。UI単体をどう見せるかに加えて、そのUIをどういったタイミングで見てもらうかという動線設計のウェイトが上がってきているのが近年の傾向です。ひとつの画面およびUIとしてのフォームを使いやすくデザインすることももちろん大事ですが、そのUIがサイト全体の中でどういった立ち位置で存在させるべきなのか、ということをお伝えできたかと思います。
こういった時系列の設計に役立つのが冒頭でも紹介した「プロトタイピング」です。(長谷川さんのセッションや鷹野さんのセッションでも紹介されていましたね。)今回、ECサイト100社以上の調査を行って、私自身、プロトタイピングでの全体設計の重要さを改めて感じました。Webサイトの場合、どういった画面やUIも単体では存在し得ないし単体では使ってもらえません。必ずその前後のコンテキストがあるのですよね。この時系列の設計は、矢野さんのKPIのお話にも繋がります。運用での検証と改善こそ時系列設計の最たるものでしょう。
100社の調査をしてみて思ったのが、この動線設計には完全なセオリーはなく、それぞれの正義があるのだろうということ。特にスマホという文字通り肌身離さない、人に一番近いデバイスだからこそ、Webサイトを「ユーザーと対話する生き物」として考えていきたいものですね。
毎年こういった考える機会をいただけて幸いです。来年もお会いできること楽しみにしています!あらためまして、ありがとうございました!
メッセージ:たにぐちさん
今年も一年お疲れ様でした。今年の、スマートデバイスセッションは ECサイトの特に、フォームを取り上げました。もしかしたら「自分は ECサイトには関わっていないので関係ない」と思われる方もいるかも知れません。しかし私は、逆に ECサイト以外のサイトでおざなりになりがちなフォームに、今回の内容で学ぶべきと頃があればと思い、このテーマに決めました。
ECサイトの場合は、売上などのデータをシビアに確認しながらフォームをチューニングしているはずです。しかし、ちょっとしたお問い合わせフォームや申し込みフォームだと、そこまで気を使って作ることができないかも知れません。しかし、スマートデバイスでお問い合わせ・申し込みをする機会はますます増えていきます。そんな時、少しでも使いやすいフォームが増えていくことで、より多くの方がスムーズに手続きができる世界を私たちで作っていけたらと思いました。
なにか参考になる部分があれば幸いです。
動画
Shift9[#4]スマートデバイス from CSS Nite on Vimeo.