twotalesanimation
b151e8cc52
Deploy / deploy (push) Successful in 7m25s
Clients sometimes ship footage under a naming convention that doesn't match our own shot codes. Adds an optional Shot.clientCode, editable on the Slate tab: when set, it replaces shotCode only in what the client actually sees — slate identity, overlay burn-in, and delivered EXR/MOV file and folder names in Netflix packages — with our own version string flatly appended (no "_cmp_TT_" studio jargon mixed in). Internal render paths, EXR filenames on the SAN, comp names, and DB lookups are untouched. Shots without a client code render identically to before. Delivery packages denormalize clientCode at build time, same as the existing shotCode/versionString snapshot, so a later shot edit can't retroactively change already-built delivery history. The worker now renames delivered EXR frames and the delivery MOV using the existing frame-number parser (SequencePattern) so only the base name changes — frame numbers and padding survive exactly. This is the one piece of the change that could plausibly ship the wrong bytes, so it's covered by new unit tests (renaming, padding, MOV rename, checksum-survives-rename, and a graceful fallback for an unparseable frame number) rather than resting on manual verification alone. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
FeedBack — VFX Review & Approval Platform
Frame-accurate video review, annotation drawing, and approval tracking for boutique VFX and animation studios.
Features
- Dead-simple video upload — drag & drop MP4/MOV, up to 2 GB, version-tracked
- Frame-accurate scrubbing — canvas-based timeline ruler with click-and-drag seek
- Timestamp comments — comments anchored to exact frame numbers, threaded replies, resolve/unresolve
- Annotation drawing — freehand, arrow, rectangle, circle tools with color + stroke width picker
- Approval workflow — Approve / Reject / Needs Changes with notes, full history
- Client review links — shareable token-based review URLs for external clients (no login required)
- Role-based access — Admin / Producer / Supervisor / Artist / Client roles
- Slack notifications — webhook alerts for uploads and approvals
- Self-hostable — Docker Compose with PostgreSQL + MinIO (S3-compatible) included
Tech Stack
| Layer | Technology |
|---|---|
| Framework | Next.js 15 App Router (Turbopack) |
| Language | TypeScript 5 strict |
| Styling | TailwindCSS 3 + shadcn/ui (zinc, dark-only) |
| Auth | NextAuth.js v5 (Credentials + JWT) |
| Database | PostgreSQL 16 via Prisma 6 |
| File Storage | UploadThing / S3 / R2 / B2 / MinIO / local |
| State | Zustand 5 (player) + TanStack Query 5 (server) |
| Annotations | HTML5 Canvas API (normalized coordinates) |
| Video Playback | HTML5 <video> with custom controls |
| Container | Docker multi-stage build |
Quick Start (Docker)
# 1. Clone and configure
cp .env.example .env
# Edit .env — set AUTH_SECRET, DATABASE_URL, storage provider
# 2. Start services (PostgreSQL + MinIO + App)
docker compose up -d
# 3. Run migrations and seed
docker compose exec app npx prisma migrate deploy
docker compose exec app npx tsx prisma/seed.ts
# 4. Open http://localhost:3000
Demo accounts (after seed):
| Password | Role | |
|---|---|---|
| admin@vfxreview.local | admin123 | Admin |
| producer@vfxreview.local | producer123 | Producer |
| supervisor@vfxreview.local | supervisor123 | Supervisor |
| artist@vfxreview.local | artist123 | Artist |
| client@studio.com | client123 | Client |
Local Development
# Install dependencies
npm install
# Set up database (Postgres must be running)
npx prisma migrate dev
npx tsx prisma/seed.ts
# Start dev server
npm run dev
Open http://localhost:3000.
Environment Variables
See .env.example for full reference. Key variables:
# Required
DATABASE_URL="postgresql://..."
AUTH_SECRET="your-32-char-secret"
NEXTAUTH_URL="http://localhost:3000"
# Storage (choose one)
STORAGE_PROVIDER="local" # local | uploadthing | s3 | r2 | b2 | minio
# UploadThing (if STORAGE_PROVIDER=uploadthing)
UPLOADTHING_SECRET="sk_live_..."
UPLOADTHING_APP_ID="..."
# AWS S3 / R2 / B2 compatible
S3_ACCESS_KEY_ID=""
S3_SECRET_ACCESS_KEY=""
S3_BUCKET_NAME=""
S3_REGION=""
S3_ENDPOINT="" # for R2/B2/MinIO
# Slack (optional)
SLACK_BOT_TOKEN=""
# Email (optional, nodemailer)
SMTP_HOST=""
SMTP_PORT="587"
SMTP_USER=""
SMTP_PASS=""
Project Structure
app/
(auth)/login/ — Sign-in page
(dashboard)/ — Protected dashboard layout
dashboard/ — Home stats + shot queue
projects/ — Project list + detail pages
settings/ — User profile
review/[versionId]/ — Full-screen review player
client/[token]/ — Unauthenticated client review link
api/
auth/[...nextauth]/ — NextAuth route handler
uploadthing/ — UploadThing route handler
notifications/ — Notification CRUD
projects/ — Projects REST endpoint
components/
player/ — ReviewPlayer, FrameTimeline, PlaybackControls
annotations/ — AnnotationCanvas, AnnotationTools
comments/ — CommentPanel (threads + replies)
versions/ — VersionUpload, VersionList
shots/ — ShotCard, NewShotDialog
projects/ — ProjectCard, NewProjectDialog
dashboard/ — StatsCards, ShotQueue, RecentActivity
layout/ — Sidebar, Header, NotificationBell, Providers
ui/ — shadcn/ui base components
actions/ — Server Actions (projects, shots, versions, comments, annotations, approvals)
lib/ — db, auth, utils, frame-utils, storage, slack, notifications, uploadthing
hooks/ — use-review-player (Zustand), use-annotations, use-frame-comments
prisma/ — schema.prisma, seed.ts
Review Player Keyboard Shortcuts
| Key | Action |
|---|---|
Space / K |
Play / Pause |
J |
Reverse playback |
L |
Forward playback |
← / → |
Step one frame |
F |
Toggle fullscreen |
Documentation
| Doc | Covers |
|---|---|
| RenderPipeline2.md | Render pipeline specification — normative design, state machine, API contracts |
| DELIVERY_WORKFLOW.md | Building and shipping delivery packages (how-to) |
| VFXReviewConnector.md | After Effects panel — setup, Shot Builder, QC, diagnostics |
| RenderWorker/README.md | Render worker service — packaging, install, validation, delivery builds |
| BlenderPanel/README.md | Blender add-on — queueing a .blend on the farm |
| EXT_API_REFERENCE.md | External API (/api/ext/*) used by the panel and workers |
| Shot task workflow.md | Shot and task lifecycle in the web app |
License
MIT