lingo-bridge / README.md
Iona401's picture
Fix submission tags to achievement:* scheme; add field notes; refresh demo media
651983e verified
|
Raw
History Blame Contribute Delete
6.18 kB
metadata
title: Lingo Bridge
emoji: πŸŒ‰
colorFrom: purple
colorTo: indigo
sdk: docker
app_port: 7860
pinned: true
license: apache-2.0
short_description: Watch & hear a sentence gradually become another language.
tags:
  - track:wood
  - sponsor:openbmb
  - sponsor:modal
  - achievement:offbrand
  - achievement:llama
  - achievement:tinytitan
  - achievement:fieldnotes
  - minicpm
  - small-models
  - translation
  - tts

πŸŒ‰ Lingo Bridge

Watch and hear a sentence gradually become another language β€” phrase by phrase, layer by layer.

Most translators show you a destination. Lingo Bridge shows you the journey. One sentence becomes a seven-stage transformation from the source language to the target β€” meaning crosses first, then actions, then time words, then grammar glue, and finally the word order rearranges into something natural β€” rendered as an interactive 3D card stack and spoken aloud at every stage. A language toy, not a translator.

🎬 Demo

β–Ά Demo video Β· πŸ“£ Social posts: X/Twitter Β· Bluesky

Lingo Bridge

πŸ’‘ The idea & tech (write-up)

A single structured call to a small text model (Qwen3-4B-Instruct, via llama.cpp) decomposes the sentence into aligned phrase units {source, target, type, order_target}. The seven progressive layers, the purple→cyan colours, and the phrase-to-phrase links are then built deterministically in Python — so the JSON stays simple and every link is valid by construction. Phrases flip to the target language by type (so each layer is one coherent move, never random words), and word order migrates near the end, producing crossing ribbons. Each layer is spoken by OpenBMB VoxCPM2 (a TTS model built on the MiniCPM-4 backbone, 30 languages). The UI is a fully custom Three.js card stack mounted inside a Gradio Space; the GPU models run on Modal (scale-to-zero), with the demo examples pre-rendered (layers + audio) so they play instantly.

🧠 Models β€” each well under the 32B cap

Role Model Size Runtime
Text (decompose + align) Qwen/Qwen3-4B-Instruct-2507 (Q4_K_M GGUF) 4B llama.cpp
Speech (per-layer TTS) openbmb/VoxCPM2 β€” built on MiniCPM-4 2B voxcpm (GPU)

🌍 Languages (10)

English Β· Spanish Β· French Β· Italian Β· Portuguese Β· German Β· Russian Β· Japanese Β· Korean Β· Chinese β€” any pair, either direction.

πŸ† What we're entered for

  • Track β€” Thousand Token Wood (a delightful, AI-native language toy).
  • 🎨 Off Brand (achievement:offbrand) β€” a fully custom Three.js UI, far past the default Gradio look, mounted via gr.mount_gradio_app.
  • πŸ¦™ Llama Champion (achievement:llama) β€” the text model (Qwen3-4B) runs through the llama.cpp runtime.
  • 🐜 Tiny Titan (achievement:tinytitan) β€” every model is ≀4B (Qwen3-4B + VoxCPM2 2B).
  • πŸ““ Field Notes (achievement:fieldnotes) β€” see What I learned below.
  • 🎬 Best Demo β€” app + demo video + social post.
  • πŸ… Bonus Quest Champion β€” multiple bonus criteria met.
  • OpenBMB Β· Best MiniCPM Build β€” speech by VoxCPM2 (MiniCPM-4 backbone).
  • Modal Β· Best Use of Modal β€” Qwen3-4B + VoxCPM2 run on Modal (L4, scale-to-zero); see Architecture.

πŸ““ What I learned (field notes)

  • Push structure into Python, not the prompt. Asking the LLM for the full 7-layer graph produced broken links. Asking for one thing β€” aligned phrase units {source, target, type, order_target} β€” and building the layers deterministically in Python made every link valid by construction. The model does the part only a model can; code does the rest.
  • Small genuinely won on latency. Qwen3-4B nailed the decomposition across all 10 languages. I tried NVIDIA's Nemotron-9B-v2 for a sponsor prize, but its hybrid-Mamba decode took >120s for a single interactive translation β€” unusable for a toy. The 4B model was both good enough and fast enough.
  • VoxCPM2 reads mixed-language text directly. No language tag needed, which is exactly what the hybrid intermediate layers (half source, half target) require β€” a per-language TTS would have choked on them. Reusing one anchor clip kept the narrator voice consistent across layers.
  • Thin Space + Modal GPU is the right split. A free CPU Space serving the custom UI and proxying model calls to a scale-to-zero Modal L4 keeps the Space light and the GPU cheap, while pre-rendering the demo examples (layers and audio) makes the toy feel instant even on a cold backend.

πŸ—οΈ Architecture

A thin Gradio Space (free CPU) serves the custom UI and proxies model calls to a Modal L4 GPU that runs Qwen3-4B (llama.cpp) + VoxCPM2. The Space stays light and the GPU scales to zero. The 🎲 Surprise me examples are pre-rendered (layers and VoxCPM2 audio baked in), so the demo is instant even on a cold backend.

▢️ Run / deploy

# GPU backend on Modal (Qwen3-4B + VoxCPM2):
modal run modal_app.py::download_models && modal deploy modal_app.py
# Local (no GPU) β€” proxy everything to the Modal backend, no model loads locally:
LINGO_REMOTE_URL=https://uiharu-kazari--lingo-bridge-web.modal.run \
TTS_ENGINE=remote LINGO_TTS_REMOTE_URL=https://uiharu-kazari--lingo-bridge-web.modal.run \
python3 app.py

βœ… Entry checklist

  • REQ-01 ≀32B/model β€” Qwen3-4B + VoxCPM2 (2B). βœ“
  • REQ-02 Gradio Space in the org β€” Docker Space build-small-hackathon/lingo-bridge. βœ“
  • REQ-03 Demo video β€” docs/demo.mp4. βœ“
  • REQ-04 Social post β€” X Β· Bluesky. βœ“
  • REQ-05 ZeroGPU limit β€” n/a (GPU on Modal, not ZeroGPU). βœ“
  • REQ-06 README tags + write-up β€” above. βœ“