こんな方のためのツールです
受託・制作会社のディレクター
Webデザイナー
Claude・v0 でモックを作るチーム
AIを使わないHTML制作にも
CHECK
モックのレビューで、
こんなお悩みありませんか？
✓
「ヘッダーの余白を詰めて」と言われても、どこの話か分からない。場所を確かめる返信ばかり増えていく。
制作会社
ディレクター
✓
デザインツールのコメントは位置に付くので、レイアウトを直すと指摘が別の要素を指してしまう。
Web
デザイナー
✓
モックを見せるだけなのに、zipで送る、確認用サーバーに置く、URLを発行する。準備が毎回面倒。
フロントエンド
エンジニア
✓
修正版を送ったのに、前のバージョンへの指摘が混ざって届く。どれが対応済みか追えない。
制作会社
ディレクター
✓
集まった指摘を、AIに渡す修正指示へ書き直すのに時間がかかる。結局、手で直したほうが早いことも。
Web
デザイナー
✓
確認のためだけに、クライアントへツールのアカウント登録をお願いするのは気が引ける。
プロジェクト
マネージャー
SOLUTION
Mocklook なら、まとめて解決。
指摘は「文章で場所を説明する」ものから、「要素を指さして伝える」ものへ。確認のための往復が、そもそも生まれにくくなります。
BEFORE
メール・チャットで往復
クライアント
トップのボタン、もう少し目立たせてください。
制作
ヘッダーとメインビジュアルの2つがありますが、どちらでしょうか？
クライアント
スマホで見たときの、下のほうのボタンです。
制作
念のため、スクリーンショットをいただけますか？
クライアント
（翌日）添付します。古い版のURLで見ていたかもしれません…
伝わるまで
何度も往復、版の取り違えも
AFTER
ピンで一度に伝わる
1
クライアント
v3
このボタン、もう少し目立たせてください。
伝わるまで
コメント1件で完了
どこ？
クリックした要素が記録される
どの幅？
見ていた画面幅も残る
どの版？
バージョンごとに指摘を管理
どう直す？
AI向けの修正指示にワンクリック
FEATURES
レビューの「伝わらない」を減らす、
4つの特長
POINT
01
ピンは座標ではなく、要素に付く。
幅を変えてもずれません。
レビュアーは気になる要素をクリックしてコメントするだけ。ピンは画面上の位置ではなくHTMLの要素に追従するので、レスポンシブで並びが変わっても、修正でレイアウトが動いても、正しい場所を指し続けます。
どの要素か、どの画面幅で見ていたかを自動で記録
返信・@メンション・解決をその場で
375 / 768 / PC の幅を切り替えて確認
記録される情報
section.price > h2
375px
v2
POINT
02
ドラッグ&ドロップでアップロード。
変わったファイルだけ版が上がる。
HTMLをフォルダやzipのままドロップすると、モック一覧が自動でできあがります。上げ直したときは、内容が変わったファイルだけバージョンが上がるので、どこを直したのかが一目で分かります。
単体HTML・フォルダ・zipに対応（1ファイル25MBまで）
CSS・画像・JSの相対パスもそのまま動作
過去版の復元や、別案への複製も可能
POINT
03
未解決の指摘を、
AIへの修正指示としてコピー。
未解決のコメントを、対象要素のHTML、表示幅、返信のやりとりまで含めた修正指示としてワンクリックでコピーできます。あとはClaudeなどのAIに貼り付けるだけ。指摘を書き直す手間がなくなります。
対象要素のHTMLをそのまま添付
表示幅と返信の文脈も一緒に渡せる
AIを使わない修正のToDoリストとしても
v2 の指摘 3件
すべて解決済み。この版をクローズできます。
375
768
PC
POINT
04
前の版と最新版を並べて、
直ったかをその場で確認。
比較ビューでは、バージョン同士や別案同士を横に並べ、幅とスクロール位置を揃えて見比べられます。前の版に付いた指摘を見ながら最新版を確認し、すべて解決したらそのバージョンをクローズ。古い版への指摘が混ざることもありません。
375 / 768 / PC の幅を揃えて比較
スクロールが連動するので見比べやすい
解決済みの版はクローズして整理
HOW IT WORKS
使い方は、4ステップ
アップロードからクローズまで、レビューの流れがひとつのツールの中でつながります。
STEP
1
アップロード
HTMLをフォルダやzipのままドラッグ&ドロップ。モック一覧が自動でできます。上げ直すと、変わったファイルだけ版が上がります。
STEP
2
ピンを立ててコメント
レビュアーは招待メールのリンクから開き、気になる要素をクリックしてコメント。要素と画面幅も一緒に記録されます。
STEP
3
AIに渡して直す
未解決の指摘を、対象要素のHTML・表示幅・返信つきの修正指示としてワンクリックでコピー。AIに貼って直します。
STEP
4
比較してクローズ
前の版の指摘と最新版を並べて、直ったかを確認。すべて解決したら、そのバージョンをクローズします。
FOR REVIEWERS
クライアントには、
登録もパスワードもお願いしません。
レビュアーは、メールに届く6桁のコードを入力するだけでモックを開けます。ツールに慣れていない方にも、気軽にレビューをお願いできます。
1
プロジェクトに招待
招待はプロジェクト単位。メールアドレスを入れるだけです。
2
6桁のコードでログイン
コードの有効期限は10分間。パスワード管理は不要です。
3
招待されたプロジェクトだけを表示
ほかのプロジェクトやモックは、レビュアーからは見えません。
Mocklook
確認コードを入力してください
sato@example.co.jp 宛に6桁のコードを送信しました
4
8
2
0
モックを開く
コードの有効期限：10分間
SECURITY
公開前のモックだから、
見せる範囲はきちんと絞ります。
アップロードしたモックは公開されません
閲覧できるのは、ワークスペースのメンバーと、招待されたレビュアーだけです。URLを知っているだけでは開けません。
モックは管理画面と別ドメインで配信
モックは管理画面とは別のドメインから配信されます。モック内のスクリプトが、管理画面に触れることはできません。
招待はプロジェクト単位
レビュアーに見えるのは、招待されたプロジェクトだけ。案件ごとに、見せる相手を分けて管理できます。
ALL FEATURES
機能一覧
要素に追従するピン
座標ではなく要素に付くので、幅を変えても修正してもずれません。
ファイル単位のバージョン管理
変わったファイルだけ版が上がります。過去版の復元、別案への複製にも対応。
比較ビュー
バージョンや別案を並べ、幅とスクロールを揃えて見比べられます。
AI向けエクスポート
未解決の指摘を、要素のHTML・表示幅・返信つきでワンクリックコピー。
メール通知
@メンションはすぐに通知。それ以外は30分ごとにまとめて1通でお届けします。
プロジェクト単位の招待
レビュアーは6桁のコードでログイン。登録もパスワードも不要です。
PRICING