Pentago: Milestone 1

pentago-03

Description, Inspiration and Audience

For this project, we will be using the React framework to create a web-based version of the game Pentago. Pentago is a board game played with two players, and it is similar to Connect-4. But the challenge of the game is to connect a line of five pieces before the other player can connect theirs, and the game board is broken up into four quadrants that can be individually rotated. Each turn, a player places a marble and turns one quadrant 90°. This allows players to prevent each other from winning or transform the board in a way that is more favorable for themselves.

61cwbqxlgwl._sy355_

We were inspired by the two-person nature of the game (rather than a game played alone) and the intellectual challenge it provides. Plus, most people know how to play Connect-4 and would be excited by the new challenge.

Our audience is anyone who wants to play a fun and challenging web game with another person for a few minutes! Since the game is two-player, players can both play at the same computer and just take turns operating the mouse when it is their turn.

Team Members

We are able to pick our team for this project, so I will be working with my good friend Nate Bennett to create our digital Pentago game!

Content or Sources

One very important resource for us will be the directions for how to actually play the game. Beyond that, the React Documentation will be valuable to us since we are relatively new at creating React apps.

Visual Design / Mockup

Here is our first draft for the visual design of our project. It should be manageable to keep track of our React components, since the game board design lends itself nicely to nesting components.

Our board will be centered on the screen with spaces for each player’s name (to be added in an editable text field) and their marbles. The bottom of the screen will display which player’s turn it is. When one player wins and the game is over, there will be a button visible to play again and reset the game board.

This is just an initial visualization for our project and may change as we develop our code, (for example the quadrants need the ability to be rotated in either direction), but it shows all of the main components of our final deliverable.

pentago-01

pentago-03

pentago-04