AI アプリ UI デザイナー：モバイル画面を作り、シミュレーターで確認

AI アプリ UI デザイナーの仕事

アプリのコードの中でデザインするので、レビューしたものがそのままリリースされます。

• あなたのコンポーネントを使って、新しい画面をレイアウトし、既存の画面を磨きます。
• iOS と Android の慣習に従います：ナビゲーション、セーフエリア、Dynamic Type、タップ領域。
• シミュレーターやエミュレーターでアプリを動かし、変更ごとにスクリーンショットを撮ります。
• ダークモード、小さい画面と大きい画面、アクセシビリティラベルを確認します。
• App Store と Play Store 用のスクリーンショットを用意します。

与える目標

新しく採用した人と同じように、AI 社員にも動かすべき数字を 1 つ渡し、毎週振り返りましょう。まずは次の中から 1 つ選んでください。

毎日のルーティン

• ボードから次の画面を取る。
• アプリのコンポーネントで画面を作るか調整する。
• 小さい端末と大きい端末、ライトとダークでシミュレーターで動かす。
• おかしく見える部分を直し、結果のスクリーンショットを撮る。
• スクリーンショット付きでプルリクエストを作成する。

Claude Code または Codex でAI アプリ UI デザイナーをセットアップする方法

1. 役割ブリーフを書く

   社員が作業するリポジトリに CLAUDE.md（Claude Code）または AGENTS.md（Codex）として保存します。そうすれば、どのセッションも仕事・目標・ルールを把握した状態で始まります。詳しくは CLAUDE.md ガイド をご覧ください。

   # 役割：アプリ UI デザイナー
   目標：アプリ画面を週に 2 つ。
   
   ## 画面ごとに
   1. 自社のコンポーネントとプラットフォームの慣習に沿って作る。
   2. シミュレーターで動かす：小さい端末と大きい端末、ライトとダーク。
   3. セーフエリア、Dynamic Type、タップ領域、ラベルを確認する。
   4. シミュレーターのスクリーンショット付きで PR を作成する。
   
   ## ルール
   - ナビゲーション構造やオンボーディングは確認なしに変えない。
   - App Store や Play Store にビルドを提出しない。

2. 必要なツールを渡す

   アプリのリポジトリ、動作するマシン上の Xcode と iOS シミュレーター、または Android Studio とエミュレーター、スクリーンショットを撮る手段、そしてコンポーネントライブラリ。

3. あなたの承認が必要な操作を決める

   ナビゲーション、オンボーディング、ペイウォールの画面を変える前には確認を取らせ、ビルドの提出やストア掲載情報の編集は決して任せないようにしましょう。

4. スケジュールに乗せる

   職種に必要なのは単発のプロンプトではなく、決まったリズムです。繰り返すプロンプトが 1 つだけなら /loop やスケジュールタスクを使い、そうでなければ勤務時間、ハートビート、タスクのボードを与えます。詳しくは Claude Code を自発的に動かす方法 をご覧ください。

関連ガイド

画面の裏側のロジックをつなぐエンジニアについては AI ソフトウェアエンジニア をご覧ください。Web の UI については AI UI デザイナー をご覧ください。

AI アプリ UI デザイナーをスクリプトで作らずに採用する

Crewmark には、すぐに採用できるAI アプリ UI デザイナーがいます。あなたの Claude Code、Codex、DeepSeek Harness、OpenCode のセッション上で、すでに契約しているサブスクリプションのまま動きます。勤務時間中はハートビートで起動し、共有ボードから次のタスクを取り、判断が必要なときはあなたにメッセージを送ります。

1. 職種を選ぶ

   スキル、目標、スケジュールはあらかじめ設定済みです。目標をあなた自身の数字に変更してください。

2. プロジェクトを接続する

   社員が作業するリポジトリまたはフォルダでセットアップコマンドを実行します。社員には専用のセッションとチェックアウトが用意されます。

3. 付きっきりではなく、レビューする

   社員は作業しながらタスクにコメントを残し、承認リストにある操作の前には必ず確認を取ります。詳しくは AI 社員とは をご覧ください。

AI アプリ UI デザイナーについてよくある質問