Conde Nast CMS

- Cross-brand Common Modules

As the magazine delivering emerging fashion, beauty and pop culture for teenagers, Teen Vogue has 7.6 million audiences from print and digital. The redesign of teenvogue.com aims at representing the voice of the younger generation, also emphasizing the sophistication of our authentic content.

 

 
UX Design: Yanwen Hu, Yaya Wang
Infographic: Yanwen Hu

Skills:
  • Information Architecture: Data Analysis, Content Mapping 
  • User Experience Design: User Flow, Wireframe

Conde Nast

 

- Common Module Categories -

 

- Live Module Examples-

 


Process

Project Team: 1 Design Lead, 1 UX Designer and 1 Visual Designer

As UX designer in Teen Vogue redesign team, in charge of the UX process of site structure and template redesign

 
Skills:
  • Information Architecture: Site structure, Data Analysis, Content Mapping 
  • User Experience Design: User Flow, Wireframe

Data Analysis

  • Page views and unique visitors: Homepage traffic is lower compared to the whole site, but slightly higher than other brands; while Channel and Subchannel traffic is the lowest (around 0.5%)
  • High value audiences: compared to general users, high value users much frequently visit Teen Vogue homepage on desktop and mobile
  • Mobile traffic: in general, index page traffic on mobile is lower than desktop
 

Content Analysis

Problems

  • Mosaic layout on index pages: content is less organized and users easily get lost
  • Channels are not called out: currently the posts on homepage are based on time, and there is no content module featuring each channel
  • Editorial curated package: there is less flexibilities and opportunities for the brand to promote more curated content (ex. Best Dresses, Video, Instagram)

    Site Structure

    Problems

    • Content Taxonomy:
      • Some posts directly belong to channels, but not appear on any subchannels
      • Two index pages have not been covered in the site structure, like Designers (Fashion) and My Room (My Life)
    • Update Frequency:
      • A few Subchannels have not been updated in months, and still show content from last year  
     

    New Structure

    Content Logics:

    • Index pages should be arranged based on update frequency, content popularity and editorially curation
    • Take out redundant index pages, and also add the missing pages
    • Combine subchannels that have similar content
     

    Wireframes

    • started from paper sketch then narrowed down to two bigger directions: one much focus on the feed of content, which is more fresh and dynamic; another packages content based on different channels, which has more flexibility on editorial curation

     

    Visual Design

    • closely collaborated with visual designers to transform wireframes to visual design

     
     
     


    - More Related Projects -

    Conde Nast Traveler Redesign

    Conde Nast Traveler Redesign

    Epicurious Login, Profile, Recipe Box User Flow

    Epicurious Login, Profile, Recipe Box User Flow

    Glamour Event Hub Page

    Glamour Event Hub Page