GithubHelp home page GithubHelp logo

retro-games's Introduction

Designing Retro Games

In this workshop, students will explore the history of video games, and then create a retro-style game of their own. They will use Microsoft MakeCode Arcade, a web-based beginner-friendly code editor, to build a platformer game. They will be able to develop the gameplay, art assets, game map, and more. By the end of the workshop, they will have gained a basic understanding of game development, and each student will have a fully functioning arcade game of their own design.

Student Content

Student-facing content is available at hytechcamps.github.io.

Agenda

Here are some general guidelines for the overall flow of the camp:

Activity Time
Icebreaker 30m
Presentation 15m
Break 10m
Code-Along 30m
Blooket 10m
Challenges 10m
Game Sharing 10m
Conclusion 5m

Tips

Here are some tips to ensure a successful run:

  • Before the camp, read through this lesson plan thoroughly
  • During the camp, ask the students questions as often as possible
    • Ask for their names, hobbies, animals, colors to use... anything!
    • Ask for suggestions about what to do next
    • Poll them to see what they know, or what they'd like to do
  • Make sure to turn off notifications for Teams, Outlook, etc
  • Make sure to zoom in properly on code blocks
  • Encourage students to make their own choices in the project
    • The more they personalize their games, the more fun they tend to have!
  • Take it slow at first, and always check to see how the students are progressing
    • Don't trust them to tell you; make sure to actually have an assistant look at their screens and give the go-ahead
    • Give students time to catch up before moving too far ahead, but...
    • Don't stall too long on any one part

Camp Outline

The entirety of the camp flows through the PowerPoint Presentation.

Icebreaker

Have students draw a video game character using Sketch Toy, and introduce themselves along with their drawings.

Drawing

Introduce Sketch Toy, and show some basic drawing features (size, color, vibration). Make sure all the students can get to the drawing site through the camp homepage, and give them some time to draw. Additionally, show them how to save their drawings, and copy a link for submission.

Submission

After a few minutes, students should submit their drawings using the form linked on the camp homepage. View responses in the spreadsheet; make sure to filter by the current room.

Show and Tell

Go through the responses, and call on each student. They should introduce themselves by sharing their name, grade, school, and the character they drew.

Presentation

After students have warmed up with the icebreaker, it's time for the presentation portion of the PowerPoint. These slides contain a brief history of video games (specifically focused on platformers), and there are talking points in the slide notes.

Code-Along

Walk through the Code-Along with the students. Start building a simple platformer using MakeCode Arcade.

Deviations

The students should be able to:

  • Name their "Main Character" sprite something different
  • Draw their own character, tile, and map
  • Change the values for the controller vx, the gravity ay, the jump vy, the animation interval, and the game over effects

Other than those things, they should follow the instructor's code.

Blooket

Blooket is a fun formative assessment tool that's similar to Kahoot, but more game-based. There are a variety of game modes where the students compete against each other in different ways. Answering questions correctly helps them achieve more success in each game.

For a Blooket guide with screenshots, click here

An account is required to host the game; here are some credentials you can use:

  • Username: techoutinst
  • Password: Tech0utreach

When setting up the game, consider how long it will take for the game to finish. Note that it will likely take 2-3 minutes for all the students to join the game, so a game time limit of 7 minutes might end up taking about 10 minutes.

  1. Go to the Blooket Login Page
  2. Enter the credentials above
  3. Once logged into Blooket, go to the question set
  4. Click the Host button
  5. Select the Fishing Frenzy game mode (or another requested mode), and click the Host Game button
  6. Adjust the time as needed, and click the Host Now button
  7. Instruct students to go to play.blooket.com, enter the Game ID and a nickname, and join the game
  8. Once all students have joined, click the Start button

From there, the students will work on their own, answering questions and trying to win the game!

Challenges

Give students some time to add more to their games. There are a bunch of challenges they can try by following the guide. The goal of this portion is to inspire the students to continue playing with MakeCode Arcade. The guide provides some direction for the students to add features to their game, but it is not necessary for the students to follow the challenge guidelines directly - encourage them to do whatever is most fun for them!

Game Sharing

Encourage the students to share the games they've built with the room. They can share them through this form.

Click here to view submissions.

Conclusion

Make sure to close out the camp on a strong, positive note of encouragement. Here are some key points to hit:

  • Thank the students for participating
  • Encourage them to continue learning about coding on their own
  • Tell them they can reach us at [email protected] if they have any questions or would like any guidance
  • Send them on their way!

retro-games's People

Contributors

josephmaxwellhyland avatar hylandtechoutreach avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.