LifeComp for Kids
Role: graphic, motion & ui designer
The Brief
The Organization of Ibero-American States (OEI), together with the Autonomous University of Chile, requested an infographic for their Diploma in AI and Emerging Technologies for Education.
The main objective was to illustrate how the LifeComp framework applies to early childhood education environments. The document needed to transform complex educational theory into a clear, visual tool for teachers and students.
Evolution of the Project
During the creative process, it was identified an opportunity to expand the impact of the project. A static infographic was useful, but a dedicated landing page could extend the narrative and offer a better visual experience.
I decided to create an interactive web prototype that used scrollytelling to guide educators through the content step by step, making the learning experience more engaging.
The Theoretical Framework: LifeComp in Early Childhood
LifeComp is the European framework for personal, social, and learning-to-learn key competencies. Created by the Joint Research Centre of the European Commission, it establishes nine core skills divided into three main areas:
1. Personal: Self-regulation, flexibility, and well-being.
2. Social: Empathy, communication, and collaboration.
3. Learning to Learn: Growth mindset, critical thinking, and learning management.
In early childhood, these skills do not exist as abstract concepts. Children learn them through direct action, daily routine, and interaction with their immediate environment.
Creative & Visual Approach: The Neighborhood Concept
From the beginning, the client wanted to ground these academic concepts in a realistic setting: a working-class Latin American neighborhood. This visual choice was essential for cultural connection and representation. Instead of abstract icons or formal classroom settings, the skills appear in recognizable spaces: family kitchens, public streets, local shops, and schoolyards.
From Static Graphic to Web Storytelling
For the Infographic: We maintained a continuous panoramic illustration where all scenarios coexisted in a single visual space, accompanied by detailed codes and reference tables.
For the Landing Page: We transformed the panoramic illustration into a scroll-driven narrative. As the user scrolls down, the view moves through the neighborhood stop by stop. Each location reveals a simple headline, a short context, and an option to explore the specific competencies in detail.
