Design review before handoff

Before a sprint's designs go to developers, a team checks the same things every time: are empty, loading and error states drawn, do fields have labels and validation messages, are the accessibility notes there. This example has Mida, MockFlow's AI assistant, review the wireframe board against that checklist and write the result where developers look: the pull request.

Download the code (Node.js 18 or later, no packages)

What it does

• Reviews the board with your checklist as the focus, and gets a score per aspect and an overall score.

• Writes a Markdown table of the feedback to review.md, and to the run's summary page in GitHub Actions.

• Fails the run when the overall score is below MIN_SCORE, if you set one.

How it works

1. Read the checklist from focus.txt, up to 500 characters.

2. Read the board for its title and link.

3. Ask Mida for a review with POST /boards/{boardId}/ai/review and the checklist as focus. The answer has overallScore and feedback, one entry per aspect with a comment and a score.

4. Write the summary, and exit with an error when the score is under the threshold.

Run the example

Create an API key in the developer console with the scopes user:read, boards:read and ai:generate, then run it with the board's id from GET /boards:

cp .env.example .env        # paste your key into .env
node review.js YOUR_BOARD_ID

The download includes .github/workflows/design-review.yml, which runs the review when a pull request gets the design-review label. Add the MOCKFLOW_API_KEY secret and the DESIGN_BOARD_ID variable to the repository.

The key code

const review = await mf.post(`/boards/${boardId}/ai/review`, { focus });

const summary = [
  `**Overall score:** ${review.overallScore ?? 'not scored'}`,
  '| Aspect | Score | Feedback |',
  '| --- | --- | --- |',
  ...review.feedback.map((f) => `| ${f.type} | ${f.score ?? ''} | ${f.comment} |`),
].join('\n');

// In GitHub Actions this file is shown on the run's summary page.
if (process.env.GITHUB_STEP_SUMMARY) fs.appendFileSync(process.env.GITHUB_STEP_SUMMARY, summary);

if (min && review.overallScore !== null && review.overallScore < min) process.exit(1);

Adapt it

• Marketing: review a campaign board for a clear audience, message and call to action before launch.

• Teachers: review a student's project board against the assignment's rubric.

• Architecture reviews: review a cloud architecture board for single points of failure and missing monitoring.

What you need

An API key with user:read, boards:read and ai:generate. Plus or Max; each review uses AI credits.