GWの中日、皆様いかがお過ごしでしょうか。通勤の電車の中も行楽の雰囲気が凄まじいですね。
お天気も良いですしどこかに出かけたくなりますね。弊社はカレンダー通り営業しております。
さて、今日は海外のポートフォリオのデザインをご紹介したいと思います。
国内にももちろん素敵なデザインやギミックのものがたくさんあるんですが、海外の個性色濃いサイトにどうしても憧れてしまいます。どうしてあんなに素敵に見えるんでしょうね。(外国語だからというのもあると思いますが…)
作り手の自己満足と言ってしまえばそれまでなのですが、ただ並べるだけではつまらない…他とは違う、より魅力的な見せ方のものを作りたいですよね。
ご参考になれば幸いです。
▲mili kuo
イラストをクリックすると簡単なキャプションが表示されます。まずイラストがキャッチーで素敵。可愛らしいです。
▲Studio Songes
スクロールをすると、1ページずつダイナミックに動きます。イージングが印象的。
▲vissio
サムネイルをクリックで制作プロセスや他のイメージを表示⇒さらにクリックで全画面で画像を表示、の2段階の構成。
jsもストレスなく動きますし、プロジェクトごとに詳しく説明したい場合に煩雑としないので良いです。
▲Barnyard
サムネイルにマウスオーバーで、イメージのズームと、キャプションが表示されます。色合いがカラフルで素敵。
▲SIXZERO
色を進数で表示していたり、全体的に制作側の人間でないと分からないだろう表現が多いですが、見ていると何だか閃きそうだったので掲載。分かりにくいですが表現次第で何か応用がききそうです。
▲Zack Batsaikhan
Worksの部分、サムネイルにマウスオーバーすると、画像が虫眼鏡のように拡大表示されます。
▲Shokunin
サイト全体がイラストでまとめられていて、親しみやすい感じですね。
worksはそれぞれフルサイズで確認できる所が良いと思います。
▲Igor Solovey
スクロールで動かすサイトです。
動きが遅めなのでストレスを感じますが、worksの箇所で拡大表示されるのが良いな、と。
▲Jovan Rocanov
サムネイルをクリックすると、そのプロジェクトの他のイメージが表示されます。
マウスオーバーしないとどういったカテゴリなのかが分からない所が不便ですが、構成はシンプルで分かりやすいです。
▲Mads Burcharth
キーボードを使用して動きます。スクロールも割にストレス無くテンポ良く動きます。
ページごとに色が違いカラフルですし、トントンと次を閲覧できるのが良いですね。
▲Oleg Lyutov
スクロールで下に横にとダイナミックに動きます。プロジェクトごとに背景を変えて全画面で表示している所が、分かりやすくて良いです。
▲jewelleries.co
サイト下部にある「More themes & plugins」の項目なのですが、オンマウスで画面の色ごと変わってしまうのが面白いな、と。
▲Cosmina
階層が深くなりすぎると自分がどこにいるのか迷子になりそうですが、実際にそのプロジェクトのサイトを見ているかのように画面全体で表示され、イメージがつきやすいですね。
細かいところにjsが使用されていたり、参考になる場所は多いです。
▲Why Interactive
スクロールかマウスのスライドで動きます。下部にサムネイルが表示されるパターン。予想できない動きをする時があるので視線が泳ぎますが、手がけた内容をアイコンで分かりやすく表示したり、ダイナミックな見せ方は良いです。
▲Tyler Somers
サムネイルをクリックで、プロジェクトの詳細のページにシュッと移動します。
制作プロセスが紹介されていて、とても良いと思います。
株式会社8bit (エイトビット)
東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。