Web Designer Portfolio - Site Reel Template

A recent-work reel for freelance web designers and small studios who want the portfolio band to carry the same taste as the sites it shows. Five panes in a wide 2:1 frame: cream paper field, ink Syne headlines, Space Mono metadata, and exactly one electric blue accent per pane. Each project mounts as a tilted site-mockup plate that drifts while its caption sits still - a gallery wall, not a grid.

#What Makes This Template Stand Out

The defining move is the mounted plate. Each website lands as a large rounded card - Verda tilted -4 degrees, Klang +3, Arbor & Co straightened to 0 - with a blue index chip (01, 02, 03) riding its corner. The plate block morphs position and tilt between adjacent panes, so the mockup appears to travel across the reel and finally settle, which makes three separate projects read as one continuous piece of art direction.

Each site card keeps its own two-tint mini palette, so the range of work is the argument. Verda is a plant e-commerce hero in greens with a serif "Bring the garden home." headline; Klang is a festival site shouting "THREE NIGHTS OF NOISE" in yellow on black with a tickets pill; Arbor & Co is a navy-on-cream law firm rebrand reading "Counsel for the long term." Three clients, three registers, one designer - and because the cards are swappable images, your own screenshots inherit the same framing.

The typographic frame does the quiet work. "NIA VALE - WEB DESIGN" holds the top-left corner of every pane in mono, the cover stacks "Websites for brands with taste." in Syne with a blue underline drawing itself under "taste", and each project gets a caption column - 90px project name, year line, and a blue mono chip like "Shopify · Art direction". The close pane shifts to a soft cream-to-blue gradient wash, asks "Your site could be next.", and the drifting blue square from the cover re-enters to seal the loop.

• Cream paper field with ink Syne headlines, Space Mono metadata, and one electric blue accent per pane
• Site mockups mounted as tilted plates that morph position and angle between panes
• Blue index chips (01, 02, 03) riding the mockup corners to count the work
• Three swappable project cards with their own two-tint palettes: greens, black and yellow, navy and cream
• Draw-on blue underline on the cover, drifting square brand mark that returns on the close
• 5-pane 2:1 reel with caption columns, tech-stack chips, and a Start a project CTA pill

#Who Should Use This Template

• Freelance web designers who need the "recent work" band under their hero to out-design a static thumbnail grid. Three plates and a CTA is the whole pitch, and it runs itself on autoplay.
• Small studios and two-person shops presenting a range of client registers - e-commerce, event, professional services - where the mini-palette discipline shows breadth without breaking cohesion.
• Webflow and Shopify builders whose tech-stack chips ("Shopify · Art direction", "Identity · Webflow") are part of the sell. The caption column is built to carry exactly that line.
• Designers pitching a rebrand or site project who want the proposal to open with proof. The reel exports to video or image sequence for decks and DMs.

#Best Use Cases

#The Recent-Work Band on a Portfolio Site

This is the template's native habitat: a wide 2:1 strip under your hero section. Export to HTML, React, Vue, or Svelte and mount it on your own domain, or embed the hosted link. The plates drift slowly with parallax while captions hold still, and the loop seam - the blue square re-entering on the close - means visitors who watch two cycles never see a hard restart.

#Client Pitches and Proposals

Open a proposal with the reel instead of an appendix of screenshots. The caption format - project name, one-line scope, year, stack chip - answers the three questions every prospect asks before the call. Export to PDF for the leave-behind or to video for the email body, and let "Your site could be next." do the closing.

#Social Proof Posts

Each project pane works standalone as a 2:1 social card, and the full five-pane loop exports to video for LinkedIn or X when you ship a new site. Swap one plate, update the caption, re-export - the announcement post takes minutes because the frame never changes.

#How to Customize This Template

1. Open PaneFlow and select "Web Designer Portfolio - Site Reel" from the template gallery
2. Edit the cover headline "Websites for brands with taste." and the mono micro-label with your own name and discipline
3. Update the "SELECTED WORK 25-26" meta line to your own years
4. Replace the three site-mockup plates with screenshots of your own work - the rounded corners, shadow, tilt, and drift carry over automatically
5. Rewrite each caption column: project name, scope line ("Plant e-commerce, 2026"), and the blue stack chip
6. Adjust the index chips if you reorder projects, and re-tilt any plate per pane if you want a different rhythm
7. Edit the close pane CTA pill and the contact line with your email and booking status
8. Export to HTML, React, Vue, or Svelte for your site, or to video for pitches and social posts

#Related Templates

• Websites Portfolio - another way to run a multi-site showcase, one project per pane
• Portfolio Strip - Work Showcase - a slimmer work strip for embedding mid-page
• Freelancer One-Pager - Warm Editorial - the services-plus-work counterpart when you need a full pitch, not just a reel
• Developer Portfolio - Terminal Mono - the code-side sibling for when the work has no screenshots

#Related Resources

• PaneFlow for Designers - portfolio and case-study templates with editorial typography
• PaneFlow for Portfolios - portfolio templates and hosting for people who ship work
• PaneFlow vs Canva - how PaneFlow goes beyond Canva for animated, exportable portfolio bands