Rock Paper Scissors

Written by tb. | Published 2017/07/13
Tech Story Tags: javascript | html5 | css | programming | critical-thinking

TLDRvia the TL;DR App

The assignment was to create a Rock, Paper, and Scissors game using JavaScript in HTML.

Presented on March 20, 2017

Leap 1- Understand and Define

My engineering class teacher had assigned my class a project to create a Rock, Paper, and Scissors game using JavaScript in HTML that the user verse the computer. The computer would have to generate a random character to verse with the choice of the user. To make the game fair, one computer choice can not come up more than the rest.

My game definition (Product Description)

The javascript game will consist of three characters (Rock, Paper and Scissors). Each character will have different number ranges which allow them to verse each other, allowing them win or lose. One computer choice can not come up more than the rest. There will be a welcome screen with the game title and legend and white background. The user then will be instructed to move on to the next section, to choose their character. The user will have three options to choose from (Rock, Paper or Scissors). Once the user chooses its character, they will click “ok” to show their character’s image on one side “VS.” the character’s image that the computer will choose randomly. The result will be displayed at the bottom of the same page. Once the result is displayed, the user will have the choice to restart. The following legend shows how the results were determined.

The user can also run a test to see how many times the computer picks each choice over a repetition of 10,000x.

Leap 2- List steps (Algorithm)

1. When a user makes a choice (Rock, Paper or Scissors), computer makes a random choice.

2. The computer makes its choice by:

• Generating a number from 0 to 9.

• Then, corresponding the number with the ranges of the characters.

• For example, if the computer chose

.33, it will then compare that number to the range that it falls into and show its choice (Rock).

3. The computer will then compare its choice with the user’s choice by:

• Using the rules defined by the legend.

4. Once the program is done comparing, it will then prompt a message letting the user know whether the computer or the user won.

Leap 3- Expand steps (Flowchart)

Leap 4- Establish test plan

In order to test my program, I will first make sure that the elements(i.e. Images, texts, background) load properly. Then I will check to make sure that the content of each page are loading in the proper sequence. Then I will make sure that the function of each page is in working order. I will specifically check to make sure that the computer is able to randomize and “fairly” make its choice. I will also check to make sure that the program is able to compare the user’s choice to the computer’s choice and display a result according to the legend.

Leap 5- Execute test (Code)

Click to see the Rock, Paper, and Scissors program that I coded.


Written by tb. | -
Published by HackerNoon on 2017/07/13