656件のすぐ使えるモバイルアプリ画面

プロンプトの中身

プロンプトは説明ではなくコードの運び手です。クリップボードに届く内容を正確に説明します。

コードの運び手です

「プロンプト」という言葉は、説明文を思い浮かべると誤解を招きます。クリップボードに届くものの約95パーセントは、実際のソースコードそのものです。残りは、ファイルをどこに置き何をインストールするかをエージェントに伝える短い指示です。エージェントは貼り付けと配線をするだけでデザインすることはないため、結果は解釈ではなく正確な一致になります。

ブロックの中身

  • タスクの1行の説明と、デザインが対象とするSDK。
  • ルール:1対1で再現すること、すべてのファイルを完全に作成すること、ライブラリを差し替えないこと。
  • 書き込むべきパスとともに、すべてのファイルをそのまま。
  • あなたのSDKにバージョンを合わせるため、npx expo installでインストールされる正確な依存関係のリスト。
  • デザインがカスタムフォントを使う場合、アプリのルート用のフォント読み込みスニペット。
  • 実際に効いてくるセットアップの注意点:ReanimatedのBabelプラグイン、gesture-handlerのルートビュー。
  • Expo RouterまたはReact Navigationのどちらを使っていても組み込める方法。

指示部分の形

You are given the task of integrating an existing React Native screen
into an Expo codebase.

RULES, non-negotiable:
- Replicate the design 1:1. Do NOT change any color, font, size, spacing,
  radius, wording, or animation value. Do not adapt the design to this
  project's existing theme, colors, tokens, or components.
- Create every file below IN FULL. Never abbreviate, never use placeholders.
- Do not substitute libraries.

Create this file at components/clean-settings/screen.tsx:
...
コードはあなたのものです
一度貼り付ければ、リポジトリ内の通常のソースコードです。編集も、リファクタも、半分削除するのも自由です。当社への実行時の依存関係はなく、何も外部に送信されません。

代わりにコードをコピー

どのデザインの「コード」タブでも、指示部分のない生のファイルが手に入ります。手作業で組み込みたい場合向けです。内容は同じで、包み方が違うだけです。