Project Info
Inspiration
I have pain in my right shoulder, it has been clearly because of my poor posture sitting in front of my laptop. I wish there would have been an assistant who would have reminded me every time I slouch for more than 15-20 seconds to correct my posture. We realized this could be a good utility application for most of the office workers. MediaPipe offers pose detection and landmarking of the body. And, A study found that the average office employee spends 1,700 hours a year in front of the computer. i.e. 6 hours a workday. There is good potential to track the emotional wellbeing by measuring the expressions and accordingly
What it does
With the help of live video input, Feature 1: Measures the slouch intensity and notifies if its beyond the threshold. (using Mediapipe) Feature 2: Measures the expressions elicited by browser-window/applications. (using Hume)
How we built it
1st Iteration: We used vanilla HTML/CSS/JS to run the application, soon realising the shortcomings, i.e. only restricted to the browser. Only Posture correction feature was added using Mediapipe. 2nd Iteration: We used Electron to build a native app, which was able integrate both the features that is expression measurements and slouch detection. We used Hume API for expression measurements.
Challenges we ran into
We teamed up 24 hours before the deadline. : shortage of time Deciding which platform to go with, considering the permissions and other aspects.
Accomplishments we're proud of
Ethan a full-stack developer tagging with beginner- Akshay. Using Gemini API to calculate the slouch intensity. (This was surly not the intended use case) Breadth of various technology stacks used on the project.
What we learned
Learning a novel approach to detect the slouch using Gemini-Mediapipe API. Learned about contributing and working on open-source projects. Team work Working towards deadline.
What's next
Gait analysis for detection of early onset of orthopedic conditions. Better UI, be able deploy for end user. Monitor emotional health and produce better insights using Hume's measuring expressions.
Vibetracker
Making personal health manageable.
Development
Install Node.js.
Install the project dependencies:
npm i
Run the development server:
npm start
P.S. Create a copy of vibetracker.example.json and rename it to
vibetracker.json and fill in the necessary
Hume credentials.
Developed with <3 at Calhacks 11.0
Analysis
View
Metric
- 22
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CSSIn code
- HTMLIn code
- JavaScriptIn code
- Google GeminiClaimed
- TypeScriptClaimed
3 of 5 appear in the indexed code. 2 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
16 KB
Source files
9
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
EthanThatOneKid/vibetracker
14 files · 119 KB · @ b658ed4
Structure
Interface
2 files · 14%Screens, components and styles rendered to the user.
Application logic
6 files · 43%Domain rules, services and shared utilities.
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- JavaScript85%
- HTML9%
- Markdown5%
- CSS0%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
package.json
npm · 5- @mediapipe/tasks-vision
- @paymoapp/active-window
- axios
- hume
- +1 more
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
Feature verification
Electron native desktop app combining both featuresVerified
2nd Iteration: Used Electron to build a native app integrating both posture and expression features
Claimed on Devposthigh confidencemain.js:2— Electron app, BrowserWindow, ipcMain used to build the native apppackage.json:20— electron listed as a dependency and npm start runs 'electron .'preload.js:24— contextBridge exposes electronAPI.incomingCapture, connecting the MediaPipe renderer capture loop to the Electron main process that talks to Hume
Expression measurement via Hume APIVerified
Measures the expressions elicited by browser-window/applications, using Hume
Claimed on Devpostmedium confidencehume.js:16— createJob uploads captured frames to Hume's expression measurement batch APIhume.js:75— pollJob polls Hume for predictions and extractEmotions parses per-frame emotion scoresmain.js:69— addCaptureToQueue batches webcam captures from the renderer via IPC and triggers sendBatchToHume, wiring capture to Hume end-to-endmain.js:105— Emotions are extracted but only console.log'd; storeEmotion call is commented out, so results are not persisted or surfaced in the UI
Hume credential configuration via vibetracker.jsonVerified
Create a copy of vibetracker.example.json, rename to vibetracker.json, fill in Hume credentials
Claimed on readmehigh confidencevibetracker.example.json:1— Example config file with humeApiKey/humeApiSecret placeholdershume.js:4— Reads vibetracker.json and uses humeApiKey/humeApiSecret to construct the HumeClient
Slouch detection via MediaPipe pose landmarking with threshold notificationVerified
Measures the slouch intensity and notifies if its beyond the threshold, using Mediapipe
Claimed on Devposthigh confidencemediapipe.js:68— createPoseLandmarker initializes MediaPipe PoseLandmarker and predictWebcam runs detectForVideo on live webcam framesmediapipe.js:156— Computes nose-to-shoulder distance from landmarks as a slouch intensity proxymediapipe.js:163— updateSlouching compares distance to a 0.2 threshold and sets slouching flagmediapipe.js:169— Fires a browser Notification ('Unslouch'/'Sloucher!!!') when slouching is detected
Per-application/window emotion taggingCode-supported
Tracking emotional wellbeing by measuring expressions elicited by specific browser-window/applications
Claimed on Devpostmedium confidencemain.js:93— Uses ActiveWindow.getActiveWindow() to tag each emotion result with the active application's appIDemotion-history.js:8— getEmotionByAppID exists to query stored emotions by app, but it is never called anywhere in the codebase and storeEmotion is commented out in main.js, so the feature is not wired end-to-end
Gait analysis for early orthopedic condition detectionClaimed only
What's next: Gait analysis for detection of early onset of orthopedic conditions
Claimed on Devposthigh confidenceGemini API used to calculate slouch intensityClaimed only
Using Gemini API to calculate the slouch intensity (novel Gemini-Mediapipe approach)
Claimed on Devposthigh confidenceTypeScript used in the projectClaimed only
Built with: typescript
Claimed on Devposthigh confidence
An AI agent derived these features from the project’s Devpost page and readme, then searched the code for each one. Verified features are backed by cited code; claimed-only features had no supporting code, which is not by itself proof a feature is missing.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.