モックアップとは？プロトタイプとは違う？ビジネスやWEB業界で役立つ知識をチェック

モックアップは、本物そっくりの見本品！

先輩

展示会用のモックアップはどのくらい用意してる？

モップ？床掃除？

新人

先輩

何いってるの？モックアップは本物そっくりの見本品のこと！

モックアップとは、本物と見分けがつかないほどにそっくりに作られた見本品のことをいいます。また、混同しやすい言葉もいくつかありますので、言葉の意味や具体例もふくめ、わかりやすく解説していきます。

モックアップの意味をチェック

モックアップは目にすることはよくあるものの、この言葉を使うことはあまりないですよね？そこで、「モックアップ」という言葉を聞いてどんなものかがピンとひらめくよう、まずは意味、具体例、会話での使い方についてご紹介します。

モックアップとは？

モックアップは『mockup』と1つの単語として扱われることもあれば、『mock up』『mock-up』のように『mock』+『up』と2つの単語で記されることもああります。いずれのモックアップも、次のように意味は同じです。

■実物大模型
■実物大模型を作る
■原寸模型
■モデル

このような意味から、モックアップといえば本物そっくりの見本品という使われ方になっているのです。

ちなみに、『mock』は単体だと『あざ笑う・まねてばかにする・まねてあざける』など、ちょっと人をバカにする意味合いで使われる言葉です。

モックアップの具体例

世の中には、「これもモックアップだったのか」と思うほど、いろいろなモックアップが存在します。ここではいくつかの具体例を集めてみました。

具体例その1：スマートフォン

携帯電話のショップで持った感触は本物と同じだけど、画面は動かないという見本を見たことがありませんか？この見本が『モックアップ』です。

具体例その2：一眼レフカメラ

カメラは持った感触や重さ、使いやすさが購入の決め手になることも多いため、撮影ができない見本品を置いていることがあります。これがモックアップということになります。

具体例その3：基盤・内部装置など

パソコン、液晶テレビなどのメーカーが法人向けの展示会を催すとき、「内部構造はこんな感じになっています」ということを見せるため、モックアップを使うことがあります。例えば、メモリ装置などを1枚の板にのせた基盤を展示するなど。実際の製品と違い、機能しなくてもいいので、見た目は本物そっくりでも簡易的に作られています。

モックアップの使い方・例文

モックアップが何なのかがわかったところで、会話でどのように使うのか、例文をいくつかご紹介しておきます。

例文1

「来週の役員会議までにノートパソコンのモックアップを3つほど用意しておいてね」

例文2

「このスマホ、本物だと思ったらモックアップだったんだね」

例文3

「今回の会議で使うモックアップで製品のデザインを決定するから、そのつもりで準備をしておくように」

モックアップと混同しやすい類語って？

モックアップには使い方を間違いやすい類語がいくつかあります。違いがわかりやすいように解説しますので、しっかりと区別できるようになってくださいね。

プロトタイプ

プロトタイプはおもに『試作品』を意味しており、これを使ってみることで改善点や不具合を見つけることもできます。
実際に使うことができるのがプロトタイプ、実物大の見本だけで実際には使えないものがモックアップになります。

プロトタイプについては以下の記事でさらに詳しく解説していますので、そちらもぜひご覧ください。
プロトタイプの意味や略は？ITや車からガンダムまで幅広く使われる言葉を分野別にチェック

サンプル

サンプルは『見本』『例』といった意味をもっており、食品サンプル、パッケージサンプル、デザインサンプルなど、いろいろなサンプルが存在しています。また、「新しい味のガムが発売されるので、サンプルをお配りしています」といったお試し品のようなサンプルもあります。

このように、サンプルは実際に使えるものもあれば、使えないものもあります。そのため、モックアップはサンプルの中の一つということになります。

ワーキングモデル

企業によって工程の違いがありますが、製品ができあがるまでの流れは以下のようになっています。

■開発・設計
■試作・試作評価
■量産試作・評価
■量産

ワーキングモデルは、この流れの中の量産試作の前段階で、内部構造の機能や性能など検証するために作る試作モデルのこと。『実働模型』という言葉は耳にしたことがありますよね？それはこの部分にあたります。

実際の動きや設計ミスがないかを検証すると同時に、外装デザインを確認するという工程も組み込まれることも多く、モックアップもワーキングモデルの一つとして考えている企業もあります。

WEB業界で使われるモックアップツール

Web政策やアプリ開発を行う場合、基本的には以下の工程が順番に行われます。

■手書きによるスケッチ
■スケッチをデジタル化したワイヤーフレーム
■ワイヤーフレームに色付けをしたりサイズ調整を加えてデザイン性を出すモックアップ
■モックアップにアニメーションなどの動きをつける

モックアップは、webサイトを作るうえでの設計図のような役割を果たしているわけですね。これを作っておくことで、サイト全体の構造がわかりやすくなり、修正が必要になった場合にもどこに手を加えればいいかが一目瞭然になり、効率もUPします。

モックアップは手書きで行ってもいいのですが、以下の理由により専用ツールを利用することが多いようです。

■実際のWeb画面のイメージがつかみやすい
■データで関係者とのやりとりがしやすい
■修正がしやすい

簡単に作業ができるこんなツールもある！

効率よく作業ができるように作られた、以下のようなモックアップツールもあります。おすすめのモックアップツールとしては、英語で書かれた海外ツールが多いのですが、ここでは日本語に対応している『prott（プロット）』というツールをご紹介しておきます。

このPurottというツールは、コードを書かなくても本物同様の動きを再現することができるのが特徴で、KDDI、SoftBank、LINEなどの大手企業多数利用しています。

無料ですぐに利用を開始できるプランもありますが、使える機能により月額1,900円、3,900円、7,400円のプランが用意されています。それ以上を求める人には別途見積もりをだしてもらえるプランもあります。

参考 prottTOPページ

[注意！]モックアップはパクリ商品ではない

モックアップは正規の商品ではないものの、本物そっくりに作られています。しかし、デザインを真似してつくる偽造品・パクリ商品ではありません。あくまでも正規の会社が作っている見本品であることを覚えておきましょう。

モックアップで集客・顧客満足につなげていこう

売り込みをしたい商品の感触を味わってもらうには、本物を手にとってもらうのが一番です。しかし、本物の用意ができないこともあります。そんなとき、モックアップがあれば写真や画像だけというよりも、本物そっくりに作られている分、本物を手にとった感じを伝えることができます。

もしあなたがモックアップを用意する立場になったときは、それが売り上げに影響を与えるんだ、ということを念頭において作業をすすめるようにしてくださいね。