INDUSTRY:
BANKING
COMPANY:
BPI BANK (BLISS APPLICATIONS)
YEAR:
2023 - 2024
ROLE:
UX/UI DESIGNER
BPI Bank
about.
BPI is one of Portugal's leading financial institutions. It offers a wide range of banking and financial services, including retail, corporate, and investment banking. With a strong presence in Portugal, it's known for its innovative products, customer-centric approach, and commitment to sustainable practices.
At the BPI Bank, I worked as a UX/UI designer within a new structure implemented that consisted of several experiences. These experiences corresponded to a group of different products, in my case, I was inside of an experience called Enjoy the Life, which had loan products, like loans for personal, auto, credit card, etc.
As well as the new structure, the product design team was very recent and had been growing in the last months.
challenge.
The bank had the purpose of expanding the loan products, more specifically for automobiles. The bank clients did not have the possibility to acquire this type of loan through an entirely online process. So, the idea was to give the clients an experience more fluid during the contract with autonomy and potentialising the business growth.
design thinking.
With this in mind, the team made a design thinking workshop, that consisted of sessions in three different days. People from different areas were asked to make a presence at the workshops. The workshops were moderated by the product owner responsible for the project.
On the first day, it was possible to present the business vision, the purpose of the project, some research with benchmarking, proto personas and questions to participants. Besides that, we presented a possible user flow based on another product that already exists, so people could visualize how the process could be and discuss the main points. After the meeting and with the insights generated, I worked on possible user flow and created preliminary wireframes and structures to map out the placement of design elements and content to bring on the next workshop day.
On the second day, it was presented the identified questions from the first meeting, the user flow and wireframes with the points discussed. In this meeting was possible to clarify if the solution make sense and also to refine it with more details. As expected, we had a lot of adjustments for the user flow and screens that I worked on after the second session day.
With the specifications more clear and defined, I could work on the possible final user flow and a low-fidelity prototype that was presented on the last day of design thinking. On the third day, people could discuss the final points and adjustments, approve the project and define the next steps.
visual design.
After the design thinking workshops, we could understand better the requirements of the stakeholders, the design objectives, the target audience and other specific requirements.
In this way, I started to work on creating high-fidelity prototypes applying visual elements such as color schemes, typography, and imagery to create an aesthetically pleasing interface while maintaining consistency with the brand and other products.
I needed to create the interface considering the new visual design implemented recently, keeping in mind the principles, guidelines, components, patterns, and others.
For this project, it was considered three different channels where the new product will be available for the clients which consists of the mobile and web app, and another one application web that is used by the commercial team. I created the screens contemplating that the application is developed using React and responsive.
handoff process.
Additionally, during the creation of project, I felt a lack of an efficient handoff process. We did not have defined processes and templates for that, each designer made your documentation and I realised that was completely different from each other. In this way, with the other designer who works on the design ops team, we created a new process and template for documenting projects.
To maintain efficiency we created a new structure for the Figma files, where all existing flows regarding the topic are located in one place. It functions as a single source, which everyone must consume. To ensure that it is always organized and up to date. Also, we implemented a template with some specification components that help the different stakeholders identify the necessary information within the project.
quality assurance.
Another process that did not exist was the design quality assurance. After the development, any designer was requested to analyse the implementation. So, with the design ops team, I helped develop a new process and template to ensure the quality of implementation.
The objective was to compare the design with the implementation, identifying the changes that are necessary. By using a template, the aim was to standardize processes and provide a tool that makes them more effective and fluid.
outcomes.
Automobile loan
The project was expected to have a large contribution to the loan growth results. The trends show that this kind of product has been growing in the last years and with this, it will be possible for the clients to have a self-service process with more autonomy. In the same way, the bank will scale its service and results as well.
Handoff process
Overall, the implementation of the design handoff process contributed to a more efficient and harmonious workflow for the team, reducing errors, saving time, and ensuring that the final product aligns closely with the design intent.
Design quality assurance
In summary, a design QA process significantly helped to a better, more consistent, and refined design output. It minimizes errors, enhances the user experience, aligns the design with business goals, and ensures more efficient workflow throughout the project.
