Developer zyx94 has unveiled an early preview of AIRAP Video, a browser-based application that transforms portrait photos into short AI-generated rap and music videos. While the creative premise is simpleβputting users and friends into a performanceβthe engineering challenge lies in making the generation pipeline transparent and predictable. The tool is currently in a feedback-gathering phase, with self-serve credit purchases not yet open to the public.
The Technical Stack
The application is built on TanStack Start, React, and TypeScript, prioritizing type safety across the full stack. On the frontend, TanStack Query manages server data via a typed API client, ensuring that the interface and server remain in sync. The developer notes that validation plays a critical role in keeping inputs consistent, a necessary step when dealing with complex media generation tasks that require precise parameters.
Structuring the Generation Workflow
AIRAP Video breaks down the creation process into two distinct generation stages: first creating a new scene around the uploaded portraits, then generating the actual performance. The workflow is driven by theme selection, which dictates practical requirements such as the number of portraits needed and fixed durations for specific performances. This structure allows the system to display requirements upfront, reducing friction before users begin uploading their photos.
Transparency in Cost and Progress
A key design decision was to surface the cost before generation begins. The credit quote, which varies based on the selected model, resolution, and duration, appears next to the confirmation step. This addresses a common pain point in generative AI tools: unexpected billing. Furthermore, because video generation takes longer than typical form submissions, the interface includes specific states for processing, completion, and recovery, ensuring users aren't left guessing about their task status.
Key Takeaways
- The app uses TanStack Start and TypeScript to enforce type safety between the client and server.
- Credit costs are calculated and displayed based on model, resolution, and duration before generation starts.
- Themes serve as both creative direction and technical constraints, defining portrait counts and video length.
- Self-serve purchases are disabled in the current preview, focusing on feedback for the creation experience.
The Bottom Line
This is a solid example of wrapping complex AI generation in a predictable, typed developer experience. The focus on upfront cost transparency and state management is exactly whatβs missing from many 'wrapper' apps that confuse users with black-box billing and silent failures.