Inspiration
My inspiration for this project was formed when I tried my hand a blindfolded chess and struggled immensely despite already knowing the game. I then was interested if the most popular chess website, chess.com, had any accessibility tools to help with learning this subset of chess. I was shocked to see a complete lack of accessibility options for those blind or visually impaired. Thus when I was listening to the opening ceremony, I wanted to allow for more people to play this game thus I decided to create this project.
What it does
This project adds in some accessibility features that make it much easier for those who are blind or visually impaired to play this game as well as giving the ability for local play to be completely unreliable on the pieces by hiding the board.
How we built it
I used three libraries to create the chessboard visuals and logic. By using the library for the chess logic in tandem with a visual representation I was able to connect and extend the functionality of each library into each other creating a complete chess program. I then added in multiple accessibility features using targeted Speechsynthesis to read out board states, square states, and moves. I also added in keyboard implementation so that users would not have to drag and drop pieces but could instead move them through simple text inputs. I also allowed these accessibility features to be toggled through the text prompts as well.
Challenges we ran into
I had never worked with JavaScript libraries or npm installations so it took a while to understand how to correctly use these libraries in my projects. It took a long time to understand how the libraries were working and how to exploit there given functionalities.
Accomplishments that we're proud of
I managed to get the logic working for the chess program including limiting the moves that users could make on the website board using the logic from the chess.js library.
What we learned
How to install libraries using npm, how to use different libraries in tandem to serve one purpose, and how to use Speechsynthesis in my web application.
What's next for Accessible Chess
More accessibility options such as speech recognition and implementation of the program's basics as a plugin for other chess websites.
Built With
- css
- html
- javascript
- jquery
- speechsynthesis
Log in or sign up for Devpost to join the conversation.