Androidエンジニアが普段考えるアプリのUI・レイアウトデザイン

これはフェンリル デザインとテクノロジー Advent Calendar2024 10日目の記事です。

前置き

この記事の目的は、Android/iOSのデザイン、開発に従事しているデザイナーや技術者を主軸に、職業紹介として開発に従事していない一般の皆様にも読んでいただけることとしています。
Androidに特化した専門用語等は使わず、ラフにつらつらとタイトルについて書いたつもりなので、気兼ねなくお読みいただけたら幸いです。

背景

よくあることかもしれませんが、通勤通学やお買い物などで少し街に向かい、様々な広告やディスプレイを目にする際、例えばオーナメントの配置やテクスチャの表現、配色や全体感や、そこから感じる世界観をつい気にしてしまいませんか?(え?気にしない?)

もう少し具体例を出すと、先述と同様に、普段の自宅等で寝そべりながら利用しているアプリも、トータルでこのアップデートは良いと感じたり、このアプリは使い勝手もよくなかったり、使いたいとも思えなかったり、手にしているスマホひとつでも思うことはあるのではないでしょうか?

そこで今回は、私のスマホアプリ(Android)開発技術者としての視点を加えて、普段考えている広義的なデザインからスマホアプリへ少し落とし込んだUI・デザインについて述べていきます。

アプリの良し悪し

まず「このアプリはダメだなー」と感じるシーン、とは何でしょうか?
バグの多い主機能?順当に考えて見た目?運営・運用?取り巻く社会的構図?
いろいろと考える、感じることはあると思いますが、いずれにしても問題になるのは「見た目」ではないでしょうか?

機能や運営、取り巻く社会的構図を含めてですが、アプリの良し悪しというのは(脳筋的発想と捉えて構いませんが)最終的に、ユーザーへの適切かつ快適な情報提示で決まるように私は感じています。

反対に「このアプリ・サービスは良いなぁ」と感じるシーンでは、既にユーザーへの適切な情報提示を行っていることを前提に、快適・愉快さを加えている気がします。

いずれにしても、学生時代も含めて約12年ほどスマホアプリ開発をしてきた中で印象に残っているアプリやサービスは機能だけでなく「見た目」にもこだわっていた、と感じています。

「見た目」と認知的負荷

まず認知的負荷とは何か、について深く言及すると余白があまりに少ないので割愛させていただきます(検索すると概要として参考になる記事がすぐに出てきます。例えばこちら)。

私の理解として、認知的負荷は瞬間的に見える情報の絶対量のことを指していると考えています。 例えば、「ダイヤモンドダストという現象」について調べ、ちょっとした記事にしたとします(今は冬の時期なので気象現象を例にしました)。

以下のどちらの方が理解しやすいでしょうか?

認知的負荷の高さを比較する図

左図はダイヤモンドダストについて確かに説明しているものの、配置や装飾が複雑で、何なのかがよく分かりにくいかと思います(伝えたいという気概はありますね!)。
右図はダイヤモンドダストについて説明していて、どういう現象なのかが順にみることができてすんなり読めるのではないでしょうか?

一概に「デザインを頑張った」としても、右図のようなシンプルなデザインに負けてしまうことはよくあるように思います。
このような左図の状態を、認知的負荷が高いと言うようです。

Androidの開発者観点からデザインを考える

認知的負荷という言葉が出始める前からそうですが、AndroidエンジニアやWebサービス開発に従事するデザイナーは、一般的に「アフォーダンス」と呼ぶものに呼応したデザインをあるべき姿だと漠然と捉えた上で設計開発を進めていると感じています(あくまで、データはなく、母数は数十程度の私の経験です)。

特に2010年代に流行ったフラットデザインや、リッチデザインなど色々なデザイン思想が流通した頃は、同時にアプリとしてどのようなデザインが最適かを日本、世界規模で模索していたようにも思います。

その中で、マテリアルデザインという思想はAndroidエンジニアに広く受け入れられた印象があります。今はマテリアルデザインの指針に沿っているかをベースにUIや、特にレイアウトに関して考えたり、気に掛けたりすることが多いと感じています。

具体的には以下に示すような観点で考えていると思います。

  • 情報整理
    • 余分で不要な表示はないか
    • 機能を十分担保するために必要なデータは揃っているか
    • 見せたい情報の優先順位は決まっているか、または適切か
  • レイアウト
    • 情報整理の見せたい情報の優先順位に準じているか
    • レイアウトのルールは統一されているか
      • 指針や設計に一貫性、合理性があるか
    • 適切・快適なレイアウトとなるような余白や情報を整理、明示できているか
  • UI
    • テキストやボタン、画像等のコンテンツの装飾は適切、快適な伝達となるような設計になっているか
      • コンセプトは明確か
      • 設計に一貫性や合理性があるか
    • ボトムシートやダイアログ、画面全体と、機能やユースケースに適するようなユーザーのインタラクションを阻害しない設計となっているか
    • エラー時の表示や、イレギュラーな状態の表現は快適か
      • UIでハンドリングするのか、ダイアログでハンドリングするのか、等正常でない場合の表現に難しさを感じないか

このような観点でAndroidエンジニアはアプリの「見た目」を考えているように思いますし、私はそう考えています。
その上で、マテリアルデザインの思想を踏まえて総合的に崩れがないかを確認しながら開発に勤しんでいると捉えています。

「何となくのデザイン」はダメ

以前、私はグラフィックデザインにおけるコンサル領域から入稿までをワンストップで行うことを主たる事業としている企業に所属していました。
その中での自分の主務は常駐委託業務だったため、主たる事業に直接関与はしていなかったものの、グラフィックデザインの教育に熱心な職場だったので、そこで基礎的な考え方を習得させてもらいました。

先述した情報整理やそれに見合ったレイアウトの考え方など、認知的負荷に伴うデザインは色々ありますが一番強く教えられて、印象に残っている言葉があります。

「『何となくデザインしました』は許さない」

何となくのデザインでもそれっぽく見せることはできるし、世の中の視覚的デザインの大半はセンスだけで成り立っていると正直に思っていました。
実際、本質は伝達なので、成り立てば正義です。手段は問わないはずです。

それでも、何となくのデザインを許さなかったのは「不確実性の排除」が意図として主にあったのだろうと思います。
経営上、下手なデザインはできなかったり、それによって受注の有無や失注につながってしまうことを防ぐことも意図の範疇にはあったと思いますが、何よりも本質である「伝達」につながりにくくなってしまうことが問題だったのだろうと解釈しています。

みなさんも、ただでさえロジック(根拠)を積み重ねたデザインが伝達につながるとは限らないのに、根拠なきデザインによる伝達は、たしかに難しそうに感じませんか?

なので、伝わりやすいデザインに根拠を見出し、あるいは根拠や理由を積み重ねてグラフィカルデザインをしていくことが必要だと私は考えています。

10年の経験

余談ですが、社会人になってからちょうど10年目で、節目と思い振り返ってみます。
この10年で私は、様々なプロジェクトの開発を通して、アプリのUI・レイアウトのデザインにおいて自力で解を出して提案して、必要と判断されたら通すようなことまで出来るようになったと自負しています。

とはいえ今は恵まれて、優秀なデザイナーさんに囲まれて過ごすことができています。
主務の設計・開発に専念できるのはありがたいことだと感謝しています。

この環境に安穏とせずに、特にデザインと認知の領域において学習とそのアウトプットをしていきたいと思います。
その中でよりよいデザインの提案や実装が出来ると楽しいだろうなぁと夢すら抱きました(夢は叶えていきたいですね)。

総括

最後までお読みいただきありがとうございました。

私個人として思うのは、適切な・最適なデザインは意外と難しくなく、こんな仰々しく記事にするほどでもなく、みなさんもスキルとしてお持ちになられているように感じます。
一方で、「快適な」デザインに関しては、内外問わず要因があってなかなか提案も実現もしにくいものとも感じています。

ただロジックを積み重ねるだけでなく、快適なデザインを推めるためには、納得してもらえるだけの創造性(できれば圧倒的なセンス)は必要かなと考えていて、私個人のクリエイターとしての側面をもっと伸ばしていきたいとも思いました。

また、快適さの先にある「面白さ」まで追求できたら最高だなぁ、と蛇足を添えて終わります。