Making The Human Body app more human
Drawing the skin we live in.
[Warning: more than a few animated gifs ahead.]
I, along with Jessie Sattler, created the drawings for a brand new skin addition to Tinybop’s Human Body app. Atop the very topmost strata of the muscular system, the new fleshy layer lets future biologists and doctors make the body onscreen get goosebumps, react to poison ivy, and sweat*, among other things. (*There’s a direct relationship between grossness/popularity in this app: in prior iterations, we witnessed oversized enthusiasm for the activities of digestion and vomiting.)
With the skin update, kids can now make their interactive anatomy model look a little more like the (flesh-covered) bodies they, themselves, inhabit.
People who use The Human Body span the globe (the app has even been used to communicate medical information to Aboriginal people, non-verbally), so it was important that a wide range of the skin tones on Earth be represented.
In this context, inclusiveness (as capacious as our code will stretch) serves an additional educational function. An instructive parity occurs when kids can create a rough resemblance of themselves: aiding in the imagination that the app’s guts, tubes, and chunks-of-undigested-food are also hiding within their own bodies.
Of course… they do so while clad in stylish gender-neutral-underpants and new hairdos.
Without a doubt, the most interesting patch of skin on the human body can be found on the hands. Kids are encouraged to dive into this area and explore it on a few different zoom levels.
As someone who draws, folds paper, and thinks-with-my-hands for a living, I’m particularly interested in the role that these highly-sophisticated (but overlooked) little tools play in human thought. The skin is the only part of our reasoning-selves which directly touches (and instigates) cause-and-effect in the outside world.
Anyway, kids can now witness how skin—the largest organ—reacts to external stimuli.
Also, they can get their nails done…which is undoubtedly just as important.
I was surprised to learn that fingerprints—long used as a unique biological signature—are actually not freeform snowflakes. They are all variations on three basic structures: the whorl, the arch and the loop, as shown here.
As kids zoom further in, they will see that the skin is actually created out of several layers. The outer epidermis creates skin tone, while the inner dermis houses this amazing little muscle, which you’ll find connected to every hair on your body! This is what drives goosebumps (our physiological response to stressors like cold and fear).
More new(ish) functionality: Tinybop previously released an update that made the urogentical system available as an in-app purchase (so parents can choose to opt-into the content if/when they wish). Like all of the systems in the app, you can swipe between an exterior view and an interior crossection view of each part.
Since the app’s launch in 2013, it has been used in ways we never imagined when first dreaming it up. (Aside from being utilized beyond-the-bounds-of-language far afield, doctors at several children’s hospitals have reported using it as a tool to demonstrate and explain their young patients’ conditions.)
For this next generation of learners, who have already witnessed the disgraceful censorship of research, science—as the pursuit of truth—will take on a brand new, existential imperative. Indeed, at the time we first developed this app, the endless fact-checking, the fussy requirement that multiple heart surgeons sign-off, the questioning of even the most academic sources definitely felt like overkill. In hindsight, I realize what a rare privilege it is to work with a team so vigilantly committed to handling humankind’s knowledge with such care, accuracy, and reverence.
If you want more details about the making of The Human Body (about hearts, lungs, intestines, etc.), here is my original article from 2013, republished below from my personal site.
Illustrating Tinybop’s 1st App
Posted by Kelli on Thursday, August 15, 2013 · 44 Comments
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— 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 in 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 plotter, 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 and all could go either way.
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 groddy-ness… as a squeamish hypochondriac, I strongly prefer the idea of air moving through the lungs over blood moving through veins!)
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.
Originally published at kellianderson.com.
