Heridas que se convirtieron en alas · Web design
A sales page for the book Heridas que se convirtieron en alas
The website for Ricardo Madrid Mendoza’s book. It walks the reader from arrival to choosing an edition. It was designed with Google Stitch and built with Gemini. The site is in Spanish.
Visit the live site- Heridas que se convirtieron en alas.Get a digital copy · I want a print copy
- Read a free excerpt (Chapter 1)
- Digital edition · Print edition
The problem it solves
A book needs a place of its own where readers understand what it’s about, trust the author and can buy it. The page orders that decision from top to bottom: who it’s for, what they’ll find, who wrote it, what other readers think and how to get it.
What it automates
It automates selling the book. The page presents the work, lets visitors read an excerpt, answers common questions and leads the reader to the edition they want, at any hour and without the author handling each inquiry.
How a reader uses it
Arrives and gets what it’s about
The headline, one sentence and three clear paths: digital copy, print copy or read an excerpt.
Recognizes themselves
The “Who is this book for?” section describes three situations so readers can tell if it’s their case.
Tries before paying
Reads an excerpt from the first chapter for free.
Trusts
Meets the author and reads reviews from other readers, with name and title.
Picks an edition
Compares digital and print: price, formats and what each one includes.
Gets answers and buys
The FAQs cover delivery, shipping and the guarantee, and a final call to action leads to the purchase.
How it’s built
- 01
Sales structure
First we defined the reader’s journey: problem, proposal, author, proof and offer.
- 02
Design with Stitch
The interface was designed with Google Stitch: you describe the page and the tool proposes the screens, which are refined until the style is right.
- 03
Code with Gemini
The design became React components in Google AI Studio, with Tailwind CSS and entrance animations.
- 04
Publishing
Built with Vite and published on Vercel with its own domain.
AI models
- Google Stitch
- Generates the screen designs from a description.
- Gemini
- Writes the site’s code in Google AI Studio.
Technologies
- Stitch (Google)
- Google AI Studio
- React
- TypeScript
- Vite
- Tailwind CSS
- Motion
- Vercel
From this project to your operation
What it means for your company
We do the same work for a product, a service or a launch: a clear, fast page designed so the visitor takes the next step.
Book a free call
30 minutes, no commitment. We send your proposal within 48 hours.