2022

Redesigning a new, intuitive, multi-search for Cashbook App (YC W21)

Cashbook App is a Y Combinator backed app digitising business record-keeping, ledgering and financial management for small and medium businessmen and enterprises in India. It is designed for Indian business owners, offering role based access control system, a PPI enabled expense supported by unique UPI handles for each business employee.

About

MY ROLE

Lead Designer

TEAM

Product Design Lead
Engineering Team

Growth and Data Team

TIMELINE

10 Weeks

Feb-April 2022

INTRODUCTION

In 2022, we shipped an updated, more intuitive search experience for Cashbook users. Search and filters was used within business "books" where daily business ledgering occurred. This involved

  • a deep dive into our users search behaviour, while addressing the unique nuances of their specific patterns of search and filters usage

  • looking at major painpoints across user's search and filter journey within the app.

IMPACT

Impact across a 3 month period

In 3 months, we saw an demonstrable impact and adoption in search and filters. Both were accounted at a 5% MAU growth.


  • Searches :

    Increase from 5000 daily unique searches to 300K daily unique searches


  • Filters :

    Increase from 9000 weekly unique applied filters to 280K weekly applied filters

Locate your transactions in a more helpful, intuitive way from your business ledger books

PROBLEM STATEMENT

Users clicked on filters more than search, they eventually used search more than filters. Therefore, filter was discoverable, but search was more useful. How might we make search a more cordial, useful feature while also solving for easily adoptable filters.

BREAKDOWN OF THE PROBLEM

🔗 Dis-harmony between search and filter usage

Users are more familiar with search experience than with using filters

🔕 Lack of system status feedback

Improper accounting for user behaviour errors and edge cases

💡 Limited discovery of advanced filter options

Search and filters be leveraged to educate/inform users of advanced features

UX OBJECTIVES - SUMMARY

Simplifying our UX objectives to define our design process goalposts

Basis initial outlining of the problem, the following user experience goals were outlined

  • Hygiene fixes for search and filter

  • Increase filter function discoverability and usage

  • Provide useful system status feedback to the user during the process

  • Utilise the search and filter tools to educate users about other advanced features to generate results

USER'S SEARCH + FILTER JOURNEY WITHIN THE APP

Anatomy of an entry

This information becomes relevant for search later on in this case study. These entries exist within a "Cashbook".

  • A Cashbook is a record or digital ledger made up of the transactions

  • Both the Search and Filter allows the user to locate or filter out specific or types of transactions from their cashbooks

  • Users can also download filtered out cashbook entries to share, organise or peruse their information later.

WEIGHING IN ON THE DIFFERENCES

🔎 Search

Pro :

  • Provides exact information

  • Can power filters through hyper-specialised search

Cons :

  • Non persistent user has to search the term each time they want to look up that information

  • Can only search amongst remarks attached to a transaction

🗂️ Filters

Pro :

  • Fetches transactions on the basis of entry types or sort by time

  • Is persistent, unless cleared

  • Can power search, can be grouped together

Cons :

  • Hidden and persistent, can hamper information fetch if applied and forgotten

What could be improved?

EXISTING DATA

I observed user data which I could access from Clevertap and Mixpanel to validate our user concerns properly. This data was from a period of December 2021 to March 2022.

1.03M

times filter icon was tapped

753.6K

times filter was applied

866.1K

focused search was applied

5K

focused search was applied daily

9K

filters applied weekly

USER RESEARCH

Search and Filters forms the backbone of a product which consolidates information. To understand better how users viewed and used this tool, I called Cashbook users and talked about their unique search habits. They also echoed some already existing issues I had identified with the older search and filter experience during a quick heuristic evaluation of the tool.

Search

"Sometimes I only remember the amount of entry. My staff also uses remarks and does not tag the entries using categories, or payment, etc because they do not know about these filters.

Search

"I have to type out the exact word or I will not get the proper result. I also don't know if my results are accurate enough because nothing is highlighted in the book."

Filter

"I don't understand what is All Time."

"If I apply filters, I should at least know what is applied and when."

Filter

"I am familiar with Search. But if I only remember an amount or phone number of a transaction and not the tags or remarks, I cannot locate or search the transaction again."

Filter

"I don't use filters because I don't know we have filters or what it does".

"I find that filters are not accessible, I have to tap many times to apply filter and to also see the applied filters."

Search + Filter

"I can use Search to customise my results by adding whatever I want in the remarks. Even though I cannot search by amount yet. I don't use filters because it is a lot of effort to apply them. Instead, I use Search as it does the same thing."

DESIGN EVOLUTION THROUGH EMPATHY MAPPING

What does a user think, feel and do during the process of using search and/or applying filters within their Cashbook?

I created two empathy maps for Search and Filter, and used a How Might We structure to chalk out initial ideas. This helped me identify themes in UX principles that I considered non-negotiable for this redesign.

DESIGN EXPLORATIONS

Designing the best solution for this problem

I came up with many concepts in the earlier of design explorations. Some of the ideas did translate into solid concepts that landed in the final hi-fidelity version.

USABILITY TESTING

Rapid testing and iterating using Think Aloud Walkthrough method

10 Sessions

Conducted usability testing with a hi-fidelity prototype of the app online via Google Meets/Zoom

08 Participants

Tested with small businesses like shop owners and medium businesses

60-90 Mins/Session

Participants were given a task to complete and think aloud during the task

At the penultimate stage of the design sprint, the team conducted a usability testing with our users from diverse businesses and backgrounds. We tested the first version of the final design flow with 8 users via Google Meets by using the Think Aloud Walkthrough method.

Here's how we prepared for the usability testing


  • Determined the cohort for the testing : We had volunteer testers from small enterprises, bigger businesses, and individual business owners.

  • Defined the task list : We broke the flow into tasks and asked our users to complete each one of them and speak out aloud as they worked through the tasks. We helped them out in case the copy was unclear or required localized translation (while also noting it down as a feedback).

  • Consolidated the findings : I divided each task into micro-tasks of up to6 steps by me, and I evaluated any blockages, dependencies, confusion or feedback of all the micro-steps.

  • Iterated on the learnings : I designed basis the feedback of the usability testing and readied the file for engineering handover.

1

Search an item as usual

2

Use advanced search tabs

3

Use time filter to find transactions

4

Apply a filter from the new panel

5

Apply filters and search together

Findings of the testing


  • Users found the new filter tray easily detectable and usable.

  • Users found the new layout change was a big overhaul for them

  • Users could require some initial hand-holding to build enough muscle memory for this change.

  • We created the first prototype with Amount, Category, Payment Mode and Members. This confused the users. In the final handover we went ahead with only Search and Amount in advanced search.

  • All the testers could locate and use the basic and advanced search easily. They liked that they could now search among Remarks and Amount too.

FINAL DESIGNS

Perfecting the new search and filter experience

SEARCH

Applying advanced Search

  • Search now supported alpha-numeric terms. Users could now search within the three categories of All, Remarks and Amount. 

  • We highlighted the searched term in yellow so the user has feedback about the searched term whether it happens on the remark or amount side. 

FILTERS

Filters were accessible and a tap away

  • Updated filter icon to a variation which was used requently across similar app and therefore easily recognisable for our users.

  • The user could now sort/filter results upfront from a single tap right on the book page and apply them. 

  • If they would like to go through all the filters, simply clicking on the filter icon will take them to the bottom sheet with all filters.

SEARCH + FILTERS

Recent search and filters

  • Recent search screen was added so the user will not have to look up for a term again and again. 

  • We also made filter tabs accessible from this screen.

  • This enabled the user to search within applied filters

EDGE STATE

Reducing user anxiety when results are not found

  • Major change was including a redirection from the error state by showing the nearest resembling item to the user. Here, "Ghar" is misspelt as "Khar" but we are able to identify the similarities and redirect the user accordingly.

  • We provided handholding by using a call-out to show the new update on the search screen.

Scroll back to the top