Web App

SkyGround Kids

Problem

Children are hooked on their electronic devices. Understanding that dependability on devices is now part of children’s daily learning environment, Fairchild Tropical Botanic Garden is attempting to bridge the gap between electronics and nature.

My Role

This project was originally created for a Hack-for-Good Hackathon. I had the pleasure to work with a 2 awesome full stack developers and 1 lead UX full stack developer. My role was doing the UI and UX design. Since then I decided to implement a redesign to improve the UI and User Flow.

Solution

Fairchild wishes to create a game that would connect with this new generation and inspire them to get involved with the natural world and merge the two spheres – electronic and scientific.

To accomplish this, we created a mobile app that uses various scavenger hunt like games encouraging kids to take pictures of what they find or interact with in nature using their mobile phones. Other games are simply for recording a child’s outdoor activities. To make things more fun and encouraging we included a reward system of points that lead to the completion of badges in which the user can win prizes from partnered businesses.

Go To Prototype

Sketches & Wireframes

Home
Thinking from a parents perspective, I would want picking out an activity to be a quick and easy process. The less time they have to spend selecting an activity the better. To do this I made the home screen show activities in a card format that would have activities display at random with the option of filtering to have have access to specific activities of certain criteria. That way a parent could simply open the app press play and hand off to their child.

My goal was to make selecting an activity to be a quick and simple process with easy handoff to a child in mind. To accomplish this, I made sure after login the user would be presented with activities in a swipeable card format directly on the home screen

Filter
In case there was any preference, I also included the option of filtering based on time or category. I made sure to use microcopy that had a friendly and encouraging voice/tone to appeal to children.

Create a Playlist
There is also a feature the to create a playlist so that multiple activities can be played one after the other.

Activities
The unique selling point of this app is that it has an image recognition feature within certain activities. In scavenger hunt like activities, If there is an image match the user is presented with information about the image for educational purposes. Each activity that is completed adds points towards a specific badge. Once a badge is completed, a prize is available to redeem.

Reward System
The badge collection screen is for a quick overview on what badges are complete and incomplete which can be switched using the tab menu at the top of the page. Each badge item shows the level of completion at a glance.

To view additional information about a specific badge, the badge item can be selected and the user will see a list of the activities that need to be done in order to complete the badge in addition to checked off activities that have been completed. They can also select one of the activities and play.
Once all activities for a badge have been completed, all items will be checked off and a “redeem prize” button will appear.

Mockups