新産業領域の企業を厳選し、新卒学生に対して良質なセミナーやイベント等のコンテンツを提供。企業に対しては、成長志向の高いハイポテンシャルな人材とのつながりを提供するGoodfindのサイトリニューアルを担当しました。

本プロジェクトに全体のディレクション、UIデザイン、フロントエンド開発として参加しました。

リニューアル趣旨

• スマートフォンからのアクセスを主体に考えた情報設計へ変更
• 今後の運用/開発工数の削減

現状の課題点

以前のサイトは2カラムメインでファーストビューにリンクをなるべく多く設置しユーザー（就活生）に遷移してもらうことが目的のサイトとなっていました。 何度も再訪し使い慣れている方には問題ありませんが、就活という短い間でいくつかのサービスを併用するユーザーにとって離脱の原因となっていました。
また、2016年当時スマートフォンからのアクセスが増加していることも踏まえ、スマートフォン主体の設計としました。 開発のスコープとしてはサイトマップは変更せず、既存のコンテンツを活かしつつリニューアルを行うこととしました。

バナー改善

Goodfindはセミナーの開催や企業を紹介する際に必ずバナーを作成しており、他社はテキストのみのページが多かったため差別化できると同時に商材としても使用されていました。 そのためデザイナーが一つひとつ作成し、デバイスによるバリエーションが必要など工数がかかっていました。 しかし、バナー作成にはスキルが必要にもかかわらず人員が不足しており事業のスピードを妨げている要因となっていました。 そこでメインで使用する背景画像のみ登録すればバナーのように見えるテンプレートに変更する方向性を提案しました。 そのために変更後にサイトの指標に変化がないかABテストしたり、テンプレートに優劣のバリエーションを設け商材としての価値を保つようにしました。

フロントエンドの設計

既存のコードは長年使い続けられたため複雑で保守しづらく、機能追加の際に影響範囲がわかりづらい状態でした。 またPCサイトとモバイルサイトで異なるCSSだったため、修正のたびに二重で対応する必要があり工数がかかっていました。 そのためスタイルシートをSASSで0から設計し直しレスポンシブにも対応しました。 命名規則にはSMACSSを採用し、ファイル規則はBootstrapに習いながら作成していきました。 また作業者が私ひとりだったため今後メンバーが参加しやすいようドキュメントも作成しました。

検証

リニューアル後、トラブルもなくサイトは稼働し続け、2021年に上場した現在でもベースは変更されず使われています。