Content Writer Portfolio Advanced Portfolio Website Template

Byline is a cinematic content writer portfolio landing page built for video-first writers. The asymmetric 60/40 grid arranges embedded scripts, talking-head cuts, and campaign teardowns into a scrollable studio tour. A Tech Glass visual identity, glassmorphism card overlays, and a "Send Me Your Brief" lead capture form make the page feel as deliberate as the work it showcases.

by Rocket studio

Quick summary

Byline is a single-page video portfolio template for content writers who work in motion. It pairs a collage-style header with a zigzag gallery layout, context cards, a metric wall, and a short lead-capture form. Every design choice signals that this writer understands pacing, structure, and the difference between copy that reads and copy that lands on camera.

Who this template is for

This template is built for writers whose work lives in video, not just documents. If your strongest proof points are scripts that shipped and performed, Byline gives those pieces the visual frame they deserve.

  • Video scriptwriters and content strategists pitching to SaaS marketing directors
  • Writers serving direct-to-consumer brand leads who want scripts that feel spoken, not typed
  • Freelancers and agency creatives who need a portfolio that qualifies clients before the first call

What problem this template solves

Most portfolio pages treat writing samples like attached files. They hide the strategic thinking, flatten the visual context, and give a hiring director no reason to keep scrolling. Byline fixes that by turning the page itself into evidence of craft.

  • Scripts buried in PDFs or plain-text links fail to show pacing, structure, or creative intent
  • Generic portfolio layouts do not communicate the difference between a blog writer and a video scriptwriter
  • Weak calls to action ask for commitment before the visitor has seen enough to trust the work

What you get with this template

You get a fully designed, section-complete landing page ready to be populated with your own work. Every component is defined in the source brief and mapped to a specific job on the page.

  • A collage-style header with auto-playing video tile, monospace script fragments, and handwritten margin annotations
  • An asymmetric 60/40 grid gallery with alternating video and context card placement, a mid-scroll metric wall, and slide-over script panels
  • A two-placement lead capture form with three fields and a sticky pill call-to-action that follows the visitor through the scroll

Feature list

This section covers the core capabilities built into the Byline template.

Collage Scrapbook Header

The header layers overlapping video stills, script fragments in monospace type, and handwritten margin notes such as "tighter here" and "pause for breath" onto a backlit glass board composition. One tile auto-plays a three-second silent loop showing a mouth forming a sentence. A single centered headline, "Written to be watched," cuts through the arrangement in medium-weight sans-serif type.

Each portfolio row places the embedded video in the wider 60-column and the context card in the 40-column. The grid alternates sides as the visitor scrolls, creating a zigzag rhythm that mirrors flipping through a physical portfolio book. Each context card shows the client name, a one-line brief, and a strategic note from the writer explaining the structural reasoning behind the script.

Mid-Scroll Metric Wall

A full-width interstitial breaks the gallery pattern midway through the page. It presents a single wall of performance numbers including view counts, completion rates, and conversion lifts, rendered in indigo on deep black. The numbers count up as the section enters the viewport, resetting the page tempo before the gallery resumes with higher-stakes work.

Slide-Over Script Panels

Each video card carries a subtle secondary link labeled "See the full script." Clicking this opens a slide-over panel that displays the written copy alongside the video context. This reinforces that the writer delivers complete, finished documents and not just recorded ideas.

Dual-Placement Lead Capture Form

The primary call to action, "Send Me Your Brief," appears in two positions. It shows as a sticky pill in the top navigation after the header clears the viewport, and again anchoring the final section. The form collects three fields: name, company, and a textarea labeled "What are you making?" The brevity is intentional because the portfolio qualifies the lead before the form appears.

After the hero header scrolls out of view, a persistent pill-shaped call-to-action button attaches to the top navigation. It keeps the contact path visible throughout the entire scroll without interrupting the gallery experience.

Page sections overview

SectionPurpose
Collage HeaderOpens with layered video stills, script fragments, auto-play tile, and central headline
Gallery Row OneFirst 60/40 video and context card pair with strategic writer note
Gallery Row TwoAlternated layout continuing the zigzag scroll rhythm
Metric Wall InterstitialFull-width performance numbers that count up on scroll
Gallery Row Three PlusHigher-stakes work resuming after the metric tempo break
Script Slide-OverExpandable panel revealing full written copy per project
Lead Capture SectionThree-field contact form anchored by the primary call to action

Design & branding system

The visual language draws from a Tech Glass theme built on an Electric Indigo color system. The palette is cool, backlit, and precise, like a user interface rendered on smoked acrylic.

  • Background is deep void black (#0B0D17); body text and card overlays use frosted glass white (#E0E7FF); interactive states use luminous indigo (#4F46E5) on hover and active borders
  • Signal violet (#7C3AED) drives call-to-action pulses and progress indicators; indigo gradients bleed behind video thumbnails to suggest monitor light through a cracked door
  • Cards use glassmorphism blur so each element appears to float just above the surface of the page

Mobile & speed optimization

The layout is designed with mobile viewing in mind. The asymmetric grid and collage elements are structured to remain readable and intentional at smaller screen sizes.

  • The 60/40 column structure stacks cleanly on narrow viewports so video and context cards read in sequence rather than side by side
  • Auto-play behavior on the header tile is scoped to a three-second silent loop, keeping the visual impact controlled without adding unnecessary load weight
  • Sticky navigation and slide-over panels are designed to function within standard mobile interaction patterns

How this template helps you convert

Byline is structured as a qualification engine. The visitor watches work first and only encounters the contact form once the portfolio has made the case.

  1. The collage header and gallery scroll show finished, shipped work before any ask is made, so arriving visitors build trust through direct evidence rather than claims
  2. The metric wall midway through the page reframes the writer as a strategic partner by presenting real performance context, not just creative output
  3. The short three-field form and dual call-to-action placement lower the friction of reaching out, making it easy for a qualified visitor to act the moment they are ready

Other information about this template

Byline sits within the Portfolio and Agency category and is specifically matched to the content writer video portfolio niche. A few additional details worth knowing before you use it.

  • The template style is an asymmetric grid with a 60/40 column ratio, a layout choice that gives video the dominant visual weight while keeping strategic context visible at all times
  • The header concept is classified as a collage or scrapbook composition, which suits writers whose work spans multiple formats and clients rather than a single vertical
  • The creative direction is a Gallery Walk, meaning the scroll itself is the narrative structure and the visitor experience is designed to feel like a curated studio tour
  • The lead generation direction means the page is built around one primary conversion goal: getting a qualified visitor to submit a brief, not to browse indefinitely
Content Writer Portfolio Advanced Portfolio Website Template
Content Writer Portfolio Advanced Portfolio Website Template
Content Writer Portfolio Advanced Portfolio Website Template
Content Writer Portfolio Advanced Portfolio Website Template

Theme

Tech Glass

Creative direction

Gallery Walk

Color system

Electric Indigo

Style

Asymmetric Grid (60/40)

Direction

Lead Generation

Page Sections

Collage Scrapbook Header

Asymmetric 60/40 Gallery Grid

Mid-scroll Metric Wall

Slide-over Script Panels

Dual-placement Lead Capture

Related questions

Who is the Byline template designed for?

What kind of work can I showcase with this template?

How does the lead capture work on this page?

Can I display performance results for my work?

Is this a single-page layout or a multi-page site?