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
Back to feedPost
PocketBook is a mobile reading and audiobook app that lets users organize books, add them through ISBN scanning, and generate audiobooks. It features a bookshelf-inspired design, customizable themes, and a dedicated audio listening experience.
I used Stitch as the starting point for the entire design process. First, I created a detailed design.md document describing the app's requirements, visual style, and user experience goals. After uploading it to Stitch, I used the generated design system and layout concepts as a foundation for the project. I iterated on the designs using additional bookshelf-inspired references, refined screens such as the home page, book details page, audiobook generation flow, and audio narration page, and explored different visual directions until I reached the final design. Once the UI was finalized, I exported the design references and assets and used them in Antigravity IDE to build the Flutter application, adding functionality, interactions, and animations to create the final working product.
Professional-grade work if I’ve ever seen it.
The bookshelf inspired direction came out really nice. I also found Stitch works best when you keep iterating instead of taking the first output as final. How close was your final app to the initial generation?
Here's what I ended up building:
https://on.contra.com/pnfJBQ
Happy to get your feedback as well.
on.contra.com
Introducing Voya: Revolutionize Your Travel Planning Experience
Connect with next-gen talent and tools to get work underway. Hire more independents. Start more projects. Get more creative.
This is professional-grade perfection! Ready for the big leagues. 💼🌍
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
Related posts
Project Title:
Actual Facts · Observatory Dashboard 🔭
Short Written Description:
An interactive, high-frequency mathematical observation cockpit that visualizes celestial and physics data profiles in real time. Rooted in foundational mathematical study, it balances historic planetary analytics with a live linear tracking simulation comparing the Speed of Light, Earth’s Rotation, and the Speed of Sound on shared relative scales complete with dynamic Web Audio acoustic synthesis and an animated cosmic background engine.
Explanation of Stitch Workflow:
Google Stitch served as the core creative and architectural foundation. Using Stitch’s newly launched AI Design-to-Code Pipeline, I built the complete Tactical Telemetry UI Standard — including the glassmorphic card matrix with --cyan and --gold design tokens, the persistent Analytics Dock, canvas engine containers for the starfield and orrery systems, and the interactive modal reveal components. Stitch also guided the Starfield Warp Response and Relativistic Orrery Sync behaviors, establishing how UI elements connect to the background rendering engines. This scaffolding was then exported to Replit where advanced physics calculation loops, high-frequency velocity simulation, Web Audio API synthesis, and live hosting were layered on top. The result was a true hybrid pipeline Stitch as design intelligence, Replit as execution environment.
Feedback on Experience:
Stitch was remarkably smooth for the initial creative phase spinning up UI layouts, establishing design tokens, and visualizing component interactions before entering a heavy deployment environment. The AI Design-to-Code Pipeline specifically accelerated decisions that would normally take hours of manual CSS iteration. For future iterations, deeper direct integration hooks with cloud environments like Replit would be a game changer a seamless one-click push from Stitch’s front-end scaffolding straight into a live server would complete the pipeline and make Stitch an end-to-end production tool.
Walkthrough Video Attached Below
Really like this, the real time physics + cosmic visualization idea feels very unique and experimental. The blend of math + motion + sound is strong.
View my entry for this challenge
https://on.contra.com/pnfJBQ
Curious what you think about it.
on.contra.com
Introducing Voya: Revolutionize Your Travel Planning Experience
Connect with next-gen talent and tools to get work underway. Hire more independents. Start more projects. Get more creative.
Easily one of the most creative entries I’ve come across.
SimpleRent - Contra Submission Post
Google Stitch Challenge Entry
PROJECT LINK
PROJECT TITLE
SimpleRent - Student Rental Platform for Sri Lanka
Every year, university students in Sri Lanka leave their hometowns to study in Colombo. They arrive with no local knowledge and no housing plan. No platform was built specifically for them.
SimpleRent is a student-first rental interface that solves two linked problems in one product: find a safe rental near your campus or find a compatible roommate to share the cost.
Google Maps-centered property search, NIC verification flow, roommate board, landlord dashboard, multi-step onboarding, messaging interface, and more - entirely designed and iterated inside Google Stitch.
HOW I USED STITCH
Before generating a single screen, I designed my own logo - a map pin housing a rooftop icon - and imported it into Stitch to generate a design.md brand file. Stitch scanned the logo and produced a complete design system: color palette, typography, card radius, shadow depth, and spacing. Every screen inherited that system automatically from the start.
Each of the 18 screens was then streamed live to the canvas - letting me review and plan refinements on one screen while the next was still being generated.
Once screens were on the canvas, I used Stitch's in-place AI edit feature to refine specific elements without regenerating anything. I clicked directly on a footer, typed a prompt, and only the footer changed. Same for card layouts, button colors, and badge styling - precise, targeted iteration on exactly the element I chose.
For motion, I used Stitch's native HTML canvas to build the NIC verification animation: the ID card shakes first as a visual cue, then flips smoothly on double-click. Property cards lift and shadow on hover. Because Stitch renders native HTML by default, every animation played in real time directly on the canvas as I built it.
For the code pipeline, I used Stitch's MCP connection to import Antigravity. Antigravity handled the code-side refinements - the logic and structure that go beyond what a visual canvas touches. Stitch for design. Antigravity for code. A full design-to-code pipeline, linked through MCP.
FEEDBACK ON STITCH
The real-time streaming canvas changed how I design. You stop waiting for a result and start collaborating with it - refining the previous screen while the next one is still being generated. That shift alone made the process feel genuinely different from any other tool I have used.
The in-place edit feature removed the biggest frustration of AI design tools: the fear of regenerating something good just to fix something small. Clicking directly on an element and prompting only that element to change is the kind of control that makes iteration feel safe.
The MCP integration with Antigravity was the unexpected part. It bridges the gap between a design prototype and a real codebase in a way I did not expect from a design tool.
Stitch did not just speed up how I work. It improved the ideas I had while I was working.
This is the gold standard right here! Absolutely spectacular.
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
portfolioreview
The best portfolios tell a story, not just show a grid. Share yours for feedback.
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?