Project Overview

The project entailed redesigning Tropezón's website, a restaurant and food truck business specializing in authentic Mexican cuisine. The goal was to improve the user experience and showcase Tropezón's culinary offerings through a modern and visually captivating online platform.

Challenges Faced

Implementing information architecture improvements was crucial to ensure users could effectively navigate and accomplish their objectives on the website.
Enhancing the user experience involved optimizing usability and interaction design elements to create a more intuitive and engaging browsing journey for visitors.
Implementing responsive web design techniques was necessary to ensure the website's layout and content adapt seamlessly to various viewport sizes and device types.
Developing a modern UI/UX interface involved incorporating contemporary design principles and interaction patterns to facilitate effortless navigation through Tropezón's menus, food truck locations, and catering services.
Ensuring all website CTAs (Call-to-Actions) were strategically placed and functioned as expected was pivotal for enhancing website functionality and user experience.

Project Goal

The primary goal was to deliver a polished and inviting online platform that reflects Tropezón's brand identity and culinary uniqueness. The redesigned website aimed to provide users with a seamless and immersive experience, allowing them to explore Tropezón's world of flavor and discover the essence of Mexican cuisine with ease.

UX/UI Product Design | Research

Tropezón

TIMELINE: 3 Weeks

This project is a fictitious scenario, as part of my Graphic Communication degree in at Saskatchewan Polytechnic.

Discovery

I employed a comprehensive approach, utilizing techniques such as user personas, user journey mapping, interviews, site maps and card sorting exercises. These methods allowed me to gain insights into the shortcomings of the current website and identify specific pain points experienced by users. By analyzing this data, I was able to develop effective solutions to address these issues and improve the overall user experience.

User Journey

User Persona 02

User Persona 01

Current Website

Insights gained through the user personas, journey map and interviews:

Users encountered difficulty in locating the restaurant due to ineffective navigation elements.
Visibility issues were noted regarding menu readability, particularly for catering and food truck options.
Broken links within the website disrupted the user experience.
Ineffective call-to-action buttons failed to direct users to the intended destinations, causing confusion.
The presence of a shopping cart and "order now" call-to-action buttons without actual ordering functionality added to user confusion and frustration.

Site map A

Site map B

During the card sorting and site mapping process, I developed two distinct site maps for the website. Option A presents a streamlined and compact page layout, facilitating easy access for users to find what they need, with all menus consolidated on a single page. Alternatively, the option B site map separates the location menu, food truck offerings, and catering services into distinct sections for improved organization and clarity.

Wireframe

During this phase of the project, I created sketches for various pages of the website and the first wireframe of it. Iteration was key to refining the layout and organization to ensure optimal user experience. I referenced the site map and incorporated insights gained from the initial phase of the project to inform the wireframe designs.

I wireframed both of my site maps to facilitate A/B testing, which is a great idea for evaluating user preferences and determining which content of organization is more effective and user-friendly.

Sketches

Site map A

Site map B

Testing

After creating a rough wireframe in black and white, I developed a higher fidelity wireframe and conducted testing before designing the high-fidelity prototype. I implemented a heuristic evaluation on my website and conducted controlled user testing, where users were given specific tasks like "Find the shrimp tacos" without interference to observe their path to achieving the goal. Through these testing phases, I gained insights into areas for improvement in the redesigned website. Thanks to having two different site organizations, I conducted A/B Testing, which revealed that users found the menu separate from the food truck & Catering easier to navigate.

Desktop

Mobile

Prototype

After conducting thorough testing and addressing the insights gained, I refined the website by adjusting sizes and fixing bugs to create the final platform. The Tropezón redesign project resulted in a significant improvement in user experience and brand representation. Comparing the final prototype to the initial version, the website is now user-friendly, effectively represents the brand values, and is easily accessible. This successful redesign positively impacted Tropezón's online presence and contributed to enhancing customer engagement and satisfaction.