Works

MATSUYAMACollection2024 Website

MATSUYAMA Collection 2024

制作期間

1ヶ月

担当範囲

ディレクション、デザイン、コーディング

使用ソフト・言語

Photoshop,Illustrator,Figma, HTML Living Standard, CSS3, jQuery

制作背景

「MATSUYAMA Collection 2024」開催に際し、イベントを宣伝するためのランディングページを制作しました。

この作品は4人のグループで作成しました。同イベントのフライヤーを参考にし、ワイヤーフレーム、デザインカンプ、プロトタイプまで作り、コーディングに取り掛かりました。

特にデザインに時間がかかりました。写真、動画を全て自分たちで用意して、ライティングまでやりました。このサイトは、インスタグラムやフライヤーに載っているリンクからの流入が多いと考えられたため、モバイル特化のデザインにしました。コーディングは5日くらいで終わり、デザインカンプの重要性を学びました。

このサイトを制作したことで、動画や写真のサイズを落とすノウハウを身につけられ、「Webp」という画像形式にも慣れることができたのでよかったです。また、ChromeやSafariなど、クロスブラウザ対応にするためのコードの書き方を身につけられました。OGPタグなど、メタタグの設定も行い、SEOも意識しました。

そして、このサイトを掲載するにあたって、コンバージョンの設定もしました。イベントへのお申し込みボタンをクリック、学校の資料を請求ボタンをクリックした時にそれぞれ設定しました。閲覧数やコンバージョン達成数をリアルタイムで確認し、ユーザーがこのサイトを閲覧し、サイト経由で申し込んでもらえたので、達成感が得られました。

このサイトの反省点は、Iphone SEで閲覧した時に、若干の表示崩れがあることです。