BrFideliza is a platform that offers solutions to facilitate the management of Pix payments for companies, including features such as sending payment receipts via WhatsApp, due date notifications, financial reports, and marketing and customer loyalty tools. In addition, it allows you to set up personalized charges, whether for in-person or remote sales, using QR Codes and other features to simplify financial transactions and communication with customers.
Comprovantes na palma da sua mão em até 10 segundos.
02.
Person
A persona in user-centered design is a fictional character created to represent a type of user who might use a website, brand, or product in a similar way.
Carlos Andrade
“I can’t keep track of payments via Pix and this hinders my company’s financial control.”
38 years
São Paulo - SP
Complete Higher Education
Married
Andrade Ferragens
About:
Carlos Andrade is the owner of Andrade Ferragens, a store that serves residents and small contractors in São Paulo, offering everything from hand tools to basic construction materials. He started the business 10 years ago with the goal of becoming a reference in quality and service in the neighborhood, taking advantage of his experience in the retail sector.
In the early years, the store’s business grew through referrals and personalized service. However, with the popularization of marketplaces and the entry of competitors offering aggressive prices, Carlos realized the need to differentiate himself.
Recently, he invested in more modern payment methods, such as Pix, to attract customers who prefer convenience and speed. Despite this, managing these payments has been a challenge, since he still uses manual processes to organize receipts and track defaults.
Carlos also feels the pressure to improve the customer experience. He wants to automate billing and integrate a system that allows sending notifications about due dates and promotions, in addition to building customer loyalty with benefit programs. All of this, he says, would help maintain his loyal base and improve cash flow.
With a lean team, he needs tools that optimize time and reduce the need for manual interventions, allowing him to focus on expanding the business and improving service.
Ana Lemos
“I waste a lot of time organizing payments and billing customers manually.”
38 years
Recife - PE
High School
Single
Ana Bolos e Doces
About:
Ana Lemos is a young entrepreneur who turned her passion for baking into a thriving business. Three years ago, she started making homemade cakes and delicious pastries in her own kitchen, initially serving friends and family. Over time, her ability to create delicious, personalized pastries helped her build a solid reputation, gaining new customers through referrals and social media.
Her business, Ana Bolos e Doces, grew quickly, and today she caters to birthdays, weddings, and corporate events, in addition to maintaining a loyal clientele for individual sales. Despite her success, Ana faces challenges related to managing payments and communicating with customers. As she works alone or with a very small team, she has to balance production, service, and financial management of the business.
The implementation of Pix was a significant step forward in facilitating payments, but there are still bottlenecks: Ana spends a lot of time manually sending payment reminders, organizing receipts, and charging customers in case of delays. In addition, she seeks to build customer loyalty by offering promotions and benefits, but she does not have the right tools to implement an effective rewards program.
Ana sees technology as an ally to further professionalize her business. With systems that automate billing and improve communication, she hopes to reduce the time spent on administrative tasks and focus on what she loves: creating sweets that make special moments even more unforgettable.
04.
Typography
05.
Colors
Colors are a fundamental element of UX/UI design as they play an important role in how users perceive and interact with a digital product. The choice of colors was based on a WCAG 2.1 contrast system.
Base
These are base black and white color styles to quickly swap out if you need to.
AAA 21:1
White
#FFFFFF
AAA 20.19:1
Black
#050610
Gray
Gray is a neutral color and is the foundation of the color system. Almost everything in UI design, text, form fields, backgrounds, dividers are usually gray.
AAA 10.2:1
25
#F4F5F6
AAA 10.01:1
50
#F9FAFB
AAA 9.49:1
100
#F2F4F7
AAA 8.84:1
200
#EAECF0
AAA 7.09:1
300
#D0D5DD
AA 4.06:1
400
#98A2B3
AAA 4.97:1
500
#667085
AAA 7.68:1
600
#475467
AAA 10.46:1
700
#344054
AAA 14.7:1
800
#1D2939
AAA 17.74:1
900
#101828
Primary
The primary color is your “brand” color, and is used across all interactive elements such as buttons, links, inputs, etc. This color can define the overall feel and can elicit emotion.
AA 4.15:1
50
#F0FBFB
AA 3.79:1
100
#D9F4F3
A 3.33:1
200
#B7EAEA
A 2.7:1
300
#86D9DA
A 2.2:1
400
#4DBFC3
A 2.53:1
500
#36B3BA
AA 4.38:1
600
#2C848E
AAA 6.01:1
700
#296C75
AAA 7.79:1
800
#295961
AAA 9.49:1
900
#264B53
Premium plan
The yellow color is used for the BrFideliza´s premium plan and get highlighted between other plans.
A 2.07:1
50
#FEF0C7
A 2.07:1
500
#F79009
06.
How it was
The previous version of the website had an outdated design and did not reflect the company’s credibility, in addition to having difficulty communicating clearly how its services worked. Therefore, my focus was on improving communication and conveying the credibility that the company needs to strengthen its image in the market.
07.
Presentation
The website has been completely redesigned to present the benefits of each service offered by BrFideliza in a clear and detailed manner, highlighting the advantages for customers. In addition, information has been included on the business segments that can benefit from the solutions, as well as the plans available, adapted to meet the needs of companies of different sizes.
08.
Design process
Enhancing user engagement and satisfaction through innovative design and intuitive functionality.
01
DISCOVERY
Identified key objectives and user needs to create a focused, user-centered landing page experience.
02
RESEARCH
Analyzed user pain points and visual inspirations to shape a clean, minimal design that conveys trust.
03
IDEATION
Explored layouts and user flow with wireframes, refining the design based on feedback for clarity and usability.
04
DESIGN
Created a polished, responsive design in Figma with subtle interactions and a seamless user experience across devices.
05
DEVELOPMENT
Once everything has been approved by the client, development in WordPress begins and the website is published online.
Control
all your
company's
payments
in the
palm of
your hand
with
brfideliza
09.
High fidelity
Now you can view every detail of BrFideliza’s main sales page.