Heartridge Product Launch
UI/UX, Campaign
Role & Team
Senior Creative Designer. Work with 3 Mid-Weight Designers, Account Director, and Developers.
Project Description
Heartridge has a strong visual identity inspired by nature and the forest. The brand offers a range of flooring products including Engineer timber, Luxury vinyl plank, Vinyl plank, and Flooring accessories. Heartridge is now seeking to expand its product line with new offerings.
Objective
-
The main objective of this project is to effectively communicate the unique selling points of the hybrid plank to customers. This includes highlighting its complex technical features and explaining how they make the product stand out from its competitors.
-
To create a template for the product & catalogue pages that is editable and can be used for both future & existing products.
-
Ensure the website is easy to navigate and information is easily found on various devices.
Scope
The scope of the this project includes creation of a product page and a catalogue page, and development of a user-friendly and aesthetically pleasing user interface and user experience design. The pages will be designed with accessibility and ease of use in mind, allowing customers to easily navigate and find the information they need, regardless of the device they are using.
This project aims to effectively convey the value of the hybrid plank to customers, positioning it as a premium and innovative product in the market, while also providing a scalable and efficient solution for future product launches and catalogue management.
Technology Used
Miro, Sketch, Illustrator, Photoshop, InDesign, After Effect, Campaign Monito
_____
Start with...
Wireframe
define
Content
and find
Problem & Statement
UI/UX Design
Interactive design by Tab
Showcase our product features in a clear and concise manner, avoiding text-heavy content. To achieve this, we design icons for each feature, symbolizing its purpose. Users will be able to roughly understand the features just by looking at the icons and, if they are interested, they can click on the tab to access full information.
Interactive design by Pop up
To help user understand the technology, we create a diagram that showcases its components. The diagram have hotspots that highlight specific layer. When hovering over the hotspots, speech bubbles will appear to provide full information.
Increase Engagement
The section displays options with photos to aid users in imagining the product in their home. The visual appeal of the photos, combined with the Request Sample button, creates user’s curiosity that leads users to request a sample.
Combination of the display photos and Request Sample button creates a user-friendly experience, encouraging users to engage with the product.
Interactive design by slider
Utilize a slider function to showcase the installation process and final appearance of the product.
Icon & Diagram design
High Fi Design & Build
Category page, Product page
Usability Test
A usability test was conducted with 4 users from different age groups and backgrounds. Each user was provided with a different device and tasked with completing the following tasks:
-
Finding a specific product and color
-
Ordering a sample
-
Comparing two products in terms of product features, installation method, warranty, and other relevant information.
In addition, the time spent on each page was tracked and the users were asked to provide their opinions on the most important features, as well as the sections that were most eye-catching.
The results of the usability test were used to further refine the website design and improve the overall user experience.
Outcome
The New product launch was a huge success, launching in a short time period through digital and point of sale channels. The sales team was able to effectively communicate the product’s unique features to consumers, resulting in a boost in sales and a wider reach on social media. The new pages received an overwhelming response, with high engagement rates from individual consumers. This success has set the stage for future improvements, including applying the successful template to the rest of the products and renovating the existing website.
Delivery
UI/UX
Category page
Product page
Flooring accessories page
Feature - Sustainable page
Resource page
Digital
EDM
Social post
Display stand
Product brochure
Promo flyer
Print AD
Strap Set
Photography
Styling
Image retouching
Colour correction
Illustration
Technical diagram
Feature icon
