Web Design + Development | Darren Hoyt Dot Com

Case Study

Beatport Live

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

Press

Beatport Will Bring Videos, Curated Playlists to Spotify

via Billboard

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 app for OSX. 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 OSX 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:

Control panel window, Beatport Live for OSX

In parallel with OSX 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 OSX

Results: in 6 months, the Live product has evolved from a wireframe sketch to a multi-platform service with a web-based dashboard, OSX 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

Maternity Neighborhood EHR

The flagship app of a new breed of healthcare startup, the EHR dashboard is only product of its kind to provide midwives with real-time maternity data.

Maternity Neighborhood was founded by midwives who were seeking more efficient ways to strengthen communication between pregnant women and providers. They teamed up with software engineers and became the first in the industry to build tools for scheduling, billing, and EHR data specifically for midwifery clinics.

I worked closely with a midwifery advocate to explore how providers traditionally handled patient intake and the challenge of getting a technology-shy industry to embrace our apps. We looked at the heirarchy of data that providers needed from a dashboard and designed around a mix of personal and clinical data, experimenting with colors and typography favored by midwifery clinics.

I also worked with MN's in-house creative director to realign MN's marketing website, build it on WordPress and hand it over to their team to take the reins:

Revised homepage for Maternity Neighborhood

Results: with new design assets a completely refactored EHR product, Maternity Neighborhood reps were able to show off the new tools at conferences like Health2.0, win "Innovator of the Year" awards, and make workflow easier for a new generation of midwives.

Case Study

Readability

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

Press

Apps Alter Reading on the Web

via NYTimes

Readability gives free online news inbox with upcoming Apple apps

via CNN

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:

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.

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.