Jara
How do you design a layout that other content will drop into? How do you create a visual system that can flex depending on use and subject matter?
Role
Strategist
Designer
Solution
User Research
UI/UX
Jara empowers children in under-resourced and low-internet / low-electricity communities to receive a quality education anytime, anywhere through the Jara Unit. The Jara Unit is a personal education device that enables children to learn localized education content in any language without needing access to power, a quality classroom, or the Internet. I am helping them with their first branding effort by creating interfaces for displaying different content and to enable smooth and accessible navigation for both students and teachers.
A nonprofit needs a UI/UX that provides an engaging, and often the first, digital experience for children in remote villages.
Problem
The unique demographic presents specific needs to ensure a successful experience.
Challenge
Research
Cultural Research
UI/UX Findings
Agriculture is a main source of income, signaling a broader agrarian society
Art consists of religious figures, gods, saints, heroes, which manifest in the spiritual imagery commonly exhibited in public spaces
Red, yellow, and green are culturally significant colors, associated with luck, abundance, and riches respectively
Key Takeaways
Kids expect feedback when interacting with objects, and so they appreciate digital responses
Kids are more trusting than adults and more readily tap on features without predicting consequences
Kids love a challenge and so features that maintain suspense and a sense of pursuit engage their interest
Nature-inspired Aesthetic: Use different shades of green and natural motifs to reference everyday experiences and cultivate a warm, familiar atmosphere.
Simple Design: An intuitive interface with easy navigation will help children interact with the device with minimal confusion.
Playful Features: Incorporate dynamic motion, games, and interactivity to keep children engaged.
Process
Conducting immersive research into the target demographic in order to build a strong concept that centers the user.
Objectives
The client provided two broad objectives at the start of the project:
Student and Teacher sides of the device
Features: Welcome experience, Dashboard, Course content, Quizzes, Games
I helped expand on these general objectives, creating an information architecture to distill device needs into a series of pages. The proposed initial journey map shows the interconnectivity of device features, while simplifying them into a concrete sequence of options.
Design
The physical Jara Unit.
Brand
Inspired by the playful, tactile nature of the physical device, I wanted to the brand to convey a lighthearted experience with bold gestures. After acquiring the above research findings and further discussion with the team, we chose a style guide consisting of color palette, fonts, and natural motifs.
Text
Colors
Motifs
Wireframes
All wireframes and designs were made on Figma to obtain a rough idea of each screen layout. By listing out the major requirements and small-scale features, we arrived at a skeleton for a page before filling it out.
Hover States
Since the Jara Unit is composed of physical buttons to navigate up/down/left/right, we had to figure out a way to show how a button was being “hovered” on before selection. Given that the Jara Unit is only 5” diagonally, we wanted to show a clear way to show the hover. As such, we chose to include a thick black outline for each button/component hovered on.
Here’s a demo going through the whole device.
Our design for the unit was awarded The Most Creative Award and The Most Impactful Award at Develop for Good’s Sum’23. The Jara Unit will reach 30 students in Nepal in the Fall and 1,000 by end of the year and help bridge the divide in the access to education around the world.