購読者の皆様、Replit は Agent 4 をリリースしたばかりで、先週末に早期アクセスを取得しました。このチュートリアルでは、Agent 4 の新しい無限キャンバスと並列エージェントを使用して、習慣追跡アプリをライブで計画、設計、構築する方法を説明します。また、コードからプレゼンテーションとアニメーションをすべてわずか 10 分で生成する方法も説明します。 YouTube で今すぐ視聴するか、以下の文書ガイドをお読みください。タイムスタンプ:(00:00) Replit Agent 4 の 3 つの新機能(00:34) ステップ 1: 無限キャンバスを使用して習慣トラッカー アプリを設計する(03:39) ステップ 2: 並列エージェントを使用してより高速に構築する(05:52) ステップ 3: ワンクリックでフルスタック アプリを公開する(07:11) ステップ 4: スライド デッキとアニメーションを生成するコード(08:58) 正直な意見: AI コーディング市場における Replit の位置付け私たちが構築するもの私は、モチベーションを維持するために、カレンダーで習慣を確認したり、連続記録を追跡したりできるアプリを常に望んでいました。それでは、今すぐ構築してみましょう。 🔥1.キャンバスを使用して習慣追跡アプリを設計する次のプロンプトで Replit の新しい無限キャンバスを試してみましょう: モバイル習慣追跡アプリを構築します (最大 3 つの習慣)。 2 つのタブ: カレンダー (デフォルト) と習慣 (作成/編集)。カレンダー タブ: 月次ビュー。習慣が完了すると満たされる各日付リングに進捗状況を表示します。日付をタップすると、各習慣の切り替えカードが記載された下部シートが開きます。 「習慣」タブ: 習慣を作成および編集します。名前フィールド、色の割り当て。クリーンでミニマル。まずは、キャンバス上のカレンダー タブの 4 つのデザイン バリアントを検討してみましょう。グラスモーフィック — ダーク、曇りガラスのカード、柔らかな光、プレミアムな感触RPG クエスト — ピクセル アート、XP バー、ストリークの炎、ゲーム化されたボタニカル — リビング ガーデンの比喩、ストリークで植物が生える、穏やかで素朴なあなたは私を驚かせました。どのように Replit に 4 つの異なるデザインを生成するよう依頼したかに注目してください。舞台裏で 4 つの別々のエージェントを起動して作業を実行します。生成された最初の 3 つのデザインは次のとおりです。習慣追跡アプリ用のグラスモーフィック、RPG、および植物のデザイン。私は根っからのゲーマーなので、RPG クエストのデザインを採用します。次に、キャンバスを使用してデザインを視覚的に編集してみましょう。追加の画面を生成できます。 RPG デザインの + ボタンを押して、「クエスト画面を生成する」ように指示します。正確に編集します。検査アイコンをクリックして、テキストや色を手動で変更します。好みのカレンダーとクエスト ビューができたので、Replit でそれらを構築しましょう。2.並列エージェントで構築を高速化一度に 1 つのエージェントで構築するのではなく、2 つのエージェントを並列して動作させましょう。Replit では、個別のスレッドを起動してアプリのさまざまな部分で作業できるようになりました。各エージェントに与えたプロンプトは次のとおりです。 カレンダー ビュー: 月次ビューを作成し、スワイプして月間をスクロールします。今日が強調表示されます。日付セルには、習慣が完了すると進行状況リングが表示されます (1/3、2/3、3/3)。日付をタップすると、3 つの習慣のオン/オフを切り替えることができる下部トレイが表示されます。習慣ビュー: 名前と色を使用して最大 3 つの習慣を作成および編集します。各習慣には、現在の連続数が表示されます。習慣を編集すると、そのストリークがゼロにリセットされます。2 つのスレッドを開始した後は、エージェントの動作をじっと見守ることができます。このクールな Trello スタイルのボード ビューでは、タスクがドラフト、アクティブ、準備完了の 3 つの段階を経て進むのを確認できます。ドラフトは承認を待っている計画であり、アクティブはエージェントが構築中であることを意味し、準備完了は作業が完了してレビューの準備ができていることを意味します。これが、AI コーディング エージェントが向かっている方向だと私は考えています。 1 人のエージェントとペア プログラミングを行うのではなく、エージェントのチームを管理することになります。あなたは彼らに指示を与え、その場を離れ、作業を確認するために戻ってきます。エージェントが完了したら、それぞれを確認し、「メイン バージョンに変更を適用」をクリックして変更をマージできます。何を出荷するかは引き続き管理者が制御します。何かがおかしい場合は、マージする前に編集を依頼できます。アプリが構築されたら、「公開」をクリックしてワンクリックでデプロイできます。 Replit の利点の 1 つは、フロントエンド、バックエンド、データベース、セキュリティ スキャンがすべて組み込まれており、垂直統合されていることです。コードを使用してスライド デッキとアニメーションを生成するこのチュートリアル用に Replit が生成したスライド デッキでは、さらに楽しみましょう。最近、コードはすべてのナレッジワークの基礎であることに気づきました。コードを使用すると、アプリだけでなく、スライドデッキ、アニメーション、ドキュメントなども生成できます。たとえば、このニュースレターの投稿全体を Replit に貼り付け、次のアセットを生成しました: スライド デッキ。エージェントは、エージェント 4 を使用して計画を立てる方法を説明する 10 枚のスライドを作成しました。習慣トラッカーを設計して構築します。アニメーション。エージェントは、カスタム グラフィックスなどを備えた美しいアニメーションを生成しました。スライド、アニメーション、ドキュメントはすべて、内部的には単なるコードです。エージェントがコードを記述して反復できる場合、ほぼすべてのナレッジ アーティファクトを生成できます。正直な意見: Replit の Agent 4 が AI コーディング市場に適合する場所AI コーディング市場は、プロの開発者向けのツールとその他すべての人向けのツールの 2 つのセグメントに分かれていると思います。開発者にとって、これは Claude Code と OpenAI の Codex の二頭飼いだと思います。これらのツールは強力かつ高速で、モデルと開発者のワークフローに深く統合されています。他のすべての人たち、そしてこれがより大きな市場であるために、Replit はエージェント 4 で 2 つの賭けをしています。それは、技術者以外の人々が AI エージェントと直接協力することです。デザイナーは手作業ではなく AI を使用してキャンバス上にデザインを生成します。 PM は Trello スタイルのボードを通じてエージェントを管理し、仕事を遂行します。コードはナレッジ ワークの基礎です。エージェントがコードを作成できる場合は、アプリ、プレゼンテーション、アニメーションなどを生成できます。 Microsoft Office、Google Workspace、従来のデザイン ツールやアニメーション ツールをどれだけの人が使用しているか考えてみてください。それがReplitが追いかけている市場だ。Agent 4は両方の面で大きな進歩だと思う。キャンバスはもう少し磨く必要がありますが、方向性は明確です。私たちは AI エージェントと協力して、アプリだけでなく、将来的にあらゆる種類のものを構築する予定です。私のチュートリアルを見て実際の動作を確認し、エージェント 4 を実際に試してみてください。

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free