4620 North Park Condo Website
Mobile Issues Summary

Prepared: September 26, 2026  |  Site: 4620condo.com  |  Prepared for: Condo Board / Technical Review

Background

The 4620 North Park Condo website serves two distinct audiences simultaneously:

• Lobby kiosk display — a Raspberry Pi running a full-screen browser pointed at 4620condo.com, showing the OptiSigns digital signage playlist in a 16:9 iframe
• Resident mobile browsers — iPhones and Android phones accessing the site via Safari (iOS default) and Chrome

These two use cases have different screen sizes, interaction models, and browser behaviors, which is the root cause of most of the issues described below.

Issue 1: OptiSigns Iframe — Single Playlist for All Screen Sizes

What the problem is

The homepage embeds an OptiSigns playlist in a 16:9 iframe. That playlist was designed for the lobby's landscape monitor. When a resident views the homepage on a phone (portrait orientation), the iframe either:

• Shrinks to fit the narrow screen, making text and graphics too small to read
• Gets cropped, cutting off content on the sides
• Displays content formatted for a 1920×1080 monitor on a 390×844 iPhone screen

Why it happens

OptiSigns playlists are authored at a fixed resolution (typically 1920×1080 for landscape). The embed code scales the content down proportionally, but the slide content itself — font sizes, image crops, layout — was never designed for a 9:16 portrait phone screen.

Proposed solution

Issue 2: Safari Autoplay — First Video Requires a Tap

What the problem is

On Safari (iPhone and Mac), the first video in the OptiSigns playlist does not autoplay. The resident sees a static frame or a play button and must tap inside the iframe before video begins. After that first tap, all subsequent videos in the playlist autoplay normally.

Why it happens

Apple's Safari enforces a strict autoplay policy: video with audio (or unknown audio status) requires a direct user gesture before it will play. This is a deliberate browser security/UX decision by Apple and cannot be overridden by website code. Specifically:

• The OptiSigns iframe is cross-origin (a different domain), so the site cannot programmatically simulate a click inside it — Safari blocks this
• The autoplay and muted iframe attributes help with muted video but OptiSigns content may include audio
• Chrome on Android and desktop Chrome are more permissive and generally autoplay without issue

Current behavior by browser

Recommended next step

Issue 3: Transportation Page — Mobile Layout

What the problem was

The Transportation page uses a split-panel layout: a 220px sidebar of transit buttons on the left, and a live tracker iframe filling the right. On mobile, the sidebar pushed the iframe off-screen or caused horizontal scrolling.

Fix applied

On screens 640px wide and below, the layout switches to a stacked mode: transit buttons scroll horizontally in a single row across the top, and the Ride On 23 tracker iframe fills the full width below. Desktop layout is unchanged.

Status

Fix has been published to 4620condo.com. Needs verification on a physical iPhone in Safari.

Issue 4: HVAC Page — Mobile Layout

What the problem was

The HVAC page has several elements that did not stack correctly on mobile:

• Dusty the bot image and Quick Info panel displayed side-by-side (too cramped on phone)
• The 5 sub-page navigation buttons overflowed horizontally instead of wrapping
• The Dusty CTA row did not stack vertically

Fix applied

On screens 640px wide and below: Dusty image and Quick Info panel stack vertically; the 5 sub-page buttons wrap into a 3×2 grid; the CTA row stacks. Desktop layout is unchanged.

Status

Fix has been published. Needs verification on a physical iPhone in Safari.

Issue 5: HVAC Sub-pages — Thermostat and Other Info

Thermostat page

Video, app store links, and manuals cards were displaying text and buttons side-by-side on narrow screens. Fix: text stacks above buttons on mobile.

Other Info page

Resource cards were displaying description and link button side-by-side. Fix: description stacks above link button on mobile.

Summary Table