| keyword ナチュラル ［類義語］自然、素朴、手づくり point ■手描きイラストを使ったアイコン ■自然素材をイメージしたテクスチャ |
ナチュラルを表現するには、アナログな要素を積極的に盛り込んだデザインが有効だ。手描きのイラストをスキャニングしてアイコンに利用したり、リネンなどの自然素材をイメージしたテクスチャを使って、アナログなテイストのデザインに仕上げてみよう。また、ホワイトスペースを多めに取った余裕のあるレイアウトと、濃い色を抑えた淡いトーンのカラーリングで、素朴な雰囲気を強調するのもポイントだ。
制作・文＝高橋としゆき（Graphic Arts Unit）
■Design Parts／デザインパーツ
ロットリングやダーマトグラフなどで紙にイラストを描き、それをスキャンしてアイコンに利用する。Illustratorなどのシャープなラインのイラストと違い、素朴な柔らかさを表現できる。テクスチャに合成する場合は、Photoshopでテクスチャの上にイラストのレイヤーを重ね、レイヤースタイル→“レイヤー効果”を選び、［描画モード：乗算］で合成しよう。
［その他のデザイン］
スタンプやクレヨンで描いたようなテイストもおもしろい
■Layout／レイアウト
情報を詰め込むレイアウトとは異なり、要素同士のマージンやホワイトスペースを多く設定することで、レイアウトにゆとりが生まれる。このように、罫線の使用をできるだけ控え、余白の取り方で要素の境界を表現することも、ナチュラルなテイストを表現するうえでは有効なテクニックだ。
■Texture／テクスチャ
ベタ面を単色で仕上げるのもひとつの方法だが、ナチュラルを感じるテクスチャを合成すると、よりアナログな雰囲気を強調できる。今回はPhotoshopでレイヤースタイル→“パターンオーバーレイ”を選択し、ベージュのベタ面に「デニム」のパターンを［描画モード：ビビッドライト］で合成。リネンをイメージしたテクスチャを作成した。
［その他のデザイン］
■Example／実例
杉並区高円寺のカフェアパートメント【cafe apartment】
cafeapartment.com/
手描きイラストとテクスチャでナチュラルな感じをうまく表現している。
■Application／応用
アナログなパーツやテクスチャを生かしながら、カラフルでキュートな要素を加えた例。色を多く使うことで素朴な印象が弱くなるため、基本的なカラーリングは、パステルトーンからペールトーンを中心とした優しい色づかいを心がけよう。
■Color map／配色
ベージュや緑などを中心に穏やかな色味でまとめる
| #669966 | #cc9966 | #cccc99 | abc | #cc9966 | #cccc99 | #83b741 | abc | #cccc99 | #666633 | #669966 |
| #669966 | #CC9966 | #CCCC99 | #CC9966 | #CCCC99 | #83B741* | #CCCC99 | #666633 | #669966 |
キーワード1 「上品」
キーワード2 「健康」
キーワード3 「ナチュラル」
キーワード4 「インダストリアル」
