The majority of 2016 and early 2017 was spent looking at a pesky, purple robot on our computer screens. This robot was affectionately named, Skitto, which is also Grameenphone’s latest telecom product that caters to today’s tech savvy generation. Skitto is the first ever end to end digital product in Bangladesh, and it’s finally out and about! Our design team was given the immense task of designing the brand identity from the ground up, which eventually led to the creation of a 150+ page brand book, the skitto app, the website and all sorts of brand paraphernalia. As with all the projects that come out of our small design studio, we also had the scope of technologically innovating long with the creation of a uniquely, disruptive design app aptly named, The Skitto Generator. The Skitto Generator helps designers to create various illustrations of Skitto, from adjustable angles, by toggling around with the character in the app.
: Project Scope :
Brand Identity
Brand Expression
Brand Tone
UI/UX
Generative System
Motion Guidelines
Sonic Branding
We created the Skitto Generator keeping in mind the tedious amount of time it takes to produce illustrations from scratch. The app opens to reveal a fully rotatable version of skitto and interchangeable gestures and expressions indicated with buttons. You can also attach preloaded props to skitto’s hands or head, such as a mustache, party hat, cape, or bullhorn. When you’ve settled for your own customized version of skitto, just click on the camera icon to save the image of skitto that you would like to use, and it automatically saves as a png file at a resolution of your choice.
The Graphic Sandwich is skitto’s core graphic device and is used throughout the brand’s communication with or without skitto. It is comprised of 4 layers, a lot like the layers of a sandwich – cheese, patty, bread and toppings. We’ve made a library whereby you can choose from a variety of over 25 options for each layer. Once the layers are chosen, they automatically fall onto a 5:1 ratio grid that sets the boundary for each element. The elements can be freely toggled within this grid area, and once you’ve gotten the perfect graphic sandwich, you can save it as a png image by clicking export at the left hand corner of the app.
