フィードバックフォーム作成ツールとは？

テキスト入力、評価、ドロップダウン、チェックボックス、スケールスライダーなど複数のフィールドタイプでフィードバックフォームを作成できます。ドラッグでフィールドを並べ替え、ラベルを直接編集し、HTMLとしてエクスポートまたはJSONスキーマをダウンロードできます。

ビルダーには11種類の入力フィールドが用意されています。1行テキスト、複数行テキスト、メール、数値、日付選択、はい/いいえ、1〜5の星評価、ドロップダウン選択、チェックボックスグループ、数値スケールのスライダー、そして両端にラベルを付けられる専用のNPS(0-10)スケールです。さらに質問をグループ化するセクション見出しブロックと、導入文用の「フォームの説明」もあります。どのフィールドもワンクリックで複製でき、必須項目に指定でき、表示条件ルールを追加すれば、前のドロップダウンやはい/いいえの回答が一致したときだけそのフィールドを表示できます。右側のパネルは実際に入力して本番どおりの体験を試せるインタラクティブなライブプレビュー(内容は保存されません)、エクスポートは単独のHTML(条件ロジックを処理する小さなスクリプト付き)または react-hook-form や Tally などのフォームライブラリで使えるJSONスキーマです。

使い方

1. 「フィールドを追加」をクリックして、テキスト、テキストエリア、メール、数値、日付、はい/いいえ、星評価、ドロップダウン、チェックボックスグループ、スケールスライダー、または専用のNPS 0-10スケールから選んで挿入してください。
2. フィールドをドラッグして順序を変更し、フィールドを複製して設定を再利用し、ラベルやプレースホルダーをインラインで編集して、必須または任意に設定してください。
3. 右パネルのライブプレビューに実際に入力して本番どおりの体験を確認し、HTMLコードとしてエクスポートするか、統合用のJSONスキーマとしてダウンロードしてください。

使用するタイミング

• Typeformの有料プランを使わずに、ECサイトの購入後NPSアンケートを作りたいとき。
• 採用フローのフィードバックフォームを下書きしてから開発チームに渡したいとき。
• ワークショップ、研修、コミュニティイベントの簡易フィードバックフォーム。

結果

プロダクトマネージャーが0〜10のスケール、2つの自由記述欄、ユーザー役割のドロップダウンで構成される5問のNPSアンケートを作成し、HTMLをエクスポートしてアプリに埋め込みます。

よくある質問

誰かがフォームを送信したらデータはどこへ行きますか?

デフォルトではどこへも行きません。本ツールはHTMLとJSONスキーマを生成するだけです。回答を受け取りたいときは、書き出したフォームのaction属性を自分のエンドポイントやFormspreeのようなサービスに向ける、もしくはJSONスキーマを既存のフォームライブラリに読み込ませてください。

フィールドを作ったあとに並び替えできますか?

できます。各フィールドの左端にハンドルがあるので、上下にドラッグしてください。プレビューは即時に更新され、書き出されるHTMLも新しい順序になります。

RatingとScale、数値のドロップダウンはどう違いますか?

Ratingは1〜5の星で、商品レビュー向きです。Scaleは最小値と最大値を自由に決められるスライダーです。定番の顧客ロイヤルティ調査には専用のNPSフィールドを選びましょう。0〜10の固定の並びで、両端のラベル(まったく思わない/非常にそう思う)を編集できます。数値のドロップダウンは離散値を選ばせるだけで視覚的な手がかりがなく、他より冷たく感じられがちです。

ドロップダウンやチェックボックスに選択肢を追加するには?

フィールドをクリックし、Optionsの横にある + ボタンで必要なだけ追加します。各選択肢はインラインで編集でき、× ボタンで削除できます。ラジオボタン形式のフィールドでも同じ手順です。

書き出したHTMLはWordPressやShopifyなどのCMSで動きますか?

動きます。素のセマンティックHTMLで、JavaScriptフレームワークへの依存はありません。WordPressのカスタムHTMLブロック、ShopifyのLiquidテンプレート、生のHTMLを許す任意のリッチエディタに貼り付けられます。

関連ツール