デザインカンプとは?ワイヤーフレームとの違い

ウェブサイト制作の基本的な流れではまず最初に、「ワイヤーフレーム」で骨組みを作ります。その骨組みを元に「デザインカンプ」と呼ばれる完成イメージを作ります。

ウェブの制作には混同しやすい用語が多くありますが、今回はこの2つに焦点を当てて1つずつご紹介していきます。

ワイヤーフレームとは?

ワイヤーフレームとは、どこに何を配置するかというサイトのレイアウトのことを示します。実際にデザインを決める前に作るもので、最終的なデザインを決定する骨組みの役割になります。例えると絵を描くときの下書きのことです。

サイトのどの場所に写真を入れるのか、どこに記事を置くのか、どこに広告を配置するのかなどを考える作業で、共同でサイトを作るときや外部の業者にデザインしてもらうときなどに方向性を決めるのに役立ちます。

デザインカンプとは?

デザインカンプは完成見本のことを示します。ワイヤーフレームが骨組みや基礎の部分であるのに対し、こちらは実際にデザインを組み込んだものとなっています。

クライアントのニーズに合わせてデザインを決め、このデザインカンプをいくつか作って提案するといった使われ方をすることが多いです。

カンプとは「Comprehensive Layout」の略称で、配置や配列を意味する単語です。デザインカンプを省略して「カンプ」と呼ばれたりします。

まとめ

ワイヤーフレームが基本にあり、それを元にデザインカンプを作っていくという流れになっていくので、似ているようですが実は意味は全く違うものです。他にも、サイトの構成情報をまとめた「ディレクトリマップ」や、サイト内の全体像を示す「サイトマップ」などの言葉が存在します。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて