Universal Insignia is an interactive iPad app along with the kindergarten’s current physical badging system to improve the student experience. It allows students to celebrate and interact with their achievement as well as give parents the unique opportunity to engage directly with their child’s education.

This project was a client-based 16 weeks team project at ETC, CMU. I was the lead designer for this project. From research, UX, visual design and prototyping, I was fortunate to own the product and successfully delivered the product in May 2019 to Elizabeth Forward District School.

Current Physical Badging System

Our team quickly discovered issues that we can improve for the students, parents, and teachers' experience. Currently, the school has an existing badging system in which their kindergarten students do not receive grades but rather badges tailored to specific skills. Every Friday, they have a badging ceremony in which the students receive physical paper badges, but there exist some issues with this system.

03 Design Solution

Enter your text here...

Main Page

Scan Your Badges: Easy scan badge system using iPad camera to scan QR Code

Badge Library: Shows information including date and badge information such as has not earned badge, earned badges.

Sticker Book Page: Students could easily interact with earned badges and foster motivation and creativity.

Scan and Store your Badge

Once students earn the badge, they can scan their new badges using an iPad camera to detect scan QR Code. It will automatically appear in the badge

Find the badge information in a Badge Library

Parents can check the date the badge was earned and the skill associated with the badge. So the students and parents know what needs to be worked on.

3 Different Categories based on skills: reading became ocean, math is space, and others is forest.

Linear structure with Parallax Effect: Students love swiping on the iPad

Interact with the earned badges in the Sticker Book Pages

For additional student interaction we thought it would be fun to add a “Sticker Book” function so that the students can have some creative play with their badges. The images on the 

badge translates to a sticker that they can use on these pages.

The pages are divided into Ocean, Space, and Forest

Creativity: added a sticker book function so that the students can have some creative play with their badges.

Initial Wireframes to Final Wireframes

We fleshed out the UI sketches, created lo-fi wireframes, and got down the clickable initial prototype without all features included for validation testing. We conducted quick validation testing with 4 users, and found out the flow works smoothly, there exists a couple of issues that need to be adjusted. For example, to make buttons more prominent on each page so it can give the kids a clear signal that it is a CTA button. We decided to go with this general flow and started deep dived into how we design for our app a more intuitive and engaging experience for our target audience.

This is the final wireframe, all discussed features were translated into screen-by-screen solutions with a logical flow that interlinks each other. In this stage, the effort in the iterations was made to check if all the discussed features are included and figure out if the flow makes sense to users.

Iterations Based on User Testing

User testing has been playing an important role for our team. We have conducted user testing in weekly sprint cycles which allows us to engage closely with our target audience from beginning to the end of the product development. Because of the age of our target audiences, we need to have intuitive design as much as possible. This lets us do a lot of playtesting to make sure that our target audience understands the interaction behind the application and to go through the application as smoothly as possible. Based on these information, we made some major changes along the way:

What I learned

Prioritize design process: It was important for me to plan out my project well creating an efficient road map.

Importance of Documentation: documentation was really important since we have to deliver our product to school districts. So it becomes communication tools between us and schools.

Essence of Communication: Everyone has different level of understanding of the context, so it was important to make sure everyone is on the same page.