IoT Interfaces, Location and Privacy · Study deck

Interaction Patterns: Synchronization and Recovery

A thermostat app, wall unit, web page, and voice tool may show different states.

UX Uma is your guide for this deck.

interfaceinteractionpatterns
iotclass.org

After studying this chapter

Learning objectives

You will be able to:

  • Explain: What Practitioners Do Wrong: Implementing optimistic UI that shows the new state identically to a confirmed state, leaving users unable to distinguish "command sent" from "command completed.".
  • Explain: Design lesson: For any IoT product with multiple control interfaces, push-based synchronization with optimistic UI is not optional -- it is the minimum viable architecture.
  • Explain: The Problem: Commands sent to IoT devices take 1-5 seconds due to network latency, but UI provides no feedback, leading users to tap repeatedly.
  • Explain: Sync rules must settle which state is true.
iotclass.org

Major section

Start With the Decision

A thermostat app, wall unit, web page, and voice tool may show different states.

  • Sync rules must settle which state is true.
  • Establish the authoritative setpoint first, then follow one wall-unit change through the local display, cloud record, mobile and web views, and voice response.
  • At each hand-off ask whether the value is pending, confirmed, stale, rejected, or queued offline.
iotclass.org

Major section

Ecobee State Synchronization

Without those contracts, a fast interface can still present a convincing but obsolete value and invite a second command based on false state.

  • When a user adjusted the temperature on the wall unit, the app could show stale data for up to 30 seconds.
  • Design lesson: For any IoT product with multiple control interfaces, push-based synchronization with optimistic UI is not optional -- it is the minimum viable architecture.
  • The Problem: Commands sent to IoT devices take 1-5 seconds due to network latency, but UI provides no feedback, leading users to tap repeatedly.
iotclass.org

Major section

Optimistic UI for Garage Doors

Scenario: A smart garage door takes 8-12 seconds to fully open or close (physical mechanical operation).

  • Network round-trip adds 200-500 ms latency.
  • Key Lesson: For any IoT action with > 500 ms latency, optimistic UI is not optional—it's required for acceptable UX.
  • What Practitioners Do Wrong: Implementing optimistic UI that shows the new state identically to a confirmed state, leaving users unable to distinguish "command sent" from "command completed.".
iotclass.org

Major section

Pending vs Confirmed States

If the command fails (network error, battery dead, door jammed), the UI still shows "locked" for several seconds until the error is detected.

  • During this window, the user believes the door is locked when it's actually unlocked—a security risk.
  • Builds on: Interface Design Fundamentals provides the UI component hierarchy foundation that interaction patterns operate within.
  • These state sync patterns also support Multimodal Design across voice, touch, and gesture interfaces.
iotclass.org

Deck summary

Key takeaways

A thermostat app, wall unit, web page, and voice tool may show different states.

  • Without those contracts, a fast interface can still present a convincing but obsolete value and invite a second command based on false state.
  • Scenario: A smart garage door takes 8-12 seconds to fully open or close (physical mechanical operation).
  • If the command fails (network error, battery dead, door jammed), the UI still shows "locked" for several seconds until the error is detected.
iotclass.org

Retrieval practice

Recall check 1 of 5

UX Uma says: answer from memory, then check your reasoning.

Q1Your smart thermostat app experiences 3-second network latency when sending temperature adjustment commands. Users repeatedly tap the increase button, thinking it's not working, resulting in the temperature jumping 10 degrees higher than intended. What interaction pattern would prevent this?

AFreeze the whole app during the delay so users cannot tap again until the command finishes
BMake the temperature buttons smaller and farther apart so repeated taps are treated as accidental input
CShow pending temperature feedback immediately, suppress duplicate taps, then reconcile with the actual device state
DRequire a fixed five-second cooldown after every tap, even when the user intentionally wants another change
Show answer

Answer: C "Optimistic UI" provides immediate visual feedback assuming the command will succeed, then reconciles with reality when the response arrives.

iotclass.org

Retrieval practice

Recall check 2 of 5

UX Uma says: answer from memory, then check your reasoning.

Q2A smart appliance has both a physical control panel and a mobile app. A user adjusts the temperature on the physical panel, but the app still shows the old value. What synchronization principle should govern this interaction?

APhysical controls should be disabled when the app is open
BApp shows stale state until the physical change arrives, then updates.
CUsers should manually refresh the app to see updates
DPhysical and digital interfaces should operate independently
Show answer

Answer: B Multi-interface state should converge on the authoritative device state.

iotclass.org

Retrieval practice

Recall check 3 of 5

UX Uma says: answer from memory, then check your reasoning.

Q3Your smart security camera app sends notifications for every motion detection. Users receive 50+ notifications daily and eventually disable all notifications, missing actual security events. What notification strategy would fix this?

ABatch detections into a notification every 30 seconds while keeping the same routine motion triggers
BFilter routine motion, use zones and schedules, send digests, and escalate only unusual events
CMake each motion alert louder and more prominent so users notice the notifications sooner
DMove every motion alert from push to email so the phone is not interrupted as often
Show answer

Answer: B This demonstrates "alert fatigue" - too many notifications cause users to ignore all of them, including important ones.

iotclass.org

Retrieval practice

Recall check 4 of 5

UX Uma says: answer from memory, then check your reasoning.

Q4What direct interface mechanisms let users express intent?

AVisual Hierarchy
BNavigation Pattern
CInput Controls
DFeedback System
Show answer

Answer: C Controls are the direct mechanisms through which users provide intent.

Q5Complete the real-time sensor update handler:

Aconst display = document.getElementById(sensorId);
Bconst display = document.getElement(sensorId);
Cconst display = document.find(sensorId);
Dconst display = document.select(sensorId);
Show answer

Answer: A getElementById() finds elements by ID.

iotclass.org

Retrieval practice

Recall check 5 of 5

UX Uma says: answer from memory, then check your reasoning.

Q6The wall control and app submit different settings while the app is offline. What must the product define before reconnection?

ABrighter-screen priority for conflicting settings.
BSilent acceptance of both conflicting settings as final.
CCloud overwrite of device state without visible result.
DAuthority and conflict rule with visible pending and resolved states.
Show answer

Answer: D A stated rule and visible states let people understand the resolved value.

iotclass.org

Print reference

Answers

Answer key.

  1. C · "Optimistic UI" provides immediate visual feedback assuming the command will succeed, then reconciles with reality when the response arrives.
  2. B · Multi-interface state should converge on the authoritative device state.
  3. B · This demonstrates "alert fatigue" - too many notifications cause users to ignore all of them, including important ones.
  4. C · Controls are the direct mechanisms through which users provide intent.
  5. A · getElementById() finds elements by ID.
  6. D · A stated rule and visible states let people understand the resolved value.
iotclass.org