RankingSEO is a Web-based app for SEO practitioners. I help redesign the experience of tracking keywords and comparing complex data.

My role
User research, prototyping, UX design, UI design
Results
Retention rate doubles
Increase of clients in news and media industry
Introduce UX mindset to the teams
Set the design principles for RankingSEO
Framing the problem

It all starts from a request - Users need a tag system.
But why? Why users need it and what do they want to achieve?

For an advanced SEO practitioner, chances are they need to track tons of different keywords at the same time. For one thing, they need a simple way to manage keywords. For another, a friendly dashboard to help them easily notice changes and compare data is needed. And these two were what RankingSEO fails to do.

Behind the request of a tag system are the real user pain points, which are...

Pain point 1

Users found it difficult to manage keywords. The picture below is that they show me how they do it with Excel during user interview on google meet

Pain point 2

Users found it difficult to compare the data

Build & Align

To leverage our team’s knowledge, I decided to conduct a series of internal user studies with a powerful tool - paper cutouts UI.
With paper cutouts, a fun environment that is easy-to-exchange thoughts was set up in the process

After understanding our users’ goal and pain points, I drafted many different concepts UI cards, then cut them out and set up sessions with team members, where I asked them to redesign the information and data table. Those drafts served as triggers to make them think.

It was a huge success! Not only was it fun, I was able to see them think out loud in a user perspective. For example, everyone mentioned to improve the information hierarchy and how data sorting. I also learned from developer team what data would be hard to show.

Ideas are fully discussed and they also added new features with post-its. e.g. What if user can pin certain keywords so that they don’t need to filter it out all the time?

Test & Iterate

I took all my learnings from the paper cutout sessions with teams, then narrowed in on 3 main use cases for the following testing to validate the ideas.

After much discussion, main goals that we want users to achieve have become clearer. And these goals become the task scenarios in the following testing.

case 1 : tag & filter keywords

Here comes a task from your manager. In response to the company's goal for next month, he wants you to manipulate these 5 big data-related keywords and keep an eye on their performance, and finally export a report containing only these five words to him.

case 2 : pin the keywords (new)

Find out the keywords whose rankings are on the google first page and are improved compared to 30 days ago. And to easily track those words next time, you need to add them to the pin board.

case 3 : compare the data

You need to export all the keywords whose rankings are behind your main competitors A, C and E to your manager.

Test with hi-fi prototype and conduct the session with clear rules to make sure we make the most of it.

A pilot round was be hold first with my own team members. As for the second round, I recruited users from other teams in our company. We tested 5 users within 3 days.

Handoff & Release

Keywords and the tag system

The tag system is important but what we learn from our test is that users don’t want to be disturbed while doing the most important thing - tracking their keywords. In other words, the tag system shouldn’t be over emphasized than keyword itself. So I work closely with developer to make sure the color, the way it shows and also hides are clear but not annoying.

User can quickly filter out keywords with same tag, then compare himself with his competitors in no time.

Data table

We have made great changes in the information architecture. First, data was seperated into two tabs according to different user behaviors, tracking project keywords and comparing with competitors. Then, with appropriate titles and sorting function, it allows user to analyze information to derive insights.

Besides, a lot of effort are put on subtle improvements to make the data table more friendly, e.g. fixed header, zebra stripes, pagination and display density, sortable column and selected action

The Design Principles that gradually reached consensus in the process.

During the discussion, we noticed that questions like “ Is it clear and clean? ” or “ Is is friendly for users to compare? ” are mentioned so many times. It prompts us to think what’s the appropriate principles for our product to guide us in making decisions.

principle one : clear

A SEO practitioner gets exposed to lots of data per day. We want to make sure that every data is meaningful to them on our product.

principle two : easy-to-compare

With tons of data shown directly is useless. To make users act on it, we allow users to compare, filter and sort in order to derive insights.

We release the new design within 3 months, which doubles the retention rate and keeps receiving positive feedbacks from users. In short, our users track more keywords and come back more often to monitor their performance than before.