hero_v1hero_v1

Traditional text-based methods of education fail many science students. Science Helper is a gamified and interactive educational app that allows users to explore a broad range of scientific topics. Through 3D manipulation and gamified lessons, students are given an enhanced learning experience that allows them to visually and spatially grasp difficult science topics.

[unex_ce_button id="content_yo2qhaovc,column_content_i6dxcmqa6" button_text_color="#000000" button_font="bold" button_font_size="18px" button_width="auto" button_alignment="left" button_text_spacing="0px" button_bg_color="#ffffff" button_padding="0px 0px 0px 0px" button_border_width="0px" button_border_color="#000000" button_border_radius="0px" button_text_hover_color="#88c86d" button_text_spacing_hover="0px" button_bg_hover_color="#ffffff" button_border_hover_color="#000000" button_link="http://kah3770.cias.rit.edu/wp-content/uploads/2016/ScienceHelper_Deck.pdf" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]See Project Deck ⟶[/ce_button]

Client
Class Project

Duration
12 Weeks, Spring 2016

Role
Concept, Research, UX, UI, Animation

01 - Feature

Rotate 
3D Atoms

Users can manipulate and rotate atoms in 360 degrees, allowing them a better spatial understanding of the orbital levels, orbital shapes, and electron movements.

02 - Feature

Electron
Mini-Game

To build atoms, users must bounce electrons into the appropriate orbitals. The repetition of this action reinforces knowledge learned and the added element of skill creates a more engaging learning exercise.

What current design trends can I leverage to enhance the learning experience?

I began the research process by looking at other science education app currently available. The majority appeared to be minimally interactive, 2-dimensional, and primarily information. Those that were making use of 3D objects were of poor graphic quality. I turned researching popular and successful app trends that I felt could improve on the weaknesses of the current science education app options.

3D Interaction

Improve student understanding of spatial relationships and movement

Gamification

Motivate users to complete lessons and enhances learning through game play

Progressive Disclosure

Solves the problem of prerequesite knowledge

Sketching interaction models
 

To facilitate retention of information, I wanted to create very physical interactions for the user. I initially began with the idea of having the user drag each electron into the orbital one by one, however, I realized that this would quickly become a tedious and frustrating barrier. I instead came to a solution where the user selects an electron and bounces it into the correct orbital. By requiring a small level of skill, I was able to make the interaction more competitive, playful, and engaging.

  • gallery-image
  • gallery-image

Immersive & Futuristic
 

To highlight the 3D objects and emphasize space and dimension, I chose dark gradient backgrounds with depth.  I also selected bright accent colors in high contrast of the dark backgrounds in order to convey a spacey, futuristic aesthetic.

mood_wide_v1mood_wide_v1

Guiding the user
step by step

  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image

The steps of each lesson are displayed linearly and sequentially, allowing me to dictate clear learning objectives and ensure that users come away with these specific desired outcomes. This gave me more control over the user's education while also preventing the user from being overwhelmed with information.

big-image_v1big-image_v1
ipad-mockup_v1ipad-mockup_v1