Experience this ProjectI created this interactive example to teach learners how to make the perfect smoothie or fruit shake. In this challenge, I focused on the visual design, the drag and drop functions and the use of text variables in Storyline. Visual DesignI played around with the colour scheme and see how colours evoke different feelings and emotions. The theme of this challenge is smoothie, and to me, smooth is something healthy so I tried to use different shades of orange to evoke a fun and energetic feeling. I finalised with this simple design as I wanted the learners to see all the steps in one glance. For the font type, I chose a font named Reach Story which looks like handwritten words as I wanted it to give a hand-written recipe feeling. I think the font is good as it can still keep its readability and easy for learners to read the steps. DevelopmentThere’re 5 key steps in this Smoothie 101 micro-learning course. For each of the step, I used a lot of images to illustrate the steps and choices learners can make as if they are making a smoothie. I changed the state of the object to show what the learner has picked. For example, in the ‘#1 Pick a fruit’ step, I created a ‘dropped' state for the apples, and whenever it got picked and dropped to the drop zone in the middle, the apples will shrink. To capture which fruit, green and sweetener the learner has chosen throughout the course, I created four text variables called FruitChoice, GreenChoice, LiquidChoice and SweetChoice. For example, in the '#1 Pick a fruit' step, the FruitChoice variable will be set to value ‘apple’ if the learner has dropped the apples in the dropzone. Similar triggers were set for the other 3 steps (choose any liquid, choosing a green and choosing a sweetener). To personalise learner’s learning experience (aka blending their own smoothie), I used text variables to show only what they have chosen. I first added all the images of the ingredients into the blender, regardless whether the learner has chosen or not. Then I made sure to set their initial state as 'hidden', and only change the state to ‘normal’ for the ingredients that the learner has chosen in Step #1 to #4. I also added a timer to create a countdown effect as if the blender is blending! AfterthoughtsThis challenge gave me a great opportunity to explore two elements in graphic design - typography and colour. I tried playing around with different fonts and explored how different font types create a diffrent look and feel. I also had the chance to practice the use of states and text variables to capture learner's input and to personlise their learning experience by only showing their chosen ingredients. I'm very happy with the end product that I created!
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. Archives
July 2023
Categories |