THREE COLORS（オフィシャルサイト）｜Web制作実績 レスポンシブ対応｜制作実績

ホームページを訪れたユーザーに、THREE COLORSの3名のアーティスト様それぞれの絵画の魅力や個性が伝わるよう、PCサイトではプロフィールの見せ方を工夫しました。具体的には、画面左側にアーティスト様のプロフィール写真を固定表示し、画面右側では4点の作品写真を縦スクロールで閲覧できるレイアウトにしております。そうすることにより、アーティスト様と代表作品をひとつの画面でご覧いただけるだけではなく、迫力のある絵画を大きく表示することができるため、作品を細部まで楽しめるようなレイアウト設計となっています。

デザイン面では、「アーティスト写真の雰囲気に合わせたデザインにしてほしい」というお客様からのご要望にお応えするため、アーティスト写真に使用されているパープル系のグラデージョンカラーを、ホームページの背景やチケット購入ボタンにポイントで使用しました。また、チケット情報部分では、背景に絵具の筆で色を塗ったようなデザインを取り入れることで、絵画展ならではの雰囲気を演出しています。

今回、ユーザーのイベントへの興味・関心を高めるため、アーティスト様の作品紹介の見せ方を工夫しました。具体的には、縦スクロール式のPCサイトに対して、モバイルサイトではあえて作品を横スクロールで表示いたしました。そうすることで、縦に長くなりやすいモバイルサイトでも、ユーザーにスクロールの負担をかけずに、絵画作品を画面いっぱいに大きく見せることができます。

また、イベントへの参加意欲や期待を高めるため、3名のアーティスト様の作品やイベントにかける想いを伝えるインタビューページを制作しました。TERU様は非常に人気が高く、既存のファンが多いアーティスト様ですので、インタビュー記事を全文読むために訪れているユーザーが多いことを想定し、一般的なアコーディオン式ではなく、あえてインタビュー記事の全文を表示する設計にいたしました。当社では、お客様ごとに異なるターゲットユーザーに最適なレイアウト設計やデザインを考え制作しているため、唯一無二のデザインと、CV率向上につながるレイアウト設計を両立したホームページの制作を可能としています。

デザイン面では、お客様から「シンプルでスタイリッシュなデザインにしてほしい」というご要望をいただきました。そのため、全体的なカラーはメインビジュアルに使用されているパープル系のグラデーションカラーとホワイト・ブラックでまとめました。また、プロフィール紹介では、各アーティスト様のお名前の横に、メインビジュアルのお写真の背景色となっている色をそれぞれの「イメージカラー」として、アクセントとなる装飾を取り入れております。TERU様はブルー、長谷川匠様はレッド、藤倉朱里様はイエローという3色のイメージカラーを使用することにより、「THREE COLORS」というユニット名をさらに強く印象づけています。