Magnises Publishing Platform

Project Overview

Magnises challenged 99 Robots to bring both its publishing and reader experiences to the next level. Our goal was to blend publishing autonomy and extendability whilst ultimately providing the reader an optimal experience for engagement and exploration.

Our Approach

We knew from the start that simplicity was the key to this project and the design reflected this view. Infinite scrolling single-column content would allow users to focus while social media embeds would break up the stream. Whitespace was to be a close ally.

Project Implementation

The Magnises user experience needed to focus on content and imagery without drawing attention or distracting the reader with extraneous details. Black, white, and charcoal were chosen to be the primary color pallet while a bright golden yellow acted as a rare call to action highlight.

To further the focus on content, a single clean column would allow the reader to digest one row at a time. A fixed sidebar widget coupled with a contracting sticky header stayed out of sight, but always accessible for the reader.

magnises-staging-mockups

Endless Content

Pagination and the page load time that accompanied it were replaced with a superior user engagement technology: infinite scroll.

magnises-endless-content

Social Integrations

Showcasing the activity of Magnises’ social media accounts was vital to accurately portraying the brand. We utilized the APIs of both Instagram and Twitter in order to display a custom styled embed that would operate with our Infinite Scrolling mechanism.

magnises-staging-mockup-imac

One Size Does Not Fit All

We wanted to serve visitor intent without sacrificing white space or distracting the reader. We designed the website’s header to display differently based on which page the visitor was on and to change on scroll.

magnises-staging-mockups-2

Discover how we can help your business grow

We’ll get back to you within a day to schedule a quick strategy call. We can also communicate over email if that’s easier for you.

"*" indicates required fields

This field is for validation purposes and should be left unchanged.