Julian
Senior Product Designer (UX & Visual)

UX design planning & strategy | Work prioritization |
Trading website | Fintech


Investoo
Project overview

About Investoo

The mission of the product team here at Investoo is to develop websites that deliver expert knowledge and tools to anyone considering investing their money, no matter where they're based or their experience.

Context:

One of the websites that forms a part of our portfolio is 100forexbrokers. This website allows you to search, list and compare brokers currently available on the market. You can find the website here: ​https://www.100forexbrokers.com/

Mission:

Looking at the home page, it’s easy to see this website is navigation dense. The business wants to explore if simplification is needed and if yes, where could we reap the most benefits from it.

Time:

3H

Investoo
PART 1
How would you approach this task?

STEP 1: START FROM THE USER – COLLECT DATA/REVIEW DATA COLLECTED

There are 3 questions to be answered:

  • Who uses the platform?
    • Need for UX and marketing personas
  • What do they think of the page?
    • Need for user research data (heatmaps, live chat logs, focus groups) and website analytics (conversion rates, traffic sources breakdown)
  • What does the competition offer?
    • Need for competitive landscape benchmark

If the answers are already available, great, time to move to the next step, else, time to establish which UX research can be conducted ASAP and yield the most insights.

STEP 2: ESTABLISH PRIORITY LIST OF ACTIONS

Based on the data available/collected, establish a priority list of actions to take based on impact vs associated workload.

STEP 3: PROTOTYPING, INITIAL FEEDBACK AND ITERATIONS

At this point we have identified and are focusing on addressing pain point by order of importance. The design process starts:

  • Flow chart (Overflow)
  • Concept sketches
  • Wireframes (Balsamiq Mockups)
    • Once the clickable lo-fi mockup is ready, test it in a focus group
  • Visual design (Sketch + Invision/Zeplin for collaboration with the rest of the product team)

STEP 4: IMPLEMENTATION, A/B TEST AND ITERATIONS

The next step is to work with the developers on the implementation, then A/B test the changes and based on the feedback, roll out the changes or reiterate. 

How would you scope the objectives?

  • UX/UI review of the site
  • Benchmark of the site with competitors
  • Create and/or study user personas
  • Conduct user research (heat maps, focus groups, live chat logs) and/or study it
  • Study available site analytics (conversion rates)
  • Establish a roadmap of the design process
    • Time estimate
    • Priority list
  • Present results of the findings and the roadmap to the stakeholders

How will you decide what to prioritize?

Once the list of actions to be taken has been established, it is necessary to create a priority list.

First, I would sit with the developers and try to get a sense of the complexity of each of the changes required in order to identify the quick fixes, that are changes involving little development and that can be implemented quickly.

Then I would weigh the different factors and rate each from 0 (low/none) to 2 (high) and multiply them by a unique coefficient reflecting the degree of importance of each factor.

  • Perceived pain/degree of inconvenience – (coeff 2)
    • From the user research/direct feedback collect from the users
  • Observed/measured pain (coeff 2)
    • From the website analytics (conversion rates)
  • Audience growth measure (coeff 1)
    • These include adding more languages, making the site more accessible to lesser experienced users, etc. but also responsiveness in order to tap into mobile users
  • SEO tweaks (coeff 1)
    • These include adding responsiveness to the site and other practises used to improve the search engines’s ranking.
  • Ease of implementation (coeff 1.5)
    • Based on developer’s discussion

Once the ratings have been given the priority list gets reviewed and some adjustments may be applied based on experience.

In our example, it would be very likely that the responsiveness of the website would get the highest priority mark since it can be felt on 3 levels:

  • By returning visitors when trying to use the platform on the go (mobile use)
  • By new visitors accessing the site for the first time, from their mobile (high bounce rate from mobile visitors)
  • From an SEO standpoint since in October 2018, Google’s “mobile-first indexing” search was rolled out, meaning “mobile-friendly” websites will be shown first so the site’s discoverability is currently being penalized.

Quick fixes would probably follow before going through with modernizing the website with the latest and best design practises would probably come next and would at the same time address a fair amount of pain points from the user.

What information are you missing and what kind of assumptions do you need to

INFORMATION MISSING:

  • UX and marketing personas
  • User research data
    •  Heatmaps
    • Live chat logs
    • Focus groups report
  • Website analytics
    • Conversion rates
    • Traffic sources breakdown (Desktop/Mobile/Tablet)
    • Session lengths
  • Returning visitors to on-off visitors’ rate over time
  • Competitive landscape benchmark

ASSUMPTIONS:

  • UX and marketing personas
    • Male, mid 30s to mid 40s, investment banker/broker, good level of experience
  • User research data
    • Heatmaps
      • Low focus on CTA button
    • Live chat logs
      • Ask for help with navigation or functionalities in general
    • Focus groups report
      • Need for simplification
  • Website analytics
    •  Conversion rates
      • High drop-off rates across the search funnel and across mobile visitors
    • Traffic sources breakdown (Desktop/Mobile/Tablet)
      • 62/30/8
    • Session lengths
      • Majority of very brief sessions, and some very long ones for those going through the full search cycle and filling all the parameters
    • Returning visitors to one-off visitors’ rate over time
      • Low retention rates

PART 2
What assumptions do you need to make about its current design state?
Investoo

  • The page was designed years ago (skeuomorphic buttons, no proper grid layout, not responsive, old components, etc.) with practicality in mind above all else. The interface is very reminiscent of what one could experience filling an Excel table to see the updated results.
  • Since the site isn’t responsive, its ranking on search engines is supposedly lower.
  • The site/page is hard to use and doesn’t portray Investoo’s mission to “deliver expert knowledge and tools to anyone considering investing their money, no matter where they're based or their experience.”
    • Therefore, it only addresses part of Investoo’s ideal customer segment since less experienced users may find the page too complicated.
  • High drop-off rates across the search funnel and across mobile visitors
  • Either very short session length or longer than need be

Who are the users of this page?

  • Males in their mid 30s – mid 40s
  • Investment bankers / finance professionals looking for opportunities
  • Forex brokers looking for other brokers or to compare themselves
  • Finance magazine reporters working on some rankings

But the common denominator is that, regardless of their background or motives, the page’s complex search system with all its filters suggests that experienced professionals rather than lesser experienced ones are more likely to use it. So, there is a barrier to entry imposed by a design choice.

What is your view on the current structure of the page?

  • The “detailed search” is forced on the user as it occupies 90% of the screen estate and is the first thing displayed instead of a default “quick search” option first
  • There is no coherence in the structure and elements are just placed here and there on the page like the “You can also compare brokers” link or the “check all” button which both sit in between two columns
  • User guidance / Help is hidden at the very bottom, almost bundled with the footer links
  • There are design redundancies that contribute to the complexity and cluttering of the page

Overall the whole structure and layout of the page need a complete revamp.

What changes would you do to it and how would you prioritize them?

It is clear that a complete redesign of the page is needed.

It would include:

  • Restructuring the content/search parameters
  • Quick search / Advanced search / Guided search options
    • It is necessary to address both experienced and less experienced users by offering two levels of search: “Quick search” – “Advanced search”. There is even an opportunity to expand into a new customer segment by offering a guided search journey that would also yield educational information, recommended parameters and the “why” behind it.

  • Saved searches (for returning visitors)
    • In terms of customer retention, and since there are lots of parameters for advanced searches, the presence of a “save my search parameters” coupled with a user profile could facilitate future searches. For example, logged-in users would have pre-populated fields which saves them time by increasing efficiency.
  • Responsiveness of the page
    • With regards to priorities, the same methodology as Part 1 would apply here and similarly, making the page responsive would be top of the list, followed by rebalancing the content displayed and introducing 3 levels of searches with a granularity based on visitors’ experience and knowledge.