search

jsseng / jigsaw

0 stars 0 forks source link

Develop a better user interface to handle puzzles with more pieces #18

Open jsseng opened 2 weeks ago

jsseng commented 2 weeks ago

Find applications that have a good user interface and consider the end user. Post some links and prototype images here

stephenlin801 commented 4 days ago

Jigsaw-3 Jigsaw-4 Jigsaw-5 Jigsaw-6

In order to facilitate these changes we will need to start utilizing scenes within Godot. One scene will act as the main menu, another as the selection screen for the puzzles, and another for the actual jigsaw game itself. Also let me know which option for the jigsaw game people like or if there are other ideas for a layout and design. I also designed these layouts without the ability to select the number of pieces but I would have another scene that occurs before the puzzle actually starts with the slider in the middle asking the user how many pieces they want their jigsaw puzzle to have.

Link to website: https://www.jigsawplanet.com/

stephenlin801 commented 4 days ago

Jigsaw-7

Jigsaw-8

Ideas for the layout of the selection screen for the number of pieces. This would occur after selecting a puzzle or after a random puzzle has been picked.

yivanovaa commented 3 days ago

Main menu

1

Second menu Select Puzzle/Number of Pieces The different puzzles can be grouped by level of difficulty (easy/medium/hard), depending on how complex the photos are and how many small details they have. Each page will have only puzzles of the same difficulty, e.g., easy. When clicking on a photo, additional information will be displayed about the puzzle, such as the title of the puzzle, the average time needed to solve the puzzle, and possibly other statistics. The menu for selecting the number of pieces can be placed at the bottom of the page. After selecting a puzzle and the number of pieces, the player needs to press the "Start Puzzle" button to ensure they don't start a game accidentally by clicking on a photo. Other game options can be added here, such as single/multiplayer, for example.

2

Game screen

Components:

  1. Buttons:

    • Shuffle: Shuffle the pieces and place them in new locations on the grid.
    • Hint: Place one piece from the puzzle in its correct location (can be a random piece, or the player can click on a place on the board, and the piece at this location will be highlighted/put into place).
    • New Puzzle: Go back to the main menu and start a new game.
    • Chat: Chat with others (maybe this is not a necessary function).
    • Settings: If we add music and sound effects, adjust the volume or other settings like brightness, for example.

  2. Progress Tracker: Track how much of the puzzle the player has solved.

  3. Zoom In/Out Buttons and a Quit Button to exit the application.

  4. The Actual Puzzle and Pieces

  5. A photo of the solved puzzle - when clicked, it will display the photo in full screen.

3