SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

特集記事

「ユーザー志向」のスマートフォン向けUI/UXの作り方

  • X ポスト
  • このエントリーをはてなブックマークに追加

ユーザーのアクション単位でデザインを考える

 良いソーシャルゲームUI/UXを考える上で、情報整理をすることと同様に、もう一つ重要なことは、「ユーザーのアクション単位」で考えることです。

 例えばページ遷移後に、指の位置とずれた場所にボタンが配置された場合、指の位置を移動させる必要があります。前後のページの主要動線の位置は揃っていないとストレスに感じます。主要動線のボタン位置のずれはページ単位、あるいはアニメーションとページデザインを別に制作している場合に起こりやすいです。

 行動単位のデザインはボタンの配置だけに限りません。はじめは情報を隠しておき、ユーザーがタップし情報を表示させるページを良く見かけますが、本当にその表現が適切か疑問に感じるケースが多々あります。画面内の隠された情報をわざわざ見るユーザーはあまりいません。ユーザーのために情報を隠すのであれば、ユーザーは別ページでも、遷移をして情報を見に行くはずです。無理やり一画面に分かりにくく情報を押し込むよりも、リンクを1つ用意する、あるいは縦スクロールのままで済む場合がほとんどです。どんなに革新的な技術であっても、使いにくければ意味がありません。

 隠すくらいの情報であれば、「そこになくてもいい」⇒「見たい人は別ページでも見に行くだろう。では別ページで良いのでは」というユーザーのアクション単位で情報を整理することが必要です。

 一ページ、一画面のみで、ユーザーに必要な情報をすべて見せようとするのは困難です。ユーザーの動きを予測し、情報を分割することが分かりやすいスマートフォンUI/UXを作るためのコツになります。

情報アーキテクチャ(IA)からグラフィックデザインまでがUI/UX

 これまで説明してきたことからも分かるとおり、UI/UXはグラフィックデザインの段階で考えることではなく、情報アーキテクチャ(IA)を考えることから始まります

 ゲームの骨子やユーザーストーリーがあいまいなまま、ゲームの世界観やGUIデザインへと進み、「情報設計&レビュー」と「GUIデザイン」のみが繰り返されるというフローでは、情報の多さをうまく整理することに限界が生じます。つまりユーザーにとって、本当に使いやすいUI/UXができません。

 ソーシャルゲームは特にゲームの世界観であるグラフィックデザインが先行し、グラフィックデザインと、IAやUI/UXの話が一緒にされがちです。しかし一般的な制作フローと同様、ソーシャルゲームも「誰に何をしてほしいのか」からデザインを考えるべきですし、一般的なWeb制作となんら変わらない工程を踏みます。ゲーム骨子(仕様)を固め、ユーザーストーリーを考え、そして情報設計およびレビューを繰り返して情報に優先順位をつけて絞っていく。その上でグラフィックデザインを検討するのが良いUI/UXを作るための、さらには制作期間を短くする一番の近道です。

終わりに

 UI/UXを考えるとき、その画面だけを見て善し悪しを判断することはできません。目的を持って操作して初めて、使いやすいか使いにくいかの判断ができます。細かいUI/UXのルールはデバイスごとに多々ありますが、それらを網羅しても本当に使いやすいものにならないときは、「誰に何をさせるためにこれを作っているのか」がブレている可能性があります。

 良くある「情報の優先度で迷いがちな課金への動線はメインアクションボタンより上なのか下なのか」といった話も、「ユーザー目線」で考えれば解決します。その画面でユーザーに課金がしたいという感情があれば、情報の優先度はおのずと上がりますし、なんの説明もせずに突然置かれる課金動線にまったく意味はありません。ユーザーが迷わないように固定の課金動線は常にあるべきですが、必要以上に課金の動線をうるさく増やせば、ユーザーにマイナスの感情を与えますし、不必要なボタンが押されるわけもありません。

 ユーザーがどんなストーリーでゲームをしているのかを考えれば、次にユーザーが必要な情報を予測できるはずです。ユーザーはお客様です。デザインでおもてなしをするくらいの気持ちで、相手がなにを望んでいるのかを考える。それがユーザーにとって良いUI/UXを作るコツです。

まとめ

  • 何をさせるサイト(ゲーム)なのかを明確にし、ユーザーストーリーを考える
  • ページ単位ではなく行動単位で情報デザインをする
  • IA、UI、UX、グラフィックデザインの話を一緒にしない
  • 細かいルールよりも、おもてなしの気持ちでユーザーが望んでいるものを予測する

 この4点を意識して、幸せなUIUX開発を実現していきましょう。

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
特集記事連載記事一覧

もっと読む

この記事の著者

長谷山 智美 (株式会社ディー・エヌ・エー)(ハセヤマ トモミ(カブシキガイシャディー・エヌ・エー))

株式会社ディー・エヌ・エーソーシャルゲーム事業本部 第一統括部室 所属。2011年3月にDeNA入社。ディレクターとして複数のソーシャルゲームタイトルを担当し、スマートフォン対応を推進するチームへ配属となる。クリエイティブ制作からディレクション、マネジメントまでの業務を幅広く担当している。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/6839 2012/11/08 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング