- -
+
-
-
- If this light is red: look at the address bar at the top. The link should start with https:// or say
- localhost. If it doesn’t, add the missing https:// or open the site from our secure Unity AI Lab page.
- It’s just like buckling a seatbelt so everything stays safe.
+
+ Secure connection detected. Unity can safely access the microphone and speech features.
+
+
+ Open this page with https:// or from localhost, then press “Check again.”
- After you fix it, press the big “Check again” button.
- -
+
-
-
- If this light is red: your browser can’t hear you yet. Open this page in the latest version of Google Chrome,
- Microsoft Edge, or another browser that supports talking and listening. Imagine switching to a friend who knows how
- to play the game.
+
+ Speech recognition is available. Unity will understand what you say.
+
+
+ Open this page in the latest Chrome or Edge, then press “Check again.”
- Switch browsers or update yours, then press “Check again.”
- -
+
-
-
- If this light is red: the browser doesn’t know how to speak back. Make sure your speakers aren’t muted and that
- you’re using a browser with voice support (Chrome, Edge, or Safari on desktop works best). Refresh the page after
- turning the sound on.
+
+ Speech voices are ready. Unity can answer out loud through your speakers.
+
+
+ Use Chrome, Edge, or Safari with audio enabled, then press “Check again.”
- When you’re ready, press “Check again” to retry.
- -
+
-
-
- If this light is red: the browser needs permission to hear you. Look for a pop-up asking to use your microphone and
- click “Allow.” If you missed it, click the lock icon in the address bar and enable the microphone. It’s like giving a
- friend permission to listen to your story.
+
+ Microphone permission granted. Unity can hear your voice input.
+
+
+ Click “Allow” on the microphone prompt or enable it in site settings, then press “Check again.”
- Press “Check again” after allowing the microphone.
diff --git a/landing.js b/landing.js
index 1094d7d..023b6ef 100644
--- a/landing.js
+++ b/landing.js
@@ -55,6 +55,18 @@ function formatDependencyList(items) {
return `${head} and ${tail}`;
}
+function getDependencyStatuses(item) {
+ if (!item) {
+ return {
+ passStatus: 'Ready',
+ failStatus: 'Check settings'
+ };
+ }
+
+ const { passStatus = 'Ready', failStatus = 'Check settings' } = item.dataset;
+ return { passStatus, failStatus };
+}
+
function setStatusMessage(message, tone = 'info') {
if (!statusMessage) {
return;
@@ -196,24 +208,25 @@ function updateDependencyUI(results, allMet, { announce = false, missing = [] }
return;
}
- item.dataset.state = result.met ? 'pass' : 'warn';
+ item.dataset.state = result.met ? 'pass' : 'fail';
const statusElement = item.querySelector('.dependency-status');
if (statusElement) {
- statusElement.textContent = result.met ? 'Ready' : 'Check settings';
+ const { passStatus, failStatus } = getDependencyStatuses(item);
+ statusElement.textContent = result.met ? passStatus : failStatus;
}
});
}
if (dependencyLight) {
- dependencyLight.dataset.state = allMet ? 'pass' : 'warn';
+ dependencyLight.dataset.state = allMet ? 'pass' : 'fail';
const summary = formatDependencyList(missing);
dependencyLight.setAttribute(
'aria-label',
allMet
? 'All dependencies satisfied'
: summary
- ? `Compatibility mode enabled because ${summary} is unavailable`
- : 'Compatibility mode enabled. Some requirements are missing'
+ ? `Missing requirements: ${summary}`
+ : 'Missing one or more requirements'
);
}
@@ -223,8 +236,8 @@ function updateDependencyUI(results, allMet, { announce = false, missing = [] }
} else {
const summary = formatDependencyList(missing);
dependencySummary.textContent = summary
- ? `We spotted a few red lights (${summary}). Talk to Unity will still launch, but those features may be limited until they turn green.`
- : 'We spotted a few red lights. Talk to Unity will still launch, but some features may be limited.';
+ ? `Red lights: ${summary}. Follow the fix steps below, then press "Check again."`
+ : 'Red lights detected. Follow the fix steps below, then press "Check again."';
}
}
diff --git a/style.css b/style.css
index 4e38386..1172f5b 100644
--- a/style.css
+++ b/style.css
@@ -322,14 +322,14 @@ body[data-app-state='experience'] #landing {
box-shadow: 0 0 0 2px rgba(26, 10, 0, 0.5), 0 12px 30px rgba(244, 114, 22, 0.32);
}
-.dependency-light[data-state='warn'] {
- background: linear-gradient(135deg, var(--accent-amber), #b45309);
- box-shadow: 0 0 0 2px rgba(26, 10, 0, 0.55), 0 12px 30px rgba(244, 114, 22, 0.36);
+.dependency-light[data-state='fail'] {
+ background: linear-gradient(135deg, var(--accent-red), #7f1d1d);
+ box-shadow: 0 0 0 2px rgba(40, 0, 0, 0.55), 0 12px 30px rgba(255, 62, 62, 0.38);
}
-.dependency-item[data-state='warn'] .dependency-name::before {
- background: linear-gradient(135deg, var(--accent-amber), #b45309);
- box-shadow: 0 0 0 2px rgba(26, 10, 0, 0.55), 0 8px 22px rgba(244, 114, 22, 0.28);
+.dependency-item[data-state='fail'] .dependency-name::before {
+ background: linear-gradient(135deg, var(--accent-red), #7f1d1d);
+ box-shadow: 0 0 0 2px rgba(40, 0, 0, 0.55), 0 8px 22px rgba(255, 62, 62, 0.28);
}
.dependency-light[data-state='pass'] {
@@ -396,11 +396,17 @@ body[data-app-state='experience'] #landing {
color: rgba(255, 210, 210, 0.78);
}
-.dependency-instructions {
+.dependency-message {
margin: 0 0 8px;
color: rgba(255, 225, 225, 0.82);
line-height: 1.7;
font-size: 0.98rem;
+ display: none;
+}
+
+.dependency-item[data-state='pass'] .dependency-message[data-message-type='pass'],
+.dependency-item[data-state='fail'] .dependency-message[data-message-type='fail'] {
+ display: block;
}
.landing-actions {
@@ -821,9 +827,3 @@ body.no-js .mute-indicator {
scroll-behavior: auto !important;
}
}
-.dependency-reminder {
- margin: 0;
- color: rgba(255, 200, 200, 0.75);
- font-size: 0.9rem;
-}
-
diff --git a/tests/test_landing_page.py b/tests/test_landing_page.py
index 404c520..8322ee4 100644
--- a/tests/test_landing_page.py
+++ b/tests/test_landing_page.py
@@ -44,7 +44,10 @@ def test_landing_page_structure():
assert statuses.count() == 4
for idx in range(statuses.count()):
status_text = statuses.nth(idx).inner_text().strip().lower()
- assert status_text in {"checking…", "checking...", "ready", "check settings"}
+ normalized = status_text.replace("—", "-")
+ if normalized.startswith("checking"):
+ continue
+ assert normalized.startswith("ready") or normalized.startswith("fix")
launch_button = page.locator("#launch-app")
assert launch_button.inner_text().strip() == "Talk to Unity"