IPFit
DSTA BrainHack 2022
What is DSTA BrainHack?
BrainHack is a hackathon hosted by the Defence Science and Technology Agency (DSTA), a technology organisation that supports the Singapore Armed Forces (SAF).
DSTA actively looks for ways to improve the life of servicemen. In summer 2022 that meant helping the largest inactive segment of the SAF — the NSMen.
I joined with friends intending to learn new technologies. The hackathon hit home when we realised it revolved around solving needs of NSMen, as some of us were NSMen ourselves.
Difficulty faced by NSMen.
We were asked to present a solution to improve the quality of life of NSMen by leveraging digital technologies on mobile platforms.
A common problem faced by NSMen is scoring in the Individual Physical Proficiency Test (IPPT) — a test of push-ups, sit-ups and a 2.4km run.
The ELISS machine used for repetition counting leaves no leeway for form discrepancies, so many participants are penalised for bad form.
We focused on push-ups and sit-ups: helping future IPPT participants check their form using their smartphones, whenever and wherever.
Design challenge
How might we design a product for NSMen that's easy to use, but also allows them to approach IPPTs with confidence rather than dread?
IPFit.
IPFit is an AI-powered fitness app for NSMen that provides personalised workout plans and a form corrector for push-ups and sit-ups — the first of its kind on the market.
My responsibilities.
While we all participated in ideation, implementation and visual design, I was mainly responsible for visual design, UI/UX, and front-end programming.
We brainstormed ideas, product sketches and prioritised important features for the app.
I contributed to establishing the visual design guideline — typography and colour — for the app's UI.
I was responsible for implementing the UI via front-end technologies.
Front-end development
After aligning on the solution and UI design, I started on the front-end code — which took the bulk of my time.
This was my first time using React.JS, and implementing reusable components was a game-changer coming from vanilla JavaScript and HTML.
Implementing the horizontal scrollbar menu and the sticky exercise header on scroll were among the harder features.
TensorFlow.JS
We used MoveNet — a computer vision model that detects 17 body keypoints and runs client-side at 50+ fps on modern devices.
Detection uses points 13/14 (knee), 11/12 (hip), 5/6 (shoulder) for left and right sides respectively.
A push-up is "correct" when the body angle falls between 172° and 190°. Outside this range, the user is prompted to fix their posture.
Detection uses points 15/16 (feet), 13/14 (knee), 11/12 (hip), 7/8 (elbow).
A sit-up is "correct" if the elbow-to-knee distance at the upright position is less than 15% of the video stream width, and the hip and feet remain at approximately the same level throughout.
I Lift A Latte Actually!
Hackathons are a lot of fun. We were constantly forced to think outside the box and consider aspects of product design a programmer wouldn't normally encounter.
Using MoveNet, the exercises IPFit could support are essentially endless — as long as the camera captures the user's body.
Finishing in the top 10 out of 100+ teams in our first hackathon was genuinely rewarding. Big thanks to DSTA for an unforgettable experience!