We were tasked with creating a mobile application for users to learn new hobbies or skills from each other in fun ways. Our goal was to create an engaging, intuitive experience that will allow the user to focus on learning new hobbies rather than learning to use the interface. Whether users are new to their hobby or experienced and looking to further their knowledge or share their talents, this interface will allow them to engage with others, learn, and find new hobbies. 

Hobbees

Overview

The Challenge

Key Skills & Lessons

My Role

At a Glance

A solo interface design project focused on investigating how to design an app for this concept from scratch. I was not tasked with conducting user research due to the scope and timeline of the project.

To create a mobile application for a concept called Hobbees, where users can learn different hobbies from each other on a fun, inviting platform.

Moodboard, Color Theory, Product Flow, Wire-framing, Icon Design and Branding, Visual Design, Interactive Prototyping

Moodboard

The goal of the Hobbees app is to inspire users and get them excited about learning in a community based environment. The use of various bright colors creates an inviting and fun look and feel. Colorful shapes, elements, and doodles add to the playfulness and makes the social experience more engaging. We believe that distinctive branding is necessary to set Hobbees apart from other video sharing platforms with live capabilities (Instagram, YouTube, TikTok.)

Design

Product Flow

Initial Wireframes

 Allows users to connect with a smaller community and see when their next class will be. Users can message in the chat, view photos that other users have sent or shared.

Introduces the visual motifs that are carried throughout the app, such as hexagons and playful colors, and inspiration from bees, since they fit with the Hobbees brand and logo.

After login, the home page provides access to classes and hobbees, recommended hobbees, notifications, profile, a browse page, their schedule, or their messages.

The chat can also be expanded on this page to encourage and enhance communication with other members within specific classes and groups.

In the initial wireframes we began incorporating the hexagonal logo, inspired by the bee branding, and laying out the functionality of the application. We began experimenting with horizontal scrollability of the hexagonal classes and hobbees and the vertical scrollability of the chat.

Login

Home

Depiction of what the screen looks like as the chat gets pushed up the groups get hidden from view.


Users can see all courses in a related hobbee. Users can swipe up to chat with all other quilters, so they can connect with or get help from others.


Browsing allows users to see their subscriptions, grouped by hobbees, as well as what classes, hobbees, and streams are trending.

The default class view, users can no longer access the navigation bar to focus more on the course. Users are able to change video and audio settings.


The sharer profile allows users to add a friend or message , whether or not they are in the class, and it also advertises upcoming classes, and access to recordings of past classes.


Shows what happens when users make the sharer full screen, which may make it easier to see whatever the sharer is demonstrating or doing. 


 


Browse

Hobbee

Hobbee Chat

Class Overview

Class Chat

Profile

Live Class

Expanded View

Icons and Branding