UX/UI Design Internship - Mobile App Design

 
ROLE

UX / UI Design Intern

DURATION

3 months (June - August 2019)

DELIVERABLES

By the end of this internship, I had produced the following deliverables:

  • Competitive Analyses 

  • Design Recommendations reported to CEO

  • Designed Flows, Interfaces using Adobe XD

Overview

For my summer in 2019, I worked at Hummingbiird, a startup mobile app company that provides affordable everyday services to college students. By the end of my internship, I produced competitive analyses, presented design recommendations to the CEO, created compelling graphic interfaces following brand guidelines and standards, designed user flows, and generated high-fidelity mockups in an agile development environment. Currently, some of my designs are released on the mobile app.

Project 1: Referrals 

One of the company's current goals is to recruit new users through current users referring and sharing Hummingbiird with friends and family. My role was designing flows and UI that would encourage user interactions.

To create a seamless referral experience for mobile users, I researched other popular mobile app referral programs (Airbnb, Lime Bike, Uber). After discussing findings with the CEO, we decided to place the referral feature at 3 different places on the app to maximize user interaction and engagement. We also wanted to test out how effective are the placements of the features, which can be evaluated by user clicks. 

 

Design Requirements

-  Make it easy to see with few taps on the touchscreen
-  Reduce unnecessary friction for Native Sharing

-  Present engaging visuals to attract users

1. Popup After Service Requested Confirmation Page 

After the user requests a service, I designed a popup page (Heads Up!) that offers the user to invite friends. Users will be directed to the native sharing page after clicking on "Invite Now", and will be able to send a text message with a link to download the app. 

Below is a video illustrating the interaction when the user chooses to invite friends later instead, which would direct back to the home page.

2. Inbox Page

Inbox page is a great place to implement the referral message because it is high-level in the information hierarchy. Users can easily access the inbox page from the tab bar at the bottom of the screen.

This referral feature is now live on the mobile App!

3. User Profile Page

From the profile page which can be accessed by the profile tab, users can click on Free Gifts and copy the promo link in a message to share the app with friends.

Additional Designs

In addition to designing the above referrals, I also brainstormed other ways to encourage user sharing. Below is an interaction for after a completed job and reviewing the worker. If the worker is rated 4 or 5 stars, the app would offer the user to recommend this worker to friends, which would motivate non-users to download the app to view the worker. This would not only bring more guests to Hummingbiird, but also potentially increase the number of the worker's customers. 

Project 2: Redesigning the Profile Page

Current Worker Profile 

My second project was to improve the worker profile page. The current worker profile (on the left) lacks important information. The organization of the page contents needs to be improved as well to help users find the information they need efficiently and encourage user interactions with this page.

Design Goals

- Better organization of features

- More engaging visuals and interface

- Bring out/highlight important information

My Redesign

My redesigned profile page has 5 new features:

 

Favorite 

Click the star to save workers who are great at their job, and create easy access to request them again!

Average Service Time 

To give customers a better idea of the length of the job, which is directly related to the final cost, I have the CEO approve an average service time feature that averages previous job durations.

Location 

See where the worker is based at (general location) so buyers know whether the worker is close by.

Availability 

See when the worker is available and book a service on the same day. This would improve matching between workers and customers, therefore increase transactions.  

Tools and Materials

What will the worker bring? Does the buyer have to provide anything? The Tools and Materials section answers the question.

My redesign puts forward the information that customers care about the most, which are rates, work duration, location, and availability. Having these at the top of the page would improve the efficiency in finding the right worker.  The Tools and Materials section adds transparency and helps both the workers and customers know what to expect, ensuring a smooth process overall.  

Additional UI Designs

In addition to the above projects, I also designed the following screens. Some were requested by the CEO while others were ideas that I generated outside of work. 

As requested by the CEO, I was in charge of designing the sub sections for Moving Help. Icons are attractive and easy to distinguish the two categories .

I brainstormed a new feature - narrowing down search results based on availability (date and time).

I redesigned the search results page - The background color can be personalized by the worker. With the different colors, it helps us to see workers as unique, personable individuals.