最初のプロンプトから共有できる公開版まで、初めての Atoms アプリを作成して公開しましょう。

始める前に、すべてのエージェント、モード、技術用語を覚える必要はありません。基本的なワークフローはずっとシンプルです。Atoms に作りたいものを伝え、作られたものを確認し、変更を加え、テストし、準備ができたら公開します。

このガイドではシンプルなカフェのウェブサイトを例に使いますが、同じ流れはランディングページ、ダッシュボード、社内ツール、またはあなた自身のアプリのアイデアにも使えます。

これらの手順は、サインイン済みのデスクトップ Web プロジェクトを対象としています。モバイルプロジェクトでは、別のモバイル向けビルドおよび配布フローを使用します。

公開する前に、現在のビルドが完了するのを待ち、公開アクセス権があることを確認し、プロジェクトがアイドル状態であることを確認し、クレジットやストレージなど必要なプロジェクトのリソースが利用可能であることを確認してください。Publish が利用できない場合は、再試行する前にプロジェクトのバージョン、アクセス権、リソース条件を確認してください。データ、シークレット、メール、AI、決済、またはその他の接続されたサービスを使用するプロジェクトは、共有前に本番環境向けの確認も必要です。

作りたいものを説明する

プロンプトボックスから始めて、欲しい結果を自然な言葉で説明してください。技術仕様を書く必要も、Atoms にどうコーディングするかを指示する必要もありません。

役立つ最初のプロンプトには通常、何を作るのか、主なセクションや機能、ビジュアルの方向性、そしてモバイルで重要な点が含まれます。

すでに App ワールド で欲しいものに近いものを見つけている場合は、ゼロから始める代わりにそのプロジェクトをリミックスして始めることもできます。

最初の結果を確認する

Atoms はプロジェクトを作成し、最初のバージョンをビルドします。準備ができたら、App ビューアー を開き、さらに変更を依頼する前に結果を確認してください。

まずはざっと確認しましょう。まだ細かな問題をすべて見つけようとする必要はありません。Atoms が主なアイデアを理解しているかを確認してください。

• 主なセクションや機能はありますか？
• 全体のレイアウトは依頼した内容に合っていますか？
• 重要なボタン、リンク、フィルター、その他の操作は反応しますか？
• 明らかに欠けているもの、壊れているもの、または意図と異なるものはありますか？

アプリは PC モードとモバイルモードの両方でプレビューできるので、次に進む前に複数の画面サイズで体験を確認してください。

変更を加える

最初のバージョンは出発点として扱いましょう。エージェントに変更したい内容を平易な言葉で伝え、その後でもう一度結果を確認してください。

一度にすべてを変えるよりも、小さく具体的な依頼のほうが通常は確認しやすくなります。

見た目の変更については、App ビューアー で要素を直接編集するか、変更内容をエージェントに説明できます。Atoms に従ってほしいスクリーンショット、デザイン、ファイル、またはその他の参考資料がある場合は、それをアップロードしてエージェントに示してください。

何かが壊れたとき: 単に好みと違うのではなく実際に壊れている場合は、Fix Bug を使うか、何が問題でどこで起きるのかをエージェントに正確に伝えてください。

それでも失敗する場合: 集中して 1 回再試行した後は、同じ依頼を繰り返すのをやめてください。影響を受けた手順、期待していたこと、実際に起きたこと、すでに試したこと、共有可能なプロジェクトリンクまたはスクリーンショットを記録してください。有料ユーザーで、アカウント、請求、または Atoms プラットフォームの問題がある場合は、Atoms Help Center を開き、Explore resources の下にある Atoms Support を選び、Contact us を選択してください。フリープランのユーザー、または一般的な製品の使い方やトラブルシューティングについては、まず Help Center、Ask Assistant、または Atoms コミュニティを利用してください。

公開前にテストする

アプリを誰かに送る前に、実際の訪問者のように数分間使ってみてください。今すぐ簡単にテストしておくほうが、共有した後で壊れたリンクについて説明するよりずっと簡単です。

• 重要なボタンとリンクをすべてクリックする。
• フィルター、フォーム、メニュー、ナビゲーションなどのインタラクティブな部分を試す。
• PC 表示とモバイル表示の両方を確認する。
• 途切れている、重なっている、欠けている、または読みにくいテキストがないか確認する。
• 主要なユーザージャーニーが最初から最後まで機能することを確認する。

アプリが保存データやバックエンド処理に依存している場合は、それらもテストしてください。Atoms は Atoms クラウド を使用したり、データ保存、シークレット、メール、AI 呼び出し、決済などの機能のために Supabase 連携 したりできます。

公開する前に、訪問者に見えるものからシークレット、パスワード、トークン、個人情報、非公開のテストデータを削除してください。プロジェクトを Public にするべきか Private にするべきかを確認し、想定するアカウントでライブリンクをテストしてください。アプリが実際の決済、メール、保存データ、または接続されたサービスを使用する場合は、共有前にそれらの本番処理を個別に確認してください。

公開する

プレビューが期待どおりに見え、主な操作が機能するようになったら、エディター右上の Publish をクリックしてください。

公開すると、選択した公開範囲に応じたアクセス設定を持つライブリンクが作成されます。Public はリンクから開くことができ、Discover に表示される場合があります。Private は所有者にのみ表示され、プランによって制限される場合があります。共有する前に意図した公開範囲を選択し、想定するアカウントでリンクをテストしてください。

公開は、あなたのプロジェクトが他の人が実際に開けるものになる時点です。プロジェクト内で開発は続けられますが、公開後は必ずライブ版を別途確認してください。

ライブアプリを確認する

共有する前に、公開済みリンクを自分で開いてください。選択した Public または Private の公開範囲によって、意図した対象者がアクセスできることを確認してください。テストにはプライベートウィンドウまたは想定するアカウントを使用してください。

• 意図した対象者に合うアカウントまたはアクセス状況を使って、新しいタブまたはプライベートウィンドウでリンクを開く。
• ページが読み込まれ、期待したバージョンが表示されることを確認する。
• 最も重要なクリックや操作をもう一度試す。
• モバイル訪問者がアプリにとって重要なら、スマートフォンでもページを確認する。

問題を見つけた場合は、プロジェクトに戻って変更を加え、もう一度プレビューをテストしてから、ライブ版を更新してください。

変更後に更新する

一度公開したからといって、アプリの変更が止まるわけではありません。必要なときはいつでも、プロジェクト内で改善を続けてください。

最初の公開後、Publish ボタンは Update に変わります。新しい変更をライブ版に反映したいときは Update をクリックしてください。

更新後は、公開済みリンクをもう一度開いて確認してください。そうすることで、次のようなシンプルで繰り返し可能な流れになります。

説明 → 確認 → 変更 → テスト → 公開 → 検証 → 更新

これが Atoms の中核となるワークフローです。より複雑なアプリでは、データ、認証、連携、カスタムドメイン、または複数のエージェントが加わることがありますが、ビルドの流れ自体は同じです。