Reimagining BYJU’S Illustration Style Guide
Exploration into creating an in-app illustration system at scale (Internship Project)
As devices become extensions of ourselves and digital experiences form an essential part of our daily routine, every single aspect of this experience has to be deliberate and executed with precision. This is the key to intentional design and creating user delight .
Illustrations are no exception.
A popular view is to regard Illustrations as merely decorative elements that fill up empty space on a screen. However, they are today seen as a powerful tool in creating lasting and memorable digital experiences and deepening user engagement.
I had the opportunity to intern with leading ed-tech company BYJU’S. The project focused on their in-app illustration system and how it might better align with users of different age groups (8–16 years olds).
Current Illustrations at BYJU’S
The overarching brand philosophy of BYJU’S is to “Fall in love with learning” and the fun and whimsical in-app illustrations reinforced this.
Some key considerations
Dynamic, ever-changing trends
The issue with illustrations is that it becomes dated fairly quickly. What is currently contemporary and trendy can quickly look clunky and boring in a few years. We aimed to define some universal parameters or guidelines that will make these illustrations resonate with their users at all times, accounting for changing trends.
Changing tastes and sensibilities of audience group
Another key aspect we needed to address was that each user was unique. Infact, there is little similarity between an 8 year old’s likes and a 16 year old’s. It was important for our solution to account for this differentiation between user cohorts.
The Approach
Desk Research
The first phase of my project centered on desk research and inspiration gathering to set direction for my design process.
The ideas of Don Norman in his seminal work ‘Emotional Design’ acted as a guiding principle to my project. According to Norman, any experience is divided into the following realms to create delight.
Visceral: Subconscious reaction to aesthetics
Behavioural: Subconscious usability of something
Reflective: Conscious rationalization of an experience
App illustrations would inhabit the visceral and reflective realms to create delight and meaning for users.
Illustration Trends in Industry
I explored standout illustration systems adopted by brands for marketing and product design.Going beyond the ed-tech space, I looked at products across industries to gauge dominant illustration trends. These included:
Airbnb Google Facebook Lyft Uber Notion Headspace PhonePe Hinge Revoult Duolingo Shopify Mailchimp Slack Atlassian Pitch RedHat Gusto Intercom
To help with the analysis I broke down every composition into nine broad categories. A combination of differences in these categories gives rise to a distinct illustration style for each brand.
After tabulating across these categories I identified the overarching trend was towards simplified illustrations which are flat and colorful. They employ mainly split complementary or tetradic color schemes which are pastel and without textures.
Understanding the Users
Finally the most important step in building a successful and user-centric system was to identify what sort of visuals our target user would respond to. To obtain more granular insights we broke down the users into three cohorts -
Tweens: Classes 4 & 5
Teens: Classes 6,7 & 8
Young Teens: Classes 9 & 10
Primary research was done on both the learning behaviour and app usage of these user groups. I also went through marketing profiles and case studies to better understand the users’ predominant choices.
What media do they consume? Do they read books? Do they play video games? What kind of visuals do they find stimulating? These were some questions we directed at the target groups.
On the basis of this data I made personas for each cohort and identified some key user traits for each group.
Tweens
Young Teens
Teens
Solution Strategies
Building Visual Guidelines
The next phase of my project involved translating these intangible qualities of the user into a visual guideline or system which would resonate with each of them.
I identified 7 key visual elements that make up an illustration such as motion, balance, color scheme, value etc. Then I examined how they might be altered as per the preferences of the 3 age groups.
For instance, tweens might prefer illustrations with a lot of movement and activity while teens might find that distracting or annoying. They may prefer something more minimal.
I conducted a small user testing exercise with a sample size of around 20 children to validate my hypothesis. I used the qualitative research method of photo elicitation where I showed different images to the responders and noted down their preferences and reasoning for the same. These were my findings.
Once my guidelines were in place, the next step was to work on creating a pilot illustration project on the basis of the prescribed guidelines.
Defining a Style
To keep the visual language contemporary and future ready meant dipping into trend forecasting to predict where illustration styles are heading. Understanding past trends and what need they fulfilled was quite helpful in this process.
Given the anticipation around the metaverse and blockchain tech a style that has grown in predominance is 3D visuals. It is commonly seen as futuristic and therefore cool/hip. Therefore I opted for a 3D rendered style to create my illustration system.
In addition the users across age groups responded positively to this style as well picking it over the alternatives.
Identifying Action Areas
The next step was to establish which categories of in-app illustrations I could work on that would have the most impact on the in-app visuals.
Execution
The last phase of my project involved putting on the hat of the illustrator and creating assets to build an illustration system on the basis of my guidelines. I worked on the two extreme cohorts i.e. the Tweens (4th & 5th) and Teens (9th & 10th) in order to best express the changing visual style over age differences. The visual style for the Young Teens (6th — 8th) would be something of a middle ground between these two.
1. Tweens
I articulated a visual identity for this cohort verbally which would help in better defining the visual style to come.
Extensive moodboarding helped in visually anchoring the style
1.1. Subject Illustration (Tweens)
This formed an important part of the in-app visuals as each academic subject had an accompanying set of icons and illustrations that could be explored in interesting ways. For this age group, they had only two subjects namely math and environmental studies (EVS).
1.2. Error States (Tweens)
Illustrations in Error States are important as they could potential pacify users in frustrating points of the user journey where an error has occurred. We created whimsical and humorous illustrations here to depict the errors keeping with the theme of space exploration.
1.3. Empty States (Tweens)
Illustrations here are meant to nudge the user into using other functionalities of the app which are currently not being used. Therefore the illustrations could be highly expressive in this context and more about delight than communication.
I explored using elements of anthropomorphism here to give an additional dimension and personality to the assets.
1.4. UI Mockups
2. Teens
I articulated a sort of visual identity for this cohort textually which would help in better defining the visual style to come.
2.1. Subject Illustration (Teens)
This cohort had more subjects including the sciences having split into chemistry, physics and biology. I picked the three sciences and math as they are core subjects to demonstrate the visual language for this category.
2.2. Error State Illustration (Teens)
The renders used here were clean, simple and sophisticated to convey the issue at hand clearly.
2.3. Empty State Illustration (Teens)
A similar approach as the previous category expect using a few more elements for a sense of wonderment and visual relief.
2.4. UI Mockups
Concluding Thoughts
This project allowed me to take a research-driven approach to a topic such as product or app illustration which had always existed in the subjective realm. By utilizing primary and secondary research findings along with interaction design tools and frameworks, I outlined a visual style and design language that will be delightful to the end user across age groups.
This was a great learning opportunity and a unique initiative that blurred the lines between art and design, while aiming to create user delight and business value.