A3 Design - Web Catalog Case Study
Developing a Full-Stack application with EJS, CSS and Node.js to provide a greater user experience.
13 min read
A3 Design is a Home Décor concept store located in Recife, Brazil that sells wallpapers, floor covering, boiserie and curtains. Because the original online sales experience on mobile was limited, there was a need to develop a new solution that could provide a better user experience and improve sales performance.
At the moment, if a customer wants to buy their goods online, they can do so by texting the company on WhatsApp and wait for a reply, which can take up to 2 days. This process is exhaustive for both the customer and for the company. By introducing a new way to have the products available online, the company will have greater chances of closing deals and reducing sales time.
The purpose of this application is to allow users to view a catalog of the available products and securely be directed to WhatsApp, where they can receive an invoice to purchase the chosen items. By completing this project, we can expect it to improve the entire customer experience and boost sales.
''According to survey results, over 72% of the interviewed customers have hired an architect or designer to manage their projects. They might help customers choose a product or choose for them, so providing a greater user experience to this audience will be the biggest goal of this project.''
User Research was performed to find out relevant details about this company's audience and user needs. Wireframes and Prototypes were created to facilitate feedback before the project was implemented. After conducting user research, the findings revealed that customers were experiencing difficulties, such as communicating with the company and viewing their products from WhatsApp photos.
Since the architects are the most important connection between the company and the customers, it was essential to improve their online experience. To gather as much data as possible about them, a survey was created with Google Forms. The survey findings resulted in the persona called Andrea.
Once we defined the flow and which screens were needed, I proceeded with creating the wireframe to explore the experience in detail on a screen-by-screen level. The Home, Products, and Product details pages were created to present the provisional layout.
After the user research and wireframe were complete, I proceeded with designing the final UI for desktop, tablet, and mobile. Following a user-driven design approach, it was important to provide both the wireframe and high-fidelity prototypes. The design created follows project goals and requirements, while UI elements were selected considering user research findings.