1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

デザインのコンセプトを詰める練習!その2

1
Last updated at Posted at 2026-08-30

コンセプトからビジュアルを考えてみる

先月から、表現面のデザイン練習を始めてみました。
ラフを作っていたので、今回はイラレを用いて、もう少し具体的に表現してみました:art:

実際に出来たものと、デザインの理由

メモアプリの機能は最小限で、デザインだけで雰囲気や印象を変える練習です。
(あくまでもビジュアル表現の練習なので、自由に遊び強めで作ってみました!)

そして、今回は、
今までのキャリアを活かして新しい一歩を踏み出そうとする人に向けて。準備を整えながら飛躍しよう!
というコンセプトでした。出来たものはこれ(ラフ含めて3時間くらいかなぁ)。

コンセプト練習.png

(『Illustrator&Photoshop デザインの作り方 アイデア図鑑』
写真は、上記参考書の素材を使わせていただきました。)

先月も書きましたが、ポイントとして、以下を取り入れました。

  • 落ち着き〜挑戦への移行が滑らか。グラデーションでそれを表したい。
  • 落ち着いたパターン、安定なので、チェックパターンを取り入れたい。
  • チェックパターンの安定から、線をはみ出させて、安定からの飛躍を表現してみたい。

これを、今現在の自分でできるイラレのスキル範囲内で表現してみました。
イラレを本格的に触ったのは3ヶ月前くらいでした。そこから今までで悟ったことは、難しすぎる表現に憧れて、すぐ手を出そうとしないこと、まずは基礎!これでした。なので、今はまだきちんと基礎を積みたいと考えています。
・・・話が逸れましたが、デザインを言語化して、頭の中を整理します。

上記のコンセプトで作っていると、だんだん宇宙感ある表現になっていきました。なぜだろうと考えましたが、まず、宇宙に行くのは、とても準備が必要ですよね。
なので、入念な準備をして、飛躍するモチーフとして宇宙飛行士を無意識に採用していたんだなと思います。

細部を言語化してみる

自分はどうして、こういうデザインにしたんだろう、というところを言語化してみます。これも練習。(デザインにしろ、なんにしろ、理由を説明できるようにするのは大事)

配色の理由は以下です。
▶︎配色の理由

テキストボックスのデザインの理由:追加と削除ボタンは、月をイメージして丸い形。青い線を引くことで、枠が強調し、しっかりした印象を出そうとしました。
image.png

文字効果の理由:オレンジの円のワンポイントを置き、視線を引くようにしました。覆い焼きカラーを効果に設定して、光っているように見せたいと考えました。また、ガウスを使うことで浮き出させ、宇宙のような浮遊感(飛躍直前のイメージ)を出しています。
image.png

ビルの写真、斜線の理由:このメモを使う人は本当に宇宙に行くのではなく:sweat_smile:笑、目指すべきは次の会社です!なので、新たに進むべき目標として、新たな会社を連想させるビル群を用いました。そして、左下から右上にかけて斜めに、線をグラデーションで付けることで、目標に向かっていく様子を表現しています。
image.png

右下部分の理由:月、右下は、ゴールのイメージです。目指すべき場所として、左上にいる宇宙飛行士(ユーザー)が月というゴールを目指してほしいという設計にしています。色も、左上〜右下にかけて、グラデーションで現在地〜ゴールまでを表現しています。
image.png

練習を終えて

一旦、1つ目の練習は終わりました!デザインの詳細を自分で言語化することで、自分のデザイン思考の過程の再認識と振り返りにもなりました。
イラレが基礎スキルなので、基礎を固めて、もっと表現を増やしたいです。
また、Photoshopも使えるように頑張ります:point_up:

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?