BAsixs(ベーシックス)

「あたりまえ」をアップデートしつづける

コーポレートサイトのリニューアル事例 ポッカサッポロ様

  • 投稿日 :
  • 最終更新日 :
事例:ポッカサッポロフード&ビバレッジ コーポレートサイト パソコン画面1

プロジェクト概要

2017年に60周年を迎え、ポッカサッポロさまのコーポレートサイトとして、「お客さまとの双方向の深いコミュニケーション」の実現することを目的にWebサイトのリニューアルを行いました。Web起点で顧客接点の場を増やし、一方的な情報発信ではなく、“お客さまニーズや心理”を踏まえた、双方向のコミュニケーションが図れるWebサイトを備えた企業として認識してもらうことにより、量ではなく質の深いファン化の促進を目指しました。

サービス内容

UI/UXデザイン、サービスサイト構築

ポッカサッポロフード&ビバレッジ コーポレートサイト パソコン画面2

事例:ポッカサッポロフード&ビバレッジ コーポレートサイト パソコン画面3

対応デバイス

パソコン、タブレット、スマートフォン

プロジェクト期間

2016年7月〜2017年4月(※現在も運用継続中)

チームメンバー

体制図:プロジェクトメンバー プロジェクトリーダー、ディレクター、UXリード、デザイナー

プロジェクトの背景・課題

  • トップページのように多様な情報を包含するページにおいて、情報のメリハリが弱い。
  • 目的のページに辿り着きやすくするための施策や機能が乏しい。
  • 商品情報やレシピ情報がカタログ的な分類による1軸でのカテゴリ構造となっており、ユーザーが情報に辿りつき難い。

ご提案内容

  • 一方的なブランド・商品情報発信に留まらず、企業としてユーザーニーズや心理を踏まえた安心できる、公式な情報の発信
  • ユーザーに対して興味を広げるきっかけをつくるIAの実現
  • 目的のページ情報を取得後に、さらにサイトの回遊性を高める設計
  • ポッカサッポロさまの経営ビジョンである”商品としての「おいしさ」だけでなく、商品を通じてお客様が感じる喜び、思い、シーンに「彩り」や「輝き」をくわえることができる『おいしい』を生み出す”コンテンツの企画・運営

拡張の基盤としてのフルリニューアルの実施

設計、デザイン

  • コンセプトを体現するIA(情報アーキテクチャ)の実現
  • レスポンシブウェブデザインによるマルチデバイス対応
  • 拡張を前提とした実装設計

コンテンツユーザー訴求

  • 今後の運用を踏まえた既存コンテンツの整理
  • 商品とお客様の生活を繋げるためのコンテンツ拡充

ガバナンス

  • 運用の現実を踏まえたガイドラインの作成

成果

  • トップページの役割を再考し載せるべき情報を整理したため、企業の今を示す顔としての役割を果たせるようになった。
  • 商品情報に複数のカテゴリを付与し、ユーザーが情報を探しやすくなった。また商品を使ったレシピ、ECサイトへの導線を増やすことで回遊性の向上が図れた。
  • Webサイトのガイドラインを制作、運用、アクセシビリティと分野を分けて作成することで、各制作会社が必要な部分を参照できるようにしたため、以前に比べてルールが浸透しやすくなり、ガバナンス強化に繋がった。

クライアントからのお声

ユーザー視点での情報整理とそれに基づく導線設計は、企業組織内の視点からだけでは難しいので、外部の視点からのアドバイスはありがたかった。
商品軸ではない情報コンテンツとそこへの導線確保を自然な形で実現できたと思う。
ユーザーの情報接触態度が変化するなか、企業サイトの在り方は常に変化しているので、その変化に合わせて、今後もWebサイトの改善を進めていきたい。

今後の展開

Webサイトを拡張するための基盤ができたため、企業としての統合的なコミュニケーションを通じて、サイト流入を増やすためのコンテンツ拡充に重きおいた施策を継続して実施しています。
商品としての「おいしさ」だけでなく、商品を通じてお客さまが感じる喜びを体感できるUX設計を行っていきます。

クライアント情報

ポッカサッポロフード&ビバレッジ株式会社
会社名
ポッカサッポロフード&ビバレッジ株式会社
事業内容

飲料水及び食品事業、外食事業、その他

企業URL
https://www.pokkasapporo-fb.jp/

サービス提供会社

株式会社ビジネス・アーキテクツ
会社名
株式会社 ビジネス・アーキテクツ
事業内容

Webサービスの企画・設計・デザイン・開発・運営にかかる総合サービスの提供

企業URL
https://www.b-architects.com/