Splitwise-Mobile app Redesign.UX/UI case study

SLIVA DAS
6 min readDec 29, 2021

Through this case study I am going to share my process of redesigning the application and how did I reach to the solutions.

What is Splitwise about?

Splitwise is an app that helps you to split your balance or expense among people or friends by different methods(Equally, by shares or by percentage, or by ratio), so that splitting of bills or amounts is made faster and easier.

Why Splitwise?

The job of redesigning the application was given to me by my product manager. I used the app tried different solutions, iterated, reiterated the solutions along with the designs, and at last concluded with one of the solutions.

Hence sharing my solutions and the reason behind my decisions.

Problem-1

  • The Onboarding screens looks all cluttered with information and illustrations, not maintaining a consistency.
  • No alter option of signup in the login screen though it looks clean but too empty.

Solution-

  • Provided a single screen to give an information guide as explaining the function and the purpose of the app.
Onboarding screens(before and after).
  • Changed the visual design for better understanding, provided an alter option of signup
Login screen (before and after)

Problem-2

  • Search option functions only when your upgraded to the pro version, does not work otherwise. No use of the feature
  • Add expense’ sounds like adding of expenditure gives a wrong meaning to the cta button.

Solution-

  • Made both(primary and the secondary)cta button centre aligned, keeping the preference clear because splitting should be the first priority, grouping can be done later as well.
  • Provided a copywrite to the buttons to give a clear understanding of the button and their actions
  • Changed the name of ‘Add expense’ to ‘start splitting’ giving a better meaning to the cta button as per the function.
  • Added Notification Feature on the homepage removing the search option to stay notified when your creating or adding someone to your group or any notification regarding the app must be notified, which shall be kept in front of you.
Home page screen

Splitting process

Problem-3

  • Not specifically mentioned whether to search by the name or the phone-no that confuses the user action. No place of adding more than one members?
  • while selecting your contacts you end up in a new page of confusion of whether to invite or add as while inviting again you have to input the phone-no. Then why to search by name at the first only??
  • Functional elements like calendar, camera at the bottom gets ignored by the user as the user eye has to be stretched too below.
  • The designing of the button went wrong. One button showcasing two multi-functionary actions confuses the user action leading to a questionable next step.
  • Description of what shall we write can’t be understood. Better copywrite should have been given
  • Few design errors. Alignment issues; Use of red and green stroke circles resemblance could not be understood; elephant illustrations for information guide not going well.
problems with the original screens

Solution-

  • Instead of writing description provided a options to choose. It is easier, faster and less use of time
  • Provided a Proper space and copywrite for Choosing and adding contacts easier just by syncing the contacts with the settings options. You can also add more contacts if you want to.
  • Introduced a toggle switch button for easier and clean way of functioning which can as well be understood easily
solution for splitting process
  • Provided an easier option to choose who spend the amount rather than putting it together
  • Provided a better copywrite so that anyone can understand what one has to pay and what is remaining.
  • Introduced a confirmation button to make sure to user the process has been completed
solution of splitting process-2

Groups

Problem-4

  • The clickable icon could not be understood.
  • Advanced setting feature might confuse the user their next action. Whether to check the settings first or save the group. Setting is an secondary option as saving being the primary one should be at the front so that user may see that easily.

Solution

  • Provided a different solution of adding members from contacts.
  • Added the setting feature at the top right corner, and Provided the save option at first for easier access of the user

Problem-5

  • Group icons looked loud
  • Difference between group and non-group expenses could not be understood
  • Filter feature beside the concluding statement instead of groups miscommunicated the action and the function.

Solution-

  • Removed the group icons for all groups, except for the present active group.
  • Differentiated the old inactive groups from active ones.
  • Added detail information of present balance if any with other group details
  • Elevated the concluding statement with the box so that the information can be easily accessible or viewed.
groups after they are created.

Grouping features

Problem-6

  • Settling up buttons gives unrealistic shadow.
  • It takes you to a new page that confuses the next action of the user as proper information is not put up in front.
  • Settle up option we see selection of players is the process-the name and the function does not serve even the same purpose

Solution-

  • Provided a new way of selecting the features.
  • Settling up features and function performed on the same page to lessen the time.Also serves the purpose of settling up.
Settle up Feature

Problem-7

  • Balance option notifies you just whether your settled up or not ,which instead should have shown the amount expenses information.

Solution-

  • Provided details for the balances as the name serves.
Balance summary feature.

Problem-8

  • Total feature shows the detailed information which gives a incomplete look
  • Unecessary need of other options within the group features making the user confuse regarding their actions whether pro or not

Solution-

  • Instead of so many options put forward three main Settle up,Balance summary and Simplify balance.
  • Simplify balance notifies you and gives another option to check ur simplified balance after all lending and splitting.
Total-Simplify Balance feature.

That its folks!

If you liked my work. Do reach out to me on Linkedln :)

--

--

SLIVA DAS

UX designer out here to solve problems with my logical ability and designing skills.Learning and experiancing the better.