読者です 読者をやめる 読者になる 読者になる

ゆず日記

戦う Vimmer 兼 Dvorakユーザ 兼 Kinesisユーザ 兼 おぺらー が戦わないブログ

第45回HTML5とか勉強会に行ってきたお話。

第45回HTML5とか勉強会 : ATND に行ってきたメモ書き。

メインのスピーカーは安藤幸央さん(株式会社エクサ、Google Developers Experts (GEO))。
本日のテーマは「ユーザーエクスペリエンスとペーパープロトタイピング」
会場はMicrosoft

途中からのメモ

イマドキオススメの手法
  • インスクリーン(オンデバイス)プロトタイピング
    • 紙に書いたスケッチをカメラで取り込んでスマートフォンで画面を確認する。
    • 実際のデバイス画面で素早く確認できるのが利点
    • 方眼ノート便利
インスクリーンプロトタイピングに便利なアプリ
インスクリーンプロトタイピングのコツ
  • 必要な要素を適切な場所に配置する。本当にそこに必要か?
  • ある目的に向かって、素直に操作できる流れを確認する
  • 間接的な操作(ボタンやスイッチ)と直接操作を意識する
  • アイディアが有益で正しい方向を向いているのか確かめる
  • 抜け、漏れ、作らなければならない事項を洗い出す
  • 目的を実現するための機能、使いやすさ、楽しさを確認する

Mobile UX

  • PC WebとモバイルWebとの連続したユーザ体験の構築
    • チケット購入などの場合、スマホで閲覧したとしても決済はPCで行う人が多い
    • PC, タブレット, スマホ, TV(with ゲーム機, Apple TV) などのデバイスが今ある。
      • これらのデバイスごとのサービスUIをどうしていくのかも考えていく必要がある。

Mobile UX

HTMLが向いているケース
    • 改変が多い
    • 対応機種が多い
    • 社内利用メインの場合
    • 開発要員の問題
    • コスト観点
ハイブリッドアプリが向いているケース
    • 外側はネイティブアプリ, 中身はWebView, コンテンツはHTML
    • 文字入力が少なくてすむ場合(多いとモタツキ、UXに支障が出る)
    • ライフサイクルが短い場合
    • 対応機種が少ない場合
    • セキュリティ要件が厳しいものには向いてない(?)

ワークショップ前半

  • スマホから http://www.javari.jp/:tittle を見てペーパープロトタイプに起こす。
  • スマホのキーポード画面を書いたポストイットを用意しておき、ペーパープロトタイプ上に貼ると擬似的にキーボード入力時のスマホ画面を確認出来て便利!
  • 今回は時間が無いためやらないが、各UIの機能も書いてあるとGood!
  • 書いたプロトタイプはスマホで写真をとってスマホ上で表示し、実際の画面に近い状態でUIを確認してみる。

ワークショップ後半

戦利品

  • IEステッカーとクラウディアさん。Microsoftさん何処に飾れと...

f:id:Yuzuemon:20140218033129j:plain