ビズリーチのコミュニケーションデザイン室では、「明日から活用できる引き出し」をテーマに、デザイン業界の第一線で活躍されているさまざまな方を講師にお招きし、業務やキャリア開発に生かす勉強会をはじめました。

第2回目の勉強会は、事業戦略からブランディング、マーケティング、クリエイティブまでワンストップで提供し、クライアントの課題解決をしているUNITBASEの上村正敏さんと、宮内一政さんをお招きしました。

講師紹介

上村正敏　Masatoshi Kamimura
UNITBASE 代表取締役／プロデューサー
京都府生まれ、複数のWeb制作会社にてデザイン・ディレクション・プロデューサー業務に従事した後、2013年に株式会社UNITBASEを設立。主に企画立案担当。

宮内一政　Miyauchi Kazumasa
UNITBASE 執行役員／デザインディレクター
神奈川県生まれ。2015年に株式会社UNITBASEに参画。主にデザインディレクションを担当。

右：上村正敏　Masatoshi Kamimura／左：宮内一政　Miyauchi Kazumasa

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%EF%BC%88%E5%8F%B3%EF%BC%9A%E4%B8%8A%E6%9D%91%E3%81%95%E3%82%93%EF%BC%8F%E5%B7%A6%EF%BC%9A%E5%AE%AE%E5%86%85%E3%81%95%E3%82%93%EF%BC%89%3C%2Fp%3E

UNITBASEについて

実は前回の、田渕さんの勉強会に参加させていただいてました。そこで皆さんから出た質問に対して、今日は僕たちがどんな取り組みや考え方で仕事しているのかをお話ししたいと思います。

前回出てきた質問は、大きく3つ。

どうしたらノンデザイナー（マーケターや営業や経営者）に、デザインを承認してもらいやすくなるのか？
どうすればプロジェクトを円滑に進行できるのか？
どうすれば効果的な施策にすることができるのか？

これらを話す前に、まずUNITBASEについて紹介させてください。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Funit-base.com%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3Ehttps%3A%2F%2Funit-base.com%2F%3C%2Fa%3E%3C%2Fp%3E

UNITBASEは、FICCというデジタルマーケティングエージェンシーにいた僕たちが、独立してつくったWeb制作会社です。そのため、Web制作業界の中ではマーケティング色が強い方だと思います。実働は4名（プロデューサー／ディレクター／デザイナー／フロントエンド）と少ないのですが、戦略領域からデザインまでサポートするクリエイティブチームです。

私たちはデザインを提供する際は、ロジカルに提案することを心掛けています。それは提案をさせていただく方々が、普段デザインに触れていないマーケターやブランドマネージャー、経営者といった方々だから。その方々に提案するデザインから生み出される価値を正しく理解してもらうことで、その先にいる消費者の方々にもより良い体験を提供できると考えています。

また、ビジネスにおいてコンテンツだけでなくタイミングも非常に重要な要素だと考えており、4人という少ないチームではありますが、すべてのプロジェクトが破綻せず期日通り公開するために、徹底したプロジェクト管理を心がけています。

今日は皆さんの質問に対して、「感覚や直感に依存しないデザイン制作術」といったテーマで、私たちが普段どのような取り組みを行っているかを以下の3つの内容でお話ができればと思います。

ノンデザイナーへのデザイン提案術
破綻しないプロジェクトマネジメント術
デザインの価値を高める提案術

ノンデザイナーへのデザイン提案術

プロジェクトの関係者には、デザイナーの他に、営業、マーケター、経営者、ブランドマネージャーなどさまざまな方がいます。同じブランドの関係者であっても、普段接しているものも違うと、どうしても言っていることがうまく伝わらないとか、ニュアンスを汲み取れず形にできないといったことが、多々あるんじゃないかなと思います。
僕らもそういう場面はあって、そんな時にどうコミュニケーションしているのかお話しします。

感覚で判断させない

ニュアンスがうまく汲み取れない時のデザインのフィードバックに、「あんま好きじゃない」「面白くない」「新しくない」「伝わってない」「〜っぽさがない」などがあると思います。

こんな時にどうすれば良いのかというと、僕らは基本的に、デザインを感覚だけで判断しないようなコミュニケーションを意識しています。

例えば「もっと赤い方がいいんだよね」といったフィードバックがあった場合、なぜもっと赤くしたいのかという意図を確認します。デザインで何を達成したいのかによって、そもそも赤が良いのかどうかを判断する必要がありますし、「もっと赤くする」にしても明るさ、濃さ、彩度など、選択肢はさまざま。このように実現したいことと、正しい表現が何であるのかを言語化することで感覚で判断することを避け、正しいクリエイティブを目指すようにしています。

共通の評価軸となる情報に沿ってデザインの提案を行う

関係者が多い中でプロジェクトを進めていくといろんな意見や要望がでてきて、アウトプットに集約するのが困難になることがあると思います。そんな時は、変わらない情報を軸に軌道修正をするようにしています。

基本的にお仕事する際は目的があり、その目的を達成するために各プロジェクトが動いているはずです。ですので、「目的が何なのか」を相手の担当者の方と必ず認識合わせをしながら進めています。

さらに、デザインをするときにまず確認するのは「決裁者は誰か？」とういうことです。決裁者によって欲しいものが全然違うからです。

例えば、「決裁者は社長です」と言われた場合、細かいアイコンの形まで気にするはずがないんですよね。目的に対して、ワークするのかってことを気にするはずなので、決裁者に合わせて物事を判断するようにしています。

【変わらない情報の例】

目的・戦略・ビジョン・理念
ブランドガイドライン・ブリーフシート・要件定義・確定事項
ペルソナ・カスタマージャーニー
消費者ニーズ・インサイト・市場動向・競合動向
製品・サービス特徴・ポジショニング
過去実績データ・類似事例データ

ルールやセオリーに沿ってデザインの提案を行う

ノンデザイナーの方々にデザインを提案するときは、デザインをする上でのルールやセオリーに沿って説明することが多いです。

例えば黄金比というものが、世の中でとてもいいバランスのもので美しいとされているということを、ノンデザイナーの方達は知らないことが多いです。タイポグラフィも、「これは非常に歴史があるタイポグラフィです」とか、色の効果でも「青を使えば落ち着くような心理効果がある」とか、さまざまなルールやセオリーをみなさん取り入れていると思います。

興味喚起と可読性の担保によるブランド理解を目指した GOSHU PROMISE のデザインルール

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E8%88%88%E5%91%B3%E5%96%9A%E8%B5%B7%E3%81%A8%E5%8F%AF%E8%AA%AD%E6%80%A7%E3%81%AE%E6%8B%85%E4%BF%9D%E3%81%AB%E3%82%88%E3%82%8B%E3%83%96%E3%83%A9%E3%83%B3%E3%83%89%E7%90%86%E8%A7%A3%E3%82%92%E7%9B%AE%E6%8C%87%E3%81%97%E3%81%9F%20GOSHU%20PROMISE%20%E3%81%AE%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%AB%E3%83%BC%E3%83%AB%3C%2Fp%3E

ただ、冒頭のテーマでもある「感覚的に判断をさせない」という点で、例えば「僕は黄金比を美しいとは思わない」と言われたとしても、「大多数の人が美しいとされています」という風に、ルールやセオリーをうまく活用してデザイン提案していくと、理解は得られやすくなると思います。

【ルールやセオリーの例】

四原則・黄金比・白銀比・グリッドシステム
タイポグラフィ
歴史・トレンド
閲覧環境・UI・導線設計・アクセシビリティ
認知心理学・行動心理学
色彩学・錯視効果

戦略との合致を証明する

デザインが目的に沿ってるかどうかは、全て言語化するようにしています。
なぜこの絵なのか、なぜこの文字なのか、なぜこの余白なのか、なぜこの色なのか。
すべて戦略に沿っていることを説明するために、デザインを作った後にこんな感じのメモを作ります。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%82%92%E8%A8%80%E8%AA%9E%E5%8C%96%E3%81%97%E3%81%9F%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%3C%2Fp%3E

一つ一つの理由があることで理解を得られやすく、「戦略と合致したデザインだから、これでいきましょう」となりやすいです。要素に対して言語化して説明するこの作業の時間を、あらかじめ確保して進行するようにしています。その代わり、デザインは複数案は基本作らないです。

CX（カスタマーエクスペリエンス）マップ

私たちはWebサイトの情報設計を行う際に、デジタルのタッチポイントを軸にしたCXマップを用いて構築しています。
これは、FICCでもさまざまなプロジェクトで使用されているパーセプションフロー・モデルという、Coup Marketing Company 音部大輔氏考案のマーケティング・マネジメント・モデルを参考にしたフレームワークを簡略化したものです。

内容はカスタマージャーニーマップと似ていると感じるかもしれませんが、パーセプションフローモデルは主観ではなく顧客の態度変容を軸に描かれているのが特徴です。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E3%83%98%E3%82%A2%E3%82%AB%E3%83%A9%E3%83%BC%E8%A3%BD%E5%93%81%20Web%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AECX%E3%83%9E%E3%83%83%E3%83%97%E4%BE%8B%3C%2Fp%3E

これは、ヘアカラー製品のWebサイトを作る際のCXマップです。

例えば僕が対象となる製品やサービスを使ってないユーザーだとして、そもそも興味がないと購入しないし、SNSでも拡散しないと思います。興味がないと理解もしないし、理解しないと買わない。そういったものを順序立てて、誰に対して、どのタイミングで、何をするのかをまとめたものです。基本的に僕らがやっているデザインは、これに沿って落とし込みをしています。

内容は結構複雑そうに見えるかもしれないですが、デザインで達成しなければいけないことを言語化しているものです。マーケティングにおいて、それぞれの場所でどういったことを成し遂げないといけないのかを、マーケターや営業担当の人たちと相互認識とるための表として使っています。

次に、先ほどのCXマップをもとに、Webサイトの中でどう情報を構成するかをまとめたものです。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E5%8C%97%E6%AC%A7%E3%81%A7%E6%84%9B%E3%81%95%E3%82%8C%E7%B6%9A%E3%81%91%E3%82%8B%E5%9B%BD%E6%B0%91%E7%9A%84%E3%83%9C%E3%83%87%E3%82%A3%E3%82%B1%E3%82%A2%E3%83%96%E3%83%A9%E3%83%B3%E3%83%89%20%E3%83%90%E3%83%BC%E3%83%8D%E3%83%B3%E3%82%B2%E3%83%B3Web%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E6%A7%8B%E6%88%90%E4%BE%8B%3C%2Fp%3E

これを、CXマップで順序立てて言語化し、説明しています。

どんな絵にするかというよりは、課題を解決するためのクリエイティブをどうするかを、落とし込むために活用しています。

このように、ノンデザイナーの方々に、デザインの意図や戦略との合致を伝えて、合意をいただけるように準備し、提案を行なっています。

破綻しないプロジェクトマネジメント術

プロジェクト進行において遅延する要素は、下記のように数多く存在します。
これらをできるだけ回避するための方法をお話をします。

【遅延する要素の例】

突発の仕様変更で、確定事項の変更
言った、言わないのコミュニケーションミス
複数プロジェクトの進行
コミュニケーションチャンネルが多い（メール、Slack、電話など）
ステークホルダー間の認識のズレ
プロジェクト全体の進行管理者が不明確

プロジェクトの一貫性を担保するために打ち合わせ時には必ず議事録をとる

当然のことですが、議事録は徹底してとるようにしています。

言った言わないという事象は発生するし、参加していない人にも共有ができるので、必ずとりますし、議事録のつけ方も全員同じルールで統一しています。

【議事録の内容】

目的：決定事項の相互認識、認識齟齬の払拭、ネクストアクションの明示
内容：議題、決定事項、ToDo
決定事項を明確に：事実のみを記載、簡潔にまとめる
タイトル：日時、場所、参加者を記載する
準備：アジェンダをあらかじめ議事録に記載しておく
共有：MTGに参加した出席者全員に共有する
合意：参加者から確認・承認をもらう

円滑にプロジェクトを進行するために

どこか漏れがあったり、これどうなってるのと？となることはよくある話なので、プロジェクト進行に必要な全ての情報を１つのシートにまとめた、「PM（プロジェクトマネジメント）シート」で管理するようにしています。

【管理する情報】

要件定義・KPI
プロジェクト概要
ターゲットのニーズ
スケジュール
SLA（Service Level Agreement）
議事録
ワイヤーフレーム
予算管理
関係者一覧、連絡先
確認項目
サイトマップ、ページ一覧
成果物別タスク
修正内容
質問回答（案件進める中で出てきた質問）
デザイン
素材管理（格納場所）
ディレクトリマップ、サイトマップ、META情報
計測項目（アナリティクスのイベント名や設定したゴールなど）
アカウント管理

PMシートの一部、デザインのシートでは、スマホデザインの実機確認をスムーズにするためQRコードが表示される

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3EPM%E3%82%B7%E3%83%BC%E3%83%88%E3%81%AE%E4%B8%80%E9%83%A8%E3%80%81%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%AE%E3%82%B7%E3%83%BC%E3%83%88%E3%81%A7%E3%81%AF%E3%80%81%E3%82%B9%E3%83%9E%E3%83%9B%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%AE%E5%AE%9F%E6%A9%9F%E7%A2%BA%E8%AA%8D%E3%82%92%E3%82%B9%E3%83%A0%E3%83%BC%E3%82%BA%E3%81%AB%E3%81%99%E3%82%8B%E3%81%9F%E3%82%81QR%E3%82%B3%E3%83%BC%E3%83%89%E3%81%8C%E8%A1%A8%E7%A4%BA%E3%81%95%E3%82%8C%E3%82%8B%0A%3C%2Fp%3E

このシートの内容は、プロジェクトが進行するにつれてどんどんアップデートされていくので、認識合わせのMTGを週1〜2回実施するようにしています。

PMシートの内容を、いくつかご紹介します。

タスク管理：
タスクの詳細、担当、納期、進捗を管理します。

SLA（Service Level Agreement）：
ブラウザ対応の範囲を定義。
これをやらないと、後になって「私の環境で見れない」といったことが発生するため。クライアントの案件だと、動作検証会社に依頼をするようにしています。

質問回答シート：
作っているうちに出てくる質問をまとめて、時にはこのままクライアントに渡して直接回答してもらうこともあります。

制作物一覧：
何をつくらなければならないのか、全ての制作物がわかるようにしています。

サイトマップ、ページ一覧：
ファイルの格納の定義や、META情報をまとめています。

素材一覧：
「あの素材誰が持ってるの？」ということが発生するので、素材の格納場所をまとめています。

GA（Google Analytics）のイベント管理：
どの要素で、何のイベントを取得するのかまとめています。

このシートは、ディレクターやプロジェクトマネージャーの人が更新するようにしているのですが、定例のミーディングでも更新するようにしています。

最初からこのシートを使って案件を進めていたわけではなく、いろいろと課題を感じて「やっぱり必要だよね」というタイミングがあって、PMシートを作成しました。アップデートを繰り返して今の内容になっていますが、プロジェクトの都度シートの内容を見直すようにしています。

このように、スムーズにプロジェクトが進むよう、情報の管理を徹底しています。

デザインの価値を高める提案術

最後に、提案するデザインの価値を高めるために私たちが考えていることについてお話をさせていただきます。

デザインを課題解決のソリューションに

経営者やマーケティング担当者から見ると単純な制作費はコストであり、できる限り削減したいと考える項目となります。デザインの価値を高めるには、オペレーションのような制作を行うのではなく、デザインを彼らの経営課題を解決するためのソリューションとして提案をする必要があります。

デザインをコストではなく、ソリューションとして提案することができれば、より決裁権を持つ担当者と協議することが可能となり、戦略や目的、本件でチャレンジすべき仮説などを明確にした上でのソリューションであれば再現性も高くなり、成功しても失敗したとしても、それは企業の資産とすることができます。

【制作・オペレーション → 課題解決・ソリューション】

制作・オペレーションはコスト
ビジネス課題解決は投資・チャレンジ
ビジネス課題解決なら決裁者と協議ができる
チャレンジは成功も失敗も資産になる

デザインだけでなく、ビジネス視点も

デザインを事業課題を解決するソリューションとするために、デザイナーはデザイン以外にもビジネスの内容や市場、社会にも興味を持って視野を広げると良いと考えます。

具体的に関心を持つべき項目のひとつは、お金です。

自分が作ったものからユーザーが行動をして、どのように売上に繋がっているかについてもっと興味を持つと良いと思います。さらに、市場や競合、デザイン以外のテクノロジーやマーケティングの分野などに興味を持っていくと、デザインの価値を高める材料になると思います。

【ビジネス課題を知る方法の例】

事業に興味を持ちましょう（事業戦略／有価証券報告書など）
売り上げについて興味をもつ（損益計算書／貸借対象表など）
市場に興味を持ちましょう（ニーズ／調査データなど）
競合に興味を持ちましょう（業界ニュース）
新しいテクノロジーやサービスに興味を持ちましょう
マーケティングに興味を持ちましょう

結果に責任をもつ

デザインの価値を伝える手段の一つとして、クライアントが私たちに支払っていただいているコストに対して、ROIがどうなのかは企画の段階でKPIと合わせて具体的に提示するようにしています。

ソリューションなので投資いただいた費用に対してどのような成果を提示できるのかを明確するにすることで、クライアントは経営判断がしやすくなります。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E3%82%AD%E3%83%A3%E3%83%B3%E3%83%9A%E3%83%BC%E3%83%B3%E6%96%BD%E7%AD%96%E3%81%AEKPI%E3%83%9E%E3%83%83%E3%83%97%E4%BE%8B%3C%2Fp%3E

事前のROIやKPIで合意を頂いている為、最終的な効果がどうだったのかレポーティングすることも非常に大切です。数値だけでなく仮説に対する結果や考察など、良かった点だけでなく悪かった点も明確にすることで次の施策に生かす資産とできるように心がけています。

全てのプロジェクトで詳細な計測データを開示いただける訳ではないので、その場合は担当者の方へヒアリングをさせていただいたり、共有会などの機会を設けさせていただいたりしています。

レポーティングはクライアントだけでなく、制作者のモチベーションにもつながるので、ヒアリングの際にはなるべく関わったメンバーは全員でお話を聞きに行ける機会を作るようにしています。

%3Cp%20style%3D%22font-size%3A%2012px%3B%20text-align%3Acenter%3B%20margin-top%3A%20-4px%3B%20line-height%3A1.4%3B%22%3E%E3%82%AD%E3%83%A3%E3%83%B3%E3%83%9A%E3%83%BC%E3%83%B3%E6%96%BD%E7%AD%96%E3%81%AE%E6%88%90%E6%9E%9C%E3%83%AC%E3%83%9D%E3%83%BC%E3%83%88%E4%BE%8B%3C%2Fp%3E

このように、デザインの価値を高められるよう、生み出される効果を明確にすることを大切にしています。

まとめ

これまでお話してきたように、デザイナー以外の方々にもデザインの意図を伝えたり、スムーズにプロジェクトが進むように管理したり、デザインの価値を高めるために生み出される効果を明確にして、お客さまの課題解決を解決できるように仕事をしています。

デザインの価値を伝えるために、私たちデザイナーがやらなければならないことはまだまだたくさんあると思うので、これからも努力を続けていこうと思います。

以上となります、今日はありがとうございました。

ビズリーチへメッセージ

UNITBASEは制作プロダクションではあるのですが、クリエイティブを極限まで研ぎ澄ますよりも、その価値を多くの方に理解してもらうための努力に時間を割くようなお仕事をしているチームです。

今回お話する内容は正直デザイナーの皆さんには退屈な内容かなと思ったのですが、そんな心配を吹き飛ばすくらい沢山の意見や質問を投げかけていただき、私たちも非常に刺激になりました！

デザイナーとして事業に最も近い場所で日々業務に携われているこの素晴らしい環境で、皆さんがさらに成果を出すお仕事するための一助になれば幸いです。

おわりに

今回は、UNITBASEの上村さんと宮内さんに、価値をより良く理解してもらうためのデザイン制作についてお話いただきました。

UNITBASEでやられているような精度で、資料に落とし込む機会は多くはないので、今回のお話はとても刺激を受けた内容となりました。

この勉強会後に、さっそくプロジェクト管理シートの運用を始めたり、CXマップの考え方を取り入れたり、議事録のルールを設けるなど、伺った内容を業務に生かしているメンバーもいて、それぞれに学びや気付きがあった勉強会となりました。

これからも定期的に勉強会の内容をお届けしてまいりますので、お楽しみに！