Revolutionize News Reading with Image-First UI Design in StitchRevolutionize News Reading with Image-First UI Design in Stitch
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Project name: "Visual News" — an image-first news reader designed entirely in Stitch
I built a news-reading app prototype where every screen leads with imagery instead of text walls. The idea: today's news apps drown readers in text and headlines until they stop feeling anything about what they're reading. Visual News flips that — when you tap a category (Tech, Politics, Culture, Sports…), you roll into a full-bleed image carousel of the top stories in that category, with the headline and source overlaid. A profile page lets you tune your categories and save stories for later.
The whole UI — landing, category cards, story-reading screens, profile, transitions — was designed in Google Stitch from prompts. I originally planned to wire the front-end in code first and design later, but Stitch's streaming generation let me see screens form in real time as I prompted them, so the design pass happened before the build pass — which is the opposite of how I usually work, and faster.

🛠 How I used Stitch
Started from a single prompt describing the app concept ("image-first news reader, four core screens, dark theme") — Stitch streamed the layout into the canvas live, which made it easy to course-correct mid-generation.
Iterated screen-by-screen using in-place AI edits — instead of regenerating an entire screen, I'd click an element and ask Stitch to change just that part (e.g., "make the category cards larger and add a soft gradient overlay on each").
Used Stitch's HTML-native canvas to preview motion — the category-tap-to-story transition is a real interaction inside Stitch, not a static mockup. That alone replaced a separate Figma → Principle → Lottie pipeline I would have done before.
Skipped Figma entirely. Stitch generated the wireframes, the polish, and the prototype interactions in one tool. No file export, no plugin chain.

💬 Feedback on Stitch
What worked beautifully:
Streaming generation is the single biggest UX win — watching screens form lets you stop the generation mid-way and refine the prompt, which saves a full regenerate cycle.
In-place AI edits felt closer to "natural design conversation" than any Figma plugin I've tried. I could point at an element and describe what I wanted differently without explaining the entire screen again.
Generated imagery is genuinely good — for a visual-first concept like Visual News, the image quality is the difference between "this is a wireframe" and "this looks like a real product."
What I'd want next:
A timeline/history of generations on a single canvas (so I can revert to "version 3 of this screen" easily).
More control over typography choices (current selection feels safe-but-similar across generations).
A way to lock specific elements before regenerating the rest of a screen.
The headline takeaway: Stitch removed Figma from my workflow for this kind of project. I came in expecting a "design assistant" — I left thinking it's an actual Figma replacement for early-stage product design.
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started