Overview & My Role

The client is a technology company that is seeking to build a solution that leverages their Design System and addresses three questions:

1. How does one split a check unevenly?

2. How does the app handle splitting bills into foreign currency?

3. How does one split a check with individuals who do not have the app?

Smart Split was created as an ‘all-in-one’ solution to help large groups coordinate and simplify uneven payments, convert foreign transactions, and reduce the need for multiple apps to ease the payer's burden.

As the only designer with only a week to accomplish this challenge, I spent my time conducting research, creating storyboards, wireframes, and a functioning prototype that illustrates a solution to the client and their audience.

Project Overview & Timeline

• Skills: User Research, Persona building, White-boarding, Affinity Diagram, Storyboarding, User Journey, Wire-framing, Rapid Prototyping

• Time: 1 week

• Project Type: Design Challenge

• Tools: Adobe XD, FigJam

Understanding the Problem

Additional Research Needed:

Along with the client’s questions, we are also given more information about who their target audience is:

• The target audience is aged 18-34 who are technologically inclined

• Individuals typically are middle class, making 70k+ a year

• The most common use case is splitting checks at restaurants

Based on the limited information we were given about our target audience, I wanted to dive deeper and understand their motivations, habits, and goals better. A user survey was conducted with 12 short-answer, situational, or multiple-choice questions and given to users on social media who meet the criteria. We defined a large group as having 6+ people.

• Sample questions:

  • Your group decides to split the check evenly, how do you prefer to split a check? (together vs. separate)

  • What are some pain points you face when trying to split a check among a large group of people?

  • When you need to split a check unevenly with a large group of people, how would you do it?

  • You decide to cover the bill and have everyone else pay you back, but some of your friends don’t have the same payment method, how would you do it?

  • How would you go about splitting bills in a foreign country?

Identifying the Problem 

After 24 hours, I managed to get 47 responses. All survey responses were documented and organized into categories using an Affinity Diagram. 

Summary of responses: 

• Those who prefer paying the check as a table find this method fast and convenient when processing payments as everyone can use an app to send money to the person footing the bill. It is also considerate to servers as it makes their job easier, and minimizes error.

• In context to the client’s needs, the larger the group is, the harder it is to coordinate and split the bill unevenly. Our survey shows that almost half (42.6%) of our audience find it inconvenient when someone doesn’t have the same payment method.

• We discovered that the person footing the bill has a much bigger responsibility as they are responsible for calculations and ensuring everyone has paid their portion.

• When it comes to foreign transactions, many would have to use a separate app to figure out how much they owe in USD, or just carry cash. 

• We need to create a quick, easy, and seamless solution that allows large groups to divide and send money unevenly to the payer, while also supporting foreign transactions and accommodating users without the same app.

Solving the Problem

Defining Priorities & User Journey 

We developed Tyler, a user persona that visually represents our findings from the research phase. Having a user persona helps clients relate to their audience on a deeper level.

About Tyler:

We performed an ‘I Like, I Wish, What If’ exercise and chose a few sticky notes (in red) to prioritize. 

In addition, a storyboard was also created to illustrate the user journey of unevenly splitting a bill, converting a foreign bill, and inviting someone without the same app to pay without needing to download a new one.

Summary of storyboard:

From this stage, we decided to name our solution ‘Smart Split’, an all-in-one product that helps large groups coordinate and simplify uneven payments, convert foreign transactions when needed, and invites individuals who don’t have the same payment method to settle bills.

Visualizing Smart Split

Using Adobe XD, we spent the last few days bringing Smart Split to life from drafting wireframes and low-fidelity mockups to creating high-fidelity mockups leveraging the client’s design system.

Once interactions were added to our mockups, a working prototype of Smart Split was created to demonstrate the main features and workflows to solve the client's questions.

There are some prerequisites or conditions to keep in mind while going through these workflows as Tyler:

• Most people at the table have already downloaded Smart Split beforehand.

• The table has mutually agreed that Tyler would cover the bill and everyone else would pay him back.

• The bill is in Canadian dollar (CAD), but the table wants to pay Tyler back in USD to avoid transaction fees. 

Walkthrough of Prototype

(videos of workflow)

1. Scanning a receipt and assigning it to a group

2. Inviting a Friend who doesn’t have the app

3. How to split a bill unevenly

4. Converting the bill

5. Submission

Takeaways & Future Opportunities

Overall, splitting a bill using money-transferring apps is the preferred method as it is a fast and convenient way to pay for both customers and staff involved. However, the process can get complicated especially when it involves large parties. There will be cases where splitting a bill unevenly is necessary due to some spending more than others. Foreign transactions and individuals who pay using different methods can add more complexity to the situation. Taking these factors into consideration, this can cause a lot of stress to groups and especially to the person footing the bill as they have to do calculations and ensure everyone is paying for their portion.

With the creation of Smart Split, we hope it alleviates these pain points as it can automatically calculate how much everyone owes and invites people to pay their portion of the bill without having to download the app. It is also able to convert foreign bills to the party’s desired currency, making it an essential tool to use when traveling and dealing with foreign transactions.

If given the time and opportunity to revisit Smart Split, I would love to conduct usability testing to see whether the workflows for these tasks (creating transaction, splitting bill, currency feature, etc.) are intuitive and obtain feedback. On a larger scale, I could also see Smart Split be used to benefit businesses. Instead of having servers give you a paper bill and handing your card to them to pay, I can see Smart Split making that process quick and easy by letting customers receive and pay their bill using an app. 

Full Prototype

Prototype link