Qualcomm Developer Hub Redesign
With the introduction of a new brand led by Qualcomm’s marketing team came the need to translate this brand effectively across their digital touch points on Qualcomm.com.
As UX lead, this meant developing a design strategy for new pages, redesigning existing pages, and creating a framework for new digital guidelines. We applied our strategy across a variety of Qualcomm.com experiences, but for brevity this case study focuses on Qualcomm's "Developer Hub."
Company
Qualcomm
Timeline
June 2024 - December 2024
Role
UX Lead
Team
Caryn Arredondo, Tyler Molhook, Jorge Hernandez, Mao Otsuki, Lilly Murphy
Skills
Product Design, Visual Design, Interactive Prototyping, Stakeholder Management, Content Strategy
Discovery
For this project we leaned heavily on key stakeholders and content owners at Qualcomm to help us understand the business needs:
Key pages, specifically pages for their new Snapdragon Gaming Toolkit, needed to be live in time for Qualcomm's Snapdragon Summit to generate excitement, increase relevancy, and drive traffic.
Qualcomm.com houses multiple "topics" and sub-brands. There was a need for templates and shared patterns that could support a variety of content needs.
The new brand had been evaluated for marketing communications and physical touch points, but how it would translate to the Developer Hub in a modern and accessible way was still unclear.
Current State Audit
When auditing existing Developer Hub pages, we found there to be poor hierarchy and a lack of a strong visual design direction. Developers were met with walls of text and links to a variety of different tools without any framing of what could best support their use case.
Content Strategy
We took inventory of the different types of content we would need to show on these pages, and aligned on 2 approaches to consider for the new experience:
-
Marketing-driven: Focusing on key value propositions for a specific subset of tools and technology. This would help funnel users into detailed spec pages, but may require more steps to get there.
-
Directory-driven: Surfacing a variety of entry points for different tools and technology on one page, leaving it up to the developer to know what they’re looking for without needing much guidance.
Wireframes
Starting with the Snapdragon Gaming Toolkit page, we went through a series of rounds of evaluating wireframes to align on which approach would be best for developers. We ultimately went with a hybrid approach, that led with key value propositions to excite and inspire without completely burying quick access to popular tools and software.
Visual Design Application
01
Leverages the darker colors in the new brand palette to match the dark and edgy aesthetic common in other developer tools.
02
Introduces bold iconography and imagery to help with engagement and navigation.
03
Clearly surfaces tutorials and informational pages to support developers early in their discovery process.
Developing the Design Guidelines
As we got alignment on our application of the brand, two more designers were brought on to help create a new set of digital guidelines based on the patterns we were establishing.
Final Templates
We ended up creating 4 page templates that could scale across other the topics in the Developer Hub experience.
Developer Hub Landing Page
An overview page that gets developers excited to learn more about different topics and funnels them to the right resources for their use case. It was also important to drive engagement into other Qualcomm touch points like blogs and news articles.
Learning Hub Pages
A place for developers to access Qualcomm's learning courses and tutorials. It was easy for these pages to get content heavy, so we focused surfacing the minimal amount of content a developer would need to make a decision on which resource was right for them.
Topic Pages
A landing page for a specific "topic" or group of tools and software a developer would need for a particular type of project. We developed visual patterns and iconography for the different resource types (videos, integrations, GitHub samples, and software) to help with cognitive load and navigation.
Resource Page
Typically a wall of links, we brought in thumbnails to give the page visual interest and introduced anchor links for quick navigation between different resources, knowing that devlopers are usually using multiple at once.
Impact and Takeaways
The new Developer Hub experience was launched in time for the Summit, and our design strategy was rolled out to the rest of the Qualcomm website. Our guidelines are still used today as legacy pages are updated and new experiences are added. Explore Qualcomm.com to check it out!
User Testing
If given more time, usability tests could have been used to validate whether or not the new presentation of this information supported users and their needs.
Deprioritized Opportunities
Throughout discovery, community content like forums were often brought up as helpful in the developer space. Governance and how to source this content was a large problem to solve, so it was deprioritized for this project despite the positive impact it would likely have on users.
I just want to take a moment to draw attention to the awesome work that the Blink team is doing, specifically Caryn and Kristen on this project. This started out as a hairy problem that the business had a hard time wrapping its arms around. With Kristen and Caryn taking the lead they have built trust among these notoriously tough stakeholders and are delivering ahead of schedule. They have made the complex matrix simple.
Tyler Molhook | Qualcomm Senior Design Manager