Hello, I'm Arifandi Tanggahma, and this is my journey.
With the vibe coding competition in full swing, I decided to challenge myself and push the boundaries of front-end development and system integration. Instead of creating just another basic quiz app, I built StudySuki AI with a multi-module architecture that integrates language learning, history, and strategy into a single unified state management.
Here are the core functionalities and main features injected into this project:
📖 1. Dual-Layer Language Architecture
The application strictly separates Standard/Pure National Languages from the Regional Accents and Local Dialects of 16 countries. Users are required to master the foundations of the standard language first before diving into dozens of deep regional dialect branches, completely preventing data leakage.
📊 2. Massive Dialect Radar & Phonetics Simulator
To simplify linguistic analysis, I designed a matrix array system that renders phonetic comparison tables simultaneously. This feature displays side-by-side base word comparisons for all 16 languages at once, complete with their phonetic symbols.
📜 3. Necromancy AI History Chat (Summoning Historical Personas)
This is the core feature of the Manuscript Library module. Utilizing isolated prompt persona logic, users don't just read summaries of ancient texts—they can literally summon the "spirits" of historical figures (the authors or subjects of the books) to engage in real-time, two-way interactive chats to deeply explore historical contexts.
♔ 4. FIDE Standard Chess Engine Integration
On the strategy front, I implemented an interactive chess engine that strictly adheres to the official regulations of FIDE (World Chess Federation). The system includes legal move validation, pure Unicode character rendering, and a Valid Move Highlighter to instantly detect illegal moves.
🔥 5. Time-Based Streak Check-In System
To maintain user retention, the gamification system is powered by real-time 24-hour calculations based on local storage timestamps. The daily check-in button locks down precisely and only reactivates after a full 24 hours have passed since the last check-in, accurately validating the user's daily consistency.
📈 6. Local Storage Analytics & Interactive Mascot Bounds
All learning progress and accumulated EXP are saved securely in isolated tracks, which are then pulled by the Analytics module to generate competency report charts. Simultaneously, the interactive assistant mascot is equipped with viewport bounding functions to restrict its coordinates, ensuring it never drifts outside the user's screen boundaries.
The ultimate challenge in this project was keeping the 16-language dataset strictly isolated within its respective channels while optimizing JavaScript logic performance to ensure all features run flawlessly without any lagging.
Try out the live web application here, bro:
🔗 https://studysuki-ai-1048028947533.asia-southeast1.run.app/
Let’s keep coding, keep vibing, and see you in the Top 100! 💻🔥
Top comments (0)