Category: Storyline2

02 Nov 2016

Find Kick Buttowski- Shuffle Game in SL2

Hello everyone, here’s an example of gamification in e-Learning. The main aim of this game is to improve user’s concentration skills along with providing him information about skateboarding.

Here cute and notorious Kick Buttowski jumps into one of the 3 available boxes randomly and the boxes start shuffling on click of “Start the Game” button. 

The user needs to focus and keep track of the box in which Kick Buttowski is and click it to get him out,

but beware..if the user chooses the wrong box, there is a punishment, yes you guessed it right, the user will have to answer a random question about skateboarding, fetched from a question bank.

The game play is divided into 3 main slides based on the shuffle speed (Normal, Moderate and Insane).

1) Normal – In normal speed mode, the users will have 3 chances to find the correct box and for each correct find they will be awarded 20 points. Just in case a user fails to find the correct box in which Kick Buttowski is, he will be redirected to a random question about skateboarding.

  • On correctly identifying the box in which Kick is: POINTS AWARDED 20
  • On correctly answering the question: POINTS AWARDED 10
  • On incorrect answer : NO POINTS AWARDED.
 
 

2) Moderate – In moderate speed mode, again the users will have 3 chances to find the correct boxes and for each correct find they will be awarded 20 points. In this case the shuffle speed is higher than the normal speed mode and a separate question bank that contains questions of slightly higher difficulty level is used.

  • On correctly identifying the box in which Kick is: POINTS AWARDED 20
  • On correctly answering the question: POINTS AWARDED 10
  • On incorrect answer : NO POINTS AWARDED.

3) Insane– In Insane mode, the users will have 4 chances to find the correct boxes and for each correct find they will be awarded 20 points. Here the users will have to give it their all as the shuffle speed is twice the moderate speed and the question bank contains really difficult questions.

  • On correctly identifying the box in which Kick is: POINTS AWARDED 20
  • On correctly answering the question: POINTS AWARDED 10
  • On incorrect answer : NO POINTS AWARDED.

The maximum score that a user can attain is 200. On completing all levels, the following slide will be displayed:

—————————————–Whats under the hood?——————————————-

  • Used a web object that allows me to shuffle the boxes seamlessly and created variables in JavaScript to bridge the gap between SL2 and JS. 
  • As shown below, I have created 3 Different slides for different speed levels (Normal/ Moderate/ Insane)

  • The blank slides that you see below are used for redirecting to the appropriate speed level.
  • I have created 3 different question banks, 1 for each speed level. All of them have 9 Questions each.
  • Question bank 1 has easy questions for normal speed level.
  • Question bank 2 has slightly difficult questions for moderate speed level.
  • Question bank 3 has very difficult questions for Insane speed level.
  • Every time a wrong box is clicked, a random value is fetched (any value from 1 to 5) and according to that random value corresponding slide with question comes up.

Here’s the demo link: https://goo.gl/iDMrDF

This Example is Inspired by “Find Candies” shuffle game,created by Avinash Sharma.



07 Oct 2016

Accordion in Storyline 2


What if a single accordion bar, holds information of more than one category?



Created an accordion for E-Learning heroes challenge #147, that has buttons on both sides and can be expanded in any order.

Click the link below to check it out. 

HTML5 Output: Click Here

19 Oct 2015

Rainy Day Background Created Using JavaScript

 

  Playing with Articulate Again!!  :o)

  Adding an animated background to your course can enhance the look and feel 
  of your interface.

  Below is a sample that contains rainy background, this aint a video that loops 
  infinitely, I have used JavaScript for this effect.

  NOTE: Here I have used the dummy values for the temperature. I would like 
  to convert these dummy values into real ones, so please suggest how to do so.

  Any suggestions will be greatly appreciated.

  Flash Output: https://db.tt/8kQApf1m

  HTML5 Output: https://db.tt/SUQUORhh

18 Sep 2015

6 Reasons for why should you use Info graphics in eLearning

  1. Infographics are easy to understand: It creates a lasting visual impression on mind by providing relevant information in form of graphics with minimal words explaining them. This manner of providing concise data is very easy to read and remember by learner. People retain approximately 80% of what they learn usually as opposed to 20% retained by reading.
  2.  Infographics saves time: As content is summarized with graphical presentations, keywords and concise data which helps in saving the time of the learners. Human brain process visual scenes 60,000X faster than text.
  3. Infographics are easy to share:Attractive Infographics has a higher ability of to be shared on social networks and become viral than the ordinary text content.
  4. Infographics provides chances to be creative: There is no standard templates for designing Infographics. Each one is different and one can always play with colors, formats, fonts and styles.
  5. Infographics creates brand advocacy: While designing an infographic, a logo of the brand should be embedded always. Whenever, it will be shared or liked on social networking sites gives free advertising to the brand.
  6. Infographics will help you to show your expertise: The research required for creating an infographic will display your knowledge and position you as an expert on your category or topic.
14 Sep 2015

Locate yourself on Google Map..!!

We know Captivate 9 has come with some unique features. one of them is “Geo Locator”. Our developers being the masters of their field tried this new feature in Articulate Storyline 2 by Java Script and HTML 5.

Try this to find your location.
Note: In the Address bar you will see a shield icon, click on it and then select load unsafe scripts. (The chrome page will reload with all the scripts enabled.) .Use your mobile devices for exact location.

DEMO LINK: http://db.tt/4DoWiFdj