Histórias da Lêda | Editorial and Commercial Platform
Platform created for a historian to publish texts, sell books, and build a direct relationship with readers.
My role: Product Design · UI Design · CMS Architecture · AI-assisted Development
Stack: Lovable · React/Vite · Sanity · Brevo · Nuvemshop · GitHub · Vercel
Context and problem
Maria Lêda is a historian, researcher, and writer with a body of work connected to modern history, colonial Brazil, and the editing of historical texts. She needed to rebuild her public digital presence through a space that could bring together her trajectory, texts, books, and a relationship channel with readers — without depending on a developer to maintain content day to day.
The project was designed as an ecosystem because the client had needs that could not fit into a single tool: editorial presence, autonomous content management, reader relationships, and book sales.
Strategy
The central decision was to separate visual creation from day-to-day operations: the author does not need to touch the layout to publish a text, register a book, or upload material. Each layer solves a specific responsibility. Sanity turns content management into understandable forms; Brevo organizes newsletter and leads; Nuvemshop handles the commercial layer; and GitHub + Vercel support deployment and maintenance.
Usuário
historiasdaleda.com
React / Vite — Lovable + manual code
Sanity CMS
Posts, books,
files
Schemas
post · book ·
archive
Brevo
Newsletter, leads
Fluxos
Notebook · Contact
· Newsletter
Nuvemshop
shop, checkout
GitHub + Vercel
Continuous deployment
Observability
Vercel Analytics
+ Clarity
Conversion events
click_buy · submit_notebook ·
click_nuvemshop
Decisions that shaped the project
Nuvemshop as a separate commercial layer — due to budget constraints, not brand philosophy.
Integrating an e-commerce platform directly into the website would require costs that exceeded the client’s budget. Nuvemshop entered as a viable free solution, and I designed the connection between the two environments to minimize friction: clear CTAs on the website guide the user to the purchase flow without making the transition feel like a patch.
Sanity schemas designed for the person using them, not for the person building them.
Commercial layer — Catalog, cart, and checkout.
Sanity schemas designed for the people using them, not for the people building them.
I modeled the content types based on the client’s reality: an author with little technical familiarity who needs to publish texts, register books, upload PDFs, and update purchase links without touching code. Each schema became a form with clearly named fields, organized in the order that makes sense for filling them out.
Brevo as an editorial relationship layer.
In addition to publishing content, the project needed a direct channel between the author and her readers. For this, I integrated Brevo as a relationship layer: lead capture, newsletter, contact form, and segmentation by source (Caderno de Arquivos, newsletter, contact, or interest in services), allowing the author to build her own reader base.
I also extended the visual identity to email marketing, creating an editorial newsletter template in Figma aligned with the website, with blocks for featured texts, books, Caderno de Arquivos, and business calls-to-action — turning the newsletter into another brand touchpoint, rather than a generic email.
The palette existed; the visual system did not.
The logo was created by Taciana Moraes. The color palette was defined together with the client. The complete visual identity is being developed in parallel. To avoid blocking the website delivery, I worked from the elements already agreed upon and solved gaps as the project evolved: green-toned tags, a wax seal with the letter “L” for the Caderno de Arquivos, and the cobogó pattern from the logo extended as the website’s background grid.
AI with technical control, not replacement.
I used Lovable to accelerate the initial generation of the interface, but kept the project versioned on GitHub and published on Vercel. Throughout the project, I made direct code interventions for decisions Lovable should not make alone: environment variable organization, integration of the contact form with the Brevo API, removal of hardcoded fake content from the Home page, and connection of post previews to the real CMS.
Result
Published and functional editorial website, with CMS configured for posts, books, Caderno de Arquivos, press, and História Portátil. Newsletter and lead capture integrated with Brevo. Operational contact form. Commercial layer through Nuvemshop for book and product sales. Continuous deployment via GitHub and Vercel. Observability installed with events mapped to real conversion actions. The client has autonomy to update content without depending on a developer.
Next steps
The project is published and operational. The next phase is about maturation: real content, commercial setup, and usage tracking.
Observability in progress. Vercel Analytics is already enabled and collecting traffic data. Microsoft Clarity will be added through an environment variable, loading only in production and tracking the conversion events that matter: accessing the Archive Notebook, clicking to buy a book, and leaving the site for the Nuvemshop checkout. Once Clarity, Vercel Analytics, and Nuvemshop’s native metrics are active, the full funnel will be visible — from editorial behavior to commercial conversion.
Content and operations. The next step is to publish the author’s first real posts, register the final books and products in Nuvemshop, upload the real Archive Notebook materials, connect the official domain historiasdaleda.com.br, and configure the institutional email. historiasdaleda.com.br.
Relationship The first Brevo campaigns will be created after the content is in place. From there, lead sources, newsletter signups, and CTA performance can be monitored and refined using real usage data.
What I learned
AI accelerates delivery, but it does not replace product judgment. Lovable helped shorten the build process, but the architecture, CMS modeling, tool choices, integration decisions, and conversion tracking came from strategic design thinking. This project also reinforced that budget constraints are not a reason to lower the quality of the solution. They are design constraints. The work is to find a structure that respects the client’s limits while still creating something coherent, maintainable, and useful.
