DesignHub
Case study for an online design community
Project Overview
MY ROLES
User Research
UX/UI Design
Branding
Prototyping
Usability Testing
TOOLKIT
TIMELINE
5 weeks, approximately 120 hours
BACKGROUND
Entering the field of design, I was overwhelmed by the amount of content and information out there. Additionally, I found it difficult to find mentors outside of sending a message into the dark void of cold outreach. After self teaching for numerous months, I enrolled in a UX Academy bootcamp where I noticed others feeling the same way. With this gap in the market I wanted to explore it for myself by designing a responsive website.
THE PROBLEM
UX Design is a growing industry, but lacks a go to platform for collaboration and professional development. The three problems DesignHub is working to solve are:
Providing a platform for designers to find, save, and organize content easily
Having access to reliable mentorship
Staying connected in a world transitioning towards remote-first work
THE SOLUTION
DesignHub is a company focused on improving the life of designers and aspiring designers. In order to solve this problem, I will be creating responsive website designs for DesignHub.
Design Process
RESEARCH
Discovery & Immersion
My Biases & Research Goals
To get the most out of the research process, I not only outlined the research goals, but my assumptions and biases too.
As a UX Designer, working on a project that can benefit me directly is a difficult task. Jotting down my own biases helps me focus on the research, rather than what my experiences have led me to believe.
Competitive Analysis
I took a holistic approach in conducting market research to understand where the opportunities are for DesignHub. Research showed that:
Companies are transitioning towards remote work
Millennials value networking, mentorship, and career development
From here, I decided to analyze the strengths and weaknesses of ADPList, LinkedIn, and Design Buddies and noticed there were two main areas of opportunity:
Design communities on Discord and Slack make it difficult to filter, save, and organize content to use in the future.
The UX industry lacks a platform for collaboration and reliable mentorship
1:1 Interviews
Although I could interview anyone in the UX Design Industry, I decided to focus on the participants I like to call the “power users.” I interviewed 4 participants with various levels of experiences and backgrounds: an aspiring designer, 2 designers with 4-6 years experience, and a mentor with 10+ years experience.
Needs
Stay up to date on design trends
Form genuine connections with other designers
Have access to reliable mentorship
Organize resources and content to find it easily
Grow their professional network
Secure/trustworthy platform
Pain Points
Finding mentors on LinkedIn feels like sending a message into a dark void
Not being able to find the resource they’re looking for
Being overwhelmed by information without being able to digest it - white noise
High cost or limited access to free options
Empathy Map
After completing my research, I synthesized the qualitative data gathered from user interviews and curated an empathy map to identify patterns across users, uncover insights, and generate needs.
I discovered that no matter what level a designer is, at some point in their career they have:
Felt lost trying to find accredited information on various topics
Needed mentorship but not know where to go
Felt the need to belong in the industry by connecting with other designers
User Persona
With the data gathered from market research, I generated a persona using the statistical knowledge I gained to represent a certain type of user for DesignHub. This persona helps me focus on tackling the most important needs and allows me to easily access the user’s goals and pains.
Although I’m only building out one persona for this case study, there is a second persona that exists for this project as well, the Mentor. To meet project deadlines, I focused on the user that needs to grow professionally through community and mentorship.
Let’s meet Rachel, a UX Designer in New York. She’s new to UX and is overwhelmed by the amount of content and is looking to connect with other designers.
DEFINE
Strategy Development
Goals, Defined
Identifying the overlap of goals was crucial for directing my product development while maintaining stakeholder alignment. These goals will later help clarify what is needed in the product and overall brand identity.
Next, I combined these goals with my findings from competitive analysis to leverage the features I needed to have in my product.
UX Strategy
Outlining the UX strategy prior to any beginning any designs helps align different product teams around a shared product vision. This means fewer misunderstandings, less rework, and helps teams maintain consistency across UX touch points to create frictionless experiences. Ultimately creating a successful product.
Product Roadmap
I put the solutions I brainstormed into a sorted list of product features to create a comprehensive product roadmap. Three key features to highlight:
Building a community for designers to connect with one another
Providing reliable mentorship to users
Allowing users to save and organize content that works for them
The Product Roadmap not only infuses the project goals into our product, but also ensures we prioritize the most important features in the development cycle, such as mentorship and community capabilities.
IDEATE
Interaction Design
Site Map
Based on my product roadmap I created a site map to plan the navigation of the site. The simplicity of the overall structure aligns with the company goals to reduce cognitive overload when users look for content.
I created two important sections for users: Community and Mentorship. The Community section allows users to find and organize relevant content; while the Mentorship area gives users the power to form genuine connections in a reliable setting.
Hierarchy and usability helped me make informed decisions when creating the relationship between the content of my product. Prototype & Testing
User Flow
Thinking back to Rachel I created this user flow and decided the 3 tasks she needs to accomplish. Those being:
Looking for a new mentor
Finding an article for empathy maps
Finding a saved article for usability heuristics
This was essential for the steps to follow as I now ensured my site could be used to complete the tasks most important to Rachel. Developing this path helped me determine how many pages are needed, what order they should appear in, and what components are required for the user to complete the tasks successfully.
Wireframes
Ideating DesignHub was a difficult task. In order to really build out the process I created wireframes for the:
Homepage and Community Page
Mentor and Mentor Profile Page
Onboarding Screens
I decided to design these pages based on my users' need for inspiration, information, browsing capabilities, and mentorship.
Wireframes: Responsive
After iterating on various layouts designs, I created an interface that aligned with DesignHub’s goal to be simplistic.
Creating different wireframes for a laptop, tablet, and mobile device allowed me to fully flesh out my design decisions. Each element was considered when constructing these wireframes which ultimately helped set the standard for the rest of the process.
Designing an intuitive way to explore & sort topics
After researching how current products on the market display content, I noticed that there were two popular approaches to showing this information.
List-based: A text-based list where users can select topics displayed to them
Drop down menu based: This view allows users to select the same topics, but are hidden behind a menu button that encapsulates all options
Additionally, I also worked to make the feed section more intuitive through numerous iterations. I focused on nailing down the hierarchy of content to ensure the functionality was easy to use.
DESIGN
Branding & UI Design
Style Tile
Once I completed the wireframes, I moved onto the UI Design and Brand Development part of the process. I decided to name the platform DesignHub because the goal is to make this a “hub” or a go to place for designers. The pop of purple combined with rounded elements and friendly illustrations made for a style tile that reflected my initial findings and project as a whole.
Final UI Designs
Rachel, our persona, requires a few key needs to be solved for DesignHub to be valuable for her. These needs are:
Connecting with other designers, especially in a world transitioning towards remote work
Finding and organizing resources/content easily
Receiving reliable mentorship
I built out different processes to ensure we solve Rachel’s most basic needs:
Onboarding process
DesignHub community pages
Mentorship process
Profile page
Responsive UI Designs
After completing my final UI designs, I adapted the homepage and community page to tablet and mobile screen sizes.
The community page was trickier to make responsive because of the numerous filters and functionalities. To reduce cognitive overload, I placed all filters everything behind a filter icon.
USABILITY
Prototype & Testing
Usability Testing
Keeping these design decisions in mind, I began to develop a brand strategy. I needed to create a product that reflected my user's goals and pain points. This meant utilizing colors and imagery that reflected a trustworthy and friendly brand.
Task Completion Rate
100% task completion among 4 participants
Wins
All participants felt the website was fresh, clean, easy to use and modern
All participants enjoyed having an area to sort, organize, and save content
All participants appreciated that this platform is free to all designers
REFLECTION
Final Thoughts
Conclusion & Reflection
Due to time constraints, I was not able to build out every single process for this platform. But I was able to solve the challenges I faced through in depth research, numerous iterations, and blending user and business goals to ultimately create a design platform.
Entering the field of design, I was overwhelmed by the amount of content and information out there. Trying to find mentors in the design field seemed impossible, outside of sending a message into the dark void of cold outreach.
The best way to complain about my experience is to make something, and that’s exactly what I did! I hope that one day I can develop DesignHub into a real website for designers nationwide to leverage.