Blog Post

E-Learning Challenges
2 MIN READ

Building a Working Prototype for Your E-Learning Game Concept #471

DavidAnderson's avatar
DavidAnderson
Staff
2 months ago

Interactive Prototypes in E-Learning #471: Challenge | Recap

Welcome back to part two of our e-learning game design challenge.

Last week, you laid the groundwork with your design concepts and visual storyboards. 

Now, it’s time to bring those ideas to life with functional prototypes. This week, you’ll build a working model to test your game’s functionalities and interactive components. Your example should give us a clear preview of your game's key features and gameplay interactions.

🏆 Challenge of the Week

This week, your challenge is to build an interactive prototype to test specific functionalities or components. 

The goal is to create a functional version of your game that you can test and refine over the next two weeks. Think of this as the halfway point between the design concepts you created last week and the final version of your project. 

Don’t worry about making this version of your game perfect. You’re only creating a working model of your project.

Keep it simple, focus on the essentials, and let us know if you need help or have any issues.

Week 1: Concept & Storyboarding

Week 2: Prototype Development

  • Goal: Build a working prototype of your game
  • Deliverables:
    • Create a rough prototype of the game with basic interactions and navigation
    • Build the basic game functionality with questions, scoring, and feedback
    • Focus on core interactions and basic navigation
    • Submit to Review 360 to gather initial feedback (optional)

Week 3: Development & Review

Week 4: Final Testing & Project Submission

✨ Share Your E-Learning Work

  • Comments: Use the comments section below to link your published example and blog post.
  • Forums: Start a new thread and share a link to your published example.
  • Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts, so your great work gets even more exposure.
  • Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness.

🙌 Last Week’s Challenge:

Before you move from concept to prototype, check out the storyboard ideas your fellow challengers shared over the past week:

Game Show Design: Storyboards RECAP #470: Challenge | Recap

👋 New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. 

📆 Upcoming Challenges

  • Challenge #472 (08.02): Week 3: Production & Development
  • Challenge #473 (08.09): Week 4: Final Testing & Project Submission
Published 2 months ago
Version 1.0
E-Learning Challenge
Gamification
Instructional Design
  • ThierryEMMANUEL's avatar
    ThierryEMMANUEL
    Community Member
    2 months ago
    Bonjour Heroes. I've just finished 3 prototypes of 3 different events, and the dynamic medal table. Don't hesitate to let me know how quickly and easily you were able to play, although the rules are deliberately different for each event. So far, I think my biggest problem is going to be producing a good graphic design. NB: the project and SB are on the second scene.
    https://360.articulate.com/review/content/f221c2f3-1d34-4172-9c46-1dbed66a193a/review
    I built a fourth sporting event in prototype form (friday).
    I should point out (but it was so obvious to me) that the Olympics are the most televised "games" in the world. They are therefore "game show" by definition. Am I right?
    • CydWalker_mwhc's avatar
      CydWalker_mwhc
      Community Member
      2 months ago
      This is great! I loved the running lane hover, and I watched my person run to first place! Love to learn how you did that.
      • ThierryEMMANUEL's avatar
        ThierryEMMANUEL
        Community Member
        2 months ago
        Thanks Cyd. I meant to provide the file.story as I went along, of course! (that's how I understand the "step by step" of this particular challenge) but I forgot this morning. It's now attached to the comment on the first screen. It's probably a bit messy but it's a work in progress. I think my second main goal is to simplify the triggers as much as possible if I can.
      • arron's avatar
        arron
        Community Member
        2 months ago
        Thanks Cyd! Great to hear. I'm learning lots as I go too!
  • ThierryEMMANUEL's avatar
    ThierryEMMANUEL
    Community Member
    2 months ago
    Bonjour Heroes. I only took a few days off, then came back quickly to start working hard again... and what am I learning? You started without me! So I'm woefully behind, but “the important thing is to participate” (it's a hint). I've just published my project in last week's challenge (thanks David for including me in the recap). To cut a long story short, it starts with the words “Did you say ‘game’, David? What else can I do but... the Olympic game...”. No French pride here, no patriotic vanity, but these are the Olympics! (even if there is a naked blue man in it). I'll try to catch you up before the end of the week. See you soon.
    • JodiSansone's avatar
      JodiSansone
      Community Member
      2 months ago
      I look forward to see what you do with this theme! I love how the games are incorporating the locations from your city. Who doesn't love seeing the la Tour Eiffel behind the beach volley ball court?
      • ThierryEMMANUEL's avatar
        ThierryEMMANUEL
        Community Member
        2 months ago
        Thank you Jodi. Even when you're just posting a comment, you have great ideas. You're the Simone Biles of the discipline :-). I'm going to insert some Paris locations in the background of the screens.
  • SyedAmjad-Ali's avatar
    SyedAmjad-Ali
    Community Member
    2 months ago

    Hi,

    This week, we developed the prototype for "Sustainable Future: Eco Warrior Quest". Our game show concept educates players on sustainable living, renewable energy, and conservation through interactive challenges. The prototype includes basic interactions, scoring, and feedback mechanisms. We've also refined our visual storyboard and flowchart to ensure a smooth gameplay experience.

    https://www.swiftelearningservices.com/articulate-challenge-471/
  • JodiSansone's avatar
    JodiSansone
    Community Member
    2 months ago
    Date or Ditch
    https://360.articulate.com/review/content/5ec9f234-a78a-468c-86d9-a586b5084fb1/review

    Here's where I am as of today, Friday, 4PM. I focused on creating my groovy 60s vibe and assembling my creative elements--the art, characters, and audio. I found it took me longer to set up the game show than I expected, but I'm following the format of the Dating Game. I have scripts that I'll work on to simulate the questions to the contestants. So far, I like my host character--the AI voice I'm using met my goal of finding someone in the fun style of Steve Harvey. I've posted it in Review and would welcome any thoughts or feedback.
    • JodiSansone's avatar
      JodiSansone
      Community Member
      2 months ago
      I just updated my demo. I'm almost done with the first round--Kym the Chief Risk Officer. Overall this is taking a lot longer than I expected. I committed to doing three rounds, and it's going faster, but getting all the elements in place and repeating them has been challenging. In my dating questions, I'm trying to show how you can use something like this, maybe if your client has a sense of humor, as a course quiz. This is the cringiest thing I've done in ages. I overheard my husband Carl humming "Spanish Flea" today which means this tacky song really gets into your head.
      • CydWalker_mwhc's avatar
        CydWalker_mwhc
        Community Member
        2 months ago
        Loving the scripting Jodi! And I think I'll be humming the song today as well.
    • Samuel's avatar
      Samuel
      Community Member
      2 months ago
      I imagined being part of a live audience would be like this. Great overall aesthetics!
    • CydWalker_mwhc's avatar
      CydWalker_mwhc
      Community Member
      2 months ago
      Love the concept and the characters Jodi! Where did you find them?
      • JodiSansone's avatar
        JodiSansone
        Community Member
        2 months ago
        Hi Cyd. The characters come from GraphicMama. They are exagerated, which is what I like about them. A whole set of 100+ poses and the AI boards are about $50 per set. I've been adding characters for about 6 years. Someone in the community used them several years ago and I just glommed on to them.
  • JesseWu's avatar
    JesseWu
    Community Member
    2 months ago
    Fake Door Mixology E-learning Game

    https://360.articulate.com/review/content/a977e4cb-80df-443c-921d-4cd659c1ba2b/review

    Progress so far:
    1. Basic UI, the recipes object;
    2. Learning mode: Select from menu layer to change content displayed in LM layer;
    3. Challenge mode: A timer, random draw 4 items from the recipes object with triggering timer.

    To do list:
    1. Collect user inputs. Probably have to create unique variables with dialog for underbar elements
    2. "Deliver" mechanism -> Compare user inputs with stored recipes. Need a TBD workaround.
    3. Other details like toggle star status with Booleans

    Not so satisfied with Articulate:
    1. I have to create Booleans as middlemen in order to alter slide layer B from slide layer A.
    2. I cannot directly claim a global variable from inserting custom JS in base layer. No such convenient thing as %recipes.shirleyTemple% without using player.setVar().

    I anticipate that the result might be out of control due to my smol brain.
    It feels like building that Undertale game, which is famous for wrapping dialogs of the entire game in switch statements.
    May submit a codepen.io project at the end rather than Articulate project because Bootstrap 5 and vanilla JS will be way easier to achieve what I planned.
    • arron's avatar
      arron
      Community Member
      2 months ago
      Splitting the game into a learning mode and a challenge mode is a nice idea.

      I looked into Undertale and supposedly it has a 1,000+ line switch statement!? It's motivating to know that you don't have to be the best programmer in the world to create a successful game.
      • JesseWu's avatar
        JesseWu
        Community Member
        2 months ago
        The 4 minutes for 4 drinks idea is what I was taught in my bartender training. Unfortunately I have to nerf it to 1 minute for 1 drink because I don't want to add 4x more variable or triggers in this already blinding project.

        Yes. The author of Undertale do have an iron will that I don't :)
  • Ron_Katz's avatar
    Ron_Katz
    Community Member
    2 months ago
    For week 2 of this challenge, I have focused on the graphic design elements and the game engine.

    Demo: https://360.articulate.com/review/content/99f45a4b-e3ae-4a07-818a-79315a914e7d/review

    As I played with the design, I decided to use as many of Storyline's built in features to limit the number of triggers. For this reason, each request for an extension is a Freeform Quiz Slide. This allows for the elimination of multiple triggers from my original game design.

    I was hoping this would allow me to drop all the slides in a Question Bank and just do random draws, but when I tried it with this type of repeating structure, it just kept drawing the same slide over and over again. So I had to do the random part myself.

    In the game engine, 2 random numbers are selected, one for the Quiz Question Slide, and one for the voice. Each slide has 4 text to speech voices asking for the extension number which are selected based on the "voice" variable. The advantage of using text to speech will become apparent in the production stage where all three rounds are developed and the number of Quiz Question Slides expands from 3, to 6, to 10, to 18.

    Since these are Quiz Question Slides, we can use a Key Press as a submit button without any additional triggers. We can also have several variations of the correct answer. Once again, this will be critical when we enter the production stage.

    Next week I will build out all three rounds of play. In the final week I will add Intro and Outro, sound effects and music, accessibility features and more.
    • JodiSansone's avatar
      JodiSansone
      Community Member
      2 months ago
      I like your creative elements and the color scheme has some pop. The purple wash is nice touch.
  • Jonathan_Hill's avatar
    Jonathan_Hill
    Super Hero
    2 months ago
    Hello!

    For Week 2 of this challenge, I have concentrated on building the scoring system for my game, 'Compliance Catchphrase'.

    Text entry questions can be subjective, so the scoring system for my game needs to recognise ‘near misses’. In this prototype, the ‘phrase that pays’ is 𝙗𝙚𝙣𝙙 𝙖𝙩 𝙩𝙝𝙚 𝙠𝙣𝙚𝙚𝙨. An exact match will produce a 100% accuracy score. But if the learner ’overshoots’ the correct answer and adds additional words, credit will still be given for the ‘phrase that pays’.

    HOW IT WORKS: https://bit.ly/elhc471
    ROUGH DEMO: https://bit.ly/elhc471demo
  • DavidAnderson's avatar
    DavidAnderson
    Staff
    2 months ago
    Even if you didn’t participate last week, you’re still welcome to join this week’s challenge. Ideally, you’ll complete all four weeks, but any participation is appreciated. Share what you can.