Tortoise Shell

Webサービスの会社で働くデザイナーが、デザインやライフハックについてゆるく書き連ねるブログです。

Webデザインにおける「モックアップ」の役割の変化

わたしが現在行っているWEBアプリのUIデザインのプロジェクトに携わるようになって、かれこれ半年と数ヶ月ほど経過しました。

そのプロジェクトに関わっていて、常々「モックアップ」の役割が変化していることを実感しています。

モックアップとは?

モックアップ(以下、モックと表記)とは、これから制作していくWebサイトやアプリケーションの「ビジュアルのみ」を制作したもので、主に製品の外観を検討するために必要とされるものです。

Webデザインの現場では、多くの場合、実際の完成品を作り込む前に、先にこのモックを作って「どういう製品にするか」という事を決定してから進めていました。

制作現場におけるモックの位置付けの変化

ところが、近年では従来のモックの位置付けが変化してきました。

従来のモックの位置付けとは、モックは「製品のビジュアルのほぼ完成品」として作られ、モックのビジュアルを忠実に表現するように実装を進めていました。

しかし、現在では、モックはただの「青写真」という扱いになり、ディティールは開発と同時進行で決めていく…というワークフローに変化したのです。

なぜ、モックの位置付けは変化したのか

モックの位置付けは、どうして変化してしまったのでしょうか。

理由は、「Webサイトにおいてインタラクションが重要視されるようになった」からという要因が大きいと思います。

モックは静定な表現にとどまってしまう 従来のWebサイトは、紙媒体のデザインをそのままWebに載せたようなものでしたが、Webの技術が進化していく中で、Web独自の表現が確立していきました。

そこでは、Webの特徴であるユーザーとのインタラクションが重要視され、「ユーザーがこう操作したら、こんなフィードバックが返ってくる」という、ビジュアルにとどまらないユーザー体験全体を考えてデザインしていく必要が出てきたのです。

モックでは、どうしても静的なビジュアルでしか表せないので、モックを「ほぼ完成品」と見なして進めていくことが難しくなりました。

モックの弱点を補うプロトタイピングツールの登場

このように、Webデザインの現場におけるモックの役割は変化していき、モックはあくまで「こんな方針で進めていこう」という青写真を描くための手段になりました。

つまり、最終的な製品を完成させるために、従来のようなエンジニアと完全に分業した形では、開発は進めにくくなったということです。

近年、プロトタイピングツールなどの登場によって、デザイナーとエンジニアが円滑にコミュニケーションを取りながら進めていくワークフローも出来上がりつつあります。

Webサイトの機能がどんどんリッチになっていく今、モックの役割について、どこかのタイミングでもう一度確認しておくべきなのかもしれませんね。

おすすめ記事セレクション