Mashable

Mashable.com

As Mashable had become the foremost source for news on the rapidly changing landscape of the web – and which served the world's most socially connected audience – we felt we could assist in developing innovative features to help visitors connect with trending stories through mobile, social and visual means.

The team at Mashable identified three predominant types of users who were visiting the site and we adapted the feed delivery to a three-column layout, which was powered by Mashable’s proprietary Velocity technology, which predicts and tracks the viral life cycle of a story.

Code and Theory visualized this unique data on the homepage of Mashable, which was divided into three distinct columns.

  1. For users who want the top headlines of the day the “What’s Hot” column surfaces the biggest headlines.
  2. For readers visiting the site looking for trending articles to read “The Next Big Thing” column surfaces about-to-trend stories, as identified Velocity technology.
  3. For readers who want the newest content, a pure time-based feed was created so they could read all their industry news as soon as it was released.

A story then shifts from one column to the next as it continues its viral lifecycle.

Ec73de92691ca8999d115e4748534fbeda56ed45
2aeb708c4a095c40bacd1a1f76811f9a62344cb1

With Mashable readers on the front lines of the digital revolution, the new site features a fully responsive design that delivers an optimized reading experience across every screen – from desktop to tablet to mobile phone. Each of the three columns serves content as an infinite scroll of stories, which creates a frictionless and highly visual content discovery experience, complete with integrated dynamic ads that look great on every screen.

Given that social was such a significant driver of inbound traffic we wanted to ensure that the attention placed on the home page wasn’t lost as readers entered via the article page. With a feature we’ve come to refer to as the “transporter module” (where the bottom of the page scrolls into the top of another page) on Mashable, a visitor who reaches the end of an article automatically is scrolled into the section page from where that article lives.

Bringing the site’s social integration full-circle, we built in the ability to share not only whole articles but also individual elements of a story. Visitors can share “micro-content” – interesting quotes, images, or videos.

Pete Cashmore called the new Mashable a “faster, simpler and more enjoyable way to consume the news.”

Continue toThe Things We MakeProject

A Bold Vision for Healthcare

From patient-centric products to back-end systems for providers, we’re reimagining how healthcare is experienced.

Cultivating Community in Government & Education

We’re strengthening some of the most influential institutions through digital-first platforms and communications tools.

Pool
CNN

Reimagining the CNN Magic Wall

Midterm elections 2018

Read More
  • One of the most critical, hotly contested, and highly watched midterm elections ever
  • Modernized a 10-year-old product with a new look & feel and enhanced core feature set
  • Rebuilt the technology from the ground up, focusing on data security and performance

Hours of on-air use for 2018 Midterms

13

Evolving the Financial Services Model

We're transforming an antiquated industry through cutting-edge design—and driving the future of finance forward.

Disrupting the Digital Sports Landscape

We do it for the love of the game—pioneering forward-thinking experiences for sports fans of every stripe.

Promoting Travel & Hospitality

From staycation to spontaneous getaway, we help clients make the journey more exciting and efficient.

Recognition

Code and Theory

DIGIDAY

2019 Creative Agency of the Year
Award Digiday

Code and Theory

Ad Age

2020 Agency A-List
Award Adage

Code and Theory

Ad Age

2020 Best Places to Work
Award Adage

All Work

Get in Touch

Find Us

One World Trade Center,
62nd Floor

New York, NY 10007

More Offices

Work With Us

Press

Careers

See All Open Positions

Continue toSays a LotThe Things We Make

Says a Lot —

Get in Touch

Find Us

One World Trade Center,
62nd Floor

New York, NY 10007

More Offices

Work With Us

Press

Careers

See All Open Positions
,,