Google Finance Portal
Objective: Evaluate Google Finance Portal (Your stocks tab) from a usability perspective. Come up with ideas to improve/redesign their user experience based on your evaluation.
Google Financial Portal current interface
Immediately from a user’s point of view, there are a handful of gaps in the product. There is a lack of engagement and the product does not bring the user in to be more involved. The product does not make the user want to interact with buttons, there is no hierarchy, and no call to action.
During my research I will investigate these design issues and identify what can make this product succeed for new to experienced users.
Deliverables: Research, information architecture, interaction design, low/high fidelity sketch designs, InVision prototype, and user interface design
Software: Sketch, Illustrator, Photoshop, Invision
Methods:
Competitive Analysis
• Review competitors and what is working for their products. Decide what features will work best for this new product.
Role: Researcher, Information Architect, and Interaction Designer
RESEARCH
Competitive Analysis: Review stock and money applications to view what is working for each. How can the main features of these products help Google’s financial portal and make the experience for the user enjoyable.
Findings: Managing expenses, keeping track of your income, and even making stock decisions are can all be done with the applications found above. Yes, there are pros and cons to every application, but there will always be a specific product that will fit your need.
INFORMATION ARCHITECTURE
User Goals and Roadmaps were created to find out which features should be included in a financial portal. This will help shape the product that will be redesigned and give the User a better experience.
Every product sets different goals for the User, it’s Business, and Technical side. The illustration on the left shows how each section has a different goal in mind, but also displays the common issues they all have. The perfect product covers everyone’s needs, and through research and understanding, this can be accomplished.
Before the design process begins, and before sketching is involved, you must first understand what features the product needs. A list of these items will support what the User finds important to effectively navigate through the product. Below are specific details on ‘must haves’, ‘nice to haves’, and ‘can come later’.
INTERACTION DESIGN
UI Product Requirements
Homepage (Stocks): Holding amount, stocks owned, graph
Trending page: Top stocks, graph
Currency page: Currencies you would like to track, exchange rate, graph
High Level Requirement
The product should be very engaging, with it’s most important items legible. Stock pages are already difficult to interpret because of the amount of information given, so having high contrast within the design should help Users differentiate what is of high importance to low.
Low-Fidelity Design
Features and buttons were placed in positions where the User can easily identify them. Sizing of text was also a main focus; they can display its importance from the rest of the content surrounding it. Color scheme will be inserted last.
High-Fidelity Design
Color, copy, and typefaces were incorporated to the design to help make the interface more dynamic. Below are yellow circles with numbers, pointing out the main features of the product.
‘Your Stocks’ tab - giving the User easy access to view their purchased stocks
‘Trending’ tab - User can view what stocks have high interest in buyers
‘Currencies’ tab - where different currencies can be monitored and converted
The amount User has gained in stocks
List of stocks owned by the User
Viewing options for the User (1 day, 5 day, 1 month, 6 month, Year to Date)
Time frame the User is viewing stocks during the day
Graph of the the chosen stock. Displays high and lows of the day.
The stock selected to be viewed
Prototype
Test Goals
• Navigating through product comes with ease and little confusion
• Buttons/Tabs are clear and the User is able to identify them immediately
• Selected typefaces are clear and legible to User
• User is engaged throughout the prototype
• Graphs are easily understood and add a visual element to the product
Findings: After testing the high-fidelity prototype, I found many of my initial ideas to work and some that needed to be revised. The contrast between colors, type, and pages, made it easier to find information. The variation has also made the product more engaging, wanting you to explore more, especially with the graphs inserted. Some improvements to the redesign can be made as well. More information regarding the the stock money gained should be present. The red and green colors from the Google logo were incorporated into the graphs, but can be used in many other ways to help the product jump. And revisiting other typefaces may help with hierarchy of numbers and main points.