Station
Marcela Díaz
UX/UI Designer
Made with

Station

One app to rule all them

Are you a designer? developer?

Let me introduce you to Daniel. He is a Game Designer, tech-savvy, Station's app user. He prefers to bookmark the documents he considers the most important. As a developer, he is a fan of use shortcuts because he is a productivity driver.

Station

Do you relate to the image below?

Station

The voice of your conscience may be saying ..."Yes! that's you!"

So, for the ones who are 'tabs abusers'  there is an amazing tool to help you, but 77% of the people who answered the survey are not aware of it. The solution?

Station
Station

Stakeholder Interview

Before starting my discovery phase, I wanted to have a complete understanding of how Station App works.

Talking with Julien Berthomier the CEO of Station, I got very interesting insides about who is this product for. Who are Station's competitors? How does Station's team gather feedback from their users? What is the vision of the product?

This quote captures the essence of Station App:

"People tend to mix the things they use constantly (email, work tools) and things are more occasional (videos, articles). 

When we realized tabs were originally designed for something temporal, we saw a great opportunity to build something good."

Julien Berthomier, CEO

What are you able to do with Station App?

Station

Smart Dock

Station automatically groups your pages by application even if you have multi-account making it cleaner.

Station

Quick Switch

It’s an easy central way to search among your apps and pages.

Station

Distraction Free

Enjoy a dedicated space for all your work, away from the distractions of your personal apps.

But, too good to be true...

Station

Why?

Station replaced the tabs you had on the browser for the subdock, making the space of work cleaner. But if you are a visual person like Daniel, on the subdock you are going to see just letters. What if you need to get this important document you couldn't find with the quick-switch?

It's going to be frustrating. Which made me think...

How to improve Station to future users and for the ones already are?

Surveys

Through 80 answered surveys, I could analyze some habits users have surfing on their favorite browser. The stats below correspond to the question: 

What are the usual tabs you have open at one time?

80%
Email
60%
Social Media
56%
Work tools

Now, imagine you open your Email, your Social Media, and tabs work tools related... you would have around 7 to 8 tabs open. Add to this Youtube, the article you are reading, the headphones you saw on Amazon... you already have 10 to 12 tabs open in 1 window!!! 

The results of the survey show 81% of the users use bookmarks to not lose information they consider important; most of it work related.

Interviews

During the discovery phase of my project, I conducted several user interviews in order to get a better understanding of the most common problems users are facing when they navigate on their multi-tabs.

Those were the quotes which grabbed my attention:

  • “I usually have a lot of tabs and I get confused which tab is where"
  • It’s annoying to close all the tabs except for the few ones I always use”
  • “The tabs are not sorted by groups

Thanks to the interviews I realized Station App provides you a very efficient way to organize your tabs. But the users of Station App now are getting lost in their apps. Why? Users kept having the same habits using their favorite browser inside Station App.

Station

Pain Point

Daniel starts his morning frustrated when he opens Station App as he cannot find easily the documents he has been working on the subdock.

How might we help Daniel start his day of work not being lost in the subdock of Station App?

Let's make things happen!

Station

Round Robin

I had a Round Robin session with 3 students of web-development of Ironhack, Paris.

Throughout the session, they told me what would be ideal for them as developers, productivity drivers, and users of Station.

Suggestions:

  • Have the tabs highlighted, if they consider them important.
  • Have a reminder why I open that tab at first place.
  • Automatically group the tabs with the same category.

Station

Sketches

I usually start the design process with low fidelity sketches. This is the way I iterate through many design options quickly.

  • I started with brainstorming sessions to create something real. Through sketches I translated the ideas into graphics. 
  • The main purpose of those sketches is after the ideation phase, be able to test what it is considered the solution of a problem statement.
  • Be active and efficient in Agile method.

Station
Station

UI Design

Once I tested out all usability mistakes, I started designing the final screens in Sketch.

  • Station App follows a corporate visual style. The colors of the app change depending on the hour of the day. It means Station App is the tool which works with you from early morning until midnight.
  • Station App developed their own UI, inspired by iOS Styleguide.
  • Station App was developed using Sketch as a tool.
  • In base of the discovery phase, I used Windows 10, Stations App community, and Dribbble as inspirations.

Being part of the solution

I used Google Drive as an explanation to demonstrate how Station App can bring into their interface the conception of tabs, but this time the tabs would be grouped by app. I took the Google Drive app and grouped the tabs depending on the extension such as PDF, Google Slides, Google Documents, etc. With this solution, I made the user flow easier to find a document in what Station called "the subdock" every time the user opens their Station App.

Prototype: Station

Station

User testing

Before launching the product, I've made a testing round in order to reveal possible usability problems.

One of them is when the Bookmark icon is next to the title, the user clicks on the frame or document inside the Drive.

Station

The user prefers the pop-up window fade-off instead than clicking ‘close’ button action.

"Marcela did an awesome job proposing UX improvements to our product: she quickly digested our users’ pains and came up with creative and straightforward solutions.
Her designs were elegant and blended perfectly in our current interface: great work!"

George Abi-Heila, Station's Growth Manager

What have you learned from this project?

  • Having the experience of improving Station App as a work tool was a big challenge. Station App has a very clear MVP; the tool has a lot of potentials features and it wasn't easy to identify the problems the users faced.
  • During the discovering phase, the answers I got from surveys and interviews wasn't what I expected would be the problem. Being UX Designer, you have to put your own conception apart and put yourself in the mind of the user, be their eyes, understand their frustrations to be able to make a good design and answer their needs. 
  • Thanks to the people who contributed to my design process, I could design something meaningful that inspired the team of Station App to solve and improve some features of this efficient tool.