Claude/improve ifc viewer ux wh ts b - #480
Merged
Merged
Conversation
The four ViewCube adjacent-face buttons were emitting HTML numeric entities (‹, ›, ⌃, ⌄) inside an htm tagged template. htm treats template content as plain text — entities are not decoded — so iOS Safari was painting the literal "‹" string into the button instead of a chevron. Replaced with the actual Unicode characters (‹ › ⌃ ⌄) so they render identically across browsers without depending on entity decoding. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
Introduces the redesign rationale, primary personas (presenting architect, client, BIM coordinator), and a cross-tool reference audit covering xeokit, APS Viewer, BIMcollab, Trimble Connect, bldrs.ai, Figma, Linear, Procreate, Notion, and iOS Camera. Extracts 5 key design lessons. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
5-zone shell diagram with detailed specs for top bar, left tab strip, canvas zones, right drawer, and bottom mode toolbar. Cross-references Gestalt proximity, progressive disclosure, Nielsen heuristics 3 & 7. Adds Yara (SketchUp+InDesign architect) as quaternary persona. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
Reframes each mode as a drafting instrument: Orbit=scale model walk, Walk=through-building, Slice=knife, Measure=tape, Plan=top-down plan, Note=red pen. Renames sub-tools to architectural language, replaces X/Y/Z with Horizontal/Front/Side, renames render styles (Lines/Shaded/Rendered/ Skeleton). Includes anti-AI-design check on icon and label specificity. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
CSS token updates: violet accent (#7c3aed), rounder radii (14px md, 20px lg), glass surface tokens, warm parchment light theme. Motion rules: animate only state transitions that communicate information. Icon specificity rules. Non-AI language guide with avoid/use table and empty-state copy rewrites. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
Full 40-entry feature remapping table with current location → new location and old label → new label. Four naming rules: verbs for actions/nouns for places, plain English, no generic labels, consistent modal button tense. Terminology reference card covering model content, navigation, sharing, and technical terms (Details drawer only). https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Replaces welcome popup with canvas-first first-run card: drop zone, sample model, URL open, shared folder link. No clash-detection settings on load. Loading progress labels + cancel affordance. One-line guidance bar on first model load (fades after 8s). Empty states for no-geometry and oversized model. Shared URL entry point for client persona. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
8-PR migration plan: PR-1 CSS tokens → PR-2 mode toolbar → PR-3 header slim → PR-4 left rail→tabs → PR-5 right drawer → PR-6 naming pass → PR-7 first-run card → PR-8 mutex+cleanup. Feature flag strategy for safe rollout. End-to-end verification flows for all 4 personas (Sarah, Yara, Marcus, Lukas). https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
- --accent #2563eb → #7c3aed (violet-700), full accent family updated - --radius-sm 6→8px, --radius-md 8→14px, --radius-lg 12→20px - Added --glass-bg/border/blur tokens for floating panels over canvas - Light theme: warm parchment bg (#faf8f5), warm scene-bg (#e8e4de) - Range slider thumb uses var(--accent) instead of hard-coded blue - Mobile nav active and NL border pulse updated to violet https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
New ModeToolbar component (fixed, bottom-center) with Orbit/Walk/Slice/ Measure/Plan/Note chips. Active chip gets violet fill. Mode mutex: switching chips exits all other modes first. Sub-tool rows: Walk shows FOV presets + no-clip, Slice shows Horizontal/Front/Side/Box/Remove cut, Measure shows Clear all (when measurements exist), Plan shows floor chips. Gated behind localStorage.cc_new_toolbar === '1' until header slim (PR-3) removes the old buttons. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
…toggle New DesktopTopBar component (visible ≥769px, hidden mobile/presenting): - 44px glass bar at top of canvas column - Logo mark + ClashControl wordmark (Syne 700) - Share pill button (violet accent, sync status dot, unread badge) - Theme toggle + Settings icon (ghost, right-aligned) - Glass surface: var(--glass-bg) + backdrop-filter + subtle border Original cc-header stays as mobile-only top bar. Desktop nav remains in the left rail. This adds the header without disrupting existing layout. https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
Left rail: active tab now uses var(--accent-dim) background and var(--accent-light) color instead of blue. Icon btn hover uses var(--accent-dim). Project picker uses accent tokens. Grid: opacity 0.3 (dark) / 0.35 (light) — subtle drafting-table feel, not in-your-face BIM grid. Blue → violet sweep: - All rgba(37,99,235,...) → rgba(124,58,237,...) throughout UI - #93c5fd → var(--accent-subtle) (blue-light text → violet-light) - #1e3a5f → var(--accent-bg) (dark-blue fills → violet fills) - Remaining #3b82f6 UI accents → var(--accent) / var(--accent-light) - Kept: structural discipline color #3b82f6 (BIM convention, blue is structural) - Kept: --color-info semantic tokens (blue = informational) - Kept: CLASS_COLORS data-vis rainbow palette https://claude.ai/code/session_01E4nksxdHWq1JpNe1sjj4RG
…rawer + model load card - Overlay panels: LeftRail + LeftPanel now position:absolute over canvas (Figma-style) The canvas is always full-bleed; panels slide in on top - DesktopTopBar gets padding-left:48px to clear the rail logo area - Right drawer (AIChatPanel): tab bar with Details + Ask AI tabs Details tab polls window._ccSelectedEl (250ms), auto-opens on element click Shows type, name, floor, quick pset list, linked issues, + New issue action - Model load card: replaces old setup-first WelcomePopup with a clean drop zone Shown only when no model is loaded; disappears when first model loads Drag-drop IFC/GLB, click to browse, open from URL, link shared folder window._ccLoadFiles exposed for external file injection - Naming pass: Clashes→Conflicts, Addons→Integrations, Viewpoints→Saved views, By Storey→By Floor in all UI labels (action type constants unchanged) - Mode mutex: switching modes now auto-exits conflicting modes in the reducer (walk exits sections, slice exits walk, measure exits walk/section, etc.) - Slice sub-tools: position slider shown when a plane is active (no more hunting for the slider buried in the left panel); labels stay Horizontal/Front/Side - ModeToolbar feature flag removed — toolbar always on when a model is loaded
…js/tainted-format-string)
…ainted-format-string)
…ear-text-storage-of-sensitive-data)
…/functionality-from-untrusted-source #7)
…ar-text-storage-of-sensitive-data)
…ady enabled on repo
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.