What's included

• Navigation flows

  Effective navigation is central to the success of a product. Users need to find information and complete tasks at ease. The delivery for this stage is a flow diagram depicting the various connections between the screens and interactive elements.

• Wireframes

  Wireframes help define the structure and layout of the screens. Think of this as a blue print of the product that defines the layout, structure and placement of various elements on the UI. A collection of all the representative UIs designed in Figma.

• High fidelity UIs complete with content and visuals

  Define the colours, forms, typography, animation and other visual elements that define the brand of the product. Pick a few representative screens and apply visual style for them and use them as the basis for defining all the screens.

• Clickable prototype

  Identify tasks to be completed and link the screens with transitions and animations to simulate the actual product flows.

• Design system

  Define a reusable system of reusable UI components, colours, fonts, etc. that can be used for further design and development.