Agile育成ブログ
未来を変える喜びを
デザイン

デザイン


Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490

UI/UXのデザイン

画面で操作することを考慮しタップエリアを適切にとることが大事

デザインのコツ

  1. そろえる

そろえる

要素を揃えて配置することでスッキリと見やすくて、分かりやすいデザインにすることができます

強弱を付ける

大事なことを伝えるためには「情報に強弱をつける」ことが効果的です

情報をグループ化する

関連性の高い要素をまとめて配置するようにするとパット見でも理解しやすくなります

同じ見せ方で統一感を出す

同じ役割を果たす要素は基本的に同じ見た目にすることで全体の統一感をつくることができます

テキストの行間と字間を調節する

文章は読みやすくするために行間と字間にゆとりをもたせるようにしましょう

見やすい色の組み合わせにする

異なる色同士の色相・明度・彩度の対比によってコントラストを高め、見やすいデザインになります。

Adobe Photoshop

写真などの補正や合成などラスターデータに強いアプリケーションです。

Adobe illustrator

ロゴやイラストなどベクターデータの作成、チラシなどのレイアウトに強いです。

Pintarest

CLIP STUDIO PAINT

No.1のシェアのペイントアプリであるCLIP STUDIO PAINT

解像度

Appleやmac、iphoneで使用されているRetinaディスプレイでは2倍の解像度を中心に作られている

%で指定することによって可変サイズに対応できる。

ユーザーの視線

Webサイトの出発点は左上のサイトロゴから始まります。
ユーザーが指定したサイトであることの確認を無意識的に行っているからです。

画面の左から右、上から下に視線は動きます。

You cannot copy content of this page