Overview

Smartbiometrik is an app that allows users to authenticate themselves securely through facial biometrics, legal electronic signature, verification and identification of users through the ID card.
New account - old app - Smartbiometrik
Add your ID - old app - Smartbiometrik

Why to redesign the old app?

  • Outdated interface.
  • No brand guidelines.
  • Displays lack consistency.
Women using an iPad

Project Goals

1. Create a reliable and pleasing style for a biometrics app

It aims to create an eye-catching and reliable design where users are protected, as well as facilitating a fast loading and smooth user experience.

2. Effective design

Creating a simple but effective user interface solution

3. Create an informative website for users

In turn, create a website where you can give information to users about the advantages of using SmartBiometrik.

4. A brand with its own intelligence.

The first thing we will need to do is to create a brand and a roadmap for future updates so that there is consistency and strong criteria.

Design Personas

Persona study about this project
Lola García
Married, a child
Flight Attendant, 36 y.o
Sevilla, Spain
Story
Lola has worked as a flight attendant for Iberia airlines for more than 10 years. She has to change planes frequently, go through the controls quite quickly and access areas exclusive to airport staff, and sometimes they are international flights so the control is more exhaustive.
Needs and Goals
  • I need a programme to facilitate authentication at work.
  • A quick app to show my ID card.
Pain Points
  • The company's app is slow, we need a new one.
  • It's tedious to always have to carry my passport or ID card in my hand, I'm afraid of losing it.
  • Sometimes the recognition of the problem area fails, it would be good to have another way to access it.
Persona study about this project
Maria Perez
Single, 2 dogs
Data Protection Officer, 45 y.o
Barcelona, Spain
Story
Jan has been working as a Data Protection Officer for 5 years in an important company in Barcelona, for security reasons he is not allowed to tell us his name.
In his company the security issue is very important because they work with exclusive customer data and to access it is necessary to be previously identified so that they always have control of who enters or leaves each room.
Needs and Goals
  • A way to be able to access different areas quickly without having to take out documentation.
  • A programme that can be used within the company and is certified.
Pain Points
  • We don't have a reliable system, we use company ID cards but they break down easily.
  • Our company ID cards are often forgotten at home, so we need an app. Our mobile phone is always with us.

How we start

Using the Agile framework, we define the necessary phases of the design process to understand the product, starting with the creation of the brand. And finally, solutions that help the user understand what SmartBiometrik is, how it benefits them and how to get the most out of it.
Step 0. Branding
#Storytelling . #Manifest . #Naming . #Logo
Step 1. Discover and Define
#Briefing . #Roadmap . #UxPlan . #Personas . #Surveys
Step 2. Idea
#Prioritization . #UserFlow . #SiteMap
Step 3. Prototype
#Wireframe . #PrototypeTesting . #Interaction

Branding

After studying the market and looking for possible competitors and analysing their brands, we managed after several sketches and attempts to find the perfect image for SmartBiometrik.
Color
3 color - Smartbiometric
Icon
Icon - Smartbiometrik
Logo
Logo - Smartbiometrik
Biometric on a mobile. smartbiometric logo

User Flow

User flow takes you from the point of entry through a set of steps to a successful outcome and final action.
UserFlow of the app - Smartbiometrik

Sketches & Wireframe

More than 18 screens were created using sketches and, subsequently, wireframes to represent the website and e-learning platform templates, the flow between screens and their functionalities.
How looks the app without content - Smartbiometrik

Visual Design

Website screens - Smartbiometrik
App screen - ID - Smartbiometrik
Card screen - App  - Smartbiometrik
App screens - Smartbiometrik

Final Thoughts

My first app was as a junior UX/UI designer. At that time, I came from working as a web designer in WordPress, and this app became my first project as a UX/UI designer so I was excited and for me, it was a great job. If I evaluate that same work, but with the current perspective and level, I can say that there are several stages that need more work, and the UX and UI should be polished again. Maybe a personal project that I can take up again in the future.