Scenario-based learning for web development class

I'm also looking to the community for some inspiration and am creating an elearning course that is heavily conceptual that teaches skills learners will need to become web designers/developers (HTML/CSS/Javascript). I really like the idea of creating scenarios and have seen some great examples here--but they are generally aimed at people who are already on-the-job. I am having a hard time thinking of a scenario that targets beginners learning how to code. I would like something story based...not just the presentation of concepts and examples.

Has anybody done a project with any similarities to mine that would be willing to share or has a better understanding of designing for this situation than me?  Thanks in advance.

6 Replies
Ashley Chiasson

Hi Tamara - provides some really easy to follow scenarios. You basically start with a blank page, and each 'lesson' builds on that blank page until it's the end product. I think something similar would work really well. I took the intro to html and css that they offer online, and it really provided a great foundation. You should really consider your audience, and dumb down your level of understanding (while not dumbing down your expertise) to showcase really basic functions in a very straightforward manner

ladies learning code specifically used a lot of screensharing of text-editor documents to illustrate the code and then the resulting page based on the code. 

Matthew Bibby

Thanks for sharing Ashley, do they offer online courses or is it all workshop based?  Oh, and I really like their homepage design!

Tamara, I love Code Academy's approach with their 'Hour of Code' application. If I was to create a 'learn to code' course - I would definitely be using that for inspiration. You'll also find some good ideas by exploring the free trials and tutorials offered on sites such as Code School, Code Combat, and

Who is the target audience? 

tamara cameron

Thanks for the suggestions--I really liked the 'challenges' in Code School. I have taught a range from grade 8 through to first year community college and want to make the content a bit more engaging when presented online. Some really nice ideas! Thanks for those.

 Ashley, when you say screen-sharing are you talking about a synchronous online class environment - because that would be an interesting way to make a course more interactive and participatory.

Best - tamara

Jedidiah Esposito

Throw the learner into a situation where their ability to code is going to save their character's life or save the world.

I remember a game I got as a kid that taught me to code in basic by basically throwing me onto a spaceship that was failing in the middle of space and requiring me to learn and author code in order to fix the ship. Not only did I love that "game" but I learned quite a bit playing it.