In-store iPad Product Design

CLIENT

Vuse New Zealand

RESPONSIBILITIES

UI Design

CLIENT

Vuse New Zealand

My Key RESPONSIBILITIES

UI Design

BACKGROUND

Brief:

To design an in-store iPad screen for "Vuse Go"new product launch
To display all (including existing) products and show product overview, features and disclaimer details on the page
To include a “register” function allowing customers to sign up for latest promotions.
To create an engaging experience introducing the latest vape products for new & return customers.

RESEARCH

To conduct a comprehensive in-store vape product iPad design UX case study, our team carried out a competitive market research analysis. Our goal was to gain insights into how similar products can be showcased on an iPad interface. After evaluating the options, we decided to proceed with a landscape design. We found that this orientation provided ample space for displaying content and products effectively.
In addition to the layout, we considered consistency as a key factor for existing users. Studies have shown that most in-store customers have already visited the company's website. Therefore, it was important to maintain consistency between the online and in-store experience to avoid confusion. However, we also recognized the need to attract new customers. As a result, we prioritized creating a simple and straightforward design that is easy to use for everyone.
To further enhance the user experience, we proposed incorporating 3D images into the design. This feature would provide more engaging content for both new and returning customers, helping to increase interest and sales. Overall, our research and analysis have guided the development of an effective in-store vape product iPad design UX case study that will improve the customer experience and drive business growth.

Challenges

One of the significant challenges encountered during the UX process was the need to display a large number of products while keeping the design as minimalist as possible to maintain a "one-page" layout. This approach was crucial in capturing users' attention when using the iPad. However, it was challenging due to the diverse range of products with varying color palettes and UI designs. It was essential to ensure that the design provided a visual contrast while maintaining accessibility for users.
In addition to the color and UI challenges, the project required a sophisticated experience to meet its goals. However, due to the limitation of the use of colors for the design, it was challenging to ensure that the products provided an adequate visual contrast, which is essential for the user experience.
Furthermore, the project presented another challenge of ensuring consistency with the brand and following the existing interactions on the current website, as required by the client. These limitations meant that our team had to balance the client's requirements with our creative input, which was a significant challenge. Despite these hurdles, we were able to create a design that met the client's needs while also providing a compelling user experience for their customers.

Design Thinking

Step 1: Define the user journey

Priority: One of the critical improvements was the addition of a comparison page, which allows customers to easily identify the differences between different products, particularly in terms of nicotine strengths and flavors.

The comparison page provides a side-by-side comparison of different products, allowing users to view the differences in nicotine strengths and flavors. This feature helps customers make informed decisions about their purchases, reducing the likelihood of confusion or frustration.

Step 2: Develop wireframes and validate the learnings

Another significant outcome of the redesign was the improvement of the overall navigation and layout of the product page.

The minimalist design provided a more straightforward and cleaner interface, making it easier for users to find the products they need quickly. The new design also improved the visual contrast of the products, making them more accessible to users with different visual abilities.

The redesigned iPad product page also helped to reinforce the brand's identity and consistency by incorporating similar design elements to the company's website. This integration provided a more seamless transition from online to in-store shopping experience for customers.

Step 2: Wireframing & Validating

Another significant outcome of the redesign was the improvement of the overall navigation and layout of the product page.

‍

Step 3: Review & Iterate

Throughout the testing process, we received valuable feedback from users that helped to improve the overall design of the in-store vape product iPad page. As a result, we made several changes that enhanced the user experience and accessibility.

One of the significant testing outcomes was the decision to update the color of the CTA button from yellow to blue. The initial yellow button did not provide sufficient contrast to the different variety of product images, making it difficult for some users to identify the CTA. After conducting multiple rounds of testing, we found that the blue button provided better contrast, improving the overall accessibility and user experience.
Another important testing outcome was the update of the flavor selection tool. Initially, the tool was presented as a dropdown menu, which was challenging for some users to access. Based on feedback from users, we updated the flavor selection tool to swatches on the page, making it easier for users to identify and select their desired flavor. This change was also consistent with the user interaction on the company's website, creating a more seamless transition between the online and in-store shopping experiences.

Overall, the testing outcomes played a crucial role in refining the in-store vape product iPad page design, ensuring it met the needs of users and delivered a compelling user experience. The updates made as a result of testing helped to increase accessibility, usability, and user satisfaction, ultimately driving sales and enhancing the company's brand reputation.

TAKEAWAYS

During this project, several key UX principles were applied to ensure a successful outcome. Firstly, a "one-page" navigation approach was adopted, featuring clear and accessible buttons, which simplified the user journey and improved the overall user experience. The design team also focused on ensuring usability and accessibility by considering the feel of the interface, making it intuitive and easy for users to navigate. In addition to these principles, we also paid close attention to the use of space on the device and how users would think when coming onto the page, whether they were first-time users or returning customers of the products. By adopting this approach, the team was able to create a design that effectively showcased the products and provided an engaging and straightforward experience for users.

‍

The solution differed from traditional responsive design, as the project had a different purpose and goal than the existing webpage on desktop and mobile. The project's primary focus was to introduce products to users and convert them into potential customers, requiring the team to develop a tailored design that was optimized for this specific objective.Throughout the entire user journey, the focus remained on showcasing the products and providing a simple and engaging experience to the users. This approach helped to achieve the project's goal of introducing users to the products, ultimately driving sales and increasing customer satisfaction.

‍

Overall, this case study highlights the importance of applying UX principles when developing a tailored UI design that effectively meets a specific goal.