コピーライターからディレクター（Webディレクター）への転身は、Web制作会社や、僕たちのようなブランディング会社ではよくあるキャリアチェンジだと思います。僕自身もその経験者です。その過程で必ずと言っていいほど直面するのが、「ワイヤーフレーム制作が難しく、異常な工数がかかる」という問題です。

僕もこの壁にぶつかりましたが、ワイヤーフレームに対する考え方や取り組み方を少しずつ変えていくことで、克服しました。今回のブログではその方法を紹介したいと思います。コピーライターはもちろん、デザイナーやエンジニア、プランナーからディレクターに挑戦する方々も、ぜひ参考にしてください。

ワイヤーフレームはデザインではなく情報設計だと認識すること

ワイヤーフレームは、Webサイトの設計図です。サイトに掲載する情報を整理し、目的に沿った順番で、成果につながる形で表現するフレームワークです。しかし、コピーライターからWebディレクターになった当初の僕は複雑に考えすぎていて「デザインの下書き」「仮デザイン」というイメージを持ってしまい、全く手が進みませんでした。美しく見せなければならない、というプレッシャーに囚われていたんです。

「ワイヤーフレームをつくろう」ではなく「文章を書こう」

経験を積む中で、「ワイヤーフレームはデザインではなく情報設計だ」という認識を持つようになり、今ではストレスなく作成できるようになりました。僕が意識しているのは、「ワイヤーフレームをつくろう」ではなく、「文章を書こう」というスタンスです。まずはドキュメントに文章として書き出すことから始めます。テキストベースで伝えるべき情報を選定し、優先度に従って整理し、その後に視覚化していくと、作成がスムーズに進みます。

とある企業のコーポレートサイトをつくるとしましょう。サイトの目的が「問い合わせ数の増加」だとすれば、まずは問い合わせを促す情報や、問い合わせの障壁となる不安を解消する情報を明確にします。これらの情報を優先度に応じて整理した後、キャッチコピーと本文の方向性をドキュメントで調整します。ここではデザイン要素は一切考慮しません。テキストで情報を設計することに集中します。ここでデザイン要素を求めてしまうと、伝えたいことが伝わらない、目的からズレた設計になってしまう可能性があります。

遠慮なくデザイナーや他の職種の仲間を頼ろう

ドキュメントで納得のいく情報設計ができたら、デザイナーに依頼するなり、意見交換するなりして、見栄えを整えていきます。figmaやAdobeXDといったツールを勉強しようか迷った時期もありましたが、社内で得意な人がいるから必要ないと判断しました。それよりも得意分野に特化して連携したほうがいいなと。ワイヤーフレーム制作を任された責任から自分ですべてやりたいとなる気持ちはわかりますが、グッと我慢したほうがいいです。

コピーライターからWebディレクターへ。テキストライティングからワイヤーフレーム制作へ。全く違う領域へ踏み出すイメージを持たれるかもしれませんが、情報設計という点においては、そこまでやることは変わりません。ワイヤーフレームは、デザインではなく情報設計。この原則を理解していれば、コピーライターからWEBディレクターに転身しても、そこまで大きく苦しむことはないんじゃないかなあと思う今日この頃です。

【採用募集】トゥモローゲートはコピーライターもWEBディレクターも絶賛募集しています