オーダーメイドコース
icon
icon

もうデザインに困らない!創造性あふれるイベントサイト10選

Webデザインの参考になる海外のイベントサイトを集めています。どれも創造性あふれるWebサイトなので、これからサイト作成を考えている人はぜひともご覧ください。見た目だけでなく動きも独特で印象に残るはずです。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

本稿は、WebDesignerdepotのブログ記事を、了解を得て日本語翻訳し掲載した記事になります。また、本記事はEventCreateの共同創業者でありWebデザイナーでもあるMark Bushy氏によって投稿されました。

 

私はイベントのWebサイトをデザインするのが好きです。

期間限定だけど、シンプルで美しくできるからです(複雑なユーザーインターフェイスはここには存在しません)。

この2つの融合はクリエイティブなナビゲーションパターンや、特殊なレイアウトを試す場として、または面白いアニメーションで遊んでみる場として、もしくはFlashやActionScriptを懐かしむ場としても最適で、Webデザインの新たな限界を試す特別な機会なのです。

 

クリエイティブで刺激的で眺めていて美しいイベントサイト10つを集めてみました。

 

Epicurrence

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-13-11-41-30

このWebサイトは4日間、ウタのモアブでデザイナーと開発者のみが招待されたものですが、本当にすごいです。

写真は綺麗だし、レイアウトも刺激的です。

よく「これはすごい!」と思っていたWebサイトでもフォームだけ普通、というのはありがちですが、些細なところまで目を配っていて登録フォームも綺麗です。

Sonny’s Smokin’ Showdown

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-13-11-42-40

このBBQコンペは伝統的なイベントかもしれませんが、Webサイトは本当にハイテクなのです。

スクロールしてイベント会場を3次元で探検することができるのです。テキストが上にオーバーしますが、ほとんど必要ありません。

複合的に織り成されたビジュアルが文字を読まなくてもこのイベントの全てを物語ってくれます。

Sonny’s Smokin’ Showdownのサイト、ぜひチェックしてみてください!

 

[PR] Webデザインで副業する方法とは

Global Wave Conference

2015-global-wave-conference-1

制約事項の中でこそ本当に良いクリエイティビティが発揮されて、そこに哲学が生まれると思います。

Global Wave Conferenceはその良い例ではないでしょうか。

ちょっとクリックしてみるととアニメーションされたロゴ(GIF)とハンバーガーのメニュー(SVG)でこのサイトをのどかな写真やタイポグラフィーでごまかすことなく高級に仕上げているのが見てとれます。

クリアで、簡潔なイベント記述は前から好きなのですが、それは今も昔も変わらないと思います。

 

Festibiere

festibiere-d-hiver-january-29-30-2016-5pm-2am-canadian-museum-of-history-1

Festibiere

この中でいうと目新しくはないかもしれませんが、ナビゲーションが良いですね。

イベントサイトに典型的なのですが、ひっつくヘッダー(クリアで、対照的なRegister nowのボタン)は、コンバージョン率とチケットの売り上げを上げるのに適しています。

 

このイベントは夏と冬の年2回行われるのですが、それぞれで違うサイトが作られていて、デザイナーの手腕が見て取れます。

どちらも似たようなインターフェイスですが、よく違いが出ていてそれぞれにあった季節感があります。

 

LOOP

home-loop-2016-1

大きなフォントが印象的なFturaはフォルクスワーゲンの宣伝の印象がありますが、そうならない見せ方もあります。

LoopのWebサイトはまさにそれに当たるでしょう。

 

Loopは音楽とテクノロジーにフォーカスした3日間のカンファレンスです。

サイトはシンプルですが本当に綺麗です。

サイトを覆うボディーにある背景のグラデーションも良いですね。(テキストグラデーションはCSSで、バックグラウンドWebkitのclip prooertyが使われました。)

Structure

structure-norwegian-contemporary-crafts-and-design-1

クリエイティブなデザイナーのおかげで(そしてJQuery UI draggable ライブラリのおかげで)、

このノルウェーのイベントWebサイトはこのイベントのどちらかというとアナログなコンセプト「空間における並べられた形」、を

デジタルに表した形となりました。

私の意見では 、ここをブラウジングしたあと何かすることが欲しいです。

登録を勧めるなり、Eメールを捕まえるなり、リダイレクトするなり、これ以上私がなにか要求しないような何かが欲しいです。

 

Valio Con 2016

valio-con-2016-1

イベントから写真を集める時、主催者は間違いなく大量の異なるサイズやスタイルの写真をあなたに送ってくることでしょう。

大写し、暗かったり、明るかったり、溺愛する飼い猫を抱いていたり。しかし、これではまとまりがありません。

幸い、サンディエゴのデザイナーとMakerの年次カンファレンスであるValioConのデザイナーは、ポートレートを均一化するクリエイティブな写真のフィルターでこの課題に応えて、全体的なデザインとして実に整然とされた印象があります(そして素晴らしいです)。

 

Bloomberg BusinessWeek Design 2016

bloomberg-businessweek-design-2016-1

このサイトを最初にみた時、色盲でないことに感謝しました。

というのも、もしすべてのリンクが同じ色だったら、一体どこをクリックしたらいいかわからないからです。

Bloomberg BusinessWeekデザインカンファレンスのサイトの特徴は、bold体で力強く、教科書通りのレイアウトを激しく無視していて、しかもなんと使いやすいのです。

 

Elevate Summit

elevate-summit-a-conference-about-customers-1

The Elevate Summit(全身はUserConf)はカスタマーサポートとコミュニティーマネージャーのコンファレンスで

今年の10月に開催予定です。イベントサイトとしては、ずば抜けて綺麗で美しいです。

「5 reasons to attend」というリストが好き(異論はもちろんありますが)で埋め込まれた登録フォームも好きです。

 

チャットボタンも良いです。イベントサイトで頻繁にはお目にかからりませんが、出席者のふれあいにとてもいい方法です。

 

Hashtags Unplugged

hashtags-unplugged-1

このニューヨークの展示イベントのWebサイトはクリーンなデザインで、かつ素晴らしいタイポグラフィーです。

しかし私が一番気に入っているのはこのサイトのナビゲーションです。

「the artists」 を選ぶと、下にハッシュタグが出て来て、ページが全部アーティストのリストになります。

ページの移行は精巧で現代的、どこにいるかわからなくなった!ということにはなりません。

(ユーザーに新しいナビゲーションパターンを提供する際にすべてとても大事なことです)。

[お知らせ]TechAcademyでは初心者でも最短4週間でオリジナルWebサイトを公開できるWebデザインオンラインブートキャンプを開催しています。