Learning A-Z Senior Visual Designer
The flagship product of Learning A-Z is RAZ-Kids, a suite of web-delivered learning programs aimed mostly at school districts. The primary software of the collection is the Reading program, which targets the K-5 age range. Though I did cross over to teacher-facing projects at times, I joined the team on the student side of things. That meant the kids were my stakeholders and I put all my effort into increasing engagement for them, to make them want to keep coming back to read, learn, and earn rewards.
Avatar Creator
I hit the ground running at Learning A-Z with the construction of an avatar creator from the ground up.
Serving as an incentive for users to complete assignments, it gave students freedom to express their individuality. Kids could create themselves, or let their imaginations run wild and come up with fantastical characters.
I established the scope of the project & clear deliverables for launch, communicated with engineers to define the limitations, and iterated on the look-and-feel with stakeholders.
Diversity and inclusion was a driving force from the start. I ensured a child could create themselves if they wanted to, or let their imaginations run wild and come up with fantastical characters. With such a large catalogue of items, and multiple versions of each for skin color, eye color, adaptive devices, etc., it was necessary to figure out the physical parameters (pixel dimensions, file format, file size on disk) early on.
Every asset was created as a vector object, hoping that SVG support in mobile platforms would become standard, and color variations could be almost limitless through tags in code.
After its launch, I outlined plans for future expansion and continued to support it with limited-time seasonal assets to mantain interest and encourage kids to reinvent their creations.
Environment Design
I was offered the opportunity to create environments to serve as different offerings within the suite of products. Landscape illustration was never a strength of mine, so I embraced the challenge.
I tried to evoke feelings of playfulness and exploration, to give the user a sense of wandering an alien galaxy as they switch between subjects.
I grew a lot during these projects, and adopted some techniques for hand-drawing vector art that I came to apply to the avatar creator.
Mascot Design Process
The expressiveness of the original robot mascot was proving to be limited as it became more prominent in the product. I developed a new representative that's familiar enough, but adaptable and capable of conveying more emotion.
To start a conversation, I sketched out a variety of modular body parts, and assembled them randomly. The direction that came out was a mash-up of some of those ideas, and I refined it further.
With a design finalized, I explored color schemes by first doing tone studies, then applying different palettes to a select few. The goal was a robot who wasn't specifically gendered, to help all students connect with it.
Mascot Design Product
This is the end product. My research helped me settle on a hip design built from wedge-shaped discs. Rotating each disc independently changes the angles of the hips, allowing for the bipedal-to-unicycle transformation.
Mascot Design Personality
Here's where all the forethought into the robot design pays off. The face-screen reinforces the thrust of the pose. The pivoting jaw piece connects it to the original, while providing an extra dimension to emote. The antennae change, but stay consistent to the design, and help to convey emotion.
BadgesCross-promotional awards
We partnered with UNICEF to give kids a sense of power, a feeling like they can make a difference in the world. To earn these badges, students needed to save up in-game currency. Instead of buying new avatar pieces or backgrounds, they'd donate what they had earned to help provide kids they don't know with fresh water, food, and school supplies.
I couldn't be more proud of having had a part in the program, nor of the kids for making it a huge success.
User Interface
Iterating on a prompt is a strength of mine. I will generate ideas until something resonates. Here's an example of one interface expressed 4 different ways.
I am also adept at distilling complex ideas into simple, recognizeable images using the same visual language. Each icon is distinct, but still part of a cohesive whole.
Repeating Patterns
Secondary to their avatar, kids could choose a background to help express themselves. These background would be used in many settings, so we decided on repeating patterns.
I proposed and implemented a system for tiling images that stacked 3-4 transparent PNGs of different dimensions, each with part of the whole image. That randomized the design, masking the fact that it's repetitive.
Spot Graphics
There's always a need for spot graphics to fill space or add visual interest, as well as reinforcing branding on web pages or marketing materials. I built a library of images that any other department could pull from to create more engaging content. Using organic shapes and dynamic angles helps offset more structured grids and blocks of text.