Overview
Deliverables
Redesign Safety module for VLP
My Role
UX / UI / Prototyping
Team
Visual Designer, UX Researcher, HAEA (Dev Team), Producer, Account
Client
Hyundai Motor America
Project Brief
Our client has noticed that the VLP SmartSense (safety) component is becoming overloaded due to the variations of the same safety feature on both lower and higher trims. This project aims to update the SmartSense module to provide users with a clear view of safety features included in both lower and higher trims. Users should not have to click on the disclaimer to know which feature is available for which trim. Additionally, the update should allow components to contain copy, animation, image, and disclaimer.
Problem
The module appears too tall to fit in a single viewport on desktop and mobile devices.
User shouldn’t have to click the info icon to find out which trim has the feature
Too many clicks/tabs are required to see all features
"This feature description is often very long and isn’t thoroughly read by most of the users
Research and test
Our team has conducted user testing and research to gain a better understanding of how users interact with this particular component. Through our research, we were able to identify common frustrations experienced by users and gain valuable insights into the importance of safety features for those who are in the market for a car. This information has been crucial in informing our development process and ensuring that we create a product that meets the needs and expectations of our users.
When asking testers what vehicle elements impacted their purchase decision, testers indicated that safety was in the top 3 with 9 out of 10 rating it important or very important.
It takes too many scrolls to access the safety module on VLP (12 scrolls on desktop, 27 thumb swipes on mobile) (Testers who attempted to scroll through the page either stopped after a few scrolls thinking that the content they were looking for was not on this page or they reached the SmartSense content but skipped over the section)
Testers found the Safety module unresponsive and difficult to navigate. (Some safety modules had 16 safety features which means they had 16 tabs for users to click around)
Wireframe
We categorized safety features into three subjects: Convenience, Parking, and Safety. This change was implemented to minimize the number of clicks or tabs required for users to browse all features within the module. When we were working on this project, the UX and development teams were juggling numerous large-scale projects. Thus, the client requested that we solve these problems with minimal change.
Categorized safety features into three subjects in order to minimize the number of clicks or tabs required for users to browse all features
User can easily find out which trim has the feature without clicking anything
The module fits in a single viewport on desktop and mobile devices
Since no testers read the feature description during user tests, we hid the feature description under the ‘Learn More’ CTA to shorten the module height but still allow users to access the feature description if they want more information
Future Considerations
Although it was not originally part of the project, we suggested the safety module be relocated to the top part of the VLP during the client presentation. Our research indicated that safety is the second most crucial factor for car buyers. Hence, we believed it was crucial to highlight the importance of safety, even if the client chose to reject the suggestion.