Inspiration

Due to the pandemic, I noticed that a lot of people had more time on their hands and looked to start new hobbies. Many sought to organize their schedules and relax, leading to the rise in popularity of the bullet journal.

I’ve always been an avid agenda and diary user. My sister bullet journals frequently and I love the concept and the way it combines art + doodling with a diary and planner. However, I don’t have the time or patience to track my stuff well.

For me and a lot of others, journaling helps us feel like we are in control of our lives. It gives us a creative outlet to express and organize our thoughts. With something like BUJO, this could be a lot more accessible for more people.

What it does

BUJO is the short form for bullet journal. The app it acts as a drag and drop builder for a digital bullet journal, with a handful of cool non-bujo features integrated (ex. exercise analytics, monthly review).

Some of my favourite features from the apps Spotify and Goodreads are the end of year review. They feel like a little present where you can learn more about yourself and routines. I took these user centric features that people love to share, and tried to incorporate it into the BUJO. Why have one present when you can have 12?

How we built it

Figma was used for everything from logo design to mockups. I tried to use Premiere Pro to edit and Google Slides was used for the Pitch Deck.

Design Process: Emphasize- I asked friends and family who use a bullet journal. I learned their motivations, reasoning, and their favourite bujo features.

Defining the problem- I researched on the industry and competitors- what would make BUJO stand out? I found out that there is a gap for a dedicated bullet journal builder and sought to fill it with my prototype. In this stage, I performed competitor analysis and evaluations using the LEMER's method, coming away with key takeaways and features. I found that there is not enough customizability (that is bullet journal centric) in existing apps and few of the listed solutions are actually dedicated to bullet journaling.

Ideate- I listed down features that I wanted to include which were brought up from user interviews, or that were brainstormed.

Prototype- In this stage, I created paper, mid-fi wireframes, and a hi-fi prototype. When asking myself questions in test, I ended up sparking new ideas and was brought back to ideate and prototype.

Test- I asked users to perform usability testing and the general consensus was positive. They felt the app was useful and something they would try. Negative feedback was on how crowded the home screen is and how the colors might attract a younger audience. Outside of interviews I tested for contrast and readability using plugins and accessibility guidelines.

Challenges we ran into

I had a lot of trouble with the video because my weak computer was overheating. It also didn't help that it was 2 AM and I was working alone.

Accomplishments that we're proud of

I really experimented with the user interface and went out of my design comfort zone. I've never designed anything like this and the whole design system took me a very long time. I wanted to make it fun and retro so that it would cheer up your day when you saw it.

What we learned

I learned how to make mockups in Figma and how to use the autoflow tool. I also discovered assets & components while trying to organize my information architecture.

What's next for BUJO

Due to the lack of brain power I had after brainstorming and sheer number of components I made, I ran out of time to create the intended features in hi-fi prototype, missing out on the important packaged months and photos (see mid-fi).

Although I made BUJO as a desktop app, it would very very fun as an offline mobile app- I can see people using this on their commute, or their couch. It would be relaxing and convenient, like a pocket journal bursting with colors and memories.

*note, when trying the prototype, you may need to press r to restart if you missed the loading screen animation (it goes very quickly)

Built With

  • figma
  • love
  • premierepro
Share this project:

Updates