Struggling with wrist pain from typing? Unwind is here to help! Our website raises awareness about the importance of good posture to prevent health issues like carpal tunnel syndrome. Say goodbye to discomfort and hello to efficient typing!
Our hands are one of the most valuable assets we have, and it’s easy to take them for granted. From mundane everyday tasks like brushing our teeth to operating in the emergency room, hands are our way to interact with the world. This makes it all the more alarming how badly we take care of them. Bad posture, especially with typing, can lead to many health related problems including arthritis, carpal tunnel, and tendonitis. We hope to raise awareness of these issues and help alert users of bad posture through our website: Unwind.
Our project features the Leap Motion, a device used to track hand position through visual input. We used this hardware to analyze the posture of a typist–whether their wrists are at an appropriate angle for typing or not. Our connected website updates in realtime with the hand tracking while the user can take a basic typing test.
This project has three main components: the hardware, the backend server, and the frontend page. For the hardware, we had to mount the Leap Motion sensor to a place where it could easily scan. To ensure a consistent reading of the typist’s hands, we chose to mount the sensor atop a lightweight headgear rig composed of custom 3D-printed parts and a pair of safety goggles. To access the Leap Motion API, we wrote a Unity program to collect the positions of the joints to calculate the angles of the wrists through vector math. This data was then sent to the backend AWS server via POST requests to be accessed by the React frontend, using Socket.IO.
We experienced many, many obstacles while trying to get the Leap Motion device to work. Its API for many languages, like JS and Python, was deprecated, with the only remaining options being to program in C or Unity. We chose the more visual IDE of Unity, which we were all unfamiliar with, and spent many hours configuring the device and software. It paid off though, as the visualization that it brings is stunning.
We also experienced many problems with AWS’s EC2 and Elastic Beanstalk. Initially, we used EC2, but found that the server would randomly become unresponsive, forcing us to reboot it through the AWS dashboard. This would lead to delays in development of up to 10 minutes as we waited for the virtual machine to reboot. Because of this, we switched to AWS’s Elastic Beanstalk.
Beanstalk initially proved to be troublesome, since our uploaded files just didn’t work at all. But after returning to fundamentals and slowly adding features, we eliminated the sources of error and got the entire application up and running!
While we were able to quickly assemble a basic frontend with React, we experienced difficulties turning it into a polished product. For example, the basic typing tests (inspired by MonkeyType) required an in-depth knowledge of React states, which we had to debug to get working. In addition, we originally wanted to embed an iframe showing real-time footage of the Leap Motion sensor but we could not set the CORS policy on the backend to enable that to happen. Instead, we opted to create our own images of the hand positions and use them to illustrate the user’s current hand position.
All of the parts work together to create a working product
- Working hosted fullstack
- Leap motion device worked and connects
- The 3D printed rig
We learned about Unity and Leap Motion’s Unity SDK.
More features! A more analytical typing test that can better track and store data about hand posture.
Leap Motion, Unity, AWS Elastic Beanstalk, Node.js, Express, React, Socket.IO, Onshape (CAD software)