FlummoxVision™

Early generation iPad showing the Flummoxvision app

Flummox and Friends, a Kickstarter-funded live-action comedy for autistic and neurodivergent kids launched in the early 2010s. The team developed a dedicated iPad app through which kids could watch (and rewatch) their favorite episodes and shorts, and parents could purchase new content as it became available. I had shipped my first iPhone app and was excited to continue my growth in user interface design.

iOS7 had recently launched, introducing a textureless, “flat” design language for glass touchscreen devices. But the show’s visual aesthetic was cluttered and tactile, taking cues from Bill Nye and Beakman’s World and MST3K.

Early generation iPad showing the Flummoxvision app

I looked to the past, seeking to evoke the look of clunky mid-century mechanical interfaces—film and filmstrip projectors, naval and aerospace equipment. Metal and plastic, with visible screws ostensibly holding the thing together. I added sound effects of buttons clicking, switches flipping, and springs being stretched while scrubbing through the video timeline.

But within the mechanical frame, the interface for selecting and purchasing, or navigating through chapters, would employ the flat colors, translucency, and fluid responsiveness of Apple’s new design language.

Early generation iPad showing the Flummoxvision app. Subtitles are active. We see two faces grimacing at the camera, with the subtitle: “♪ I notice your face and your expression ♪”

The app supported quirky kids’ love of subtitles with a prominent “switch”, and included a parent- or teacher-guided mode called “Discuss”, in which cast members’ faces would appear to ask questions about the social situations being depicted in the show. (The app and the content were developed in partnership with speech and language pathologists.)

Early generation iPad showing the FlummoxVision app in “Discuss” mode. A character’s face is shown with the text prompt “Paying attention even when you’re not completely interested in the topic sounds difficult. Do you have any tips?”

When AirPlaying the content to an Apple TV, I didn’t want to “grey out” the volume button, so I created a panel that slid up to cover the controls.

Early generation iPad showing the FlummoxVision app in AirPlay mode.

Two of my favorite details in the app were the startup screen (evoking a television test pattern), and the “get info” pane, which I fashioned as if it were a metal plate.

Early generation iPad showing the FlummoxVision startup screen. Information pane from the FlummoxVision app. FlummoxVision™ is a product of Flummox Labs LLC. Oakland, Calif. U.S.A. Executive Producer Christa Dahlstrom, Designer Chris Ereneta, Developer Karbon, Curriculum Specialists Liesl Wenzke Hartmann MA, CCC-SLP and Jordan Sadler, MS, CCC-SLP

This is one of the projects I’m most proud up, but I no longer have an iPad that runs the app, and it is no longer available for download from the App Store. Still, it was a thrill to see it featured by Apple during Autism Awareness Month in 20r4.

Screenshot from Apple’s iPad App Store, featuring Kids apps for ages 9–11. Flummox and Friends is highlighted in the hero position.