Role: UX Designer | Timeline: 2 weeks |  Platform: Desktop Website

Challenge: Rough Draft (LLC) wishes to deliver meaningful and relevant, location-based video content to its users. Creating a platform that will entice users to stay informed while simultaneously engaging with their local community through short personal interviews.

Solution: Designing a memorable and easy-to-use platform with a friendly and recognizable brand. Presented with a organic interface that'll speak to the function of the page and the iterative nature of the name Rough Draft.

“Not your typical news source...in fact, not a news source at all.”
— Andrew King, Founder of Rough Draft

Product: Rough Draft-- a discoverability website.

Specific to Washington D.C., Rough Draft (LLC) gives users information related to their area in an unconventional way-- through interview-format, streaming video. The interviews range between 2-3 minutes long and are uploaded daily. Targeted user bases are millennials as well as young D.C. professionals.

DESIGN PROCESS

PRELIMINARY SCREENER SURVEYS

In order to have a clear understanding of the necessary production categories, a screener survey was sent out to the target audience. This helped determine the interests of the users and filtered out categories of little impact to the local demographic. The top contenders were:

  • Culture/Food (58.7%)
  • Travel (56.5%)
  • Careers/Health (52.2%)

COMPETITIVE ANALYSIS

20 different competitors were included in a detailed competitive analysis

  • Majority of competitors want to appeal to young professionals/millennials 
  • 14 of the 20 competitors allow for commenting on articles
  • All competitors allow social sharing options
  • Competitors arrange stories by category
  • U-stream and Cheddar – charge for monthly subscriptions
  • 17 of the 20 competitors had a sign up/sign in option 

    TASK ANALYSIS

    Usability testing was conducted for competitor sites to understand target pain points.

    TARGET USERS WANT

    • Visually stimulating imagery
    • Clear and intuitive categories
    • FREE access to browse 
    • Short-segmented videos
    • Social sharing options

    USER PERSONAS

    BRAND IDENTITY

    This logo was user tested on its memorability, and yielded 100% positive results. Users were allowed to examine the logo for 10 seconds, and then asked to recreate/sketch it 10 minutes later. 100% of the users remembered the logo and could easily recreate or describe it after the designated time. 

    Users were also provided with 7 pre-selected colors for 7 designated information categories.  They were subsequently tasked to assign a color to a corresponding category that made sense to them. These colors are purposed not to be intrusive, but to serve as a connection from the user to the actual content.

    HOME PAGE

    User testing and feedback reflected a need to utilize a header for maximum effect. As a start up, Rough Draft expects a wave of new users visiting the site for the first time. This results in a weighted value placed on a necessary tagline or logo over actual content provided. After conducting A/B testing on 3 versions displayed to the right, users preferred the 3rd (bottom right image) over the previous iterations. Users were able to access videos faster, without clutter or confusion.

    Other Features:

    • Each video previews a brief description on the topic and the featured speaker. A hovering effect over the text provides the user with further details on each selection.
    • Users can access RoughDraft without logging in. They are only prompted to sign-in if/when they wish to save a video to their account. There is a save feature on every video allowing users to return to previously liked or archived videos.
    • The categories highlighted on the home page has a small line above it with a coordinating color. These colors are also reflected above all corresponding videos in that selected category as well as their specific landing pages.

    SELECTED CATEGORY PAGE

    To connect the user with the content, Rough Draft presents a responsive page. Each landing page simply underlines the page selected from the primary navigation bar. It also has a corresponding search function allowing the user to filter by 'popular today,' 'popular all-time,' and 'most recent.'

    The mobile version of Rough Draft will feature landing pages with a dominant search icon within a sticky navigation bar, allowing the users easy and immediate access to archived media.

    SELECTED VIDEO PAGE

    Each page will stay in theme with its corresponding color and category. The streaming video interview will be highlighted within a bright overlay. In addition, a short profile about the interviewee will appear alongside the content, connecting the user further. This page will also have social sharing icons and related videos guiding the user to continued exploration within the site.

    Rough Draft is the brainchild of D.C. advocate and social entrepreneur Andrew King. The concept was developed over several meetings, however it requires further research and funds before a public unveiling.

     

    FUTURE ENHANCEMENTS

    • Compile an adequate database of archived interviews
    • Develop the website
    • Execute a comprehensive marketing strategy
    • Expand from the DC to other metro areas
    • Implement a mobile app with exclusive features including personalization
    • Receive notifications regarding upcoming interviews