Redesign the TV guide according to the new ODK 2.0 website brand guidelines

Enhancing user experience by providing direct visibility to updated programs and episodes categorized by the day, allowing easier access to browse live shows.

Go to TV Guide page
My Role:

To develop a new design system component, responsive design for the web, and conducting usability testing. I ensured that my work adhered to the Product Requirement Document (PRD) and collaborated with the UX design manager, product manager, engineers, and leadership.

Duration:

February  2023 - March 2023 (Release day)

- Opportunity

ODK users are currently experiencing challenges in discovering the most recent program updates and upcoming shows

- Challenges

The poor user experience in discovering new content led to a significant decline in ODK's user numbers within several months

OndemandKorea updates Korean shows on a daily basis, and it is crucial to keep users informed about the latest updates. Unfortunately, due to poor user experiences in discovering new content, ODK experienced a significant decline in user numbers within a couple of months after launching the new website.

- User Research

How might we improve user accessibility to the latest programs?

ODK 1.0 TV Guide design
  1. Quick and convenient access to the latest content.
  2. Represent the brand identity.
  3. Increase company revenue by sponsorship and ads.
  4. Easily search programs by days.
  5. Providing a seamless and cohesive experience aligned with the ODK 1.0 TV guide design.
- Proposed Solution

Display the TV Guide in the main banner

Pros

The TV Guide is already a existing feature on the ODK 1.0 website and is easily adoptable for users. It has been proven that this feature has the highest click-through rate.

Cons

The extensive coverage of the TV Guide in the main banner competes for attention with numerous other features on the homepage, creating potential distractions for users.

ODK 1.0 TV Guide heat map
- Usability Testing 01

How do current ODK users feel about finding the latest on aired programs on the ODK 2.0 website?

  • It is confusing and time consuming for users to discover the most recent programs by categories they want to search (News, Variety, Drama, etc...).

  • The "Recently Updated" and "Recently Aired" carousels are not distinguished and the terminology confuses users.

  • User Journey: Visit the OndemandKorea website -> discovering most up to date programs -> Up-to-date programs are mixed in with outdated content -> Users leave the website and the bounce rate increases.

- Research Data

The majority of the CTR (click-through rate) comes from variety shows, dramas, and documentary

Our data indicates that the variety shows, dramas, and documentary categories have the highest CTR overall on the website and attract the most viewing hours. As a result, the leadership particularly wants to emphasize these three categories in the TV guide.

- Prototyping, TV guide toggle

Finding strategies to improve program discovery without overcrowding the homepage with numerous features

The homepage is already packed with numerous features, so I had to find a way to avoid overcrowding the page. Additionally, the homepage banner includes multiple marketing posters, preview videos, and sponsorship banners, so I need to ensure that the TV guide doesn't cover these elements.

- Prototyping, TV Guide & ODK channel page

Combining TV gudie and ODK channel pages

Since the TV guide page has the most traffic, the leadership requested that the ODK channel page be added to the TV Guide. The ODK channel has advertising and it will increase the company's revenue quickly. My challenge was to find a way to combine two different pages into one.

- Usability Testing

ODK Channel toggle button design

During the usability testing I discovered, the participants are becoming confused due to a significant transition in interface design when navigating to different pages, such as tabs and ODK channel button are missing. 

TV Guide date picker design

The primary feature of this function is to provide users with a list of broadcasted programs organized by day. This feature was available on the previous OnDemandKorea website and had the highest click rates on the website.  The goal is to clearly inform users about the most up-to-date programs airing today and upcoming programs scheduled for tomorrow. To ensure the usability of the date picker in this process, a quick usability testing was conducted to identify any usability issues.

- Results

Significantly increased CTR within a short period of time

The TV Guide project was a huge success, increasing CTR by almost 1,900 after the feature was launched. We are looking forward to conducting more testing and adding new features that couldn't be implemented this time to further improve the usability of the page.

- Learning

Choosing the right design strategies for each project

When I have to execute a project in a short period, I face challenges in determining which design strategies to use to improve the usability of the product. Sometimes, I have to rely on assumptions if I don't have enough time for user research. In this project, I specifically applied competitor analysis, CTR datas, quick user interviews, and testing to create a user-friendly TV Guide, and thankfully, the project was a huge success.

Next Projects