How we designed a retail app

How do we design applications that use FusionFabric.cloud APIs? You will see how by following design best practices and using the design system app starter kits you can create and build a retail application.

Previewlink

Persona & user flowslink

First step is to focus on the user and define the personas and their goals before you start designing any screens. For each goal we define the steps required to achieve it.

User goal

Design with APIlink

Explore the APIs catalogue and API documentation to design with real data.

Design with API

Prototypelink

Wireframe

After some initial sketches on paper, let's focus next on the wireframes. This step of the design process allows you to have a global vision of your screens and see if you don't miss anything before having them designed high fidelity.

Wireframe

High fidelity design

Next step is to explore our wide range of components, that you can use to build very quickly a nice app. We have financial specific assets designed and implemented to allow you to build great financial and responsive content.

Retail app details

Buildlink

Synchro with dev team

It is important to synchronise with the development team and start collecting feedback early so you can iterate on the designs.

Work

Design assets and Angular components implementation

All our assets are designed and usable on XD and Sketch, and also implemented and usable with Angular theme.

Sktech vs angular

At the end of this process you'll get a user friendly application. You can check out the sample retail app design resources and access the source code to build your own.

View live demo