Fix voice freeze, cover design, output order, story continuity

- Voice cloning (my_voice) now runs sequentially AFTER FLUX images to avoid
ZeroGPU concurrency freeze: two concurrent @spaces.GPU threads caused the
browser to hang whenever the user recorded their voice
- Book cover now shows the first page illustration as a framed artwork above
the title, replacing the plain cream-background placeholder
- PDF downloads moved to the output card (below audio, above book pages) so
the output reads: audio → PDFs → storybook
- Removed 'Story spark' input — the 1B model couldn't reliably follow it
and it produced inconsistent results; input wiring updated (8 → 7 inputs)
- Story prompt rules tightened: explicit continuity requirement (each page
flows from the previous), distinctive hero trait anchoring, and required
lesson phrasing on the final page

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

README.md

@@ -78,7 +78,7 @@ DoodleBook uses a structured prompting system to guarantee quality:
 - **Story arc rules**: Pages 1–2 introduce the hero and challenge; middle pages build it; final pages resolve and teach a clear lesson.
 - **2–3 rich sentences per page**: Every page uses sensory detail — colours, sounds, textures, feelings — not just plot.
 - **10 diverse themes** covering kindness, imagination, friendship, courage, identity, and adventure.
-- **Optional story spark**: Parents/kids can give a hint ("loves dinosaurs") to steer the story without breaking the structure.
+- **Continuity rules**: Each page flows from the one before — the story reads as one coherent arc, not isolated scenes.
 - **Variable page count (6–10)**: More pages = longer story and longer narration.
 
 ---

app.py

@@ -419,21 +419,22 @@ Rules:
 
 
 def build_story_prompt(hero_name: str, theme: str, age: int,
-                       num_pages: int = 6, story_idea: str = "") -> str:
+                       num_pages: int = 6) -> str:
     mid = num_pages - 2
-    spark_line = (f"\n- Story spark from the child: {story_idea.strip()}" if story_idea and story_idea.strip() else "")
     return f"""{FEW_SHOT_EXEMPLAR}
 
 Write a {num_pages}-page children's storybook for age {age} about {hero_name} with theme: {theme}.
 
 Rules:
 - {hero_name} must appear by name in EVERY page text. Every single page.
-- Keep all characters consistent — do NOT introduce random new characters after page 3.
+- Keep all characters consistent — do NOT introduce new characters after page 3.
 - Each page: 2–3 vivid, emotionally warm sentences a {age}-year-old can follow and feel.
-- Use sensory details — colours, sounds, textures, emotions — to bring each moment alive.
-- Pages 1–2 introduce {hero_name} and the challenge. Pages 3–{mid} deepen the adventure. Pages {mid+1}–{num_pages} resolve it and teach.
-- Page {num_pages} ends with a clear, warm lesson {hero_name} has learned and a feeling of pride or joy.
-- Scene describes exactly what would appear in ONE illustration.{spark_line}
+- Use sensory details — colours, sounds, textures, feelings — to bring each moment alive.
+- The story is ONE continuous narrative: each page flows naturally from the one before it. Page N+1 begins where page N ended.
+- Pages 1–2 introduce {hero_name} and the problem clearly. Pages 3–{mid} build the challenge step by step. Pages {mid+1}–{num_pages} resolve it and teach a lesson.
+- Page {num_pages} must end with a clear, warm moral using "{hero_name} had learned" or "{hero_name} now understood" or "{hero_name} discovered that". Include a feeling of pride or joy.
+- Give {hero_name} ONE distinctive physical detail on page 1 and refer to it at least once more later.
+- Scene describes exactly what would appear in ONE simple illustration — one moment, one setting, one emotion.
 - Return ONLY valid JSON (no explanation, no markdown fences):
 """
 
@@ -583,11 +584,11 @@ def load_sample_book() -> str:
 
 @spaces.GPU(duration=90)
 def generate_story_gpu(hero_name: str, theme: str, age: int = 5,
-                       num_pages: int = 6, story_idea: str = "") -> dict:
+                       num_pages: int = 6) -> dict:
     """Generate a story on ZeroGPU, falling back to a deterministic local story."""
     try:
         model, tok = load_story()
-        prompt = build_story_prompt(hero_name, theme, age, num_pages, story_idea)
+        prompt = build_story_prompt(hero_name, theme, age, num_pages)
         inputs = tok.apply_chat_template(
             [{"role": "user", "content": prompt}],
             add_generation_prompt=True,
@@ -744,7 +745,7 @@ def generate_tts_gpu(text: str, voice: str = DEFAULT_VOICE,
 
 def create_book(doodle_image, character_name, theme, hero_name,
                 voice=DEFAULT_VOICE, make_coloring=False,
-                num_pages=6, story_idea=None, custom_voice_wav=None):
+                num_pages=6, custom_voice_wav=None):
     """ZeroGPU book flow: story → images → narration → PDFs → coloring book,
     each a sequential @spaces.GPU call (ZeroGPU has one GPU per request)."""
     t_total = time.perf_counter()
@@ -777,8 +778,7 @@ def create_book(doodle_image, character_name, theme, hero_name,
 
     t_story = time.perf_counter()
     try:
-        story = generate_story_gpu(hero_name, theme, num_pages=num_pages,
-                                   story_idea=story_idea or "")
+        story = generate_story_gpu(hero_name, theme, num_pages=num_pages)
     except Exception as e:
         logger.error(f"Story generation failed: {e}")
         yield (
@@ -817,9 +817,6 @@ def create_book(doodle_image, character_name, theme, hero_name,
 
     full_text = f"{title}. {' '.join(page_texts)}"
 
-    # ---- NARRATION starts NOW, in PARALLEL with the images (it only needs the
-    #      story text). The audio is surfaced the moment it's ready — usually
-    #      before the illustrations finish — so narration appears first. ----
     import threading
     voice_box = {}
     t_tts = time.perf_counter()
@@ -833,9 +830,6 @@ def create_book(doodle_image, character_name, theme, hero_name,
         except Exception as e:
             voice_box["err"] = e
 
-    voice_thread = threading.Thread(target=_do_voice, daemon=True)
-    voice_thread.start()
-
     def _audio_now():
         """Write the narration to a temp wav once it's ready; return its path."""
         if voice_box.get("bytes") and not voice_box.get("path"):
@@ -847,7 +841,18 @@ def create_book(doodle_image, character_name, theme, hero_name,
                 logger.warning(f"writing audio failed: {e}")
         return voice_box.get("path")
 
-    # ---- IMAGES (FLUX on ZeroGPU), surfacing the narration as soon as it lands ----
+    # Preset voices are fast (~20-40s): run narration parallel with FLUX images so
+    # audio appears first. Voice cloning is slow (~90-120s) and calling two
+    # @spaces.GPU functions concurrently from threads causes ZeroGPU to freeze the
+    # browser — so for "my_voice" we run TTS sequentially AFTER images complete.
+    run_tts_parallel = (voice != "my_voice")
+    if run_tts_parallel:
+        voice_thread = threading.Thread(target=_do_voice, daemon=True)
+        voice_thread.start()
+    else:
+        voice_thread = None
+
+    # ---- IMAGES (FLUX on ZeroGPU) ----
     img_bytes, engine, images = None, "sketch", None
     t_images = time.perf_counter()
     try:
@@ -855,9 +860,12 @@ def create_book(doodle_image, character_name, theme, hero_name,
             lambda: generate_images_gpu(char_desc, scenes, doodle_bytes, BASE_SEED),
             lambda s: (
                 magic_loader_html("images", hero_name),
-                f"{title} — illustrating… {s}s"
-                + ("  ·  narration ready ▶" if _audio_now() else "  ·  recording narration…"),
-                _audio_now(), _keep, story, "", json.dumps(trace_data, indent=2), _no, _keep,
+                f"{title} — illustrating… {s}s" + (
+                    ("  ·  narration ready ▶" if _audio_now() else "  ·  recording narration…")
+                    if run_tts_parallel else "  ·  voice cloning after illustrations"
+                ),
+                _audio_now() if run_tts_parallel else None,
+                _keep, story, "", json.dumps(trace_data, indent=2), _no, _keep,
             ),
         ):
             if kind == "hb":
@@ -882,13 +890,20 @@ def create_book(doodle_image, character_name, theme, hero_name,
 
     book_html = build_book_html(img_bytes, page_texts, title, engine)
 
-    # ---- collect the parallel narration (usually already finished) ----
-    while voice_thread.is_alive():
-        voice_thread.join(timeout=4)
-        if voice_thread.is_alive():
-            yield (book_html, f"{title} — finishing narration…",
-                   _audio_now(), _keep, story, "", json.dumps(trace_data, indent=2),
-                   _no, _keep)
+    # ---- collect / run narration ----
+    if not run_tts_parallel:
+        # Voice cloning runs sequentially now that FLUX images are done
+        yield (book_html, f"{title} — cloning your voice…",
+               None, _keep, story, "", json.dumps(trace_data, indent=2), _no, _keep)
+        _do_voice()
+    else:
+        # Preset voice ran parallel — wait for it to finish (usually already done)
+        while voice_thread.is_alive():
+            voice_thread.join(timeout=4)
+            if voice_thread.is_alive():
+                yield (book_html, f"{title} — finishing narration…",
+                       _audio_now(), _keep, story, "", json.dumps(trace_data, indent=2),
+                       _no, _keep)
     audio_path = _audio_now()
     if voice_box.get("err"):
         logger.warning(f"TTS failed: {voice_box['err']}")

book_builder.py

@@ -42,7 +42,8 @@ PAGE_HTML = """
 
 COVER_HTML = """
 <div class="book-cover">
-  <p class="cover-kicker">a DoodleBook story</p>
+  <p class="cover-kicker">✨ a DoodleBook story ✨</p>
+  {cover_art}
   <h2 class="cover-title">{title}</h2>
   {badge}
 </div>
@@ -62,7 +63,14 @@ def build_book_html(
 ) -> str:
     """Build storybook HTML from images and texts."""
     badge = ENGINE_BADGES.get(engine, "")
-    cover = COVER_HTML.format(title=title, badge=badge)
+    cover_art = ""
+    if pages_images:
+        cover_art = (
+            f'<div class="cover-art">'
+            f'<img src="{_img_src_for_bytes(pages_images[0])}" alt="Cover illustration"/>'
+            f'</div>'
+        )
+    cover = COVER_HTML.format(title=title, badge=badge, cover_art=cover_art)
 
     pages_html = ""
     for i, (img_bytes, text) in enumerate(zip(pages_images, pages_texts)):

ui/layout.py

@@ -321,15 +321,22 @@ body, gradio-app {
   text-shadow: 2px 2px 0 var(--crayon-sun);
 }
 .book-cover {
-  text-align: center; padding: 34px 22px 30px; margin: 10px auto 26px;
-  background: radial-gradient(circle at 30% 20%, rgba(244,198,74,.25), transparent 55%), #fff8e6;
+  text-align: center; padding: 28px 22px 26px; margin: 10px auto 26px;
+  background: radial-gradient(circle at 30% 20%, rgba(244,198,74,.25), transparent 55%),
+              radial-gradient(circle at 75% 80%, rgba(214,81,122,.12), transparent 50%), #fff8e6;
   border-radius: 18px; box-shadow: 0 12px 28px rgba(46,42,38,.16); transform: rotate(-1deg);
 }
-.book-cover .cover-kicker { font-family: 'Caveat', cursive; font-size: 22px; color: var(--crayon-berry); }
+.book-cover .cover-kicker { font-family: 'Caveat', cursive; font-size: 22px; color: var(--crayon-berry); margin-bottom: 10px; }
+.cover-art {
+  margin: 14px auto 16px; max-width: 420px; border-radius: 14px; overflow: hidden;
+  box-shadow: 0 6px 18px rgba(46,42,38,.18), 0 0 0 4px var(--crayon-sun), 0 0 0 7px var(--ink);
+  transform: rotate(0.8deg);
+}
+.cover-art img { display: block; width: 100%; }
 .book-cover .cover-title {
   font-family: 'Gaegu', cursive; font-weight: 700;
-  font-size: clamp(34px, 5vw, 52px); color: var(--ink); margin: 4px 0 2px;
-  text-shadow: 2px 2px 0 var(--crayon-sun);
+  font-size: clamp(28px, 4.5vw, 48px); color: var(--ink); margin: 12px 0 4px;
+  text-shadow: 3px 3px 0 var(--crayon-sun), -1px -1px 0 rgba(255,255,255,.6);
 }
 .book-page {
   position: relative; background: #fffdf6; border-radius: 14px;
@@ -524,12 +531,6 @@ def create_layout(load_sample_fn=None, create_book_fn=None):
                     label="Story theme (pick one)",
                     elem_classes=["field", "theme-pick"],
                 )
-                story_idea = gr.Textbox(
-                    label="Story spark (optional)",
-                    placeholder="e.g. 'loves dinosaurs', 'wants to fly', 'learns to share'",
-                    max_lines=2,
-                    elem_classes=["field"],
-                )
                 num_pages = gr.Slider(
                     minimum=6, maximum=10, step=1, value=6,
                     label="Number of pages",
@@ -561,13 +562,6 @@ def create_layout(load_sample_fn=None, create_book_fn=None):
                     elem_classes=["status-display"],
                     value="Ready when you are! ✏️",
                 )
-                with gr.Row(elem_classes=["download-row"]):
-                    pdf_download = gr.DownloadButton(
-                        "⬇ Story PDF", visible=False, elem_classes=["btn-pdf"],
-                    )
-                    coloring_pdf_download = gr.DownloadButton(
-                        "⬇ Coloring PDF", visible=False, elem_classes=["btn-pdf"],
-                    )
                 gr.Examples(
                     examples=[["assets/sample_doodle.jpg", "Ziggy", "Ziggy", "brave adventure"]],
                     inputs=[doodle, char_name, hero_name, theme],
@@ -581,6 +575,13 @@ def create_layout(load_sample_fn=None, create_book_fn=None):
                     autoplay=False,
                     elem_classes=["audio-player"],
                 )
+                with gr.Row(elem_classes=["download-row"]):
+                    pdf_download = gr.DownloadButton(
+                        "⬇ Story PDF", visible=False, elem_classes=["btn-pdf"],
+                    )
+                    coloring_pdf_download = gr.DownloadButton(
+                        "⬇ Coloring PDF", visible=False, elem_classes=["btn-pdf"],
+                    )
                 book_display = gr.HTML(
                     elem_classes=["book-stage"],
                     value="""
@@ -638,7 +639,7 @@ def create_layout(load_sample_fn=None, create_book_fn=None):
             make_btn.click(
                 fn=create_book_fn,
                 inputs=[doodle, char_name, theme, hero_name, voice, make_coloring,
-                        num_pages, story_idea, custom_voice_audio],
+                        num_pages, custom_voice_audio],
                 outputs=[book_display, status, audio_narration, pdf_download,
                          story_info, image_info, trace_info,
                          coloring_display, coloring_pdf_download],