Hobbmate

Overview

Hobbmate is a photo-sharing platform aimed at hobbyists and enthusiasts. Unlike traditional social media apps, it focuses on fostering positive connections through shared passions while ensuring privacy. It’s designed to provide users with a clean, ad-free experience where they can post and engage with content they love, free from algorithms and data tracking.

As the product designer, I was responsible for the entire design process—from conceptualization to execution—while also taking on product management responsibilities. This included wireframing, creating UI designs, collaborating closely with the development team, and ensuring seamless product implementation. I also created a detailed design document to guide the development team and make the process as smooth as possible. This project marked my first full-scale product design, where I not only honed my skills but also learned a great deal about product management and cross-team collaboration.

Design Approach

Framework: User-Centered Design (UCD)

The design process followed the User-Centered Design framework, focusing on delivering the best possible user experience through:

• Empathy: Understanding users’ need for privacy and simplicity in social networking.

• Functionality: Ensuring the app meets the core needs of photo sharing and community engagement.

• Usability: Creating an intuitive, ad-free, and engaging interface.

Tools Used:

• Wireframing: Balsamiq

• Interface Design: Sketch

• Prototyping: Flinto

• Design Implementation: Xcode (with HTML, CSS, PHP, and Swift)

User Persona

Persona Name: Jamie Lee
Age: 26
Occupation: Digital Artist
Location: New York, NY

Goals:

• Share personal projects and art with a supportive community.

• Connect with like-minded individuals.

• Maintain control over privacy without sacrificing the quality of engagement.

Pain Points:

• Frustrated with data tracking and intrusive ads on other platforms.

• Wants a straightforward, no-algorithm experience for photo sharing.

• Needs a simple, intuitive interface with no distractions.

Empathy Map

What Jamie...

• Thinks:

  • “I want a platform where I can post my photos without worrying about privacy.”

  • “It would be great if the feed was chronological, so I don't miss posts from the people I follow.”

• Says:

  • “I’m tired of being bombarded with ads every time I open my social media.”

  • “I want a platform that supports niche communities and doesn’t track me.”

  • “Social media should be about sharing and connecting, not about algorithms controlling my feed.”

• Does:

  • Shares digital artwork and photography with a niche community.

  • Spends time curating and sharing her photography on other platforms but dislikes the clutter.

  • Avoids platforms with excessive algorithm-driven content.

• Feels:

  • Excited about the idea of sharing her work in a space that values her passions.

  • Frustrated by the lack of privacy on popular social media platforms.

Design Process

1. Research & Competitive Analysis
   I began by conducting a competitive analysis of existing social networking platforms, particularly photo-sharing apps. This allowed me to identify gaps in the market, such as privacy concerns, the prevalence of ads, and the lack of user control over feed algorithms. I also studied trends in user engagement and how privacy-focused apps gained popularity.

2. Wireframing & Interface Design
   I started with wireframes using Balsamiq to outline the app’s core functionality—post creation, home feed, user profiles, and notifications. Once the wireframes were approved, I transitioned to Sketch for high-fidelity design. The interface was designed to be simple, intuitive, and familiar to users, making it easy to navigate. I focused on a minimalist aesthetic with a clear visual hierarchy to ensure a distraction-free experience.

3. Prototyping & User Testing
   Using Flinto, I created interactive prototypes to simulate the user flow and tested the interface with potential users. Feedback was gathered, particularly around the usability of the home feed, the ease of post creation, and the overall simplicity of navigation. Based on this feedback, I refined the design to make the app as intuitive and user-friendly as possible.

4. Product Management & Development Collaboration
   Throughout the project, I collaborated closely with the mobile developers and backend engineers. I managed the product lifecycle, ensuring that every design aspect aligned with the backend architecture and mobile capabilities. Working 15+ hours a day, I used my knowledge of HTML, CSS, PHP, and Swift to assist with implementing features and making adjustments during the development process.

5. Design System & Brand Guidelines
   I created and maintained a design system that included typography, color schemes, buttons, and layout components. I also developed brand guidelines that aligned with Hobbmate’s values of privacy, simplicity, and community focus. The guidelines helped ensure that all visual elements were consistent across both the app and the landing page.

User Flow

The app's user flow was designed to be as intuitive as possible, keeping in mind the app's simplicity and focus on user privacy:

1. Onboarding:
   A quick, welcoming tutorial that highlights key features like privacy, chronological feed, and community sharing.

2. Home Feed:
   A chronological feed showcasing posts from accounts the user follows, free from ads and algorithmic interference.

3. Post Sharing:
   Simple post creation, where users can share photos, add captions, and engage with comments in a hassle-free manner.

4. Profile Page:
   Users can create a personalized profile to share their interests and engage with others.

5. Notifications:
   Users are notified of new followers, likes, or comments in a non-intrusive, privacy-conscious manner.

Key Features

• Privacy-Focused: No data tracking, no third-party exposure, and complete control over what information is shared.

• Chronological Feed: An ad-free home feed that shows posts in the order they were published, giving users a natural and intuitive experience.

• Simple Interface: A clean and user-friendly interface that prioritizes ease of use and focuses on content sharing rather than distractions.

• Community Building: Encourages users to connect over shared passions without the influence of algorithms.

• Free to Use: Hobbmate is completely free, with no ads or hidden fees.

Challenges & Solutions

1. Challenge: Balancing simplicity with a feature-rich experience.
   Solution: Prioritized essential features—sharing photos, following users, and engaging with content—while avoiding extraneous distractions.

2. Challenge: Designing for Privacy
   Solution: I ensured that Hobbmate’s privacy features were clearly communicated through the UI, with features like user-controlled account settings and transparency about data collection.

3. Challenge: Ad-Free Experience
   Solution: By designing an ad-free experience, I had to focus on monetization alternatives and ensure that the platform was sustainable without the need for ads. I worked closely with the backend team to implement non-intrusive features that could generate revenue without compromising the user experience.

4. Challenge: Ensuring Seamless Integration with Backend
   Solution: I worked directly with the backend team to ensure the design was well-integrated with the database and server-side features. This involved frequent adjustments to the design to align with the mobile app’s capabilities and backend infrastructure.

5. Challenge: Maintaining Consistency Across Platforms
   Solution: By establishing a robust design system, I was able to ensure that Hobbmate maintained a consistent visual language across both mobile and web interfaces.

Final Design

The final design reflected the simplicity and privacy-focused ethos of Hobbmate:

• Minimalist Aesthetic: Clean and simple user interface with intuitive navigation.

• Ad-Free, Chronological Feed: A straightforward home feed that shows posts in order, without algorithmic interference.

• Focus on Privacy: Privacy was a core design principle, with easy-to-use settings to control personal data and transparency in all features.

Results & Impact

• User Feedback: Early testers appreciated the ad-free, chronological feed and the focus on privacy. Many users were relieved to finally have a social network that didn’t exploit their data or push irrelevant ads.

• Engagement: Users reported higher engagement due to the platform’s focus on their passions rather than algorithmic suggestions.

• Learning Outcomes: This was my first full product design experience, and I learned valuable lessons in product management, user experience, collaboration with developers, and the technicalities of design implementation.

Conclusion

Hobbmate was a significant stepping stone of my career, marking my first full-scale product design project. The experience taught me valuable lessons in user-centered design, collaborating with developers, and managing a product from concept to execution. The project also highlighted the importance of simplicity and privacy in creating meaningful user experiences.