Alphabet Adventure

Matt Rice of award-winning interactive design studio Sennep tells us about his admiration for the digital craft and attention to detail that has gone into making educational app Metamorphabet.

Cb2c7396 c588 4913 9c2f b929fb786b52

Metamorphabet is an interactive and animated alphabet which is aimed at kids but is executed with a level of digital craftsmanship that we could all learn from. At Sennep we’ve long been fans of Patrick Smith (also known as Vectorpark), the artist behind many browser-based games and apps. We’ve lost countless enjoyable hours exploring the surreal puzzle game Windosil or trying to get to the end of the sublime Feed the Head by swiping and poking the screen until the next obscure and beautifully conceived interaction reveals itself. As interactive designers we work in an industry that talks a lot about ‘crafted experiences’, ‘intuitive UI’ and ‘surprise and delight’. However, sometimes I feel like I hear about it more than I actually see it or experience it. Metamorphabet is an educational toy that has these things in abundance.

A big part of what makes Metamorphabet so pleasurable is that it is beautifully responsive and fluid. With every drag, tap, press or flick the user experiences a satisfying and playful interaction that moves them gracefully through the journey from A to Z. Every transition between different states feels perfectly considered and natural, even if the animation in question is a surreal bearded letter ‘B’, sprouting a beak for bugs to burst from, or a ‘W’ shaped walrus on wheels, riding the waves. It’s these unusual and unexpected transformations, full of subtle wit and charm, that keep the users engaged and immersed as the app introduces a total of ninety different words to illustrate the letters of the alphabet.

This series of imaginative interactive vignettes are perfectly surreal and are brought to life with a huge amount of character. One of my favourite scenes is the robot ‘R’ which runs relentlessly in the rain. As you chuck the robot into the air or try to push it over it stumbles back to its feet to continue on its way undeterred. However, if you leave it alone it eventually grinds to a halt and drops to its knees, seemingly ready to give up and rust in the rain. This slightly tragic hidden element provides extra depth that is typical of the app. The longer you explore and play with it the more you discover. It encourages exploration and rewards you with delightful surprises along the way.

The visual style is created using ‘flat’ (but still 3D) vectors which give this typographic world a convincing physicality, as does the bespoke physics engine which has been coded to give the piece its unique feel. The user interface is virtually invisible but springs to life, in typically assured style, when you need it. These elements all add up to a great example of a piece of interactive design that straddles the worlds of art, gaming, design, animation and code beautifully. And, to boot, it’s meticulously crafted.

This level of craft and execution is something to aspire to, or at least learn from in some way. As designers working in the digital world I think it is important to be able to think in motion and to be able take the user through an interactive experience in a seamless and delightful way. If you can evoke an emotional response in your users, it lingers longer in their memory and creates value that far surpasses pure functionality or basic usability. Metamorphabet does all of these and more, try the demo online but it is perfect for touch devices so I’d recommend splashing some cash on the app.