操作ガイド
Pixso AIでデザインを生成する
Pixso AIに作成したいページを説明すると、編集可能なデザインを生成できます。ページの内容、レイアウト、見た目の方向性を伝え、生成後はキャンバス上で編集を続けます。新しいインターフェースの案を検討したり、ページのたたき台を作成したりするときに便利です。
デザインモードを開く
- Pixsoのデザインファイルを開きます。
- 左サイドバー上部のAIを選択し、AIとの会話を開きます。
- 会話をデザインモードに切り替えます。
- 作成したいデザインを説明し、リクエストを送信します。
例えば、「デスクトップ向けのプロジェクトダッシュボードを作成してください。左側のナビゲーション、プロジェクト概要、進捗カード3枚、タスク一覧の表を配置し、明るい背景に青のアクセントを使って、見出しを読みやすくしてください」と指定します。「ダッシュボードを作って」のような一般的な依頼だけでなく、プロジェクトに必要な要素を具体的に伝えます。
モデルを選ぶ
リクエストを送信する前に、AIパネルのモデル選択欄で、利用可能なモデルから使用するものを選びます。
デザインシステムを選ぶ
デザインシステムを選ぶと、色、書体、コンポーネント、レイアウトパターンなどの視覚的なルールをAIに伝えられます。目的に合った方式を選びます。
- 自動選択：説明と利用場面に基づいて、AIが見た目の方向性を選びます。アイデアを検討する段階に向いています。
- 汎用：用意されているデザインシステムを選び、一貫したスタイルを出発点にします。
- カスタム：チームが公開したコンポーネントライブラリと、そのデザインルールを使います。
カスタムライブラリを利用するには、先にそのライブラリのAIアクセスを有効にします。設定できる場所と必要な権限は、AIでカスタムデザインシステムを使うを参照してください。
依頼内容は、選んだライブラリの用途に合わせます。例えば、レポート画面にはダッシュボード向けのコンポーネントライブラリが適しています。ライブラリと関係のない見た目を指定すると、用意されたコンポーネントを十分に活用できない場合があります。
スキルを使う
スキルは、特定の種類のデザイン作業に使う、再利用可能な指示の集まりです。デザインルール、作業手順、分野に関する知識などを含められます。ページのレイアウト整理、内容の改善、スタイル調整など、目的に合ったスキルを選びます。
スキルを選んだ場合も、求める結果はプロンプトで説明します。スキルは作業の進め方を補うもので、ページの要件を代わりに決めるものではありません。
参考画像を追加する
レイアウトやスタイルを言葉だけで伝えにくいときは、参考画像をアップロードします。AIは画像内の配置、色、書体、表現方法をデザインの参考にできます。
- 作成するページに関連した、内容が明瞭な参考画像を選びます。
- AIへのリクエストに画像を追加します。
- カードの配置、配色、余白など、参考にする部分を指定します。
- 自分のページに必要な内容と機能を説明し、リクエストを送信します。
例えば、「この画像のサイドバーとカード間の余白を参考にしてください。内容はプロンプトで指定したプロジェクトダッシュボードのままにし、参考画像の文章やアイコンはコピーしないでください」と伝えます。
参考画像はデザインの方向性を伝えるためのものです。画像を完全に再現する指示とは異なります。小さな文字、アイコン、複雑な細部は元画像と異なる場合があります。大きな画像は圧縮されることがあるため、必要な範囲が鮮明に見える画像を使ってください。
生成結果を調整する
生成されたページの内容、情報の優先順位、レイアウトを確認します。変更したい部分を選択し、具体的な調整内容を伝えます。複雑なページでは、一つの領域ずつ編集し、結果を確認してから次へ進みます。
リクエストが失敗したり会話が中断したりした場合は、セッションIDと発生状況を控えてPixsoサポートに連絡してください。