23handdrawnweb

Photoshop VIPで以前ウェブトレンドを分かりやすくまとめた記事「知っていそうで知らない、トップウェブデザイナーになる為の20の方法」を紹介しました。

その5番目で取り上げていたトレンドのひとつ、「手書き風デザイン」。

カジュアルでポップな雰囲気のウェブサイトをデザインすることができます。

今回は、そんな「手書き風デザイン」が実際どの様に使われているのかをまとめた「Great Examples of Hand Drawn Elements in Web Design」という記事があったのでご紹介します。

参照サイトには全部で23種類の「手書き風デザイン」を使用したホームページが掲載されています。

その中でも特に参考になったものをいくつかピックアップしてご紹介したいと思います。

 

詳細は以下から。

 

Yellow Bird Project

かわいい鳥と手書きフォントの組み合わせがいいですね。

黄色がよいアクセントになっています。

Hand Drawn Web Design

Hand Drawn Web Design

 

Mark Forrester

ヘッダー部分を手書き風デザインにすることで、ホームページ全体が親しみやすい雰囲気を受けます。

Hand Drawn Web Design

Hand Drawn Web Design

 

camellie

淡い背景色にモノクロのデザイン画はとてもアーティスティックな雰囲気のホームページを作り上げます。

Hand Drawn Web Design

Hand Drawn Web Design

 

Red Velvet Art

カラフルな色を多用することで、ポップなデザイが完成です。

女の子受けがよさそうな、写真サイトです。

Hand Drawn Web Design

Hand Drawn Web Design

 

The Idiotic Adventures of Philippe and Pierre

ホームページ全てを手書き風デザインで仕上げています。

子供にも人気が出そうな、簡単ウェブサイトがよいです。

Hand Drawn Web Design

Hand Drawn Web Design

 

Matt

ビビットなピンクがアクセントになったかわいいサイト。

コミカルでストリート感たっぷりなデザインが好印象です。

Hand Drawn Web Design

Hand Drawn Web Design

 

Boompa

ウェブトレンドのもうひとつ「ウォーターカラー(絵の具風)デザイン」と組み合わせた場合。

オリジナル性の高いウェブサイトに仕上がっています。

Hand Drawn Web Design

Hand Drawn Web Design

 

Esteban Muñoz

モノクロで「手書き風デザイン」を使用することによって、アート性の高いウェブサイトを作り上げることができます。

Hand Drawn Web Design

Hand Drawn Web Design

 

Washtenaw Community College

企業サイトなどにおいても、「手書き風デザイン」にすることで親しみやすいウェブサイトへと変身します。

会員登録などもシンプルでいいですね。

Hand Drawn Web Design

Hand Drawn Web Design

 

J.A. Mathius

アニメーションキャラクターを「手書き風デザイン」を使って描いています。

一度訪れたら忘れないでしょうね、こういうデザインは。

Hand Drawn Web Design

Hand Drawn Web Design

 

いざ自分がデザインしてみようと思うとなかなか難しいものです。

このような分かりやすい具体例を集めた記事なんかはこれからもデザインの参考として取り上げていこうと思います。

参照元サイトにはこれら以外にも、たくさんの具体例が掲載されています。

よかったらあせて、どうぞ。

 

[参照元 : Great Examples of Hand Drawn Elements in Web Design - Web Design Ledger]

Bookmark, Maybe??この記事のブックマークはこちらからどうぞ。