Spaces:
Running
Running
File size: 10,672 Bytes
3e090ab c05971e 3e090ab c05971e bfed06f c05971e 8d4182e c05971e 8d4182e c05971e 3e090ab c05971e aff67c7 3e090ab c05971e 8d4182e c05971e 8d4182e c05971e 8d4182e c05971e 8d4182e c05971e 8d4182e c05971e aff67c7 c05971e 8d4182e c05971e 8d4182e c05971e aff67c7 c05971e 8d4182e c05971e 8d4182e c05971e 3e090ab c05971e 3e090ab |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 |
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Reachy Phone Home: a tiny focus buddy that tracks your phone and reacts with emotions and movements." />
<meta name="theme-color" content="#0f1115" />
<title>Reachy Phone Home • Reachy Mini App</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Manrope:wght@400;500;600&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header class="hero" id="top">
<div class="wrap">
<div class="topline">
<div class="brand" aria-label="Brand">
<span class="logo" aria-hidden="true">📱</span>
<span class="brand-name">Reachy Mini</span>
</div>
</div>
<div class="hero-grid">
<div class="hero-copy">
<nav class="page-nav" aria-label="Page navigation">
<a
class="btn"
href="https://www.linkedin.com/posts/marcodomingo_nvidiagtc-edgeai-physicalai-activity-7426592008334397440-oQ67?utm_source=social_share_send&utm_medium=member_desktop_web&rcm=ACoAAB_g7q0BSVro1tLCKRRRIVo_DBFF19EyTcY"
target="_blank"
rel="noopener noreferrer"
aria-label="Demo (opens a new tab to LinkedIn)"
>
Demo <span class="btn-note">(opens new tab)</span>
</a>
<a class="btn" href="#features">Features</a>
<a class="btn" href="#webapp">Web App</a>
<a class="btn ghost" href="#quickstart">Quick start</a>
</nav>
<h1>Reachy Phone Home</h1>
<p class="lede">
E.T. wanted to phone home. Reachy wants your phone to <em>stay</em> home. Camera-based tracking watches your phone's designated spot.
</p>
<div class="hero-badges" aria-label="Highlights">
<div class="badges-row benefits">
<span>Real-time tracking</span>
<span>Expressive reactions</span>
<span>Voice + motion</span>
<span>Runs locally</span>
</div>
<div class="badges-row tech-stack">
<span>Arm</span>
<span>Ultralytics YOLO26</span>
<span>Eleven Labs</span>
<span>Hugging Face</span>
<span>Pollen Robotics</span>
</div>
</div>
</div>
<div class="hero-visual">
<div class="glass-card">
<div class="media" role="img" aria-label="Reachy Phone Home demo">
<div class="media-inner">
<img
src="reachy_phone_home/assets/reachy-phone-home.gif"
alt="Reachy Phone Home demo showing phone tracking and reactions"
class="hero-media"
loading="eager"
/>
</div>
</div>
<p class="caption">
</p>
</div>
</div>
</div>
</div>
</header>
<main class="wrap">
<section id="features" class="section features" aria-label="Features">
<div class="section-header">
<p class="eyebrow">Features</p>
<h2>A gentle focus loop with personality</h2>
<p class="intro">
Designed for a desk setup: simple, playful, and obvious when you drift.
</p>
</div>
<div class="feature-grid">
<div class="feature-card">
<img
src="reachy_phone_home/assets/detection.gif"
alt="Phone and person detection in action"
class="feature-image"
loading="lazy"
/>
<h3>Phone + person detection</h3>
<p>YOLO-based vision to spot your phone and understand context.</p>
</div>
<div class="feature-card">
<img
src="reachy_phone_home/assets/reachy-reacts.gif"
alt="Reachy expressing emotions and reactions"
class="feature-image"
loading="lazy"
/>
<h3>Expressive reactions</h3>
<p>Movements + emotion make accountability feel like a companion, not a timer.</p>
</div>
<div class="feature-card">
<img
src="reachy_phone_home/assets/phone-home-zone.gif"
alt="Phone home zone tracking demonstration"
class="feature-image"
loading="lazy"
/>
<h3>Home zone tracking</h3>
<p>Define a "home" spot in front of the camera. Phone stays home? Focus vibes.</p>
</div>
</div>
</section>
<section id="webapp" class="section webapp" aria-label="Web App">
<div class="section-header">
<p class="eyebrow">Web interface</p>
<h2>Monitor and tune from your browser</h2>
<p class="intro">
Access Reachy's live status and tweak behavior for real-time feedback.
</p>
</div>
<div class="webapp-grid">
<div class="webapp-visual">
<div class="glass-card">
<div class="media" role="img" aria-label="Web app interface">
<div class="media-inner">
<img
src="reachy_phone_home/assets/web-app.gif"
alt="Web app interface showing live status and settings"
class="hero-media"
loading="lazy"
/>
</div>
</div>
<p class="caption">
</p>
</div>
</div>
<div class="webapp-copy">
<h3>See what Reachy sees</h3>
<ul class="list">
<li><span aria-hidden="true">📊</span> Live status of phone detection and current behavior state.</li>
<li><span aria-hidden="true">⏱️</span> Adjust behavior timings (how long before Reachy reacts).</li>
<li><span aria-hidden="true">🔊</span> Toggle audio quips. While Reachy is cute, it can be distracting or can bother others</li>
<li><span aria-hidden="true">⚙️</span> Fine-tune detection confidence and processing intervals.</li>
</ul>
<p class="note">
The web interface runs locally alongside the app—no cloud required.
</p>
</div>
</div>
</section>
<section id="quickstart" class="section quickstart" aria-label="Quick start">
<div class="section-header">
<p class="eyebrow">Quick start</p>
<h2>Install via the Reachy Mini Control App (Recommended)</h2>
</div>
<div class="install-grid" aria-label="Recommended install">
<div class="install-copy">
<p class="eyebrow">Option A</p>
<h3>Download the app & run</h3>
<p class="intro">
Recommended if you just want it working fast on Reachy Mini.
</p>
<ul class="list compact">
<li><span aria-hidden="true">📍</span> Place your phone in front of Reachy (camera view).</li>
<li><span aria-hidden="true">▶️</span> Launch it and let Reachy track the phone “home” zone.</li>
</ul>
<p class="note">
Note: the first run may download YOLO weights automatically.
</p>
</div>
<div class="install-visual">
<div class="glass-card">
<div class="media" role="img" aria-label="Installation process">
<div class="media-inner">
<img
src="reachy_phone_home/assets/install.gif"
alt="Installation process demonstration"
class="hero-media"
loading="lazy"
/>
</div>
</div>
<p class="caption">
</p>
</div>
</div>
</div>
<div class="optional" aria-label="Optional developer route">
<details class="optional-card">
<summary>
<span class="eyebrow">Option B (optional)</span>
<h3>Clone & run with Python</h3>
<p class="intro">Best for development and tweaking thresholds/behaviors.</p>
</summary>
<div class="optional-content">
<div class="codeblock" role="group" aria-label="Clone and run">
<div class="codeblock-title">Clone and run</div>
<pre><code>git clone <YOUR_REPO_URL>
cd reachy_mini/reachy_phone_home
python reachy_phone_home_app.py</code></pre>
</div>
<div class="codeblock" role="group" aria-label="Example flags">
<div class="codeblock-title">Example flags</div>
<pre><code>python reachy_phone_home_app.py --conf 0.15 --process-every 1</code></pre>
</div>
</div>
</details>
</div>
<div class="optional" aria-label="Simulation mode">
<details class="optional-card">
<summary>
<span class="eyebrow">Option C (simulation)</span>
<h3>Run without Reachy hardware</h3>
<p class="intro">Test the app using simulation if you don't have a physical Reachy Mini.</p>
</summary>
<div class="optional-content">
<p>Install the same way as Option A through the Reachy Mini Control app, but select <strong>Simulation</strong> mode instead of connecting to physical hardware.</p>
<p class="note">
<strong>Note:</strong> Simulation mode uses your webcam for phone detection, but Reachy's head movements won't change the camera POV—you'll miss the full "tracking" experience. Great for testing detection logic.
</p>
</div>
</details>
</div>
</section>
<footer class="footer" aria-label="Footer">
<p>
Reachy Phone Home — Reachy Mini App.
<a href="#top">Back to top</a> · <a href="README.md">README</a>
</p>
</footer>
</main>
</body>
</html>
|