皆さんお久しぶりです、MINIです。
9月にリリースした移住者向け中途採用ページはもうご覧になりましたか？👀
宮崎オフィスの魅力がたっぷり詰まったページを制作させていただきました！
今回はこちらのLPの制作についてお話しします！
INDEX
デザインポイント
テーマカラー
GMOhinataのオレンジカラーを基調として、GMOグループのサイトでは珍しいオレンジ・ワントーンでまとめてみました。いつもと違う、宮崎の新たな魅力を印象付けられたらと考えました！
※GMOhinataのロゴガイドより引用
本記事のサムネになっているサイトのOG画像も、同じくワントーンで揃えてみたよ🍊
コンセプト設計とメッセージの伝え方
アクセスした時の初めの数秒でサイトの世界観に惹き込めるかが大切なので、オープニングアニメーションにこだわりました。今回のサイトコンセプトでもある「Throw yourself,slow life」を大きく打ち出し、伝えたいメッセージが波に乗せて現れる様子を表現しました。
※容量の関係で画質荒めです>< 詳しくはサイトをご覧ください！
サイトの世界観をアニメーションで表現
最後まで世界観を保てるように、MV以降のセクションではフローティングアニメーションを使用しています。ぷかぷかと波に乗っているイメージで読み進められるページを目指しました🌊
オフィスの１コマコンテンツは、実際にオフィスツアーをしているような感覚で見れるように進むとあしあとが付くアニメーションを考案しました👣コンテンツをしっかり見ていただけるように、このセクションだけ横スクロールを採用しています👉
※こちらも容量の関係で画質が荒いため、詳しくはサイトにてご確認ください
デザイン以外の工夫ポイント
アンケートフォームの活用
今回は案件着手〜リリースまで時間が限られていました。そのため、インタビューコンテンツはあらかじめフォームを作成し、いただいた回答を基にブラッシュアップしていきました✏️
コンテンツ作成をスムーズに進めることができたので、やってみてよかったことの一つです！
ご協力いただいたパートナーのみなさん、ありがとうございました！迅速な対応で本当に助かりました…✨
データ共有時は参考URLを！
今回のサイトは動きを多くつけたため、コーダーさんにデザインデータをお渡しする際にできる限り参考アニメーションのリンクをXdに貼るように心がけました。私の場合は特にcodepenのURLを共有することが他の案件時も多いです◎
データ共有後、コーディング担当のまだつぼみさんに上記が必要かどうかを聞いたところ、「参考リンクがあると時短につながる」とのことでした！
CVRを定期的に確認できる仕組みづくり
宮崎採用TOPページ配下のLPのため、エントリーボタンにGA4の計測タグを仕込んでもらい、こちらのページからのエントリー率を測れるように準備しました
現在はこの数値を一週間おきに集計しています！💻
まとめ
今回久々にLP制作に挑戦してみて、納得いくまでこだわることができたのはよかったです！しかし時間がかかりすぎたなと思う点もあったので、今後の制作に活かしたいです。
以前よりレスポンシブを意識して進められたのは、成長ポイントでした✊
現在も絶賛採用中ですので、気になった方はぜひサイトをチェックしてみてください✨
