Skip to content
English
Submit a request
  • There are no suggestions because the search field is empty.

Personalization Viewer — Streamlined UI

Consolidated controls, required-field guidance, hover state linking, and inline canvas editing for faster personalization at sales speed

1. Purpose & Scope

This article documents the Personalization Viewer UX improvements shipped in Tiled v53.0.0. The September release delivered a substantial streamlining of the viewer personalization experience, addressing guidance gaps that were slowing sellers and creating friction in creator-to-seller handoffs.

Scope: All Tiled viewers accessing microapps with personalization fields enabled. Creators and sellers who share personalized microapps. Library Administrators configuring required personalization fields.

2. Control Objective

The control objective is to ensure that viewers can complete personalization flows accurately and efficiently, with clear guidance on required vs. optional fields, clear visual connection between the personalization panel and the canvas, and a friction-free inline editing path for sellers who prefer to edit content directly on the canvas.

3. Feature Components

Consolidated Microapp Menu Controls

Personalization controls in the viewer are now surfaced within the consolidated microapp menu, replacing prior scattered UI patterns with a single predictable location for all personalization actions.

Required Field Indicators

Required personalization fields are now clearly marked with red bounding boxes that highlight the fields awaiting input. Viewers can scan the canvas and immediately identify which fields must be completed.

Progress Tracking

A progress indicator tracks how many personalization fields have been completed vs. remain. Viewers can see at a glance how close they are to completing the flow without manually counting fields.

Hover State Linking (Panel to Canvas)

Hovering over a personalization field in the panel highlights the corresponding tile on the canvas, and vice versa. This bidirectional hover link eliminates confusion about which field maps to which content area.

Inline Editing Mode

A new Inline Editing mode allows viewers to hide the personalization panel and edit fields directly on the canvas. Includes a dedicated page navigation bar for multi-page microapps. Designed for sellers who prefer a cleaner editing surface.

4. User Flows

4.1 Standard Personalization Flow

1. Viewer opens a shared personalized microapp link.

2. The consolidated microapp menu surfaces all personalization actions.

3. Required fields are highlighted with red bounding boxes on the canvas.

4. Progress indicator shows completion state (e.g., 3 of 5 fields completed).

5. Viewer hovers over a panel field — the canvas tile highlights. Hover over a canvas tile — the panel field highlights.

6. Viewer completes all required fields and shares the personalized microapp.

4.2 Inline Editing Mode

7. Viewer activates Inline Editing mode from the consolidated microapp menu.

8. The personalization panel hides. Viewer edits fields directly on the canvas.

9. Multi-page microapps provide a dedicated page navigation bar in inline mode.

10. Viewer exits inline mode to return to the standard panel view before sharing.

5. QA Validation

QA Scope: Viewer Personalization was a primary QA focus for September 2025. Coverage: required vs all fields, hover states (panel to canvas), inline editing flow, progress tracking. References: Product September 2025 page; 2025-09-30 standup; 2025-08-28 standup.

 

Required fields — red bounding boxes

Verified: required fields highlighted; optional fields not highlighted.

Progress tracking

Verified: counter updates correctly as fields are completed.

Hover state linking

Verified: panel ↔ canvas hover highlights are bidirectional and accurate.

Inline editing mode

Verified: panel hides; canvas editing works; page nav bar present for multi-page.

Consolidated menu

Verified: all personalization actions accessible from the microapp menu.

6. Change History

v1.0 — September 2025

Initial article. Feature shipped in Tiled v53.0.0 (PD-September-2025).