良質のデザインを作り上げるためには、良質な参考デザインを見つけてそれを取り込むことが近道です。デザイナーはユーザー目線で考えることももちろん必要ですが、普段からデザイナー視点でも物事を見る癖がついていれば、いざ制作の時にスムーズに適切なアイデアを見つけられるようになります。刻々と変化するトレンドについていき、その先のトレンドを予測できるようになるためにも観察力を鍛えましょう！以下で私が普段お世話になっているサイトを紹介します。
追記: 教えていただいたサイトも追加しました。
デザインベンチマークの際に行うこと
- 1. 良質なデザインを見る
- 2. デザイン意図を深く読み取る
- 3. より良くするために自分ならどうするか考える
デザインの良し悪しを意識して考え続けることで、いつの間にか自然と良いデザインを見分ける力が身に付いていきます。また、もし自分が制作者だったらどのように作るかシミュレーションしてみるのも効果的です。
モバイルUIデザインの参考サイト
▼Dribbble
…言わずと知れた招待制の作品投稿SNS
https://dribbble.com/
▼UPLabs
…おもにアプリのUIで、ダウンロードできるものもあり
https://www.uplabs.com/
▼スマートフォンサイト デザイン集 AGT smartphone design gallery
…国内外のスマートフォンサイトまとめ
http://agtsmartphonedesign.com/
▼UI Movement
…動きも考慮されたUIコンポーネントまとめ
https://uimovement.com/
▼Give ‘n’ Go
…Dribbleのデザインとそれを元に作成されたCodePenのCSS作品が一緒に見れる
http://give-n-go.co/
Webデザインの参考サイト
▼AWWWARD
…海外のクオリティが高いサイトまとめ
http://www.awwwards.com/
▼One Page Love
…海外の1ページ完結WEBページまとめ
https://onepagelove.com/
▼MUUUUU.ORG
…縦長キャンペーンサイトまとめ
http://muuuuu.org/
▼I/O 3000
…サイト内でプレビューがあり閲覧しやすい
http://io3000.com/
▼S5-Style
…細かい検索機能やお気に入り機能あり
http://bm.s5-style.com/
▼Responsive Web Design JP
…PC、タブレット、SP のレイアウトが確認できる国内サイトまとめ
http://responsive-jp.com/
▼GRIDS
…グリッドガイドが引いてあるためレイアウトルールがわかる
http://grids.qoopu.net//
▼straightline bookmark
…レイアウトパターンで検索可能
http://bm.straightline.jp/
▼ズロック
…企画がおもしろいなどユニークなものが多め
http://www.zzrock.net/
▼Colorgorize
…気になる色から検索可
http://www.colorgorize.com/
▼WebDesignSample
…気軽に投稿もできる
http://webdesignsample.net/
▼DBCUT
…クオリティの高い韓国のサイトまとめ
http://www.dbcut.com/bbs/index.php
そのほかディズニーやフェリシモの特設ページ、WEB制作会社の制作実績などもキャンペーンページの参考になります。
ロゴ・アイコンデザイン参考サイト
▼LOGO Miner
…有名企業のロゴとそのフォントやカラーパレットまとめ
http://logominer.com/
▼ロゴストック
…コンセプト説明付き国内ロゴまとめ
http://logostock.jp/
▼LogoLog
…国内外のロゴまとめ
http://www.logolog.info/
▼フロップデザイン ロゴデザイン制作実績
…可読性の高いロゴデザインまとめ
http://www.flopdesign.com/logo/logodesign_sample.html
▼GLaim
…ゲーム系ロゴデザインまとめ
▼JAYPEG
…アイコン、ロゴ、WEB、グラフィックなど様々なデザインのアイデア探しに
https://jypg.net/collections
▼iconDrop
…iOSアプリアイコンまとめ
http://icondrop.net/
▼ファビコンギャラリー.com
…ファビコンまとめ
http://favicon-gallery.com/
フライヤーデザイン参考サイト
▼IMP Awards
…バナーやビジュアルの作り込みの参考
http://www.impawards.com/
▼優れた紙面デザイン 日本語編
…バナーのレイアウトやロゴの参考
http://matome.naver.jp/odai/2135391560813004001
まとめ
デザインスキル向上のために大切なことは、とにかくたくさんの良いデザインに触れることだと思います。
- 1. 数をこなす
→ とにかくやってみることから始める - 2. 見比べる
→ 善し悪しが分かってくる - 3. 意図を考える
→ 実際制作のときに活かせて身に付いていく
そして1つのデザインから多くの情報を読み取ることができるようになれば、ベンチマークがより効率的で有意義なものになります。
Leave a Reply