当講座はUIUXの基礎講座です。
オリジナルのUI制作を行う上で必要な知識と技術を網羅的に身に付ける事を目的としています。
当講座を通じてUI制作に必要不可欠なPhotoshopの基本操作や応用操作を網羅的に身に付けましょう。
この記事の目次
Photoshopをメインに活用して作成した、学生さんによるUI作品の例です。
ゲームUIやポートフォリオ、ロゴ、バナー、WebサイトやスマホアプリのUIなど、UIに精通すると様々なクリエイティブに応用ができます。
UI制作はイラストの作画とは異なり、やや直感性に欠ける制作がメインなので好みが分かれます。
しかし自身の持つ世界観をより上質に表現できる可能性が高まるのでオススメのスキルですよ。
ポートフォリオはクリエイティブ業界への就活に必要不可欠なアイテムです。
せっかく絵が良くても、淡々と絵が掲載されただけのポートフォリオだと少し面白みに欠けますよね。
UI・UXの知識があれば構成・デザイン共に優れたポートフォリオを作れる可能性が高まります。
※学生さんによるポートフォリオの作例はコチラの記事で紹介しています。
YouTubeのサムネ画像、ラノベのロゴデザイン、テキストエフェクトを使ったロゴ、バナーデザイン等もUIデザインに含まれます。
UI制作に必要不可欠なPhotoshopについて学習していきましょう。
Photoshopの概要を理解し、簡単なフォトショ操作を行ってみましょう。
Photoshop講座のテキスト
Photoshopとは？
Photoshop（フォトショップ）で出来る事や他ソフトとの違いを理解しましょう。
各ソフトウェアには得手不得手が存在します。
効率的な制作を行う上でソフトの選定は非常に重要です。
Photoshopを導入しよう
Photoshopの腕を上げる最短の手段は「Photoshopを触りまくる」に尽きます。
よって自宅のPCにもPhotoshopを導入し、毎日Photoshop漬けにする事をオススメします。
触れば触るほど上達するので、学校でも自宅でもPhotoshopを触りまくりましょう！
オマケ：フォトショが超サクサク動く自作PCの組み方はコチラの記事で完全解説しています。
フォトプラン：月1,180円、年間14,080円（フォトショ単体なら断トツ最安値）
学割コンプリートプランならPhotoshopやIllustratorをはじめ、全てのAdobe製品が利用可能。
予算的に厳しい方はフォトプラン（20GB）が最もお得にPhotoshopが使えます。
必ずAdobe公式サイトから正規版を契約してから利用しましょう。
まずはブラシでお絵描きしよう
色変えをしてみよう
ぴーちゃんの色を変えてみましょう。
Photoshopなら非破壊で色変更が可能です。
押さえておくべき操作16選
Photoshop初心者の方が押さえておきたいフォトショ操作16選です。
非常に機能が多いソフトなので使用頻度の高い操作から効率よく覚えていきましょう！
予備素材
Photoshopのかんたん・便利なレタッチ機能をいくつか試してみましょう。
なぞってクリックするだけの簡単操作ですよ。
任意の不要な対象物を簡単に削除
お手軽な人物の切り抜きと色変更の方法
クリエイティブで人物の切り抜きはよく行います。
Photoshopの便利機能でサクッと切り抜いてパッと色替えしてみましょう。
UIとUXの違い、デザインの概念を解説した後はバナー制作を行いながらUI制作の基礎を学習します。
指定サイズのキャンバス内に画像や文字、アイコン等をレイアウトし、JPEG形式で書き出す一連の流れを身に付けましょう。
デザインの目的とは？
制作の前に少しデザインについて考えてみましょう。
デザインとは「対象物を装飾する事」と思われている方が多いでしょう。
間違いでは無いのですが、「単に装飾する」事は、必ずしもデザインに繋がるとは言い切れません。
デザインを行う目的と装飾が一致していないと単なる「意味の無い飾り」でしかありません。
「内容をわかりやすく伝える為の工夫」が結果として「デザイン」に繋がる、というイメージです。
同じ内容ですが、右側のように情報の優先順位を少し整理し、デザイン（内容を分かりやすくする為の処理）を少し施すだけで、伝えたい内容を「より」分かりやすくできます。
「相手にコンテンツ内容がより伝わるよう手を加える事」がデザインの本質と言えますね。
「ごちゃごちゃ装飾する ≠ デザインしている」、「シンプル ≠ デザインしていない」
バナーやWeb等のデザインだけでなく、キャラデザや様々なコンテンツ制作でも言える事ですね。
バナーを作成してみよう
Photoshopの基本機能を使ってバナー制作を行ってみましょう。
指定サイズのキャンバス作成、画像補正、変形、レイアウト、文字入力や装飾など。
フォトショップを使ったクリエイティブの基礎を網羅的に学習する事が目的です。
※Photoshopを未導入の方はフォトプラン公式サイト（月額は最安の1,180円）から入手しておきましょう。
文字を入力してみよう
文字入力に対して苦手意識を持たれている方は多いかもしれません。
しかしデザイン制作全般で文字は絶対に外せない要素の一つです。
そんなPhotoshopの文字入力に少し慣れていきましょう。
更にデザインの知識を増やしたい方にオススメの書籍です。
画像が多く、堅苦しくない内容で読みやすい本ばかり。
通学中の電車内で読むと有益な知識が身に付きますよ。
