ワークフロー例

概要

このページでは、よくある自動化シナリオの RITSU ワークフローテンプレートを紹介します。各テンプレートはそのままコピーして使うことも、自分のユースケースに合わせてカスタマイズすることもできます。

フォーム送信

もっとも基本的なパターンです。ページを開き、フォームに入力して送信します。

ritsu: '0.1'
name: 'Simple Form Submission'
inputs:
  email:
    type: string
    label: 'Email'
    required: true
  name:
    type: string
    label: 'Full Name'
    required: true
steps:
  - id: step-1
    action: navigate
    name: 'Open form page'
    with:
      url: 'https://example.com/register'
      waitUntil: load
  - id: step-2
    action: fill
    name: 'Enter name'
    mode: auto
    with:
      target:
        description: 'Full name input field'
        vision:
          hint: "Text field labeled 'Full Name'"
      value: '${name}'
  - id: step-3
    action: fill
    name: 'Enter email'
    mode: auto
    with:
      target:
        description: 'Email input field'
        vision:
          hint: "Text field labeled 'Email'"
      value: '${email}'
  - id: step-4
    action: click
    name: 'Submit form'
    mode: auto
    with:
      target:
        description: 'Submit button'
        vision:
          hint: "Button labeled 'Submit' or 'Register'"

target.description と vision.hint の両方を具体的に書くことで、AI が正しい要素を安定して見つけられます。

複数ページのデータ入力

複数のページにまたがるフォーム入力のパターンです。各ページで入力したあと「次へ」で進みます。

ritsu: '0.1'
name: 'Multi-Page Data Entry'
inputs:
  company:
    type: string
    label: 'Company Name'
    required: true
  contactEmail:
    type: string
    label: 'Contact Email'
    required: true
  plan:
    type: string
    label: 'Plan'
    required: true
steps:
  - id: step-1
    action: navigate
    name: 'Open signup wizard'
    with:
      url: 'https://example.com/signup'
      waitUntil: load
  - id: step-2
    action: fill
    name: 'Enter company name'
    mode: auto
    with:
      target:
        description: 'Company name field on step 1 of the wizard'
        vision:
          hint: "Text field labeled 'Company Name'"
      value: '${company}'
  - id: step-3
    action: click
    name: 'Go to next page'
    mode: auto
    with:
      target:
        description: 'Next button at the bottom of step 1'
        vision:
          hint: "Button labeled 'Next'"
  - id: step-4
    action: fill
    name: 'Enter contact email'
    mode: auto
    with:
      target:
        description: 'Contact email field on step 2 of the wizard'
        vision:
          hint: "Text field labeled 'Contact Email'"
      value: '${contactEmail}'
  - id: step-5
    action: select
    name: 'Select plan'
    mode: auto
    with:
      target:
        description: 'Plan dropdown on step 2'
        vision:
          hint: "Dropdown labeled 'Select Plan'"
      value: '${plan}'
  - id: step-6
    action: click
    name: 'Submit signup'
    mode: auto
    approval: true
    with:
      target:
        description: 'Submit button on the final page'
        vision:
          hint: "Button labeled 'Complete Signup'"

最後の送信ステップに approval: true を設定しています。内容を確認してから送信できるため、重要なフォームでは有効な安全策です。

AI エージェントによる動的タスク

ページの構造が頻繁に変わる場合や、入力項目が動的に増減する場合は agent アクションが適しています。

ritsu: '0.1'
name: 'Dynamic Form with Agent'
inputs:
  instructions:
    type: string
    label: 'Instructions'
    description: 'What the agent should do on the page'
    required: true
steps:
  - id: step-1
    action: navigate
    name: 'Open target page'
    with:
      url: 'https://example.com/dynamic-form'
      waitUntil: networkidle
  - id: step-2
    action: agent
    name: 'Complete dynamic form'
    with:
      prompt: '${instructions}'
      maxSteps: 15

agent アクションは内部で Gemini 3.1 Pro Preview を使い、自然言語のプロンプトに従ってブラウザを自律操作します。maxSteps で最大操作回数を制御してください。

agent ステップは通常のステップより多くのクレジットを消費します。定型的な操作には click、fill、select を使い、agent は本当に動的な処理にだけ使うのが効率的です。

バッチ登録

同じフォームに大量のデータを入力する場合は、バッチ実行を活用します。ワークフロー自体は単発実行と同じですが、Run ダイアログで複数行の入力を追加します。

ritsu: '0.1'
name: 'Batch User Registration'
inputs:
  username:
    type: string
    label: 'Username'
    required: true
  email:
    type: string
    label: 'Email'
    required: true
  role:
    type: string
    label: 'Role'
    required: true
steps:
  - id: step-1
    action: navigate
    name: 'Open admin panel'
    with:
      url: 'https://example.com/admin/users/new'
      waitUntil: load
  - id: step-2
    action: fill
    name: 'Enter username'
    mode: auto
    with:
      target:
        description: 'Username input field'
        vision:
          hint: "Text field labeled 'Username'"
      value: '${username}'
  - id: step-3
    action: fill
    name: 'Enter email'
    mode: auto
    with:
      target:
        description: 'Email input field'
        vision:
          hint: "Text field labeled 'Email'"
      value: '${email}'
  - id: step-4
    action: select
    name: 'Select role'
    mode: auto
    with:
      target:
        description: 'Role dropdown'
        vision:
          hint: "Dropdown labeled 'Role'"
      value: '${role}'
  - id: step-5
    action: click
    name: 'Create user'
    mode: auto
    with:
      target:
        description: 'Create user button'
        vision:
          hint: "Button labeled 'Create' or 'Save'"

Run ダイアログでバッチモードに切り替え、入力テーブルに複数行を追加します。

username	email	role
alice	alice@example.com	admin
bob	bob@example.com	editor
carol	carol@example.com	viewer

各行が独立した run として順番に処理されます。1 バッチあたり最大 200 件まで登録できます。

条件分岐

if 式を使うと、入力値に応じてステップの実行を切り替えられます。

ritsu: '0.1'
name: 'Conditional Registration'
inputs:
  email:
    type: string
    label: 'Email'
    required: true
  subscribeNewsletter:
    type: boolean
    label: 'Subscribe to newsletter'
    required: false
steps:
  - id: step-1
    action: navigate
    name: 'Open registration page'
    with:
      url: 'https://example.com/register'
      waitUntil: load
  - id: step-2
    action: fill
    name: 'Enter email'
    mode: auto
    with:
      target:
        description: 'Email input field'
        vision:
          hint: "Text field labeled 'Email'"
      value: '${email}'
  - id: step-3
    action: click
    name: 'Subscribe to newsletter'
    mode: auto
    if: 'subscribeNewsletter == true'
    with:
      target:
        description: 'Newsletter subscription checkbox'
        vision:
          hint: "Checkbox labeled 'Subscribe to our newsletter'"
  - id: step-4
    action: click
    name: 'Submit registration'
    mode: auto
    with:
      target:
        description: 'Submit button'
        vision:
          hint: "Button labeled 'Register'"

if 式が false と評価されたステップは skipped として扱われ、後続のステップは通常通り実行されます。

これらのテンプレートは出発点です。実際のワークフローは動画録画から自動生成されるため、通常はエディタで微調整するだけで十分です。テンプレートをゼロから書く必要はほとんどありません。

次のステップ

パフォーマンスのコツ効率的なワークフロー設計とクレジット節約のベストプラクティスを学びます。ワークフローと RITSU フォーマットRITSU フォーマットの詳細とステップ種別を確認します。変数とテンプレートテンプレート構文と変数の型を詳しく学びます。

概要#

フォーム送信#

複数ページのデータ入力#

AI エージェントによる動的タスク#

バッチ登録#

条件分岐#

次のステップ#

概要