Don't Go Nuts

Don’t Go Nuts is a tool to help people eat healthier. I used gamification principles to create a user experience that is highly interactive and informative.

Audience: Anyone interested in healthier eating.

Responsibilities: Graphic and user experience (UX) design, eLearning development, xAPI and JavaScript implementation.

Tools Used: Articulate Storyline 360, Adobe XD, Adobe Illustrator, Abode Photoshop, Affinity Designer, Affinity Photo, Affinity Publisher, Veracity Learning LRS, and Notepad++ code editor.

Don't Go Nuts

Don’t Go Nuts is a tool to help people eat healthier. I used gamification principles to create a user experience that is highly interactive and informative.

Audience: Anyone interested in healthier eating.

Responsibilities: Graphic and user experience (UX) design, eLearning development, xAPI and JavaScript implementation.

Tools Used: Articulate Storyline 360, Adobe XD, Adobe Illustrator, Abode Photoshop, Affinity Designer, Affinity Photo, Affinity Publisher, Veracity Learning LRS, and Notepad++ code editor.

Nuts are delicious and healthy, but it is easy to eat too many. Their high nutritional content makes them a perfect snack, but also one that needs to be sized carefully. What is worse yet, pre-packed mixes don’t always combine all our favorite nuts!

I designed Don’t Go Nuts as a learning experience to help nut lovers discover the nutritional value of nuts as they combine them into different well-sized snacks. Anybody can use Don't Go Nuts to create and print a balanced snack, or to learn about the nutritional content of their favorite nuts.

Following gamification principles, my main design goals for Don’t Go Nuts were to provide full control and interactivity to learners as well as instant dynamic feedback on their progress.

To achieve these goals, I went through multiple iterations of rapid prototyping, using the help of friends and colleagues to collect quick feedback.

I built all prototypes directly in Storyline 360 to shorten the development cycle.

Don’t Go Nuts is a compact learning experience, but it is packed with fun, technical intricacies. Here are few of the interesting features behind Don’t Go Nuts.

Enhanced Visuals & Interactivity

I wanted Don’t Go Nuts not only to look visually pleasing, but also to feel as natural as the real activity of putting a snack together—one nut at the time.

This meant creating 136 realistic, fully interactive nuts. Each nut is a single image that can be dragged onto the plate, removed from the plate, and combined with others in any possible way. This gives the learner a lot of control over the experience and the ability to rectify any “error."

I would change those two almonds for one extra cashew anytime!

 

Dynamic Feedback

Feedback is essential in gamification since it tells the learner how far they are from the game’s goal—in this case, creating a well-sized snack (of around 10% of the daily recommended calories).

Giving dynamic feedback in Don’t Go Nuts provided an interesting design challenge since features such as dynamic graphs are not built-in in some authoring tools. I explored multiple solutions (including web objects and bootstrapping) and ended up choosing a clean, self-contained solution. I used variables and triggers to turn a slider—a built-in input object—into an output object. The result is a slider for each nutritional indicator that changes dynamically as the learner drags nuts onto and off of the plate.

 

JavaScript & xAPI

I used JavaScript to allow learners to print a "recipe" of their snack and store it for future use. Once learners create a healthy nut snack, they get a feedback layer with the number of each nut in the mix and its nutritional content. This recipe represents a reward, an important component of engagement in gamification.

Don’t Go Nuts is also xAPI enabled. I use xAPI to store information in my LRS about how learners interact with this learning experience, including their favorite nut mixes.

Nuts are delicious and healthy, but it is easy to eat too many. Their high nutritional content makes them a perfect snack, but also one that needs to be sized carefully. What is worse yet, pre-packed mixes don’t always combine all our favorite nuts!

I designed Don’t Go Nuts as a learning experience to help nut lovers discover the nutritional value of nuts as they combine them into different well-sized snacks. Anybody can use Don't Go Nuts to create and print a balanced snack, or to learn about the nutritional content of their favorite nuts.

Following gamification principles, my main design goals for Don’t Go Nuts were to provide full control and interactivity to learners as well as instant dynamic feedback on their progress.

To achieve these goals, I went through multiple iterations of rapid prototyping, using the help of friends and colleagues to collect quick feedback.

I built all prototypes directly in Storyline 360 to shorten the development cycle.

Don’t Go Nuts is a compact learning experience, but it is packed with fun, technical intricacies. Here are few of the interesting features behind Don’t Go Nuts.

 

Enhanced Visuals & Interactivity

I wanted Don’t Go Nuts not only to look visually pleasing, but also to feel as natural as the real activity of putting a snack together—one nut at the time.

This meant creating 136 realistic, fully interactive nuts. Each nut is a single image that can be dragged onto the plate, removed from the plate, and combined with others in any possible way. This gives the learner a lot of control over the experience and the ability to rectify any “error."

I would exchange those two almonds for one extra cashew anytime!

 

Dynamic Feedback

Feedback is essential in gamification since it tells the learner how far they are from the game’s goal—in this case, creating a well-sized snack (of around 10% of the daily recommended calories).

Giving dynamic feedback in Don’t Go Nuts provided an interesting design challenge since features such as dynamic graphs are not built-in in some authoring tools. I explored multiple solutions (including web objects and bootstrapping) and ended up choosing a clean, self-contained solution. I used variables and triggers to turn a slider—a built-in input object—into an output object. The result is a slider for each nutritional indicator that changes dynamically as the learner drags nuts onto and off of the plate.

 

JavaScript & xAPI

I used JavaScript to allow learners to print a "recipe" of their snack and store it for future use. Once learners create a healthy nut snack, they get a feedback layer with the number of each nut in the mix and its nutritional content. This recipe represents a reward, an important component of engagement in gamification.

Don’t Go Nuts is also xAPI enabled. I use xAPI to store information in my LRS about how learners interact with this learning experience, including their favorite nut mixes.

Learn more about me or drop me a message. I'd love to hear from you.

Learn more about me or drop me a message.
I'd love to hear from you.

Back To Top