Investing Angles
|
2022-2023
How can we empower people to make informed investment decisions?
Investing Angles is an educational blog dedicated to helping investors
at all levels make informed decisions through comprehensive analyses
and visual charts.
When the client approached us to revamp their website, they wanted a solution that would enhance user experience and accessibility, making it easier for users to navigate and find the information they needed.
When the client approached us to revamp their website, they wanted a solution that would enhance user experience and accessibility, making it easier for users to navigate and find the information they needed.
In this project, I collaborated with a developer and our client. I
took charge of the entire design process—from UX research and concept
development to prototyping, visual design, and usability testing.
The Problem
"I go to Telegram and search for Bitcoin ... in order to find the
link I want and open it using the browser."
“It is difficult to navigate through the
website, like finding an older post.”
"The website is overall very frustrating.”
“I want better access to daily reports.”
The Challenge
How can we redesign the site for simpler navigation and better
readability across many categories without overwhelming users?
Our goal was to refresh the look, improve accessibility, and help
users easily find the information they need to make confident
investment decisions.
The Result
We achieved our set goals and more: a 4x increase in conversions,
tripled the rate of returning users, reduced support emails by 68%,
and experienced a 40% surge in our Net Promoter Score.
Understanding the project
I collaborated with the client to understand their goals, analyzed
website stats, and closely studied user behavior across devices.
Streamlining category and tag navigation was a priority for a
seamless user experience. I started by researching how industry
competitors structured their content and navigation.
Examining a component:
The section header resembles a title of an article, adding to a
lack of visual hierarchy.
The actual title of an article is hard to read, as it's made up
of non-clickable tags and categories that serve no practical
purpose.
The text description of the article is challenging to read or
scan because of lengthy links to other posts and unnecessary
tags. It's not a summary either, making it difficult for readers
to grasp the post's content.
For the most recent articles, the date isn't as useful. Given
the fast-paced nature of stock market developments, displaying
the time posted is more relevant.
After reviewing competitors, I looked to industry leaders like The New
York Times and Medium for inspiration, as their solutions to similar
navigation challenges provided valuable insights.
Understanding the users
Before diving into the redesign, we needed to understand our users'
pain points. What frustrated them? What were they looking for? Where
was the site lacking? What did users really want, and how could we
align that with our business goals?
We launched user surveys to gather insights into their frustrations
and needs. Using this feedback, I created a user journey map to
highlight areas needing improvement, focusing on opportunities to
enhance the user experience.
The login button is hidden, making it
hard for subscribers to find and access quickly.
Users struggle to find the search bar
due to its placement at the bottom of the home page.
Users waste time navigating multiple steps
to find the latest article.
Most users access the blog on mobile devices. With mobile usability neglected
, users are frustrated by readability and accessibility
issues.
Organizing Content
To make the content more accessible, I started by reviewing all
existing categories to see how they could be grouped under larger,
more intuitive categories. Clarity was key; we wanted a structure that
made sense to our readers.
Each analysis or blog post focused on a specific topic known as an
"instrument." With so many instruments, listing them all in the main
menu would be overwhelming. So, we grouped them into themes we called
"rooms."
Leveraging our research insights and the new category structure, I
mapped out the website's information architecture.
Exploring solutions
I sketched several main screens to quickly visualize ideas, prioritizing
easy access to key elements like subscribe, login, and rooms across all
devices.
Refining a component through iterations:
Readable time for articles within the last 24 hours.
Relevant image or graph enhances visual appeal and facilitates
quicker comprehension of article content.
Clean title and improved readability by relocating tags and
categories to the bottom.
The card doesn't accommodate multiple categories well and fails
to convey a clear hierarchy.
Improved category organization: the parent category stands out
at the top in our brand colour, and the child category listed as
a tag at the bottom, allowing easy access to both.
Easy to understand the type of article (alert, trade signal,
study) by clearly differentiating it from both tags and
categories.
The grid system gets thrown off creating a cluttered appearance
when multiple cards with varying title lengths and fixed image
sizes are placed in rows.
The grid layout is now consistent by swapping the positions of
the image and content. Regardless of how long the title is, it
won't disrupt the image placement.
The time/date is displayed first for fast scanning, while the
author name has been moved to the article page for a cleaner
card design. This allows more space for any additional tags.
Displaying the number of likes on the card encourages user
engagement and piques interest.
Testing Prototypes
After multiple iterations, we developed a detailed prototype ready
for usability testing. Our aim was to ensure the design was both
visually appealing and functional, while identifying any potential
issues.
We conducted hallway usability testing with five participants.
During these sessions, we encountered a few minor issues, which I
addressed before handing off the final designs to our developer.
Launch
We launched the MVP on February 6, 2023, aiming to provide easier
access to content and introduce the new website to our subscribers.
Additional design elements and features are being tested and rolled
out in phases.
Visit the site
Validation & iterations
Post-launch, we conducted validation tests using Microsoft's Clarity
tool. While users found the website easy to navigate, we identified an
issue with the image lightbox: users couldn't pan or scroll
horizontally when zoomed in on a graph.
We quickly explored alternative solutions and implemented a fix within
a day. Subsequent tests confirmed that users could now effortlessly
zoom and scroll horizontally without any issues.
Easy Navigation
The original website was difficult to navigate, with an unclear search
and login process—there was no visible link or button—and no
discernible way to locate desired content due to a lack of defined
categories.
In the new website, we improved the experience by making the login
button and search functionality clearly visible, and organizing
content through well-defined categories and tags. This reduced the
time users spent trying to find what they needed.
Readable & Accessible
The previous blog page design made it challenging for users to quickly
scan important content. Links cluttered the interface, elements
blended together lacking visual definition, and categories and tags
were included in titles, making them difficult to read.
We simplified blog post titles, reorganized categories into tags, and
visualized them to improve clarity. We optimized line length and
height to enhance readability. This reduced cognitive overload and
made scanning pages faster and easier, enhancing the overall user
experience.
See next project
Restaurant Koster
2024
Enriching everyday dining experience.