SuperVinylRecord様

過去にDJをされていて現在は現役時のレコードを販売されています。音楽が好きで音楽のレコメンドサイトを制作したいということもあり制作しました。このサイトはconcrete5で構築してあり、concrete5の強みを生かしたコーポレートサイトになっています。もちろんブログ機能も搭載しております。
URL:https://djkazu.supervinyl.net/

プロジェクトの流れ

構成について

トップのメインビュジュアルはSVGでアニメーションができるようにしており、サイト自体もコンテンツがアニメーションで動くように表現しています。
またparallax（パララックス）を組み合わせて動きをつけています
音楽のジャンルがでるようにカテゴリーを採用してカテゴリーの内容でラベルの色がかわるようにしています。YouTubeを使った動画もみせれるようにもしています。このサイトはconcrete5の基本ブロックや基本機能を使って再現したサイトとなっています。concrete5でこんなことが簡単にできるという見本にもさせていただくように了承も得ています。

デザインについて

雷神、風神を書かせていただきアニメーションで表示するようにしています。サイトのテーマカラーは白にして、コンテンツが前面にでるようにしています。イラストはすべて自作で用意させていただきました。コンテンツがアニメーションで動くので動いたことを考慮したデザイン設計にしています。アニメーションで意識することはコンテンツが見にくくないようにすることです。

コーディング・マークアップについて

アニメーションが多いので、サイト自体ができるだけ重くならないように軽量化をするようにしています。またWEBサイトの土台が今回がconcrete5というCMSを採用しているので、CSS設計は重点にしています。保守性と可続性と再利用性を重視しているのでコンテンツが追加されてもメンテナンス性のある設計にしてコーディングをしています。SEOを意識したコーディングをしています。要件定義以外のブロックが投入したときは、ブロックのコーディングが必要にはなります。拡張性を考慮したサイト設計をしています。

運用について

クライアント様の方でコンテンツ更新ができるようにしています。ブログ以外のページも簡単に更新が可能となっています。concrete5で制作していますので追加したいブロックを投入することはもちろんブログ以外のページなども追加更新ができる設計になっています。