typevoice_banner.gif

Typevoice

 

TypeVoice:

The first font shop powered by People's Voice

To celebrate The Webby Awards People's Voice 20th anniversary, Ogilvy NY created Typevoice, the first fontshop that allows anyone to create their own typeface using their voice. Scream, shout or sing and Typevoice will generate a customized font based on your unique soundwave. We created an algorithm that measured pitch, volume and time lapsed, allowing each letter to react in realtime (using two independent SVG animation timelines). People can share animated GIFs of their font or even download the vector of their typeface of their whole alphabet to use in their design projects. 

Visit www.typevoice.net for the full experience (the web app is only supported by Google Chrome and Firefox bowsers).

Details

The web application utilized GSAP to create two independent animation timelines—or two axes of motion, one driven by pitch and the other volume. The site runs in Chrome, is built in ES6 vanilla Javascript, uses GSAP & CSS animations for SVG images, and weighs only 1.5mb.

typevoice_step2.gif
typevoice_step3.gif
typevoice_step4.gif
typevoice_step5.gif

TypeVoice was very well received and was reported by Digiday, Ad Age, Bustle, The Drum, and tdc.

Currently, TypeVoice has won the following awards

  • Cannes Lions: Silver | Design and Cyber
  • D&AD: Yellow Pencil | Crafts for Advertising / Typography for Advertising
  • One Show: Silver | Design | Dynamic / In Motion
  • One Show: Merit | Design | Website Design
  • One Show: Merit | Direct Marketing | Use of Digital Technology - Single or Campaign
  • One Show: Merit | Interactive | Utility
  • One Show: Merit | UX / UI | Utility