More Related Content Similar to Mobile frontier chapter7 (20) Mobile frontier chapter72. 第1部 第2部 第3部 第4部
バイルの特殊性 現れつつある モバイルの モバイルUXの未
モバイルのパターン
モバイルのパタ ン エクスペリエンスを
創る
い ユ モ 形 モ モ モ 感
う ー バ デ 態 バ バ バ 動 情 新
パ ザ イ ン の イ イ イ き に し
ラ ー ル バ 変 ル ル ル の 働 い
ダ イ 固 ー 遷 の の プ つ き モバ
イ の ロ け か イ
ム ン 有 ピ ト か け ル
UX
UX
パ パ
タ の ー タ タ タ た る の
ーフ ナチ ナッ イ 形
ェ ー ー ピ
ー ュ ツ ン ン ン
ス ラ バ 5 グ
と ルな ター 選
3. Layer6:ビジュアルデザイン
・視覚的にどのように⾒せるか?
視覚的にどのように⾒せるか?
ビジュアルデザイン
ビジ アルデザイン
・どう演出するか?
Layer5:コンテンツ作成
・どんなコピー、⽂章、写真に展開するか?
コンテンツ作成
Layer4:情報設計・インタラクション
・画⾯の中で情報をどう整理するのか?
画⾯の中で情報をどう整理するのか?
インタラクション 情報設計 ・ユーザーの⾏動にどんな反応を⾏わせるのか?
デザイン (画⾯構成)
Layer3:サイト構造設計
y
・情報をどう整理して構造化するのか?
情報構造設計 ・ユーザー導線、ユーザータスク検討
Layer2:機能・コンテンツ要件
Layer2:機能 コンテンツ要件
・どんなコンテキスト、コンテンツにするか?
機能要件 コンテンツ
・どんな機能をどのように実装するか?
要件
Layer1:戦略・施策検討
・ビジネス・ユーザー条件検討
戦略・施策検討
(ユーザーニーズ、ビジネス要件) ・ターゲットユーザー、ペルソナ、シナリオ検討
・ユーザーニーズ、ビジネス要件検討
アニメーションに関する書籍で
で紹介されている12の基本原則を
4. モバイルエクスペリエンスにおいてわずかな動きを伴
伴ったアニメーションは強制的なデザイン材料として
扱われ始めている
幼少時の⼟曜⽇朝のテレビタイムの回想
Movement breathes life into everything it touches
o touches.
「動き」が全ての触れるものに命を与える
5. アニメーションにおける12の基本原
原則
1.潰れと伸張
2.予期(アフォーダンス)
3.ステージング
4.Pose to Pose
5.フォロースルーとオ オーバーラップ
5.ゆっくり始まりゆっくり終わる
7.アーク(弧)
8.副次的なアクション
9.タイミング グ
10.誇張
11.ソリッドドローイ グ
リ ドド イング
イ
12.アピール
6. 1.潰れと伸張
現実世界にあるものの持つ質感の特
特徴を考えて、取り⼊れる。
特徴を考えて 取り⼊れる
・本棚や⽊の椅⼦について、堅くて曲がらない印象を持っている
・布⽣地や植物の葉について、柔
布⽣地や植物の葉について、柔
柔軟性を持っていると思っている
Flip”board”は硬さを表現、iBook
ksは曲がりで薄さと柔軟さを表現
12. 4.Straight AheadとPoseToPose
e
■Straight Ahead
キーフレーム間のシーケンス
キ フレ ム間のシ ケンス
を全て可視化する
■Pose to Pose
キーフレームのみの表現
単純な遷移ならPos to Poseで⼗分。
se
20. 副次的なアクション
「追いやられるスクリーン
ン」の横移動と
「新しいウインドウ」が⼿
⼿前に移動の別々の動き
29. モバイルUXプロジェクトを実施する
る際のTips
・やりすぎを抑えることを学ぼう
う
提供しようとしているユ ザー体験をやりすぎないこと
提供しようとしているユーザ 体験をやりすぎないこと
ザ
・法則を補完し合う
それぞれの法則は単独では望望ましい効果を達成し得ない。
それぞれを協調させること
・サポートの役⽬としてのアニメ
メーション
モバイル体験の中でアニメー
ーションは補助的な役割
⼿段と⽬的を間違えないよう
うに
30. 感想
・12の法則は明確に分離していな
ない
法則として正しいが、サンププルが適切でないものも。
今後多くの事例が⽣まれて初初めて完成するのかも
・感覚の違いを吸収するためのプ
プロトタイピング
コンパイルが必要なプロダク
ンパイルが必要なプ ダク
クトでは難しい?
クト は難し ?
アニメーションを検討するた
ためのツールの必要性がありそう