Canva Codeでインタラクティブなデザインを作成する

Canva Codeを使用すると、コードを書くような技術性を持たずに、レスポンシブでインタラクティブなデザインを作成できます。 Canva Codeを使用するには、次の2つの方法があります。

• インタラクティブなコードデザインを作成する
  • ランディングページ、ダッシュボード、ポートフォリオなどの完全なインタラクティブデザインを作成し、CanvaエディターでWebサイトとして編集および公開します
• デザインにインタラクティブなコード素材を追加します
  • クイズ、電卓、チャートなどのインタラクティブな要素を別のデザインに作成し、複数のデザインで再利用する

完全なインタラクティブエクスペリエンスを構築する場合は、コードデザインタイプを使用します。

• ランディングページ、ダッシュボード、ポートフォリオなどを作成する
• Canvaエディターで編集して絞り込む
• レスポンシブウェブサイトとして公開

1つのインタラクティブなコンポーネントを生成する場合は、Canva AIの[コード]に移動します。

• クイズ、電卓、グラフなどを素材として作成します。
• プレゼンテーション、ホワイトボード、その他のデザインタイプに追加します。 Webサイトとして公開するか、複数のデザインで要素を再利用します。

エディターのツールを使用して、Canvaコードで生成されたデザインを絞り込みます。 詳細については、Canvaコードで生成されたインタラクティブなデザインと要素を編集をご覧ください。

[

注意：インタラクティブな機能は、デザインがCanva上で表示された場合、またはWebサイトとして公開された場合に機能します。

指示文を使ってCanvaコーディングのデザインを更新するたびに、Canvaは同じチャットのスレッド内に自動的に新しいバージョンを保存します。これにより、以前のバージョンに再アクセスしたり、以前のバージョンから編集を続けたり、生成されたコードをコピーして外部に使用したりすることができます。

注意：同じチャット内で指示文を続けると、自動的に新しいバージョンが作成されます。

1. Canvaコーディングのチャットスレッドを開きます。
2. 使用するバージョンを選択します。
3. Canvaでそのバージョンを編集するには、 [デザインに使用]を選択します。

Canvaコーディングで生成された基本的なコードを表示し、Canva外で再利用できるようにコピーすることができます。

• Canvaコードは、canva.cnのユーザーを除き、Canvaで利用可能なすべての言語をサポートしています。
• Canvaコードは、入力または使用した説明からのみ指示を受けます。 文脈と指示を与えれば与えるほど、結果はよくなります。
• コードは外部でコピーして再利用することができますが、ファイルとしてエクスポートしたり、Canva内で直接編集したりすることはできません。

はい。コピーすると、コードを自分のプロジェクトで使用できます。 Canva用に構築されていますが、外部のツールやワークフローに合わせて調整できます。

お客様とCanvaの間では、法律で認められる範囲において、AI機能への入力および出力（Canvaコードおよび作成されたCanvaのコードを含む）の所有権はお客様に帰属します。Canvaは、お客様の入力または出力（作成されたCanvaのコードを含む）に対する著作権を主張することはありません。詳細および利用規約の全文については、「AIサービスに関する利用規約」をご覧ください。

Canvaコードで会話を見ることができるのはそのユーザーだけです。[デザインに使用] をクリックすると、そのバージョンの新しいデザインが作成されます。

デザインをWebサイトに公開する場合、アクセス制御は、Webサイトの公開フローで設定した内容に基づきます。

管理者、教員、またはブランドデザイナーは、チームまたはクラス内でCanvaコードにアクセスできるユーザーを選択できます。

Canvaコードは差分ベースの編集を使用するようになりました。つまり、ブロック全体を再生成するのではなく、必要なコード行のみが更新されます。 これにより、デザインロジックにわずかな変更を加える際のフィードバックが迅速になります。