How to build an online presence of a TV channel

2,990 views

Published on

UI Design process of zingtv.in

3 Comments
2 Likes
Statistics
Notes
No Downloads
Views
Total views
2,990
On SlideShare
0
From Embeds
0
Number of Embeds
15
Actions
Shares
0
Downloads
0
Comments
3
Likes
2
Embeds 0
No embeds

No notes for slide

How to build an online presence of a TV channel

  1. 1. User Interface Design India’s leading Entertainment TV Channel - www.zingtv.in
  2. 2. This presentation is NOT about INTEGRATION DEVELOPMENT MAINTENANCE India’s leading Entertainment TV Channel - www.zingtv.in
  3. 3. This is ONLY about DESIGN India’s leading Entertainment TV Channel - www.zingtv.in
  4. 4. Previously known as Zee Music 24 hour entertainment channel from the Zee Group Reaches out to Australia, New Zealand, Bangladesh, Fiji, Hong Kong, Indonesia, Philippines, Sri Lanka, Japan, Maldives, Thailand & Middle East India’s leading Entertainment TV Channel - www.zingtv.in
  5. 5. DESIGN Wireframe Design Design Comps Client Approval India’s leading Entertainment TV Channel - www.zingtv.in
  6. 6. To understand Design requirement I had a meeting in Zing TV, Mumbai with Marketing and Corporate Communication Team. Client responded to the Web Design Questionnaire. This helped me understand client’s expectations and needs. Thus, I figured out the Design Objectives & Features. India’s leading Entertainment TV Channel - www.zingtv.in
  7. 7. Create Online Presence Brand Awareness Act as a touch point with TV viewers & Internet users Information – Entertainment – Interaction Look & Feel – Trendy, Light, Cool, Funky India’s leading Entertainment TV Channel - www.zingtv.in
  8. 8. Information on Shows & Schedule of channel Bollywood/Hollywood News & Gossips Celebrities Image Gallery Discussion Forum Streaming Videos Fan Club, Poll, Contest, Downloads, Search India’s leading Entertainment TV Channel - www.zingtv.in
  9. 9. Version 1 India’s leading Entertainment TV Channel - www.zingtv.in
  10. 10. Zing TV Logo Login & Sign Up Link to Zing Channel on YouTube Search Main Navigation Menu India’s leading Entertainment TV Channel - www.zingtv.in
  11. 11. Celebs Images / Hot Gossip / Music / Movies Flash Slideshow India’s leading Entertainment TV Channel - www.zingtv.in
  12. 12. Zing Shows Listing Pane Heading Link to More shows Show Name & Time Show ID Thumbnail Currently Showing India’s leading Entertainment TV Channel - www.zingtv.in
  13. 13. Zing Schedule Heading Show Name & Time Currently Showing Show ID Thumbnail India’s leading Entertainment TV Channel - www.zingtv.in
  14. 14. News & Gossip Tabs Featured Photo Gallery of Bollywood Stars India’s leading Entertainment TV Channel - www.zingtv.in
  15. 15. Bollywood Movie Contest Poll India’s leading Entertainment TV Channel - www.zingtv.in
  16. 16. Download - Wallpapers Spotted with a Star Upload Picture Wish to Stars India’s leading Entertainment TV Channel - www.zingtv.in
  17. 17. Version 1 India’s leading Entertainment TV Channel - www.zingtv.in
  18. 18. I provided one more option by switching “News & Gossips” and “Shows” pane Eliminated “Featured Photo Gallery” & “Spotted” India’s leading Entertainment TV Channel - www.zingtv.in
  19. 19. Version 2 India’s leading Entertainment TV Channel - www.zingtv.in
  20. 20. Latest News & Gossip on Zing Heading News & Gossip Tabs RSS Feed India’s leading Entertainment TV Channel - www.zingtv.in
  21. 21. Zing Shows Listing Pane Show ID Thumbnail Heading Show Name Show Description India’s leading Entertainment TV Channel - www.zingtv.in
  22. 22. Version 2 India’s leading Entertainment TV Channel - www.zingtv.in
  23. 23. Client didn’t like the grunge look and the red bricks in page background which was actually creating a zing. They insisted for a plain vanilla. Also they wanted to see how page will look like if we add Discussion Forum and Games. I did slight changes in version 3 to fit these features and kept rest of the things same. India’s leading Entertainment TV Channel - www.zingtv.in
  24. 24. Version 3 India’s leading Entertainment TV Channel - www.zingtv.in
  25. 25. Discussion Forum Bollywood movies based Games India’s leading Entertainment TV Channel - www.zingtv.in
  26. 26. Version 3 India’s leading Entertainment TV Channel - www.zingtv.in
  27. 27. Plain vanilla thing worked out well. Overall appearance of Design was good. Client decided to develop the features – Discussion Forum and Games in Phase II. We changed the place of YouTube Channel link from Masthead and made it more prominent on homepage as a clickable Banner. We also added Facebook Fan Club link as a clickable Banner on homepage. We shifted the Zing Shows pane downside and added HOT videos Thumbs pane below the flash slideshow. leading Entertainment TV Channel - www.zingtv.in India’s
  28. 28. Version 4 India’s leading Entertainment TV Channel - www.zingtv.in
  29. 29. Revised Masthead India’s leading Entertainment TV Channel - www.zingtv.in
  30. 30. HOT Videos on ZING TV India’s leading Entertainment TV Channel - www.zingtv.in
  31. 31. Zing TV’s YouTube Channel India’s leading Entertainment TV Channel - www.zingtv.in
  32. 32. Zing TV Fan Club on FACEBOOK India’s leading Entertainment TV Channel - www.zingtv.in
  33. 33. Zing Shows Listing Pane India’s leading Entertainment TV Channel - www.zingtv.in
  34. 34. Version 4 India’s leading Entertainment TV Channel - www.zingtv.in
  35. 35. …and client finalized Version 4. I added red smoky waves and dotted pattern in page background which was actually going with the theme of Channel Packaging. This design was carried forward for Design Production. We shifted the Zing Shows pane downside and added HOT videos Thumbs pane below the flash slideshow. India’s leading Entertainment TV Channel - www.zingtv.in
  36. 36. Thank You! Neelima Salvi Product Design Manager, DMCL Email: neelima.salvi@gmail.com @amileens India’s leading Entertainment TV Channel - www.zingtv.in

×