[WV2] Revise migration plan details

I wasn't sweating the later phases that Claude generated even when I didn't 100% agree with them, but now I'm revising, esp now that I have more insight into what we're building.
This commit is contained in:
Emi Matchu 2026-02-15 19:14:20 -08:00
parent def8a3e694
commit d4e2f1c1d8

View file

@ -41,63 +41,33 @@ Code lives in `app/controllers/wardrobe_controller.rb`, `app/views/wardrobe/`, `
## Roadmap ## Roadmap
### Phase 1: Core Functionality (MVP) ### Phase 1: Core Functionality (MVP)
The goal is a basic usable wardrobe. Species/color/pose selection, item search, and add/remove are already done. All core features are implemented:
- **Species/color/pose selection** with visual pose picker, canonical fallback
- **Alt styles** with tabbed Expressions/Styles picker, compatibility filtering
- **Item search** with auto-filtering by pet/style compatibility, pagination
- **Closeted items** (worn vs. closeted vs. absent states, zone-based mutual exclusivity)
- **Outfit saving/loading** (save, save copy, rename, unsaved changes warning)
- **Progressive enhancement** throughout (works without JS, web components add interactivity)
**Outfit Saving/Loading** (basic implementation done) ### Phase 2: Detail-Oriented Experience
- Save button near editable outfit name, disabled/"Saved!" when state matches saved
- Route to load saved outfits (`GET /outfits/:id/v2`) with redirect-based state initialization
- "Save a copy" for non-owners, login prompt for unauthenticated users
- `beforeunload` warning for unsaved changes via MutationObserver
- Outfit name: For saved outfits, rename is a standalone PATCH operation (not a URL param). For unsaved outfits, name is tracked as a URL param. Progressive enhancement shows static text + pencil icon for renaming.
**Alt Styles Support** (done) Additional information, additional search capabilities.
- `Outfit#visible_layers` handles alt styles
- Picker UI with tabbed Expressions/Styles panels, `style` URL param, visual thumbnails, "Default" option
- Stale style params dropped gracefully when switching species
- Search results auto-filtered by alt style compatibility
**Closeted Items** (done) - **Item UX**: Item info links, zone badges, incompatibility tooltips
- Instead of just wearing/unwearing items, also support a "closeted" state: the user is *considering* this item, - **User features**: Closet/ownership/wishlist badges, filter search by owned/wanted
but it is not displayed on the pet itself right now. - **Search filters**: Can use the standard search syntax (`is:nc`, `occupies:background`, etc.)
- Wearing an item will stop wearing, but keep in closet, items that are mutually incompatible with it. - **Improved pagination**: Prev/next buttons, then a dropdown between them to choose an exact page
- Baseline behavior: separate toggle buttons for worn state and closeted state.
- Unworn items have "Add" (wear).
- Worn items have "Hide" (stop wearing, keep in closet) and "Remove" (remove from worn and closet).
- Closeted items have "Show" (wear) and "Remove" (remove from closet).
- Visual distinction: worn items have green emphasis, closeted items have dashed border and reduced opacity.
- Closeted items appear in zone groups alongside worn items.
- `closet[]` URL params, saving/loading, and search pagination all work.
- Progressive enhancement (done):
- Each item card is an `<item-card>` custom element with a visually-hidden input inside a `<label>`.
- In the outfit view, items use radio inputs (mutual exclusivity within zone via `name` attribute). Arrow keys
navigate between items via native radio behavior.
- In the search view, items use checkbox inputs (independent toggle).
- In both views, the `<item-card>` web component delegates clicks to the baseline forms: clicking a closeted or
absent item submits its Show/Add form (wears it), clicking a worn item submits its Hide form (un-wears it).
- When the item is closeted or worn, there is a "Remove" button.
- The radio button and checkbox are visually hidden, and are reflected in the item card worn/closeted styles instead.
### Phase 2: Polish & Parity
Match the quality and usability of Wardrobe 2020 where it matters.
- **Item UX**: Wear/unwear toggle, item info links, zone badges, removal animations, incompatibility tooltips
- **Preview controls**: Download as PNG, copy link, settings (hi-res mode, archive toggle), HTML5 conversion badge
- **Loading & errors**: Spinners, skeleton screens, smooth transitions, error recovery
- **Mobile**: Touch-friendly targets, fix hover-dependent interactions, always-visible controls on touch
- **Accessibility**: ARIA labels, keyboard navigation, semantic headings, skip links, color contrast
### Phase 3: Advanced Features ### Phase 3: Advanced Features
Feature parity with Wardrobe 2020 where valuable. Feature parity with Wardrobe 2020 where valuable.
- **User features**: Auth integration, closet/ownership/wishlist badges, filter search by owned/wanted - **Preview controls**: Download as PNG, copy link, settings (hi-res mode, archive toggle), HTML5 conversion badge
- **Conflict management**: Auto zone conflict resolution, smart item restoration on unwear - **Streamlined try-on**: If you try on a background from search, then change your mind, restore the previous background
- **Pet loading**: "Load my pet" by name, modeling integration
- **Search enhancements**: Inline syntax (`is:nc`, `fits:blue-acara`), advanced filter UI, autocomplete
- **Outfit auto-saving**: Save outfit changes automatically over time, rather than requiring clicking Save - **Outfit auto-saving**: Save outfit changes automatically over time, rather than requiring clicking Save
- **Advanced search UI**: Consider using Wardrobe 2020's autocomplete-based UI, or an advanced search form, or something else
### Phase 4: Migration & Rollout ### Phase 4: Migration & Rollout
@ -115,7 +85,6 @@ Feature parity with Wardrobe 2020 where valuable.
## Open Questions ## Open Questions
- Is the URL-as-state approach sustainable as complexity grows (saving, closet, conflicts)?
- Which Wardrobe 2020 features are actually essential vs. nice-to-have? (Need user feedback) - Which Wardrobe 2020 features are actually essential vs. nice-to-have? (Need user feedback)
- How to handle the transition period (maintain both? redirect? feature flag?) - How to handle the transition period (maintain both? redirect? feature flag?)