Spaces:

hugging-mac
/

README

Running

App Files Files Community

devilyouwei commited on 7 days ago

Commit

ef00fbb

verified ·

1 Parent(s): fab155d

Compact organization card and trim game demos

Browse files

Files changed (4) hide show

index.html +43 -27
videos/fruit-slice.mp4 +2 -2
videos/palm-thunder.mp4 +2 -2
videos/pose-follow.mp4 +2 -2

index.html CHANGED Viewed

@@ -3,67 +3,83 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <meta name="description" content="Camera-controlled neural games running locally on Apple Silicon with Hugging Mac.">
-  <title>Hugging Mac · Neural Game Demos</title>
   <style>
-    :root { color-scheme: dark; --bg:#07090d; --panel:#111722; --line:#283142; --text:#f5f7fb; --muted:#9ba6b8; --blue:#39a7ff; }
     * { box-sizing:border-box; }
     html { scroll-behavior:smooth; }
-    body { background:radial-gradient(circle at 80% 0,#142640 0,transparent 32rem),var(--bg); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; margin:0; }
     a { color:inherit; }
-    header,main,footer { margin:auto; max-width:1180px; width:calc(100% - 40px); }
-    header { padding:72px 0 44px; }
-    .eyebrow { color:var(--blue); font:700 12px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.16em; text-transform:uppercase; }
-    h1 { font-size:clamp(48px,8vw,96px); letter-spacing:-.07em; line-height:.9; margin:18px 0 24px; }
-    header p { color:var(--muted); font-size:clamp(17px,2vw,22px); line-height:1.6; max-width:760px; }
-    nav { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
-    nav a { border:1px solid var(--line); border-radius:999px; padding:10px 16px; text-decoration:none; }
     nav a:first-child { background:var(--text); color:var(--bg); }
-    .demos { display:grid; gap:20px; grid-template-columns:repeat(3,minmax(0,1fr)); }
-    article { background:color-mix(in srgb,var(--panel) 92%,transparent); border:1px solid var(--line); border-radius:24px; overflow:hidden; scroll-margin-top:24px; }
     video { aspect-ratio:16/9; background:#000; display:block; object-fit:contain; width:100%; }
-    .copy { padding:20px 22px 24px; }
-    .copy span { color:var(--blue); font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.12em; text-transform:uppercase; }
-    h2 { font-size:clamp(24px,2.4vw,34px); letter-spacing:-.045em; margin:8px 0 10px; }
-    .copy p { color:var(--muted); line-height:1.65; margin:0; max-width:760px; }
-    footer { color:var(--muted); display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; padding:44px 0 64px; }
     footer a { color:var(--text); }
-    @media (max-width:900px) { .demos { grid-template-columns:1fr; } }
-    @media (max-width:640px) { header { padding-top:44px; } header,main,footer { width:calc(100% - 24px); } .copy { padding:20px; } article { border-radius:18px; } }
   </style>
 </head>
 <body>
   <header>
-    <div class="eyebrow">Hugging Mac · Apple Silicon</div>
-    <h1>Play with<br>local intelligence.</h1>
-    <p>No controller. No cloud video upload. These games turn live model output into real-time input, with the complete interaction loop running locally on a Mac.</p>
     <nav aria-label="Project links">
       <a href="https://github.com/devilyouwei/hugging-mac">View on GitHub</a>
       <a href="https://huggingface.co/hugging-mac">Explore models</a>
     </nav>
   </header>
-  <main class="demos">
     <article id="pose-follow">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/pose-follow.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/pose-follow.mp4" type="video/mp4">
       </video>
-      <div class="copy"><span>YOLOv8 Pose · Body and gesture control</span><h2>Yolo Pose Follow</h2><p>Match body poses and hand gestures before the clock runs out. YOLOv8 Pose tracks your skeleton locally and scores every target in real time.</p></div>
     </article>
     <article id="fruit-slice">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/fruit-slice.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/fruit-slice.mp4" type="video/mp4">
       </video>
-      <div class="copy"><span>YOLOv8 Pose · Motion control</span><h2>Yolo Fruit Slice</h2><p>Turn both forearms into blades, slice fruit, avoid bombs, and build combos using a live camera and local pose estimation.</p></div>
     </article>
     <article id="palm-thunder">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/palm-thunder.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/palm-thunder.mp4" type="video/mp4">
       </video>
-      <div class="copy"><span>MediaPipe · Hand tracking</span><h2>Palm Thunder</h2><p>Steer a vertical shooter with your palm, close your fist to bomb the screen, and play solo or co-op with local hand tracking.</p></div>
     </article>
   </main>
   <footer><span>Built with Hugging Mac. Your data stays on your machine.</span><a href="https://github.com/devilyouwei/hugging-mac">Contribute on GitHub →</a></footer>

 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="description" content="Run AI models and build local applications on Apple Silicon with Hugging Mac.">
+  <title>Hugging Mac · Local AI on Apple Silicon</title>
   <style>
+    :root { color-scheme:dark; --bg:#090d14; --panel:#111722; --line:#273142; --text:#f5f7fb; --muted:#9ba6b8; --blue:#51adff; }
     * { box-sizing:border-box; }
     html { scroll-behavior:smooth; }
+    body { background:radial-gradient(circle at 85% 0,#142640 0,transparent 25rem),var(--bg); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; margin:0; }
     a { color:inherit; }
+    header,main,footer { margin:auto; max-width:1180px; width:calc(100% - 36px); }
+    header { align-items:end; display:grid; gap:20px; grid-template-columns:1fr auto; padding:34px 0 24px; }
+    .eyebrow { color:var(--blue); font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.14em; text-transform:uppercase; }
+    h1 { font-size:clamp(34px,5vw,58px); letter-spacing:-.055em; line-height:1; margin:9px 0 12px; }
+    header p { color:var(--muted); font-size:15px; line-height:1.55; margin:0; max-width:720px; }
+    nav { display:flex; flex-wrap:wrap; gap:8px; }
+    nav a { border:1px solid var(--line); border-radius:999px; font-size:13px; padding:8px 13px; text-decoration:none; white-space:nowrap; }
     nav a:first-child { background:var(--text); color:var(--bg); }
+    .section-label { color:var(--muted); font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.14em; margin:0 0 10px; text-transform:uppercase; }
+    .demos { display:grid; gap:14px; grid-template-columns:repeat(3,minmax(0,1fr)); }
+    article { background:color-mix(in srgb,var(--panel) 92%,transparent); border:1px solid var(--line); border-radius:16px; overflow:hidden; scroll-margin-top:24px; }
     video { aspect-ratio:16/9; background:#000; display:block; object-fit:contain; width:100%; }
+    .copy { padding:13px 15px 15px; }
+    .copy span { color:var(--blue); font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; text-transform:uppercase; }
+    h2 { font-size:20px; letter-spacing:-.035em; margin:5px 0 5px; }
+    .copy p { color:var(--muted); font-size:12px; line-height:1.5; margin:0; }
+    .about { align-items:start; border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:grid; gap:24px; grid-template-columns:1.35fr 1fr; margin-top:24px; padding:22px 0; }
+    .about h2 { font-size:24px; margin:0 0 7px; }
+    .about p { color:var(--muted); font-size:13px; line-height:1.6; margin:0; }
+    .capabilities { display:flex; flex-wrap:wrap; gap:7px; }
+    .capabilities span { background:var(--panel); border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:11px; padding:6px 9px; }
+    footer { color:var(--muted); display:flex; flex-wrap:wrap; font-size:12px; gap:16px; justify-content:space-between; padding:18px 0 28px; }
     footer a { color:var(--text); }
+    @media (max-width:760px) { header { align-items:start; grid-template-columns:1fr; } .demos { grid-template-columns:1fr; } .about { grid-template-columns:1fr; } }
+    @media (max-width:640px) { header { padding-top:26px; } header,main,footer { width:calc(100% - 24px); } }
   </style>
 </head>
 <body>
   <header>
+    <div>
+      <div class="eyebrow">Hugging Mac · Apple Silicon</div>
+      <h1>Local AI, built on your Mac.</h1>
+      <p>Run optimized models across CPU, GPU, and the Apple Neural Engine—then combine their capabilities into private, responsive applications, games, services, and agents.</p>
+    </div>
     <nav aria-label="Project links">
       <a href="https://github.com/devilyouwei/hugging-mac">View on GitHub</a>
       <a href="https://huggingface.co/hugging-mac">Explore models</a>
     </nav>
   </header>
+  <main>
+    <div class="section-label">Neural game demos · No controller · No cloud</div>
+    <section class="demos">
     <article id="pose-follow">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/pose-follow.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/pose-follow.mp4" type="video/mp4">
       </video>
+      <div class="copy"><span>YOLOv8 Pose</span><h2>Pose Follow</h2><p>Match body poses and gestures in real time.</p></div>
     </article>
     <article id="fruit-slice">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/fruit-slice.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/fruit-slice.mp4" type="video/mp4">
       </video>
+      <div class="copy"><span>YOLOv8 Pose</span><h2>Fruit Slice</h2><p>Turn your arms into blades and build combos.</p></div>
     </article>
     <article id="palm-thunder">
       <video controls playsinline preload="metadata" poster="https://hugging-mac-readme.static.hf.space/posters/palm-thunder.png">
         <source src="https://hugging-mac-readme.static.hf.space/videos/palm-thunder.mp4" type="video/mp4">
       </video>
+      <div class="copy"><span>MediaPipe Hand</span><h2>Palm Thunder</h2><p>Fly, fire, and trigger bombs with your hands.</p></div>
     </article>
+    </section>
+    <section class="about">
+      <div><h2>Models ready to build with.</h2><p>Hugging Mac provides ready-to-use and optimized local models for Apple Silicon, removing conversion and integration work so developers can focus on what they want to create.</p></div>
+      <div class="capabilities" aria-label="Supported AI capabilities"><span>LLM &amp; Multimodal</span><span>Speech Recognition</span><span>Text-to-Speech</span><span>Object Detection</span><span>Pose &amp; Segmentation</span><span>Face &amp; Hand</span></div>
+    </section>
   </main>
   <footer><span>Built with Hugging Mac. Your data stays on your machine.</span><a href="https://github.com/devilyouwei/hugging-mac">Contribute on GitHub →</a></footer>

videos/fruit-slice.mp4 CHANGED Viewed

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:729899e09826da40c23bb8ace01e179719f49c4a1780d72fb846f2f5716c0471
-size 4402967

 version https://git-lfs.github.com/spec/v1
+oid sha256:f6fd49641bc3203403ca4fd138dd6d6d138a8776e4f0b21722dbfeb3ffc417ad
+size 3919611

videos/palm-thunder.mp4 CHANGED Viewed

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:39c66e41810024a8927c22fe27493a2df85c0eb158f046ce4428617933a0a870
-size 9346477

 version https://git-lfs.github.com/spec/v1
+oid sha256:53e41b2163c535c67969cb9ee27c6fc10b7c6c8ad677f63fa0de910794e9eb3a
+size 2292372

videos/pose-follow.mp4 CHANGED Viewed

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2d41bf9b6c67cfda0d303ecee8a8492b76bbcfd9139248424ba12db4b7f57049
-size 2721162

 version https://git-lfs.github.com/spec/v1
+oid sha256:da4ed356f0387b590c50c8b21880fc8edc11e6dedf06b28ca2e2022db01c4007
+size 2249913