今日、株式会社Spincoaster様のコーポレートサイトをリニューアルしました。今日はそのご報告です。
【仕事した】
音楽情報メディア「spincoaster」を手がける株式会社Spincoaster様のコーポレートサイトをリニューアルしました！ TOPページではレコード盤面をモチーフにしたアニメーションを演出しています。https://t.co/gEgyqGtCX1— 下津曲 浩 (@shimotsu_) April 7, 2017
制作したサイトはこちらです。
株式会社Spincoasterさまは、ウェブメディア「Spincoaster.com」や、バー「Spincoaster Music Bar」、音楽情報ポータルアプリ「TYPICA」等のサービスを手がける会社です。
新しく制作したコーポレートサイトの「WORK」のページを見ていただけるとすぐに分かるのですが、ほとんどすべての事業が音楽に関わるもので、その姿は創業時以来一環しているといいます。
そうした一環した音楽事業への取り組みをPRすべきで、かつ上記の3つの根幹となるサービスを提供している企業であるということを表現するために、トップページでまずは事業内容をビジュアルとともに概説し、紹介ページへの導線を設けています。
また、今回のリニューアルに関する大きな目的のひとつとして、デザイン面の改修がありました。
これまでのコーポレートサイトは、代表である林さんがつくったものをベースに継ぎ接ぎ状態でブラッシュアップしていたもので納得がいっていなかったため、ビジュアル面のクオリティを上げることが求められました。
結果的に、Spincoaster.comやSpincoaster Music Bar、TYPICAで用いているような、上品でかつ、一本芯の通った繊細なイメージをベースに、企業情報が最もよく伝わるようなデザインを選び、このような形に仕上げました。
また、TOPページには、僕らが特に得意とするフロントエンドの技術を用いたアニメーションの演出も取り入れています。
まず、会社のロゴが中央に表示され、
その中に示している円状の要素が回転します、
ローディングが完了し回転が終わると、このような同心円状の線が複数描画されます。
それが終わると、線の切れ間の奥からメインビジュアルが出現し、少し遅れて「音楽を通じて人生を豊かに」という企業のコアミッション／メッセージが表示されます。
この一連の流れは、見せ方はもちろん、特にスピード感も意識しています。
「スピンコースター」という社名を構成している「コースター」には、ジェットコースターの意味があり、そのゆっくり上昇し徐々に速度を高めてピークに達するというジェットコースター的な動きを多く取り入れています。
「こんな感じのサイトを作りたい！」「演出の部分で力を貸してほしい」といったことをお考えの方はぜひ以下よりご連絡ください。
