見出し画像

知識ゼロのためのUIデザイン学習ロードマップ

Yusui Hoshino

知識ゼロの人が「とりあえずUIデザイナーにならないと死ぬ！何すればいんだぁああ？」って突撃してきた時に渡すための文章。
初歩的なことしか書いていないが、だからこそ1人だけでも進められ、無駄にならない内容が多いと思う。

  • 対象者：UIデザイナー知識ゼロ

  • 必要なもの：PC、3235円

  • ※以下の内容について

    • 「（）」はオプションです。上の必要なお金には含まれていません

    • 「1day」などで表される必要時間は、1日丸々使った場合の想定です

    • マインドややり方よりも、具体的に何をすればいいか？どんな知識が必要かを中心に書きました


UIデザインについて知る 2day

  • 100円出して、以下の本を読む


デザインの基本を知る 1day

  • デザイン4原則

  • フォント

    • 和文：ゴシック体、明朝体

    • 欧文：セリフ体、サンセリフ体

  • 色：RGB, CMY, HSB, PCCS

  • 画像：jpeg, png, svg

ツールをマスター 1.5month

  • Figma

    • 全機能を理解する

    • 例えば、以下をちゃんと使いこなせるようになる

      • Auto Layout

      • Style

      • Component

      • Variants

      • Prototype

    • 学習方法

      • chot.desgin

      • YouTube動画（詳しいところは解説されていない）

      • ボタンを全部Googleで検索する（英語の方がいい記事が出てくる）

      • （本。おそらく現状は以下の一冊しかまともなFigmaの解説本はない）

  • （ちゃんとしたロゴやポスターが作りたい人はIllustrator）

  • Miro

    • 下のシリーズの動画を二、三本見ればOK


UIデザインを作ってみる 1month

ガイドラインを読む 3day

  • Google Material Desgin

    • Desgin, Component, Resourcesを読む

    • （下の動画をはじめに見ておくと理解しやすいかもしれない）


UXの知識を得る 2day

  • UX, CX, サービスデザイン

  • UXライティング

  • （UIの心理学的な法則が載っている Laws of UX）

  • 『UXデザインの教科書』を読む

  • フレームワークを学ぶ

    • カスタマージャーニーマップ

    • ペルソナ

    • マンダラート

    • ストーリーボード

    • バリューポジションキャンバス

    • ビジネスモデルキャンバス

    • リーンキャンバス

    • …

    • （下のような本を一冊読むと安心）


UIデザインの例を知る 1day

（その他）

  • UIデザインについての記事をたくさん読んでみる

    • おすすめ記事

  • UIデザインのスタイルについて調べる

    • フラットデザイン

    • ニューモーフィズム

    • グラスモーフィズム

    • クレイモーフィズム

    • …

  • インプット

    • Twitterで好きなデザイナーをフォロー

    • noteを読みまくる

    • QiitaにもFigmaの知識は結構ある

  • デザインの歴史

    • このシリーズを全部見る

  • 西洋芸術の歴史

    • このシリーズを全部見る


  • おすすめの本


Adobe税を払うために使わせていただきます