Step by step 8 steps

1. 1

   Step 1 of 8

   Create a Project Folder

   Start with a clean folder so Codex has a clear place to write the app.

   Copy

   mkdir gpt-image-review-app
   cd gpt-image-review-app
   git init

   The git init step gives you a checkpoint before Codex starts creating files. If the first version drifts, you can inspect the changes and recover more easily.

   Open that folder in Codex Desktop. You can use Codex from the terminal too, but Desktop is useful here because you can run the app, preview it in the browser, and give visual feedback later.

2. 2

   Step 2 of 8

   Ask Codex to Build the App

   Paste this prompt into Codex:

   

   Copy

   Build a local browser app for bulk image generation with GPT Image 2.0. Use a clean editorial studio theme. Let me describe a marketing campaign and design brief, choose image dimensions, generate editable prompts, create test images through OpenAI, and review results with Keep, Reject, Needs revision, and Notes fields. Create the files, show me how to add my OpenAI API key to .env, and test the flow.

   This keeps the request focused. You are asking Codex for a local browser app, not a terminal-only script. You are also asking for the API key to live in .env, which keeps secrets out of the frontend code.

   If you want to use OpenRouter, say that directly in the prompt. You can also paste the relevant model or endpoint reference into Codex. New image models can be easy for coding agents to miss, so giving Codex the exact provider details can save a few rounds of cleanup.

3. 3

   Step 3 of 8

   Add Your API Key

   After the first build, get an OpenAI API key and add it to the app's .env file.

   

   Codex should usually create a .env.example file. Copy that file to .env, then paste your key into the matching variable.

   Copy

   cp .env.example .env

   Your app may use a variable like:

   Copy

   OPENAI_API_KEY=...

   If you are using OpenRouter, the app may use a second variable like:

   Copy

   OPENROUTER_API_KEY=...

   Do not paste API keys into browser JavaScript or commit them to git. The local server should read the key from .env and make the image request from the backend.

4. 4

   Step 4 of 8

   Run the App

   Install dependencies and start the local server:

   Copy

   npm install
   npm run dev

   Open the localhost URL Codex gives you. It will usually be something like:

   Copy

   http://localhost:3000

   If Codex Desktop can run and test the app for you, let it. The terminal output helps Codex debug broken routes, missing packages, and API errors.

5. 5

   Step 5 of 8

   Describe the Campaign

   In the app, describe the marketing campaign and design brief you want to test.

   

   Keep the brief short, but include enough direction to shape the images:

   Copy

   Create a launch campaign for a local, golf-themed coffee shop. The visuals should feel elegant, modern, useful, and credible. Avoid generic robot imagery. Show interior, exterior, and product shots.

   The brief is the control panel for the workflow. If the prompts feel generic later, come back here and tighten the audience, visual style, required subjects, or things to avoid.

6. 6

   Step 6 of 8

   Choose Image Dimensions

   Choose the dimensions you want before generating prompts.

   

   For a real campaign, you might test:

   • square images for social posts
   • portrait images for stories or shorts covers
   • landscape images for headers or thumbnails

   Start small. Two formats with two images each is enough to prove the workflow before spending more credits.

7. 7

   Step 7 of 8

   Generate Prompts

   Click Generate Prompts before you create images.

   

   This step matters because it lets you catch weak prompt direction before you spend credits on image generation. Read the generated prompts and edit anything that feels too vague, too generic, or too far away from the campaign.

   Check for three things:

   • the prompt matches the campaign brief
   • the selected image dimension makes sense
   • the prompt avoids things you explicitly did not want

   Once the prompts look useful, click Generate Images to Test.

8. 8

   Step 8 of 8

   Review the Results

   When the images finish, review them in the gallery.

   Use the review controls while the reasoning is fresh. Mark the obvious keepers, reject anything that misses the brief, and leave notes on images that are close but need another pass.

   The transcript called out one practical detail: image generation can take a while, especially through provider endpoints. Do not assume the app is broken just because a real batch takes longer than the prompt preview.

   If generation fails, check the simple things first:

   • the API key is in .env
   • billing or credits are enabled
   • your account or organization can access the image model
   • the app is calling the provider you intended to use
   • the terminal does not show a missing package or route error

Background and context

Who This Is Useful For

• Content teams that need social, newsletter, course, or launch images in batches
• Marketers who want to test multiple image directions from one brief
• Founders and operators who want a reusable local workflow instead of scattered downloads
• Codex Desktop users who want to build and test a useful browser app without starting from scratch

What You Will Build

You will build a Node app that runs locally in the browser.

The app should let you describe a campaign, choose image dimensions, generate prompts, create images, and review the results in one place. In the demo, the app saves generated images locally and gives each card simple review controls like Keeper, Reject, Clear, and Notes.

What You Need to Get Started

• Codex Desktop
• Node installed on your computer
• A new project folder
• An OpenAI API key or OpenRouter API key
• A small campaign idea to test

Pro tip: we like OpenRouter for keys, and you can use the new ChatGPT Image 2.0 model through OpenRouter too.

Before generating real images, make sure the account you use has billing or credits enabled.

Going Further

Once the app works, use Codex Desktop Annotation Mode to refine the interface.

Click or drag over anything you want fixed: labels, spacing, review states, controls, or layout. Then ask Codex to apply the fixes and retest the app.

This is where Codex Desktop is especially useful. Instead of describing a vague UI problem from memory, you can point at the exact part of the local app that needs work.

Good next upgrades:

• add a history view for past campaigns
• add a regenerate button for rejected images
• add saved brand profiles
• export review notes as CSV
• create contact sheets for faster review
• add OpenRouter as a selectable provider

Keep the improvements practical. The win is a local image testing workflow you can reuse for future campaigns, not a bigger app than your team actually needs.