Afterword

Afterword translates your physical bookshelf into a personalized digital taste profile, recommending movies, music, and podcasts based on the books you already own.

Reading the Room

Translating Taste & Designing for Trust

In a streaming-first world, the home bookshelf remains one of the last physical spaces where we actively put our taste on display. A bookshelf is rarely just a literal record of what someone has read. It is a deliberate, highly curated signal of what they want the world to know about them, offering a heightened level of insight into a person’s self-conception and identity.

Yet, our digital recommendation algorithms miss this rich, physical data completely, and most media recommendations remain locked in their respective medium silos. Your music taste doesn't talk to your favorite films, and neither talks to your bookshelf. Afterword was born from a specific challenge: How can we use frontier AI to extract this physical identity-signaling and map it into a cross-media digital profile?

Afterword is a proof-of-concept application that bridges the physical and digital creative worlds. By allowing a user to snap a photo of their physical bookshelf, the application uses multimodal vision capabilities to extract the titles, analyze the underlying thematic "DNA" of the collection, and dynamically map those tastes to surface highly targeted recommendations across books, films, music, and podcasts.

However, building for this audience introduces a fascinating product tension: the intersection of analog curation and digital privacy. Individuals who meticulously maintain physical libraries are often highly protective of their data and naturally wary of scanning their personal spaces into an AI system. Afterword was designed not just to map cross-media tastes, but to solve for this exact trust deficit, proving that frontier AI can interact with personal data securely, transparently, and respectfully.

Aesthetic Strategy
Aesthetic
Strategy

Designing for the "Bookish" User

To bridge this trust gap, the visual identity of the application had to feel inherently safe and familiar. I utilized advanced image prompting to generate a UI that is aesthetically warm, cozy, and humanistic.

By employing a hand-drawn, tactile visual language, Afterword avoids the sterile, hyper-futuristic UI typical of many AI wrappers. Every visual decision was calculated to ensure the product felt native, empathetic, and welcoming, actively working to avoid alienating a traditionally analog, bookish audience.

Tech Stack &
System Architecture
Tech Stack &
System
Architecture

To build this rapidly as a solo technologist, I utilized Cursor as my primary development environment. By leveraging Claude 3.5 Sonnet for LLM-assisted architecture, I was able to translate high-level system logic into a modern, responsive front-end integrated seamlessly with Anthropic's frontier vision model. This workflow directly demonstrates how creative professionals can leverage modern AI tooling to build bespoke, production-ready applications.

  • Frontend Framework: Next.js, React, TypeScript

  • Styling & UI: Tailwind CSS, AI-generated custom assets

  • AI / API: Anthropic API (Claude 4.6 Sonnet Vision)

  • Development Environment: Cursor (using Claude 4.6 Sonnet for LLM-assisted architecture and rapid prototyping)

Architecture Flow:

  • Image Capture: User securely uploads a high-resolution image of a bookshelf.

  • Vision Processing: Image is routed via API to Claude for visual extraction of spine text and visual clustering.

  • Thematic Analysis: The LLM synthesizes the extracted titles to identify underlying narrative themes, genres, and cultural affinities.

  • Cross-Domain Mapping: The system generates corresponding recommendations across distinct media formats (Books, Films, Music, and Podcasts).

  • JSON Structuring: Data is returned in a strictly formatted JSON object and parsed into the React front-end.

Prompt Engineering & Latency Mitigation

The core challenge wasn't just extracting text; it was steering the model to return predictable, machine-readable data without hallucinating titles from blurry book spines. I applied strict enterprise-level guardrails to the system prompt, utilizing an explicit fixed schema (response_format: { type: "json_object" }). Coupled with a custom response normalization function in the codebase, this approach successfully coerces and validates the output, ensuring the Next.js front-end receives flawless data structures every time.

Furthermore, processing complex high-resolution images through a multimodal LLM introduces inherent latency. To mitigate this, I am integrating custom Rive animations into the loading state—specifically, an animation of a book opening as branches and leaves organically grow from its pages. This transforms the asynchronous API wait time from a friction point into a moment of visual delight. Instead of exposing the mechanical 'thought process' of the model, the animation reinforces the application's warm, humanistic aesthetic and serves as a visual metaphor for how our tastes naturally branch out across different mediums.

Future Plans

Current deployment

Afterword is in active development. I am currently iterating on the system architecture to fine-tune the LLM’s recommendation accuracy and overhauling the visual layout of how the final cross-domain results are displayed to the user.

Looking forward, the next major architectural leap involves implementing the Model Context Protocol (MCP). By hooking the application into external streaming and e-commerce services via MCP, Afterword will transform from a passive discovery engine into an active routing layer, driving users directly from an AI recommendation to immediate media consumption.

Future Application

While Afterword is a consumer-facing prototype, the underlying API routing architecture solves a massive enterprise problem for cultural institutions and media conglomerates. By proving that multimodal LLMs can successfully act as translation layers between physical artifacts and digital recommendations, this architecture can be scaled for:

  • Museums & Galleries: Allowing visitors to scan a piece of physical art and instantly receive a personalized audio tour based on their specific demographic or demonstrated affinities.

  • Publishers & Media Conglomerates: Building tools that map a user's viewing history on a streaming platform to specifically target backlist publishing IP, maximizing cross-platform revenue.

Walkthrough

Want to talk more?

Want to talk more?