• Tweet

こんにちは。アイドットデザインの越水です。

3月ももう半ばですが、今月も日々チェックしているホームページの数々から、お気に入りのサイトをまとめてご紹介いたします。

今回はややインタラクティブな作品が多くなったかなという印象です。

今やホームページ制作もブランディングツールとしての利用が一般的になってきており、目的達成のためには映像コンテンツやクオリティの高い写真の存在も欠かせません。うまく他分野のクリエイターと連携をとりながら協業していく場面も増えそうです。

それでは2015年2月に私が気になったWebサイトのまとめです。

※「2015年2月に公開されたサイト」というわけではないのでご了承ください。

2015 is yours

URL : http://www.2015-is-yours.com/

フランスのデザインスタジオによるアートワーク。

ホームページ上でTweetすると日々伸びていくグラフィックアニメーションで１年間を形作っていきます。

Barclays Code Playground

URL : http://barclayscodeplayground.co.uk/

どういった目的で作られたホームページなのかよくわかりませんが、画面を動き回るオブジェクトをクリックして現れるプログラミングに値を入力することでアニメーションが変化するインタラクティブな作品。

プログラミングがわからない人でもあれこれ触ってみると楽しいと思います。

Bloomberg Business

URL : http://www.bloomberg.com/

最新の経済・金融情報を発信するBloombergのホームページ。

情報整理や見出しの見せ方、ナビゲーション設計の仕方が勉強になります。

BODA

URL : https://boda.sensors.jp/

日テレのクリエイターをフューチャーした番組「SENSORS」のメンバーによる作品。クレジットにはバスキュールが入っています。

アーティストやモデルなどの身体を3Dスキャンしてその3Dデータをレーシングコースに競争するという内容。技術もコンセプトもぶっ飛んでいます。

1MD + Creative Bureau

URL : http://www.1md.be/

ベルギーのクリエイティブ制作会社のホームページ。

クールでパワフルな印象を残すデザインがカッコいいです。

Impossible Bureau

URL : http://www.impossible-bureau.com/

米国デジタルクリエイティブ制作会社のグラデーションが美しいWebサイト。

シンプルなページ構成で、下層ページタイトル周りのさりげないアニメーションもおしゃれです。

KeiSato Design

URL : http://keisatodesign.com/

日本のフリーランスデザイナーのWebサイト。

春らしい色合いの爽やかなデザイン。SVGアニメーションを使用したロゴも素敵です。

小林大輔写真事務所

URL : http://www.kobaphoto.com/

日本のフォトグラファーの方のポートフォリオサイト。

トップは全画面動画になっており、テンションの高いフォトシューティングの様子が映像で流れます。

作品内容とこの方に依頼した時の撮影現場の雰囲気がすぐにイメージできて素晴らしいです。

小山健 (イラストレーター・漫画家)

URL : http://koyamaken.com/

イラストレーター小山健さんのWebサイト。

かわいいです。好きです。

この方の描く漫画も大好きで、この脱力した感じのイラストをずっと見ていたくなります。

Lobagola B&B

URL : http://www.lobagola.com/

クロアチアの宿泊施設のホームページ。

スライドさせるとぐるっと回りこむ画像の表現が面白いです。こういうの真似してみたい。

Rally Interactive

URL : http://beta.rallyinteractive.com/

アメリカのソルトレイクシティにあるインタラクティブスタジオのホームページ。

トップでアニメーションしている帯がぐにゃっと変化してナビゲーションになる表現が面白いです。

Relax, we are the good guys

URL : http://beta.rwatgg.com/

コペンハーゲンで創立されたデジタルエージェンシーのホームページ。

ナビゲーションをマウスオーバーすると、中央でアニメーションするジオメトリックなCanvas要素に画像が映し出されます。

いつかこんなものを作れるようになりたい。

SQUAREPUSHER

URL : http://squarepusher.net/

有名アーティストSQUAREPUSHERのサイト。

スクロールすると現れるノイズのような表現が印象的。アイデアのひとつとして参考に。

Stash Flat Icons

URL : http://stashflaticons.com/

ちょっとレトロでフラットなアイコンを販売しているウェブサイト。

シンプルで可愛いデザインが飽きません。

STYLEPIT SS14 Interactive Lookbook

URL : http://www.stylepit.com/lookbook/

アパレルブランドのインタラクティブなWebカタログ。

さすがにFlashではないのか？と思いますがHTML5での実装のようです。

TOYOTA NEXT ONE

URL : http://toyota.jp/information/campaign/nextone/

トヨタのキャンペーンサイト。

別々の国の主人公たちが同時進行で映しだされた映像作品。

どこの国でも似たような青春のワンシーンがあるんでしょうね笑

ベッド専門店ビーナスベッド

URL : http://venusbed.co.jp/

岡山のベッド専門店のホームページ。

やりすぎないアニメーション表現、高彩度な画像により上質なブランドの雰囲気が伝わってきます。

構成もシンプルで見やすいです。

Vito Salvatore

URL : http://www.vitosalvatore.com/

ロンドンに拠点を置くデジタルデザイナーのポートフォリオサイト。

サイト・オブ・ザ・デイも数々受賞している実力派のアートディレクターでもあります。

タイポグラフィと写真でバッチリ決める。2015年のトレンドどまんなかのデザインです。

WORDSBERG | Translation

URL : http://wordsberg.com/

翻訳やコピーライティングを行う企業のホームページ。

数々の言葉がスクロールで流れていく表現が美しいです。

タイポグラフィと動きを組み合わせで感じる、言葉の力強さが印象的です。

We Are Zaion

URL : http://wearezaion.com/

イタリアのデジタルエージェンシーのポートフォリオサイト。

こちらもタイポグラフィと全画面画像・動画がベースとなった構成になっています。

個人的に「freetime」のコンテンツがとても好き。メンバーが好きなTV番組や趣味が紹介されていて妙に共感してしまいます。