どうも、トレンディです。
今回はこんな悩みについて、知見や経験をもとに記事を書いていきます。
初心者のWebデザイナーは、「機能美」を意識すると良いデザインが作れます。
「形態は機能に従う」の意味、機能美の大切さ、Webデザインの上達法を初心者向けに解説しています。初心者デザイナー・これからWebデザイナーを目指す人は必見です。
本記事の概要
- 「形態は機能に従う」の意味
- デザインを上達させる方法
本記事の信頼性
- 職業：フリーランスブロガー・Webデザイナー
- 経歴：Web業界10年目・30代未経験で異業種への転職成功（広告代理店・通販会社経験）
- 実績：会社員時代に複数のSEOメディアを立ち上げ・運営(月間30万PV以上)・収益化
話題の副業
今大注目されている「生成AIデザイナー」
生成AIは需要が高く高単価です。
パソコン1台あれば自宅にいても作業できます。時間がない人にも適してます。
「副業初心者さん」「売上が伸び悩んでいるWebデザイナーさん」にも大人気の副業です。気になる方は、下記のページを読んでみてください。
ほかの人気教材
コードスキル【パパッと効率化！】コーディング効率化講座 ~CSS設計編~
Webデザイン現役Webデザイナーが教える「デザトレ-独学コース-」
本記事を最後まで読めば、「機能するデザイン」を作れるようになります。
「形態は機能に従う」とは
デザイン業界には「形態は機能に従う(form follows function)」という有名な言葉があります。
これはアメリカの三大巨匠の1人である建築家ルイス・サリヴァンが残した言葉で、
デザインの美しさは、機能性から来る
という意味です。
「機能美」ともいわれます。
Appleの創業者である故スティーブ・ジョブズもこの哲学に深く影響を受けており、世界的に大ヒットとなったiPhoneプロダクトデザインにも反映されています。
本当にいいデザインとは、見た目だけでなく機能性があること。
たとえば、デザインに「操作性が向上したり」「興味を持ったり」「買いたくなってしまったり」「愛用したくなる」ような機能性があると美しいデザインになるというのです。
Webデザインであれば、「つい購入ボタンを押したくなる」「つい読み進めたくなる」「つい使ってみたくなる」ようなデザインが、機能するデザインになります。
ですので、「機能美」を意識すれば、多くの人に影響を与え、売上などの成果に貢献できるデザインを作り出すことができます。
良いデザインを作るために必要なこと
より良いデザインを目指すためには、「機能美」を意識しながら次の考え方が必要です。
- 「シンプル」の使い分け
- 人に興味を持たせる
- 人を行動させる
「シンプル」の使い分け
「シンプル・イズ・ベスト」という言葉を知ってる！という方も多いかと思います。
シンプルな表現は、わかりやすく時代や流行にも左右されないので、万人に受け入れられやすい反面、デザインが単調になるおそれがあります。
ただデザインが綺麗で終わってしまってはいけないのです。
良いデザインにするには、目立たせたい部分を色や大きさで強調し、視線の誘導を取り入れる必要があります。
デザインの要素を足し算と引き算で考えてみることも大事です。
これはごちゃごちゃ感が出てしまったときに特に有効で、視認性や機能を優先するからこの要素は思いきって削除！といった判断が「良いデザイン」につながることもあります。
人に興味を持たせる
良いデザインは、感情に訴えかけてきたり面白さがあるので、人は興味を持ちます。
たとえば、、スーパーのチラシが白黒だけのデザインだったらどうでしょうか？
多くの人は「安い」「この食材おいしそう」とは思わないはずです。
しかし、新聞で派手なチラシが多い中、１枚だけ白黒のチラシがあったら目立ちます。人の目を引かせることが出来るかもしれません。
それを狙うのであれば白黒デザインは機能するので良いデザインといえるのです。
このように目的を何にするかで「機能美」の意味は変わってきます。
人を行動させる
Webデザインでは、「人を行動させる」工夫が必要です。
目的と役割がなければ、それはほとんどが機能しない「悪いデザイン」となってしまいます。
人にアクションを促すデザインにすることで、良いデザインを作り出すことができます。
Webデザインが上達する勉強法
私が実践して本当に良かったと思える「Webデザインが上達する勉強法」を３つ紹介します。
- 広告を違う視点で見る
- デザイン本を読む
- デザインを実践する
順番に解説していきます。
特に独学でWebデザインを学んでいる人は、自分の悪い癖になかなか気づきづらい環境かと思いますので、プロの作品から学ぶことをおすすめします。
広告を違う視点で見る
「Webデザインを早く上手くなりたい！」という人は、身近なところにあるプロのデザインからも学ぶことが大事です。
具体例をあげると、次のようなものがあります。
- インターネット広告
- 屋外看板
- 電車広告
- 新聞広告
- 商品パッケージ
- 店内POP・ポスター
- 書籍カバー
- ゲームアプリ
他にもたくさんありますが、世の中で見かけるデザインには、目的と役割が明確な良デザインがあふれています。
普段はボーっと眺めている身近な広告でも「いつもと違うデザイン視点」で見ると感性が磨かれます。
- 「この図形ってどうやって作ったんだろう？」
- 「なぜこの配色にしたんだろう？」
- 「どうしてこの部分は目立たせているんだろう？」
など考えながらマーケティングやデザイン視点で見ると、学べることが多いことに気づきます。
身近に存在する広告の多くは、プロのマーケッターやデザイナーが関わっているので、理論に基づいたデザインを体系的に学べます。
デザイン本を読む
デザインを上達させたいなら、読書も有効です。
専門書から学べることも多くあります。
ここでは割愛しますが、有名な本があるので自己投資のつもりで読んでみるのもありです。
デザインの原則を学ぶとベースづくりも優れたデザインになります。
-
【デザイン編】初心者ウェブデザイナーが参考にしたい厳選本6冊〈感性を磨く〉
続きを見る
デザインを実践する
実践は、最高の上達法です。
作りたいものを実際に作ってみることで、効率的にデザインの理解が深まります。
参考のデザインを真似て作ってみると、Webデザインの上達は確実に早くなります。
Webデザインならトレース。
コーディング・プログラミングだと写経です。
デザイン業界には、TTP(徹底的にパクる)という言葉があるくらいなので、結果を出すなら真似ることも意識してみてください。
ただし、パクったものを商用や作品として使うのは絶対にNG。それでは単なるコピーになってしまいます。
トレースや写経を実践するなら、あくまでテクニックや表現を学ぶことを目的にしてください。
またトレースや写経のデメリットは、デザイン思考が育たなくなることです。
応用的なデザイン力は身につきませんので、トレースや写経からいかに早く抜け出すかがデザイン上達のカギです。
まとめ
私が初心者デザイナーの頃は、悪い癖がありました。
「自分で好き勝手にデザインしたほうが、オリジナルがあっていい！」なんて判断していましたが完全に間違っていました。
オシャレやカッコイイ、面白いだけでは、自己満足で終わってしまいます。
まとめると、次のようになります。
- デザインは綺麗なだけではダメ
- 機能しないとダメ
- 売れないとダメ
- 反響がないとダメ
もし自分の作ったデザインが、人から評価されないなら「形態は機能に従う」の哲学を取り入れると課題を解決できることが多いです。
デザイナーは学ぶことはたくさんありますが、「機能美」を意識しながら学習すれば必ずWebデザインが上達します。
初心者デザイナーの方の参考になれば幸いです。
今回は以上です。
