Experience the projectI tried two things in this E-learning Heroes Challenge - first is to make use of the scroll panel to display a set of instructions into manageable chunks. Another new attempt is to create custom graphics and gif images using Adobe Illustrator and Photoshop.
Scroll panel is a great option to ensure the composition is manageable and easy to ready:
I had a lot of fun creating the graphics using Adobe Illustrator and I followed this tutorial by Amanda Nguyễn in converting some of them into gif images using Photoshop.
0 Comments
I'm a big fan of Breaking Bad and I always wanted to create a ELC submission based on the show. ELC#420 is to make use of the recent updates and features in Articulate 360 and I tried out one of the new features of Storyline 360 which is the Background Audio. It's a good time as I get to add its iconic theme song to this mini-game! Experience the projectOne issue that I came cross while creating this mini-game is that I cannot pause the music on certain slides. What I would like to do is to pause the background music when I hit the game over slides, but right now the music continues to play forever. I found a workaround in the forum (a big thank you to Crystal!) and tested it in this project. The solution is:
While this video plays, the background audio will be paused. I also made sure to enable the 'Pause background audio when video content plays on a slide' option under 'Background Playlist'. I also have a lot of fun using Bing AI to generate the Breaking Bad images in comic style. Currently the export option for Bing AI images is only 1024x1024px so I made use of the comic book art styles and cropped them with shapes in PowerPoint. I would like to come back to this project again someday and add a few more game features such as a progress bar.
In this week's challenge, I followed the Floor, Wall, & Baseboard Technique to create a sense of depth and perspective. This is a design approach that uses three different visual elements to create a three-dimensional effect resembling an open room or space. Explore this projectI used this technique to create a gallery room where you can see the middle/left/right space in the gallery room.
Creating the perspective of 'a room'I created all the shapes in PowerPoint and later imported back to Articulate Storyline. For the sidewalls, I created two trapeziums to create a perspective of a 'room'. As for the 'baseboards' on the sides, to get them at an angel, I first selected the shape, then right clicked and used 'Edit Points' to align it with the sidewall and the middle baseboard. Audio generated by AII didn't have the time to participate in the ELC#416 which is about using AI to build online training, so I thought perhaps I can use AI for this project. I tried Murf to generate the audio files for this challenge. The audio files generated are very much-like a real human is speaking. The accent and intonation are quite on point. I'm excited to try using other generative AI tools for my future projects.
This challenge is to create a demo to show how course designers can use motion graphics in e-learning. An E-learning hero, Jonathan Hill has created a great demo of how to build attention-grabbing motion graphics. I've followed his tips and created my own version. I've just started my UK driving test preparation and this inspires me to create a mini-game and practice my use of motion paths in Storyline. Explore the projectI first created all the graphics needed for this course using PowerPoint, e.g. the background of the mountains and the white route going from Point 1 to Point 3. I also used Adobe Photoshop to add myself into the red car. For the moving of the red car, I added the red car on the base layer and the tyres on another layer. On the tyre layer, each tyre has a 1-second Spin as their entrance animation, and I added a jump to start trigger on this layer. The benefit for putting the tyres on another layer is that I don't need to add/change the states of the tyres. With the tyres being on another layer, the Jump to start trigger will fire when the Entrance animation (1-second spin) completes, and the tyres will appear to spin continuously. For the mountains at the back, this background image is twice the width of the slide and it moves on a repeating motion path. Make sure the image has a repeating pattern so that it can appear to be scrolling from left to right seamlessly. AfterthoughtsThis challenge gave me a good opportunity to practice using motion paths and setting related triggers to make the graphics to appear to be moving seamlessly. Also I was playing around with different sound effects and I noticed that adding sound effects really make a big difference to the experience. I've kept this in mind and will play around with different sound effects in my next project.
Explore the projectI was inspired by one of the demos in this Challenge and decided to create my own version. I was born and raised in Hong Kong and Cantonese is my mother tongue (and there are over 80 million native speakers in the world speaking this language!). It's a fun language so I wanted to create a mini-game on Hong Kong slangs using a glossary as learner support. Visual DesignOverall, I adopted a monochrome layout to highlight the text shown on screen. DevelopmentAs I have included voice-over in this mini-game, I wanted to add a reminder reminding the learner to plug in a headset or make sure to turn up the speakers when the learner launches the course. To achieve this, I added a new layer and set to present it as 'dialogue' in Storyline. I created two tracks of questions slides that are identical except that the glossary tab is hidden in one of the tracks. The learner has the option to play the mini-game with or without the glossary as a leaner support. The default placement of the glossary tab is on the sidebar on the right. To give a bit more room for the slides and make it more obvious for the glossary tab for the learner, I also moved the position of the glossary tab from the sidebar to the topbar. I also added sound effects and made use of the 'states' to highlight the right/wrong answers. AfterthoughtsI'm very happy with the end product that I created and I received a number of positive feedback from the Challenge comment thread. In this mini-game, I focused more on using the glossary tab as learner support and practised the use of states and triggers. I saw a lot of inspirations in the Challenge on creating a custom glossary, and I'd would love to try creating one in future challenge!
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!
Articulate E-Learning Heroes Challenge #392 Using Variables to Create Question-and-Answer Activities10/31/2022 Any Thai food lovers? I submitted this Thai food quiz to the ELHC#392 challenge. In this quiz, I listed out the ingredients of a Thai dish and learners can guess which Thai dish I am trying to make. Experience the ProjectDesign & DevelopmentFirst, I asked the learner to input their name using a text-entry field. The purpose of this is to let learners to get a personalised Thai menu at the end of the quiz with all the answers they have inputted. I also added a variable reference at the Menu Slide at the end of the exercise to achieve this purpose. In each of the questions, I listed out the ingredients of a Thai dish and learners can guess which Thai dish I am trying to make. To capture the learner input, I used text-entry fields and variable references to display the learner's answers at the end of the exercise. For example, I labelled the text variable for the Q1 answer the learner will input as 'Q1ans' and in the Menu slide, I added the corresponding variable references to display what the learners have typed for the respective Thai dishes. I also used the new Articulate print function which is available in modern style since the August 2022 update so that learners can print out their personalised Thai menu. AfterthoughtsThis experiment gave me an opportunity to practice using text variables to create an interactive question-and-answer activity and also try out the new print function in Storyline.
This example has been submitted to this week’s E-Learning Heroes Challenge. I was inspired by the Sims 4: Realm of Magic (big fan of the Sims!) and decided to build this sample using variables to keep track of the learner’s progress. This sample can be fully developed later to train team leaders in promoting employee wellness at the workplace. Design and DevelopmentI used PowerPoint to design and used the built-in 3D objects. To keep track of the learner’s progress, I created a spell book using a text variable first and named it ‘potion1complete’. Then I set a few triggers. For example, when the learner has completed the first page of the 1st potion, a trigger will fire and the variable ‘potion1complete’ will be changed to value ‘inprogress’. Also, when the learner has completed the second page of the 1st potion, another trigger will fire and the text variable ‘potion1complete’ will be changed to value ‘inprogress2’. I set a few more triggers to link the text variables with the progress bar. To show that the level of the progress bar is ‘increasing’, I edited the states of the progress bar. Here are the triggers that fire when the learner has completed each page of the 1st potion. 💭 Afterthoughts:I had great fun in designing and building this sample. I learnt a lot more about the use of text variables in Storyline in customising bookmarking and showing learners their progress in the course. I also experimented with different font types to deliver a magical vibe but maintaining readability at the same time. Did you like what you read? Leave me a comment and tell me what you think.
|
AuthorWrite something about yourself. No need to be fancy, just an overview. Archives
July 2023
Categories |