05

国内最大級のフリーランスコミュニティコーポレートサイトの改修

プロフェッショナル&パラレルキャリア・フリーランス協会

ユーザ動線の見直しと情報設計とブランドイメージの刷新

国内最大級のフリーランスコミュニティ。フリーランスの方々が運営を行っています。5周年を迎えるにあたり、サイトの改修を行いました。元々のサイトは、活動内容のスナップショット画像や丁寧な説明が多いサイトでしたが、機能やコンテンツの充実した増築を繰り返したサイトを一度バラバラに分解し、ユーザに適した動線の設計を行いました。また、サービスイメージの刷新も同時に進め、図やイメージ画像を用いて、特定の職種や世代に偏らない、より中立的な立場を体現するためのデザインを作成しました。

SOLUTIONS
FLOW

  1. Step
    01

    ユーザの行動把握とコンテンツのグルーピング

    GAのユーザトラッキングデータを元にアクセス履歴を分析し、利用者の行動をパターン化していき、コンテンツをグルーピングしました。ただし、GAだけでは判断がつかない時もあり、サイト運営メンバーの意見を交えながら、利用者タイプ、コンテンツカテゴリー、ユーザ利用フローのパターン化を固めました。同時に、簡易的なヒューリスティック評価も実施し、GAとヒューリスティックを睨めっこしながら、5年というサイト運営期間と利用者の成長度合いを考慮し、全ての利用者のアクセスシビリティを上げるよりも、利用者カテゴリを大きく分けて、利用者毎に最適なコンテンツを提供できる設計にしました。

    Output

    • GA分析結果まとめ
    • ユーザタイプとユーザタイプごとの動線説明資料
  2. Step
    02

    ワイヤーフレーム

    情報設計を行いながら、不要なコンテンツや改修すべきコンテンツを分けていき、ページ毎の内容の見直しを実施しました。ページ構成のドラフトができた段階で、内容をプロジェクトメンバーに作成していただき、会員特典の利用率を上げるためのメリット訴求や導線設計、法人向けサービスの理解度アップと問い合わせ増加のためにコンテンツとレイアウトを細かく調整しました。利用者のサイト訪問目的達成に最適な動線と最適なタイミングでのコンテンツ提供、法人様や新規利用者のサービス理解度の向上を図りました。

    Output

    • ワイヤーフレーム
  3. Step
    03

    UIデザイン、開発

    UIデザインでは、大幅なブランドイメージ変更を行いました。キーカラーを使用しつつ、幾何学模様をアクセントに、会員の画像ではなく、イメージ画像としてモデルを使った画像を使用し、一般化されたサイトの見え方に変更を行いました。また、プロフェッショナル&パラレルキャリア・フリーランス協会様を説明する図の作成に力を入れ、ポジショニングや活動範囲など、誤解を発生させない図を作成しました。開発は、スリランカの開発チームと行い、アルチェコはBSEの立場をとりながら開発を進めましたが、スリランカが経済危機に直面し、停電が頻繁に発生してしまったため、急遽国内のエンジニアとフリーランス協会様のエンジニア様に協力してもらい、なんとか完成にいたりました。

    Output

    • デザインデータ(Figma)
    • ソースコード一式