28 PROJECTS

Other work

28 projects

The actual Fall in Korea merge board presented in a phone frame
LIVE / AI-ASSISTED GAME EXPERIMENT

Fall in Korea · 폴 인 코리아

A Korean travel merge game developed with AI-assisted code, image generation and iterative testing. Merge items, fulfill orders and explore a growing village in a playable phone frame.

CodexAI image generationJavaScript
Implementation and scope

Turn Korean craft and travel into a merge game, then iterate on AI-assisted implementation through real browser interactions and automated checks.

  • 14 merge chains and 84 items, 15 characters, four eras, 12 buildings and Korean/English controls.
  • Generate art with an image model, map sprite bounds, and refine crates, merge guides and two-axis map dragging from feedback.
  • 56/56 automated tests passed for merging, orders, rewards, save migration, offline caching and native write ordering, with raw results and reproducible test sources.

A web prototype in a phone frame; gameplay does not call a live AI model. The iOS project is prepared, but real-device testing, Xcode compilation and App Store release are not complete.

Actual Signal Lab interface showing 10 datasets, 12 prediction tasks and 4 comparison methods
LIVE / REAL DATA · OFFLINE EVALUATION

Signal Lab · CTR / CVR

Compare predictions of clicks, conversions, engagement and repeat purchases across 10 real public datasets, 12 tasks and 4 methods, with bilingual explanations of the process, expectations, results and scores.

Pythonscikit-learnJavaScript
Implementation and scope

Distinguish changes in model scores from live service improvements by comparing prediction methods on the same test records.

  • Separate training, method selection and final evaluation; compare a constant prior, logistic regression, boosted trees and probability calibration.
  • Compare predictive metrics, calibration and resampling intervals, distinguishing improvements, regressions and uncertain results.
  • Publish data sources, evaluation outputs, permitted sample predictions and reproduction code; label the synthetic sandbox separately.

Offline predictive evaluation on public data. Live click, purchase and revenue gains, and causal effects, remain untested. No real ROAS measurement with linked revenue and ad spend.

Actual MED-RAG Serving Lab interface: implemented modules, quality gates and request evidence
LIVE / EVIDENCE EXPLORER · CPU VERIFIED

MED-RAG Serving Lab

An MLOps lab for validating LLM changes and preparing release candidates. It exercises the real HTTP gateway under injected faults and blocks quality regressions and artifact tampering before packaging.

MLOpsPythonHTTP / SSE
Actual VisionEye comparison: synchronized source footage and translucent tracking results
AI · Model comparison

VisionEye

Tracks people and line crossings. Three new clips cover perspective, occlusion and reappearance, comparing four detectors and three tracker settings. Synchronized videos, 63 runs and a missed-crossing case are published.

PythonYOLORT-DETRv2
Sydney Opera House roof shells, facade and plaza details rendered from the delivered Blender model
LIVE / INTERACTIVE 3D

Venue Atlas

A 3D tour of Sydney Opera House, Seoul Arts Center and the National Gugak Center. Explore exteriors and interiors, open doors, walk through connected spaces, and control viewpoints, lighting and audience animation.

Three.jsBlenderPython
Implementation and scope

Photo-informed venue reconstructions become repeatable spaces for exploration and staging. Seats, props and doors remain individually editable in Blender; the web viewer merges and instances static geometry for display.

  • Explore 31 spaces across three venues with orbit, pan, zoom and walking modes, plus space isolation, saved viewpoints and lighting controls.
  • Connected 56 door leaves to hinged or sliding controls and checked seating support and door passages. Refined wood, stone and fabric materials alongside frames, handles and seat details.
  • Toggle audience visibility and play applause, cheering and walking animations. Supports existing character rigs and additional GLB imports.
  • Download native Blender scenes, animated characters and an offline web viewer as ZIP archives, with sources and licenses for CC0 materials and MIT character assets.

A visual reconstruction based on photographs and public references. Some dimensions and connections are inferred without surveyed drawings; it is not an exact digital twin of every facility.

Golden Drive gameplay screen showing the city at sunset and vehicle selection
BROWSER GAME / LOCAL DEMO

Golden Drive

A 3D browser racing game set in Manhattan- and Gwanghwamun-inspired cities at sunset. Choose from 15 vehicle configurations and six courses to race four AI rivals or enjoy free driving.

Three.jscannon-esJavaScript
Implementation and scope

I wanted a game people could open in a browser and immediately enjoy driving through a city at sunset. As vehicle and street detail increased, I refined the rendering workload, handling, and race adjudication together.

  • Game structure — two cities, six courses, 15 vehicle configurations, and free driving. City and vehicle selection connect to cameras, HUD, and personal records, with keyboard, touch, and gamepad controls.
  • Vehicle physics — cannon-es runs at a fixed 120Hz with a shared grip budget for acceleration, braking, and cornering, plus speed-sensitive steering. Vehicle-specific mass, power, and grip settings produce different handling.
  • AI and race rules — four rivals drive in the same physical world. Continuous-motion checkpoints, interpolated finish times, and a five-second recovery penalty determine results. Assisted or recovered runs do not set personal records.
  • Cities and rendering — waterfront and Gwanghwamun street scenes include pedestrians and dog walkers. Lighter vehicle models, instancing, distance-based detail, motion interpolation, and adaptive graphics manage rendering work.
  • Verification — version 1.4 passed 65 automated tests covering vehicle dynamics, race adjudication, AI completion, and rendering budgets. Browser checks covered race completion in both cities and mobile touch acceleration, braking, and pause.

This page publishes the project overview and actual screenshots; the playable demo is not public yet. The cities are game interpretations rather than surveyed or scanned reconstructions. Physics uses an arcade approximation and does not reproduce manufacturer performance. Frame rate varies by device and browser, with occasional delays remaining. Vehicles include third-party 3D models. The cover screenshot uses aarajesh’s Tesla Model 3 under CC BY 4.0, adapted with game placement and materials.

Three-quarter exterior view rendered in Blender from the actual B737-8 Explorer release model
LIVE / INTERACTIVE 3D

B737-8 3D Explorer

An interactive aircraft explorer spanning the airframe, cockpit, cabin and LEAP-1B engines. Select and separate parts, operate window shades, tray tables and wing controls, and adjust the lighting.

Three.jsBlenderPython
Implementation and scope

Starting from a supplied aircraft model, I corrected window-to-skin alignment and door/bin rigging, then extended the static geometry into a web experience for exploring internal structures and mechanisms.

  • Search, select, isolate and separate 31,665 parts. Export a selected part with its materials and relevant animation as GLB, or download the complete GLB and Blender files.
  • The cabin references Singapore Airlines' 737-8 layout of 10 business and 144 economy seats, alongside cockpit and LEAP-1B engine views. First class is presented as a separate design concept.
  • Implemented 88 curved sliding shades and seat-specific latch and tray sequences. Controls can target one window, seat or wing, or link matching assemblies; wing controls separately drive flaps with their leading-edge devices, spoilers and ailerons.
  • Adapted FlightGear meshes and CC0 materials feed a PBR renderer with HDR environment lighting and four lighting presets. Sources, licenses and reproducible build archives are available in the viewer.
  • Cross-checked part positions, materials and animation across the web viewer, GLB and Blender, then inspected browser interactions and native renders. Published assets and downloads were compared with the verified local release.

This is a visual reconstruction fitted to public specifications and the supplied model. Internal sections, linkage dimensions and motion paths without manufacturer CAD are illustrative; animation timing serves inspection. It is not a complete aircraft-parts or flight-procedure simulator.

Live Modely demo showing four behavior dials, a profile display and recipe saving
LIVE / PRODUCT UX DEMO

Modely · 모델리

A task-specific AI tuning design tool for policy-adherence failures, ticket misrouting, missing document fields and content-review errors. Connect data, target outputs and evaluation criteria, then share recipes and test plans.

Next.jsReactTypeScript
Implementation and scope

Changing tone alone is not a strong reason to fine-tune. The product starts with recurring business errors and distinguishes problems to address with prompting, retrieval or structured outputs from those worth evaluating with training.

  • Four workflows: policies and reviewed cases → condition checks and escalation; expert-labeled tickets → category, priority and team; source text and field definitions → JSON with null for unknowns; approved product facts → reviewed copy and revision reasons. Compare failure patterns with target-output examples.
  • A blue tactile UI and a task-rule dial make output behavior approachable. Each purpose connects the error, training target and baseline alternatives to checks such as Macro-F1, field exact match and exception escalation. Actual evaluation is distinct from configuration simulation.
  • Save the model, goal, questions and dial settings as recipes and restore them through share links. Handoff JSON includes input/output examples, business rationale and a held-out comparison plan explicitly marked not run. Existing recipes remain compatible.

The public build is a frontend product demo. Responses and dial indicators are rule-based examples; APIs, file analysis, training and customer deployment are not connected. Invented improvement figures were removed. Evaluation criteria are unexecuted plans, and provider training support and account access require separate verification.

Anatomy Atlas
LIVE

Anatomy Atlas

A 3D anatomy explorer with system separation, search, and original-model export.

React 19TypeScriptThree.js
MED-RAG
IN USE / REMOTE MAINTENANCE

MED-RAG

RAG used on the personal PC of a professor treating breast cancer at Anam Hospital. Installed in October 2025 with ongoing remote updates; public evaluation and tuning use separate synthetic data.

PythonLangChainGemma 3 27B (Ollama, 온프렘)
CODE / EXPERIMENT

Agent Orchestra

A LangGraph multi-agent reference with rewrite loops and offline structural verification.

PythonLangGraph (병렬 fan-out)LangSmith
Implementation and scope

The skeleton of a multi-agent system — orchestration, memory, evaluation — should be verifiable independently of model quality. A minimal-complete reference that generalizes the 'verifiable agent' principles learned shipping med-rag.

  • A supervisor fans out to researchers, then a critic can request a rewrite.

Offline mocks verify wiring, not model quality or improvement on every run.

Terracotta
PROTOTYPE / CODE

Terracotta

A personal AI workspace with model routing, tool approvals, usage records, and Docker self-hosting.

TypeScriptNext.js 16 + Cloudflare WorkersD1 + Drizzle (레지스트리·사용량 원장)
LIVE

Smart Docent — Location-Aware AI Guide

A real-time, location-aware AI tour guide for K-tourism: a LangGraph multi-agent docent that follows your position on a live Mapbox map and answers in four languages.

Next.js App RouterTypeScriptTailwind CSS
Implementation and scope

Tourists walk past centuries of Seoul's history with nothing but static signboards. We wanted a docent that knows where you are actually standing — following your position in real time and answering like a local expert, in your language.

  • My role — team lead of 4: product definition, architecture decisions, the place-data pipeline the agents ground on, and character design — the agent implementation is shared with teammates
  • Location pipeline — browser Geolocation streams live coordinates; Mapbox GL JS renders landmark markers with smooth camera moves (demo: Gyeongbokgung, Bukchon, Changdeokgung, Insadong, Cheonggyecheon)
  • Agent relay — a Next.js API route passes the selected place and question context to a LangGraph-based multi-agent docent, with a local fallback when the LLM endpoint is unavailable
  • Modular by design — place data, map style and LLM endpoint are independently swappable; API keys live only in server environment variables

The public demo ships Seoul sample data, and the docent answers from a local fallback when the LLM endpoint is not connected.

Meeting Assistant
INTERNAL / UI DEMO

Meeting Assistant

An internal meeting assistant currently running on RTX 4090. The public interface is a sample-data demo.

Python 백엔드faster-whisper large-v3 (CUDA)pyannote 3.1
Design Gallery
LIVE

Design Gallery

63 dependency-free demos reproducing well-known interface designs in code — one file each, live preview beside its source, bilingual down to the text inside every demo.

HTML/CSS/JS (무의존)Three.js WebGLHiggsfield AI 에셋
Implementation and scope

A design reference you can only look at in a screenshot is dead. I wanted a living one — open it, poke at it, copy it straight into your own project.

  • One demo = one file — inline CSS/JS and no build tooling, so any demo runs wherever you paste it
  • Gallery viewer — live preview and source shown side by side
  • Bilingual propagation — a `?lang=en` parameter switches the gallery chrome and the copy inside each demo
  • Asset pipeline — AI-generated imagery background-removed and size-optimized before it ships into a demo

With no build step there is no component reuse between demos, and curation cost grows with the collection.

PPT Studio — AI Deck Builder
LIVE

PPT Studio — AI Deck Builder

Upload a document and Claude turns it into a deck through Structured Outputs, then it exports genuinely editable PPTX — vector text and shapes, not image snapshots.

Next.js 16React 19TypeScript 5
Implementation and scope

Rebuilding slide design from scratch for every presentation is wasted work. Encode real brands' design systems as tokens, and one click restyles a whole deck.

  • Design-system engine — color, type and spacing tokens for 35 brands (Apple, Stripe, Linear and others), swappable across the deck
  • Drag-and-drop editor — a Zustand-backed canvas with undo/redo and autosave
  • AI conversion — upload a PDF or DOCX and Claude emits slide structure via Structured Outputs (JSON Schema); the deck is then revisable in natural language ("make this tighter")
  • Real export — pptxgenjs writes vector text and shapes as OOXML, so the result keeps editing in PowerPoint instead of arriving as flat images

The static demo has no API key, so AI generation is disabled there (editing, theming and export all work). Complex PPTX imports lose some fidelity.

이불 안 마음친구
PRE-RELEASE

이불 안 마음친구

An emotional-support app for iOS, Android, and web. Independently planned, designed, and developed, with a working browser emulator.

HTML/CSS/JS (바닐라)PWACapacitor (iOS/Android)
Implementation and scope

My first end-to-end app began with a simple idea: a companion that listens without judgment on difficult nights.

  • Three platforms from one web frontend: a PWA plus Capacitor wrappers for iOS and Android.
  • A runtime apiBaseUrl setting switches between the standalone demo and a server connection. The core interaction loop runs locally.
  • A warm visual interface with individually selected typefaces and illustrations.

Not yet released to app stores. Server-dependent features, including AI conversations, are limited in the demo.

후방위 (HEARTBREAKER)
PRE-RELEASE

후방위 (HEARTBREAKER)

A post-breakup support app with a calming timer, a 90-day recovery journey, and simulated AI conversations. Available as a working browser emulator.

Next.js (React 19)Tailwind CSS 4OpenAI API (서버)
Implementation and scope

Impulsive contact after a breakup can lead to regret. I built a tool that helps users pause at that moment.

  • A pause-before-contact loop: a 90-second calming timer, interventions for late-night or intoxicated messaging, and unsent letters.
  • Three AI conversation modes for saying goodbye, venting, and considering reconciliation, implemented through a separate server API.
  • Offline-first interactions: a single React client and localStorage keep most features usable without a server, as demonstrated in the portfolio emulator.
  • A 90-day recovery journey organizes reflection through staged activities and progress tracking.

Not yet released. Contact protection is an in-app intervention, not an operating-system block. AI responses in the emulator are demo responses.

워크메이트 (WALK-MATE)
LIVE

워크메이트 (WALK-MATE)

Themed walking routes in Seoul, with a character preview that follows pedestrian paths on a 3D map.

Expo SDK 55React Native 0.83MapLibre GL JS 5
Implementation and scope

A walk involves personal preferences as well as directions. Users choose a theme and time, receive a suggested route, and preview the walk before setting out.

  • A 3D route preview on a tilted MapLibre GL map: the camera follows a character along pedestrian-path coordinates at 12x to 48x speed.
  • Preference onboarding combines eight themes with time-of-day choices to suggest routes, with preferences saved on the device.
  • Each route has four or five checkpoints, arrival notifications, points, and a completion dialog.
  • A storybook visual concept, 'a walk on paper,' using eight Higgsfield illustrations.

Currently limited to eight routes in Seoul. Live GPS tracking during a walk is not implemented.

TableON
UI DEMO

TableON

A restaurant-management demo connecting orders, reservations, CRM, and AI analytics.

HTML/CSS/JSSVG 차트Claude API
Implementation and scope

Restaurant owners juggle separate tools for orders, reservations, customers and payroll. TableON puts them in one subscription with an AI business analyst on top.

  • In-browser simulator — the demo runs every feature on generated data, no backend required
  • RFM CRM — automatic segments (VIP, at-risk regulars, sleeping customers) and 'customers to call back' detection from visit cadence
  • Per-store AI — an onboarding interview plus an automatic data summary compile into a store-specific system prompt, so Claude answers from this store's reality, not generalities
  • Ops automation — birthday coupons and SMS, payroll settlement from clock-in records, 3-tier role permissions

The demo resets on refresh; real payments/SMS need integration keys.

하루 한 장 (DAILY BOOK)
LIVE

하루 한 장 (DAILY BOOK)

A web app that gathers diary entries into a book, with Google sign-in and guest access.

ReactViteFirebase Auth
Implementation and scope

I wanted scattered daily records to become a coherent collection, with the tangible feeling of a book.

  • An entry-to-book interface assembles accumulated diary entries into a book-shaped view.
  • A Firebase stack combining Google and guest authentication, Firestore storage, and Hosting.

PDF or physical-print export, search, and tags are not yet implemented.

Factory Studio
PRIVATE / LOCAL TOOL

Factory Studio

A local production tool connecting scripts, work orders, generation, and assembly.

Python (표준 라이브러리 위주)ffmpegHiggsfield API
Implementation and scope

Every short drama, explainer or ad meant writing prompts from scratch again. Encode the structure once as a work order, and the medium and template become parameters instead of a rewrite.

  • Work-order compiler — a spec JSON becomes per-shot-group prompt text; standard library only, so it imports and runs standalone
  • Script generation — a one-line premise expands into a four-act arc with a recurring prop, and the dialogue budget is fitted to the shot length automatically
  • Parallel waves with a retry ladder — shots generate in waves; a rejected shot is resubmitted, then softened, before it is allowed to fail
  • Idempotent resume — the manifest records each job_id before polling, so an interrupted run continues instead of paying twice
  • Assembly and receipt — concat, arithmetic SRT, and an assembly.json carrying measured per-group durations and the full retry history

Generation needs an authenticated external API with credits, so this one is not publicly deployed. It runs locally against a queue runner.

Seoul Property Analysis System
LIVE

Seoul Property Analysis System

Transaction prices on a live map, neighbourhood search by local nickname, and a financing engine that turns cash + salary into an LTV/DSR loan ceiling, acquisition tax and the cash you actually need — plus redevelopment news signals and regulation monitoring.

FastAPILeaflet 지도 SPA국토부 실거래가 API
Implementation and scope

Looking for a flat meant checking transaction prices, neighbourhood reputation, loan limits, tax and regulation on five different sites. This puts them on one map and answers the question that actually matters: can I buy here with what I have?

  • Listing pipeline — apartments, row houses and detached houses come from three separate government APIs; officetels and urban-living housing are excluded by rule and reported as a filtered count
  • Neighbourhood search — resolves a query through local nicknames, then legal dong names, then OSM geocoding snapped to the nearest legal dong
  • Financing engine — cash, household salary, first-time-buyer and childbirth status produce an LTV/DSR/absolute-cap loan estimate, then acquisition-tax relief and broker fees give the real cash requirement
  • Transit proximity — haversine distance to the nearest station converted at 67 m per walking minute, flagged within 800 m
  • News signals — Google News RSS crawled and weighted by positive/negative keywords, with regulation news monitored separately for change

The transaction API returns no coordinates, so map markers are approximate per complex. News signals are a keyword-based reference, not investment advice, and regulation data is point-in-time. On serverless the geocoding cache lives only in instance memory.

Daily Study Briefing
LIVE

Daily Study Briefing

A learning portal that rewrites itself every morning — three concepts, AI news and papers — then holds on to them with quizzes, mind maps and a review queue built from the questions you got wrong. No backend, no external API.

순수 정적 HTML/JS/JSONGitHub PagesClaude CLI 배치
Implementation and scope

Deciding what to study was eating the time meant for studying. I wanted something that picks the day's material for me and then makes sure I do not lose it a week later.

  • Unattended refresh — a scheduled Claude CLI run on my own machine writes the day's JSON, pushes, and GitHub Pages redeploys itself
  • Learning loop — deep dive, SVG mind map, then a four-question quiz with explanations; missed questions are collected into a review mode that drops them once answered correctly
  • Adherence mechanics — study streak, running accuracy and a GitHub-style 20-week contribution grid, all in localStorage
  • Portal UX — full-archive search, a study calendar, a starred library, keyword ranking, and hash routing so any concept is a deep link

Progress lives only in browser localStorage, so it does not follow you across devices, and the refresh depends on my machine being awake.

Universe — 3D Solar System
LIVE

Universe — 3D Solar System

Pick any date between year 1 and 9999 and the planets move to where they actually were, computed from J2000 elements. Then fly it from a cockpit, or watch 13.8 billion years replay as a cinema.

Three.js r128GLSL 셰이더바닐라 JS 단일 모듈
Implementation and scope

Astronomy simulators tend to be either accurate and inert, or beautiful and empty. I wanted real orbital computation you are allowed to fly through.

  • J2000 epoch math — mean longitude plus measured orbital periods gives the configuration for an arbitrary date (circular-orbit approximation)
  • Measured physics — rotation periods and axial tilts are real values; Venus, Uranus and Pluto spin retrograde under the IAU convention
  • Moon frame correction — 1/T_rel = 1/T_moon − 1/T_planet, so satellites orbit at their true period in the parent's frame
  • Cockpit flight — thrust, roll, auto-navigation with obstacle avoidance, radar, a WebAudio engine, and collision handling that tells you what you hit
  • Genesis cinema — nine stages from a Big Bang whiteout to today, with 4,500 particles and three cross-faded Earth textures

Sizes and distances are exaggerated for legibility (at true scale the screen is empty), and the circular-orbit approximation drifts a few degrees from a real ephemeris.

천기연 天機緣
LIVE

천기연 天機緣

Character-led AI saju readings with traditional calendar calculations, true-solar-time correction, fortune cycles, and symbolic influences, tailored to the user's questions.

HTML/CSS/JS (바닐라)자체 만세력·사주 엔진Claude API
Implementation and scope

I wanted to move beyond generic birth-date readings by incorporating seasonal solar terms, birth time, and birthplace into the traditional saju calculations.

  • The calculation engine derives year and month pillars from solar terms and the day pillar from the 60-part cycle, using lunar.js and saju.js.
  • True-solar-time correction adjusts birth time using birthplace longitude, allowing different calculations for people born on the same date.
  • Calculated results and the user's questions are sent to Claude through Vercel serverless functions for a tailored interpretation.
  • An immersive mobile interface guided by the character Yeonhwa.

The demo has no real payments, and reviews are samples. A live-service mode requires payment integration.

CODE / EXPERIMENT

HiggsMCP

A content automation experiment connecting generation and publishing modules.

PythonFastAPIDocker
Implementation and scope

Some scheduler publishing calls are not connected. Fully unattended operation is not established.

Contact

hyunaeee@gmail.com ↗

South Korea · Korean / English

Portfolio PDF

A casebook with roles, engineering decisions, evidence, and source links.

Choose “Save as PDF” in the print dialog.