Menu

WNYC
CHROME TAB EXTENSION

Type: UX design, web development
Tool: Sketch, HTML/CSS, Javascript
Date: Dec 2016
Reviewd by: Marine Boudeau

This tab extension offers main and top 3 stories from WNYC website and directs you to the website to see more stories and listen related podcasts.

PROBLEM

While working at WNYC as a UX design intern, I was invited to kick-off meeting to discuss how Digital Product team can draw more visitors to WNYC website and increase live-streaming radio listeners. One of my ideas was to make a chrome tab extension.

WHY NEW TAB EXTENSION?

The new tab page is something you look at for a lot more time than you think every day. Rather than seeing blank page or most visited websites, it should be more meaningful if the tab has functionality and attractive design.

So I came across this new tab extension idea. This tab provides latest trending news along with radio podcasts from WNYC, current weather and time. Since the objective was to increase visitors to WNYC website and live streaming listeners, this should be good way for users to stay updated on news and podcasts and get easy access to the website.



FIELD RESEARCH AND IDEA SKETCH

Before working on wireframes, I looked up existing google tabs on the app store. I found inspiring examples that have similar functions or design with the tab I’m creating.

WIREFRAMES

Before working on wireframes, I looked up existing google tabs on the app store. I found inspiring examples that have similar functions or design with the tab I’m creating.


Final Design

CODE

I also made working prototype using HTML, SASS and Javascript for the future use. I still need to add WNYC API to extract articles everyday, but I made it up and running like what I exactly planned at the beginning. You can see the code on Github by clicking the button below.

SEE CODE HERE
BACK TO WORK