MAGic Browser redesign
Internet Browser for Smart TV, set-top box MAG 410
Situation

Infomir is going to produce brand-new set-top box on Android TV OS. Users usually complain receiver doesn't have some Internet Browser on board.
Task

Do design for the Internet Browser based on Android TV guidelines. Navigation should be supported by standard remote control of MAGs and Auras set-top boxes.
Action

On this project I had a new role for me — a Product Owner.

So before I started any wireframing I did research. We know — UI Design (even beautiful one) worth nothing without a good user experience. People have a job to be done with this browser.

Target audience — technically savvy people.

I decided to use JTBD framework to know why people "hire" the Internet browser on TV. To collect these insights I interviewed people who use this one.


Job to be done

When I came home after my work, I want to watch my favorite series from the service which is not available at the Store, so I can open the browser, go to the website and watch my favorite TV series.

The key is to open something which is not available on the receiver.

For instance:
- Demonstrate your website on some Conference
- Watch TV series from favorite service which is doesn't have own it's app
- Surfing the Internet

I've found out that people even use a keyboard for this purpose.

When I have my favorite website, I want to open it easily within one click, so I can add it to the Bookmarks and select the page from a shortlist quickly.

During a brainstorm my team and I shared ideas of future functionality. I believe this one is a good practice. The list of functionalities was created according to user needs.
My task was to reinvent the Internet Browser within the Android TV guidelines. Everyone who has ever used Google Nexus receiver noticed that it is very easy to use. You know what you get by clicking here and know how to back to the first page. Consistency is a key.



Flows
First visit: open the app for the first time > 1st page with predefined shortcuts.
User with a history: open the app for the second time > 1st page with shortcuts to opened tabs, Most popular, Recent e.t.c.
Tab in focus: move focus to the right > focus on tab — a screenshot on a BG helps you to check what this page is about.
New tab: move focus to the right > press "New Tab" > focus is in an input field > write a request > press "OK" on a remote control.

What have I learned from this project?

In task like this it's important to think out of the box, conduct brainstorms, let the team share ideas. Must have functionality for the 1st version must be based on: 1) user needs, 2) CJMs, Personas, JTBD and competitors analysis. I didn't put personas here (they lived on a whiteboard :)), but for a TV device users this kind of technic is important for understanding of how to do it in a right way. In case of design for Smart TV you mustn't avoid platform guidelines, so keep guidelines and consistency with the platform look and feel — are mandatory rules.