Project Overview
As part of my internship at Haven, I designed a Community Page to create a social platform for small businesses and contractors. The goal of the platform was to foster collaboration and networking by allowing users to join communities (referred to as "Havens") and discussion groups related to their fields and interests.
Problem Statement
Small businesses and independent contractors often lack a centralized platform to:
- Connect with peers in their field.
- Share insights and opportunities.
- Build a supportive network within their professional community.
Haven wanted to address this gap by creating a dedicated online space for meaningful interactions and collaboration.
Solution
The Haven Community Page provides a structured yet flexible platform where users can:
- Join and participate in groups based on their professional focus or identity.
- Create and view posts within specific groups, fostering engagement.
- Explore additional communities to expand their network.
I created a Figma mockup to visualize and refine this concept.
Key Features
1. Sidebar Navigation
The left sidebar organizes the user's communities and groups for easy navigation:
- My Havens: Displays broader communities, such as Government and Relationship.
- My Groups: Lists more specific groups like Small Business, Minority, Women, and Veteran.
- A collapsible arrow and Explore Groups link encourage users to discover new communities.
2. Main Content Area
The main section focuses on engagement within a specific group. For example, in the mockup:
- The user is in the Landscaping Services group.
- A prominent post creation feature allows users to:
- Share posts with their name and title or as Anonymous.
- Add text, images, or links to foster detailed discussions.
3. Card Navigation
The bottom of the page displays cards to allows the user to explore groups, explore topics, and expand their network.
4. User Interaction
Users can interact with the group by:
- Viewing and commenting on posts from other members.
- Reacting to posts to express appreciation or agreement.
Design Process
1. Research & Ideation
I began by researching existing platforms like LinkedIn Groups and Facebook Communities to understand their strengths and limitations. The insights guided my decisions to:
- Prioritize a clean and intuitive layout.
- Emphasize inclusivity by allowing anonymous posting.
2. Wireframing
I created low-fidelity wireframes to map the structure:
- Focused on keeping the sidebar minimal yet informative.
- Designed the main content area to highlight the group’s activity and post creation features.
3. High-Fidelity Prototyping
Using Figma, I developed a high-fidelity prototype:
- Applied Haven’s branding for visual consistency.
- Incorporated user-friendly UI elements like dropdowns and buttons.
4. User Feedback
I presented the prototype to the Haven team and gathered feedback. Based on their suggestions:
- Added a collapsible sidebar to save screen space.
- Enhanced the post creation feature to include options for multimedia uploads.
Challenges
- Balancing Complexity and Simplicity: Ensuring the platform was feature-rich without overwhelming users required careful prioritization.
- Encouraging Engagement: Designing features to motivate users to participate actively, such as the anonymity option, was crucial.
Results
The Haven team was impressed with the mockup's functionality and alignment with their vision. The Community Page design laid a strong foundation for future development, aiming to:
- Increase user retention by fostering deeper engagement.
- Strengthen the Haven brand as a platform for small businesses and contractors.
Reflections
This project highlighted the importance of understanding user needs and balancing visual design with functionality. By designing a Community Page that was both intuitive and impactful, I contributed to Haven’s mission of empowering small businesses and contractors through connection and collaboration.
Tools Used: Figma, User Research, Wireframing, Prototyping
Skills Gained: UI/UX Design, Interaction Design, Product Thinking