UX Case Study: Community Platform for Learning
A Step-by-Step Case Study for Designing a Community Platform for Studying and Connecting with Like-minded Individuals
Hi everyone! This time, I will share my design process of designing an app for a community platform for learning. This project is an individual project from an Interview Given by a company.
Here are the details for this case study:
Product Vision: Provide the best learning platform for a learning experience, connecting individuals and empowering their personal and professional growth with collaboration, Knowledge sharing, and meaningful connections
Timeline: Approx. 3 weeks (Day 15–21)
Tools: Figma, Notion, FigJam
Scope
This case study focuses on the design and development of a comprehensive community platform, StudyHub, that caters to individuals seeking to study and connect with like-minded individuals. The scope includes conducting user research and needs assessment, defining the user journey, creating an intuitive user interface, implementing essential features such as course libraries and study group functionalities, enabling study collaboration, encouraging community engagement, iterative testing, and feedback, and launching the platform. The case study aims to showcase the step-by-step process of designing StudyHub, ensuring an optimal user experience, and meeting the needs of individuals looking to enhance their learning journey and build valuable connections.
1. Empathize
At the beginning of empathize stage, I conducted research by interviewing one person who closely matched our target user criteria. I asked her a series of prepared questions to gather valuable insights. After the interview, I organized the findings by creating an Affinity Map.
This involved grouping similar ideas, thoughts, and experiences to identify common themes and patterns. The Affinity Map helped me better understand our target user’s needs, challenges, and motivations. This research approach allowed me to gather firsthand user perspectives. After that, I grouped the interview results into an Affinity Map.
- Affinity Map
The following is an Affinity Map that I created which contains the user's words during the interview.
- User Persona
As part of processing the research findings, I create a User Persona to encapsulate the key insights gathered during the research phase. The User Persona provides a comprehensive profile of the target user, including their goals, needs, frustrations, and interests. Additionally, it includes relevant information such as the user’s profile, personality traits, influencers (for mobile app design), and behavioural characteristics. This persona serves as a powerful tool to guide the design process, enabling a deeper understanding of the user’s motivations and ensuring the app’s features and functionalities align with their specific preferences and requirements.
2. Define
In the Define stage, I use the insights collected during the empathize stage to identify and define the specific user problems. Crafting a clear problem statement is crucial to succinctly describe the challenges and pain points faced by the target users, guiding the design process towards effective solutions. Additionally, creating a user journey map helps visualize the user’s interactions and experiences with the product, uncovering touchpoints, pain points, and improvement opportunities. This comprehensive approach ensures a user-centric design, addressing the user’s needs and enhancing the overall user experience. The problem statement and user journey map serve as vital tools in laying the foundation for the subsequent stages of the design process.
- Problem Statment
Users are having trouble finding a platform that combines learning resources and allows them to connect with people who share their interests. They find it hard to access resources that are specifically designed to help them improve their skills. Our goal is to create an app that solves these problems by providing a community platform where users can find the learning resources they need and connect with others who have similar goals.
- Pain Point
Users currently lack a platform that offers a great learning experience while fostering a sense of community. They feel alone in their learning journey and have difficulty finding ways to collaborate, network, and access useful resources. The absence of such a platform makes it challenging for them to improve their skills and connect with like-minded individuals. My goal is to design an app that addresses these pain points by providing an enjoyable learning environment and encouraging users to actively participate. By connecting learners and offering valuable resources, we aim to create a supportive community that helps users enhance their skills and feel a sense of belonging.
- User Flow
The app starts with onboarding, where the student sets preferences. They access classes, projects, and mentors to enhance their learning. Collaboration with peers and hands-on experiences are encouraged, promoting personal and professional growth.
3. Ideate
After analyzing the problems and opportunities identified in the Define stage, I develop the best possible solutions to address the collected issues effectively. These solutions are tailored to meet the user’s needs and preferences, ensuring a user-centric approach to resolving the identified challenges.
- My Role
As the Product Designer, I am responsible for conceptualizing and designing the community platform for Learning. My focus will be on understanding the needs and motivations of the users, rafting design solutions that are intuitive, efficient, and delightful to use.
- Gole
This case study aims to design an app that offers a seamless learning and networking experience. The platform creates an intense community atmosphere while providing valuable resources for skill development. By connecting users with similar interests, it fosters meaningful connections, promoting continuous learning and growth. With an interactive and enjoyable interface, the app empowers users on their upskilling journey, enhancing their skills and creating a sense of belonging within the community.
- Sketch
Using the design sprint method, I created 6 sketches depicting the rough layout of the mobile app. These sketches showcase the visual representation of the proposed solutions, helping to visualize the app’s key features and user interface. The design sprint method facilitated rapid ideation and iteration to refine the app’s design concept.
4. Prototype
To begin the prototype stage, I surfed the internet for some design inspo. After checking out Dribbble and Behance a thousand times, I finally came up with an image of what I wanted my app to look like.
Get Lovely Singh’s stories in your inbox
Join Medium for free to get updates from this writer.
UI Kit
I implement an atomic design method to make a UI style guide. I began setting it up by choosing a signature colour and typeface. I looked for a trendy colour and typeface on the internet and I’ve decided to pick the colour Blue #6459EF and Roboto for the name of the typeface.
I also create some components that were used several times in the prototype so I can always reuse them some other time. The UI style guide was very useful to maintain consistency in design. But we don’t always have to create a UI-style guide from scratch. There are so many open-source design systems that we can apply in our design.
- Interface Design
After finalizing the ideate phase, I create a high-fidelity prototype by enhancing the interface design and adding interactive flows. I also develop a UI style guide to document the design resources, ensuring a consistent and polished user experience throughout the app.
Feature
Welcome to our feature page, designed to help you find the perfect mentor, courses, and events tailored to your interests. With our subject filters, you can quickly narrow down your options based on your taste, whether it’s coding, photography, marketing, or cooking. Discover mentioned mentors who excel in their fields and offer valuable guidance, and explore the best and most popular courses recommended by users. Stay updated with upcoming events for networking and personal growth. Find genuine pearls among mentors, courses, and events, solve problems, and gain new perspectives. Start your journey towards a better learning and mentoring experience now!
Network
The Network page is your gateway to connecting with new people and engaging in meaningful conversations. Here, you can access chat features that allow you to create groups and have individual conversations to solve problems and gain knowledge. The chat section is divided into three parts for ease of use: groups, unread messages, and message requests. Connect with like-minded individuals, collaborate, and exchange ideas. Stay informed and engage in valuable discussions to expand your knowledge.
My learning
First page, where all courses are conveniently placed in one location for easy access and enrollment. Here, you can track your course progress, allowing you to see how much of the course you have completed.
On the second page, we provide you with access to learn through engaging videos and detailed course information. You’ll find a comprehensive list of lectures, assessment grades, and resources provided by your mentor to help you complete the tasks. We understand that a well-rounded learning experience includes both theoretical and practical components.
By utilizing these features, you can gain a complete understanding of the course material and apply your knowledge effectively. Whether you’re watching videos, reviewing lecture notes, or completing assessments, our platform ensures you have all the necessary resources at your disposal.
Events
The events page is your go-to resource for all upcoming events. Discover a comprehensive list of upcoming events you can enrol in, as well as access to a collection of past event videos that you can watch at your convenience. Stay updated with the latest trends and developments in the market, while also having the opportunity to get your doubts and questions resolved. Immerse yourself in valuable content and gain insights from industry experts.
Profile
The profile page is your personalized hub that comprehensively overviews your information, choices, and interests. It includes your picture, name, email, and other relevant personal details to help you establish a connection and better understand your profile. Additionally, you can access settings related to your courses and videos, enabling you to customize your learning experience. Manage various aspects of the app, such as notifications and preferences, through the intuitive settings feature. With the profile page, you have a centralized location to access and manage all the essential information and settings, ensuring a seamless and tailored experience.
And… That’s a wrap!
In conclusion, we have reached the end of this case study. Thank you for investing your valuable time in reading through it. I trust that the information provided has been valuable to you.
