今回はWEBデザインの参考になるサイトをまとめました。
KafyBlogは正直デザイン的にはまだまだ発展途上ですが、実は私はこれでも現役でディレクターをやっておりまして、仕事上でもよく使用するギャラリーサイトを厳選しましたので紹介します。
ギャラリーサイト
MUUUUU.ORG
圧倒的に一番使用率が高いです。
サイトのファーストビューがサムネイルとして並んでおり、直感的にとても見やすいです。
また、サイドバーのカテゴリから細かくフォルタリングが出来るため、コーポレートサイトを探したり、アパレルや食品系のサイトを探したりなどこのサイトがあればある程度見ることが出来ます。そしてデザイン的にもかなり優れたサイトのみで厳選されているため、どれも参考になります。
81-web.com
こちらもMUUUUUと同じようなクオリティのため、使用頻度が高いです。
基本、MUUUUと81を見れば大抵良いサイトが見つかります。
I/O 3000
81と同様に使用しています。参考サイト収集は質と量が求められるため、こちらもチェックしています。
WebDesignClip
こちらもI/O 3000と同様に使用。
SANKOU!
ここもMUUUUUや81とレイアウトは同じですが、上記サイトとは若干選び方のセンスがまた異なっており、珍しいサイトも選ばれたりしています。そのため、MUUUUUや81にはない掘り出し物のようなレアなサイトもたまにあります。ちなみに制作したサイトが掲載されたこともあるので個人的に愛着があります。
S5-Style
個人的に最近見る頻度が上がってきているサイトです。
SANKOU!と同様に珍しいサイトも多いです。例えば「IDOLY PRIDE」ティザーサイトとかなかなかお目にかかれないです。
bookma!
UIが好きでよく使用しています。
PCだけでなく、SPのファーストビューも大きく表示されている点が上記の２サイトとの違いです。ピックされているサイトのクオリティがどれも高く好きですが、一つだけ欲をいうともう少し更新頻度が高くなるととても有り難いです…
AWWWARDS
海外のギャラリーサイトです。世界中のハイレベルなサイトが掲載されています。
個人的には、日本のサイトを制作する機会が圧倒的に多いので、日本のギャラリーサイトを見ることが多いですが、日本にはないUIやデザインを見てみたいという時は海外のサイトをチェックすることもいいと思います。
制作会社の制作実績
ギャラリーサイトではないですが、
制作会社のWORK（制作実績）ページも参考によく見ています。
クオリティにムラがないため、あるカテゴリに拘らずバランスよく探したいときなどはオススメです。あとは難しい話だと、コンポーネント設計とかが共通で使われていたりしていて、参考になります。
LIG WORK
株式会社LIGの制作実績サイトです。
まず実績サイトの段階で既にデザインのクオリティが高いですが、実績一つ一つもかなりハイレベルです。このクオリティのサイトを作れる制作会社はなかなか少ないので、細部まで参考になります。
（WEBディレクターが主役のドラマ「私定時で帰ります」でHANABIが映った時は感動しました。）
TryMore
株式会社TryMoreの制作実績です。
まずこちらもコーポレートサイトのデザインから参考となりますが、モーダルというか下層が右に表示されるUIがとても斬新です。
SHIFTBRAIN
株式会社シフトブレインの制作実績です。
WEBグランプリで優勝したDENSOのブランドサイトなど、こちらもハイレベルなサイトが数多く見られます。サイトだけでなく、制作する上でのブランディングの方向性やデザインコンセプトやロゴのモーショングラフィックなど制作背景の部分も記載されており、デザインだけでない部分まで参考になります。
おまけ
にじいろクリップ
アニメとゲームのWEBデザインを集めたギャラリーサイトです。
更新がストップしてしまっているため、新しく増えることはありませんが、
意外とアニメやゲームの参考サイトがまとめられたサイトが無かったので紹介します。
まとめ
今回はWEBデザインの参考になるギャラリーサイトを紹介させていただきましたが、WEB制作はデザイン以外にもアニメーションやUI設計など細かいパーツの部分もとても重要になるかと思います。アニメーションでも、スプラッシュアニメーションやローディングアニメーションなど細かい違いもあるため、そのような参考サイトもまた次回以降に紹介させていただければと思います。
