DD_logo

The Daily Dot Website Redesign

The Daily Dot Website Redesign

The Daily Dot Website Redesign

Fall 2015–Spring 2016  •  Wondersauce

Fall 2015–Spring 2016  •  Wondersauce

Fall 2015–Spring 2016  •  Wondersauce

Team Members:

Team Members:

Team Members:

  • Joseph Delaney III Product Director
  • Dana Pensabene Product Management
  • Greg Frye Visual Design
  • Rob Junge Visual Design
  • Joseph Delaney III Product Director
  • Dana Pensabene Product Management
  • Greg Frye Visual Design
  • Rob Junge Visual Design
  • Joseph Delaney III Product Director
  • Dana Pensabene Product Management
  • Greg Frye Visual Design
  • Rob Junge Visual Design

The Daily Dot is the ultimate destination for original reporting about Internet life. With its unrelenting and sometimes controversial pursuit of all things digital, The Daily Dot prides itself as the hometown newspaper of the World Wide Web... but a strictly digital newspaper of course.

The Daily Dot is the ultimate destination for original reporting about Internet life. With its unrelenting and sometimes controversial pursuit of all things digital, The Daily Dot prides itself as the hometown newspaper of the World Wide Web... but a strictly digital newspaper of course.

The Daily Dot is the ultimate destination for original reporting about Internet life. With its unrelenting and sometimes controversial pursuit of all things digital, The Daily Dot prides itself as the hometown newspaper of the World Wide Web... but a strictly digital newspaper of course.

The Daily Dot is the ultimate destination for original reporting about Internet life. With its unrelenting and sometimes controversial pursuit of all things digital, The Daily Dot prides itself as the hometown newspaper of the World Wide Web... but a strictly digital newspaper of course.

“Everything we cover is either created for the internet, unfolding on the internet, or happening around the internet.”

“Everything we cover is either created for the internet, unfolding on the internet, or happening around the internet.”

“Everything we cover is either created for the internet, unfolding on the internet, or happening around the internet.”

The Daily Dot team came to us needing help. With over 20 million pageviews per month their online publication had grown impressively and they were ready to take their site to the next level. A lot of people were ending up on the site but they didn’t know where they were, most were only reading one article, and they weren’t attracting the advertising partners they wanted.

The Daily Dot team came to us needing help. With over 20 million pageviews per month their online publication had grown impressively and they were ready to take their site to the next level. A lot of people were ending up on the site but they didn’t know where they were, most were only reading one article, and they weren’t attracting the advertising partners they wanted.

The Daily Dot team came to us needing help. With over 20 million pageviews per month their online publication had grown impressively and they were ready to take their site to the next level. A lot of people were ending up on the site but they didn’t know where they were, most were only reading one article, and they weren’t attracting the advertising partners they wanted.

The Daily Dot team came to us needing help. With over 20 million pageviews per month their online publication had grown impressively and they were ready to take their site to the next level. A lot of people were ending up on the site but they didn’t know where they were, most were only reading one article, and they weren’t attracting the advertising partners they wanted.

Goals

Goals

Goals

  • Make sure people know they’re reading The Daily Dot
  • Increase monthly active users
  • Get visitors reading more stories
  • Make social sharing a breeze
  • Attract advertisers
  • Make sure people know they’re reading The Daily Dot
  • Increase monthly active users
  • Get visitors reading more stories
  • Make social sharing a breeze
  • Attract advertisers
  • Make sure people know they’re reading The Daily Dot
  • Increase monthly active users
  • Get visitors reading more stories
  • Make social sharing a breeze
  • Attract advertisers
Daily Dot_flex2

Understanding the problem

Understanding the problem

To build an appropriate site for The Daily Dot team we needed to intimately understand how they worked. We knew what they wanted so then we needed to uncover what was holding them back from reaching their full potential. We kicked things off by investing a solid amount of time getting to know key team members across all the major roles and responsibilities in the content creation process.

To build an appropriate site for The Daily Dot team we needed to intimately understand how they worked. We knew what they wanted so then we needed to uncover what was holding them back from reaching their full potential. We kicked things off by investing a solid amount of time getting to know key team members across all the major roles and responsibilities in the content creation process.

This project was just as much about creating a premium experience to elevate the brand as it was about empowering the team with the right tools to succeed.

This project was just as much about creating a premium experience to elevate the brand as it was about empowering the team with the right tools to succeed.

The team was looking for a beautiful, sophisticated, and premium experience that would match the level of their editorial quality. One of the major things holding them back from this was their quality of artwork that serves as the face of each article they publish. We discovered that while The Daily Dot team worked like a machine cranking out 60-75 articles a day, they didn’t have the resources to produce compelling and high quality artwork for each and every article.

The team was looking for a beautiful, sophisticated, and premium experience that would match the level of their editorial quality. One of the major things holding them back from this was their quality of artwork that serves as the face of each article they publish. We discovered that while The Daily Dot team worked like a machine cranking out 60-75 articles a day, they didn’t have the resources to produce compelling and high quality artwork for each and every article.

Article triage

Article triage

Surprisingly, the original site only used a single article template. A 200 word article written in 15 minutes and an in-depth 5000 word article based on weeks of reporting both looked exactly the same. We knew this needed to change and in the end we had three unique article templates (in addition to a video specific template).

Surprisingly, the original site only used a single article template. A 200 word article written in 15 minutes and an in-depth 5000 word article based on weeks of reporting both looked exactly the same. We knew this needed to change and in the end we had three unique article templates (in addition to a video specific template).

Daily Dot_flex

We created a flex template for the shorter more quick-hitting pieces (roughly 40% of their content). These articles feature small graphics that can be produced quickly dramatically freeing up the team's time. Imagine using a gif, screenshot, or quickly isolating a small image from its background.

Daily Dot_feature

We created a feature template for middle to longer length posts with a bit more substance (roughly 50% of their content). These are the articles the graphics team would get to focus on and spend time crafting custom artwork or finding high quality photos.

Daily Dot_super feature

The super feature template was reserved for the highest quality reporting (roughly 5% of their content). This template allowed for immersive full screen hero modules with custom background colors. It's immediately recognized that this is a special piece of reporting they've invested in.

Human curation meets data driven automation

Human curation meets data driven automation

Any publishing site is a complex web of interconnected content and topics for users to explore and dive into. While the idea of an editor hand selecting which articles will be featured where sounds great, human curation can only go so far on a site of this size. We wanted human curation to play an important role in the site but we also knew data driven curation could play a helpful role in managing the site and making life easier for the team.

Any publishing site is a complex web of interconnected content and topics for users to explore and dive into. While the idea of an editor hand selecting which articles will be featured where sounds great, human curation can only go so far on a site of this size. We wanted human curation to play an important role in the site but we also knew data driven curation could play a helpful role in managing the site and making life easier for the team.

The site uses three types of curation: manual in the Editors' Picks sections, data driven in the Popular sections, and time-based in the Latest sections.

The site uses three types of curation: manual in the Editor's Choice sections, data driven in the Popular sections, and time-based in the Latest sections.

SectionScroll2

This page starts with an Editors' Picks section followed by a Popular and then Latest section.

This page starts with an Editors' Picks section followed by a Popular and then Latest section.

Topics in the news are always changing. A topic like eSports may have lived only as a tag on an article a few years ago but for The Daily Dot that topic has now gained enough popularity to be its own dedicated section of the site. For this project we spent a lot of time studying how topics make that journey. We designed unique page types for each of the stages along the way fine tuning the amount of content on each and the curation methods that would be used.

Topics in the news are always changing. A topic like eSports may have lived only as a tag on an article a few years ago but for The Daily Dot that topic has now gained enough popularity to be its own dedicated section of the site. For this project we spent a lot of time studying how topics make that journey. We designed unique page types for each of the stages along the way fine tuning the amount of content on each and the curation methods that would be used.

A topic might first appear on the site as an article tag which you could click to see all articles with that same tag. If at some point it trends, it might also temporarily appear as its own stream page. As a tag becomes more established it might then become officially recognized as a topic page (which includes an image description and allows for an optional manually curated pinned post). Topics that become popular enough can evenutally graduate up to a subcategory page before lastly becoming it's own section or vertical on the site.

A topic might first appear on the site as an article tag which you could click to see all articles with that same tag. If at some point it trends, it might also temporarily appear as its own stream page. As a tag becomes more established it might then become officially recognized as a topic page (which includes an image description and allows for an optional manually curated pinned post). Topics that become popular enough can evenutally graduate up to a subcategory page before lastly becoming it's own section or vertical on the site.

A topic might first appear on the site as an article tag which you could click to see all articles with that same tag. If at some point it trends, it might also temporarily appear as its own stream page. As a tag becomes more established it might then become officially recognized as a topic page (which includes an image description and allows for an optional manually curated pinned post). Topics that become popular enough can evenutally graduate up to a subcategory page before lastly becoming it's own section or vertical on the site.

Daily Dot_finale

Starting from the left and in order of hierarchy: Here you can see a tag page, a stream page, a topic page, and then a vertical page filtered down to a specific subcategory.

Starting from the left and in order of hierarchy: Here you can see a tag page, a stream page, a topic page, and then a vertical page filtered down to a specific subcategory.

Starting from the left and in order of hierarchy: Here you can see a tag page, a stream page, a topic page, and then a vertical page filtered down to a specific subcategory.

To make managing the site easier we crafted its architecture to be mostly self-sustaining. The system would keep tabs on the shifting news landscape and use that data to inform editors of when and where to curate posts. It would also provide intelligent alerts when it might be time for a topic to move to the next stage of significance in the system.

To make managing the site easier we crafted its architecture to be mostly self-sustaining. The system would keep tabs on the shifting news landscape and use that data to inform editors of when and where to curate posts. It would also provide intelligent alerts when it might be time for a topic to move to the next stage of significance in the system.

To make managing the site easier we crafted its architecture to be mostly self-sustaining. The system would keep tabs on the shifting news landscape and use that data to inform editors of when and where to curate posts. It would also provide intelligent alerts when it might be time for a topic to move to the next stage of significance in the system.

Daily Dot_architecture

This diagram maps out the content buckets for each of the system pages on the site. Note how the majority of the content curation is automated. Also note the progression of content amounts and types as the system pages increase in hierarchy.

This diagram maps out the content buckets for each of the system pages on the site. Note how the majority of the content curation is automated. Also note the progression of content amounts and types as the system pages increase in hierarchy.

This diagram maps out the content buckets for each of the system pages on the site. Note how the majority of the content curation is automated. Also note the progression of content amounts and types as the system pages increase in hierarchy.

*Additional process available upon request