SmarttBot

Automated investments on the Stock Exchange

SmarttBot - Login
My Role

As the only Product Designer on the team, my role was to go through the entire discovery process, interviews with stakeholders, collecting customer service and navigation data, creating the prototype using Adobe XD and delivering it to the development team. I also worked in the design operation focused on the scale of the components created for implementation in React.

Company

SmarttBot

Role

Product Designer, tempo integral

Period

Oct 2017 - Jun 2018

Skills

Design System, Visual Design,
User Interview, Prototyping, User Testing

Discover

Starting from scratch

The construction project for SmarttBot's investment platform involved a drastic change, both visual and structural, in relation to the first existing layout. Some references were adopted to make work more effective with less execution time.

"Risk comes from not knowing what you're doing." - Warren Buffett

This phrase from one of the greatest investors of all time reflects the concept of this new platform well. Users need to be able to see everything that is happening with their money and be able to act if necessary.

Understand

Talking to the experts

The best way to understand what is happening is to join the Customer Service team and get the best feedbacks. Along with that, it was possible to get several insights based on data from the most diverse sources.

Google Analytics & Mixpanel

Zendesk Analytics

Heatmaps & Scrollmaps

Stakeholder Interviews

Framing the problem

Some problems have been identified through the user experience with the platform. A high number of people had difficulties in understanding the operations of the robots, balance, environment (real or simulated) that the robot was created. Many clients were not professional traders, that is, they had other professions and did not spend all day following the market. For this, the Mobile First concept was used to build the components and final structure of the platform.

Cores
Define

Recreating the experience...

When people need to diversify their investment portfolios, the market offers different possibilities. One of them is an automated operation by investment robots that execute previously configured or acquired. The focus is not having to spend the whole day watching the ups and downs of the market and dedicating more time to other activities.

The idea was to build a web platform that the user could follow the operations of the robots, buy strategies or configure the robots on their own. An experience that contemplates both the journey of a professional user and lay users.

Design

Start from the foundation up

Mapping

In order to understand the important points in the user's journey, navigation flows and identification of relevant touchpoints for conversion into the company's products were made..

Documentation is the key

To speed up the creation of screens and features, consistency in the interface and agility in possible future updates, a series of design principles was developed to support the entire scope that already existed with the first platform and bring even more usability.

Colors

A color palette was established with shades that already existed in the company's identity, some states were added so that the user could visually understand the use of the platform. (Whether he is getting rich or poor)

Cores

It took some experiments to decide the colors, as there were times when using the platform when the user needed to pay attention, otherwise he could lose money. At the same time it was necessary to inform the daily gains or losses for him to decide what to do, stop operating or continue with his robots on.

Tipography

Having chosen to work with Material Design as a visual language, we took advantage of its main source to use on the platform. Roboto is a very open and geometric font, very good for representing numbers clearly.

Tipografia

Structures

An investment platform needs to be intuitive and clear, and one of the strategies used was the creation of structures to be used throughout the user's journey. Making him understand the function of a specific feature regardless of which screen he is on.

Estruturas

Cards

To consolidate all the strategies described, more complex components were created and actions were inserted in them. They also help with content segmentation and sequentiality since each card has a different context from the other.

Cards

Navigation

There are some requirements when it comes to an investment platform, for that reason some strategies were used to make navigation more fluid and natural for the user, always making it possible to reach the next step.

Onboarding

An entry on the platform segmented by type of customer and sequential, designed to show the benefits and convert customers who have not yet paid for services.

Empty States

Used to guide the user at times when there is no content to be shown, empty states help a lot of users who have just entered the platform and do not know what can be done, or to report an error on the platform.

Empty States

ChatBot

There are several types of chatbots, but what was implemented for the new platform was a bot to answer the main questions users have regarding SmarttBot. Along with Costumer Service team, the main doubts were raised and a platform named Blip was used, a tool offered by another startup called Take, in the construction.

Chatbot
Deliver

Layout

Mobile

Many of the platform's users do not work with investments in a professional manner, many have other professions as their main source of income and most of the time, they do not stay in front of the computer following the scholarship during the day. Therefore, a mobile version was designed with the main functions that the user during the day, just a scroll to view how the robots are and act, if necessary.

Desktop

Various usability concepts were used througH the platform for a better experience in using the platform. That way, the user will always know what to do if he finds himself in a moment of doubt along his journey.

Learnings

Last but not least

After a lot of experimentation and many usability tests with customers and employees, we arrived at a consistent platform version, a clean and functional product, with several UX concepts and usability for a consistent and reasoned delivery in several ways. And I believe I managed to fulfill a mission to deliver a great user experience!

Gains from the new platform

Increased customer base

Double the number of customers in 6 months.

Increased engagement and retention with the platform

Users have come to understand the product more and use it better.

Enabled the launch of numerous new strategies

The modular solution made the layout include new releases.

There were many lessons learned through the process: