From 9d0e2cab00e4e012f8096f9590cb4d2116616771 Mon Sep 17 00:00:00 2001 From: Matysh Date: Wed, 22 Jul 2026 10:02:55 +0300 Subject: [PATCH] =?UTF-8?q?docs:=20approved=20UX-modes=20design=20(View/Pl?= =?UTF-8?q?an/Devices=20tabs)=20=E2=80=94=20docs/UX-MODES.md=20+=20ROADMAP?= =?UTF-8?q?=20phase=2011?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Research only, no product changes. Confirms and structures the owner's mandate (view mode must be display-only) and issue #3 feedback; lists deprecations and approved follow-up features with implementation iterations. --- docs/ROADMAP.md | 7 +++++ docs/UX-MODES.md | 76 ++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 83 insertions(+) create mode 100644 docs/UX-MODES.md diff --git a/docs/ROADMAP.md b/docs/ROADMAP.md index 32b3805..6608b97 100644 --- a/docs/ROADMAP.md +++ b/docs/ROADMAP.md @@ -74,6 +74,13 @@ Track progress in `custom_components/houseplan/quality_scale.yaml` (done/exempt - [ ] GitHub: issue templates, discussions on, CONTRIBUTING.md (build/test in 5 minutes). - [ ] Semantic versioning discipline; keep release notes user-facing (they show in HACS). +## Phase 11 — UX modes redesign (approved, see docs/UX-MODES.md) + +Three-tab interaction model (View / Plan / Devices): view mode is display-only — +no dragging or editing; all editing splits between a Plan tab and a Devices tab. +Deprecates "drag anywhere" and view-mode opening drag. Follow-ups from issue #3: +state-reflecting icons, value display, RGB light colors, alarm visuals, sub-area rooms. + ## Explicit non-goals (for now) - 3D plans (.glb) — separate market (3Dash), heavy dependencies. diff --git a/docs/UX-MODES.md b/docs/UX-MODES.md new file mode 100644 index 0000000..66e7ee6 --- /dev/null +++ b/docs/UX-MODES.md @@ -0,0 +1,76 @@ +# UX redesign: three modes (approved 2026-07-21) + +> Approved design for reorganizing all card interactions into three tab-like modes. +> Driven by the owner's mandate and confirmed by real user feedback +> ([issue #3](https://github.com/Matysh/houseplan-card/issues/3): *"When moving the +> map around, I sometimes move the doors/sensors around"*). This document is the +> source of truth for the implementation iterations below. No code has been changed yet. + +## Principle + +A segmented control in the card header with three tabs; the active one is visually +highlighted, and edit modes add a colored frame around the stage so the mode is +obvious at a glance: + +**[ 👁 View ] [ 📐 Plan ] [ 🔧 Devices ]** + +- **View** is the default and the only mode after every load (edit modes are never + restored across reloads). +- **Plan** and **Devices** are shown only to admins when `admin_only` is on. + +## View — display and device interaction only + +Allowed: pan/zoom (wheel, pinch, buttons), switching spaces, device tap +(info / more-info / toggle per settings), long-press → info card, opening tap → +door/lock info card, room tap → HA area, hover tooltips (name, temperature, signal). + +Removed from this mode (they move, not die): +- icon dragging ("drag anywhere", v1.9 — consciously reversed), +- room-label dragging, +- opening dragging along walls and double-click properties (v1.23.1), +- every edit button in the header (+device, 👁 show-all, ↺ reset, ⬡ rules, ⚙ general, + per-space gear, markup toggle). + +Header in View: space tabs, device count, zoom cluster. Nothing else. + +## Plan — geometry and appearance of the space + +- Toolbar tools: Outline room, Delete room, Merge, Split, Opening (place / drag along + walls / properties), Room labels (drag positions — labels are part of the plan). +- Space gear dialog (title, plan image / hand-drawn, scale, Display section, show_lqi), + add space, floors import, delete space. +- ⚙ General settings (fill palette) lives here — it is about the plan's appearance. + +## Devices — placement and marker configuration + +- Icon dragging (ONLY here). Click on a device opens the **edit dialog directly** + (binding, name, icon, size/angle, display badge/ripple + colors, tap override, + model/link/description/PDFs, room). +- + add device/entity/virtual, hide device, ↺ reset layout, 👁 show-all (curation + tool), ⬡ icon rules. + +## Deprecations decided + +1. "Drag anywhere" (v1.9) — reversed by this design. +2. Opening drag / dbl-click properties in view (v1.23.1) — moved into Plan. +3. The markup toggle button — replaced by the Plan tab. +4. Legacy localStorage mode (card without the integration) — candidate for removal + in the next major; adds branching for a half-working scenario. + +## Approved follow-up features (from issue #3, by priority) + +1. State-reflecting icons (open/closed door variants etc., like core HA). +2. `display: value` — show the measurement instead of an icon. +3. Light color in the icon/ripple (RGB lights). +4. Alarm visual (leak/smoke/doorbell): red pulse overlay. +5. Rooms as sub-areas without an HA area + manual device placement by room id. +6. Backlog (not planned): music notes for players, directional TV ripples. + +## Implementation iterations + +- **It.1 — mode shell:** the segmented control, mode state, View-mode gating of all + edit interactions/buttons (biggest UX win, smallest surface). +- **It.2 — Plan tab:** move markup tools + space dialogs + labels drag + openings + editing under Plan; colored frame indicator. +- **It.3 — Devices tab:** drag + direct-edit click + curation tools under Devices. +- **It.4+:** follow-up features 1–5 above, each its own release.