Second Chapter: Cinematic Website Design for Podcast by Xheni TrebickaSecond Chapter: Cinematic Website Design for Podcast by Xheni Trebicka

Second Chapter: Cinematic Website Design for Podcast

View completed worksecond-chapter.framer.website
Second Chapter: a cinematic website for a podcast about life after prison
Second Chapter is a concept website for a weekly interview podcast about reentry, redemption, and second chances. The goal was to design a site that feels as honest and human as the conversations themselves: no true-crime clichés, no prison bars, just real faces, warm light, and room for every story to breathe.
A quick walkthrough of the live site: the cinematic home page, the episode archive, episode pages, mobile layouts, and the design system, all built and animated natively in Framer.
The home page The latest episode opens the site like a film poster: a full-bleed portrait, a bold Anton headline, and a pulsing Ember play button. Below it, the page tells the show’s story with a manifesto, featured episodes, an auto-scrolling ticker of guest quotes, listening platforms, and a newsletter signup.
Fully responsive Every page has a custom layout for desktop, tablet, and phone, not just a scaled-down version. Grids reflow, the navigation turns into a full-screen menu, and type sizes adapt at each breakpoint.
Built on Framer CMS The site runs on 5 linked collections: Episodes, Guests, Topics, Courses, and Products. Listeners can filter the archive by topic with animated tabs. Each episode gets its own page with a player, show notes, a sticky guest card, newer/older navigation, and related episodes. The host can publish a new episode without touching the design.
Designed for the phone first Most podcast listeners arrive on mobile, so every interaction was designed for touch first: a full-screen navigation drawer, swipeable topic filters, large tap targets, and a single-column reading flow.
More than a player The site turns listeners into a community. The Host page tells his story through a timeline. Learn offers short self-paced courses and printable guides. Shop is a merch preview where profits support a reentry fund, with original product mockups designed in-house. Be a guest has a story submission form and an FAQ for future guests.
Design system A dark, cinematic palette with a single warm accent: Ember, the colour of first light, a quiet metaphor for a new beginning. Anton carries bold headlines, and Instrument Serif Italic carries the guests’ own words. An original “II” seal (chapter two) ties together the logo, favicon, and merch. Everything is built from reusable styles and components: navigation, buttons, episode cards, filter tabs, an FAQ accordion, and form buttons with loading, success, and error states.
A complete, scalable platform for a podcast that wants more than a link-in-bio: one place to listen, learn, support, and get involved. All names, people, and content are fictional, and all photography is free to use.

0 likes · 2 views · Nov 8, 2026

Designed and built a cinematic podcast website in Framer, with a CMS-powered episode archive, guest stories, and full mobile layouts.