Create a better user experience for their online community site, and redesign the IA and navigation to create a seamless integration of the online community and other necessary siloed sites.
An enterprise company offering a low-code BPM solution
The company that approached us had large goals to accomplish that required significant attention to their website. Our first challenge to overcome was to determine what a future state user experience and navigation might be, then design a framework that allowed them to fill it over time.
My Role
Lead UX Designer - UI Designer
I was the lead UX and UI Designer on this project. I was tasked with—and excited to accomplish—user research, data synthesis, information architecture, navigation taxonomy, mock-ups, and wireframes.
Table of Contents
Discovery
Analysis
Problem Statements
Research
Synthesize
Key Findings
Determinations
User Flows
IA/Navigation
Wireframes
Discovery
In the beginning, we spent some time with the company discussing their business goals, as they pertained to their website. We were happy to help bring clarity to the conversation by approaching the solution in two separate ways IA and Navigation for their site as a whole, and UX with beginning wireframes for their online community.
IA/Navigation
Online Community
Better integration of all sites associated with their main site
Significant growth in online community signups
Determine taxonomy for a future state
Bring clarity to user needs and desires
Create a better overall user experience
Integrate online community goals of Grow, Collaborate, and Learn
Analysis
As we came to understand their goals and objectives, I began to look forward to analyzing their website. I wanted to understand how a user might operate and accomplish tasks on their website, as well as reveal any major pitfalls that users may run into.
Areas to grow
Full Site IA/Navigation
Online Community
Too many options in the navigation. This created an experience that was confusing and convoluted.
A taxonomy that didn’t feel intuitive.
The main pages lacked clarity on what they aimed to accomplish.
Accessibility was lacking with pertinent content and functions.
Problem Statements
After analyzing their website, I was able to clearly identify the problems.
The taxonomy within the main site navigation seemed to lack intuitive placement and the menu contained too many options. This led to a confusing user experience and an inability to easily navigate between multiple related content pieces.
The online community pages lacked direction for the tasks users desired, and many of the pages contained options that didn’t directly answer the user's needs.
Problem Statements
After analyzing their website, I was able to clearly identify the problems.
The taxonomy within the main site navigation seemed to lack intuitive placement and the menu contained too many options. This led to a confusing user experience and an inability to easily navigate between multiple related content pieces.
The online community pages lacked direction for the tasks users desired, and many of the pages contained options that didn’t directly answer the user's needs.
Research
As my assumptions began to build, I needed further data to prove or disprove what I was finding. Research is a joy of mine, and it was my pleasure to understand user needs for the online community and ways to design an information architecture with more clarity.
IA/Navigation
Heatmap analysis
Page analytics
The objective was to discover the content and pathways users were choosing most.
The objective was to determine page efficacy which would inform hierarchy decisions.
Website goals
Card sort
The objective was to understand the tasks and activities they wanted users to perform.
The objective was to discover content categories and placement determined by users.
Online Community
50 unaffiliated survey respondents
3 unaffiliated interviews that fit their target persona
The objective was to determine how a user, fitting their persona, would benefit most from a website similar to theirs.
The objective was to discover the desires and needs a user would have to navigate a website for a product like theirs
110 current user survey respondents
3 interviews with current users
The objective was to discover the needs users found most immediate and most important. I also wanted to determine how they accomplished pertinent tasks and their experience doing so.
The objective was to discover how they currently use their website, which desires are being met, and which ones are not.
Additionally I performed a competitive user flow analysis on four of the companies main competitors
The objective was to discover common user patterns, strengths we might glean from, and areas of opportunity where we may create a better user experience.
Synthesize
I utilized affinity mapping as one of the main tools to draw insights and synthesize my data. This allowed me to discover the cross sections between business needs, and user desires. It also uncovered potential pitfalls in the companies online community strategy altogether.
Grow
Learn
Collaborate
Problem Solve
Drive/Desire
Key Findings
As we synthesized a significant amount of data, these were some of the key findings that helped to shape the solutions needed.
IA/Navigation
Main content categories
Top 10 pages visited
Website goals
Tasks and info users desired
Discover
Products & Services
Learn
Community
Resources
Grow community users from 50k to 200K
Integrate siloed web experiences into one ecosystem
Online community goals of grow, connect, and learn.
Home
Getting started
Pricing
Low-code Platform Overview
About
Low-code App Development
Contact
Why us
Business Process Management
Resource center
Social Proof
Specific use needs
Products and services
What’s new
Problem-solving
Testing the product
Online Community
Tasks users found most important to perform.
Troubleshooting
Explore Best Practices
Hands-on exploring platform
Enroll in training
Execution vs encouragement
Motivation to learn new skills
Access to peer support
Quickest and Clearest Access
Find technical articles and resources
Ask a question or troubleshoot a problem
Explore best practices
Key Findings
As we synthesized a significant amount of data, these were some of the key findings that helped to shape the solutions needed.
IA/Navigation
Categories
Tasks and info
Discover
Products
Learn
Community
Resources
Social Proof
Specific use needs
Products and services
What’s new
Problem-solving
Testing the product
Grow community users from 50k to 200K
Integrate siloed web experiences into one ecosystem
Online community goals of grow, connect, and learn.
Website goals
Online Community
Tasks users found most important to perform.
Troubleshooting
Exploring best practices
Hands-on exploring platform
Enroll in training
Execution vs encouragement
Motivation to learn new skills
Access to peer support
Quickest and Clearest Access
Find technical articles and resources
Ask a question or troubleshoot
Explore best practices
Determinations
IA/Navigation
A secondary navbar needs to be created to better navigate between related content groups
New landing pages need to be created to streamline menu options, and bring clarity to the navigation
An interim solution is needed for the IA and navigation to create a foundation for the future state
Primary navbar categories need renaming to match website goals and user needs
Online Community
Highlight the earning potential from being a certified App user
Bring attention to the value proposition of the online community
A new main page that fits the user needs hierarchy
New landing pages for the categories that match the company's online community goals
Determinations
IA/Navigation
A secondary navbar needs to be created to better navigate between related content groups
New landing pages need to be created to streamline menu options, and bring clarity to the navigation
An interim solution is needed for the IA and navigation to create a foundation for the future state
Primary navbar categories need renaming to match website goals and user needs
Online Community
A new main page that fits the user needs hierarchy
New landing pages for the categories that match the company's online community goals
Bring attention to the value proposition of the online community
Highlight the earning potential from being a certified App user
User Flows
I utilized user flows to help determine how a user might most effectively accomplish a task. The task chosen for each user flow was aimed directly at a goal the company had for its website. Here are two of the most pertinent user flows for the user and website goals.
Key
Community signup
Solve a problem
IA/Navigation Diagram
This diagram provided a great way to visualize the new information architecture. What was exciting about this diagram is how it opened up the conversation about a secondary navbar for specific content groups and the need for new landing pages in a later phase!
Key
Wireframes
These wireframes are the main category landing pages for the online community and are directly related to the company’s community goals of growing, collaborating, and learning. I aimed to design something highly functional and visually appealing!
App Community Homepage
Wireframe Logic and Key Insights
Grow Landing Page
Wireframe Logic and Key Insights
Learn Landing Page
Wireframe Logic and Key Insights
Collaborate/Problem Solving Page
Wireframe Logic and Key Insights
Conclusion
Much of this project felt like untying a knot only to reveal more knots to be untied! I thoroughly enjoyed this project as it did require a high level of problem-solving for the company and empathy for the users. In the end, I was able to design solutions and set a foundation that would propel the company into the future state it desired!
The deliverables included research and insights, information architecture that allowed growth into their future state, goals-based user flows, and wireframes to redesign the online community experience.
