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.”

Driving B2B Growth

Partnering with some of the world's largest companies to fuel their business-to-business expansion.

Tipico Featured Module
Tipico

Succeeding on a Mission to Win Ohio

AOR leading an integrated campaign to capitalize on the moment and bring Tipico to market.

Read More
  • Challenging category conventions to create a differentiated connection with audiences
  • Speaking with Ohio sports fans the same way they speak to each other
  • Working in an Integrated Agency team to connect through all media channels, including the app

Evolving E-commerce to Fit Modern Audiences

We are shaping the digital transformation of the industry by creating strong connections between audiences and brands.

Screen Shot 2023 03 01 at 11 14 04 AM
Marriott Bonvoy

Reimagining Marriott Bonvoy as a Hub for Travel and Commerce

Evolving Bonvoy’s design system to be more modern and immersive while staying true to the core strong brand identity.

Read More
  • Mobile-First
  • Contextualized Conversion
  • Flexible Design and Content Systems

Leading With Empathy and Inclusivity

Having deeper conversations, widening the funnel, and driving innovation with an inclusive-first lens.

CASE CARD Blowout Top Image Size Image of 7680 432
Allspring

Speed to Market for a Portfolio Optimization Tool

Crafting a UI for a complex product through user input and clear data visualization.

Read More
  • Improving workflow processes through enhanced user interface design
  • Clear and simple data visualizations for complex data sets
  • Designing a roadmap to continue to iterate and optimize the product on a rolling basis post-launch

Transforming Education's Forefront

Defining the future of digital experiences in education.

Pfizer World| Shaping a Platform into a Beacon for New Priorities and Ways of Work

Pfizer World

<p>Pfizer World</p>

Transforming a platform into a meaningful beacon to set new priorities and ways of working.

Read More
Galleri| Introducing a Revolutionary Medical Feat to the Market

Galleri

<p>Galleri</p>

Creating the first B2C campaign and user experience for a first-of-its-kind cancer detection test.

Read More

Evolving the Financial Services Model

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

Award WebbyW3 0031Ad Age 0023

Recognition

  • Code and Theory

    Webby Awards

    2022 Best Magazine – Websites and Mobile Sites
  • Code and Theory

    W3 Awards

    2021 Best in Show General Websites-Associations
  • Code and Theory

    Ad Age

    2020 Agency A-List

All Work

 2023

Says a Lot —

Latest

News — 

Ringier | Leading International Media Company Ringier Appoints Stagwell’s (STGW) Code and Theory to Transform the Blick Brand

News — 

Code and Theory Takes the Stage at Web Summit Rio

News — 

PRNewswire | Code and Theory, a Stagwell (STGW) Network Company, is Building New Artificial Intelligence Capabilities with Oracle Cloud Infrastructure

News — 

PRNewswire | Stagwell (STGW) Marketing Cloud Taps Former Microsoft Chief Data Analytics Officer John Kahan, Code and Theory Chairman Dan Gardner as Advisors

News — 

PRNewswire | Code and Theory Network Agency Kettle Promotes Lauren Kushner to CEO

News — 

PRNewswire | Stagwell's Code and Theory Network Expands Its Digital Transformation and Engineering Globally with Addition of YML

News — 

Ad Age | Top 5 Diversity, Equality, and Inclusion Efforts To Know About Right Now

News — 

PRNewswire | Stagwell (STGW) Digital-First Creative Agency Code and Theory Launches Industry's First Holistic Inclusive Design and Marketing Strategy Discipline