UX Research & Strategy Redesign

UX Research & Strategy Logo

Roles

UX Design Lead

Tools

Figma
Microsoft Usability Lab
Slack

Project Duration

20 weeks

The Challenge:

To redesign the UXRS Website to enhance user engagement and accessibility.

User Experience Research & Strategy (UXRS) is a 501(c)(3) non-profit organization dedicated to advancing the field of UX research and strategy through educational events, panels, and online resources. Despite its vital role in the UX community, the UXRS website faced significant usability issues that hindered user engagement and accessibility. Our challenge was to revamp the website to better support UXRS’s mission by addressing these issues and improving the overall user experience.

Our Goals:

Our goals in tackling the UXRS website redesign were to:

  • Apply Our Collective Expertise: Leverage the diverse skills and knowledge within our team to create a significant redesign of the UXRS website, focusing on enhancing user experience and aligning with best practices in information architecture and SEO.
  • Showcase Effective Collaboration: Demonstrate our ability to work together efficiently, with each team member contributing their unique strengths to achieve our project objectives.
  • Integrate User-Centered Design: Apply principles of user-centered design to address the specific needs and pain points of UXRS's diverse user base, ensuring that the redesign enhances usability and accessibility.

In terms of redesigning the UXRS website, our primary goals were to:

  • Enhance Information Architecture: Redesign the website's structure to improve navigation, consolidate event pages, and create a more intuitive layout that facilitates easier access to key content.
  • Improve User Engagement: Develop features such as a dedicated community page and enhanced search functionality to foster greater interaction and connection among UXRS members and visitors.
  • Optimize for Search and Accessibility: Implement SEO best practices and ensure that the website meets accessibility standards to increase visibility and usability for all users.
  • Justify Design Decisions: Ensure that every design change was supported by user research and usability testing, providing a solid rationale for each decision made throughout the redesign process.

Project Context

For our capstone project at the University of Washington, my team and I partnered with UXRS. Our main point of communication was Jake Rhodes, the current president of the organization. He wanted us to redesign the UXRS website with a specific focus on Information Architecture (IA) and Search Engine Optimization (SEO) to improve user navigation and functionality.

Thus, we aimed to create a more intuitive and engaging platform that would not only meet the needs of current users but also attract and retain new members. By improving the website’s information architecture, implementing effective search and filtering features, and updating its design system, we sought to transform the UXRS website into a valuable resource that aligns with its mission and supports its community effectively.

To achieve these objectives, we divided the project into four major milestones. Each milestone focused on different stages of research, design, and testing to ensure that our final recommendations would be data-driven and user-centered. This case study outlines the entire process, from initial research and analysis to prototyping and usability testing, and highlights the actionable insights we generated.

As the UX Design Lead, I was responsible for leading key design decisions and ensuring uniformity across the design framework. I oversaw the development of prototypes, wireframes, reports, and final project deliverables. Additionally, I coordinated with team members to ensure that the design system aligned with our research findings and the sponsor’s requirements.

Milestone 1: Background Research & User Survey Analysis

Research Focus

Our project began with an exploration of two unfamiliar problem spaces: Information Architecture and Search Engine Optimization. To ensure that we had a solid foundation in these areas, we conducted extensive research, using a combination of academic sources, case studies, and online SEO tools. This initial step provided the necessary insights for improving the UXRS website’s layout, navigation, and discoverability on search engines.

We also performed a comprehensive data analysis using web traffic metrics provided by our sponsor. This analysis was divided into two parts:

  1. Quantitative Analysis of website traffic data.
  2. Qualitative Analysis of survey data from UXRS members.

Key Recommendations for IA and SEO

Information Architecture

  • Hierarchy and Layout: We recommended improving the site’s content hierarchy to ensure consistent font sizes, content arrangements, and navigation patterns. We suggested the implementation of a more structured and intuitive layout, inspired by successful platforms like Airbnb, to reduce cognitive overload and promote smoother navigation.
  • Featured Content System: Currently, UXRS relies on a reverse-chronological display of past events and news, which forces users to scroll endlessly. We suggested implementing a featured content system, like IGN's, to highlight key content and dynamically present information. This would allow UXRS to spotlight important events, articles, or videos, improving user engagement and satisfaction.
  • Web Accessibility: To meet WCAG standards, we recommended increasing the site’s contrast ratios and ensuring that all images have descriptive alt text to make the website more accessible to users with visual impairments. By focusing on accessibility, UXRS can expand its audience and provide a more inclusive experience.

SEO Recommendations

  • On-Page SEO: We advised optimizing keywords, meta descriptions, and internal links to improve SEO rankings. We also recommended embedding YouTube videos directly on the site rather than linking out to external platforms to increase site retention.
  • Off-Page SEO: Leveraging social media platforms like LinkedIn for backlinks would help drive more traffic to the website. Including links to UXRS events and content in LinkedIn posts and YouTube descriptions would increase the site’s discoverability. Finally, refining meta descriptions and utilizing schema.org tagging would improve UXRS’s visibility in search results.

Data Analysis

  • Website Traffic: The analysis of traffic data from Weebly revealed a stable number of unique visits, with a spike in early 2024, likely due to increased interest in UXRS events. However, LinkedIn referrals were low despite UXRS having a significant following on the platform. We recommended optimizing the site for LinkedIn backlinks and switching to more advanced analytics platforms like WordPress or Piwik PRO for deeper insights.
  • Survey Data: UXRS members, predominantly with postsecondary education, favored email and LinkedIn for communication but showed less interest in long YouTube videos. We recommended focusing on shorter-form content and enhancing academic partnerships to increase engagement.

Milestone 2: Information Architecture Design Scoping & Ideation

Deliverables

For our second milestone, we created two distinct user personas and user journey maps to represent different types of UXRS users: experienced researchers and novices. These personas and maps helped us better understand user behavior and identify key pain points in the current website design.

User Personas

  1. Courtney Larson (Novice Persona): A 20-year-old college student with less than a year of UX experience. She is looking to expand her network and gain knowledge through the UXRS community. Courtney’s main pain point was difficulty finding networking opportunities and navigating the site’s event archive.
  2. Jude Reed (Expert Persona): A senior UX designer at Microsoft with years of experience in UX. Jude uses the website to stay updated on research trends and engage with the UXRS community. He found the site difficult to navigate, particularly when searching for specific content.
Courney Larson User PersonaJude Reed User Persona
User personas for Courney and Jude

Journey Mapping

We mapped the user journey for each persona to highlight specific pain points:

  • Courtney Larson struggled to engage with the UXRS community, especially when attempting to join Slack or locate upcoming events.
  • Jude Reed had difficulties navigating the events archive due to the poor organization and limited search functionality on the website.
Early in career journey map
Early in career journey map
Late in career journey map
Late in career journey map

User Flow and Design Requirements

Based on our persona insights, we developed a user flow chart with four main pages:

  1. Home: A welcoming banner, team introduction, and community engagement options.
  2. Events: A consolidated page for upcoming and past events with horizontal card sliders.
  3. Community: A new hub for community interaction, featuring Slack links, social media, and mailing list sign-ups.
  4. News: A blog-style page with categorized articles and search/filter functionality.

This user flow guided the design of our prototype in the next phase.

User flow
Prototype user flow chart

Milestone 3: Prototyping

The third milestone focused on translating our design ideation into a tangible low-fidelity prototype using Figma, then translating it into a high-fidelity prototype. This prototype was essential for testing the proposed changes and gathering user feedback. It was based on the insights gained from our user research and journey mapping, and it aimed to address the navigation, IA, and SEO issues identified in earlier milestones.

We decided to maintain the website's existing general theme and design system for the prototypes because our focus was not on UI rebranding but improving the overall user experience and IA of the website.

Key Changes in the Prototype

  • Consolidated Events Page: By merging the upcoming and past events into a single page, users could easily locate time-sensitive events while having access to archived content in a more organized manner. We implemented a card-and-modal layout to simplify the navigation experience.
  • Community Page: We introduced a dedicated community page with prominent links to Slack, social media platforms, and mailing lists to foster engagement.
  • Search and Filter Functionality: We added a search bar and filter options to allow users to easily locate past events and resources by keyword.

These design decisions were built upon the recommendations from earlier milestones and would be validated in our usability testing. Feel free to test out our interactive hi-fi prototype!

Low fidelity community pageLow fiedlity events page
Lo-fi community page
Lo-fi events page
High fidelity home pageHigh fidelity events page
Hi-fi Home page
Hi-fi Events page
High fidelity community pageHigh fidelity news page
Hi-fi Community page
Hi-fi News page

Milestone 4: Usability Testing and Final Recommendations

Usability Lab Testing

For the final milestone, we conducted a usability study with two users at Microsoft’s Redmond headquarters usability lab. The facility was equipped with one-way glass, intercom systems, and AV recording, allowing us to observe participants as they interacted with both the existing website and our prototype. Each usability test lasted approximately an hour and was structured with a protocol and testing kit.

Goals and Tasks

We focused on testing the information architecture and navigation of both iterations. Participants were asked to complete tasks such as:

  • Finding a specific event.
  • Signing up for the mailing list.
  • Joining the Slack channel.
  • Signing up for an upcoming event.

Key Findings and Recommendations

1. Add a Dedicated Community Page

We discovered that users struggled to find community engagement options on the current website. By introducing a dedicated community page in our prototype, users were able to easily access Slack and social media links, and community participation improved.

2. Streamline Events Page

Participants preferred the consolidated events page in our prototype. The card-and-modal system allowed them to quickly navigate upcoming and past events without information overload. However, some users struggled with the carousel navigation, so we recommended adding clear scroll indicators.

3. Implement Search and Filter Functionality

Both novice and expert users expected a search function to quickly locate past events. Our prototype’s search and filter options significantly improved the experience, allowing users to easily find specific events like Clinical UX without having to scroll endlessly. This feature received positive feedback, with users describing it as “fast” and “intuitive.”

4. Update Design System

Our testing revealed inconsistencies in text styles and color schemes on the current website. To ensure brand consistency, we developed a design system with uniform fonts, color palettes, and margins that aligned with UXRS’s brand identity. We recommended conducting further research on visual design preferences to ensure optimal usability.

Team photo at Microsoft usability labPhoto of me during usability testing of user 2Photo of me and Bryan testing user equipmentPhoto of team during usability testing user 1Photo of team inside usability labPhoto of team taking notes during usability testing
Photos from the Microsoft Usability Lab

Reflection

Our redesign of the UXRS website aimed to address user pain points, improve navigation, and enhance community engagement. The iterative process, guided by user feedback and usability testing, resulted in a more user-centered and effective website prototype. By implementing our recommendations, we predict that UXRS can better serve its community and achieve its goals of promoting UX research and strategy education.

Throughout the project, our team maintained clear expectations and roles, as outlined in our team contract. We established effective communication channels and strategies for conflict resolution, ensuring smooth collaboration and timely progress. Each team member’s contributions were integral to the project’s success, from managing milestones to conducting research and design.

Read through our entire Process Book here, and watch our project video here!

Photo of me during capstone showcase
Capstone showcase image