iPad displaying Tabletop app

Tabletop

Music Environment for iPad

Overview

Tabletop is a modular music environment for the iPad. Based on the idea of a literal surface with interconnected music-making devices, users can select from more than 30 devices including samplers, mixers, effects, sequencers, and more, shipping with a core group of devices with the rest available as in-app purchases. I was responsible for wireframing and skinning many of the app's devices as well as collaborating on its global interface and workflows.

Projects within a project

To describe the scope and extent of work that went into Tabletop, it helps to break it off into pieces and parts. Most of my responsibility was in the designing of specific devices: their behavior, functionality, look and feel, and, in many cases, the sounds that shipped with them. For many of these features and projects, I was involved on nearly every level: concept, naming and branding (where applicable), UX/wireframes, visual design, graphic production, and, in some cases, sound design and/or XCode compositing.

M8RX TONE MATRIX

The M8RX emulates popular tone matrix devices, providing the ability to program up to 32 unique patterns. The device features over 60 original sounds with the ability to change the scale and key of playback. Challenges in this device included how to navigate between different octaves, how to accommodate multiple pattern banks, and how to simulate illumination without hitting the iPad processor too hard.

M8RX wireframe excerpt
M8RX wireframe excerpt
M8RX tone matrix, in use
M8RX tone matrix, key popover

GRIDLOK TOUCHPAD SAMPLER

Based on the industry standard for touchpad samplers, the MPC2000, Tabletop’s Gridlok offers 16 pads for live play as well as numerous presets and a workflow for recording samples in-app.

Gridlok wireframe excerpt
Gridlok wireframe excerpt
Gridlok touchpad sampler, in use
Gridlok touchpad sampler, recording sample

SPINBACK TURNTABLE PLAYER

SpinBack allows users to load in music from their local library, in-app recordings, or from the AudioCopy clipboard. Its pitch adjuster, tonearm, and platter simulate the hands-on experience of a turntable.

SpinBack wireframe excerpt
SpinBack wireframe excerpt
SpinBack turntable, default state
SpinBack turntable, playing audio

MASTERMIND (INTER-APP CONTROLLER)

When Apple announced inter-app audio compatibility, Mastermind served as a new controller for any active compatible audio app on the iPad. Used in conjunction with Tabletop’s MIDI Learn feature, its controls can be mapped to any compatible parameter in the selected app.

Mastermind Inter-app Controller wireframe excerpt
Mastermind Inter-app Controller visual design

MIDI LEARN MODE

To route controls within Tabletop to external controllers, users can enter MIDI Learn Mode and map specific controls to their connected hardware.

MIDI Learn wireframe excerpt
MIDI Learn wireframe excerpt
MIDI Learn workflow, zoomed out design
MIDI Learn workflow, zoomed in design

VARIOUS AUDIO EFFECTS

Many of Tabletop’s effects occupy a quarter of the screen, all based on a carefully considered system of proportions that account for graphic perspective, pre-defined button and knob dimensions, and in/out ports for audio routing. Initial effects shared a similar visual language, naming, and branding, while later effects deviated to instead emphasize uniqueness and freshness.

Tabletop Ekko Delay, wireframe
Tabletop Filter effect, wireframe
Bit-Crush effect, wireframe
Autopan effect, wireframe
Various Tabletop effects, visual design
Various Tabletop effects, visual design