--- title: "デザインを選ぶ | Briks" url: https://briks.dev/ja/docs/pick-a-look description: "サイトを作成する前に、3つのルックを確認できます。色、書体、角の形、ボタン、カードを、お客様ご自身のヒーローの言葉で組んだボードです。選んだものを作成します。" last_updated: 2026-10-08 --- # デザインを選ぶ サイトの見た目に迷っていますか? **Choose the look from three directions** をオンにすると、最初のビルドは計画のあとで一時停止し、あなた自身のヒーロー部分の言葉で描いた3つのデザインを見せます。1つを選ぶと、サイト全体がそのデザインで作られます。オンにしない限りオフのままです。 読了時間 5 分 2026年10月8日にスタジオで確認済み ## オンにする 1. スイッチをオンにする 場所: How it is built New projectの6番目のステップで、**Choose the look from three directions** をオンにします。初期状態ではオフです。 2. レビューを確認する 場所: Review and create レビューの **How it is built** に **On** と表示されます。**Build it** を押してください。 briks.dev では、プロンプト欄の **+** メニューに **Pick a look first** のスイッチがあります。「See three looks for your business and build the one you pick.」と表示されます。New project ページでは、すでにオンになった状態で開きます。 提案されない場合 「Pick a look」は、気に入ったサイトを追加せずに作るホームページとアプリ向けのステップです。サイトを追加した場合、このステップには「Your reference site decides the look and the hero, so there is none to choose.」と表示されます。ダッシュボードでは「A dashboard builds straight through, with no words to approve and no look or hero to choose.」と表示されます。 このスイッチはプロジェクトの **Preferences** にも表示されますが、まだ計画されていない最初の構築にしか影響しません。そのため、設定する場所はNew projectページです。 ## ビルドのどの段階で行われるか 1. **Build it** を押して、[作成前の質問](https://briks.dev/ja/docs/questions-before-building) に答えます。 2. Briksがサイトを設計します。 3. **Approve the words before building** がオンの場合は、先に文章を承認します。 4. 3つのデザイン案が描かれました。ステータスには **Waiting for your approval** と表示され、メッセージ欄には「Describe the look you want, or choose one above」と表示されます。 5. **Choose the hero from four wireframes** がオンの場合は、次にヒーローを選びます。 6. 選んだデザインでサイトが構築され、プレビューとして公開されます。 ボードはメッセージとして届きます。「サイトのイメージを3案ご用意しました。それぞれ、スタジオ独自のスタイルのひとつで、あなたの言葉に合わせて描いています。ひとつ選ぶか、望むイメージを言葉で伝えてください。」 ## ボードに表示される内容 各ボードはデスクトップサイズで描かれ、会話の中では小さく表示されます。クリックすると原寸で見られ、矢印キーまたは左右のキーで3枚を行き来できます。各ボードの内容は次のとおりです。 - そのデザインの名前と、それについての一言 - 6つのカラースウォッチ: **Ground**、**Surface**、**Ink**、**Muted**、**Accent**、**Soft**。 - 2つの書体を名前で表示し、見出し用書体で大きな **Aa** を表示します。 - ヒーローの文言:見出しの上の小さな行、見出し本体、その下の行、そして最大2つのボタン。 - 3枚のサンプルカード。角の形や、カードが並んだときの見え方が分かります。 ボードには写真はありません。色、書体、形が示されています。3つの違いはこの点にあります。 | 見た目 | スタジオでの表示 | | --- | --- | | **北欧風 / すっきり** | 静かで軽やかな雰囲気：淡い背景、黒い文字、角の四角いデザイン、たっぷりの余白。 | | **温かみのある** | 親しみやすく、雑誌のようなデザインです。温かみのある紙の色合い、個性的なセリフ体、鮮やかなアクセントカラーを1色使います。パン屋、花屋、建具職人のように手を動かす仕事なら、クリームとオリーブ、やわらかなセリフ体、丸みのある角で、自然な手作りの雰囲気になります。 | | **太字** | にぎやかで明るい印象です。彩度の高いアクセントカラー、太く丸みのある書体、大きくやわらかな角を使います。 | ## デザインを選ぶ 1. 実際のサイズで見比べる 場所: Studio それぞれのボードを開いてください。見出しの書体とボタンを見てみましょう。見た目の印象は、色見本よりもこの二つで決まります。 2. Use this lookを押す 場所: Studio 各ボードの下と、フルサイズ表示の上部にあります。 3. 作らせる 場所: Studio 選んだボードには **Chosen** と表示され、ほかは薄くなります。アクティビティの行には「Building in the look you chose.」と表示されます。 ## どれも合わないとき 代わりに、ご希望をボックスに入力してください。例: `Like the Warm one but darker, with a plain sans serif for headings`。3つのボードは脇に置かれ(カードに「Set aside for what you described」と表示されます)、Briks は予定していたデザインをご希望の方向に寄せて進めます。新しいボードを3つ描き直すことはなく、ご入力の内容が選択となってビルドが進みます。 サイトができたあとも、見た目に関することはメッセージでいつでも変更できます。色や書体が決まっているなら、**Preferences** の **Design rules** で固定しておくと、以降のビルドにも引き継がれます。 ## 料金について ボードの計画と作図は、制作の最初の工程です。かかった作業分が請求され、**Build it** で確保された50クレジットの残りは、制作があなたの確認を待つ間に戻ります。 選ぶと新しい保留が始まります **Use this look** を押すと残りの作成が始まり、最大50クレジットが確保されます(残高がそれより少ない場合は残高分で、最低5まで)。課金は実際にかかった作業に応じて行われます。その時点で残高が5未満の場合は、スタジオがその旨を伝え、選択は保留されます。代わりにボックスで外観を説明した場合は、変更と同じく5が確保されます。合計50クレジットのFreeプランでは足りなくなることがあるので、オンにする前に残高を確認してください。 ## 使うタイミング - 色や書体がまだ決まっておらず、スタイルを言葉で説明するより、画像から選びたいときにお使いください。 - 色と書体がすでに決まっている場合は省略し、代わりに **Your brand** で設定してください。 - 気に入ったサイトが見つかっているなら、省略してかまいません。そのサイトが見た目を決めるので、このスイッチは表示されません。 - 席を外す場合はスキップしてください。ビルドはボードの段階で、選ぶまで待機します。 ## 具体例 選択済み ヨークの花屋さん > 依頼内容は、ウェディングの仕事と毎週の配達がある花屋さんです。**Choose the look from three directions** がオンになっています。 花屋は手を使う仕事なので、**Warm** ボードにはクリームとオリーブの色、やわらかいセリフ体、丸みのある角が並びます。オーナーがこれを選ぶと、サイトはこのデザインで作られます。 言葉で説明する場合 レスターの税理士 > 3つのどれもしっくりきませんでした。オーナーはこう入力しました。`Nordic, but with a deep green accent and a serif for headings.` ボードは脇に置かれ、ビルドは予定していたデザインのまま、アクセントをグリーン、見出しを明朝体寄りのセリフ書体に寄せて続行されます。 ## よくある質問 ### ボードは後からまた見られますか? 選んだ場合は、はい。選んだものに **Chosen** の印が付いた状態で、会話に残ります。説明文を選んで見送ったボードは、再び表示されません。 ### すでにあるサイトの見た目を選べますか? いいえ。ボードは最初のビルドの前に使うものです。作成済みのサイトは、「見出しは明朝体にして、色を温かみのあるものに」のようにメッセージで変更を伝えてください。 ### アプリにも使えますか? はい。スイッチがオンで、気に入ったサイトが追加されていなければ、ホームページとアプリの両方でボードが表示されます。ダッシュボードでは表示されません。 ## 次に読む - [ビルド中 **作成中に承認する** 最初のビルドを途中で止めて確認できます。文章を承認し、3つのデザインから1つを選び、4つのグレーのレイアウトからヒーローを選びます。オンにする方法と費用をご案内します。](https://briks.dev/ja/docs/approval-steps) - [ビルド中 **新しいプロジェクトを始める** 新規プロジェクトページの全選択肢を順に解説：種類、依頼内容、気に入ったサイト、ブランド、画像、ビルド設定、開始時の費用。](https://briks.dev/ja/docs/new-project) - [ビルド中 **好きなサイトからホームページ作成** 気に入ったサイト1つとスクリーンショット最大6枚を追加。Briksがレイアウトや余白、書体、動き、メニューを読み取り、真似せず雰囲気を活かして作ります。](https://briks.dev/ja/docs/build-from-sites-you-like) - [はじめに **クレジットとプラン** Briksのクレジットの仕組み:50と5の確保、作業分の請求、見積もりと待機するビルド、残高ゼロのとき、各プランの内容。](https://briks.dev/ja/docs/credits-and-plans) まだ解決しませんか? プロジェクト名と、表示されると思っていた内容を添えて [hello@briks.dev](mailto:hello@briks.dev) までご連絡ください。スクリーンショットがあると助かります。