Figma Makeで試作を作る前に決める線|制作会社に渡す範囲

Figma Makeで試作を作る前に決める線|制作会社に渡す範囲

「文章で頼むだけで動く画面が出てくるなら、制作会社に出す前に自分たちで作ってしまいたい」「作ってみたら思ったより本物らしく、これをそのまま渡してよいのか判断がつかない」。ウェブ担当やマーケ担当から、こうした声が同時に出てくるようになりました。どちらも筋の通った期待と戸惑いです。Figma Makeは、指示の文や既存のデザインから、クリックして動かせる試作や小さなウェブアプリを組み立てる道具です。ただ、作れるかどうかは、もう問題ではありません。本当に問われているのは、何のために作り、どこまでを社内で作り、どこから先を制作会社や本番の工程に渡すかという線の引き方です。この記事では、Figma Makeで試作を作る前に決めておく線を、手順の順に整理します。


カメ先生カメ先生

Figma Makeは、文章や手持ちのデザインから、動く試作を組み立ててくれる道具なんだ。見た目だけでなく、ボタンを押すと画面が切り替わるところまで出てくるのが特徴だね。


カメ子カメ子

そこまで動くなら、試作というより、ほとんど完成品ということですか。


カメ先生カメ先生

そう見えてしまうのが落とし穴でね。動いて見えることと、本番で使える品質であることは別の話なんだ。だから作る前に、目的と、入れてよい情報と、公開するかどうかを決めておく。案を並べるのはAIに任せていいけれど、どの案を本番に採るかはAIに判断させない。


カメ子カメ子

作る前に決めることのほうが、作ることより大事なんですね。


この記事のポイント
  • Figma Makeの試作は、社内の合意用・制作会社への指示書・そのまま公開の3つで作り込む深さが変わる
  • 未発表の製品名や顧客名、本物のデータを入れるかどうかは、作り始める前に線を引く
  • 制作会社に渡すときは、試作と一緒に要件と「本番品質ではない部分」の一覧を添える

コンテンツ制作・SEOにAIを活かす第一歩、まずは導入から始めませんか?

デボノはアカウント開設・初期設定など「そもそものAI導入」から社内定着まで伴走支援。マーケティング活用など一歩進んだご相談にも対応します。

目次

Figma Makeは何を作る道具か——公式の説明で確かめる

Figma Makeは、デザインツールのフィグマが2025年5月7日に発表した機能です。公式ヘルプでは、アイデアや既存のデザインを、動く試作、ウェブアプリ、操作できる画面として形にする、指示から作る道具と説明されています。従来のフィグマの試作機能が、画面と画面を線でつないで遷移を見せるものだったのに対し、Figma Makeは裏側でコードを組み立て、入力欄に文字を打つ、条件で表示を変えるといった動きまで再現します。

作り方は、会話の形で指示を重ねていくのが基本です。「採用ページの試作を作って」と頼み、出てきた画面に「見出しをもう少し短く」「問い合わせのボタンを上にも置いて」と直しを重ねます。公式ヘルプによると、フィグマで作ったフレームや部品、画像を添付して土台にでき、生成されたコードを自分で書き換えることもできます。さらに、プレビューをデザインの層として写し取り、通常のデザイン画面に貼り付けることもできるとされています。

ここで押さえておきたいのは、Figma Makeの出力は見た目の案であると同時に、動くコードでもあるという点です。静止画のカンプなら、誰が見ても「これは絵だ」と分かります。ところが動く試作は、入力欄に文字が入り、ボタンが反応するため、見た人が完成に近いと受け取りがちです。後の手順で「本番品質ではない部分を書き出す」ことを重く扱うのは、この性質があるからです。

なお、フィグマには作ったページをウェブに公開する「フィグマ・サイト」という別の機能もあり、公式ヘルプでは2026年9月時点でベータと表示されています。Figma Makeで作ったものも公開できますが、公開の仕組みや独自ドメインの上限はフィグマ・サイトと共有されています。作る機能と公開する機能は分けて考えると、社内のルールも決めやすくなります。

使える人と席の種類、AIクレジットの減り方

誰がFigma Makeを使えるかは、契約しているプランと席の種類で決まります。公式ヘルプによると、作成・共有・公開・コードの編集・書き出しまで全部できるのは、有料プランのフル席です。開発者向け、共同作業向け、閲覧向けの席では、自分の下書きの中で試すことはできても、共有や公開、チームのフォルダでの作成はできません。無料のスタータープランでも試せますが、チームのライブラリを使えないなどの制限があります。

もう一つの制約が、AIクレジットです。公式ヘルプの表では、フル席に毎月配られるクレジットは、スタータープランが500、プロフェッショナルプランが3,000、組織プランが3,500、エンタープライズプランが4,250です。フル席以外の席は、どのプランでも月500にとどまります。Figma Makeは使い方によって消費が変わる仕組みで、書体の変更で30前後から、動きを付けると75前後から、ゼロからアプリを作ると100前後からが目安と示されています。

この数字から分かるのは、直しを細かく重ねるほど、クレジットは想像より早く減るということです。ゼロから作って10回直せば、それだけで数百を使います。クレジットが尽きると、画面に通知が出て追加のAI操作ができなくなり、管理者に追加を頼む流れになります。締め切り直前に止まると困るので、試作を誰がどのくらい作るかは、後の手順で配分として決めておきます。

管理者の側では、追加のクレジットを購入する、特定の人に個人ごとの上限を設ける、といった設定ができます。エンタープライズプランでは、請求のグループごとにクレジットを割り振り、部署や費用の単位で使い方を管理できるとされています。消費の目安や配分の数字は改定されることがあり、今回確かめたヘルプも2026年8月に更新されていました。社内の資料に数字を書き写すときは、確認した日付を添えておくと、後で食い違いに気づけます。

作る前に決める線は6つ——全体の流れ

ここからは、Figma Makeで特設ページやLPの試作を作る前に決めておく線を、手順の順に並べます。どれも作り始めてから決めようとすると、手戻りが大きくなるものばかりです。特に、試作の目的と入れてよい情報は、最初の指示の文に影響するため、後から変えると作り直しになります。全体の流れは次のとおりです。

STEP1
試作の目的を3つのどれかに決める

社内の合意用か、制作会社への指示書か、そのまま公開するかを先に決めます。

STEP2
入れてよい情報の線を引く

未発表の製品名、顧客名、本物の数字や個人の情報を入れるかどうかを決めます。

STEP3
作る人とクレジットの配分を決める

誰がフル席で作り、何回くらい直すかの見込みを立てます。

STEP4
公開機能を使うかどうかを決める

組織の設定で外部公開を止めるか、条件付きで許すかを決めます。

STEP5
制作会社に渡すときに添えるものを決める

要件、ブランドの基準、本番品質ではない部分の一覧をそろえます。

STEP6
検収で見る点を決める

表示の崩れ、アクセシビリティ、計測タグ、フォームの送信先を確かめます。

この6つは、担当者一人で決めてよいものと、上長や情報管理の担当と相談して決めるものに分かれます。目的と作る人は現場で決められますが、入れてよい情報と公開機能は、会社の情報管理のルールに関わるため、先に相談しておくのが安全です。制作会社への引き渡しと検収は、発注の担当者と一緒に決めます。

AIに試作を作らせるときの段階の分け方や、捨てやすさの考え方そのものは、AI試作の一般論をまとめた別の記事で扱っています。本稿は、Figma Makeという1つの製品を法人のウェブ担当が使うときに、どこで線を引くかに絞って話を進めます。

手順1:試作の目的を3つのどれかに決める

最初に決めるのは、その試作を何に使うかです。目的は、大きく3つに分かれます。1つ目は社内の合意用で、上長や関係部署に「こういうページにしたい」と見せて方向をそろえるためのものです。2つ目は制作会社への指示書で、言葉だけでは伝わりにくい動きや構成を、見本として渡すためのものです。3つ目は、試作をそのまま公開して、期間限定の案内ページなどとして使うものです。

目的が決まっていないまま作り始めると、よくあるのが「合意用のつもりで作ったのに、見た人から『これで公開できるのでは』と言われる」という流れです。合意用の試作には、ブランドの細かい規定も、計測タグも、フォームの送信先も入っていません。それでも動いて見えるため、公開の話が先に進んでしまいます。目的を試作の冒頭の画面に一行で書いておくだけでも、この取り違えはかなり防げます。

3つ目の「そのまま公開」は、慎重に扱います。公式ヘルプには、公開したものの内容について、適用される規制や法律に従うのは利用者の責任だと明記されています。つまり、公開した時点で、表示の規制、個人情報の扱い、アクセシビリティへの配慮といった本番のページと同じ責任が生じます。社内で作ったものだから試しでよい、という扱いにはなりません。

迷ったときは、まず社内の合意用として作り、必要が出てから目的を格上げするほうが安全です。逆に、公開用として作り始めたものを合意用に格下げするのは簡単ですが、その間に入れた本物の情報を後から抜き取るのは手間がかかります。目的は低いほうから始めて、上げるときに決め直す、と覚えておくと判断がぶれません。

目的ごとに変わる、作り込む深さの違い

3つの目的では、作り込むべき範囲がまったく違います。合意用なら、構成と見出しの流れが伝われば十分で、細部はむしろ粗いほうが議論が本題からそれません。指示書なら、動きや画面の切り替え、状態ごとの表示を丁寧に作り、ブランドの色や書体は制作会社の側で整えてもらう前提にします。公開用なら、本番のページと同じ基準をすべて満たす必要があります。

観点社内の合意用制作会社への指示書そのまま公開
作り込む範囲構成と見出しの流れ動き・画面の切り替え・状態ごとの表示本番のページと同じ全部
入れる情報仮の名前と作った数字仮の名前と作った数字公開してよい確定情報だけ
ブランドの基準おおまかでよい制作会社が整える前提すべて満たす
計測タグ・フォーム入れない入れない(要件として書く)入れて動作を確かめる
公開機能使わない組織内限定まで条件を決めて使う
決める人担当者担当者と発注の担当責任者

表の中で見落とされやすいのが、指示書の行の「計測タグ・フォームは入れない」です。試作の中に仮のフォームを作り込むと、制作会社がそれを見て「送信の仕組みもこのとおりに」と受け取ることがあります。送信先やデータの扱いは試作の外で要件として書き、試作では「ここに問い合わせのフォームが入る」と分かる程度にとどめます。

もう一つ、合意用の粗さは意図して残します。AIに頼むと、細部まで整った画面が出てきやすく、見た人の関心が色や写真の好みに向かいがちです。合意を取りたいのが構成なら、写真の枠を灰色の四角のままにするなど、わざと仮の見た目にしておくと、話し合いが構成から外れにくくなります。

手順2:入れてよい情報の線を引く

次に決めるのは、試作に何を入れてよいかです。特設ページやLPの試作では、つい本物の情報を入れたくなります。発売前の製品名、取引先の社名やロゴ、実際の導入件数、問い合わせの実績といったものです。本物が入っているほうが、見た人に伝わりやすいのは確かです。しかし、これらは試作を共有した範囲の外に漏れたときの影響が大きい情報です。

線を引くときは、情報を3つの段に分けると決めやすくなります。1段目は、すでに公開済みの情報で、会社名、公開済みの製品名、ウェブサイトに載っている文言などです。これは入れてかまいません。2段目は、社内では共有されているが未公開の情報で、発売前の製品名や価格、キャンペーンの時期などです。3段目は、顧客名、個人の情報、売上などの本物の数字です。3段目は試作に入れない、2段目は入れるなら共有範囲を組織内に限る、という線が一つの目安になります。

2段目を入れる場合は、指示の文と添付する素材の両方に気を配ります。指示の文に「新製品〇〇の発売ページ」と書けば、その名前は試作の画面にもコードにも残ります。公開はしなくても、ファイルを共有した相手には見えます。制作会社や外部の協力者とファイルを共有する予定があるなら、最初から仮の名前で作っておくほうが、後で差し替える手間も少なく済みます。

AIの扱いについて社内の決まりがある会社では、その決まりとFigma Makeの位置づけを照らし合わせておきます。フィグマの管理画面には、AIの機能や学習への利用に関わる設定がありますが、自社の契約でどう設定されているかは、管理者に確かめるのが確実です。設定を知らないまま「たぶん大丈夫」で本物の情報を入れないことが、最初の一線になります。

添付する素材——デザインのフレームと画像の扱い

Figma Makeには、指示の文だけでなく、フィグマで作ったフレームや部品、画像を添付して土台にできます。既存のサイトのデザインがフィグマにあるなら、それを添付して「この見た目のまま、特設ページの試作を」と頼むことで、ブランドから大きく外れない案を出しやすくなります。公式ヘルプによると、有料プランではチームのライブラリの部品も手がかりとして使えます。

ただし、添付した素材は、試作の見た目に強く反映されます。過去の案件のデザインを土台にすると、そこに入っていた写真や文言、取引先のロゴが試作に引き継がれることがあります。添付する前に、フレームの中に顧客名や写真の使用許諾が限られた素材が残っていないかを確かめます。写真素材には、使ってよい案件や期間が決まっているものも多いからです。

画像を添付する場合も同じです。撮影した製品写真やイベントの写真を試作に入れると、見栄えは一気によくなりますが、写っている人の許諾や、未発表の製品の形が写り込んでいないかといった確認が必要になります。合意用や指示書の試作なら、写真は枠だけにして「ここに製品写真」と書いておくほうが、確認の手間も漏れの心配も減ります。

添付した素材の一覧は、試作のファイルの中か、共有する資料の中に書き残しておきます。どのフレームを土台にしたか、どの画像を入れたかが分かれば、制作会社に渡すときに「この写真は差し替える前提」「このロゴは使用許諾の確認中」といった注記をそのまま付けられます。後から素材の出どころを調べ直すのは、想像以上に時間がかかります。

手順3:作る人とクレジットの配分を決める

3つ目の手順は、誰が作り、どのくらいクレジットを使うかの見込みを立てることです。先に見たとおり、共有や公開までできるのは有料プランのフル席です。マーケ部門に閲覧の席しか割り当てられていない場合、試作は自分の下書きで作れても、関係者に共有できません。作り始めてから「共有できない」と気づくと、席の変更の申請で数日止まることもあります。

クレジットの見込みは、ざっくりでかまいません。例えば、1本の特設ページの試作をゼロから作り、構成の直しを数回、見た目の直しを10回前後重ねるとすると、公式の目安から見て数百から千程度を使う計算になります。組織プランのフル席なら月3,500なので、1人が同じ月に複数の試作を抱えると、月の途中で足りなくなる可能性があります。直しの回数を減らすには、最初の指示の文に目的と構成を書き込んでおくのが近道です。

配分を決めるときは、試作を作る人を部署で1〜2人に絞るやり方もあります。全員が少しずつ触るより、慣れた人がまとめて作るほうが、直しの回数も少なく、クレジットの減りも読めます。作る人以外は、試作を見てコメントを付ける役に回ります。コメントは閲覧の席でも付けられるので、関係者の席を増やさずに済みます。

クレジットが尽きたときの動き方も決めておきます。管理者に追加を頼むのか、翌月まで待つのか、ほかの人の席で続けるのかです。組織プランやエンタープライズプランでは、追加のクレジットは既存の契約の期間にそろえた年単位の契約になると公式ヘルプに書かれています。月の途中で気軽に足せるものではない前提で、繁忙期の前に見込みを管理者と共有しておきます。

手順4:公開機能を使わせるかどうかを先に決める

Figma Makeで作ったものは、ボタン一つでウェブに公開できます。公式ヘルプによると、公開すると、ランダムな3つの英単語を並べた既定のアドレスが割り当てられ、そのアドレスを知っていれば誰でも見られる状態になります。独自ドメインも設定でき、プロフェッショナルプランでは10件まで、組織プランとエンタープライズプランでは上限なく使えるとされています。

手軽に公開できることは、裏返せば、担当者の判断だけで外部に出てしまうということです。そこで組織プランとエンタープライズプランには、管理者が制御する設定が用意されています。公式ヘルプでは、管理画面の設定から、ウェブ公開そのものを無効にできると説明されています。無効にした場合でも、組織のメンバーだけがログインして見られる形での公開は残せます。

社内のルールとしては、3つの選び方が考えられます。1つ目は、外部への公開を止め、組織内限定の公開だけを許す形です。合意用や指示書の試作には、これで十分です。2つ目は、外部への公開を許すが、パスワードを必須にする形です。公式ヘルプによると、組織として自動生成のパスワードだけを使わせる、すべての公開にパスワードを必須にする、といった設定ができます。3つ目は、責任者の承認を得たものだけを外部に公開する運用です。

どれを選ぶにしても、公開の可否を担当者の判断に任せず、組織の設定か承認の手順で決めることが大切です。試作の段階で外部に出たページが検索に拾われたり、取引先に転送されたりすると、取り消すのは難しくなります。まずは組織内限定から始め、公開用の試作が必要になったときに、承認の手順を追加するのが無理のない進め方です。

公開するなら、既定の設定から変えておく点

そのまま公開する目的で作った場合は、既定の状態から変えておく点がいくつかあります。まず、検索への載り方です。公式ヘルプでは、検索結果に出したくないページには、検索に載せない指定をページに加えられると案内されています。パスワードで保護したページも、時間がたつと検索に載らなくなるとされています。期間限定の案内や限られた相手向けのページなら、この指定を先に入れておきます。

次に、計測です。公式ヘルプによると、公開したものに自社のGA4の測定用の番号を加えることはできますが、フィグマ自体に分析の画面は用意されていません。計測したいなら、公開前にGA4の設定を入れ、実際に記録が届くかを確かめる必要があります。本番のサイトと同じ計測の方針で扱うのか、試しのページとして別に数えるのかも、ここで決めておきます。

公開後の更新にも注意がいります。公式ヘルプによると、Figma Makeのファイルを直しても、公開の画面で「更新」を押すまで、公開されたページには反映されません。直したつもりで古い内容が出たまま、という事故が起きやすいところです。逆に、非公開にしてから再び公開すると、同じアドレスが使われます。一度出したアドレスは、非公開にしても使い回される前提で扱います。

もう一つ、公開の仕組みはベータの扱いです。公式のよくある質問では、公開物はアマゾンのクラウドに置かれ、ドメインと経路はクラウドフレアが受け持つこと、ベータの期間中はホスティングが有料プランに含まれることが説明されています。条件は正式提供の時点で変わりうるので、長く使うページを置く場所としては、本番のサイトの仕組みと比べて判断します。

手順5:制作会社に渡すときに添えるもの

試作を制作会社への指示書として使うなら、試作だけを渡して終わりにしないことが大切です。動く試作は情報量が多いぶん、どこが決まっていて、どこが仮なのかが伝わりにくくなります。制作会社の側は、渡された試作を「このとおりに作ってほしい」という指示だと受け取るのが自然です。意図しない部分まで再現されてしまうと、見積もりも工程も膨らみます。

添えるものは、大きく3つです。1つ目は要件で、ページの目的、想定する読み手、載せる情報の一覧、公開の時期、計測したい行動、フォームの項目と送信先を文章で書きます。2つ目はブランドの基準で、色、書体、ロゴの使い方、写真の方針といった、試作では守りきれていない決まりを示します。3つ目が、次の節で扱う「本番品質ではない部分」の一覧です。

渡し方にも工夫がいります。公開のアドレスを送るだけだと、制作会社は画面を見ることはできても、どの部分がどう作られているかまでは分かりません。ファイルを共有するのか、デザインの層として写し取ったものを渡すのか、生成されたコードまで渡すのかを決めます。コードを渡すなら「参考であり、そのまま使う前提ではない」と明記すると、制作会社がコードの品質まで引き受けたと誤解されずに済みます。

発注の前に、制作会社がAIで作った試作を受け取ることに慣れているかも確かめておきます。受け取り方の決まりがある会社もあれば、試作の作り直しから見積もる会社もあります。社内で作った試作があることで、打ち合わせの回数は減りますが、制作会社の作業がなくなるわけではありません。試作は指示を具体的にするための材料で、発注の中身を減らす道具ではないと、社内でも共有しておきます。

「動いて見えるが本番品質ではない」部分の書き出し方

Figma Makeの試作で最も誤解を生みやすいのは、動いて見えるが、本番では作り直しが必要な部分です。ボタンを押すと送信完了の画面が出るが、実際にはどこにも送られていない。一覧の画面に並んでいる数字は、AIが作った仮の値である。スマートフォンの幅では見えているが、ほかの幅では崩れる。こうした部分は、見た人には区別がつきません。

書き出すときは、画面ごとに「見えているもの」と「実際の状態」を並べると整理しやすくなります。例えば、問い合わせの画面なら「送信すると完了の画面が出る/実際にはどこにも送られない」、事例の一覧なら「6件の事例が並ぶ/社名と数字はすべて仮」と書きます。これを試作と一緒に渡せば、制作会社は作り直す範囲を正しく見積もれます。

  • 送信・登録・ログインの動きは、見た目だけで裏側の処理がないことが多い
  • 一覧や数字は、AIが作った仮の値かどうかを必ず書く
  • 確かめた画面の幅と、確かめていない幅を分けて書く
  • 外部のデータベースにつないだ場合は、どの情報がどこに保存されるかを書く

最後の項目は、特に気を付けたいところです。公式ヘルプには、Figma Makeの試作に外部のデータベースをつなぐ方法が載っており、組織としてその連携を管理する設定もあります。つながっていると、試作でも入力した内容が実際に保存されます。試作の段階でデータベースにつなぐかどうかは、手順2の情報の線と合わせて決めるのが安全です。

手順6:検収で見る点を決めておく

試作を公開する場合や、制作会社から納品を受ける場合に備えて、検収で見る点を先に決めておきます。試作の段階で決めておくと、要件として制作会社に伝えられ、後から「そこまでは聞いていない」という食い違いを減らせます。見る点は、大きく4つです。表示の崩れ、アクセシビリティ、計測タグ、フォームの送信先です。

表示の崩れは、画面の幅ごとに確かめます。パソコンの広い画面、ノートパソコン、スマートフォンの縦と横で、文字がはみ出していないか、ボタンが押せる大きさか、画像が切れていないかを見ます。AIが作った画面は、試した幅ではきれいでも、少し幅を変えると崩れることがあります。確かめる幅を先に決め、その幅で全画面を見るようにします。

アクセシビリティでは、文字と背景の色の差が十分か、画像に代わりの説明が入っているか、キーボードだけで操作できるか、見出しの順番が正しいかを確かめます。試作は見た目を優先して作られるため、これらは抜けやすい部分です。計測タグは、GA4などの記録が実際に届くかを、テスト用の操作をして確かめます。フォームは、送信した内容が決めた送り先に届くか、確認のメールが正しく出るかを見ます。

検収のときに役立つのが、手順5で作った「本番品質ではない部分」の一覧です。一覧に書いた項目が、納品物ではすべて解消されているかを一つずつ照らし合わせます。一覧の項目が消えていなければ、そのページはまだ試作のままという見方をすると、判断に迷いません。

AIに任せる範囲と、人が決める範囲

Figma Makeを使うとき、AIに任せてよいのは、試作の叩き台を作ること、複数の案を並べて比べること、画面の文言の下書きを出すことまでです。例えば、同じ特設ページで、見出しを大きく見せる案と、事例を先に見せる案を並べて作らせ、関係者に見比べてもらう使い方は、Figma Makeの得意なところです。文言も、下書きとしてなら十分に役立ちます。

一方で、どの案を本番に採るか、公開してよいか、どの情報を載せるかは、人が決めます。AIは、見た目の整った案を出すことはできても、その案が自社のブランドに合っているか、法令や社内の決まりに反していないかを判断する立場にはありません。案の良し悪しをAIに判定させないことを、使い始める前に関係者と確かめておきます。

AIに案の説明をさせるときは、なぜその構成にしたのかの根拠を書かせると、判断の材料として使いやすくなります。例えば「事例を先に置いたのは、比較検討の段階の読み手を想定したから」と書かせれば、その想定が自社の読み手に合っているかを人が確かめられます。根拠のない案は、見た目の好みで選ばれがちです。

人が確認する範囲も、先に決めておきます。画面の文言は、事実と違うことが書かれていないか、表現の規制に触れていないかを担当者が読みます。試作の中の数字や事例は、仮の値のまま残っていないかを確かめます。AIが作った文言を、確認しないまま公開のページに載せないことが、最低限の線です。

よくあるつまずき

ここまでの手順を踏まえて、Figma Makeで試作を作るときに起こりがちなつまずきを並べておきます。どれも、作る前に線を引いていれば避けられたものです。自社の進め方と照らし合わせて、当てはまるものがないか確かめてください。

  • 目的を決めずに作り始め、合意用の試作がそのまま公開の話に進む
  • 発売前の製品名や顧客名を入れたまま、外部の協力者とファイルを共有する
  • 閲覧の席で作り始め、共有しようとした段階で席の変更が必要だと気づく
  • 細かい直しを重ねてクレジットが月の途中で尽き、締め切り前に作業が止まる
  • 公開の可否を担当者に任せ、パスワードのないページが外部に出る
  • 試作だけを制作会社に渡し、仮の数字や送られないフォームまで再現される

中でも多いのが、最後の「試作だけを渡す」つまずきです。制作会社は、渡されたものを丁寧に再現しようとします。その結果、仮の事例の数字がそのまま本番の原稿に残ったり、試作の画面の構成を崩せずに要件と合わないページができたりします。試作は、要件と一覧を添えて初めて指示書として働きます。

もう一つ見落とされやすいのが、公開したあとの更新忘れです。直したのに「更新」を押しておらず、古い内容が公開されたままになっていることがあります。公開したページを持つ場合は、誰がいつ更新を押すかを決め、公開中のページの一覧を作っておくと、放置されたページも見つけやすくなります。

よくある質問

Figma Makeは無料で使えますか?

公式ヘルプによると、無料のスタータープランでも試すことはできますが、チームのライブラリを使えない、公開の範囲が限られるなどの制限があります。共有や公開まで含めて全部使えるのは、有料プランのフル席です。

Figma Makeで作った試作を、そのまま本番のサイトにできますか?

公開する機能はありますが、公開した時点で本番のページと同じ責任が生じます。計測、アクセシビリティ、フォームの送信先、表示の規制などを確かめたうえで、責任者が公開してよいかを決めてください。

制作会社に渡すとき、生成されたコードも渡すべきですか?

渡してもかまいませんが、参考であってそのまま使う前提ではないことを明記します。制作会社によっては、コードではなくデザインの層として写し取ったものや、公開のアドレスのほうが扱いやすい場合もあるので、事前に確かめます。

社内の人だけに見せたい場合はどうすればよいですか?

組織プランとエンタープライズプランでは、組織のメンバーだけがログインして見られる形で公開できます。管理者が外部への公開を止める設定もあるので、合意用の試作はこの範囲にとどめるのが安全です。

AIクレジットが足りなくなったらどうなりますか?

画面に通知が出て、追加のAI操作ができなくなります。管理者に追加を頼むか、翌月を待つことになります。組織プランとエンタープライズプランの追加分は年単位の契約になるため、繁忙期の前に見込みを管理者と共有しておきます。

まとめ

Figma Makeは、指示の文や手持ちのデザインから、動く試作や小さなウェブアプリを組み立てる道具です。動いて見えるぶん、完成品と取り違えられやすく、作る前に線を引いておくことが欠かせません。まず、試作の目的を社内の合意用、制作会社への指示書、そのまま公開の3つのどれかに決めます。次に、入れてよい情報の段を決め、作る人の席とAIクレジットの配分を見込み、公開機能を組織の設定か承認の手順で管理します。制作会社に渡すときは、要件とブランドの基準、本番品質ではない部分の一覧を添え、検収では表示の崩れ、アクセシビリティ、計測タグ、フォームの送信先を確かめます。案を並べるのはAIに任せ、何を本番に採るかは人が決めます。まずは次の試作の冒頭の画面に、その試作の目的を一行で書くところから始めてください。

※本記事にはAIが活用されています。編集者が確認・編集し、可能な限り正確で最新の情報を提供するよう努めておりますが、情報の完全性、正確性、最新性、有用性等について保証するものではありません。本記事の内容に基づいて行動を取る場合は、読者ご自身の責任で行っていただくようお願いいたします。

コンテンツ制作・SEOにAIを活かす第一歩、まずは導入から始めませんか?

デボノはアカウント開設・初期設定など「そもそものAI導入」から社内定着まで伴走支援。マーケティング活用など一歩進んだご相談にも対応します。

運営会社:株式会社デボノ

目次