Garmin Technology
Design Background
According to different watch technology types of Garmin watches, we have found that customers do not know the tiny difference between the function. Thus, we created the pages for the watch function and information. To let the user know more about the details and let they can find suitable watches.
Role and Collaborations
My role in this project was designing, coding, updating, and maintaining the website. I coordinated with the marketing specialists, product manager, which contents are suitable for the landing page.
Team
UI / Web Designer - Windy Wu
PM
Planner
Graphic Designer
Platform
Web
Tools
Figma, Photoshop, Illustrator, Html, CSS, Jquery
Design Goal
Brand promotion
Create a landing page let users understand the watch technology of Garmin.
Catch user needs
Use animation to let users more easily understand the watch technology.
Clear information target
Focus on the technology information.
Outcome and Impact
From GA data, we have found that pulse ox has a good pageview. And the stay time of the user is long than average.
This page have a good redirect page view when the new product watch launches.
This page is used in all APAC region. And have the good feedback of south ASIA.
User Research
Pain points - Can't easily understand the difficult watch technology
Requirements - Need a page to use images or animation to know more about the technology and choose the suitable watches
![](images/persona.png)
![](images/garmintechnology_02.jpg)
Grid system
Use grid is the foundation for positioning elements onscreen. Define different sizes to help to align elements onscreen to a specific position and allows to define a specific width for each elements using the grid columns to ensure consistency in the element width.
![](images/garmintechnology_02-1.gif)
Design
I used black and blue to design the technology land page.The landing page sings a responsive design that supports different form factors and devices. I designed the layout and structure and built an SCSS framework that displays the web page.
![](images/garmintechnology_03.gif)
![](images/garmintechnology_04.jpg)
![](images/garmintechnology_05.gif)
![](images/garmintechnology_06.jpg)
![](images/garmintechnology_07.jpg)
![](images/garmintechnology_08.gif)
Results
I created the page with some animation to attract users and worked closely with video designers to make the page more attractive. I observed the Google Analytics that users are more interested in the pulse ox.
![](images/garmintechnology_09.jpg)