AIへのデザイン指示にも役立つ! デザイン・UI・UXを学べる便利サイト4選。

AIへのデザイン指示にも役立つ! デザイン・UI・UXを学べる便利サイト4選。

デザインのアイデア出しや画像生成など、デザイン業務にAIを活用する機会が増えてきました。
AIにデザインの指示を出すとき、「なんとなくこんな感じ」と伝えるよりも、デザインの特徴を表す言葉やUIの名称などを使って具体的に説明できると、よりイメージを伝えやすくなり便利になります。
そこで今回は、デザインの基本やUI・UX、配色などを学ぶ際に役立つWebサイトをご紹介します。

1. お役立ち知識:デザインの4原則|デザインパートナー

デザインパートナー「デザインの4原則」のページ画面

デザインの基本を改めて学びたいときにおすすめなのが、「デザインの4原則」について紹介しているこちらの記事です。

「近接」「整列」「反復」「対比」という、デザインの基本となる4つの原則について、具体例を交えながら解説されています。
普段Webサイトを制作していると、「なんとなくここは余白を空けたほうがよさそう」「この部分は目立たせたほうがよさそう」と感覚的に判断することがあります。
こうした感覚をデザインの原則として整理してみることで、自分のデザインを見直すきっかけにもなります。

デザインの基本を復習したい方はもちろん、これからデザインを学びたい方にもおすすめです。
また、デザインの基礎の書籍についても紹介されているので是非ご一読ください。

2. NameThatUI

NameThatUIのトップページ画面

「このUIの名前って何だろう?」と思ったことはありませんか?
そんなときに便利なのが「NameThatUI」です。
Webサイトに使われているUI要素やコンポーネントを、画像から探して名前を確認することができます。

例えば、普段何気なく使っているメニューやボタンなども、正式な名称を知ることで「この部分をこうしたい」と説明しやすくなります。
AIにデザインについて説明するときにも、UIの名前を知っていると役立ちそうです。
「見たことはあるけれど、名前がわからない」というUIを調べるときに活用してみてはいかがでしょうか。

3. AIでデザイン指示に役に立つ専門用語集

AIでデザイン指示に役に立つ専門用語集のページ画面

AIにデザインについて指示するとき、「もう少しおしゃれに」「今っぽい感じで」といった曖昧な表現だけでは、なかなか思った通りの結果にならないことがあります。
こちらの記事では、レイアウトやデザインのスタイル、トレンドなど、AIへのデザイン指示にも活用できる専門用語が紹介されています。
「こんな雰囲気のデザイン」というイメージを具体的な言葉に置き換えるときの参考になります。

知らなかったデザイン用語を知るきっかけにもなるので、AIを使うときだけでなく、デザインの引き出しを増やしたいときにも役立ちそうです。

4. Color Hunt

Color Huntのカラーパレット一覧画面

Webサイトのデザインを考えるとき、毎回悩むのが「色の組み合わせ」ではないでしょうか。
そんなときに参考になるのが「Color Hunt」です。
世界中のユーザーが投稿したカラーパレットを見ることができ、気に入った配色のカラーコードをコピーすることもできます。

「この色を使いたいけれど、組み合わせる色が決まらない」というときに、たくさんの配色例を眺めてみるだけでも参考になります。
人気のカラーパレットを見ることもできるので、最近の配色の傾向を知りたいときにも便利です。

まとめ

AIをデザインに活用する場合、AIに何をしてもらうかだけでなく、自分の考えているデザインを言葉で説明する力も大切になります。
今回ご紹介したサイトは、それぞれ違った角度からデザインの知識を身につけることができます。

AIを使う・使わないにかかわらず、デザインについて「知っていること」「説明できること」を少しずつ増やしていくと、日々の制作にも役立つのではないでしょうか。
「このデザインって何ていうのだろう?」と思ったときや、デザインの引き出しを増やしたいときに、ぜひ活用してみてください。
また、デザインについての書籍については下記の過去記事にて紹介させていただいているので、見ていただければと思います。