Case Study

Air

A new generation of digital asset management (DAM) tools for enterprise teams.

Air Labs was founded in 2017 by 2 Stanford grads with a track record of high-profile projects focused around streaming video. Early iterations of the platform focused on consumer experiences and limitless video storage, but it soon pivoted to focusing on team collaboration around both video and photos.

I came aboard as first hire in March 2017 and immediately began a discovery process with the founders to figure out messaging and and how we wanted to position the product. For months, we researched, talked, and wrote before beginning to sketch out what a more robust digital asset management app could look like, starting with onboarding and authentication.

Authentication screens, Air for iOS

As more React devs came on board, we collaborated to build a custom camera, asset galleries, and collections that used in-house transcoders, plus additional UIs for adding tags, description, and other metadata.

Camera, gallery, floating action, player, asset details

As we transitioned to an enterprise self-service model and picked up more users, we built out the web experience which included customized Boards for presentation, dashboards, and image recognition. With enterprise came the idea of team workspaces with membership management and granular permissions.

Login, Sign up
Asset gallery, dashboard

As designs matured, our design system became more codified and I focused on issues like process, vocabulary, and communication with dev teams so that the system would facilitate handoff more easily.

Excerpts from "Zephyr" design system

Results: within 2 years, I'd developed a comprehensive design system ("Zephyr") in Figma to account for every color, type style, and UI component, which sped up feature development.

With this system, I designed complete user flows for both iOS and web. I helped recruit an illustrator to flesh out Air's branding and evolve our marketing presence. Enterprise teams loved the new app and Air continues to rapidly evolve and acquire new users.

Case Study

BNED Courseware

Mobile React-based educational apps for Barnes & Noble Education Inc.

BNED's team had already built the javascript scaffolding by the time they contracted our agency Postlight to consult on the design and project management required to refine the platform and release it to universities across the country.

I worked at the client site collaborating with their development team, creating a design system, writing SASS, and integrating with their React framework.

Mobile Safari views

Results: the courseware platform was ultimately absorbed into BNEd's Bartleby product, a student success hub which has been adopted by hundreds of American universities.

Case Study

Beatport Live

Live is the lastest product on the Beatport roadmap, a streaming DJ platform to broadcast live sets.

In 2004, Beatport began as an online store and news hub for electronic music culture. When it was purchased by SFX in 2013, it became part of a larger umbrella that included ticketing, live events and streaming music. As more energy was being placed around large festivals, SFX strategized how to develop tools to deliver the live experience to fans around the world.

In January 2015, I came on board to create a distinctive theme and overall design language for the new product that would be consistent across many contexts: streaming channel pages, branded events, DJ dashboards, ads, and a Mac desktop app. My first challenge was to design the web-based channel pages that would capture the frenetic feel of a live event:

Festival channel page, Beatport Live for web

While working with developers to build out artist and event pages, I also began sketching the forthcoming Mac app. The app uses native audio and video sources for livestreaming events, queuing upcoming streams, and tracking stats in real time. I worked closely with a Mac developer to design and build something consistent with our web products and still feel native:

Login screen, Beatport Live for Mac
Live
Control panel window, Beatport Live for Mac

In parallel with Mac app designs, I also put together a marketing page to promote new features and invite DJs to be whitelisted for early access:

Marketing and download page, Beatport Live for Mac

Results: in 6 months, the Live product has evolved from a wireframe sketch to a multi-platform service with a web-based dashboard, Mac app, branding partnerships and successful streams for international festivals like Tomorrowland which attract up to a half-million simultaneous viewers. Live content also factored into the 2015 deal with Spotify.

Case Study

Readability

A popular bookmarklet that grew into a reading platform and a #1 spot in the App Store.

The problem Readability aimed to solve was simple enough: to clean up noisy, distracting web content. The original bookmarklet was an Arc90 lab experiment that removed ads and marginal content with a click, rendering the article as a clean, simple, single column of text with beautiful typography.

In late 2010, Arc90 put together a small internal team to develop Readability as a full-scale reading platform. After launch, its unorthodox profit-sharing model with publishers made the mainstream news and started larger conversations about funding journalism. Hoefler Frere-Jones agreed for the first time to have their type rendered as a webfont, greatly enhancing the legibilty in the iOS app.

Before the initial launch, I worked with another designer to establish basic identity components from logo mark to colors and typography. I designed and built multiple iterations of what eventually became the marketing page:

Landing page design

Soon after came mockups for the mobile web views which handled offline syncing and streamlined sharing, but primarily served as a stopgap until the iOS apps were released 2 months later.

Mobile mockups

Results: over the course of a year, Readability went from a lab-based experiment to a successful platform that stayed #1 in the App Store for weeks, led to partnerships with Teehan + Lax, led innovation among time-shifted reading tools and inspired many similar apps.