-
The landing page which links to the various version of the app export. Currently only the web export is available.
-
The home page of the app.
-
Screen that allows users to type in braille and see the translation.
-
Chatroom where users can use braille to communicate with eachother.
-
Screen that shows all the translations (currently possible in the app).
Inspiration
I created a similar app several years ago using Swift. It was one of my first larger-scale projects, and I made some terrible design choices. I published it to the App Store, and it has been downloaded thousands of times. I've always wanted to add more to it, but it was very hard to maintain.
For a while, I've been thinking about redoing it, but I've always had other projects to work on. Finally, this hackathon gave me the opportunity to start over.
What it does
BrailleDecoded is a simple app that teaches users how to read and write Braille. Obviously, it doesn't allow users to read Braille by touch, but it helps people start learning and encourages inclusivity.
There's a page that gives users a word they need to spell and gives them points based on the difficulty of the word/phrase. Also, there's a live chat feature where people can write messages in Braille, which are shared in a public chatroom.
How I built it
Since I knew what I wanted the app to look like and had already determined the best design choices while maintaining the previous version, building the app was fast and easy (once the environment was set up). I used React Native with Expo so I could export the app to a web version, iOS, and Android.
The live chat runs on a very simple Express.js server that stores messages in a JSON file. Any user whose UUID is stored in admin.json can delete messages. I decided not to use Socket.io for live chatting, and figured that a REST API would be sufficient for this project.
Since I plan on working on this project further, I decided to buy the domain brailledecoded.com. To plan ahead, I exported the web version to the subdomain app.brailledecoded.com and created a simple landing page at brailledecoded.com. The backend is hosted at api.brailledecoded.com. The web version is published on GitHub Pages, and the landing page and backend server are hosted on my company's self-hosted server.
Challenges I ran into
Although I've used React Native before, it was a huge pain. I spent several hours just setting everything up. And it also took quite a while to export a web build.
I had hoped to also have an iOS build ready to demo, but it's going to take longer to figure out.
The hardest part of this project, though, has been staying awake.
What's next for Braille Decoded
Currently, the app only incorporates a small amount of Braille. Many shorthands and other aspects of Braille still need to be added, including capitalization and numbers (UEB Braille Chart).
I also want to include non-intrusive ads within the whitespace of the app. I believe I can monetize this app and website without harming the user experience.
Log in or sign up for Devpost to join the conversation.