アプリ開発のために、UIやUXといったデザインを考えなければいけない。そのためには、正しいメソッドをもとにデザインすることが求められる。THE GUILDの深津貴之氏は、QuadCameraやミニチュア風写真が撮れるTiltShiftGenの作者で、iPhoneアプリを中心としたUIデザイナーだ。

同氏がMOVIDA SCHOOLで語った「デザインを考えるために必要なメソッドとプロトタイピング」についてまとめた。

デザインの本質は「設計」

デザインは、表面的なものをキレイにすることではない。デザインの語源は「設計」であり、ものを整理したり整頓したりすることだ。目的を提案したり課題を解決したりすることが大きな方向性といえる。そのための手段として、ユーザ体験を考えるUXデザインや操作性としてのUIデザイン、情報をわかりやすく伝えるための情報デザインなどがある。

デザインはエンジニアリングだ

デザインは、センスではなくエンジニアリングの一つだと認識しよう。デザインの作業をエンジニアの作業に置き換えるとわかりやすい。デザイナーがピクセル単位で整列させたり色や書体を統一したりするのは、エンジニアがタブやブランケットを整理したり、ネーミングルールなどの統一したルールを作ったりすることと同じだ。デザイナーとエンジニアの間にある不一致をいかになくすか。そのためには、互いに理解できる言語に翻訳することが大切だ。

アニメーションは、ユーザを迷わせない方法の一つ

なぜアニメーションが必要なのか。ただ派手だからというわけではなく、特定の場所に注目を集めることができるからだ。「ここを注目しよう」とテキストで書くよりも、点滅してたほうがユーザは注視しやすい。状態の変化も通知できるため、どれが動いたかどれを押したのかがわかり、ミスタップや迷いタップも少なくなる。

ユーザは、一瞬の変化だけでは認識できない。セーブするときに、保存中のアニメーションをだすことでセーブしていることを伝えたり、メールを送るときに送信中がわかるアニメーションにしたりしているのも、ユーザへの理解を促すためのものだ。必ずしも、素早く操作できるだけが良いことではない。

アニメーションは、ストレスの軽減にも通じる。RPGなどで戦闘シーンの突入でアニメーションがあるのは、アニメーション中に次の画面をロードしており、ユーザに対して待ち時間を体感しづらくしているのだ。ただ画面が暗くなるだけだと、ユーザは画面が停止したと思い不安になる。仮に同じ2秒であっても、アニメーションの有無で、ユーザ体験は大きく変わることを意識しよう。

効果音や振動は情報通知の一つ

効果音や振動も、画面を見てないユーザに情報通知できることが最大の価値だ。長い処理動作であっても、ユーザは他のことに注意を向けることができ、効果音や振動を通じてユーザの意識を引き戻すことができる。

アプリ開発を行う上での4つのメソッド

アプリ開発のための4つのメソッドを紹介する。 1. プロコンリスト…長所と短所を並列して考えることで、客観的な評価をもとに分析することができ、チームで状況を把握しやすい。 2. ステイトメントシート…アプリの本質を一行で表現することで、コアコンセプトの共有に有効なツールだ。機能変更や追加があるたびに、原点に戻ることで軸をぶらさずに開発することができる。 3. フィッシュボーン図…問題を入れ子状に書き出していき、それに対応した解決策を列挙し網羅的に表現することで、複雑な問題を単純化することができる。 4. イメージボード…開発するサービスに関連する分野の画像を集め、目録を作ることで大枠の方向性を確認することができる。

90％のユーザが必要な機能だけを入れる

アプリを作る大きな流れは、コアコンセプト、機能の絞り出し、バリエーション列挙、プロトタイピングといった順番だ。コアコンセプトは、誰が、何を、いつ、どう使うかを考えなければいけない。既存サービスと自分がやろうとするサービスの差異を明確にし、使用シーンを想定して機能を絞り出そう。機能は、何を入れて何を入れないか。いかに削るかが大事であり、90％のユーザが必要な機能だけを入れるように心がけると、機能を絞り出しやすい。

プロトタイピングを考える4つの型

アプリのプロトタイピングは、ユーティリティ型、ナビゲーション型、タブ型、没入型といったアプリの型をの特徴を理解した上でプロトタイピングしよう。 1. ユーティリティ型…遷移が少なく、単機能や単目的に特化している。 2. ナビゲーション型…メールアプリなどのように階層がスタックし、遷移構造がツリー状になっている。 3. タブ型…App Storeのように主機能が並列しており、複雑なアプリはナビゲーション型と併用することもでき大規模なアプリに最適だ。 4. 没入型…オリジナルUIでユーザ体験を高めることができるが、コストや工数がかかるので注意が必要だ。

ペーパープロトタイピングで、すべての人が設計フェーズに携わろう

ペーパープロトタイピングは、デザインスキルがなくても色んな人が一緒に関わることができるため、初期のフェーズでつくったほうがよい。PCでプロトタイピングをつくろうとすると、Photoshopが使える人しか設計フェーズに参加できない。チームで共有しながらアイディアを出すためにも、紙を使って書き出すほうが、時間もコストもかからない。意思決定のためにペーパープロトタイピングを使用し、本格的な高精度プロトタイピングではPCで作業するといった具合に、フェーズによって最適な手法を採用することが大切だ。