BuddyUp

Running App

Context

During the summer of 2022, I worked as a UI/UX intern in BuddyUp. BuddyUp is a match making app for runners, it helps local runners to connect and partner up in running activities as some may feel comfortable having a running partner. During my internship I was working under the supervision of Ellis, a talented designer who guided and advised me throughout the project. My tasks throughout the internship included

Due to company policy, I won't be showing the concepts of BuddyUp 3.0

Flow Chart

In order to create efficient workflow and plan which screens would be designed which day, to meet my deadline, I had to create a flow chart of BuddyUp v3.0. The flow chart not only helped me plan out my design schedule, but also helped me create an efficient app by removing unnecessary screens and adding new screens that would improve user accessibility. An example of this would be adding screens that inform the user after completing an action, such as saving new settings or leaving a group chat.

Onboarding Redesign

One of the most dominant part of my internship was redesigning their current onboarding. The onboarding is one of the crucial parts of an app/service as it can drive away new users if the process is long, confusing or frustrating. Therefore, every screen and its purpose has been decided carefully.

As one of the main objectives of an onboarding is to set up the user in order to start using the app/service, I discussed with my supervisors and suggested that we remove certain requirements to ensure the user can start using the app as quick as possible. Reason being, humans have become less and less patient with the development of technology and automation, a long onboarding with screens that may require a user to think hard or require information that will take a long time to input, can promote procrastination or worse result in deletion of the app out of impatience.

Upon approval, I removed information that is not essential for the algorithm but enabled pop ups during the usage of the app to persuade users to provide the optional information to increase the chances of matching with someone.

Progress Bars

In addition to that I added progress bars which are divided into three sections and icons to suggest what those sections may require. This can help the user estimate how long it may take them to complete the onboarding process.

Granted, the progress bars can be a little misleading considering it is three bars but each bar contains secret sections as it does not fill up all the way after completing one screen. However, this was done considering the onboarding process requires a lot of information and if each screen were to represent one bar, it would have 9 bars all together which might intimidate the user into thinking it will take a long time.

Spread Information

Another change I made was spreading the information. In the previous version of the app, some onboarding screens had, a single scrollable screen filled with many questions to answer from drop down menu or typing, this can sway away the user, as it may seem daunting or almost like filling up a form. As mentioned before, I removed information that was not essential to the algorithm and allowed each essential question to have its own screen, while making it into multiple choice questions and making them more visual. This helped the process look more user friendly as well as faster to sign up.

For questions like “How fast can you run?” I added suggestions for users as new runners may not know their speed or stats.

End Result

o top it off, I gave a visual overhaul, adding more contrast in the app, increasing size of interactive elements and including more of BuddyUp branding within the app for users to subconsciously familiarise with the brand. This gave the onboarding process a contemporary look as well as a look that represents BuddyUp as a sporty brand.

B2B Concept Design

As my superiors were discussing the idea of collaborating with other companies in a B2B manner. While most ideas were already in the table, I suggested we create custom employee profiles for the collaborating business, along with a little gamification.

That would mean implementing features of monthly running competitions, running leaderboards and stats comparisons, which would not only promote running as employees would feel more competitive but also give the company more reason to collaborate with us. Happy to say, my superiors praised my idea and decided to go forward with it.

Design Conversion

One of my first design tasks was to convert a Figma design into Adobe XD which is the software we would be using throughout this project. I manually designed the screens I was assigned to design while making small tweaks in colour, font weight and icons. Which added a good contrast throughout the app as well as Improve overall hierarchy.