設計のヒントを生み出すコンテンツ要素の視覚化

今後のコンテンツ配信、これからの Web と人との関係を考えると、ページというメタファが足かせになることがあります。Webサイト設計者はページという概念を捨ててデザインをしなければならないと、CSS Nite in TAKAMATSU vol.6をはじめ、幾つかの講演を通して話してきました。

とは言うものの、現状 Webページという情報を束ねる単位は必要とされていますし、何か枠組みがなければデザインすることもできません。もちろん、ページを作るなと言っているわけではなく、ページを作る前に、まずはページから離れてコンテンツの設計を始めたほうが良いという意味です。ページという四角形の枠組みの中に、コンテンツやナビゲーションといった要素をパズルのように置いていく作業に入る前に、コンテンツの全体像を掴む必要があります。

コンテンツを細分化し、関連づけさせることで、実際のページ設計に役立つだけでなく、運営やシステム構築にも重要な役割を果たします。

ここで言う細分化とは、プレスリリース、製品情報ではなく、さらに細かくした状態を指します。プレスリリースであれば、以下のように細分化できます。

• タイトル
• サブタイトル
• 概要
• 本文
• リリース日
• 更新日
• 担当者
• メディアファイル
• サムネイル
• メタデータ

細分化した状態は、レゴブロックの部品のような存在といえるでしょう。部品を組み合わせて家（ページ）を作り、たくさんの家が街（サイト）を形成すると想像してもらえば良いと思います。

これら細分化された部品は、プレスリリースというコンテンツを作るためにあるだけでなく、他のコンテンツと繋がる部品になる場合があります。例えば、同じ月日のプレスリリースを出したり、プレスリリースに関連した製品情報を出すといったことができます。さらに、ソーシャルメディアやランディングページなど、Webサイトから少し離れたところにコンテンツを広げるためのトリガーになることもあります。

コンテンツを小さな単位に切り崩していくことで、どの部分が他のコンテンツとどう繋がり、拡散していく姿が見え始めてきます。利用者はコンテンツとどう関わり、読み進み、共有したり、お問い合わせ・購入へ進むのかという導線作りのヒントにもなります。細分化は、ページの枠を超えて、情報がどう繋がり、広がるのかを見るために役立つわけです。

コンテンツを細分化し、様々なコンテンツとの関連性を視覚化すると、以下のような図になります。

不動産物件のコンテンツを細分化、全体の関連性を把握した例。

もちろん上図は、サイトの一部でしかありませんが、このわずかな部分を見るだけでも様々なヒントが見えてきます。

IA専門家

より詳細なページ設計が可能になります。また、どのページがどう繋がるのかといったサイト全体構造だけでなく、利用者の動向に合わせたストーリー作りのにも役立ちます。

Webマスター

コンテンツを配信する際に、どういった情報が必要なのかが明確になるだけでなく、どのような手法で情報拡散できるのかのシミュレーションができるようになります。

デザイナー

部品の単位を把握することで、分かりやすい見せ方、魅力的なビジュアルを早期から模索できるチャンスを得ることができる。部品をどう『リミックス』するかという新たな挑戦に立ち向かえる。

CMS開発者

どのコンテンツタイプで、どのような入力フィールドが必要なのかが明確になります。ページを埋める大きな箱ではなく、データを繋げて、広げるためのシステム構築が可能になります。

わざわざこうした視覚化の作業は必要ないと思えるかもしれませんが、細分化をするだけでも、「こんな情報がいるのか」という気付きを与えてくれることがあります。あって当たり前と思える情報が実はないということもありますし、すべての情報を集めて配信するには、どのような体制でどういったワークフローが必要なのかという課題も明確になります。視覚化はページの枠を超えた情報設計の必要性を、ひとりでも多くの方に知ってもらうための有効なツールになるはずです。