iOSアプリ UIデザイン初学者へ。

iOSアプリ作成を検討している人のための、UIデザイン備忘録です。
随時更新予定ですが、なるべく余計なことは書かない方針です。

1. HIG（Human Interface Guidlines）を読む

Themes - iOS - Human Interface Guidelines - Apple Developer

すべてはここから！でもその前に一つだけ触れておく
UIという言葉でくくるとデジタルの為の新しい知識のように感じるが、実際は正しいシグニファイアとアフォーダンスを意識しましょうということ。つまりはデザインの基礎がしっかりしてれば盤石です。
とはいえ勉強と知識の更新も大切。
Apple iOSは更新されるたびにより以前より自然なUIを検討しているので、特にiOSがアップデートされた際には、Apple純正のアプリの挙動の変化を確かめてほしい！iOS13からは画面遷移を途中で止められるようになったり、モーダルを使うことで半歩だけ進む表現を駆使するようになった。iOS14は今のところアプリの中身にはそこまで影響はないようだ。

2. WEBから情報を集める

回遊した中でも納得感のあるものを紹介する。
多くは、こうするとよいというポジティブなガイドではなく、こうしない方が良いという反証のほうが参考になる。

【守ってはいけない、iOSのデザインルール4つ】

・ページのカルーセルを示すドットは避けるor目立たせる
カルーセルについては、「カルーセルのUIは売り上げにつながるのか!? カルーセルデザインを考えるときに知っておきたい7つのこと」の記事を参考にされたい。筆者としてはできるだけカルーセルは避けるのが吉だと判断している。

・送信、確定、決定などのボタンをヘッダーに置かない
経験上一番下までスクロールしないと送信や確定ボタンが出ないUIもなかなかのBAD UIだと考えているが、右上にコンバージョンボタンがあるのは間違いなく迷うので絶対に避けたい。
実装が手間だとしても、下部にスティッキーに表示するorキーボードの確定ボタン自体が次の行動に紐づいているようにしたい。

・＋アイコンは次の挙動が想定できないので使わない
記号論の中でも、記号は直観的にわかりやすいが確実性が低く、文字は確実性は高いが直観的にはわかりづらいため、どちらが良いという結論はなく、確実に言えることは記号と文字の両方が示されているときが最も直観的で確実性が高いといわれている。これもシグニファイアへの理解があれば迷うことは少ないだろう。

・並べかえアイコンはわかりづらいうえ、ハンバーガーメニューにも似てるからできれば使わないで
これも＋アイコンと同じ理由だ。

守ってはいけない、iOSのデザインルール4つ

3. 本を買う。本を読む

筆者は基本的にオライリー信者なので「よくわかるUI!」のような本は買わない。必要十分であれば何でもいいが、あえて下記のほんを買わない理由もないだろう。

マイクロインタラクション
特にUIデザイナーフロントエンジニアには読んでもらいたい。普段触っているアプリのマイクロインタラクションを左脳で理解できる。

モバイルデザインパターン
困ったときの逆引き辞書的役割。後半の細かいところでかなり参考になった。

デザイニングインターフェース
UIの基礎なので初学者、学生にはおすすめ。ある程度数をやったことがある人はそもそもこれらの本よりも経験から類推できる範囲のほうが多いかもしれない。ただし、どの本もよくまとまっている。

UI GRAPHICS
前半のコラムのフルードレイアウトについては非常に端的な考察がされているので、一見の価値あり。後半は抽象化のされていない事例集の為、役に立つかは読み手次第。アーカイブ集としては面白い。

UIデザインの面白さと、所感。

スマートフォンUIの世界は紙物グラフィックデザインに比べて自由な表現よりも、いかに学習コストを減らすこと、ユーザーの無意識に働きかける設計が求められる。
これは、ブックデザインの本文組版や、深澤直人のwithout thought、建築的都市計画にも似ていると思った。

筆者が普段、広告認知と記憶に働きかけるビジネスコミュニケーションのために使う思考回路とは90°くらい異なり、UI設計とは、なめらかな凪のように細部の検討を100万回改善していく旅のようだ。（ポエム）

※この記事は随時更新されます。

以上。

タクトヤマグチ