top of page

BUZZY BEE

Helping busy individuals track of plans, daily/weekly tasks, view their friend's schedules, and request plans in the cutest way possible, leaving multiple different apps behind.

Buzzy Bee Web

Role:

UX/UI Designer

Duration:

Aug 2022 - Sept 2022

Type:

Tools:

Concept • Branding • Web & Mobile UX • Collaborative

  • Figma
  • FCP
  • Fire Alpaca

Overview

Buzzy Bee is a conceptual project that allows users to "bee" able to easily keep track of their schedule, tasks for the day, and see your friends availability to request plans.

Goals

1. Create a simple all-in-one-platform for planning needs without multiple apps

2. Implement a social aspect to encourage, help with accountability, and scheduling plans.

3. Establish a familiar interface for a seamless and easy on boarding experience.

​

Defining, Emphasizing, and Surveying

Defining, Ideating, and creating low fidelity wireframes

Creating sticker sheets and refining to a high fidelity prototype

Testing phase, iterations, and creating a desktop version 

Final testing, final iterations, and reflection

WEEK 1

WEEK 2

WEEK 3

WEEK 4-5

WEEK 6

timeline

target audience

Our target audience were users with busy schedules. However, since the audience was too broad to study a defined set of characteristic, we narrowed the focus to "college students", which we had easy access for testing.

An initial survey was sent out to 13 college students and some of the common characteristics were:

- Integration with other people's calendars

- Option to create simple tasks but also detailed tasks as well

- Easy organization and navigation throughout the app

Competitive Analysis

In next step, we took a look into products that already existed. For our analysis, we studied Notion, Google Calendar, Todoist, and Microsoft Teams. We compiled their unique values, positives, negatives, and how can we implement these.

You can view the analysis chart here.

We also took a look into Habitica and Taskade for more app focused inspiration on creating a more rewarding and fun experience.

User Persona

PRIMARY

Screen Shot 2023-01-30 at 2.06_edited.jpg

Name: Jenny J.

Age: 21

Occupation: Student

Jenny Ji is a full-time undergrad student studying accounting at UCLA. Even though Jenny is a student, she also has a part time internship and works at a bakery on weekends. As a user who has many different apps, she wants to have one designated app for all her planning so that I don’t have to go back and forth. She needs an app that helps her visually see an overview of how busy her schedule is.

SECONDARY

Screen Shot 2023-01-30 at 2.06.33 PM.png

Name: Steve F.

Age: 30

Occupation: Federal employee

Steve Folger is full-time federal employee at the local city hall. When he’s not working, he enjoys spending time with friends and family. As a professional, he wants a convenient scheduling app that allows that allows him arrange tasks/events efficiently with his fellow colleagues and share his schedule with his friends to figure out available leisure time to grab drinks and catch up.

Information Architecture

With the support of the analysis on competitors and the simple survey, we got the general sense on what features and pages are needed for the concept. An information architecture was curated and later discussed which features were vital for the design. 

Paper & digital wireframes

Crazy 8's was practiced for each main screen and explained to each other. We elaborated on which features and layout we liked from each sketch. 

IMG_3475.JPG

Using the features and layouts we agreed upon and discussed from our Crazy Eight sketches, we compiled final sketches of how the layout of each main screen would roughly look like.

With the rough sketches of each main frame and references from the IA, the low fidelity screens were split. Sabrina focused on the calendar and tasks portion, whereas I worked on the social and settings aspect. With further elaboration, we discussed what each item were, how navigation would work, and what screens needed to be added. 

Visual design

Fonts, etc.png

Hi-Fi Wireframes & Prototyping

Using our established design system and agreed upon layout margins, we started working on our respective wireframes to high fidelity prototypes. Upon completion, we reviewed each other's works to ensure we met our challenge solutions and tested out each screen thoroughly together before sending our design to participants.

​

1. Create a simple all-in-one-platform for planning needs without multiple apps

​

From being able to create a simple cross-off to-do list to planning an event to full detail, we created 2 different pages for this. With the functionality of being able to see your friend's calendars and schedule plans in a few seconds, it's now possible to do everything in a single place.

2. Implementation of a social aspect to encourage, help with accountability, and scheduling plans.

​

Instead of having an app just for your plans, having the possibility of your friends viewing your profile could easily help with accountability. A quick way to encourage your friend would be as easy as sending them a quick "buzz" or message. 

3. Establish a familiar interface for a seamless and easy on boarding experience.

​

The familiar experience of blocking was inspired by Google Calendar, which is one of the most widely used scheduling app. With the combination of blocking and keeping the simplicity of a generalized cross-off "to-do" list, majority of users could find more ease with Buzzy Bee.

INSIGHTS AND ITERATIONS

With 10 participants, an unmoderated usability study was conducted. Users were given prompts and asked KPI scaled questions for each task in order to evaluate how easy and useful each task was.

1. FONT WAS TOO DISTRACTING

4/10 users found that 2 different fonts were distracting and in-cohesive. On the topic of in-cohesion, it was also noted that users did not realize the middle button of the navigation bar was click-able and that it lead to their daily task checklist.

TUTORIAL

Majority stated that the tutorial in the beginning did not serve to help navigate through the app but rather just a summary of what Buzzy Bee was. Following that, many seemed to have had difficulty to complete given tasks and suggested a small guide would be a good addition.

​

With Final Cut, a 90 second tutorial was created as a quick solution.

Video is unable to load properly on web.

​

If you wish to view,

please click here to open a new window that

will direct you to the YouTube video.

​

Sorry for any inconveniences.

Given more time, instead of a video tutorial, we would've loved to implement a skippable guide where our mascot would explain each feature through the app after the on-boarding process of creating a new account.

Website

While referencing our mobile design, we moved on to creating low fidelity for a website version. After agreeing with the general rough outline, we quickly moved onto adding visual details for a high fidelity version. For this, my partner and I had switched responsibilities and she worked on the friends, notification, and settings aspects while I took screens focusing on tasks, calendar, and availability. 

Frame 10074 (1).png
Settings Lo to Hi

For a more legitimate experience, a landing page was also created which leads to a sign in/sign up page.

2nd Usability Study

A second unmoderated usability study was conducted with a selected few from the previous study. 

All 5 participants found the tutorial useful and found the length just right. The most important feedback to note was that 3 users mentioned the inconsistency of web version. Half of the pages looked exactly like the app but on a larger scale and the other half did not look like the app. 

After reflecting and revisiting the desktop design, it was apparent that my partner and I fell short on communication towards this. She went for familiarity and kept most designs the same so users who use the app will be familiar with the website, while I went for feature expansion because the screen size was bigger where there was no longer a need to condense information so the web version made sense to make some pages look a bit different. 

Summary and Takeaway

As a person who loves to bullet journal, Buzzy Bee was an idea of great interest. Having the opportunity to work with another UX designer who also loves organizing was interesting. During the process, I learned that we were accustomed to different methods of planning and had different design features in mind. Compromising and understanding each other's point of view was a challenge. Nether less by putting bias aside, eventually we were able to compromise as well gain a new perspective on design proposals through discussion and refine those ideas with testing.

​

Through the study, the greatest takeaway was that although establishing familiarity and having inspiration from competitors is helpful, users converting to a new product is difficult especially when there's already an existing product. Majority of users loved how easy Buzzy Bee was to use because it reminded them of google calendar, but the same majority would only either download for the cute interface or not have used the product at all, if it existed, because they already use google calendar.

That brings me to think about the fine line that makes a great design. One where familiarity is established and users enjoy a product because there is no learning curve, making it easy to use. The other being a unique perspective which sets apart your product and entices users to use it because they really like it and there's none like it elsewhere.

​

Given more time, a responsive design for a tablet size would be added. With more resources and testing, I would love to find out more about user pain points when using planning apps and convert those into ideas that could set Buzzy Bee distinctly apart from competitors other than UI.

bottom of page