← All case studies
Metropolitan Childcare Support Portal
UI 디자인HTML/CSS/JS퍼블리싱프론트엔드AI 협업 워크플로우
Evidence128 pages of user/admin manuals and ongoing improvements
Live ↗
Context
The official portal for a metropolitan-government childcare support agency — a public-sector site where residents find care services and education providers, and where the center's own staff publish content. A separate PM owned the backend; I owned the entire front-end.
Problem
The client's requirements were scattered across spreadsheets, HWP documents and slide decks, and some of them contradicted each other. Building straight from those documents guarantees a 'this isn't what we asked for' conversation at delivery.
Decisions
Nothing got finalised in the UI before it was reconciled with the source documents
Any task that needed checking against the client's original xlsx, pptx or hwpx files had to record the reconciliation in the changelog instead of proceeding on assumption. Locking something in on the front-end first is the most expensive thing to undo.
Two concept directions, each in desktop and mobile
Public-sector projects have several decision makers. One concept invites unlimited revisions; two concepts force a choice. Presenting the mobile layout alongside the desktop one prevented the structure from collapsing on small screens after approval.
Gave the AI agents a rulebook before giving them the codebase
To gain speed from AI assistance without losing quality, I put an explicit working-rules document (CLAUDE.md / AGENTS.md) at the project root covering naming, CSS variables, responsive breakpoints and prohibited patterns — including the rule that when the docs and the code disagree, the code wins and the docs get corrected.
Carry delivery through to ongoing operation
I produced 76-page user and 52-page admin manuals from 60 user screens and 48 admin screens, with regeneration tools. Follow-up work covered text-size controls, search and sharing metadata, editor formatting and Korean font fallbacks.
What I owned
- UI design (desktop + mobile)
- Markup
- The entire front-end
- Front-end working standards
- Project documentation
Actual deliverables
- Homepage concepts A and B — desktop and mobile
- Complete front-end implementation
- Front-end working-rules document (CLAUDE.md / AGENTS.md)
- 76-page user manual, 52-page admin manual and regeneration tools
Scope and verification
128 pages of user/admin manuals and ongoing improvements
The backend and the PM role weren't mine. I didn't get automated tests onto this front-end and QA was manual — I am adding test coverage on EXITO Seller, which is in progress now.
If you need this kind of work
Describe the thing you're currently stuck on. I'll reply by first separating what I can take on from what I can't.