I designed the mobile website, as well as the iOS and Android apps for smallcase, which are now live. 50% of the user base now transact on the apps. I was in charge of both the experience and the interface.
smallcases are investment products for a new generation of Indian investors. They are basket of stocks that reflect a theme or idea, and can be bought via multiple stock brokers across India. See the website here.
It was early 2018, and smallcase was just rolling out a brand new website. The only other platform it existed on was Android, which would now become obsolete.
The challenge was to design both the iOS and Android apps, as well as a mobile website which didn't exist back then, that feel like part of the same family. The experience was to be familiar, consistent, and reliabile no matter what platform they were accessing it from.
It wasn't just a re-skin. The whole mobile experience and its features needed to be thought of again, as the platform was evolving rapidly. The apps had to increase value, and be usable by millions.
During the process of building the mobile experience and UI, I made design decisions after by taking the following things into consideration.
One of the biggest pain point we found from user interviews that beginners had a hard time finding a smallcase to invest in. The Discover section had too many options and did not help in making a proper decision.
Newcomers to smallcase had a hard time knowing what to do next. Since a lot of the user base came directly from broker websites, they landed on smallcase without really knowing what it was. There was a lack of right information and confusion on what to do once they arrived.
A lot of customer complaints were regarding error states. The language was too technical and people did not understand what they meant, and reached out to support to understand what was actually wrong.
Empty states were also non-existent or unclear, and led to the people being confused as well. This was extremely distressing for users when an order went wrong and they couldn't understand why.
From the company's point of view, the UI and experience of the website did not match up with the old Android app, and the features on the old Android app were clunky and were not in sync with the website.
The company also wanted to create a consistent mobile experience across iOS, Android, and mobile web. iOS and mobile web did not exist yet, and Android was 2 years old, which is a lot in the life of a young, fast moving startup.
The iOS, Android apps and mobile website went live around the same time, with a brand new experience, which was consistent throughout.
The apps had consistency in icons, illustrations, language, error states, and empty states with the web platform to provide a seamless experience, whichever platform the user is transacting on.
A design system was also put in to place to keep UI elements similar all across the board. The navigation and native patterns were unique to each OS, so that users could feel at home with familiar interactions.
To help people familiarise with the platform, there was an onboarding flow put in place to help users feel at home as soon as they land on the smalllcase platform.
Users are guided through how smallcase can help them based on their level of investing experience.
The dashboard acts as a "safe nest" where they can come back if lost, with handy checklists and reading material to advance their investing journey. These are customised for different experience levels of investors.
To help beginners find their first smallcase, the Discover section was redesigned to make it easier to find a smallcase of your choice. People can now go through curated sections for all kinds of investors, and also filter through all smallcases to find one that you like, for more experienced investors.
All error states were made more descriptive, and the language thought together along with the customer support team to make it more human.
The empty states were completely redesigned with illustrations, and the communication was re-thought with the same team to also give it a more human feel, and reduce confusion on what steps to take.
This made a large difference during the order placement flow, where each step was clear, and the error messages were made mode transparent and human, so that users could understand what went wrong.
A large part of the new experience included re-thinking the "clunky" features like Creating a smallcase which weren't utilised well due to their current design. Another aspect was adding new features that didn't exist before, like strategising and implementing the Buy + SIP flow, After Market Orders, and helping users track their Investments better.