Ecos da Memória · Editorial landing page
Ecos da Memória: A Landing Page for Fifteen Voices
From gathering the material to presenting the book and the path to support
I structured and built the landing page for Ecos da Memória, an anthology of fifteen stories by fifteen authors. I organized the supplied material into an editorial experience introducing the book, its contributors, and the path to its Catarse campaign.
Explore the screens§ 01
Context
Ecos da Memória brings together fifteen short stories by participants in Oficina de Contos, connected by the theme of memory. The landing page introduces the collective project and directs interested visitors to its crowdfunding campaign on Catarse.
Gathering the authors' materials took the most work. Using the supplied text, photos, cover, and icons, I organized a sequence for discovering the book, exploring the contributions, and understanding how to support it.
§ 02
UX/UI decisions
01Bring the book's identity into the interface
I used navy, cobalt, cream text, and serif typography to apply the publication's identity to the page. In the opening, the large title repeats in the background, echoing the book's name.
The book mockup appears later, alongside the anthology introduction. The cover was supplied ready-made.
The book identity applied to the page. The cover was supplied ready-made. - 02
Give the contributions a shared structure
I organized the stories into cards with a number, title, author, theme, and synopsis. The structure repeats while each contribution keeps its own text and visual motifs.
This pattern brings material from fifteen people together on one page. Each story synopsis remains credited to its author.
A shared structure for the contributions. The capture shows the start of the grid, not all fifteen stories. - 03
Let visitors choose what to read in more detail
Longer text has controls to expand and collapse it. The initial presentation stays shorter, and visitors can open the synopsis they want to explore.
The documented mobile state shows “Menos” (less) after expansion. Individual author introductions also expand when needed.
Expanded synopsis in mobile emulation, with the “Menos” (less) control visible. - 04
Give the writers their own space
I separated the author profiles from the story grid. Portrait, name, story, and introduction follow their own pattern, connected to each participant's contribution.
My work was to organize and apply this material to the interface. The photos and introductions were supplied; placing them in the composition does not transfer their authorship.
Individual introductions follow their own pattern. Photos and text were supplied for the landing page. - 05
Connect the presentation to the campaign
I placed paths to Catarse throughout the page and organized a support section into four steps. The content explains how to reach and use the campaign.
On smaller screens, a fixed bottom bar keeps the support action visible while reading. Financial contributions take place on the crowdfunding platform.
Guidance for supporting the Catarse campaign. The screen does not record a contribution or fundraising result. - 06
Rearrange the grids and text
The stories change from three columns on desktop to two on tablet and one on mobile. The author grid also changes its layout, reaching one column on narrow screens.
I adapted the space for images and expandable text, keeping titles, authorship, and the support action identifiable in the documented layouts.
The two-column grid in tablet emulation. Its order may differ from other recorded visits.
§ 03
AI-assisted development
I mainly used Lovable to build the landing page and bring the supplied material into a navigable experience.
- Editorial components
- The implementation brings together anchors, cards with expandable text, an FAQ, and campaign links.
- Execution
- Without an exact time count, I estimate that the accumulated work did not exceed about eight hours.
§ 04
SEO
I worked on the anthology's discovery structure, with metadata and organization tied to the book and its stories.
- Publication context
- A specific title and description, route-specific canonical URLs, heading hierarchy, and structured data for the book and stories.
- Discovery files
- Robots and sitemap files were available in the collection, alongside the page's presentation and sharing elements.
↳ This evidence describes the implementation. It does not establish indexing, traffic, support-link clicks, or funds raised.
§ 05
Screens
Version captured on October 23, 2026. Tablet and mobile use viewport emulation. Images may show visits with different story and author orders.
Desktop · 03
Tablet · 03
Mobile · 03
§ 06
Credits
Matheus Barros: landing page design, UX/UI, information organization, SEO, development, and deployment. Main copy: Caio. Individual introductions and story synopses: the respective authors.
The book cover, photographs, and icons were supplied ready-made. Matheus's literary contribution is separate from the website work presented in this case study.