Hellosaurus Asset Illustration
Tools: Photoshop, Hellosaurus App
Role: Illustrator, Layout Designer, Animator, Voice Actor
Context: Hellosaurus hired me as a remote contract illustrator to produce illustrated assets that were used in interactive video content for their pre-school educational app and demos of their app for other educational children's media companies.
The iPad app allowed kids ages 1-5 to interact with the app at key moments in the video, participating with characters and actors from their favorite shows to do educational and activities, which we internally called "Do-its".
Considerations
Matching Visuals: All the illustrated assets I created for Hellosaurus needed to blend in seamlessly with the video the interactive content was going to be paired with. I had to carefully consider how I would illustrate the assets to match the style of each video. The videos are proprietary, but I can show you the Do-its that only include my illustrations!
The Design Process: Problems and Decisions
Vacuum Do-it
One of the problems I was able to solve for our team was a work in the app to allow for a particular kind of interaction without the need for another round of code from the dev team.
Here's how the problem arose. One of the Do-it types, called a Wipe-it, allowed the user to swipe across the screen of the iPad to erase an asset beneath it, revealing the background. The area the user erased was centered around the finger's location, and an asset could be placed in that spot- a rag, a magnifying glass, etc. Usually, the asset was something small, and took up only a an inch or so around the user's finger, but for one of the interactions, my producer and manager tasked me with creating a Wipe-it for a vacuum scene, with the hose of the vacuum running off the page.
Since the asset was automatically centered around the user's finger through code, the user would erase by dragging the asset, but it would look like the hose was the part vacuuming, not the tip of the vacuum.
The Solution: I was able to figure out how to export a png with a lot of extra white space, that way the tip of the vacuum, and therefore the part that erased, centered around the user's finger.
Writing a photoshop script to speed up exporting
One way I saved time to meet all my deadlines and exceed expectations, was by creating a photoshop script during some of my extra hours one week that allowed me to export the assets with the correct file names and make assets that are simply different states of the same object (default, correct, incorrect, etc.) export with the same dimensions as each other.
I scoured the web for resources on how to write the code to do this and pieced together what I learned to create the script (Thanks friendly StackOverflow people!)
Outcome
Here are some testimonials I received from my colleagues at Hellosaurus:
Maddison is a talented illustrator and animator with a keen ability to bring the desired vision to life. Her ability to create and problem-solve in a timely manner makes Maddison a dream to collaborate with on projects. She always comes with options, solutions, and an impressive point of view. Maddison always delivered a high-quality finished product that was clearly made with CARE. - Jennifer Mingucci
In the 6 months I had the pleasure of working with Maddison, she never ceased to amaze me with her attention to craft, diligence and can-do spirit, and openness in communication. Maddison approached illustration prompts with a very smart perspective, and reliably turned back projects ahead of schedule. Maddison really is a jack-of-all-trades, contributing her ideas and work in projects spanning illustration, animation, design, and even some amazing voice acting! It was a pleasure working with Maddison, and I only hope she and I cross paths again! - Hillary Good
Maddison and I collaborated on over 30 projects in roughly 6 months at Hellosaurus, with Maddison as Illustrator while I was Production Coordinator. Maddison is an efficient and hard worker, without sacrificing creativity and whimsy. She thinks outside the box while following style instructions exactly, and is a wonderful collaborator as well. It goes without saying that her talent as an illustrator and designer is consistently excellent. Always ready to try something new, Maddison is exactly what you are looking for to join your team. I would surely work with Maddison again. - Martha Morton
Thank you for taking the time to explore this case study. Below you can find a collection of some of my favorite Do-its I created during my time at Hellosuarus.
