「せっかく新しいコーポレートサイトや採用サイトを作るなら、絶対に失敗したくない」「単に情報を掲載するのではなく、ターゲットに響き、成果を生み出すメッセージを届けたい」というのが担当者の皆さまの本音ですよね。

多くのWebサイト制作プロジェクトでは、途中で認識のズレが生じたり、制作後に成果が出なかったりといった問題が発生しがちです。その原因の大半は、デザインや開発ではなく、最も重要な上流工程にあります。

GIGでは、制作するWebサイトの高いデザイン性と機能性を保証するだけでなく、その源流にある「コミュニケーション設計」によって効用を最大化することに徹底的にこだわっています。 

この記事では、GIGが実際にどのようにして①お客様の事業への解像度を高め（ヒアリング）、②ブレない設計図を作り（ワイヤーフレーム）、③制作フェーズへの確実な橋渡しを行い（制作プロセス）、そして④共通認識と信頼関係を築きながらプロジェクトの成功に向けて伴走するのか。その具体的なノウハウと、各ステップでのプロの着眼点を掘り下げます。

【関連記事】なぜWebサイト制作は「コミュニケーション設計」が重要なのか？ GIGが提供するコミュニケーション設計とは

渡辺 瑠花（わたなべ るか）：ブランディング専攻の大学院を修了後、2017年に都内IT企業にデザイナー職として新卒入社。Web制作とマーケティング施策に関するデザインを経験し、フリーランスを経てGIGへ入社。現在はPMポジションのファンクションマネージャー/プランナーとしてWebサイト制作の統括・提案を行う。

「あなたたちは誰？」：Webサイトの成功を左右する初回ヒアリングの重要性

Webサイト制作で失敗する原因の多くは、お客さま自身が「自分たちが誰なのか（どういった企業なのか）」を明確にしないままプロジェクトが進んでしまうことです。Webサイトは会社全体、そして顧客とビジネスをつなぐ重要なツールなので、その設計思想の源泉は「事業のゴール」を深掘りする対話のなかから生まれます。

GIGのコミュニケーション設計における最初のステップは、ヒアリングでお客様のビジネスの本質を掴むこととしています。まず初回のヒアリングで投げかけるのは、以下のような事業に関する根本的な問いです。

・事業目的：ビジネスモデルはどう位置付けられ、どんな価値を提供しているのか？
・ターゲットの課題：サービスを使うことで、ユーザーのどんな悩みや不便が解消されるのか？
・競合との違い：他社ではなく、ウチを選ぶ理由（選ばれる根拠）はどこにあるのか？
・プロジェクトのゴール：なぜ今、サイトが必要なのか？ 公開後、最終的にどんな成果を達成したいのか？

プロジェクト開始時に、これらにお答えいただける経営層や部門長の皆さま、現場の担当者の方々など、さまざまな方にお話をうかがいます。深く掘り下げていくことで、お客さま自身もまだ気づいていなかった潜在的な課題や、隠れた強みが浮かび上がってくるため、適切な担当者の方をアサインいただくことをおすすめしています。

会社としてWebサイトで伝えたいことが決まっており、ある程度整理されている場合でも、異なる角度から確認・議論していくことで、より良い見せ方を工夫することができた事例もあります。

コミュニケーション設計のいいところは、最初のヒアリングの後に、プロジェクトの進め方を柔軟にご提案できる点にあるとも言えます。ちなみに、コミュニケーション設計の進め方については、初回ヒアリング以降に明確にするものとしています。どのようなプロセスでヒアリング・企業理解を行っていくかは状況に応じて違うため、ある程度の企業の状況がわかったタイミングで、以降の工程をご提案するという流れです。手法についても、ワークショップ・フィールドワーク・ユーザーインタビューなど、必要な理解にあわせて選定しています。

「何を伝える？」：ブレない設計を可能にするコンテンツ構造の作り方

ヒアリングで「自分たちのコア」が明確になった段階で、「Webサイトを通じて何を伝えていくか」の定義を行います。

サイト全体の構成については、コーポレートサイト・サービスサイト・採用サイト……など、それぞれの目的に応じて王道の構成が存在します。例外はありますが、基本的な各サイト構成の考え方に基づいて、ヒアリングで整理した情報をどのように構成することで伝えたい内容が適切に伝わるかを検討していきます。

たとえばコーポレートサイトの場合、お知らせやIR等の構成意図が明確であるページを除いた、私たちについて・会社概要のようなページを含めた主要ページに、どのようにコンテンツをマッピングしていくかを検討します。コピーライティング・ページライティングもあわせて発注いただける場合は、大枠の方向性とあわせて、実際のコンテンツの詰めまで、責任をもって対応しています。

この段階で、お客さまと「ユーザーの行動を促す構造になっているか」を再度チェック。ここで、ユーザー導線に無理がないかを確認し合います。設計フェーズで練った仮説が、実際に画面上で機能するかどうかを検証できるのが、このプロセスの大きなメリットです。この検証によって、公開後の「思ったのと違った」というズレを未然に防ぎます。

「どう表現する？」：見つけた設計図をもとに、具体的な制作に落とし込む

コミュニケーション設計にて、サイトでの情報伝達マップを作成したあと、いよいよ具体的なサイトの制作に移ります。コミュニケーション設計で策定した方針をプロジェクトにも共有したうえで、対応したプランナーも監修してサイト制作を進行することで、方針のブレを防ぎつつ目的に沿ったサイトを制作を目指します。

【ワイヤーフレーム制作】
「ワイヤーフレーム」と聞くと難しそうですが、簡単に言えば「サイト全体の構成図」のこと。ユーザーが迷子にならず、自然とゴールに向かってくれるような、論理的で使いやすい導線の設計を行います。これは、情報配置と優先順位を確定させるため、画像や色などの装飾を含まない状態で作成します。

GIGでは、Figmaというブラウザ上で一緒に見ながら編集やコメントができるツールを使って作業するため、オンラインの打合せでもスムーズに認識を共有することができます。

【デザイン作成】
ワイヤーフレームが確定した段階で、PM（プロジェクトマネージャー）とAD（アートディレクター）が中心となりサイトのデザイン制作を進めていきます。デザインヒアリングを行いデザインの方向性を策定し、そこから具体的なデザインを形にしていきます。

コミュニケーション設計の存在により、デザイナーは「戦略に基づいた美しさ」を追求でき、それぞれの専門性を活かしながら、常に同じ方向を向いて制作を進めることができます。

具体的な制作事例は、以下URLをご覧ください。

WEB制作実績｜東京のWEB制作会社・ホームページ制作会社｜株式会社GIG

株式会社GIGのウェブサイト制作実績のページです。東京を拠点に、WEBサイト制作やメディアサイトの企画・制作・運用、WEBマーケティング、システム開発、体制構築、及び人工知能をかけ合わせたライフスタイル領域のサービスを開発しています。

giginc.co.jp

サイト制作事例｜Webサイト制作 / CMS・MAツール｜LeadGrid（リードグリッド）

サイト制作事例のページです。LeadGrid（リードグリッド）は、専門知識がなくても簡単に使える国産CMS・MAツールです。上場企業やスタートアップ企業を中心に、Webマーケティングの強化やサービス立上げ時にご利用頂いています。サービスサイトやオウンドメディアなど見込顧客獲得に貢献できるWebサイト制作を得意としています。

goleadgrid.com

ものづくりのフィロソフィー：GIGが約束する「満足度の高い伴走」とは

GIGのコミュ二ケーション設計の真の価値は、納品されたWebサイトそのものにとどまりません。制作を通じてお客さまと築き上げる「伴走体制」にあります。コミュニケーション設計の段階から適切な初期制作を行い、納品後のサイト運用まで伴走させていただくことで、作成したWebサイトをよりよいものとして価値を引き出すことが可能です。

今回のサイトにおける適切な方針とは何か・何を伝えていくべきかが明確になることで、お客さまも目的に沿った迅速かつ的確なフィードバックを行い、プロジェクトが間違った方向にコントロールされることを防ぎます。サイト制作のプロセスを通じて、相互理解と信頼を築くことが、お客さまに心から満足いただける伴走の土台だと考えています。

「自社でも、まずはヒアリングから始めてみたい」「このプロセスを体験してみたい」と感じていただけたなら、ぜひ次のステップへお進みください。Webサイト制作のきっかけを、GIGと一緒に踏み出しませんか？まずは、お客さまの事業についてお聞かせください。お問い合わせフォームからのご連絡をお待ちしております！

■株式会社GIG
お問い合わせはこちら
採用応募はこちら（GIG採用サイト）
採用応募はこちら（Wantedly）

渡辺 瑠花

渡辺 瑠花（わたなべ るか）：ブランディング専攻の大学院を修了後、2017年に都内IT企業にデザイナー職として新卒入社。Web制作とマーケティング施策に関するデザインを経験し、フリーランスを経てGIGへ入社。現在はPMポジションのファンクションマネージャー/プランナーとしてWebサイト制作の統括・提案を行う。