Product design for an IoT smart monitoring product for short-term rentals, across a mobile app and a web platform: sensor pairing and setup, push and in-app alerts, a live noise trend against the limit, guest messaging, quiet hours, team roles and the first run. The product, its data and the research participants are fictional. 19 screens (12 app, 7 web) go from grayscale wireframes to a clickable prototype to final visual designs on 89 tokens, set in Inter. An illustrative usability round with 5 fictional participants and 4 tasks produced 5 findings, each shown before and after. A consistency audit counted from the screens takes terminology mismatches between app and web from 3 to 0. The handoff has tokens as CSS variables and W3C design tokens JSON, 45 component states, redlines, 25 SVG icons, 38 layered SVG frames and 8 questions for the development team.
The alert on both platforms: the app shows the live status and the last hour of noise against the 70 dB limit; the web platform lays the same content out beside a filtered alert list.
Clickable prototype walkthrough: first run, sensor pairing, the alert and quiet hours
A watermarked contact sheet with the full file list is linked from this page; the complete file pack is delivered on contract.
New IoT flows: sensor pairing in three steps from wireframe to final design, the alert as a lock-screen push and as an in-app banner, the first run, and team roles with per-role permissions on the web.
Sample usability round (placeholder participants): five findings, each tied to a change, shown as version 1 and version 2 on the app alert and on the web quiet hours settings.
Consistency and handoff: terminology mismatches counted from the screens go from 3 to 0, component states, redlines and tokens, and the Figma-ready export of layered SVG frames plus W3C design tokens.
0 likes · 4 views · Sep 24, 2026
Mobile app and web platform design for a connected rental monitoring product: sensor pairing, push alerts, live noise trends and team roles, from wireframes to prototype to visual design, tested in an illustrative usability round, with a developer handoff.
