モックアップ・プロトタイプ用語集

モック作成の相談でよく出てくる言葉

モック（画面モック）

「モックアップ」の略で、実務では「画面モック」「モック制作」「モック作成」のように使われます。ただし指しているものは文脈で変わります。静止画のデザイン案を指すこともあれば、クリックできる試作を指すこともあります。依頼や見積もりの前に「動くのか、動かないのか」を先に確認しておくと、認識のずれが起きにくくなります。

モックアップ

配色・書体・画像まで作り込んだ、見た目の完成見本。デザインの合意に使います。基本的には動きません。Web制作では「デザインカンプ」とほぼ同義で使われます。
「プロトタイプ」と混同されやすい語です。モックアップは見た目、プロトタイプは動き、と分けて覚えると迷いません。

プロトタイプ

操作や画面遷移まで確認できる、動く試作品。使い心地の検証や、提案・社内承認での合意形成に使います。
作り込みの度合いは幅があり、遷移だけを繋いだ簡易なものから、本番と見分けがつかないものまでを同じ言葉で呼びます。相談のときは「どこまで動けばよいか」を伝えると話が早く進みます。

クリッカブルプロトタイプ

画面と画面をリンクで繋ぎ、クリック・タップで遷移だけを確認できるようにした試作。入力や計算は動きません。導線や画面数の確認には十分で、短期間で用意できます。

ローファイ／ハイファイ

作り込みの度合いを表す言い方。ローファイ（低忠実度）は線と箱だけの簡素なもの、ハイファイ（高忠実度）は本番同様の見た目まで作り込んだもの。社内の検討ならローファイ、社外への提案ならハイファイが目安です。

ワイヤーフレーム

画面の構成・情報の配置を確認するための骨組み（設計図）。色やデザインは含めず、初期設計の段階で使います。
見た目を決める前に「何をどこに置くか」だけを合意するための道具です。ここを飛ばすと、デザインが出てから構成の話に戻って手戻りになります。

デザインカンプ

完成イメージを示した静止画のデザイン案。「カンプ」は comprehensive layout の略。モックアップとほぼ同じ意味で使われ、動きません。
印刷・広告の分野から来た言葉で、Web では「モックアップ」と言い換えられることが増えています。

インタラクティブモック

クリック・タップで実際に操作できるモック。VISTAが制作するのはこの形で、見た目の完成度と操作を両立させ、提案でそのまま使えます。
静止画では伝わらない「使ったときの感じ」を、相手の手元で体験してもらえるのが違いです。

画面遷移図

どの画面からどの画面へ移れるかを線で示した図。画面の抜け漏れや、行き止まりの発見に使います。モックを作る前にこれを揃えておくと、必要な画面数と工数の見当が付きます。

PoC（概念実証）

Proof of Concept の略。アイデアや技術が実現可能かを、本格開発の前に小さく検証すること。触れるプロトタイプは、PoC前の軽量な検証としても使えます。
PoC が「できるか」を確かめるのに対し、モックは「伝わるか・使いやすいか」を確かめるもの、と分けて考えると選びやすくなります。

MVP（実用最小限の製品）

Minimum Viable Product の略。価値を確かめられる最小限の機能だけで、実際に使える形にしたもの。モックやプロトタイプは動く「ふり」をしますが、MVP は実際に動きます。ここが決定的な違いです。

Figma Make

プロンプトから画面やプロトタイプを生成できる、Figmaの生成AI機能。自作の初速が速い一方、提案品質・ブランド反映・要件整理は人の仕上げが必要になります。

ユーザーテスト

実際に使う人にモックやプロトタイプを触ってもらい、迷う箇所・止まる箇所を観察すること。少人数でも、作り手が気づけない詰まりが見つかります。動くモックがあると、この検証を開発前に行えます。

NDA（秘密保持契約）

Non-Disclosure Agreement の略。取引で知り得た秘密情報を第三者に開示しないと約束する契約。VISTAはNDA締結に対応し、預かった素材は制作の目的にのみ使用します。

デザインシステム

配色・書体・部品・レイアウトの規則をまとめた設計基盤。ブランドの一貫性を保ち、画面制作を標準化・高速化します。
既存のデザインシステムがある場合は、それに沿ってモックを作ることで、本制作へそのまま繋げられます。

UI／UX

UIは画面の見た目や操作部分、UXは利用者が得る体験全体を指します。触れるモックは、UIだけでなくUX（使い心地）まで提案先に伝えられます。

レスポンシブ

PC・タブレット・スマホなど、画面幅に応じてレイアウトが最適化される作り。VISTAの納品物は、環境を選ばず動きます。
提案の場でスマホから見せられるかどうかは、伝わり方に差が出ます。

要件定義

作るものの目的・機能・条件を、着手前に文章で決めること。言葉だけで固めようとすると認識がずれやすいため、触れるモックを見ながら決めると、決めた内容の解釈が揃います。

手戻り

いったん合意したはずの内容が後からひっくり返り、作業をやり直すこと。着手後に起きるほど費用と期間に響きます。受注前・着手前に動くもので合意しておくことが、いちばん効く予防策です。

本制作

提案・検証を経て、実際に公開・運用するシステムやサイトを開発すること。VISTAでは、本制作へ進む場合にモック費用を制作費へ充当できます。