This puzzle app is a resource for developers to help them consider the accessibility of their own apps. The app particularly focuses on the experience for players who use screen readers. The source code for the app is publicly available at https://github.com/gbarkerz/GridGames. The app is built using the .NET MAUI UI technology, and its source code shows a number of accessibility-related topics described at https://docs.microsoft.com/dotnet/maui/fundamentals/accessibility.
The Grid Games app contains three puzzle games.
The Pairs Game is based on a traditional card matching game, where face-down cards are turned over in order to find pairs of cards. When the game is run, a 4-by-4 grid of blank squares appears, with each square representing a face-down card. When one of the cards is turned up, it reveals an image on the face-up card. When another card is turned up, an image is also shown on that second face-up card. If the two images are the same, then the cards are considered to be matched, and will not change again for the rest of the game. If the images do not match, then the cards are considered to be unmatched, and cards must be then turned back down. These steps are then repeated until all matching images have been found, and a "Congratulations" window appears.
To have your own pictures shown in the Pairs game, along with custom accessible names and descriptions, please follow the steps described in the Pairs Settings page.
The Squares Game is based on a square sliding puzzle, where squares in a grid of squares are rearranged by the player to form an ordered sequence of squares in the grid. When the game is run, a 4-by-4 grid of squares appears, with fifteen of those squares occupied with a movable element, and one square being empty. When a square is clicked, if it is adjacent to the empty square, the clicked square moves into the empty square. The space where the tapped square was then becomes the empty square. The aim is to arrange all the squares in a sorted order, leaving the empty square in the bottom right corner of the grid. Once all the squares are ordered, the game is won.
To have your own picture shown in the Squares game, please follow the steps described in the Squares Settings page.
The Where's WCAG? game aims to help players become more familiar with WCAG groupings. "WCAG" is the Web Content Accessibility Guidelines (WCAG) international standard, which helps web content authors create content that's more accessible. The WCAG standard has been used as the base for European accessibility standards which apply to both web content and software.
The Where's WCAG? game presents a question asking the player to find a particular WCAG group. For example, "Where's Enough Time?". Below the question in the app is a 4-by-4 grid of squares showing fifteen WCAG group numbers. For example, "2.2". The aim of the game is for the player to click the square in the grid which shows the number matching the WCAG group in the question. If successful, the square changes to also show both the number and name of the WCAG group, and the question changes to ask the player to find a different WCAG group. If not successful, the player tries again by clicking another square. Once all the WCAG groups are found, the player has won, and a "Congratulations" window appears.
Bonus WCAG-related questions can be presented while playing the Where's WCAG game. To have your own bonus questions asked in the Where's WCAG game, please follow the steps described in the Where's WCAG Settings page.
The Grid Games app contains three puzzle games.
The Pairs Game is based on a traditional card matching game, where face-down cards are turned over in order to find pairs of cards. When the game is run, a 4-by-4 grid of blank squares appears, with each square representing a face-down card. When one of the cards is turned up, it reveals an image on the face-up card. When another card is turned up, an image is also shown on that second face-up card. If the two images are the same, then the cards are considered to be matched, and will not change again for the rest of the game. If the images do not match, then the cards are considered to be unmatched, and cards must be then turned back down. These steps are then repeated until all matching images have been found, and a "Congratulations" window appears.
To have your own pictures shown in the Pairs game, along with custom accessible names and descriptions, please follow the steps described in the Pairs Settings page.
The Squares Game is based on a square sliding puzzle, where squares in a grid of squares are rearranged by the player to form an ordered sequence of squares in the grid. When the game is run, a 4-by-4 grid of squares appears, with fifteen of those squares occupied with a movable element, and one square being empty. When a square is clicked, if it is adjacent to the empty square, the clicked square moves into the empty square. The space where the tapped square was then becomes the empty square. The aim is to arrange all the squares in a sorted order, leaving the empty square in the bottom right corner of the grid. Once all the squares are ordered, the game is won.
To have your own picture shown in the Squares game, please follow the steps described in the Squares Settings page.
The Where's WCAG? game aims to help players become more familiar with WCAG groupings. "WCAG" is the Web Content Accessibility Guidelines (WCAG) international standard, which helps web content authors create content that's more accessible. The WCAG standard has been used as the base for European accessibility standards which apply to both web content and software.
The Where's WCAG? game presents a question asking the player to find a particular WCAG group. For example, "Where's Enough Time?". Below the question in the app is a 4-by-4 grid of squares showing fifteen WCAG group numbers. For example, "2.2". The aim of the game is for the player to click the square in the grid which shows the number matching the WCAG group in the question. If successful, the square changes to also show both the number and name of the WCAG group, and the question changes to ask the player to find a different WCAG group. If not successful, the player tries again by clicking another square. Once all the WCAG groups are found, the player has won, and a "Congratulations" window appears.
Bonus WCAG-related questions can be presented while playing the Where's WCAG game. To have your own bonus questions asked in the Where's WCAG game, please follow the steps described in the Where's WCAG Settings page.
Open up
