ワイヤーとデザインの役割がズレてしまったお話。

こんばんは！
Webデザイナーの中野です。

気づけば12月。
今年を振り返ると、個人的には「ワイヤーをたくさん作った一年」でした。

ワイヤーとは、ページごとに「どのような情報」を掲載するか「構成要素」を定義する工程のこと。

これまでデザイン業務が中心だったのですが、今年はホームページ制作全体を見渡す立場で関わることが増え、いわゆる「ディレクション寄り」の仕事に足を踏み入れた感覚があります。

そんな中で、このワイヤーの役割とデザインの役割について、改めて考えさせられる出来事がありました。

Webサイト制作の流れ

一般的なWebサイト制作は、次のような工程で進みます。

STEP1：プロジェクト企画 ホームページ作成目的の明確化

Web制作をする目的やゴール、ターゲットやコンセプトを決定します。

STEP2：Webサイト設計

企画の内容が決まったら、ホームページの設計段階に入ります。
例えば、ブランディングの構築や、コンテンツ企画 、サイトマップ。そして今回話題となる「ワイヤーフレームの制作」がここに含まれます。

STEP3：デザイン制作

このstep2の構成をもとに、メインとなる色やレイアウト、フォントや素材などから、デザイン制作が始まります。

STEP4：実装 コーディング

このデザインをインターネット上で見えるようにするために、フロントエンドによるコーディングやCMSの構築がはじまります。
実際の表示やアニメーションをクライアント様と確認します。

STEP5：ホームページ公開

ついにリリース！

という流れが一般的です。
この流れの「STEP2：Webサイト設計」におけるワイヤー作成に私は関わることが多かったです。

ワイヤーを渡した時に感じた違和感

ある案件で、作成したワイヤーをもとにデザインを依頼しました。
その時ふと、こんな疑問が浮かびました。

このワイヤーに色をつける作業を「デザイン」と捉えるべきなのか
それとも、デザインの力で訴求内容をさらにブラッシュアップしていくべきなのか


実際のやり取りがこちら↓

----------------------

デザイナー　「これは色付け（ビジュアルデザイン）ですよね？」

私 「デザインで、もっと訴求を強めてほしい」

----------------------

という、ちょっとしたズレが生まれていました。

結論：どちらも正しい。でも前提が共有されていなかった

今回のケースの場合は、デザインは「色付けだけ」も「訴求を高める」も、どちらも正しいという結果になりました。

問題だったのは、
「このワイヤーを、どこまで完成形として扱うのか」

という前提が、十分に共有されていなかったことでした。

ワイヤーの役割を整理してみる

今回私が作っていたワイヤーは、

• 情報設計がかなり固まっている

• ユーザー視点で、分かりやすさを重視している

• 構成や順番、テキストの粒度も細かい

いわば「構成案＋UX設計＋簡易コピー」を含んだワイヤーでした。

そのため、デザイナーの目線では 「設計はすでに完了している＝あとは見た目を整えるフェーズ」
と捉えられても不思議ではありません。

デザイナーが想定する「デザイン」の役割

多くの場合、デザイナーが想定するデザイン業務は、

• レイアウトや構成は固定

• 情報の意味は変えない

• 配色・トンマナ・余白・装飾で整える

いわゆる、視覚的に整理し、整える仕事です。

この前提で見ると、 今回のワイヤーは「完成度が高すぎた」とも言えます。
（自分でいうのもアレですが。）

結局「デザインでのブラッシュアップ」は必要か

一方で、私が期待していたのは、

• 強調すべき箇所の見せ方を変える

• 情報の優先度をビジュアルで整理する

• 写真や余白、視線誘導で感情に訴える

といった、 UI・ビジュアルの力で「伝わり方」を再設計することでした。

これはデザイナーの思考領域でもありますし、
ディレクターとして期待する内容でもあります。
私の中では「できてあたりまえ」と思ってしまったのです。

では、今回の「色付けでいいのか」「ブラッシュアップするべきなのか」問題において、
このズレを解消するためにどうすればよかったのか。

行きついた答えは「役割分担の言語化」

はい。今回の反省点です。

「レイアウト変更はOKか」「要素の統合・分解はしていいのか」「コピーの見せ方は変えていいのか」

こうした役割分担を、事前に言語化できていなかっただけでした。

この事前に何を伝えれば、完成品に相違のないものが出来上がってくるのか。
という事前共有内容をまとめることが苦手なのだなと改めて思いました。

なので、来年は、前提をきちんと共有できるコミュニケーションを目標にしたいなと思いました。