BeeOnTime

• 

  BeeOnTime Splash Page

• 

  BeeOnTime Logo, Mascot, and Badge Illustrations

Inspiration

While a majority of our inspiration for the app’s function came from the research conducted about Aggie House’s current schedule management systems, we referenced time management programs and other apps to formulate an effective user interface. More specifically, the Dutch Bros app’s badge rewards inspired the function of our gamification system and Notion’s simplistic UI influenced our minimalist layout.

For the graphics included in BeeOnTime, we were inspired by the minimalist illustrations of characters and flowers by Filipino artist, Blok Magnaye, to match the simple and modern look of our app layout. Each badge illustration references common flora and fauna, as well as a few badges taking inspiration from microscopic images of pollen.

What it does

BeeOnTime aids volunteers with timekeeping, scheduling shifts, and sending shift reminders, as well as inspiring motivation with a badge-earning system.

How we built it

Research: At the Aggie House sponsor booth, we met with Resident Co-President Virginia Moore, discussing the scheduling systems and resources volunteers use. Currently, the organization uses two Google Forms and a Google Sheets calendar to keep track of volunteer attendance, shift schedules, and tasks completed during each shift, as well as Discord, a website, and a Google Drive for shift swapping, contact information, and any volunteer instructions. Additionally, we conducted a competition analysis with Trojan Shelter’s website, a sister shelter to Aggie House, which also uses the same Google Form-based scheduling format.

When checking in to the first Google form, volunteers are asked basic identification information and reminded to complete shift tasks. When checking out with the second form, volunteers are again asked for identifying information, the chores completed, what supplies are in need of restocking, and any resident or volunteer questions/concerns/comments.

Separate from these check-in forms, the Google Sheet contains the master calendar of volunteer shifts, ordered by week over the quarter. Each shift goes from 7 PM to 8:30 AM with the two scheduled volunteers listed, as well as a space for back-up volunteers to list their name. Interview

Going forward, we decided to interview Olivia Hurley, a previous Aggie House volunteer, to gain more insight into what assets would be most helpful for volunteers to readily access. In our conversation, we learned that volunteers complete around 5-6 shifts each quarter and may leave early from their designated shift time.

To further optimize our app’s function, we created a fictional user persona based on Hurley’s experience volunteering with Aggie House. This persona let us explore the perspective of Aggie House volunteers and flesh out the user interaction with the different app assets, as well as forming a story to guide us through the app demo.

Ideation: Upon finishing our research, we decided the best solution to Aggie House’s prompt is an app that centralizes volunteer shift management systems, sends out automatic shift reminders to volunteers, and uses gamification elements like badges based on volunteer hours. With this app, volunteers would be able to manage their schedules more efficiently, be kept accountable for clocking in and remembering their shifts, and be encouraged to continue volunteering with Aggie House.

Final Design Process/Implementation: At the start of our design process, we first wireframed a sitemap draft on a whiteboard and then created the official sitemap for volunteers on Figma. Based on the views, we ideated a color palette and style guide for the entire app, settling on a design direction based on worker bees and hives.

From here we created lo-fi paper sketches of the volunteer view based on the site map, drawing out the main features and notifications. Using the sketches, we then created mid-fi iterations on Figma and continued to refine the volunteer view. While working on the different site views, we used Illustrator to make a vector logo and illustrations for the characters and badges. Next, we proceeded with elevating our mid-fi iterations into a hi-fi prototype: editing text size, switching layouts, and fine-tuning the visual rhetoric of the app. To finalize our prototype, we added moving animations and interactive software from Figma, rendering it into full functionality.

Challenges we ran into

One of the main challenges that we faced was the time constraint of the sprint, it specifically effected the number of pages we wanted to implement in the final design. Other smaller challenges we ran into was figuring out the current systems Aggie House was using for their volunteers, cutting down the amount of views we had initially thought of in our ideation, and adding in animations to our final prototype, all of which we were able to work out within our design process.

Accomplishments that we're proud of

We believe that we were responsible with the limited amount of time that we had, effectively splitting up the work between the team. We're proud of our overall communication and drive to ideate, create, prototype, research, and design that helped us complete our goal for this project. The gamification system and the UI implemented for our project were especially our biggest accomplishments throughout the project.

What we learned

We learned how to manage our time throughout a 24-hour design sprint and how to add gamification elements into a time management app. The prototyping and moving effects were also skills we honed in on throughout the process of creating this project.

What's next for Bee On Time

Past the 24-hour design sprint, our next steps would be to expand upon volunteer facets and add features for Aggie House’s residents and staff. Our main ideas for future add-ons would be:

• Additional limited-edition holiday badges to encourage volunteers to pick up shifts during holiday breaks when volunteering is low.
• An option for residents to sign in and access their Aggie House resources, check the volunteer schedule, request any basic needs, check-in for dinner, and track their attendance.
• Creating the admin app view for staff to manage volunteer schedules, send out mass notifications, be notified when a volunteer no-shows, and access a master list of volunteer contact information.

Since Aggie House is part of a larger network of shelters under Student Mojo, we’re also considering expanding the app to be used by other sister shelters. Even now, the app’s function could be utilized by other volunteer-based communities to improve time-keeping, shift scheduling, and volunteer encouragement.

Built With

• adobe-illustrator
• figma
• notion