Design

Below are our screens with descriptions for our Design Milestone:

Screen 1:

This is the screen when you first open the app. It contains the name of our app and a function to move to the next screen. Once you tap the screen, you will be taken to the Main Menu.

Screen 2:

This is our app's Main Menu screen. From here, you can access the play menu, analysis, and settings. The Play button will take you to the Play Menu, the Analysis button will take you to the analysis screen, and the Settings button will take you to the settings screen.

Screen 3:

This is the Play Menu. On this screen, you can choose whether to play between 2D Chess or 3D Chess. The screen has two other buttons: the Back Button, which will take you to the previous screen, and the Settings Button, which will take you to the Settings Page.

Screen 4:

This is the Difficulty Select Screen for the 2D board. Here, you can select between Easy, Medium, and Hard. The screen has two other buttons: the Back Button, which will take you to the previous screen, and the Settings Button, which will take you to the Settings Page.

Screen 5:

This is the Difficulty Select Screen for the 3D board. Here, you can select Easy, Medium, or Hard. The screen has two other buttons: the Back Button, which will take you to the previous screen, and the Settings Button, which will take you to the Settings Page.

Screen 6:

This screen is the analysis screen after clicking the analysis button. Once you are on this page there are two options, 2d chess and 3d chess. You may go back to the home screen if you would like by clicking the back arrow, and you can click the settings button to access settings.

Screen 7:

This is the 2D analysis button screen. You will be able to set up the board on your own will, and it will suggest best moves based on the color you select. Once you are ready to analyze, you click the button. If you want to open setting/options you can click the 3 bars on the top left to open up a window of options. to flip the screen for visualization purposes, you may flip the board with the button on the top right. If you want to switch colors, you simply select the other option on the bar.

Screen 8:

This is the screen to take the photo of the chess board. You will be prompted with advice on the best angles and then can take a photo of the real board

Screen 9:

This is the screen when you click the 3D button. You will be able to take a picture of a real life board, and it will simulate a 2d board on your screen. It will then look at each move made and decide if it was a good move or not. Once you are ready to analyze, you click the button. If you want to open setting/options you can click the 3 bars on the top left to open up a window of options. to flip the screen for visualization purposes, you may flip the board with the button on the top right. If you want to switch colors, you simply select the other option on the bar.

Screen 10:

Screen 11:

Screen 12:

Screen 13: This is the in game screen for the 2d play option. The top left contains the a button that takes you to in game options. The top middle contains the app logo for aesthetic purpose. The middle includes the board for the user to play on against AI. Above and below the board contains the words “Pieces taken:” which is a temporary placeholder until pieces are taken and the taken piece icon will be placed there (the actual app will not have the words). At the bottom of the screen is the feed for moves made.

Screen 14: This is the screen when the user wins the 2d game. It pops up when the game ends and includes two clickable button, the “Rematch” and “Main Menu” button. “Rematch” starts the game back over and “Main Menu” takes you to the menu of the app.

Screen 15: This is the screen when the user loses the 2d game. It pops up when the game ends and includes two clickable button, the “Rematch” and “Main Menu” button. “Rematch” starts the game back over and “Main Menu” takes you to the menu of the app.

Screen 16: This is the screen when the user draws in the 2d game. It pops up when the game ends and includes two clickable button, the “Rematch” and “Main Menu” button. “Rematch” starts the game back over and “Main Menu” takes you to the menu of the app.

Screen 17:

Screen 18:

This is the play screen for the 3d play mode. The left side is the 2d recreation of the irl board. The rop right side is the camera’s view of the board. The bottom right side is the feed of the players move. The options button gives the options of the app in the top right of the screen. The Black and white buttons indicates which side the player is on. This helps with the orientation for the player.

Screen 19:

Screen 20:

A victory screen for the user when they win in the 3d play mode. There will be an options button in the top right for the user to return to main menu and etc. The options button gives the options of the app in the top right of the screen. The Black and white buttons indicates which side the player is on. This helps with the orientation for the player.

Screen 21:

A victory defeat screen for the user when they win in the 3d play mode. There will be an options button in the top right for the user to return to main menu and etc. The options button gives the options of the app in the top right of the screen. The Black and white buttons indicates which side the player is on. This helps with the orientation for the player.

Screen 22:

A draw screen for the user when they win in the 3d play mode. There will be an options button in the top right for the user to return to main menu and etc. The options button gives the options of the app in the top right of the screen. The Black and white buttons indicates which side the player is on. This helps with the orientation for the player.