Redesign

Project Summary
  1. Role
    UI/UX Designer
  2. Project
    Mobile App Redesign
  3. Technologies
    Adobe XD, InVision Studio

A Better Investment App

My interest in investments started since couple of years ago, and only recently I focused on it more. To steer into this world I ended up using eToro. I like the platform and all its features, but I lacked the responsiveness of the mobile app. Thus I decided to introduce a redesigned version which would help me be a faster and better trader.

Key Redesign Points

The following shows some of the many ideas that were floated in the project. Not everything made it into the final product. In fact, I rejected a lot of the ideas because I wanted to focus on the core essentials of what would make the product have the best experience.

Current
Improved
Action
Current
Improved
  1. App navigation
    Hamburger menu
    Tab Navigation
  2. Search
    Search icon
    Input field
  3. Write a post
    Pen icon
    Plus button
    Profit
    Bottom label
    Navigation card
    Share
    Share icon (Always On)
    Share icon (On Demand)
    Notifications
    Logo icon
    Tabbar element
    List navigation
    List selection on tap
    Swipe action on "Trade" screen
    Filter
    Filter icon
    Integrated in market list
    Page settings
    Settings icon
    Integrated in market list

Application navigation

The most thought went through the navigation of the application. I decided to go with the swipe actions...

Search

Search is exchanged for the full with input field for two reasons. First you have immediate explanation what the search is suppose to achieve and the second, it initially pushes the markets down so the user can reach them easier.

Write a post

A pen icon is exchanged for a plus button. It's easier to reach, and more convenient to use.

Profit

Portfolio is placed on the first page where it’s one
swipe away from access

Share

Share button is inactive in most of the screens, thus making it redundant, thus I have removed it from the first screen, and showing it only on the screens where there is a demand for it.

Notifications

Notifications are moved to their own page on the Tabbar, and they have the same icon to be easier for the users to continue with the habit.

Current

Filter

All the functions from the filter button are implemented in the list directly, providing the immediate actions, such as setting alerts and rearranging items.

Current

Page settings

Settings page has also a separate navigation item on the Tabbar for higher convenience.

The Difficult Part

The difficult part was to redesign the navigation between the Watchlist and Portfolio. Currently in the app they are two different pages, which in terms makes sense. Unfortunatelly every time when I wanted to switch between those pages it would take ages and the process of it is quite inconsistent. I had other solutions in mind but I decided on swipable version.

Double trouble

I decided not to use the version with bottom swipeable navigation because it is inconsistend and quite near the tabbar so the user might accidentally click on unwished tab item.

What Doesn't Work

As a design is, it never can be perfect. The current implementation of eToro mobile application is just a wrapper for a web version, which in terms rather limits the functionality. The solution for reordering the companies and markets on watchlist is questionable and could be complicated to implement

Conclusion

Each function has was designer to optimise speed and usability. As previously mentioned not all ideas ended up on mockups such as People section, which should be investigated more throughly. Having in mind the plethora of functions offered, I only addressed the most critical ones.

Return To Portfolio to See More

Designed and Built by Uros Durdevic