Firefox OS TV
UI Design I Interaction I 2016
Panasonic Smart TV, powered by Firefox OS, is optimized with HTML5 and provides a strong performance of Web apps. I was in charge of designing UI for the Home screen, the Application deck, the Device deck, and UI interaction.
OUR GOAL
Designing for large screens like a TV is different from what we are used to on mobile or tablet. TV's are usually located in the center of a living room. It brings people community, entertainment, and relaxation on a large scale. Our goal was to design new intuitive and customizable user interface, allows quick access to favorite channels, apps, websites. And not only to be functional but to bring users a delightful experience as well.
Moodboard
WAVEY BUTTON CONCEPT
People are drawn to the calming nature of waves. It has the ability to relax your body and mind. I wanted to bring that experience to TV. When the TV sits on the home screen for a while, the buttons begin to mimic the ocean waves, delivering a comfortable vibe to your living room.
Once you click on a button, it begins to encircle and cover the screen before bringing you to the next page, much like a wave washing onto the surf. You can see the animation example above.
HOME SCREEN OVERVIEW
APP DECK DESIGN
App Deck - Users can browse more content with our built-in web store
APP DECK DESIGN
Device Deck - Here you can set up and pair with the different devices
MAKE CONTENT MORE ENGAGING
RESULT
We successfully prove the flexibility and power of the Web as the platform across different devices. The product launched in Japan and few Asia countries. After launched the product, we conducted a few more rounds of field research and user testing and getting more direct feedback from users.
Seamless motion improvement
Educate hidden functions
Enhanced browsing experience
Discover content
PRESS SOURCE
Common controls design list