Our service

ワイヤーフレームと情報設計

ワイヤーフレームと情報設計は、どちらもWebサイト制作において重要な工程です。情報設計では、目指すべきサイトの土台を固めます。ワイヤーフレームは画面設計とも言い、情報設計を含む設計段階の成果物として用いられる資料のひとつです。
クーシーのWebサイト制作において情報設計と画面設計のフェーズは、以下3点を考慮して進めます。

ワイヤーフレームと情報設計は、どちらもWebサイト制作において重要な工程です。情報設計では、目指すべきサイトの土台を固めます。ワイヤーフレームは画面設計とも言い、情報設計を含む設計段階の成果物として用いられる資料のひとつです。

クーシーのWebサイト制作において情報設計と画面設計のフェーズは、以下3点を考慮して進めます。

取り扱う情報のプロフェッショナルを目指す
目的に合わせた構造化と優先順位付け
ユーザー・クライアント・制作パートナーの各目線で作り込む

これらを考慮することで、続く制作フェーズや開発フェーズにおけるズレを無くし、ユーザーの満足度向上や、ビジネスの成功に繋がるWebサイト制作が行えるのです。

それぞれ見ていきましょう。

取り扱う情報のプロフェッショナルを目指す

弊社ではWebサイト制作において、サイトの掲載情報や掲載する効果について、クライアントと同等か、それ以上の理解を目指しています。

あなたは誰かに仕事を依頼した際、こんな経験をしたことはありませんか？
「意図と違うものができ上がってきた」
「これくらいの情報は理解しておいてほしかった」

依頼内容とゴールがズレる大きな要因に「頭の中の情報量の差」があります。こうならないために、仕事を依頼される側は「取り扱う情報のプロフェッショナル」であるべきです。クーシーメンバーの中には、事前の情報収集をした上で、「御社に入社するつもりで学ぶので、いろいろ教えてください」とクライアントにお願いして関係性を築いていく者もいます。

クライアントからは会社やサービスの情報、クーシーからはWebサイト制作の知識などをお互いにプロフェッショナルとして提供し合い、意見をぶつけ合う文化が醸成されていきます。情報が得られる以上にチームとして盤石な体制が整えられ、制作の成功を決定づけることもめずらしくありません。

目的に合わせた構造化と優先順位付け

情報が集まったら、サイトの情報設計を行います。サイト制作の目的からスタートし、目的を達成するためにユーザーにサイトをどのように回遊してもらうか筋道を立てる工程です。筋道をサイト構造としてページ単位でまとめ、サイトストラクチャを作成します。これによって全体像と導線が可視化されます。

ページは個別のコンテンツの検討に入る前に、ワイヤーフレームにして構造化を行います。ワイヤーフレームでは、ページ内のコンテンツの優先順位付けが重要です。何の情報を、どの順番で、どれくらいのボリュームで見せるか、詳細を詰めていくことで、サイト制作の目的を踏まえたユーザー体験を届けられます。

ユーザー・クライアント・制作パートナーの各目線で作り込む

クーシーでは、情報設計からワイヤーフレーム作成までの流れの中で、チームとして検討する機会を随時設けています。参加メンバーの職域はプロジェクトによって変わりますが、主に検討に参加するのはプロデューサー、ディレクター、マーケター、デザイナーです。

検討の際に役に立つのが、「ユーザー」「クライアント」「制作パートナー」目線でのフィードバックの出し合いです。これによって個々人の情報や知識に偏らず、どの目線からもクオリティを担保した設計を行うことができます。

例えばユーザー目線では計測データやユーザーストーリー、クライアント目線ではヒアリング情報やRFPなどの提供資料、制作パートナー目線としてはユーザー体験やSEO効果など、それぞれの目線の根拠となる情報を元にベストな形を探っていきます。

クーシーのWebサイト構築の流れ

0.お問い合わせ

まずはお問い合わせフォームよりご連絡ください。１営業日以内に弊社より折り返しご連絡を差し上げます。Webサイトの制作やリニューアルについてのご相談内容や課題などをお持ちでしたら教えてください。

1.企画立案

あらかじめご共有いただいた情報をもとにお話を伺います。この段階で、Webサイトの目的やコンセプトなどを明確化。目的やコンセプトは、はじめからお持ちでなくても大丈夫です。お話を伺いながら、ご提案して内容をすり合わせていきます。

2.情報設計

本ページで重点的に解説したのが、このステップです。目的とユーザーの行動を考えながら、サイトを設計します。

全体像はサイトストラクチャーによって可視化し、最適な導線を探っていきます。サイト内の回遊性をよくするだけでなく、資料請求などのゴールにスムーズに到達してもらえるように考察を重ねる過程です。

ページごとの見やすさはワイヤーフレームを作成して検討します。いったん弊社で案を作成した上で、何を、どの順番で、どのくらいのボリュームで見せるのか、見せ方はこれでいいかなど、クライアント様のご意見を伺いつつ進めてまいります。

3.制作・開発

ワイヤーフレームを元にデザインを起こし、コーディングしていきます。記事コンテンツや商品情報の更新を簡単にするシステムの実装を行うのもこの段階です。

デザインはユーザーにどんな印象を与えたいのか、目的をもって細部まで詰めていきます。色やパーツだけでなく、ホバーやスクロール時のアニメーションなど動きも印象に関わる部分です。細かな調整でユーザーに与える印象は大きく変わります。

Webサイトは言わば「会社の顔」です。雰囲気がユーザーのイメージとマッチしていることが重要であるため、クーシーでは細部にまでこだわります。

4.テスト

Webサイト公開前に機能やデザインを検証する段階です。問題なく公開できるようにチェックを行います。チェックの内容については以下の記事をご覧ください。弊社のWebサイト公開前のチェック項目をまとめてあります。

Webサイトを公開する前に必ずチェックすべきポイント20選【Webディレクター必見】

5. 運用改善

Webサイトは運用フェーズがとくに重要です。トレンドやシーズンに合わせた情報発信や更新が必要になるでしょう。

運用はクライアント様側でのアクションが主になりますが、どう進めていけばいいかわからなくなることもあるはずです。そんな時に必要なアクションやリソースの確保などについてご相談いただくこともできます。

クーシーのWebデザインは「ソリューション」

クーシーはWeb制作会社ですが、とくにデザインにこだわりを持っています。なぜならデザインを「ソリューション」と考えているからです。

洗練された見た目を作ることはもちろんですが、企業の目的をビジュアルをもって解決すること。そのための手段がデザインです。クーシーではデザインを制作する過程で、ソリューションとして機能するかを情報設計、ブランディング、UI/UX など多角的な視点でチェックしています。