HN 표시: Aerko_ – 로컬 AI를 갖춘 오프라인 우선 바닐라 JavaScript 피트니스 PWA

First bug fixed: Added input validation and limits (no more 6,000kg users, sorry Hulk). Second bug fixed: Fixed i18n logic to prioritize browser language detection (now implemented in this repository too). All live updates and hosting changes will be reflected in this repository: github.com/PakuraDev/Hosting_Aerko_PWA Aerko_ is a web application designed to be installed natively as a PWA. It combines advanced nutrition tracking, progressive overload training, and biomechanical analysis via computer vision. It was built with an obsessive focus on local-first privacy, extreme performance, and a brutalist usability standard. The goal was simple: replace three different types of monthly-subscription CRUD apps with a single, standalone, zero-cloud environment. - 1. Design Philosophy & UX - 2. Core Engine & Modules - 3. Languages & Personalities - 4. Privacy & Security - 5. Architecture & Tech Stack - 6. The Role of AI in Development - 7. Roadmap System Warning: I am primarily a Product Designer. This project started as my Master's Thesis (TFM) and was forged through Design Thinking and usability testing with Reddit communities. The interface relies on neo-brutalism and a cyberpunk/IDE aesthetic. I am fully aware it won't be to everyone's taste, but it is built strictly for high-contrast visibility and speed. - Color Palette (60-30-10): Soft Black ( #1A1A1A ) background, White (#FFFFFF ) for text, and Acid Green (#CCFF00 ) as the accent. - Typography: JetBrains Mono combined with Clash Display (with Space Grotesk as a fallback). These fonts formalize the visual hierarchy using the perfect fourth as a scale and prevent number-reading fatigue. The app is visually intimidating but technically idiot-proof. It prioritizes Jakob Nielsen's efficiency component. - Custom Anti-Shake Keyboard: Designed for the harsh reality of lifting. When your CNS is fried after a heavy set of squats, you don't have the fine motor skills for tiny, native numeric inputs. The touch targets are massive by design and feature custom anti-shake logic to prevent double-logging inputs in a matter of milliseconds. - Transversal Data: Everything is interconnected. Log a new weight? The diet recalculates. Log a set? The app suggests the optimal weight for the next session based on your mesocycle's goal, fatigue patterns, and historical failures. Put in the effort once, and let the engine do the rest. - Base Calculators: Uses the classic 1984 Harris-Benedict formula (I like retro) with macro ratios based on ISSN scientific standards. Or, you can use God Mode and input everything manually. - Local Pantry & Barcode Scanner: A local database of +340 foods built from BEDCA and USDA data, combined with a native integration of the Open Food Facts API (via HTML5-QRCode) for zero-friction barcode scanning. - Modular Smart Checks: Based on Pareto's law. You configure your base diet (fixed weights like 600g of chicken, or variable weights daily). Then, daily tracking is reduced to checking off accordions in record speed. Meals also hook into the Notification Triggers API. - Volume Analysis: Cross-references your effective sets (filtering out warm-ups) with an anatomical database to map your exact volume thresholds (MV, MEV, MAV, or MRV). It features an Imbalance Detector that analyzes muscle head volume to warn you if you have structural blind spots. - Adaptive 1RM Calculator: A dynamic engine that switches formulas based on reps: Brzycki (under 5 reps), Epley (6-10 reps), and Lombardi (11+ reps). Analyzing biomechanics (Squat, Bench Press, Deadlift) locally on a mobile browser is usually a performance nightmare. Processing 1080p 60fps video via MediaPipe melts batteries and freezes the main thread. So, I built a workaround: - The Phantom DOM: MediaPipe demands DOM access to function, which makes Web Worker implementation hell. To trick the model, I built a "Phantom DOM" inside the worker environment. It tames the library without main-thread blocking. - Frame Traffic Controller: Processing 1080p60 is unnecessary. The video is downscaled (720p/480p) and dropped to 15-30fps via a Ping-Pong traffic controller logic (sends a frame, waits for the "FRAME_DONE" signal). - Math Interpolation & EMA: To prevent a choppy 15fps output on the UI, coordinates are mathematically interpolated on the main thread, and an Exponential Moving Average (EMA) filter is applied to smooth the tracking. Benchmarks (5 identical video passes): Tested across 5 different videos: Bench Press, Squat (90° & 45°), and Deadlift (90° & 45°). Note: A pure 90-degree camera angle is vastly superior for 2D pose estimation. Assuming the Heavy model as the baseline ground truth (100% reference): - Full Model (~87-94% match): Noticeably faster. It yields excellent results as long as the video lighting and recording angle are optimal. - Lite Model (~59-71% match): Extremely fast, but mathematically unreliable for serious biomechanics. It was so erratic and indecisive that it literally crashed my Python