# How to Write a UI Design Requirements Confirmation

Source: https://www.jvds.cn/en/share/ui-design/ui-design-requirements-confirmation-template
Language: en
Published: 2026-09-26
Author: JVDS Design Studio

In UI design projects, one sentence can easily sour the relationship halfway through: **“Didn't we agree on 30 pages in total? Why have we drawn 50 screens and still not finished?”**

Looking back, neither side was usually trying to break the agreement. The problem was that the brief said only “UI design for an administration system, approximately 30 pages,” without a shared definition of **what counts as one page**. To the client, User Management is 1 page. In actual design work, it includes a user list, a new-user modal, a bulk-import error dialog, a role-permissions drawer, and an empty-data state. The client may also assume, “Once you've done desktop, surely you'll include mobile and tablet too?” What was 1 page in the budget suddenly becomes 12 artboards.

To discuss the awkward details up front and keep the collaboration straightforward, before every [UI/UX product design](https://www.jvds.cn/en/service/uiux) project we sign a **UI Design Scope and Deliverables Confirmation** of fewer than two pages with the client. It settles four things:

![Artwork](https://www.jvds.cn/upload/2026/0824/1787562642298-711137.webp)

## 1. Define how core screens and derived states or modals are priced

Do not estimate work using a vague page count. Break the inventory into three levels:

- **Core Screens**: Pages with genuinely independent layouts and information modules, such as an overview dashboard, a product detail page, or a complex workflow canvas.
- **Derived states and overlays (Modals / Drawers / States)**: New/edit modals, filter drawers, empty states, loading skeletons, and error messages attached to a core page. The confirmation should specify: *“Each core screen includes 2–3 standard interaction states or modal designs by default. If a module contains an unusually long multi-step wizard, such as a complex 6-step configurator, its workload is estimated separately as a core screen.”*
- **Reusable template pages**: Pages sharing a structure and differing only in copy and images—for example, 5 sub-industry introductions built on the same framework—are estimated as 1 main design layout plus 4 adaptations. This saves the client unnecessary duplicate design fees.

![Workflow](https://www.jvds.cn/upload/2026/0824/1787562642298-693318.webp)

## 2. Specify target devices and reference canvas sizes (Target Viewports)

Before drawing, state which devices the deliverables cover:

- Only **PC desktop**, at a reference size of `1440×900px` or `1920×1080px`?
- Or also **dedicated mobile designs**, at `375×812px`?
- Are **both Dark Mode and Light Mode themes** included? If so, the color architecture must be planned in advance using Figma Variables, and the additional workload included separately using an agreed multiplier.

![Acceptance](https://www.jvds.cn/upload/2026/0824/1787562642298-751268.webp)

## 3. Define staged approvals: settle the homepage style before extending it to inner pages

The confirmation must include one firm process rule: **first produce 1–2 representative core pages, usually the homepage or main workspace, to establish the visual direction**. At this stage, the client can fully discuss changes to colors, corner radii, type size and density, and the light or dark atmosphere. Once the style has been approved in writing and work has begun on the next 30 inner pages, wholesale changes to the overall background palette or global layout are no longer accepted.

## 4. List the assets that will be handed over

Once the final payment is settled, a few static JPG previews are not enough. Put a checklist at the bottom of the confirmation: `[✓] Figma (.fig) source files with consistently named layers`, `[✓] Global color, type, and shadow styles plus basic components (Buttons, Inputs, Tables, Tags)`, and `[✓] An inspection link where frontend engineers can check spacing and export assets directly`. With these four areas in one table, both sides can focus on improving the product from day one.
