Illustrating Tinybop’s 1st App
Some longtime friends of mine recently started a company called Tinybop, that creates systems-thinking apps for children. Their first app, The Human Body, launches today and I’m proud to say that I contributed the 200-odd illustrations of bones, veins, nerves, teeth, guts, and chewed-up-food of which it is comprised. Anything that a real body does, this body does—it eats, digests, pumps blood, gets sick, burps, runs in place, you-name-it—all at multiple zoom levels with a realistic variety of responses to the user’s interaction. Raul and Youngna conducted the biology research with an attention-to-detail tantamount to at least a semester of medical school, consulted with doctors, and sent hundreds of images of each organ to me, which I interpreted in this not-quite-textbook style.
However, the reason I really wanted to work on this app (aside from friendship) is because of the somewhat radical stance that Tinybop takes in promoting intrinsic curiosity and creative play. The app is intentionally non-linear—eschewing a goal-oriented rewards system (familiar to anyone who has racked-up points a video game) for freeform exploration. In the app there is no next-level, no chiming sounds-of-affirmations, no-counter-towards-victory. It steers clear of “the peril of gold stars” (as I recently heard Jack Hitt describe it) —the way in which external approval seems to interfere with the development of natural creativity and curiosity. (It is a classic psychological experiment: in lab settings, intrinsic interest in an activity has been shown to decline when the same activity is framed as a means to some extrinsic goal—either a tangible reward or adult approval…otherwise recognized in the adult world as the phenomenon of “once it’s a job, it’s no longer fun.”) In its very structure, the app imparts the idea that learning is fun—a reward unto itself. Kids are encouraged to ask questions about everything, and act on their own agency in choosing a route through the it. There is no “right way” to navigate.
Although I am taller than *most* children, I want to treat my work in a similar way—to avoid losing track of the creative plot by allowing my curiosity to steer the work I make. So, in addition to the required drawings I was asked to do for the app, I also worked on an unsolicited, secret side project for Tinybop—an unglossy stop-motion app video made out of paper, glue, and other articles originating from my desk drawer. I outputted the vector illustrations to my cutting machine, glued them together into a proper structural model, set up a tripod, and then just started pushing around the pieces. The resulting stop-motion demonstrate’s The Human Body’s functions, enlivened with crunch, breath, and plunk sounds made from paper. My other half, Daniel and I saved up a pile of assorted paper goods for a week and wrinkled, tore, and otherwise abused them to make sound representative of a heartbeat, nervous system electricity, digestion plops, etc.
The look of the figure (and the concept of physically layering-in the systems, one-atop-another) came directly from our shared memories of old transparency biology books, (remember the frog?) a reference to a bygone medium for learning that offered a really great physical metaphor for how the app could be structured.
The body systems get progressively layered into a silhouette body tray of the user’s choosing. Here is an early sketch of the respiratory system.
We created four different body tray silhouettes—two are more masculine and two are more feminine—although none are explicitly labeled.
This is a character-selection flow that I came up with, using the key from Tinybop’s logo to bring the app to life, a branding concept+physical metaphor suggested by Raul.
I particularly liked this second interstitial animation idea—wherein the body tray appears from a secret compartment in the back wall. Tinybop combined both concepts into a composite third flow in the actual app.
The app allows for the very close inspection of many organs, including the heart—which looks and functions as a completely accurate model, thanks to some adept coding…and many meetings between Raul, Youngna, and a heart surgeon.
Although my favorite system to draw was the respiratory system due to its symmetry and elegant shapes (and lack of gross-outed-ness…I guess my hypochodriac nature must be admitted! I like the idea of air moving through the lungs far more than the idea of blood moving through veins [shivers]).
The bones and joints were also a lot of fun to draw.
The way that the lens in the eye projects light onto the optic nerve had me captivated and a bit obsessed as well. In the actual app, Tinybop has done something magical with the eye and the iPad’s camera—showing how images arrive in the brain flopped.
I got to hone my Illustrator skills drawing the body’s network of nerves and the circulatory system.
In addition to illustrating the app, I also proposed a few icon solutions for the UI. It was really important to Tinybop that the app use language very sparingly, so we needed very clear, mashable-looking icons for each body system and each zoomed-in organ view.
Here are some app icons that I designed at the eleventh hour—reusing some of the app’s illustrations and UI design elements.
And finally, a whole assortment of food, which you can feed your body. I’m not going to show what it looks like when it gets down to the stomach and starts turning to mush. You’ll have to download the app to see that.
No related posts.
Holy moley.
Looks absolutely amazing. I’m awestruck frankly. Can’t wait to download. Wonder if my 8 month old will be able to enjoy it too. Here’s hoping.
Thanks Anna! I hope so too. Tinybop tested it with a lot of children—and made changes according to their reactions. For example, they made burp bubbles in the stomach and other gross things because kids were just REALLY excited by anything that felt like they were being allowed to indulge in improper behavior. (Things that are surprising which I suppose shouldn’t be…)
Just amazing, you are SO SO SO darn talented, and an excellent writer, it’s not fair.
The app seems to be just .99 in the app store, how can i NOT buy it?
what is next for you, kelli anderson? can’t wait to see. your work astounds.
Amazing work, Kelly! I love your curiosity, playfulness and design approach that combines art & science sensed in all of your work. It always results with spectacular and inspiring projects. Keep it like that & play on! :))
This is such lovely work. Very inspiring!
This is just amazing. I’m astonished to look at your process. Such great inspiration :).
Absolutely fabulous and intelligent work!
You do such wonderful, creative, technical and well-crafted work! Thank you for also taking the time to share it so thoughtfully. You are one of the designers I look to to remind myself that there’s always more to learn.
Beautiful work. Thanks for the photo of your atelier as it will allow my kids to see that art is created/made by a person and not the result of spontaneous digital combustion although I suppose some artists might argue with me!
Wow, absolutely stunning work Kelli! Came out beautifully.
absolutely stunning. ultra-contemporary yet stylishly retro, and – like all your work, it seems – sublimely elegant.
huge congratulations on your website and really awesome, inspirational work from berlin!
Wow! Genius !!!