UI design: Definition of done

What it means to have ‘completed’ UI mockup:

1. Ensure the design covers all acceptance criteria on the Jira ticket.

2. If it’s a new page, or a change to a whole page, create a design for the following screen sizes: laptop (1440px), desktop (1920px), mobile (375px), and large format screens (3540px).

3. If it involves updates to any written copy, test the change in other languages (e.g. German to test longer words; Bulgarian to test a different alphabet).

4. If it’s an update to an existing design, use Figma comments to callout changes in the design (e.g. change to a button colour).

5. If it’s a new feature or component, or a larger change, review it with the other designer.

6. If there are changes made in the implementation phase (e.g. due to technical limitations, etc.) update the designs so they more closely match what will be on production.

7. When finished, write a comment on the Jira ticket explaining how all of the acceptance criteria have been met, as well as any additional design changes that have been made. If any acceptance criteria have not been addressed, explain why. Link all relevant mockups, resources, and slack conversations as well.

8. Move ticket to acceptance.

9. If it involves new components, add them to the component library in Figma [LINK] once the design has been accepted. Re-copy the component into the design from the master component in the component library, so they are now linked.