{"id":1836,"date":"2026-07-22T12:23:51","date_gmt":"2026-07-22T10:23:51","guid":{"rendered":"https:\/\/koredesign.studio\/?page_id=1836"},"modified":"2026-08-17T02:39:47","modified_gmt":"2026-08-17T00:39:47","slug":"rock-paper-or-scissors","status":"publish","type":"page","link":"https:\/\/koredesign.studio\/en\/rock-paper-or-scissors\/","title":{"rendered":"Rock, Paper or Scissors"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n \n \t\t\t

Web Development<\/p>\n\t\t\n<\/a>\n

\n\t\t\t\t\t
\n\t\t\t\t\t

Rock, Paper or Scissors<\/h2>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n
\n
\n \t\t\t

Overview<\/h2>\n\t\t\t\t\t

Developed as a collaborative project within the Mayerfeld Practicum Program<\/strong> by a team of four developers, the Rock Paper Scissors Game<\/strong> is a browser-based, console-driven interactive application designed to execute a 5-round battle between a human player and an AI opponent. The primary objective was to engineer a clean, error-free game engine using pure Vanilla JavaScript through peer programming and code review. The project focuses on core programming principles\u2014including randomized computer selections, case-insensitive string parsing, input validation loops, conditional outcome evaluation, and real-time score tracking\u2014all communicated through an engaging, narrative-driven terminal experience.<\/p>\n\t\t\t\t\t

The Challenge<\/h2>\n\t\t\t\t\t

Building a resilient, turn-based game engine within the browser console while working as a 4-person development team required managing strict logical flow, uniform code standards, and handling unpredictable user behavior. Key technical challenges included:
     - Randomized AI Decision Engine<\/strong>: Designing a fair, dynamic selection algorithm (computerPlay) that randomly generates \"Rock\", \"Paper\", or \"Scissors\" with equal probability.

     - Case-Insensitive Input Parsing<\/strong>: Normalizing user inputs to accept any capitalization variation (e.g., rock, ROCK, RocK) without breaking comparison logic.

     - Robust Input Validation & Error Handling<\/strong>: Ensuring invalid inputs (e.g., typos, empty values, or non-game selections) do not crash the application or generate console errors, forcing rounds to repeat until 5 valid hands are completed.

     - Stateful Game Engine<\/strong>: Tracking scores across 5 valid rounds, evaluating win\/loss\/tie scenarios, and dynamically declaring the overall champion upon session completion.<\/p>\n\t\t\t\t\t

Our Approach<\/h2>\n\t\t\t\t\t

Working in a team of four, we divided the development process into modular functional blocks to guarantee clean execution, code consistency, and defensive programming:
     - Computer Selection Logic (computerPlay)<\/strong>: Utilized Math.random() mapped to an array of choices to generate unpredictable AI moves.

     - Round Mechanics (playRound)<\/strong>: Engineered a pure function that evaluates player choices against computer selections, returning structured result strings based on traditional Rock-Paper-Scissors rules. Applied string normalization (toLowerCase()) to process user input seamlessly.

Interactive Game Loop (game)<\/strong>:
     - Built a central orchestrator function containing a stateful loop to execute a 5-round match:
     
     - Incorporated prompt() dialogs with clear instructions and narrative storytelling.

     - Applied validation guards: if a user enters an invalid choice or cancels, the engine alerts the user and repeats the specific round without advancing the round counter.

     - Logged real-time round feedback, live scores, and final match outcomes directly to the developer console.

     - Team Synergy & Code Review<\/strong>: Conducted joint debugging and peer code reviews to maintain clean ES6 standard practices and prevent runtime console errors across all edge cases.<\/p>\n\t\t\t\t\t

Project Gallery<\/h2>\n\t\t
\n
\n \t\t\t\"Screenshot\t\t\n \t\t\t

Play Game Live<\/p>\n\t\t\n<\/a>\n\n<\/div>\n

\n \t\t\t\"View\t<\/a>\t\t\n<\/div>\n\n<\/div>\n\t\t\t

Results<\/h2>\n\t\t\t\t\t

Developed successfully within the Mayerfeld Practicum Program<\/strong> framework, the project delivered a bug-free, highly resilient console mini-game that perfectly met all assignment criteria while demonstrating strong Vanilla JavaScript fundamentals and team collaboration:
     - Flawless Algorithmic Logic<\/strong>: Successfully executed 5 valid rounds per session with precise score management and instant result determination.

     - Zero-Error Defensive Coding<\/strong>: Completely eliminated runtime exceptions by gracefully handling invalid user inputs and edge cases.

     - Engaging User Experience<\/strong>: Delivered responsive prompt interactions and informative console output, turning a simple console exercise into a fun, storytelling mini-game.

     - Collaborative Success<\/strong>: Achieved a clean, unified codebase through effective peer review and team problem-solving among all 4 members.<\/p>\n\t\t\n<\/div>\n

\n
\n
\n
\n \t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
\n\t\t\t<\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n
\n \t\t\t

YEAR<\/p>\n\t\t\n<\/div>\n\t\t\t

2026<\/p>\n\t\t\n<\/div>\n

\n
\n \t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
\n\t\t\t<\/path><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n
\n \t\t\t

SERVICES<\/p>\n\t\t\n<\/div>\n\t\t\t

Web Design & Development
Interactive Experience
Collaborative Software Engineering<\/p>\n\t\t\t\t\t

TOOLS & TECHNOLOGY<\/p>\n\t\t

\n
\n \t\t\t

JavaScript<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

HTML5<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

VS Code<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Git<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

GitHub<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Chrome DevTools<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Console API<\/p>\n\t\t\n<\/div>\n\n<\/div>\n\t\t\t

TAGS<\/p>\n\t\t

\n
\n \t\t\t

Web Development<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Console Game<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Game Mechanics<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

JavaScript<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Algorithmic Logic<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Functional Programing<\/p>\n\t\t\n<\/div>\n

\n \t\t\t

Team Collaboration<\/p>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n

\n \t\t\t

Interested in a similar project?<\/p>\n\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t<\/path><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\tGet in Touch<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"

Web Development Rock, Paper or Scissors Overview Developed as a collaborative project within the Mayerfeld Practicum Program by a team of four developers, the Rock Paper Scissors Game is a browser-based, console-driven interactive application designed to execute a 5-round battle between a human player and an AI opponent. The primary objective was to engineer a […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1836","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/pages\/1836","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/comments?post=1836"}],"version-history":[{"count":70,"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/pages\/1836\/revisions"}],"predecessor-version":[{"id":2904,"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/pages\/1836\/revisions\/2904"}],"wp:attachment":[{"href":"https:\/\/koredesign.studio\/en\/wp-json\/wp\/v2\/media?parent=1836"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}