難しい説明は「図解」で解決！外注で失敗しないインフォグラフィックの指示出し術

自社のWebサイトを作ったり、リニューアルしたりするときに、こんなことで悩んでいませんか？

「うちの会社のサービス、専門的すぎて文章で説明するのが難しい……」
「丁寧に説明しようとすればするほど、文字だらけになって読む気がしなくなる……」
「制作会社に図解を作ってもらったけど、なんかイメージと違う……」

特に、他の企業向けにビジネスをしている「BtoB企業」の場合、扱っている商品やサービスが複雑になりがちですよね。システムや機械の仕組み、導入までの流れ、料金プランなどを、文章だけでお客さまに理解してもらうのは至難の業です。

そこで大活躍するのが「図解（インフォグラフィック）」です。
図解を上手に使えば、パッと見ただけで「あ、そういうことか！」と直感的に理解してもらうことができます。

この記事では、Webデザインのわかりやすさを劇的にアップさせる「図解制作のコツ」と、プロの制作会社に外注するときに「失敗しないための上手な指示の出し方」を、専門用語を使わずに分かりやすく解説します。

最後まで読んでいただければ、「どうやって制作会社に伝えれば、イメージ通りの分かりやすい図解ができるのか」がハッキリと分かり、お客さまからの問い合わせが増えるWebサイトに一歩近づくはずです。それでは、さっそく見ていきましょう！

なぜ難しい説明には「図解（インフォグラフィック）」が必要なの？

そもそも、なぜ文章だけでなく「図解」を入れることがそんなに重要なのでしょうか。まずは、図解が持っているすごいパワーについて解説します。

テキストだけだと読者は「離脱」してしまう

みなさんは、新しく買った家電の「分厚い取扱説明書」を、最初のページから一文字も飛ばさずに最後まで読んだことがありますか？……おそらく、ほとんどの人が「いいえ」と答えるでしょう。

Webサイトを見るお客さまも、まったく同じです。
お客さまは、画面に表示された文字を「本を読むように」読んではくれません。流し読みをして、自分に関係ありそうなキーワードだけを「拾い読み」しています。

もし、あなたの会社のホームページが「文字の壁」のようになっていたらどうなるでしょうか。お客さまは「難しそうだから、読むのをやめよう」と、すぐに別の会社のサイトへ行ってしまいます。これをWebの業界では「離脱（りだつ）」と呼びます。

文章だけで説明しようとすると、お客さまは疲れて逃げてしまいます。難しい説明こそ、パッと見てわかる工夫が必要なのです。

「図解」が持つ3つのすごいパワー

そこで登場するのが「図解（インフォグラフィック）」です。インフォグラフィックとは、情報（インフォメーション）を視覚的（グラフィック）に表現したもののことです。つまり、かんたんに言うと「情報をまとめた分かりやすい図」のことです。

図解には、大きく分けて3つのすごいパワーがあります。

• パッと見てすぐに理解できる（直感的）：文字を読まなくても、矢印やイラストを見るだけで全体像がつかめます。
• 読む時間を短縮できる（時短）：忙しいビジネスマンにとって、短時間で要点がわかることは大きなメリットです。
• 記憶に残りやすい：人は、文字よりも絵や画像のほうが、頭の中に長く残ると言われています。

これらの効果について、さらに詳しく知りたい方は、参考になるインフォグラフィックの解説記事なども読んでみてください。情報を整理して見せるだけで、伝わり方が何倍にも跳ね上がります。

BtoB企業こそ、図解をフル活用すべき理由

とくに、企業を相手にビジネスをする「BtoB企業」は、この図解を絶対に活用するべきです。

なぜなら、BtoBの商材は「目に見えないもの」や「複雑な仕組み」が多いからです。たとえば、クラウドシステム（インターネット上で使えるソフト）の仕組みや、経営コンサルティングのサポート内容、工場で使う特殊な機械の導入手順などは、言葉だけで説明されてもなかなかイメージが湧きません。

また、BtoBの取引では、ホームページを見た担当者だけでなく、その上司や社長など「複数の人」が導入を決めることになります。担当者が上司に「この会社のサービス、良さそうですよ」と説明するときに、分かりやすい図解があれば、上司も「なるほど、それはいいな」と納得しやすくなります。

つまり、図解は「お客さまの社内プレゼンを手伝う強力な武器」になるということです。
より詳しいBtoB向けのデザイン戦略については、お問い合わせが増える企業サイトのデザイン設計の記事でも解説していますので、合わせて読んでみてください。

【図解 制作 コツ】外注前に準備すべき「3つのステップ」

「よし、うちのサイトにも図解を入れよう！」と思っても、いきなり制作会社に「図解作ってください！」と丸投げしてはいけません。
良い図解を作るためには、依頼する前に自社で準備をしておく必要があります。ここでは、外注前にやっておくべき3つのステップを紹介します。

ステップ1：誰に・何を・どうなってほしいかを決める

まずは、その図解を作る「目的」をハッキリさせましょう。これは、旅行に行く前に「目的地」を決めるようなものです。

• 誰に（ターゲット）：その図解を見るのはどんな人ですか？（例：ITに詳しくない工場の現場責任者）
• 何を（メッセージ）：一番伝えたいことは何ですか？（例：新しいシステムを入れると、こんなに手間が減るということ）
• どうなってほしいか（ゴール）：図解を見たあとに、どんな行動をとってほしいですか？（例：資料請求のボタンを押してほしい）

ここがブレていると、どんなにデザインがキレイでも「結局、何が言いたいの？」という図解になってしまいます。インフォグラフィックを作る前に決めるべきポイントを参考にしながら、まずは目的を言葉にして書き出してみましょう。

ステップ2：一番伝えたい「結論」を一つに絞る

図解を作るときにやってしまいがちな失敗が、「あれもこれもと情報を詰め込みすぎてしまうこと」です。

「自社の強みは5つあるから全部入れたい！」「細かいオプションの料金も全部表に入れたい！」という気持ちはよく分かります。しかし、情報が多すぎると、ごちゃごちゃしてしまい、一番大切なことが目立たなくなってしまいます。

1つの図解につき、伝えたいメッセージは「1つ」に絞りましょう。

たとえば、「他社との違い」を伝えたいなら、細かい機能の比較よりも「スピードが3倍速い！」という結論がパッと目に飛び込んでくるような図解にします。細かい情報は、図解の下にテキストや小さな表で補足すれば十分です。

ステップ3：テキストで「骨組み（構成）」を作ってみる

目的と結論が決まったら、いきなり絵を描くのではなく、まずは箇条書きのテキストで「骨組み」を作ってみましょう。

たとえば、「システム導入までの流れ」を図解にしたいなら、以下のように箇条書きにします。

1. お問い合わせ（Webから1分で完了）
2. ヒアリング（オンラインで現状の課題をお伺いします）
3. ご提案・お見積り（最短3日でお出しします）
4. ご契約・キックオフ（専任の担当者がつきます）
5. 運用スタート！

このように、情報の順番や内容をテキストで整理しておくだけで、制作会社は「あ、これを5つのステップの図にすればいいんだな」とすぐに理解できます。この骨組みを作ることが、失敗しない外注の第一歩です。

Webデザインの「わかりやすさ」を爆上げする！制作会社への上手な指示出し術

事前の準備ができたら、いよいよ制作会社に依頼（ディレクション）をします。ここでは、プロのデザイナーが「この依頼、すごく分かりやすくて仕事がしやすい！」と喜ぶ、上手な指示出しのコツをお伝えします。

「いい感じにお願いします」は絶対にNG！

制作会社を一番困らせる魔法の言葉、それが「プロなんだから、いい感じにお願いします」です。

「いい感じ」という言葉は、人によって想像するものがまったく違います。

あなたが「シンプルでスタイリッシュな図解」を想像していても、デザイナーは「カラフルでポップな親しみやすい図解」を作るかもしれません。そして出来上がったものを見て「違う、やり直し！」となってしまうと、お互いに時間と労力の無駄になってしまいます。

「いい感じ」ではなく、「なぜこの図解が必要なのか」「どんな情報を入れたいのか」を、先ほどのステップで作った骨組みをもとに、具体的に伝えるのが大事です。

ラフや手書きのメモを渡す（棒人間でもOK！）

言葉だけで伝えるのが難しい場合は、紙に手書きでラフ（簡単な下書き）を描いて、それをスマホで写真に撮って送るのが一番確実です。

「絵心がないから恥ずかしい……」と心配する必要はまったくありません。〇（丸）や□（四角）、矢印、そして棒人間のような簡単なイラストで十分です。

「ここに自社のキャラクターを置いて」「矢印はこっち向きで」「ここを一番目立たせて」という配置（レイアウト）のイメージが伝われば、あとはプロのデザイナーがそれを美しく整えてくれます。手書きのメモは、デザイナーにとって「宝の地図」のようなものです。

参考になる「他社の図解（リファレンス）」を見せる

イメージを伝えるためにとても効果的なのが、「参考になる画像（リファレンス）」を見せることです。

「こんな雰囲気の図解にしてほしい」「このサイトの、この部分の図解の作り方が好き」という実例を見せながら、「この図解の、色の使い方が自社のイメージに合っている」「この矢印の表現が分かりやすい」と、具体的に「どこが良いと思ったのか」を添えて伝えましょう。

同業他社だけでなく、まったく違う業界のWebサイトから探してくるのもおすすめです。言葉で100回説明するよりも、1枚の参考画像を見せるほうが、お互いの認識をピッタリ合わせることができます。

会社のイメージ（トンマナ）をしっかり伝える

「トンマナ」という言葉を聞いたことがありますか？これは「トーン＆マナー」の略で、デザインの雰囲気やルールのことです。かんたんに言うと「会社らしさ」「ブランドの性格」のようなものです。

たとえば、お堅い法律事務所のサイトに、急にアニメのようなキラキラした図解が出てきたら、お客さまは「えっ、本当にここに相談して大丈夫かな？」と不安になってしまいますよね。

図解を作るときは、Webサイト全体のトンマナに合わせることが重要です。
「テーマカラーの青をメインに使ってほしい」「真面目で信頼感のある雰囲気にしたい」「親しみやすさを出すために、少し丸みを帯びたデザインにしてほしい」など、どんな雰囲気の会社に見られたいかを伝えましょう。

素材の選び方やブランドイメージの作り方については、B2B企業の信頼を勝ち取る「素材選び」の極意の記事でも詳しく解説しています。

外注時にやりがちな「失敗」と、その防ぎ方

ここまで読んで、指示の出し方はバッチリだと思います。しかし、実際に制作が進んでいくと、思わぬ落とし穴にハマることがあります。よくある失敗とその防ぎ方を頭に入れておきましょう。

情報を詰め込みすぎて「迷路」になってしまう

デザイナーから上がってきた最初のデザイン案を見て、「あれ？なんかスッキリしすぎているな。せっかくだから、この情報も追加で入れてもらおう」と思ってしまうことがあります。

その結果、テキストや注釈がどんどん追加され、矢印が複雑に絡み合い、最終的には「どこから読めばいいのか分からない迷路」のような図解になってしまう……これは本当によくある失敗です。

図解の鉄則は「引き算」です。

情報を足したくなったら、深呼吸をして「これは本当に、この図解の中で一番伝えたいことだろうか？」と自問自答してみましょう。もし「補足情報」であれば、図の中には入れず、図の下に文章で書き足すようにしてください。余白（何もないスペース）を恐れないことが、分かりやすさの秘訣です。

パソコンとスマホで見え方が違う問題（レスポンシブ対応）

最近のWebデザインで絶対に忘れてはいけないのが、「スマホで見たときのわかりやすさ」です。
パソコンの大きな画面で作った複雑な図解を、そのままスマホの小さな画面にギュッと縮小して表示させると、文字が小さすぎて虫眼鏡がないと読めない状態になってしまいます。

これを防ぐためには、制作会社に最初から「パソコン用とスマホ用で、図解を作り分けてください（あるいは、スマホでも読みやすいように作ってください）」と指示を出しておくのが大事です。

たとえば、パソコンでは横長の図解にして、スマホでは縦に並べ替えるなど、画面のサイズに合わせてデザインを変える工夫（レスポンシブデザインと言います）が必要です。完成した図解をチェックするときは、必ず自分のスマホでも表示させて、文字が読めるかどうかを確認しましょう。

修正の嵐！やり直しを防ぐための「チェックのタイミング」

「完成した図解を見たら、中身の文章が間違っていた！デザインはいいから、文章だけ直して！」
……実はこれ、デザイナーにとっては「一から作り直し」と同じくらい大変な作業になることがあります。文字の長さが変わると、それを囲む枠の大きさや、全体のレイアウトまで全部調整し直さなければならないからです。

このような「後からの大きな修正」を防ぐためには、チェックする順番を守ることが大切です。

1. テキスト（原稿）の確定：まずは文章や情報に間違いがないか、社内で完全にチェックを終わらせます。
2. 白黒のレイアウト確認：デザイナーに、色やイラストを入れる前の「簡単な枠組み（ワイヤーフレームと言います）」を作ってもらい、配置のバランスを確認します。
3. 色・デザインの確認：最後に、色や装飾がついた完成形をチェックします。

この順番を守るだけで、お互いのストレスが激減し、スムーズに制作が進みます。もっと詳しい修正依頼のコツについては、やり直しを防ぎ、イメージ通りに仕上げる「修正依頼」の極意もぜひお読みください。

よくある質問（FAQ）

ここでは、図解（インフォグラフィック）の制作について、よくいただく質問にお答えします。

まとめ：図解を味方につけて、伝わるWebサイトを作ろう

いかがでしたでしょうか。今回は、BtoB企業の難しいサービスを分かりやすく伝える「図解（インフォグラフィック）」の重要性と、制作会社への失敗しない指示出しのコツについて解説しました。

ここまでの大切なポイントを振り返っておきましょう。

• 文章だけの説明は、お客さまを疲れさせて離脱させてしまう。
• 図解は「パッと見てわかる」「時短になる」「記憶に残る」という強力なパワーがある。
• 外注する前に、「誰に・何を・どうなってほしいか」を決め、一番伝えたい結論を一つに絞る。
• 「いい感じ」はNG！手書きのラフや参考になる画像を見せて、イメージを具体的に共有する。
• 情報を詰め込みすぎず、スマホで見たときの文字サイズにも注意する。

Webサイトは、あなたの会社の「24時間働く優秀な営業マン」です。
営業マンが商談のときに、分かりやすい資料や図解を使って説明するように、Webサイト上でもお客さまに寄り添った「分かりやすさ」を用意することが、お問い合わせや売上を増やすための最大の近道になります。

「自社のこのサービス、どう図解にすればいいか分からない……」「いまのサイトが文字ばかりで、お客さまに伝わっているか不安だ」とお悩みの方は、ぜひ一度プロに相談してみてください。

コレットラボでは、BtoB企業の複雑なビジネスモデルをひも解き、お客さまに「なるほど！」と伝わるWebデザインや図解の制作を得意としています。現状のサイトの無料診断も行っておりますので、「まずは話をきいてみたい」という方は、ぜひお気軽にお問い合わせください。