NOTds1ヶ月目の学習記録

私は9月の1か月間、デザインの基礎を集中的に学び直しました。
受講したのは「NOTdsカリキュラム Webデザイン基礎」。毎朝の学習時間に合わせ、ひとつひとつ課題をこなしながら、知識だけでなく「実際に手を動かしてデザインを作る力」を身につけることを目指しました。

取り組んだ主な内容は以下の通りです。

• 言語化ワークショップ（毎日継続）

• フォントを知る・使う

• 色を知る・使う

• 形を知る・使う

• 余白を知る・使う

• デザイン史から“自分の好き”を探る

• バナー制作

• LP模写

言語化ワークショップ

毎日続けた「言語化ワークショップ」は、自分が好きなバナーや広告を選び、そのデザインを言葉で説明する訓練です。
最初の質問では「そのデザインを選んだ理由」を素直に感情ベースで書き出します。次に「その感情がどのデザイン要素に起因しているか」を整理し、最後に「なぜその要素がその感情を引き出すのか」を考えます。

色やフォントが与える効果をこうして言語化することで、デザインを感覚ではなく論理で説明できるようになりました。例えば「大人っぽい落ち着いたデザインを作りたい」と思った時に「青系統や明朝体が合うけれど、高級感が出過ぎるかもしれないからゴシック体にしようか」といった具体的な判断ができるようになってきました。

フォントを知る・使う

フォントの演習では、装飾を使わずフォントのみで「上品・クラシック」「若々しい・カジュアル」「モダン・洗練」「エッジィ・個性的」など、さまざまなスタイルを作りました。

ここで初めて知ったのは、和文フォントと欧文フォントの違いです。恥ずかしながら、私は欧文専用のフォントを日本語に使っていました。和文対応していないフォントの場合、Web上では別のフォントに置き換えられてしまうことがあるのです。

フィードバック前のデザイン

フィードバック後のデザイン

色を知る・使う

フォント演習で作ったデザインをベースに、色だけを変えて「高級感」「ナチュラルで優しい」「ポップで明るい」「知的でスマート」など複数のパターンを作成しました。

この時に学んだのは、グラデーションの扱い方です。グラデーションは簡単に高級感や立体感を演出できますが、多用すると逆に安っぽく見えてしまいます。最初のうちはベタ塗りで色を表現し、色そのものの力で印象を作ることが重要だと分かりました。

フィードバック前のデザイン

フィードバック後のデザイン

形を知る・使う

「形」演習では、丸や四角といった基本形だけを使って「ワクワク」「安心」「不安」「怒り」など感情を表現しました。特に「怒り」の表現が難しく、参考事例を集めて自分なりに試行錯誤しました。

その過程で、デザインは非常に自由であること、そして参考を集めることで自分のイメージを具体化できることに気づきました。

集めてきた参考画像たち

フィードバック前のデザイン

フィードバック後のデザイン

余白を知る・使う

余白演習では、固定された素材を使いながら、ゆったりとした余白感を持たせたデザインを作りました。ここでの学びは「余白はできるものではなく、配置するもの」という考え方です。余白を意識的に設計することで、全体の見やすさや印象が大きく変わることを体感しました。

フィードバック前のデザイン

フィードバック後のデザイン

デザイン史から“自分の好き”を探る

歴史あるデザインを調べ、自分の好きな作品やスタイルを見つけて分析しました。私は「メンフィス（Memphis）」という1981年に結成された多国籍からなるデザイナー集団の作品が好きだと気づきました。独創的でありながら機能美も追求され、遊び心が散りばめられているデザイン。

そのような作品には基礎力がしっかりあることを直感的に感じ、「遊んでいるのに本質は崩れていないデザインを自分も作りたい」という夢が生まれました。

惹かれた理由：ポップな色とどこか遊び心のある形に惹かれました。
サイトもとても印象的で多彩な色と遊びがありながら、統一感もあり美しさを感じるデザイン

好きなポイント：当時のデザインが欠いていたユーモアのセンスや人間の内的な力の権威を回復しようという何かデザインで問題解決をするぞ！という姿勢が好き
自分たちの好きなものを形にして世に提供しているエゴが好き

気付いたこと：スタイリッシュで幻想的なデザインが好きだと思っていましたが、いざ並べてみてみると、多彩な色や遊びのある、どこかワクワクするようなデザインが好きなんだということに気づきました。
幼少期から海外の絵本作家さんの影響を受け、人と違う感性があるという自覚はありましたが、今回改めて、自分の感性の根源を再認識できた気がします。

バナー制作

バナー制作では、30〜50代男性向けの「良い匂いにする商品」バナーを設計しました。上流工程から「解決したい課題・商品の売りポイント・キャッチコピー・サブコピー・商品名」まで設定し、画像はWhiskという画像生成ツールを使って制作しました。

この課題で学んだのは「進め方の重要性」です。ターゲット設定 → 要素選出 → グループ化 → 優先順位決定 → 構図決定 → 色・バランス調整 → 完成、という手順を踏むことでスムーズにデザインできると実感しました。

3回のフィードバックを受け、なんとか合格しましたが、単に「合格する」ことを目標にすると時間がかかります。「このバナーで集客する」というゴールを設定することで、アドバイス＋自分のやりたいことを融合でき、結果的に質の高いバナーになると感じました。

初回のバナー

フィードバック後のバナー

LP模写

LP（ランディングページ）模写では、コーポレートサイトを模写しました。アニメーションの取得が難しかったり、line-heightがバラバラになったりと再現には苦戦しましたが、大切なのは「要素の意味や配置の意味」を考えることでした。

「ボタンにグラデーションがあるのはなぜ？」「この形状はどんな意図？」と分析することでLP制作の引き出しが増えました。しかし、世の中のWebサイトには特に意図せず採用されているデザインもあるとアドバイスをもらい、思い込みに注意する必要性も学びました。

この時に作った分析ノート

まとめ

この1か月間で、私はデザインを「感覚で作る」から「論理を持って作る」へと一歩進めました。言語化ワークショップ、フォント・色・形・余白の演習、歴史からのインプット、バナー制作、LP模写と、多角的に学ぶことで自分の弱点や好きなスタイルが見えてきました。

これからも基礎力を磨きながら、自分らしいデザインを作り続けていきたいと思います。