ATVPlayer

Advertise on tvOS Player

ATVPlayer is a white-label product from Zensis Limited. It is the first video Ad supported tvOS player SDK and already implemented on ViuTV tvOS app, which is one of the major TV broadcasters in Hong Kong.

My job is to create a sales and marketing driven portal site by outlining features and techniques behind, designing a simple identity and setting up basic SEO to get more exposure from search engines.

index_hero_mobile.png
Homepage graphic showing key features of the product

The project took me about two weeks to finish, all materials are created in a rush but in an acceptable quality. I created all graphics, branding assets on the App Store, as well as coded the whole site on my own.

There are few things I took careful consideration when making it:

The Product Name — ATVPlayer

You may curious about why it is called “ATV” and may think of a shutdown TV broadcasting company, but unfortunately, the name just came up by for temporary use without much deliberation. Anyway the product targets globally, my goal is to avoid the product look alike to the following:

ATV shut down in 2016

The identity had to be totally different from ATV Channel, therefore I used a grotesque but modern font as the logotype, with 3 colours overlaying each other to visualise its lively and possibilities. The primary purple-blue is also not commonly seen, it definitely creates uniqueness throughout the site.

 

logo_light
ATVPlayer Identity

 

SEO

My second concern was setting up basic SEO. If you’re an experienced marketing officer, my work is just the fundamental ones, but it was a good start to know and do it yourself.

Headings & Metadata

H1 to H6, everyone should know this! During our discussion, we always swap keywords between H1 and H2 (or meta title and description) and arguing which one deserve more importance. Back to basics, if we thought like target customers (managers), we definitely search for keywords like “tvOS”, “Apple TV” or “Video Ad” than technical terms “VAST videos” or “SRT” (unless you want to promote your GitHub Project).

Call to Action

Next, we added CTAs towards “Contact Sales” on each page, which is very crucial to us for making money! Adding these buttons might be annoying, but we also provide different CTAs based on the context to let people find out more before buying.

I ♥️ SVG

I usually export PNGs for app projects, therefore I’m always thinking my life will be much easier and the interface will look nicer if images are all vectorized. Indeed a clean SVG can be a lot smaller than pixel images, I can’t think of any reasons not having SVG in the site.

 

screencapture-atvplayer-zensis-index-html-1497275179644.png
Homepage Screenshot

 

Afterword

This is a rather small task compared to client projects. I developed the whole site in HTML and CSS on my own, with some help from a developer on JavaScript issues. Although the work may not show off my skills, design and thinking comprehensively, it was a good chance to develop skills other than design.

Client ATVPlayer – Zensis
Role Design Lead (Zensis): UX, UI, Front-end Development
Platform Responsive Web