AR interfaces and extended layers

1) What are AR and "expanded layers"

Augmented Reality (AR) - real-time superimposition of digital content on the real world.
Extended layers (AR-layers) - logical levels on top of the camera/scene: annotations, navigation, 3D objects, hints, analytics, system statuses. They control what to show, where in space, how to interact and when to hide.

The key goal of AR-UX is to add meaning to the environment, not "replace" reality. Each layer must answer a user question: "What is this? Where is this? What next"

2) Where to use AR

Navigation and orientation: direction indicators, arrows on the ground, illumination of inputs.
Context training/hints: "superimposed" instructions, step-by-step editing/customization.
Display cases and fittings: visualization of objects in the size of 1:1 (furniture, devices).
Games and quests: anchor objects, missions, loot in locations.
Service/inspection: identification of risk areas, checklists on top of equipment.
Marketing/events: AR banners, AR coupons in real space.

For iGaming cases - caution: use AR as navigation and visual cues, not as an influence on gameplay (compliance/responsible play).

3) Extended layer taxonomy

1. Annotation layer (signatures/labels): names, statuses, prices/links.
2. Guidance layer (navigation): arrows, tracks, "bread crumbs" in space, ray tips.
3. Object layer (3D objects/avatars): models with physics, anchors, LOD settings.
4. Interaction layer: transform grips, hotspots, radial menus.
5. System layer (service): calibration, tracking quality, lighting/plan status.
6. Safety layer: boundaries, collision avoidance, no-spawn zones.

Layers are designed as compositions: the system can temporarily increase the priority of Guidance over Annotation (for example, when navigating).

4) Spatial basis: anchors, scale, occlusion, light

• Planar (floor, table), isometric (surfaces), object (recognizable shapes), geo-anchors (coordinates).
• Show tracking status: unstable → stable (change in transparency/icons).
• Scale: Always start from real (1:1) or mark the scale explicitly (ruler/shadow).
• Occlusion: Convincing AR requires correct "overlap" with real objects (depth/people occlusion). If not, use soft shadows and an "aura underlay" to make the object "sit" in the scene.
• Lighting and shadows: adjust to real light, shadow - soft and tied to the plane.
• Stability: avoid "bounce" - smooth anchor posture (filters, inertia).

5) Interaction: gestures, look, voice, haptics

Mobile-AR

Gestures: tap (selection), drag (movement along the plane), pinch (scale), twist (rotate), long-press (menu).
Helpers: ray-cursor, "sticky" bindings to corners/edges.
Haptika: a light tick when fixing the anchor/docking.

Headsets/Spatials

Look/cursor + pinch/air tap gesture.
Voice: short commands ("pin," "show paths," "reset").
Spatial buttons: large, at least 44 × 44 px with distance equivalent, with "building" to the user.

Rule: duplicate input at critical steps (gesture + button + voice).

6) Information and visual hierarchy

The golden rule of AR layers: UI minimum, context maximum.
Read the scene: If the user is moving fast, reduce annotation density and increase navigation contrast.
Framing: keep no more than 3-5 objects with high visual priority on the screen.
Reading distance: large text 2-3 m, small - no closer than 0. 5 m; always use a "die" for readability.
Transitions: smooth appearance/disappearance (120-200 ms), "sticking" to the plane when leaving the field of view.

7) AR states and feedback

Calibration: "Find the plane... slowly lead the camera." Show progress/hints.
Anchor Justification/Reinforcement: Surface Found, Anchor Anchored.

Tracking error: "Not enough light/camera closed/too close." Suggest actions: "Turn on the backlight," "Retreat 50 cm."

Success: light haptics + green indicator.
Loading/streaming 3D: skeleton container/simple proxy form, progress%.

8) Accessibility (A11y) and comfort

Large interaction goals, high contrast of dies and text.
Input alternatives: button on the screen, voice, simplified presets of positions.
Motion sickness reduction: smooth camera movements, parallax limitation, respect for'reduce motion'.

Voicing of statuses: "Anchor fixed," "Route updated."

Limitation of cognitive load: no more than one complex action at a time; focus mode (suppresses minor layers).

9) Localization and multi-regions

Texts in i18n keys; length margin on DE/TR.
Units and currencies - local (m, cm; UAH, EUR).
Variable gestures and voice: Consider local commands/pronunciations.
"Building" shortcuts - to the user, RTL alignment options.

10) Confidentiality, Security, Compliance

Camera = personal data. Explain the purpose of capture, storage, TTL.
On-device primary processing; masking faces/numbers when logging.
No-record mode: disables video/frame saving.
Safety zones: do not roll down objects in doors/stairs; warn about nearby traffic.
For iGaming marketing: Do not place AR elements in restricted locations (laws/age).

11) Performance and quality

Scene budgets: triangles, textures (size/format), draw calls; LOD/ impostors.
Lighting: baked/fake shadows; avoid expensive dynamic sources.
Network: progressive 3D loading (GLB/DRACO/meshopt), caching.
Battery/heat: hold FPS stable; reduce refresh rate/quality when overheating.
Diagnostics: tracking indicator, FPS overlay (dev), anchor logs.

12) Layout patterns of AR layers

12. 1 Indoor navigation

Guidance: arrows on the floor, "bread crumbs" - marks every 3-5 m.
Annotation: goal name, distance and time.
Safety: warning about stairs/closed areas.
Interaction: tap gesture on the label → details/alternative route.

12. 2 Training overlay (instruction)

Object: 3D shadow of the tool/part at the place of installation.
Guidance-Step 1/3 area highlighting.

Interaction: "Next/Back," voice "Done."

Feedback: "Installed correctly," haptic + green ring.

12. 3 Fitting/visualization 1:1

Anchor: search for a floor/table → "landing" with a shadow.
Controls: scale/rotate grips, 10cm grid, snap to walls.
A11y: Reset Position button, Make Lighter.
Perf: low fields, replaceable materials.

13) AR-UX Metrics

Anchor success rate, Time-to-anchor.
Placement accuracy.
Task success/Time-on-task scripted.
Stability score (drift/" bounce ").
Drop-off at the calibration/loading stages.
Nausea/comfort score (survey), motion sickness complaints.
Battery drain / session length.

A/B ideas: type of tips during calibration, shape of arrows, contrast of dies, shadows vs without shadows.

14) "Real world" testing

In-situ: test where it will be used (light, textures, noise).
Range of devices: weak/strong, different cameras/FOV.
Variable scenes: polished surface vs rough; bright sun vs twilight.
Edge cases: mirrors/glass, repeating patterns (carpets), narrow corridors.
Blind spots: partial plane detection, negative angles, brisk walking.

15) Anti-patterns

"UI-clutter": labels on each object → overload.
No tracking and calibration status (the user does not understand what is "trembling").
Microcrift 2-3 m without substrate (unreadable).
Sharp teleports of objects when the anchor is lost.
Complex gestures with no button/voice alternative.
No stop/hide for AR layers.
Ignoring camera privacy and location laws.

16) Checklists

Before the release of the scene

• Anchoring is stable; shows the tracking statuses.
• We read the text at 2-3 m, there are dies/occlusion/shadows.
• Controls: tap/drag/pinch/rotate + alternate (button/voice).
• Safety zones and no-spawn areas are configured.
• A11y: large targets, high contrast, 'reduce motion' considered.
• Localization and units are correct.
• Perf: LOD, compressed textures, stable FPS.
• Privacy/logs: consent, masking, TTL.

UX Diagnostics

• Time-to-anchor ≤ 5 s in a typical scene.
• Anchor success ≥ 90% in normal light.
• Drop-off on calibration ≤ 10%.
• Motion sickness complaints <5%.

17) Mini-guide to content and microcopy for AR

Calibration: "Gently move the camera to find the surface."

Reference: "Surface found. Tap to set the object.

Gesture hint: "Bring your fingers together to reduce. Turn two fingers to unfold."

Navigation: "Go to the label. 12 m to go."

Error: "Not enough light. Turn on the backlight or go to the window.

Exit: "Hide AR layers "/" Return to camera."

18) Design system for AR (standard DS extension)

• `scale. minReadableDistance`, `label. backplate. opacity`, `shadow. softness`, `anchor. snapThreshold`, `occlusion. enabled`.
• Components: ARBadge, ARLabel, ARHandle, ARIndicator, ARPathNode.
• Patterns: ARPlacement, ARNavigation, ARInstruction.
• Documentation: calibration guides, gestures, tracking statuses, microcopy examples.

19) Before/after examples

Navigation without statuses → with statuses

Before: the arrows "tremble," the user is lost.
After: "Bad tracking" indicator + "slow down" advice, arrows reduce density, a trail line appears.

Fitting without shadow → with shadow and grid

Before: the object "soars," the scale is incomprehensible.
After: soft shadow, 10 cm grid, snap to the wall → realism and confidence.

Overloaded text → readable dies

Up to: 6 annotations of different colors at 2 m.
After: 2-3 key dies with background and icon, the rest - on request.

20) Quick start (implementation plan)

1. Scenario → layer: define what AR decides (navigation? instruction? fitting?).
2. Prototype (mid-fi → AR-proto): false 3D/video overlay → early check.
3. Model/Content: Optimize 3D (Polygons/Textures/LOD).

4. Calibration/anchors: stability before "beauty."

5. Field tests: light/surfaces/motion.
6. А11у/security/privacy: checklists and policy.
7. Metrics and telemetry: anchors, stability, task success.
8. Iterations/rollout: canary launch by device and scene.

Final cheat sheet

Context before UI: Show only the layers you want.
Stable anchors, real scale, shadows and occlusion are the basis of trust.
Multi-input: gestures + button + voice, explicit statuses.
Comfort and A11y: large targets, high contrast, less movement.
Camera and safety zone privacy is the default.
Measure anchors and stability, test in real conditions, optimize content.

It is necessary - I will prepare AR-patterns for your scenarios (indoor navigation, training overlays, fitting 1:1) with microcopy, AR-tokens and checklists for your design system.