My Role
Product Designer
Company
BBVA
Industry
Finance
Year
2021
Unify processes defined based on the needs of all associated businesses and the design principles devised in workshops, benchmarks, etc.
Reducing Cognitive Load
Structure the process content according to its meaning and convenient order, and divide the process into groups of questions.
Accompanying the User
It serves as a guide and accompaniment to the user when trying to perform a task or achieve a complex goal.
Reducing Execution Time
Reduce the time users have to spend on complex and tedious processes for several hours a day.
We unify processes with a lot of content and complexity. Additionally, we need the user to be able to resume the process at any time.
Create structure.
We group the content into steps and the steps into blocks.
Gathering content.
We gather all the questions from the form with the necessary fields to answer them.
Grouping and ordering.
We group the questions (fields) by meaning and order the content logically.
Reducing cognitive load.
We minimize the number of questions/fields as much as possible and display the simplest ones first.
Index.
When the process is complex, we will add an index.
Reduce the points of escape.
We focus the user's attention on the content while keeping the "exit the process" option always accessible.
Navigate back to the homepage.
Processes can be contained within a modal. In one scenario, it opens on the same URL; in another, known as a 'fake modal', it opens on a different URL. When closed, users can return to the access page or another location.
Vertical navigation.
Facilitates agile and natural vertical reading of the form. Transitions between steps involve vertical movements.
Primary actions.
Buttons performing primary actions should always be as close as possible to the last field of the form.
The Back/Previous action is a secondary action, contrary to the main objective of completing the form. To avoid errors, secondary actions should have a different visual appearance and be positioned outside the flow.
Main content.
Fields are arranged in a single column to streamline user interaction when completing the form.
Help.
We display all necessary information to accompany and assist the user throughout the process. We identify potential pain points and try to anticipate comprehension issues, especially in decision-making.
In the B2B hiring process, we need to cover complex use cases that require a series of linked actions.
Design Components
Design news components that covers all needs since the BBVA design system does not contemplate these possibilities.
Cover B2B Use Cases
To cover these use cases, it is necessary to design a new component that addresses these needs.
Approval Process
Components undergo a rigorous review process by the Federation and need to be approved before they can be used.
Navigation.
Actions are executed consecutively, and it is not possible to complete the next step without completing the previous one.
Main content.
The most common use is in the identity verification process, signing of intervenors, or document upload.
Before starting the process, the user is informed of the steps to be followed, as it is a process in which they cannot go back.
Help.
We can indicate the type of document the user needs to have on hand, as well as inform them that we will take a photograph so the user can be prepared before starting the process.
