Kerjaan kami, dibedah.

A vocabulary trainer built around a 148-entry PDF that stays the source of truth: every row is transcribed verbatim — pronunciation, part of speech, three meanings, synonyms and examples with Indonesian translations — while AI enrichment lives in a separate layer and incomplete rows are flagged "Needs Review" instead of invented. On top of the library sit spaced repetition, nine games, a word-relationship graph, and an IELTS examiner that marks a full Task 1 or Task 2 response against the official band descriptors — on a chart the app generates, a sample task, or a chart you upload and have read by a vision model.

The system a whole school runs on, built across fourteen sprints. One student record feeds every module: enrolment and family relations, timetables and grades, RFID attendance, dormitory beds, Qur'an memorisation tracked to the individual verse, a double-entry accounting engine, laundry, procurement and asset depreciation, a read-only parent portal, a 42-KPI executive dashboard, and an event-driven notification engine. Every business rule is a pure function, so 1,876 invariants run in CI without a database — and the last sprint added the part most side projects skip: health probes, structured logging with secret redaction, verified backups, and fourteen operator pages that let an admin diagnose the system from a browser.

A ledger-first prepaid-wallet ERP for an Islamic boarding school. Finance tops up student balances offline, the Skillage Mart POS charges wallets at checkout through an idempotent API (charge-before-commit with automatic reversal on failure), and parents track every rupiah in a read-only portal. Money lives in an append-only Postgres ledger moved only by atomic row-locked RPCs, with multi-tenant RLS end-to-end — plus finance dashboards, reconciliation, reports, an audit trail and an event-driven notification centre.

A Linear/Jira-class work platform for any industry — organizations → workspaces → projects → tasks with a fully dynamic, per-project Kanban workflow (managers rename, reorder, recolor and weight their own columns), plus a Gantt timeline, calendar, reports and analytics. Postgres RLS enforces multi-tenant and guest isolation end-to-end, fronted by a secure read-only client portal.

A total revamp of a Depok housing estate's official website — premium navy-gold design, WhatsApp-driven lead funnels on every CTA, a live KPR mortgage simulator and a CMS-ready admin. Fully static (SSG) for speed and SEO.

A two-sided marketplace matching small businesses with micro-influencers. A deterministic AI engine handles matchmaking, campaign optimization and ROI projections — with an optional Claude assistant on top.

A premium, minimal parenting platform — "Parenting Made Simple and Smart." An eight-module ecosystem (consultation, pregnancy, classes, community, finance and more) built on a 23-model data schema.

A multi-tenant ERP for event organizers with strict tenant isolation, public registration and AES-256-GCM encrypted QR tickets. Phase 2 adds a permission matrix, offline PWA scanner and a public API.

A professional trading app running automated Smart-Money-Concept analysis (liquidity sweeps, MSS, order blocks, FVGs) on XAUUSD & BTCUSD, streaming no-repaint signals computed only on closed candles.

The ERP running laundry operations for an Islamic boarding school. Monthly bills are generated from daily weigh-ins, and anything past the 12 kg the school subsidy covers is split into a separate bill charged to parents. Expenses, cash book and a cash-basis profit & loss close the loop — every report exports to one multi-sheet Excel workbook.

A corporate landing page rebuilt from a Figma prototype by reading the file through the Figma REST API instead of eyeballing screenshots — so every value in the code is sourced rather than guessed. The type scale and six brand colours come straight from the node tree. Product photos are cropped by each fill's own imageTransform matrix, not object-cover, which is the difference between the product filling the frame and the shot showing an empty kitchen counter. The three marquees run at 10s linear because that is the Smart Animate duration the prototype actually declares — including the two vertical career columns, motion that is invisible in a static export and only shows up in the interaction data. The curved product strip is a ring mask struck from two radii of a giant circle. Desktop and mobile both match their own Figma frame, and 74 MB of raw assets ship as 1.4 MB of WebP.

A registration and payments microsite for a Jabodetabek kids-activity operator, built to mirror the exact intake sheet the team already runs over WhatsApp rather than inventing a generic form — child, guardian, referral source and an optional affiliate code, in that order, with a stated age that warns instead of blocking when a sign-up falls outside a class's bracket, because the operator's own history shows they do make exceptions. One submission registers several children under different guardians in a single payment. Bank-transfer confirmation reuses the operator's own message verbatim and hands off to a pre-filled WhatsApp link with the registration number attached, so the site and the chat never disagree. An affiliate programme mints collision-checked personal codes, but only after a human has approved the applicant — never at sign-up.

A grid tower defense built entirely from primitives — boxes, cones and cylinders, told apart by colour, silhouette and emissive glow rather than by any imported model. Six towers, each with three upgrade tiers and four targeting modes, hold a serpentine trench carved across a 16×16 board against eight enemy types that each demand a different answer: armour that blunts small hits and rewards heavy ones, splitters that break in two on death, healers that quietly undo your damage, and a 1,500-HP Colossus immune to every slow in the game. Two abilities on cooldown — a 120-damage airstrike and a board-wide deep freeze — are the counterplay when the boss walks. One central loop drives every entity, so fifty of them still hold 60fps.

A drivable version of this portfolio. Every project here stands as a lit panel in a 3D hall after closing time — nine flagship builds on an inner ring facing out, twenty-two experiments on an outer ring facing in, and a light-strip lane between them. Park in front of any panel and the camera pushes in to frame it while a sheet slides in with the write-up and all of its screenshots. Nothing is hand-copied: a sync script reads the project data straight out of this site’s own deployed bundle, and the panels texture their screenshots live from this domain, so the hall updates when the portfolio does.

A toy car on a sun-baked playmat at golden hour: collect twelve coins as fast as you can, then race your own best time. The car is a real raycast vehicle with per-wheel suspension — it rolls on landings, washes wide when you carry too much speed into a corner, and drifts when the handbrake cuts rear grip. Ramps lift you onto platforms holding two coins you cannot reach from the ground, brick walls and dominoes scatter on contact, and a light touch of air control lets you aim a jump. One HTML file with no build step — three.js and cannon.js load straight from a CDN.

A Valorant-style FPS arena in the browser — mouse-locked aim, two hitscan guns with heat-based spread and recoil, and three abilities: flashbang, dash and heal. Enemies are blocky humans whose head, torso, arms and legs are both the model and the hitbox, so headshots one-tap and limb shots bleed damage. Every round moves the fight to a different arena — sunset city, neon plaza, desert ruins, cold hangar — and every bot you drop leaves its weapon to loot when you run dry.

A playable 3D Rubik's cube — drag a sticker and the layer follows your finger before snapping to 90°: scramble, race the timer and chase your best across 2×2, 3×3 and 4×4 cubes. Pure integer-math move engine verified by 61 Node tests, synthesised ratchet sounds, confetti on the solve.

Full-body motion game — the webcam scans your whole body from across the room, calibrates your proportions, then randomises one of four movement games each round: swing to smash light-cores, jump and duck under beams, match the silhouette walls, and step across energy pads.

Hand-cast spellcasting game — your webcam hands are the controller: open palm charges mana, a fist snap hurls homing fireballs, swipes unleash ice novas and chain lightning, and joined palms detonate the ultimate over a floating temple under siege.

Hand-tracked 3D basketball — pinch the ball with your webcam hands, swing and release to shoot: ballistic aim assist, rim physics, a hoop that slides after every make and a 60-second challenge mode.

A quarter of a million GPU particles holding a shape until your hands reach into them — open palms shove the swarm aside, a pinch drags it into a swirling core, and two pinches stretch the whole field. Type anything and it reassembles into your words. No physics engine and no React: position and velocity live in float textures, so every particle is moved by a shader.

A hollow shell of 3000 glowing particles steered with bare hands — move to carry it, roll your wrist to spin it, spread both palms to swell it, hold up one to five fingers to shift its hue. Pinch and hold to charge a ring, then release: the shell throws itself across the screen and springs back together, a partial charge giving a proportionally weaker pulse. Every particle is its own damped spring on the CPU, and a One-Euro filter keeps the tracking still when your hand is still without lagging when it moves. One HTML file, no build step.

An infinite cinematic pilgrimage — scroll-flight over a procedural dune sea toward a ringed Black Sun: zero-g physics shards, a choir of monoliths whose glyphs ignite as you pass, and a dusk that drifts stranger every lap.

Webcam telekinesis — your hand becomes a golden energy hand in 3D: pinch to grab floating crystals, release to throw, swing an open palm to push them away.

Procedural abyss aquarium — every 32-bit seed births a new jellyfish species: bell shape, tentacles, pulse, bioluminescent glow and a generated Latin name.

A potter's wheel — drag the spinning clay to throw a vessel, fire it at 1300°C, then pick a glaze. Every pot is yours.

A clockwork solar system driven by real JPL orbital elements — scrub three centuries and the planets go where they actually were.

Interactive 3D mechanical keyboard you can type on with your own keyboard — procedural keycaps, synthesised switch sounds, six colorways.

Cinematic scroll-driven 3D dream world — floating islands, custom GLSL sky & aurora, generative Web Audio soundscape.

Interactive 3D digital twin of a future Depok neighborhood — scroll flight through 8 scenes with live time-of-day & weather.

Personal-brand 3D site — particle globe hero, interactive roadmap of competitions, organizations and digital projects.

Three.js fundamentals playground — primitives, materials, lighting and orbit controls.

Hand-tracked neon string play — raise both hands to the camera and pluck glowing strings with your fingertips.

Endless 3D runner — dodge obstacles at increasing speed, built with vanilla Three.js in one HTML file.

3D penalty-shootout game — aim, power and a goalkeeper that reads your shots.

A six-game touch-screen booth hub built for a packaging-industry exhibition — Spin the Wheel, a Packaging Decision Lab, Memory Match, a sliding Packaging Puzzle, a 10-second precision Stopwatch and a spot-the-difference "What's Missing?" — all running off one Laravel + Inertia + React backend with live visitor capture, a QR hand-off from booth to phone, and a leaderboard shared across every game.