Skip to content
quineFXAboutResumeContact
Prev04 / 04Next

Tracklines

A sound you follow down a mountain trail to a story

The Tracklines poster: a fir tree whose trunk becomes a running figure with roots for feet, over layered mountains
The Tracklines poster (my art), 2007: "take only cellphones, leave only footprints".
Client
Banff New Media Institute, with Parks Canada
Year
2006–07
Role
Interaction designer; graphic and animation design
Tools
After Effects, Illustrator and the rest of the Adobe suite, Nokia N70, Bluetooth GPS, Mobile Experience Engine (J2ME)

01 The idea

Tracklines was a walk with stories in it. Hikers on the Hoodoo Trail in Banff National Park carried a Nokia N70 phone and a Bluetooth GPS unit on a velcro armband, and the trail was seeded with story points. Our 2007 treatment called it a "walkumentary": closer to a museum audio tour or a sound walk than a game. It also put the whole interaction in one image: the trail flooded with "a responsive musical fluid of different densities trapped inside the shapes of mapped polygons". You find a story by hearing it get warmer. One trail could carry several walks at once, stacked "like invisible stratigraphy" and picked from a Layer Selector; the first, Geology: A Walk Through Time, was co-authored with Parks Canada.

Banff New Media Institute, ART Mobile Lab, March 2006 to March 2007, as part of the Mobile Digital Commons Network, funded by Canadian Culture Online. Parks Canada's Banff EcoIntegrity Project co-authored the geology walk: six story points on the Hoodoo Trail.

02 What the phone showed

Each story point is a set of nested rings. Walk into the outer ring and an ambient sound and a drawing start on the phone; closer in, both build. At the centre a short "hook" sound plays and the screen resolves into a menu: Play Story or Move On. Move On asks once more; after the story, Play Again or Move On. Walk away past the reset zone and the point re-arms. The phone could stay clipped to your belt the whole time: the screen was there for people who wanted it. These are the Limestone point's screens, in order, from the schematic.

The rings, per the 2007 schematic: region 3 at 60 m, region 2 at 40 m, region 1 at 20 m, and a reset zone 15 m beyond.

  1. a0 · the map, between story points
  2. Region 3, 60 m · ambient sound, and the drawing starts
  3. Region 2, 40 m · louder, and it grows
  4. Region 1, 20 m · the hook, then Play Story / Move On
  5. Move On asks once more: Play Story / Skip It
  6. The story plays
  7. After the story: Play Again / Move On
  8. A boundary hotspot: off the story zone, or a side path

03 Why there's no demo here

I built a version of the walk for this page, a map you could drag a hiker across, and took it out. Tracklines was designed as an added layer over surroundings that were already majestic: the Hoodoos, the Bow River, Tunnel Mountain above you, the sound arriving while you walked. The phone was never meant to be the point. Recreating that in a web page is somewhat futile, so this page shows the work that went into it instead: the screens, the animations, the documents.

04 One story, as it played

The Limestone story as the phone played it when you chose Play Story: the drawing grows in, then the narration.

g_v1h1, 3:23, at the phone's 176 × 208 pixels, shown twice size. Narration by Emily Paige, Davide Di Saro and Angus Leech; audio by Davide Di Saro with Geoffrey Shea.

05 My part

I was the interaction designer. I designed how the phone behaves around a story point: the rings, the menus and their second chances, the fail-safes for a hiker who walks off in the middle of a story, and the controls. I made all the graphics and animation for the geology walk, and the Tracklines poster and logo art. And I drew the technical schematic and flowcharts the engineer built from: every screen, every asset name, every state.

The control rules, from the schematic: the joystick works left and right only, "to minimize accidental button presses". "0" always opens the Layer Selector and "#" goes back. The application starts by itself when the phone powers on.

06 Concentric navigation: a concept test

A navigation clue, tested as a motion study in June 2006 (by the file dates). Far from a story point the rings look random: loose, broken, out of register. The closer you get, the more concentric they become, until they lock into one target at the hotspot: an abstract, game-like compass. The test carries on past that point, the target tilting back, stacking into layers and falling through the centre. The walk we shipped used growing drawings on the screen instead, but nested rings stayed the model for every story point.

Concept test, 0:50, silent, looping.

07 The concept, frame by frame

Eight frames from the same test, at the phone's screen size: random when you're far away, more concentric as you close in, locked into a target at the hotspot; then the target tilts back, stacks and falls through.

  1. 0:00 · far away: random
  2. 0:07
  3. 0:11 · getting closer
  4. 0:16 · at the hotspot: concentric
  5. 0:27
  6. 0:32 · tilting back
  7. 0:36 · stacking
  8. 0:52 · falling through

08 The intro movie

Pick the geology walk and the phone plays its intro first: what the walk is about and how to wear the kit. The treatment calls it "essentially a pre-hike tutorial". The animation is mine; the sound is Davide Di Saro's with Geoffrey Shea, and the narration is by Emily Paige, Davide Di Saro and Angus Leech.

Intentionally kitsch!

The geology walk's intro movie (g_intro), 2:47, at the phone's 176 × 208 pixels, shown twice size.

09 The drawings grow

Each story point had its own drawing, labelled like a plate in a field guide, and I animated each one drawing itself: the line work builds, then the detail arrives. The treatment notes that video at each hotspot "exceeded the memory capacity of the mobile phones", so on the phone the rings show stills: stages of these drawings growing in.

  1. fig.01 · crinoid with fish · Limestone
  2. fig.02 · orographic clouds with airplane · Water
  3. fig.03 · douglas fir with ravens · Douglas Fir
  4. fig.04 · fold with fir tree · Mountain Building
  5. fig.05 · hoodoo with red sun · Erosion
  6. fig.06 · hoar frost with ice insect · Glacier

10 One drawing, five days

The Water drawing across five working days, from the dated files: December 18, 19, 20 and 21, then January 7, when the clouds got their colour.

  1. Dec 18, 2006
  2. Dec 19
  3. Dec 20
  4. Dec 21
  5. Jan 7, 2007

11 The schematic

Fourteen pages, March 2007. The file directory, the phone controls, the Layer Selector, the hotspot locations with their GPS coordinates, both flowcharts, the media key, and a screen-by-screen spec of every asset, ending with the boundaries. Open a page and use the arrow keys to read through.

  1. p.1 Cover
  2. p.2 File directory
  3. p.3 Phone controls
  4. p.4 Layer Selector: architecture
  5. p.5 Layer Selector: specifications
  6. p.6 Hotspot locations, Hoodoo Trail
  7. p.7 Flowchart: startup
  8. p.8 Flowchart: hotspot
  9. p.9 Reference: the media descriptor
  10. p.10 Reference: legend and region sizes
  11. p.11 Autostart and Layer Selector phase
  12. p.12 Hotspot interaction graphic
  13. p.13 Hotspot interaction specifications
  14. p.14 Boundary interaction specifications

12 What the trail taught us

We tested it on the trail with volunteer hikers, using participant observation and other ethnographic methods with Concordia's EMU group and OCAD. The rings worked, but hikers almost never left the path to chase a sound. Story points placed off the trail, or only brushing it with their outer rings, were "almost universally overlooked": people heard the clues build and fade and kept walking. So the points went onto the path itself, into "bottlenecks" where they "can't be missed". The treatment called that section "Loaded Breadcrumbs".

The 2007 treatment calls Tracklines "the first fully operational mobile phone and GPS-based mediascape to be developed in Canada specifically for a wilderness trail environment", and Parks Canada's first venture into locative media.

From our 2007 design treatment

Ultimately, the design of Tracklines aims at providing hikers with a secondary enhancement or augmentation to their experience – never at becoming the main point of the hike itself.

13 Related

Tracklines application · ART Mobile Lab

Lead Artist / Producer
Angus Leech
Mobile Applications Engineer
Rupinder Deol
Interaction Designer
Christopher Quine
Audio Designer
Davide Di Saro
Original Tracklines Concept
Angus Leech with Greg Judelman

Tracklines logo

Original Concept
Davide Di Saro
Graphic and Animation Design
Christopher Quine

Geology: A Walk Through Time

Concept and Script
Sarah Hoyt and Angus Leech
Lead Experience Designer / Producer
Angus Leech
Graphic, Animation, and Interaction Design
Christopher Quine
Audio Design
Davide Di Saro with Geoffrey Shea
Engineering / Site Implementation
Rupinder Deol
Voice Narration
Emily Paige, Davide Di Saro, Angus Leech

Banff New Media Institute

Director and Executive Producer
Susan Kennard
Next in Client work · 01 / 04Within Our Reach In production