UX Design System

The Project:

This is a personal project with the aim of creating a set of high-fidelity UX design templates for use in a wide variety of applications.

Numerous startups and companies with very large budgets have spent a lot of time and money on UX development and design to create simple and elegant solutions to almost every problem.  

I believe a good starting point when creating a design for a new application is to research exisiting solutions. Whether these designs are from similar applications, competitors or from a totally different industry. As UX designers we can draw on these analogies to help us solve our own challenges.

Throughout this project I have studied the worlds most popular applications and have created my own library of templates based on their UX designs as inspiration.

The goal is to speed up my design process while sharpening my knowledge of existing user design patterns and solutions.

As UX designers, we need to be aware of how users expect an application to work. We are not here to dictate how a user should interact with our applications. Rather we need to empathise with the user and design intuitive, elegant and desirable solutions which are a joy to use. 

These are a few of the applications I have studied as part of my process to create this UX design system. 

UX Screen Templates

The below app screen templates are a result of my research into several popular applications and their user interfaces, user flows, layouts and design patterns.

This is a library I have created in Figma and is available to download for your own personal or commercial use.

These templates can be used as a starting point for any UX project as they cover many use cases and are based on hours of research, analysis and design.

Splash Screen 1

Splash Screen 2

Onboarding Screen 1

Onboarding Screen 2

Onboarding Screen  3

Create Account Screen 1

Login Screen 1

Create Account Screen 2

Login Screen 2

Search Listings Screen 1

Search Listings Screen 2

Search Listings Screen 3

Search Listings Screen 4

Search Listings Screen 5

Search Listings Screen 6

Categories Screen 1

Categories Screen 2

Categories Screen 3

Search Filters Screen 1

Search Filters Screen 2

Search Filters Screen 3

Search Filters Screen 4

Search Input Active Screen

Selected Item Screen 1

Selected Item Screen 2

Selected Item Screen 3