Context
For this freelance job, I had to develop a website for a trademark small company in Brazil.
Their wish was to work exclusively online and sell the services through this webpage aiming small young entrepreneurs which are a great number in Brazil.
They already had done some market research and had worked with trademarks for quite a long time. I also had been through a process to register a brand when I was an entrepreneur, so I knew how to help them showcase their services in a simpler way and with a plain language (not full of juristic terms that no one besides a lawyer would understand).
Requirements
- The budget is low, they just started the business, so something simple and effective was necessary;
- No images or names to be attached, so the website wouldn’t have illustrations, videos or photos (what a challenge);
- They will use a payment method that doesn’t need extensive coding, such as Mercado Pago, to save money in development;
- Focus on the journey: Should be simple steps, avoid bureaucracy and allow payment in installments;
Process
- Benchmark research
- Analyze user’s journey’s on competitors websites and heuristics
- Analyze user’s journey on a trial service
- Structure the information architecture
- Wireframes on paper
- Style guide development
- Prototype
- Follow up on development with the Front End developer
- Hosting and connecting analyze tools such as Google, Hotjar and Facebook for advertising.
- Website online – https://ideafy.com.br
- Metrics analysis
Trial service – journey’s test
One of the partners did a trial to sell one of the services packages to a client and took notes to develop the steps, using whatsapp and google forms to be in touch with him. We analyzed the journey and implemented some ideas to test later in the interface.
Persona
Edson, 35 years old, small entrepreneur that has a barber shop in Curitiba.
Just started my business and I need to invest a lot, so I don’t have much money to spend with brand registry, but I also want to protect my investment before someone copies me.
Profile: Decided to quit his job in a big company to start his own small business. As he cares a lot about how he looks, he took a hairdresser course and now has his own barber shop.
Goals: To make his business grow and to be known. Does not have much time to spend with paperwork, so he likes to be practical. The trademark should be something easy to register, cheap and divided into installments.
Information architecture
It came right after this first trial, were I decided the pages within the website and how would the customer navigate until the chosen service is purchased.
Styleguide
I started then developing some elements, such as colors, fonts and some icons, the rest I developed when building the pages and seeing what was best according to each screen size. Now it looks like this:
Design principles
- Develop a consistent style guide to provide a pattern to bring harmony and unity of the page
- Focus on CTA’s
Heuristics
- Keep only necessary information
- Visibility of the system status during the purchase process
- Consistency through patterns, colors and icons
- Plain language use, to avoid juristic terms
- Consistency and standards when purchasing a service
- Error prevention on the style guide variations
- Minimalistic design
User test
After the first version of the Figma file was ready, I tested the journey and it was 90% successful. Just a few details were adjusted and the final result is below.
