The situation

Florian is currently running his web presence on Squarespace at $300/year (~€275/yr). The platform imposes design constraints that make it difficult to present cinematic, video-first work the way it deserves — and the cost compounds every year with no equity in the asset.

This proposal replaces that with a fully custom portfolio, hosted on infrastructure that costs nothing to run after delivery.

Live mockup

A working prototype has already been built — you can explore it now. It features all six portfolio videos streaming from Cloudflare R2, a custom video player with seek bar, sound control, and full mobile layout.

What's included in the website

• Cinematic full-screen video carousel (Splide.js fade)
• Video seek bar with click + drag scrubbing
• Play/pause and sound controls
• Pagination dots with hover-title labels
• Custom cursor (desktop)
• Mobile-responsive layout
• About + Awards overlay pages
• Keyboard shortcuts (Space/Backspace to play/pause)
• Captions in EN / PT / ES / FR
• Cloudflare R2 video hosting setup
• Cloudflare Pages deployment + custom domain config
• Per-video letterbox correction (ffmpeg cropdetect)
• 12-month update support (48hr turnaround)
• Source files — you own everything

Technical approach

• Static architecture
  The site is a single HTML file with self-contained CSS and JavaScript — no framework, no CMS, no build pipeline. Why: zero ongoing maintenance, no dependency rot, no server to keep alive. It can be updated with any text editor and redeployed in seconds. The entire asset is yours to keep, move, or modify without us.
• Cloudflare R2 for video
  All videos are hosted on Cloudflare R2 object storage, served directly from Cloudflare's global CDN edge. Why: R2 has no egress fees (unlike AWS S3, which charges per GB transferred), no file size limits, no platform branding, and no third-party player injected into the page. Videos load fast regardless of where the viewer is, and they'll never be taken down by an algorithm or buried behind a login wall.
• Splide.js carousel
  The video carousel uses Splide.js in fade mode. Why: Splide is the lightest full-featured slider library available — 28KB gzipped, zero dependencies. The fade transition between videos feels cinematic rather than mechanical. Every other approach (CSS-only, custom JS, Swiper) either lacked the transition quality or added unnecessary weight.
• Custom video player
  The seek bar, play/pause toggle, and sound control are built from scratch on top of the native HTML5 <video> element. Why: off-the-shelf players (YouTube embeds, Plyr, Video.js) all inject their own branding, add load overhead, and impose a look that doesn't match a high-end production portfolio. The custom player is 80 lines of JS and matches the visual language of the site exactly. Keyboard shortcuts (Space/Backspace) were added because directors and producers review footage this way.
• Per-video letterbox correction
  Each source video was analysed individually using ffmpeg cropdetect to detect the exact black bar dimensions, then re-encoded with the correct crop applied. Why: videos delivered from different cameras, edit suites, and broadcast masters often have inconsistent black borders baked in. Without per-clip correction, the carousel would show uneven framing — some clips filling the viewport, others floating in black. The result is a visually consistent reel regardless of source format.
• Captions (EN / PT / ES / FR)
  Captions are delivered as WebVTT .vtt files loaded via the HTML5 <track> element — the native browser standard. Why: no JavaScript library needed, captions are indexed by search engines, and they work even if JS fails. Four languages cover the primary markets for international co-productions and film festival submissions.
• About + Awards overlays
  Secondary content (biography, awards, credits) is presented as full-screen overlay panels triggered by navigation links — no separate pages, no routing. Why: keeping everything in one document means instant transitions (no page load) and the cinematic full-screen feel is preserved throughout. The overlays close on click-outside or Escape, following standard UX conventions without needing a UI library.
• Custom cursor
  On desktop, the default OS cursor is replaced with a minimal dot that reacts to hover states. Why: it is a low-cost, high-impact detail that signals a considered, premium product — consistent with the level of craft expected of a production company portfolio. It adds no library dependency; the entire implementation is 15 lines of CSS and JS.
• Cloudflare Pages deployment
  The site is deployed to Cloudflare Pages, connected to a custom domain via DNS. Why: Pages is free with no bandwidth or request limits on the free tier, provides automatic HTTPS, and has Cloudflare's CDN baked in with no additional configuration. There is no server to provision, no certificate to renew, and no hosting bill — ever.

Scope of work

Payment options

Choose the plan that works for you. All plans cover the same full scope.

Next steps

1. Review the mockup Explore tomasini-productions.pages.dev — test on desktop and mobile. Share any feedback on layout, copy, or video selection.
2. Choose a payment plan and sign Pick one of the three options above — pay in full (€1,350), two payments (€750 × 2), or three instalments (€500 × 3). First payment secures the start date.
3. Domain + final content Share the domain you want to use (e.g. tomasini-productions.com) and any final video/copy updates. We handle the DNS and Cloudflare configuration.
4. Launch Site goes live on your domain, GSC verified, LinkedIn automation running. Estimated delivery: 5–7 working days from first payment.