Designing Across Devices at Zee5: Mobile and Connected TV
At Zee5, as a product designer in the engagement charter (2022–2024), I worked across mobile, web, and connected TV. Each medium came with its own interaction model and constraints, and the work shifted accordingly, from designing for touch and scroll on mobile, to remote-operated UI on connected TV.
The four projects here reflect that range.
Making mobile games discoverable on the Zee5 homepage
In early 2023, Zee5 decided to introduce hyper casual games to its mobile app as an alternative source of entertainment. The challenge was that people did not expect games on Zee5, and since this was an experiment, minimum change to the navigation was desired. The core question was how to make the game row discoverable and identifiable within an existing content-heavy homepage.
I explored 3 directions (images below). The first made the row visually distinct from other content rows. The second guided users toward the row through onboarding. The third used motion graphics, as moving thumbnails have higher click-through rates. I tested all three with users. The motion banner above the rail was the only option noticed by the majority, and they correctly identified it as games.
The row launched with 12% conversion, compared to 2% for a video row at the same position. Research also revealed that the word 'free' significantly influenced engagement among non-subscribed users, which shaped the final UX copy decisions.
Direction 1 : Make the row visually different than the other rows
Direction 2 : Guide them to the game row
Direction 3 : Use motion graphics as moving thumbnails have higher CTR
Designing a dedicated page for mobile games
Upon the success of the games row, a dedicated games page was required. The two questions I started with were: what do people expect from a games page, and what makes them play or not play.
I ran a competitive audit of games pages across Netflix, JioGames, MX Player, and Facebook, and conducted an in-house workshop with participants across age groups. This surfaced the key expectations:
Multiple categories (puzzle, arcade etc) of games
Newly launched games
'My games' to quickly dive back into the games one played
Leaderboards, online games form a major part of the experience in social gaming
Game trailers
Dedicated spaces for popular or promotional content
I distilled the page structure into three zones: a promotional space at the top, a continue playing module for returning users, and a discovery space for browsing.
For discovery, I moved from Zee5's traditional horizontal rows to a grid layout. App data showed that only 20% of engaged content sat under(left swipe) horizontal scrolls, and a limited catalogue in rows would give users a perception of fewer games. The grid evolved further with filter chips for scalability and social validation through player counts, addressing a finding that people hesitated to admit they played games because 'they are for kids'.
For continue playing, I explored five directions from simple thumbnails to streak-based motivation. Streak-based continue playing saw 95% conversion, and 50% of users who landed on the games page played a game.
Explorations for game discovery
Exploration for continue playing
Music Search for iOS
As Zee5 extended its music offering to iOS, the search flow had to be built from scratch. I started with an audit of the existing Android search experience.
There was a 50% drop from search entry to query typing.
The keypad did not open when users entered the search stage.
There were no results shown during zero query and typing states. Other platforms show relevant results at these stages which lead to users finding their content easily.
Results were fetched only after the search was executed.
If a query returned nothing, the system gave no feedback.
I redesigned the flow around search stages, addressing each drop-off point while following Apple's Human Interface Guidelines for search fields. The new flow introduced results at zero query and typing stages, auto-opened the keypad on entry, and communicated system status clearly when no results were found.
I distilled the page structure into three zones: a promotional space at the top, a continue playing module for returning users, and a discovery space for browsing.
Error Management for Connected TV
Errors are unfortunate and frustrate people. Error management lets users take simple remedial actions to resolve errors they might encounter while watching videos on Zee5. Users are not keen on calling a customer care helpline and waiting for several minutes. I designed an experience that lets high-intent users resolve encountered errors by themselves.
Designing for TV is different from mobile or desktop in two key ways.First, TV is remote-operated. In contrast to touch interfaces, every action requires more effort. So the focus was to present all necessary information upfront, minimising the need to explore, and streamlining resolution to as few button presses as possible. Second, people typically watch TV from a distance of around 10 feet. Intricate layouts are not appropriate. I simplified layouts, opting for vertically stacked arrangements.
