docs(space): show annotated signup page

how-to-start.html

@@ -68,7 +68,7 @@
     <header class="hero"><p class="eyebrow">STUDENT GUIDE · HUGGING FACE SPACES</p><h1>How to Start</h1><p class="subtitle">Turn the course demo into your own AI mini app</p><p class="goal">Your finish line: a public Space under your own account that shows what your AI app does. Submit its Space link so your instructor can open and try your work quickly.</p><p class="time">You can follow the basic route entirely in your browser. No Git commands are needed.</p></header>
     <div class="route" aria-label="The route"><span>Sign up</span><b>→</b><span>Duplicate</span><b>→</b><span>Change the app</span><b>→</b><span>Test</span><b>→</b><span>Submit your URL</span></div>
     <p class="section-kicker">The seven steps</p>
-    <section class="step" id="step-01"><div class="step-top"><span class="step-num">01</span><h2>Create your Hugging Face account</h2></div><div class="step-grid"><div class="step-copy"><p>Open <a href="https://huggingface.co/join" target="_blank" rel="noopener noreferrer">https://huggingface.co/join</a>. Enter an email address you check often. Your Gmail address, or the email you use for GitHub, is fine.</p><p>Create a password, click Next, and complete the account steps shown. Sign in when you are done.</p></div><aside class="screen"><span class="screen-label">On the sign-up page</span><div>Join Hugging Face</div><div>Email Address  →  Password  →  Next</div></aside></div></section>
+    <section class="step" id="step-01"><div class="step-top"><span class="step-num">01</span><h2>Create your Hugging Face account</h2></div><div class="step-grid"><div class="step-copy"><p>Open <a href="https://huggingface.co/join" target="_blank" rel="noopener noreferrer">https://huggingface.co/join</a>. Enter an email address you check often. Your Gmail address, or the email you use for GitHub, is fine.</p><p>Create a password, click Next, and complete the account steps shown. Sign in when you are done.</p></div><aside class="screen"><span class="screen-label">On the sign-up page</span><div>Join Hugging Face</div><div>Email Address  →  Password  →  Next</div></aside></div><figure class="shot"><div class="shot-image"><img src="./guide-assets/signup-form.jpg" alt="Actual Hugging Face webpage for step 01" loading="lazy"><span class="shot-mark" style="left:36.6406%;top:41.1111%;width:26.7188%;height:6.1111%" aria-label="Email Address"><b>1</b></span><span class="shot-mark" style="left:36.6406%;top:59.1667%;width:26.7188%;height:6.2500%" aria-label="Password"><b>2</b></span><span class="shot-mark" style="left:36.6406%;top:69.7222%;width:26.7188%;height:5.4167%" aria-label="Next"><b>3</b></span></div><figcaption>On the sign-up page, enter your email (1) and password (2), then choose Next (3).</figcaption></figure></section>
 <section class="step" id="step-02"><div class="step-top"><span class="step-num">02</span><h2>Explore the starter demo</h2></div><div class="step-grid"><div class="step-copy"><p>Open <a href="https://huggingface.co/spaces/wr92-course/test" target="_blank" rel="noopener noreferrer">https://huggingface.co/spaces/wr92-course/test</a>. In App, choose an example image and try Run AI Detection. The first run may take longer while the model downloads.</p><p>Open Files to see the files you will receive in your own copy. You are looking at a working example, not a blank project.</p></div><aside class="screen"><span class="screen-label">On the starter Space</span><div>App  |  Files  |  Community  |  More (three dots)</div><div>Choose an image  →  Run AI Detection</div></aside></div><figure class="shot"><div class="shot-image"><img src="./guide-assets/space-home.png" alt="Actual Hugging Face webpage for step 02" loading="lazy"><span class="shot-mark" style="left:1.3889%;top:17.8571%;width:46.2963%;height:19.2857%" aria-label="The working app"><b>1</b></span></div><figcaption>The course starter Space: open the App and try one example.</figcaption></figure></section>
 <section class="step" id="step-03"><div class="step-top"><span class="step-num">03</span><h2>Duplicate it into your account</h2></div><div class="step-grid"><div class="step-copy"><p>On the starter Space, open the three-dot menu at the top right and choose Duplicate this Space.</p><p>Set Owner to your own account and give the Space a clear name. Set Visibility to Public so your instructor can open it. The duplicate form starts with Private selected.</p><p>Click Duplicate Space. The complete starter project is copied for you; you do not need to paste each code file by hand.</p></div><aside class="screen"><span class="screen-label">The two clicks to find</span><div>Top-right menu (three dots)  →  Duplicate this Space</div><div>Owner: your account  |  Space name: your-project</div><div>Visibility: Public  →  Duplicate Space</div></aside></div><figure class="shot"><div class="shot-image"><img src="./guide-assets/duplicate-menu.png" alt="Actual Hugging Face webpage for step 03" loading="lazy"><span class="shot-mark" style="left:44.1667%;top:1.1429%;width:2.7778%;height:4.5714%" aria-label="More menu"><b>1</b></span><span class="shot-mark" style="left:44.5370%;top:43.7143%;width:16.6667%;height:4.7143%" aria-label="Duplicate this Space"><b>2</b></span></div><figcaption>On the source Space, open More (1), then choose Duplicate this Space (2).</figcaption></figure></section>
 <section class="step" id="step-04"><div class="step-top"><span class="step-num">04</span><h2>Make a first edit in your copy</h2></div><div class="step-grid"><div class="step-copy"><p>Open your new Space. Select Files, open index.html, and use Edit to change the visible title and short introduction to describe your idea.</p><p>Save with a short commit message using Commit changes to main. Then return to App and check that your new text appears.</p><p>To add a new file or upload a replacement, use Files → Add file. Save the change with a commit.</p></div><aside class="screen"><span class="screen-label">Browser editing route</span><div>Your Space  →  Files  →  index.html  →  Edit</div><div>Change text  →  Commit changes to main  →  App</div></aside></div><figure class="shot"><div class="shot-image"><img src="./guide-assets/files-tab.png" alt="Actual Hugging Face webpage for step 04" loading="lazy"><span class="shot-mark" style="left:11.0185%;top:16.0000%;width:7.5926%;height:7.0000%" aria-label="Files tab"><b>1</b></span><span class="shot-mark" style="left:4.3519%;top:69.2857%;width:10.6481%;height:6.0000%" aria-label="index.html"><b>2</b></span></div><figcaption>The Files tab (1) lists the starter code. Open index.html (2) in your own copy to edit its page text.</figcaption></figure></section>

how-to-start.pdf

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:f8d279d82ce9c784774571280361a815891bc52b3264a2b6efeafbfa9868d6ba
-size 567837
+oid sha256:c04707261e74dd3afb055a6e3b41176ab03392ca8dd9723b91c11f1569fe080d
+size 615608