Revving Up User Acquisition and Revenue with a Smarter Create Flow: A Smallcase Makeover

Meet Rahul — an aspiring investor who is excited to start building his portfolio. Rahul has heard about an investment app called Smallcase and decided to explore it. He’s particularly interested in creating his smallcases, but as he tries to navigate the app’s create flow, he quickly becomes frustrated. Despite his confidence and prior knowledge in investing, the complex and confusing create flow makes him feel like he’s in over his head. He’s not sure where to start, and he’s close to giving up.

As a UX designer and a novice investor, I understand Rahul’s pain. I know that the create flow of Smallcase can be optimized to make it more intuitive and user-friendly. So, I decided to conduct a personal project to revamp the app’s create flow under the mentorship of Anudeep Ayyagari.

In this case study, I’ll take you through my entire design process, from research to iteration, and show you how I optimized the Smallcase “Create” flow to increase user acquisition and revenue for the app.

So, get ready to join me on a journey of innovation and discovery!

Disclaimer❗️

Looking for a quick summary of the project? Check out the first section which includes the Major Insights and Results! Want to dive deeper and gain a comprehensive understanding of the processes, reasonings, and insights? The second section which Detailed Work Process and Insights is for you!

Happy reading and enjoy exploring the project.

INDEX 🗂

Introduction🤝

Figuring out the problem statement👩🏽‍💻

Studying the Existing Flow

Section 1 — The Main Stuff 🍖

Evaluating and Identifying Problems 🧐

The Final Work 🎬

First Draft 1️⃣

Changes After User Testing 2️⃣

Section 2-The Detailed version

Evaluating the existing flow 🤔

Unveiling Insights: Deets from Research Findings 🧪

Secondary Research 👩🏽‍💻

Competitor Research 💻

Primary Research 📋

Validating Identified Pain Points ⁉️

Generating HMWs and Brainstorming Solutions 💃🏽

The HMWs 🤨

Brainstorming Ideas 💡

Wireframing 🏁

Finding the inspiration 🧐

The Design Odyssey: How the First Draft Came to Be 👩🏽‍🎨

Revamping the UI: User Testing and Beyond 🔨

Key learning and Conclusion 📝

Introduction 🤝

As part of a design sprint mentored by Anudeep Ayyagari, I had the opportunity to optimize the create flow of Smallcase, a popular fintech app. Being a UX designer with an interest in investing, I aimed to make the app more user-friendly and increase user acquisition and revenue. Through research and analysis, I identified pain points in the current flow and developed a streamlined solution that would simplify the process and help users create portfolios that aligned with their goals. In this case study, I’ll take you through my design process and show you how I made Smallcase’s create flow smarter and more effective.

Figuring out the problem statement 👩🏽‍💻

Product Name

Smallcase

Product Sector

Fintech

Flow Chosen

Smallcase Creation

Problem Statement

Evaluate and optimize Smallcase’s create flow for beginner and midlevel investors, including searching for securities, creating and organizing a smallcase, and editing it. The objective is to enhance revenue generation and user acquisition by providing a seamless and user-friendly experience.

Reason for Choosing the Flow.

The create smallcase flow caters to beginner and midlevel investors who are starting with investing and looking to create and manage their portfolios.

This flow provides a platform for these investors to test their knowledge and understanding of the investment world, allowing them to create and manage their portfolios by directly investing in securities.

This gives the investors greater control over their investments, enabling them to make decisions based on their personal financial goals and risk tolerance.

The create smallcase flow is a perfect opportunity for investors to learn and grow their investment knowledge, while also taking control of their financial future.

Business Metrics Targetted

Revenue Generation: As more users engage with the app and invest more, the fintech company can generate more revenue through fees, commissions, or other monetization methods.

User Acquisition: By offering an optimised process for creating a personalized portfolio, the app can attract a larger pool of potential users by offering a streamlined process for creating a personalized smallcase. With a user-friendly experience, the platform can reduce the barrier to entry and increase the likelihood of users becoming active. This, in turn, can boost user acquisition and help the app to grow its user base.

Assumptions

• The target users of Smallcase are beginner and mid-level investors who are interested in managing their portfolios.
• Users have some basic knowledge and understanding of investing and the stock market.
• The app’s current smallcase creation flow has room for improvement and can be made more user-friendly.
• Improving the user experience of the create smallcase flow can lead to increased user engagement, acquisition, and revenue generation for Smallcase.

Constraints

• The design changes must be feasible within the technical limitations of the app’s current framework.
• The app should adhere to financial regulations and security standards.
• The timeline for implementing the design changes must be reasonable and achievable within the scope of the project.

Studying the Existing Flow

Existing Create Fow of Smallcase

The current flow of creating a smallcase on the app appears to be straightforward. Users can access the “create” icon on the bottom navigation bar from the home screen, which leads them to a separate page which had a “create smallcase” CTA.

On tapping on the CTA, users can either directly add stocks or conduct some research through tickertape. However, the “find stocks on screener” CTA takes the user outside of the app to a different website. On the other hand, the “add stocks” CTA helps the user directly and search add stock to their smallcase.

Once the stocks are added, the users can organise the securities or directly save them and create their smallcase.

Though the steps seem easy to follow and straightforward. I found many pain points throughout the flow which can immensely impact the user experience of the app like not having enough information or prompts for the user to go ahead with security or the lack of user control and freedom while using the flow.

Check out my version of improving the flow below.

Section 1 - The Main Stuff 🍖

Evaluating and Identifying Problems 🧐

After conducting a heuristic evaluation and applying other principles of UX to the app’s existing screens, I identified several violations. These were reviewed with my peers, helping me focus on the most critical issues and identify additional problems.

To further refine the identified issues, I conducted secondary, competitor, and primary research. This helped me streamline the problems and generate ideas for potential solutions.

For a detailed description of my process, click here.

Home Screen

Problems Identified

1. Bottom nav icons are smaller compared to the industry standards.
2. Create icon doesn’t represent create.
3. The create button is easily not visible on the home screen. Also, there is only one small button on the entire screen to navigate to create a smallcase

Create 1

Problems Identified

1. The users have found this page to be unnecessary and believe that it could have been used more effectively.

Create 2

Problems Identified

1. Users may have issues understanding what tickertape or screener or even the subtext.
2. Users mistook the ticker-tape app to be smallcase. Added stocks there to invest.

Search

Problems Identified

1. No elements are prompting the users to go ahead with stock.
2. Users had to recall the stock names and performance from TTP or other sources. Performance was a key factor in adding the stock.
3. Users get confused with multiple options of the same stock. Was not aware the 1st option is the main stock.
4. No recommendation of stocks when you search initially while creating a new stock. The subtexts only ask you to type 3 characters. Novice users may find it difficult to understand.

Segment

Problems Identified

1. Users were confused about how to transfer securities to different segments. They deleted securities from the old and added to the new segments.
2. Users cannot add securities to an old segment when a new one is created.
3. Users may find it difficult or maybe confused to find how to delete an added security.
4. The lock is something that confused most while dealing with weights. They did not understand its use and why it got applied automatically.
5. Users may not understand the use of or how to add segments.

Add Stocks

Problems Identified

1. Users cannot identify whether they can add other modes of investment to their Smallcase
2. It would help the users make more informed decisions if the app included the sector of the stock.
3. Users cannot check the performance of stocks they want to add later into their created Smallcase.

you can find the detailed version of evaluating the flow, problem identification and validation here.

The Final Work 🎬

First Draft

With the identified problems in hand, it was time to create a first draft of the screens based on the insights gathered.

Every proposed change was backed by reasoning derived from detailed secondary and competitor research, as well as primary research conducted through one-on-one calls with targeted users.

Home Screen — Before and After

1. A Create Call-to-Action (CTA) was added to the home screen to guide users to the create flow, as some users were having difficulty locating the path to create their smallcase, which was only represented by a small icon on the bottom navigation.
2. To address user confusion with the original create icon used by the app, a more externally consistent icon was chosen and implemented to represent the create function.

Create 1 — Before and After

1. The colour palette of the TickerTape Call-to-Action (CTA) has been updated to match the brand’s (tickertape’s) colours, making it easier for users to distinguish and identify the CTA from inherent elements of the app.
2. To improve clarity and make it easier for users to understand what the TickerTape feature can be used for, the text has been updated and the term “TickerTape” has been bolded to draw attention to it.

A recommendation screen has been introduced which shortens the time required for users to search for securities. This would streamline the process considerably and help the users make better decisions.

1. To assist users in making informed decisions, chips have been introduced for certain categories such as market capitalization (m-cap), sector, investment type, and others. These chips make it easier for users to filter and sort through relevant information and make more informed decisions.
2. When a user taps on a chip, the colour of the chip changes to highlight the selected option, making it easier for users to visually identify their chosen category and option. This feature enhances user experience by providing immediate feedback and a clearer indication of the user’s selection.
3. To allow users to select multiple options and apply their selections, an “apply” button has been added. This feature enables users to make multiple selections and view results based on their chosen options by clicking on the apply button. This simplifies the process of filtering and sorting data, providing a smoother and more efficient user experience.

To provide users with more control over their search results, a filter option has been introduced that enables users to add or delete filter options based on their specific requirements. This feature allows users to customize their search criteria according to their preferences and streamline the results to their exact needs. By enabling users to refine their search results, this feature enhances the user experience and helps users to find what they are looking for quickly and easily.

1. Filter tags have been introduced to display the number of filters applied, and users can also delete filters by tapping on the cross icon. This feature allows for greater control and flexibility in filtering search results, providing a more streamlined and user-friendly experience.
2. To provide users with a clear indication of the number of filters currently applied to search results, the filter icon has been updated with a red dot that displays the number of filters applied. This makes it easy for users to quickly identify if they have applied any filters and how many, improving the overall usability of the feature.

1. Several prompts have been introduced to speed up the decision-making process for securities selection, including:

a. Prompts such as “Viewed 40k times in the past week” have been added to provide users with relevant information that could assist them in making decisions.

b. A price graph has been added to provide users with a visual representation of a security’s price performance over time. This helps users make sound decisions based on the security’s price history.

c. A popular tag has been included, which is already inherent in the app. This tag highlights securities that are currently popular among users, giving users insight into what others are currently investing in.

d. The sector, m-cap, and type of investment have been included as a subtitle for each security, making it easier for users to identify and select securities based on their specific criteria.

e. An “All” tag has been introduced to differentiate the leading stocks from sub-stocks of the same company. This makes it easier for users to navigate and distinguish between different stocks related to the same company.

2. To improve consistency and make it easier for users to identify, the “+” icon has been replaced with an “Add” button. This change aligns with the app’s design language and makes it clearer to users that this button is for adding new items.

Introduced an “add segment” screen designed to improve user understanding of the process while helping them better organize their portfolios. This feature simplifies adding to segments and enhances the overall user experience by improving the organisational process.

1. Highlighted the current segment the user is on, providing clear visual cues and enhancing the user experience by helping users keep track of their progress within the platform.
2. Optimized the smallcase UI by introducing direct access to Tickertape within the create smallcase flow. This eliminates the need for users to leave for research and streamlines investment management, saving time and enhancing the user experience.
3. I streamlined the stock shifting process in smallcase by using clearer instructions and a more noticeable design. The new “hold and drag” text, along with the app’s primary colour, makes it easier for users to manage their portfolios without confusion.
4. A chatbot feature that assists users in understanding technical terms by providing quick access to the glossary has been added. This feature improves the user-friendliness of the platform by simplifying the navigation process and enhancing the overall user experience.

1. A delete confirmation pop-up has been implemented to offer users the choice to keep or delete a security. The pop-up will be triggered when the user performs a long press or left swipe action on the security they intend to delete, which is externally consistent.
2. To improve visibility and maintain internal consistency, the “save” function has been converted into a button. This change is intended to draw the user’s attention to the save option more effectively.

1. To address confusion among users regarding the application of lock, a pop-up notification has been added when the user modifies the weights of each security. The notification explains the reason why the lock is being applied. Additionally, the lock icon has been updated to an unlocked and locked version, which further reinforces the message.

1. A new feature called “Previously searched” has been implemented, allowing users to view their previous search queries.
2. If a security has already been added, the corresponding button will be disabled with the text “added” on it. Once they tap on the added button similar stocks feature will be displayed, enabling users to add similar securities to their smallcase.
3. A new history icon has been added to indicate when a security has been previously searched by the user.

Check out the initial prototype here.

Changes After User Testing

1. During the usability testing, it was found that although the users understood that Tickertape was a different website, they were uncertain whether clicking on the call-to-action (CTA) button would redirect them out of the app. As a solution, a new screen has been introduced that will notify users when they are about to be redirected outside of the app. The notification screen provides users with the option to proceed with the redirection or choose to stay within the app, ensuring that users have full control over their actions.

1. After conducting user testing, it was found that users were confused about the meaning of the term “all” beside each stock. To address this issue, the term “main” has been used instead, which is clearer and easier to understand for users. Furthermore, an “i” icon has been added to the interface, which provides users with further information about the meaning of the term “main.” This will help users understand the purpose of the feature and how to use it more effectively.

1. Despite highlighting the background of the segment title, users were still confused about which segment they were on while using the app. To address this issue, the names and icons of the segments have been highlighted using the app’s primary colour to make them more prominent and easier to identify.
2. After receiving feedback from users, it was discovered that the final investment price and other important details needed to be added to the first draft of the app. Post user-testing included the existing features.

1. After receiving feedback from users, it was noted that the pop-up messages within the app appeared outdated and not aesthetically appealing. To address this issue, the design of the pop-up messages has been updated to a more minimal and modern version that is in line with the overall design of the app. This ensures the users will have a better visual experience while using the app.

1. After conducting user testing, it was found that users were having difficulty reading the numbers within the small red dot due to their small size. To address this issue, the text size of the numbers within the red dot has been increased in the latest update of the app. By enlarging the text size of the numbers within the red dot, users will be able to read the information more easily and will not miss any important information.

1. After receiving feedback from users, it was found that the heading “previously searched” was providing users with enough information that the shown stocks were previously searched. Users indicated that they would like to see more detailed information about the stocks’ performance and other key factors before adding them. By providing users with more detailed information about the stocks they have previously searched, users will be able to make more informed decisions about their investments. Thus, the history icon has been charged to the graph icon which upon being tapped gave them the necessary information. Users will now be able to see historical data, key metrics, and other relevant information before deciding to add the stock to their portfolio.

Check out the final prototype here.

Woo-hoo, you’ve reached the end of section 1 — give yourself a high-five! 🙌

If you’re feeling curious and want to learn more about the project, keep scrolling down. But if you’re ready to move on to bigger and better things, go ahead and skip to the end like a boss! 💪

Section 2-The Detailed version

Hey, hey, hey! If you’re ready to take your research game to the next level, check out the second section of the case study where I have provided a detailed description of each step in the research process, including problem identification, peer review, secondary and competitor research, primary research, and user testing.

Let's get into it!

Evaluating the existing flow 🤔

In the first section of the smallcase case study, the final evaluation conducted on the existing screens in the create flow was covered.

In the second section of the case study, you can find a detailed evaluation of each screen of the create flow. The evaluation was performed individually for each screen to identify any violations and record them with their corresponding severity levels. The purpose of this evaluation was to gain a comprehensive understanding of the current state of the flow and to identify any potential issues that may impact the user experience negatively. This evaluation helped in identifying specific areas of improvement to enhance the flow.

After completing the individual evaluation, I received a peer review that offered me valuable insights that I had overlooked, and also partially confirmed my findings from a designer’s perspective.

Take a look at the insights I discovered from the peer review, along with my insights that I’ve illustrated in the image below.

The peer review gave me a fresh perspective and some new insights that turned out to be important as I continued with the project. For example, one of the things my peers pointed out was that the create button wasn’t obvious on the home screen, and that there was only one small button to navigate to creating a smallcase. These were things that I hadn’t thought of before, but they turned out to be crucial considerations going forward.

I also appreciated the fact that my peers were willing to call out my mistakes and provide constructive criticism. As designers themselves, they were able to give me valuable feedback that helped me to finalize the issues that I needed to address in the next steps of the process. Overall, the peer review was a really helpful and positive experience that gave me a lot to think about as I moved forward with the project.

Unveiling Insights: Deets from Research Findings 🧪

Let’s dive into the exciting world of research! I’ve got some juicy findings to share with you that I discovered through digging into secondary sources, checking out our competitors, and conducting my very own primary research. Trust me, this is going to be a blast!

Secondary Research 👩🏽‍💻

Let’s start by peeling back the layers and taking a look at my secondary research.

The first step we took as a group was to get a better understanding of the user base for the app. This involved diving into existing data and analytics to identify different types of users and their behaviours. By doing this, we were able to determine which groups of users we should target for further research and interviews.

We conducted an extensive study by reading articles, research papers, blogs, and vlogs to gain insights into user behaviours and preferences. Our goal was to gain a deeper understanding of the user base for our app and pinpoint the specific types of users and behaviours that were most important to investigate further through research and interviews.
From our findings which you can see in the above image, we were able to identify several key points and narrow down the segments of users to target for our research.

The segments we have identified are as follows:

Gen z & Millennials
Age bracket: 18 to 42
M: F: 1:1
Demographics: Urban, Tech-savvy individuals
Region: India
Income: Varies, but typically individuals with a stable income who are looking to invest in stocks
Occupation: Salaried employees, business owners, freelancers, professionals and students
Investment goals: Long-term wealth building, diversifying their investment portfolio, and/or financial planning for their future.

Additional things to note:
Users with at least some financial literacy
Users who have existing DEMAT account
Users who have at least some experiences in investing (not necessarily smallcase)
Beginners as well as advanced investors

Based on these findings, we have a clear picture of the user base to focus on for our research and development efforts. We can now create content and features that cater specifically to the needs and preferences of our target users, making smallcase more valuable and useful to them.

In addition to these targeted segments, I did some individual secondary research where I found several other insights and inferences. Some of the most important points I uncovered have been summarized in the image below. These findings guided my primary research and helped me create the question guide for my interviews and allowed me to gain even deeper insights into the needs and preferences of my target users.

Through secondary research, I gained a clear understanding of the investing behaviours and patterns of Gen-Z and Millennials. I also gained a deep understanding of what smallcase is and several factors that affect the investment behaviours of our target users.
It allowed me to identify the problems and pain points faced by my target users when it comes to investing. With this knowledge, I was better equipped to ideate solutions that address these challenges and improve the overall user experience of our app.
In summary, the insights and information gained from my secondary research will be invaluable in guiding my primary research and ultimately, the optimization of smallcase.

Competitor Research 💻

After gaining a brief understanding of several factors related to investment, especially the investment patterns of Gen Z and Millennials, I decided to conduct competitor research within the fintech industry.

Unfortunately, I could not find any apps that allowed investors to invest in a smallcase or basket of securities simultaneously. Therefore, I focused my research on apps that allowed investors to invest in individual stocks and other securities.

The detailed study I conducted is presented in the image below. It includes a comparison of several competitor apps and their features, as well as an analysis of their strengths and weaknesses.

For the competitor research, I examined 2 apps — Kite by Zerodha and Groww. After using these apps myself, I took screenshots of the flows that were most similar to Smallcase’s “create” functionality.

I analyzed each screenshot and made a note of the insights I gathered from them. I discovered various features that could be incorporated into Smallcase’s flow, such as providing essential prompts to help users make quicker and more informed decisions, etc.

Overall, this study has given me valuable insights that can be utilized to enhance Smallcase’s user experience and improve its functionality. I gained valuable insights into the current market and identified areas where our app can differentiate itself and provide unique value to our target users.

Primary Research 📋

To conduct our primary research interviews, I targeted users based on the insights and findings from the secondary and competitor research. This allowed me to focus on users who fit the segments which were identified as being most important to investigate further.

To connect with our ideal target audience, we created a Google Form as a team. The form consisted of a few basic questions that helped us identify whether the respondent would be an appropriate candidate for an interview.

To ensure a smooth interview process, I created an interview guide beforehand based on research. further into the interview process, the questions were tailored to each interviewee’s responses to gather comprehensive insights into their experiences and preferences related to our product/service category.

After finalizing the interview guide, the next important step was conducting the interviews. I conducted primary qualitative interviews with four individuals who fit my target user profile.

The first interview served as an icebreaker and provided valuable insights into how to probe further and where to draw the line with certain questions.

Across all the interviews, I identified several common factors that users found frustrating, as well as unique issues specific to each individual. Overall, these interviews provided me with a comprehensive understanding of my target users and their experiences with smallcase.

From the insights provided, I narrowed it down to some repetitive and important insights

Some of the key insights include:

Difficulty in identifying the “create” icon on the bottom navigation bar to create a new smallcase from the homepage.

User feedback that the “create smallcase” page could be better utilized.

User confusion when tapping on tickertape leads them out of the app.

Lack of understanding of what “segments” are and how to use them.

Difficulty in identifying which stock belongs to what sector and its performance.

User unawareness of the ability to add other modes of investment, which is an essential feature.

User frustration when having to leave the smallcase to refer back to tickertape.

Confusion in understanding the purpose of the “Segments” feature and how to add new stocks to a segment.

User confusion about the lock feature and why it gets applied.

Too many sub-options of the same stock on the “Search” page, causing confusion.

Difficulty in identifying which stocks to add after creating a smallcase.

User unawareness of the drag-and-drop feature to move stocks into a new segment.

Difficulty in recalling previously added stocks and having to search for them again to add them to the smallcase.

The primary research phase revealed some valuable insights that helped me understand the user pain points in the smallcase app. Now, it’s time to validate the problems as well as add additional problems identified through research and determine which problem areas require attention the most.

By prioritizing the most significant problems, we can focus on solving the most pressing issues that will have the greatest impact on improving the user experience.

Validating Identified Pain Points ⁉️

After identifying potential problems in Smallcase’s create flow, and research, the next step was to validate or invalidate the problems based on the research insights.

Once I had validated or identified new problems, I prioritized them based on their severity and considered them while designing the final screens. I aimed to ensure that the final screens addressed the validated or newly identified problems, thus providing a seamless and user-friendly experience for beginner and midlevel investors on the Smallcase platform. This would lead to improved revenue generation and user acquisition for Smallcase.

The validated problems were marked with a green thumbs up. Only the most severe issues were taken forward to the final design, ensuring a user-friendly experience.

The problems identified for the create flow of Smallcase were:

1. Create button not easily visible on the home screen

2. Users confused about the tickertape and screener redirecting them to another website

3. Users mistook the tickertape app to be Smallcase and added stocks to invest there

4. No prompts to guide users to add stocks or understand their performance

5. Users had to recall stock names and performance from other sources

6. Confusion with multiple options of the same stock

7. Users not understanding the use of segments or how to apply them

8. Technical terms causing confusion for users

9. Lock function confusing users with its use and automatic application

10. Difficulty in transferring stocks between segments

11. Unable to add stocks to an old segment when a new one is created

12. Difficulty in finding how to delete an added stock

13. Inability to add other mediums of investment

14. Users cannot check the performance of stocks they want to add later to their created Smallcase.

Generating HMWs and Brainstorming Solutions 💃🏽

The HMWs 🤨

Once I identified the pain points, it was time to get creative and come up with solutions. But before diving in, I needed a framework to guide my thinking. That’s where the “How Might We” (HMW) questions came in. By converting each problem into an HMW question, I could approach the issues from a fresh perspective and ideate innovative solutions. It was like a brainstorming session on steroids!

Alrighty then, now that we’ve nailed down the HMWs, it’s time to put our thinking caps on and come up with some killer solutions for each and every question! Let’s get those creative juices flowing!

Brainstorming Ideas 💡

How might we make it easier for users to create a smallcase?

Include the create feature CTA in the home page.

Use striking colours on the CTA and icon to gain attention.

Optimise the bottom nav by giving a better create icon that people can easily identify.

A small video letting users know they can create their own Smallcase.

In-app notifications that reminds users to create a portfolio or highlights its benefits.

Visual cues that prompt the user to check out the create flow if they have not explored it.

Use a consitsent icon that users are used to pass the message of create.

How might we make it easier for users to understand the objective of each smallcase for their investment needs?

Indicate the objective in small texts near the created SC

Indicate the performance of the smallcase without having to go inside it

How might we make this real estate more usable for users?

Include recommendations of stocks and provide categories of market cap the users can choose from

Incorporate modes of investment

Incorporate ratios of volatility for users to choose from

How might we make the technical terms more accessible and understandable for novice users?

Provide additional resources, such as definitions, explanations, or tutorials, to help novice users better understand the technical terms used.

Provide tooltips etc for terms the users may not understand.

Provide a short video clip explaining the terms.

Provide an AI chatbox that can help them understand the terms etc

Provide better customer service, the official can explain things.

Providing a “Tips and Advice” forum so the user can refer to answers from other investors.

An FAQ section where they can find the most frequently asked doubts etc.

Provide a glossary with terms and links that can help users understand better.

Provide sessions with managers which can help users make more informed decisions.

How might we better differentiate the tickertape app from the smallcase app, so users understand they are different apps and their individual purposes?

Inform the user using popup message they are leaving the app to view view a different website.

Use tickertape brand style for the button or section.

inform the users using visual cues that TTP is a different website.

A clear text on the second app that the screener is from Tickertape and they will have to leave the app to view it.

Access back from TTP to SC by adding proper visual cues.

How might we prompt the users to invest in stocks?

Provide the CGAR and Performance of the stock beside it for sound decision making.

Provide recommendations of top-performing stocks the users can invest.

Tapping on the stock gives info about the stock and a graph of its performance.

Showcasing its market cap and sector the stock belongs to

Highlight the volatility of the stock.

How might we better distinguish between the main stock and sub-stocks?

Give an indication of the main stock.

Colour label main stocks and sub-stocks according to sector.

Incorporate stock tickers to differentiate between stocks.

Introduce a classification system.

How might we help users better organise their stocks?

Optimise the current feature add to segment by adding a tooltip on how to use segments.

Give an overview of how segments can help new users who use the app.

A pop-up message instructing users to create a new segment when they add a new sector.

Incorporate an additional screen where the user can add the stock etc to preferred segment or make a new segment.

How might we make users understand what the lock feature is and how they can use it?

A tooltip on what lock feature does

Highlight the whole stock that has been locked.

A pop-up explaining why the stock is automatically getting locked.

Indicate the max weights the user can add for each stock to know the limit.

How might we improve the functionality for transferring stocks between segments in smallcase?

Highlight the text using a contrast colour

Give more prominence by making the text bolder or italic.

Give a demo for new users.

A message informing the users they can drag and drop stocks to diff segments.

How might we allow users to add stocks to both new and old segments in smallcase ?

Highlight the selected segments.

Provide a + icon near the segment to add more stocks to it.

The edit flow of each segment can include “add stocks” under indicating the user can add more stocks to it.

How might we improve the delete option for individual stocks?

The 3 dots can have a delete option for individual stocks as well.

A demo initially the stocks can be deleted by sliding it left.

The six dots can provide a direct delete option for the stock.

A confirmation popup can be included while deleting the stock.

An undo option to retrieve deleted stock.

How might we help the users add new stocks after creating a smallcase?

Provide access to TTP directly from the existing smallcase to refer stocks and add.

Provide personalised recommendations of stocks along with their performance and sector.

How might we help the users understand they can add in other modes of investment into their SC?

Provide an input field text suggesting the users can search for stock, gold etc

Provide categories on the search page they can choose from.

Recommend all modes of investment while searching.

Pop-up letting users know they can search multiple investment modes.

How might we make it easier for users to find and recall the sector and performance of stocks they have previously viewed or researched?

Show a simplified performance graph beside the stock.

Show the sector the stock belongs to

Show a search history for users to refer back to. Once tapped can also.

Show the recommendations of that stock.

Categories stocks upon market cap, type etc for easy reference

Alerts about he performance of the stock, help users make sound decisions.

Wireframing 🏁

With all the problems identified and solutions ideated, it was time to bring my ideas to life. I delved into creating the LoFi wireframes for each screen, feeling excited and inspired to see my vision take shape. This helped me visualize the layout and user flow for each screen, as well as identify any potential issues before moving on to the high-fidelity design phase.

By creating wireframes, I was able to experiment with different design elements and user interface patterns without getting bogged down in the details. It also allowed me to get a clearer understanding of how users would interact with the app and how the different screens would be connected.

Finding the inspiration 🧐

To create a UI that effectively addresses the identified pain points while also providing a seamless user experience, I began by gathering inspiration from various sources. This involved exploring different design ideas and considering user feedback to create a UI that is both functional and visually appealing to users.

By reviewing design patterns and best practices from other successful apps, I was able to gain insights into what works well in terms of user experience and incorporate those elements into the final UI design for the smallcase app. Additionally, I also gathered inspiration from various design resources and communities, to see how other designers have approached similar problems and found new and creative solutions.

The Design Odyssey: How the First Draft Came to Be 👩🏽‍🎨

With the insights gathered from the research and the LoFi wireframes created, I was able to move on to designing the final screens for the revamped create flow of smallcase.

To begin the project, I initiated the creation of a component library and established the specific text and color styles that would be used throughout the design. This ensured consistency and helped to streamline the development process.

I used a design that was simple, intuitive, and elegant, while also being consistent with the existing app. I kept the user’s perspective in mind while creating the screens, ensuring that each step was easy to follow. The screens were designed to be visually appealing, with clean lines and an uncluttered layout that made it easy for users to focus on the essential elements.

Check out the detailed version of the first draft and see all the awesome changes that were brought in here.

Revamping the UI: User Testing and Beyond 🔨

After completing the initial UI design, it was time to validate the changes with user testing. This was a crucial step to ensure that the changes made sense and that any possible mistakes were caught and corrected.

To ensure a smooth user testing process, I carefully curated a list of tasks for the users to perform. In addition, I also created a comprehensive list of probing questions and areas that needed to be observed during the testing process.

After designing the prototype, I conducted user testing with three different sets of users, and the insights gained from these sessions were extremely valuable in improving the design. You can find a detailed analysis of the user testing results below.

The initial UI was well-received by users, who appreciated its many useful features that aligned with their preferences. However, several critical insights emerged from user testing, which was carefully considered and incorporated into the final UI designs. These insights included:

Check out the UI with all the final changes here.

Key Learnings and Conclusion 📝

This project was a wild ride! I learned so much and gained valuable insights that I will carry with me for the rest of my career. It was like a rollercoaster with ups and downs, twists and turns, but it was all worth it in the end.

One of the most important things I learned was that even the smallest change can have a big impact on users and business metrics. I also realized the importance of starting small and prioritizing tasks, so as not to get bogged down in a larger flow and waste time on meaningless work.

Working as a team was a lot of fun too. My teammates were always there to support me when I hit a wall or felt swamped with tasks. The peer reviews were also a great opportunity to learn from each other and improve our skills together. And let’s not forget the user interviewing and testing! It was life-changing to see how users interact with the product and how my designs could make a difference in their experience.

Overall, this project was an incredible learning experience that taught me much about design, teamwork, and user-centered thinking.

Thanks for checking out my case study! If you have any feedback, suggestions, or even a joke to tell, please don’t hesitate to share it with me. I’m always looking to improve my skills and have a good laugh along the way!

Want to chat more about this project or anything else related to design? Hit me up at gopicca1999@gmail.com or connect with me on LinkedIn!

I’m always up for a good conversation 😄