Wixel：AI でウィジェットを作成する
4分
この記事内
- デザイン内におけるウィジェットの活用例
- ウィジェットを作成する
- ウィジェットを共有する
- よくある質問
Wixel では、AI アシスタントの Aria にウィジェットの生成を依頼して、自分だけのインタラクティブなウィジェットを作成することができます。これにより、静的なウィジェットだけでなく、クリック、ホバー、入力などの操作に反応するウィジェットを、簡単に構築することができます。
ウィジェットはカスタムパーツであるため、現在 Wixel で利用できるオプションの枠を超えて構築することができます。通常のツールではまだ作成できないパーツやインタラクションであっても、ウィジェットとしてであれば作成できる場合があります。
注意：
AI を使用してウィジェットを生成・編集すると、AI クレジットが消費されます。
デザイン内におけるウィジェットの活用例
ウィジェットを使用すると、サイトに特定の用途に適したエクスペリエンスを実装することができます。たとえば、数値をアニメーション表示させたり、独自のロジックを組み込んだミニアプリを作成したりと、その機能や複雑さを自由に決めることができます。
たとえば、ウィジェットを使用すると、以下のようなものを作成することができます：
- ユーザーがデータを並べ替えたり、検索したりできるインタラクティブなテーブル。
- キャンペーン用の、「スネーク」や「テトリス」のようなミニゲーム。
- ユーザーの操作に合わせてデータが強調表示される、インタラクティブなインフォグラフィック。
- 価格計算や住宅ローン計算などの計算ツール。
- パスワード生成ツールなどのミニアプリ。
ウィジェットを作成する
Aria に作成したいウィジェットについて伝えると、ウィジェットを生成してもらうことができます。その際、ウィジェットの機能、ユーザーの操作方法、希望するスタイルなどを含めると効果的です。プロンプトは具体的であるほど、イメージ通りの結果を出力してもらいやすくなります。
ウィジェットを作成する方法：
デスクトップブラウザ
Wixel アプリ
- Wixel でプロジェクトにアクセスします。
- Aria に希望するウィジェットの作成を依頼します（例：「ユーザーが 3つのプランを切り替えて料金を計算できる、洗練された外観のカスタムウィジェットを生成してください」など）。
ヒント：これにより、Aria によってウィジェットが生成され、プロジェクトに新しいアセットとして追加されます。 - （オプション）テーマを変更し、プロジェクトに合わせてウィジェットの色とフォントを調整します。
満足する結果ではありませんか？
ウィジェットで変更してもらいたい箇所を Aria に指示するか、アクションバーの「Regenerate（再生成）」をクリックすると、Aria に別のバージョンのウィジェットを生成してもらうことができます。元のウィジェットを候補として残しておきたい場合は、まずウィジェットを複製してから、コピーしたウィジェットを再生成してください。
ウィジェットを共有する
生成されたウィジェットは、方法や場所を選択して共有することができます。完成したウィジェットでは、インタラクティブな機能を維持したまま共有できる公開リンクを作成することが可能です。
これにより、ドキュメントやプレゼンテーション、その他のプラットフォームを含め、URL に対応しているツールにウィジェットを埋め込むことができます。一度 Wixel で作成したインタラクティブなウィジェットは、さまざまなチャネルで再利用することができます。
ヒント：
ウィジェットは、他のデザインと同様、現在作業中のプロジェクトの中に追加されます。これにより、特定のクライアントやキャンペーンに関するすべてのパーツを、一元的に管理できるようになっています。また、プロジェクトにウィジェットやデザインをより多く追加していくことで、ターゲットや用途に合わせていつでも再利用できる、自分だけのアセットを整えておくことができます。
よくある質問
Wixel のウィジェットに関する詳細については、以下の質問をクリックしてください。
ウィジェットの作成に使用できる既存のテンプレートはありますか？
作成したウィジェットはどこに保存されますか？
作成したウィジェットを Wixel 外で共有することはできますか？