Kind words
“Qualcomm’s improved Device Finder site makes
it easier to find out which Snapdragon processor is powering your phone.”
~60 visitors
Users
Percent
13% conversion
Data from ~1 month post launch
Takeaways
Over communication is key
I felt that I gained valuable insights into our technical possibilities or limitations. This helped in implementing practical designs.
Design systems are crucial
Through consistent framework of reusable components and guidelines we streamlined the design and development process. We were able to accelerate development cycles, reduce errors, and ensure that the end product meets technical standards effectively.
Improved filter/facet tree: Features an inline product search through
taxonomy organization and design consistencies.
Inline search: Features include unique search options based on keywords and characters and search tips.
Visual and interactive design: Features design system alignment, device population style, hover design, “Show more” CTA loading.
Navigation: Breadcrumb clean-up, URL redirects, Device Finder call-outs.
Summary
The enhanced device finder component
was published on April 14, 2023. The enhancements that launched, included
or resulted in:
Final, redesigned, device finder
The filter tree copy, expand/collapse, product search, and semantics changed based on common device attributes. The visual design aligns with existing filter tree options across QC.com finders.
The inline search option was a net-new addition to the device finder. The visual design aligns with existing search options across QC.com finders.
Applied drop shadow, removed border and background color, and animation.
The visual design aligns with existing finder atoms across QC.com finders.
Design system alignment
The visual design updates were a simple step considering we had existing finders, to reference, on the website. Since the device finder was a component with preset styling, all we needed to do was collaborate with the development team to integrate styling changes.
Check out the finished product here!
How do we get users to the finder
The only way to navigate to the device finder was through our global search or deeply layered into the main navigation. By calling out devices, on this Snapdragon page for example, we were able to convert 13% of Snapdragon landing page visitors
Comparison takeaways
These comparisons helped our team understand what users are seeing across market competitor websites and how we can keep up with present, or forecast future, trends. This includes the below.
GOAL statement
Qualcomm’s Device Finder will allow users to search for their favorite product integrations. Hopefully this change will positively affect our users by allowing search flexibility. We will measure effectiveness by tracking the number of visitors 1 month post launch,
and ongoing measurement afterwards.
Competitor Analysis
Prior to the Qualcomm Device finder transformation, we needed to see where we stood within the market of tech tools similar to this one. Through market comparison we could identify where we were might be leaving our users at a roadblock.
(1) Former device finder
(2) Current, and former, SW & Services finder
(3) Current, and former, Product finder
Visual analysis
There are currently 402 Device, 490 Product, and 458 Services & Software pages that are hosted on the Qualcomm website. All three of these categories are organized into 3 library types (with exception to sub-types).
The visual design of the device finder lacked, in alignment and functionality, in comparison to the product and partner finders on the website. This design system alignment was considered, when gathering research results.
User personas who would ideally fit the user type.
Persona exploration
We decided to build stories that revolved around the ideal user who would be using the device finder as a tool. The personas then helped us gather key user characteristics and needs. Through prioritizing these attributes we were able to define design goals based on their needs.
Getting Started
Initial user flow
The Summary
Qualcomm called the world wide web, home, in May of 1997. Many people did not know who they were or what they had to offer to the tech world. As a semiconductor for smartphones at the time, they needed a way to showcase their products. From mobile processors to chipsets, Qualcomm was making products to power devices. The only question was, what kinds?
Fast forward a few years… the device finder was born. A place for users to search for devices that met their needs and specification desires. Since Qualcomm’s launch to www, many additional products have been created to support an array of devices.
Qualcomm Device Finder Enhancements
UX Design, Design System Alignment January - April 2023
The Qualcomm device finder went live in April of 2023. Here is where devices, from Meta headsets to Samsung phones, were stored for users to browse their favorite Qualcomm product integrations. The main reason for the redesign was to enhance the discoverability of devices and to amplify search autonomy.
These select pieces of information are my own and do not reflect Qualcomm or its subsidiaries.*
Back
The issues we found included:
The device finder component exists on the site “by type”. For example, if a
user wants to purchase the newest device that uses Qualcomm’s latest Mobile Processor, they would navigate to the smartphone finder etc. However, we learned that users were unable to search for certain devices as previously expected.
In addition to the tool discoverability level, the finder’s visual experience was flawed. On the front end, the device finder’s visual design was not aligning with Qualcomm’s design system. Lastly, the taxonomy was organized poorly, via content management system tagging, and resulted in a poor filtering experience to the user.
Qualcomm Device Finder Enhancements
UX Design, Design System Alignment | January - April 2023
The Qualcomm device finder went live in April of 2023. Here is where devices, from Meta headsets to Samsung phones, were stored for users to browse their favorite Qualcomm product integrations. The main reason for the redesign was to enhance the discoverability of devices and to amplify search autonomy.
These select pieces of information are my own and do not reflect Qualcomm or its subsidiaries.*
Competitor Analysis
Prior to the Qualcomm Device finder transformation, we needed to see where we stood within the market of tech tools similar to this one. Through market comparison we could identify where we were might be leaving our users at a roadblock.
The Summary
Qualcomm called the world wide web, home, in May of 1997. Many people did not know who they were or what they had to offer to the tech world. As a semiconductor for smartphones at the time, they needed a way to showcase their products. From mobile processors to chipsets, Qualcomm was making products to power devices. The only question was, what kinds?
Fast forward a few years… the device finder was born. A place for users to search for devices that met their needs and specification desires. Since Qualcomm’s launch to www, many additional products have been created to support an array of devices.
Persona exploration
We decided to build stories that revolved around the ideal user who would be using the device finder as a tool. The personas then helped us gather key user characteristics and needs. Through prioritizing these attributes we were able to define design goals based on their needs.
(1) Former device finder
(2) Current, and former, SW & Services finder
(3) Current, and former, Product finder
Comparison takeaways
These comparisons helped our team understand what users are seeing across market competitor websites and how we can keep up with present, or forecast future, trends. This includes the below.
GOAL statement
Qualcomm’s Device Finder will allow users to search for their favorite product integrations. Hopefully this change will positively affect our users by allowing search flexibility. We will measure effectiveness by tracking the number of visitors
1 month post launch, and ongoing measurement afterwards.
Final, redesigned, device finder
Improved filter/facet tree: Features an inline product search through
taxonomy organization and design consistencies.
Inline search: Features include unique search options based on keywords and characters and search tips.
Visual and interactive design: Features design system alignment, device population style, hover design, “Show more” CTA loading.
Navigation: Breadcrumb clean-up, URL redirects, Device Finder call-outs.
Initial user flow
Summary
The enhanced device finder component was published on April 14, 2023. The enhancements that launched, included or resulted in:
Takeaways
Over communication is key
I felt that I gained valuable insights into our technical possibilities or limitations. This helped in implementing practical designs.
Design systems are crucial
Through consistent framework of reusable components and guidelines we streamlined the design and development process. We were able to accelerate development cycles, reduce errors, and ensure that the end product meets technical standards effectively.
Kind words
“Qualcomm’s improved Device Finder site makes
it easier to find out which Snapdragon processor is powering your phone.”
-Peter Holden, Author at Talk Android. See here.
~60 visitors
Users
Percent
13% conversion
Data from ~1 month post launch
Check out the finished product here!
How do we get users to the finder
The only way to navigate to the device finder was
through our global search or deeply layered into the main navigation. By calling out devices, on this Snapdragon page for example, we were able to convert 13% of Snapdragon landing page visitors
Visual analysis
There are currently 402 Device, 490 Product, and 458 Services & Software pages that are hosted on the Qualcomm website. All three of these categories are organized into 3 library types (with exception to sub-types).
The visual design of the device finder lacked, in alignment and functionality, in comparison to the product and partner finders on the website. This design system alignment was considered, when gathering research results.
The inline search option was a net-new addition to the device finder. The visual design aligns with existing search options across QC.com finders.
The filter tree copy, expand/collapse, product search, and semantics changed based on common device attributes. The visual design aligns with existing filter tree options across QC.com finders.
Applied drop shadow, removed border and background color, and animation.
The visual design aligns with existing finder atoms across QC.com finders.
Design system alignment
The visual design updates were a simple step considering we had existing finders, to reference, on the website. Since the device finder was a component with preset styling, all we needed to do was collaborate with the development team to integrate styling changes.
Getting Started
The issues we found included:
The device finder component exists on the site “by type”. For example, if a
user wants to purchase the newest device that uses Qualcomm’s latest Mobile Processor, they would navigate to the smartphone finder etc. However, we learned that users were unable to search for certain devices as previously expected.
In addition to the tool discoverability level, the finder’s visual experience was flawed. On the front end, the device finder’s visual design was not aligning with Qualcomm’s design system. Lastly, the taxonomy was organized poorly, via content management system tagging, and resulted in a poor filtering experience to the user.
I’d love to help build your next project. Ready when you are, say hi.