marchaprilpreview2015

COMMUNICATION ARTS INTERACTIVE ANNUAL 21

Carson Ellis Martin Schoeller mousegraphics Lewis Communications Mexican Type Design Student Showcase Exhibit

I

A

N T

N

E

N

R

U A

A

L

C T

I

2 March/April 2015 Twenty-Four Dollars commarts.com

V E

1

Aʄɼɾɸɿɲ A ʄɼɾ MOUSEGRAPHICS ET

By Robert Urquhart

As Grecians have distilled oil from olives since ancient times, so, too, has Athens, Greece, design firm mousegraphics distilled brand identities to their graphic essences since 1984.

T

he creative director and owner of mousegraphics, Gregory Tsaknakis, decided upon the design firm’s name when digital graphics were replacing analog—the mouse instead of the pen. mousegraphics’ stark, stylish and, on the surface, simple packaging design complements its products—from local olive oil to Chinese matcha tea—but beneath the surface, there is often a positive tension at play. The studio is very much interested in the “conversation” between the product and the consumer—how the contents react to the packaging and where decoration and communication meet. Tsaknakis sums up the studio design philosophy by saying, “For every product, we must find the hidden element and produce the image; the Greek word for ‘image’ is icon.”

It’s befitting, then, that the studio itself has become somewhat of an icon in the realms of identity and packaging design. Each passing year brings more recognition; in 2014, the studio won seventeen awards, including three Red Dot Awards for communication design and four separate European Design Awards (two bronze and two as finalists). The awards circuit has brought international attention and acclaim to the studio and its designs, which are not bound by the aesthetic conventions of commercial industry sectors. In the hands of mousegraphics’ multidisciplinary creatives, nostalgic images of glamorous pinups befit packages of spatula putty, and intricate pen-and-ink studies of antique spoons decorate sugar packets (and thus the dining tables where they are served). The studio excels at these unlikely pairings and the distinctive allure they hold for a brand’s audience.

The designs, and the creative team behind them, draw from a range of creative influences and disciplines. In his role as the avuncular overseer, Tsaknakis says, “Everybody here has different skills, different characteristics. I want people who can bring their design personality into the process.” Tsaknakis started out as a designer 30 years ago, working on his own. Since expanding the firm with additional staff in 2000, the creative team has grown from three people to eleven. The 2004 Olympic Games were a major catalyst in bringing new business to creatives in Athens, something to which those at mousegraphics attribute the wider wave of design progress in the region.

The present team is formed of nine designers and two administrators, with more women than men in the group. Two on the design team are also illustrators, Ioanna Papaioannou and Kostas Kaparos. Kaparos, in particular, appears to have an in-house style of freeform pen-and-ink graphics that cements a particular contemporary Mediterranean aesthetic at points in mousegraphics’ portfolio, including its work for the Ron Finley Project, Food Wealth, Sun Wines, and the Chinese ideogram–inspired Gaea oil and vinegar for the Chinese market.

Tsaknakis is keen to explain that he brought together a team whose members complement each other. Kaparos, Kostas Vlachakis and Joshua Olsthoorn collaborate on each project that

Captions were supplied by mousegraphics.

Right: “Our brand identity for Foodscross premium honey conveys the product’s specific advantage: its purity. Distinguished for its extremely high concentration of thyme pollen grains—80 percent—this rare natural product is synthesized in an eco-conscious batch process. We developed the logo design as a careful pairing of cross-shaped lettering and the image of a bee, drawn for us by renowned London-based illustrator Si Scott. We topped the elongated glass vessel with a label extending over the lid that allows the collector’s data to be clearly visible even when the top is removed. Black, white and red dominate the packaging design, colors reminiscent of pharmaceuticals and cosmetics.” Gregory Tsaknakis, art director/ creative director; Thalassinos Anastasiou, designer; Si Scott, illustrator; Foodscross, client.

52

Interactive Annual 2015

ɲ

Communication Arts | commarts.com

53

INTERACTIVE ANNUAL 21: MOBILE

The Boxtrolls: Slide ’N’ Sneak “Cinematic and playful, it pushes the expectations of what an app can look like and delivers unusually charming entertainment.”

—Tali Krakowsky ff0000games.com/#/box_trolls

Overview: The Boxtrolls: Slide ’N’ Sneak is a mobile game that follows the storyline of The Boxtrolls film. Players help the Boxtrolls rescue their friends, who have been captured by the Red Hats.

The game features simple tap and swipe controls: tap to jump and swipe down to slide. Combining well-timed slides and jumps can result in launching Boxtrolls high into the air and over obstacles, a satisfying effect that appeals to a wide audience of novices and seasoned gamers alike. The game uses the native gyroscope in mobile devices to provide a sense of depth. Menu scenes twist and move as the user tilts the device, creating a parallax effect that is both stunning and natural.

• The game is built in Adobe AIR running the Starling engine.

• Game play is enhanced by music, voices and sound from the movie.

• So far, the game has been downloaded well over a million times, and the average user plays for 30 to 40 minutes at a time.

RED Games, a division of RED Interactive Agency (Santa Monica, CA), project design and development Focus Features/Laika Studios/Universal Pictures, clients

152

Interactive Annual 2015

“Beautiful illustrations, settings and actions. The only downside? I kept playing it when I was supposed to be judging other projects.” —Eric Karjaluoto

Comments by RED Games: What was the most challenging aspect of the project? “We had to figure out how to create a mobile game that was an appropriate companion to The Boxtrolls, so it needed to be highly visual and incredibly detailed. In order to re-create Laika’s unique animation style in a touchscreen experience, we opted to animate 2-D photographs of the actual mockettes used in the film. We used traditional animation techniques and relatively primitive technology to achieve our ideal level of quality on mobile devices. Although this was more timeconsuming, it was important to us that the Boxtroll characters appeared to be more than just static images in the game. This technique let us maintain the film’s richly textured aesthetic and painstaking details in retina-quality graphics and create a mobile experience that truly represented Laika’s style.”

Are there any other technical features you’d like to call attention to? “We developed a new 2.5-D engine that allowed us to create 3-D parallaxing environments more efficiently. It’s essentially a drag-anddrop tool that allowed us to quickly arrange and build scenes that have a realistic 3-D look and feel.”

Were there any specific demands that made the project easier or harder? “We needed to design a game that was accessible and appealing to a diverse audience of casual gamers and nongamers, males and females. We decided to give users a simple set of controls that yield highly rewarding results. The game doesn’t require complex inputs from users in order for the characters to perform exciting actions. You can be a low- to mid-skilled casual gamer and still feel like you can master this game.”

Communication Arts | commarts.com

153

INTERACTIVE ANNUAL 21: OTHER INTERACTIVE MEDIA

ELO Teddy Bear “Of all the entries I viewed, this one is my favorite. It’s refreshing to see technology used to positively impact others.” —Eric Karjaluoto Overview: The ELO Teddy Bear was created to ease the loneliness and suffering of children going through cancer treatment at Hospital Amaral Carvalho in São Paulo, Brazil. Often these children must remain completely isolated because of the frailty of their immune systems, and they may spend several weeks without seeing their friends and families. The ELO Teddy Bear is an interactive solution that takes advantage of the way children bond with their toys in order to help the young patients feel less alone without compromising their treatment. With a simple squeeze, the hypoallergenic teddy plays recorded messages from loved ones.

• DM9Rio was responsible for the idea, and 3bits developed the technological solution.

• FOM, a pillow manufacturer, designed a bear specifically for the project.

• By pressing the bear’s hand, children can play messages from their loved ones, which are remotely transmitted to the toy.

Herbert Rafael/Ricardo Wagner, 3bits, creative technologists Guilherme Cunha, DM9Rio, art director Otto Pajunk, DM9Rio, writer Diogo Mello, DM9Rio, creative director Álvaro Rodrigues, DM9Rio, chief creative officer Renato Fachim, DM9Rio, strategy Mauricio Luiz, programmer Junio Vitorino, 3bits, technology director Sonido, sound designer Monique Lima, DM9Rio, project manager Lincoln Alves/Gabriela Silva, 3bits, production designers Sullivan Henrique, 3bits, production manager Trator Filmes, digital effects company FOM, fabricator 3bits (Belo Horizonte, Brazil), project design and development Antonio Luis Navarro, client

172

Interactive Annual 2015

“This seamless integration of the physical with the virtual makes the digital so utterly human. For me, a project like this sits in the category of ‘world changing.’” —Tali Krakowsky

Comments by Herbert Rafael: What are the project’s core features? “It’s a very simple mechanism: friends and relatives use their own smartphones to record voice messages and send them via WhatsApp to a phone number made available by the hospital. Each toy has its own number. A web app intercepts the message before it reaches the toy, and the messages are screened by moderators at the hospital, picking out content according to the progress of the treatment and the emotional state of each child. A mobile app specifically designed for this project synchronizes the messages so that children only receive the messages chosen by their doctors.”

What was the most challenging aspect of the project? “Keeping the technology invisible to the children. The teddy bear needed to be their only contact; a pleasing object they could care for that would stimulate the imagination and bring comfort, affection, fun and companionship. Technology was only a tool here, a means for communication.”

What was the response? “ELO Teddy Bear has become a relevant support tool for children’s cancer treatment inside the hospital. Its reach inside social networks was huge: the video demonstration of the project at work was viewed 926,324 times in five months. The project was widely publicized by Brazilian mainstream media and was featured in a television report by the biggest communications network in the country.”

Communication Arts | commarts.com

173

Icon Design Pictographs preceded written language. Visionary computer scientist David Canfield Smith used symbols in his 1970s interface and called them “icons.” A decade later, Susan Kare created an icon vocabulary for the first Macintosh. Today mobile devices have spawned a new, global, picture-based language of concepts and wayfinding that are crossing over to uses off the computer screen.

Edward Boatman, Sofya Polyakov and Scott Thomas founded thenounproject.com to create a universally understood visual language. Today designers from around the world contribute to the curated library of free and for-sale symbols.

Icon designer Scott Lewis, of iconify.it, keeps a notebook for his sketches.

Designers who upload their work to the massive worldwide storefront iconfinder.com receive 70 percent of profits when their icons are sold.

Apple CarPlay and Google’s Android Auto are moving their mobile icons into automobiles.

Using 3-D icons for touch-only navigation, frog created Urchin’s BOOM, its “ready for anything” Bluetooth speaker.

CA QUERIES CREATIVES

What are the challenges and joys you face when creating an icon set?

Jon Hicks, Hicksdesign, hicksdesign .co.uk, Witney, Oxfordshire, United Kingdom.

“We’re getting into very exciting territory with regard to the technology we have to play with! Scalable Vector Graphics (SVG) is finally becoming widely adopted and with that comes the opportunity to provide responsive icon sets. Higherpixel-density screens will also mean spending less time making artwork conform to a pixel grid. The days of fuzzy bitmapped icons are almost over! Until then, the challenges are in providing fallback options and getting decent svg export and optimization in apps like Adobe Illustrator.”

Stefan Dziallas, iconwerk, iconwerk.com, Breman, Germany. “The challenge is finding the right amount of detail because the simplest representation of a metaphor isn’t always the most comprehensible.

And if it’s too complicated, the message gets lost as well. The joy is finding new ways to visualize even the most common terms in the form of a (bullet-proof) icon design that adapts to all possible applications and still looks great!”

Ben Dunkle, professor, Canisius College, bendunkle.com, Buffalo, NY. “Crafting visual metaphors for abstract concepts is tricky. The icon has to convey meaning to the largest possible subset of the target audience, and personal bias must give way to an objective approach. Technically speaking, achieving maximum crispness and clarity within limited canvas sizes and color settings is a great design challenge. I find the same joy in imparting a consistent style across an icon set as I do in designing a typeface. And emerging technologies for creating and delivering icons are wonderful to explore.”