UIデザインすることになったWebデザイナーが、押さえておきたいあれこれ

普段はwebデザインをしているけど、次の案件はUIデザインをすることになった……！転職してUIデザイナーになりたい！UIデザインの勉強しているけど勝手がわからない……！

株式会社メンバーズ　メンバーズキャリアでwebデザイナーの和気です。
私がUIデザインに携わってみて知っておいた方が良かったこと、押さえておきたい違いなどをまとめました。

※web業界でUIデザインといえば主にスマホアプリのUIデザインを指すことが多いので、今回の記事はスマホアプリのUIデザインを前提にお話ししています。

和気登志子（わけ・としこ）

株式会社メンバーズ　メンバーズキャリア　デザイナー
2019年メンバーズキャリア福岡に入社。
webやUIデザインなどデジタル領域のデザイン制作に従事。
情報設計・ウェブ解析・アクセシビリティ・ブランディング・社会課題へのアプローチなど広く探求中。

目的を理解する

UIデザインすることになったWebデザイナーが、押さえておきたいあれこれ

まずは制作の背景を押さえましょう。
webのキャンペーンサイトだと認知が目的だったり、LPサイトだと商品購入までの誘導が目的だったりします。比較的webは世界観を伝えたり、短時間でインパクトを与えることに重きをおく場面が多いです。（ECサイトやポータルサイトなどはまた変わってきますね）

一方、スマホアプリは継続して利用してもらったり、課金してもらうことなどを主な目的としています。そのためには使いやすさや没入感の醸成など、使い続けてもらうことに重きをおきます。

LPサイトの延長のように意識していると、インパクトを出そうと華やかなビジュアル制作に注力しそうですが、スマホアプリのUIデザインでは必ずしも重要ではありません。
説明がなくても操作感を予測できるような表現やスタイリングルールを一貫させることなどに注力することが多いです。

KPIを押さえる

KPIとは、目標達成度合いを測るための指標のことです。
webデザインでよく耳にするKPIは、クリック率やページビュー数ですね。
UIデザインではアクティブユーザー数、継続率、課金ユニークユーザー数がよく取り上げられます。
スマホアプリは継続して利用してもらったり、課金してもらうことなどを主な目的とします。どれだけ人が集まるかより、どれだけ続けて利用してもらえるかが重要です。

また、スマホアプリはユーザーにインストールしてもらわないとそもそも使ってもらえません。しかしホーム画面は限られているので、1ユーザーがインストールする数は限られています。さらに一度アンインストールされたアプリはよっぽどのことがない限り再度インストールしてもらえません。

つまり使ってもらうまでのハードルがとても高いので、一度拒絶されると二度と目に触れる機会を失ってしまうリスクが高いのです。
そのため、使いやすさや分かりやすさなどがとても大事になってきます。

スマホの特性

webデザインは、同じディスプレイ上にボタンなどのインターフェースと、文章や画像などのコンテンツが存在していることが特徴です。
さらにスマホアプリのUIデザインで留意したいのは、スマホの特性です。

スマホはタップ、スワイプなど指で操作します。
スクロールとクリックの誤操作が起きやすかったり、入力操作が面倒になりがちです。
スマホではPCのようにカーソルで細かい操作はできないし、キーボードで簡単に入力できるわけではありません。

また、PCでの特性のひとつであるマウスオーバーの効果も、スマホでは同じように表現できません。UIデザインは一目見て操作できると予測できる表現が大事です。

ガイドライン

スマホアプリはiOSやAndroidなどのプラットフォームの上にあります。
例えばiPhoneユーザーはiPhoneを利用しているのでiOSの挙動に慣れていますよね。

ルールをまとめたものがデザインガイドラインです。
AppleやGoogleからもデザインガイドラインを参照することが推奨されていて、公式ドキュメントが誰でもwebで閲覧できます。
設計指針やデザイン原則の概念から、UIパーツのレギュレーションなどの細部までがまとまっています。

参考：
Human Interface Guideline
Material Design

UIデザインは操作できることが大事です。
操作が分かりやすいデザインにするためのアプローチとして、標準化や一貫性を担保する方法が基本です。
例えば進むボタンなど操作を実行する系のボタンは右向き矢印、戻るボタンなど操作を取り消す系のボタンは左向き矢印が一般的ですよね。
それを、独自性を優先して新たなルールを導入してしまうと、普段と違うルールを把握する、理解してもらうことをユーザーに強いてしまうことになります。
UIデザインでは一貫性や標準化を考慮してデザインを制作しましょう。