Full playable demo

Play the full demo

Try a full first-to-three match, then build the same logic one small feature at a time.

Playable result only — the source code stays hidden.

Mission 00 4 min

Mission 0: See What You’re Building

Play the finished match first. Click the left, middle or right third of the game area to choose Rock, Paper or Scissors. The computer chooses randomly, and the first side to 3 wins.

What you’ll practise

  • arrays and array indexes
  • random()
  • strings and === comparisons
  • if, else if and else
  • AND (&&), OR (||) and grouped conditions
  • mouse input with mouseX
  • custom functions, parameters and return values
  • functions calling other functions
  • score and game state

This quest mostly reuses ideas from earlier QodiQuest quests. Look for the reminder sections in each mission. They show where you first learned the skill and how it fits this new game.

Build roadmap

What you’ll build, mission by mission

  1. 1
    Store the choices

    Reuse arrays to keep the three legal moves together.

  2. 2
    Let the computer pick

    Combine random choices with a function return value.

  3. 3
    Build one choice zone

    Reuse parameters to create one drawing function.

  4. 4
    Place three zones

    Work out the three equal starting positions yourself.

  5. 5
    Pick a move

    Reuse if/else-if/else with the same zone boundaries.

  6. 6
    Detect a draw

    Combine comparison, parameters and return.

  7. 7
    Work out the winner

    Repeat AND, OR and grouped conditions for the real game rules.

  8. 8
    Keep score

    Use another function to update the correct score.

  9. 9
    Organise a round

    Make several small functions work together through playRound().

  10. 10
    First to three

    Use OR and game state to finish the complete match.

Mission demoStore the Three Choices

Finished result only — the answer code stays hidden.