HTML, CSS and JavaScript
Responsive wardrobe states, illustrated-to-product crossfades, local look saving, semantic controls and the independent-concept disclosure.
All work
Interactive wardrobe, spatial motion & private client delivery
Wardrobe & Spatial Motion
Turn a brand world into something people can try—and a spatial proposal into motion.
Independent concept built around the SEPT brand world (not affiliated)
Project status
Independent public wardrobe concept · two selected excerpts from a private six-film delivery · 2026
Project boundary. This is an independent concept — not a claim of commissioned, built, tested, or approved work beyond what this page documents. Not affiliated with SEPT Studios; the wardrobe is non-commercial and the full client film delivery stays private.
My contribution
Wardrobe concept: concept direction, wardrobe interaction, interface design and front-end building.
Spatial motion delivery: spatial research, storyboarding, image and motion iteration, editing, and a private no-index review handoff of sound and silent versions of all six films.
01 / Design decisions
Translate a brand language into an interaction.
The public wardrobe study interprets SEPT’s soft, restorative visual language as a dress-up interaction. It is clearly disclosed as an independent, non-commercial concept—not an official SEPT Studios website or working store.
02 / Design decisions
Make the choice visible before asking for commitment.
Visitors can pair tops and bottoms, move between illustrated and real-product views, save four looks on their own device and reset without losing the original character. The interface makes comparison the central action while checkout remains disabled.
03 / Design decisions
Move from source rooms to directed spatial motion.
The spatial-motion track began with supplied room imagery, measured layouts and SketchUp studies. Human-directed image and video iterations were edited into six short room films covering the entrance, massage room and reformer space.
04 / Design decisions
Keep client review separate from public evidence.
The complete six-film handoff remains behind its private, no-index review route. Only two silent excerpts are shown in this public case study, preserving the boundary between a portfolio explanation and the client’s full delivery environment.
What came out of it
The outcome.
A responsive wardrobe interaction visitors can try publicly, plus a private six-film spatial handoff. Together they show two ways of extending one brand world: a usable interface and directed architectural motion.
What I would develop next
Usability-test the wardrobe on more phones; instrument where visitors drop off.
Explore all 3 curated project assets
Additional views and the assets discussed above. Open images for their full composition; videos use native playback controls.
Tools with a purpose.
SketchUp and After Effects
Measured room studies, camera pacing, compositing, titles and the editable final-film assembly.
Where AI enters the process.
AI-assisted image direction
Supported selected sketch-to-render transitions from supplied spatial references. Alejandro directed, compared and revised the visual stages before editing.
Documented in the project production archiveSelective AI motion generation
Supported chosen transitions and camera studies; the final pacing, sequence selection, compositing and delivery were human-directed.
Documented in generation requests, verification notes and editable assemblies