Journalist Portfolio Directory Website Template

Byline is a dark, immersive journalist video portfolio landing page built on a bento grid layout. It combines a Before/After Slider header, manifesto-style video thumbnails, and a lead generation form to turn a journalist's body of work into a compelling, interactive reel room that speaks directly to news directors, documentary producers, and podcast networks.

by Rocket studio

Quick summary

Byline is a single-page journalist video portfolio template designed to showcase investigative reports, war correspondence, and on-camera standups in one cinematic space. The bento grid layout escalates by editorial weight, the dark ink-and-paper palette commands attention, and every section is built to move a hiring decision forward.

Who this template is for

This template is built for working journalists who need their portfolio to do serious professional work. It speaks the visual language that news industry decision-makers trust and respond to.

  • Investigative reporters and foreign correspondents seeking bureau roles or long-form commissions
  • Documentary field producers and on-camera hosts building relationships with production companies
  • Journalists pitching podcast networks or multi-platform editorial roles who need a single, high-impact page

What problem this template solves

Most journalist portfolio pages feel like a résumé with embedded links. They are static, text-heavy, and do nothing to communicate the craft, instinct, or range behind the work. Byline solves that.

  • Hiring editors and news directors rarely have time to hunt for your best work across scattered links
  • A generic portfolio layout undercuts strong journalism by presenting it without editorial context or visual gravity
  • There is no built-in path for a visitor to start a conversation once they are impressed

What you get with this template

You get a fully structured, single-page journalist video portfolio landing page that functions as an interactive reel room from the first scroll to the final form.

  • A Before/After Slider header that splits raw field footage from the finished broadcast package, letting visitors feel the production craft directly
  • A bento grid body section with expandable video cells, each carrying a manifesto conviction statement in large serif type
  • Two lead generation paths: a primary contact form with role-specific fields and a secondary press kit download for visitors not yet ready to commit

Feature list

This template delivers a focused set of purpose-built components. Each one serves the editorial atmosphere and the lead generation goal simultaneously.

Before/After Slider Header

The full-viewport header splits the screen between raw handheld field footage and a finished, color-graded broadcast package. Visitors drag the divider themselves, physically experiencing the gap between chaos and craft. A manifesto line fades in across both halves to anchor the journalist's voice immediately.

Manifesto Bento Grid

The main content area is a bento grid of video thumbnail cells. Each cell carries a single conviction statement in large serif type, such as "Forty-seven sources. One refused to talk. That was the story." Clicking any cell expands it into an inline player with a short production note beneath it.

Editorial Escalation Structure

The grid is not organized chronologically. It escalates by editorial weight, moving from lifestyle features to political profiles to investigative series to frontline dispatches. This deliberate order makes the scroll feel like watching a journalist's development in real time.

Full-Width Philosophy Breaks

Between grid clusters, full-width text breaks deliver fragments of a personal editorial philosophy. White text on black, typeset like a magazine column, these breaks slow the visitor down and build a sense of conviction between video sections.

Dual Lead Generation Paths

The primary call to action, "Discuss Your Next Story," appears as a floating pill after the third grid row and again as a full-width closing section. The contact form collects name, outlet or production company, role via dropdown, and a free-text field labeled "What's the story?" A secondary "Download Press Kit" option captures just an email address for visitors who need more time.

Ink and Paper Color System

The entire page is built around a dark editorial palette. Deep black dominates eighty percent of the canvas, off-white carries body text and pull quotes, charcoal defines card edges, and breaking-alert red activates only on hover states and active video borders. This restraint makes the red feel urgent every single time it appears.

Page sections overview

SectionPurpose
Before/After Slider HeaderShows raw footage versus finished broadcast; anchors the journalist's manifesto line
Manifesto Grid Row OneOpens with lighter editorial work; establishes range before escalating
Philosophy Text Break OneDelivers the first editorial philosophy fragment between grid clusters
Manifesto Grid Row TwoAdvances to political profiles and mid-weight investigative work
Floating call to action PillSurfaces the "Discuss Your Next Story" prompt after the third grid row
Philosophy Text Break TwoDeepens the personal editorial voice with a second full-width fragment
Manifesto Grid Row ThreeEscalates to frontline dispatches and flagship investigative series
Closing call to action SectionFull-width lead generation form with role dropdown and open story field
Press Kit DownloadQuiet secondary exit capturing email for visitors not yet ready to commit

Design & branding system

The visual identity is built around a Dark Immersive theme using the Ink and Paper color system. Every color decision is intentional and editorially motivated, not decorative.

  • Deep editorial black (#0D0D0D) fills eighty percent of the canvas, establishing a cinematic atmosphere that keeps video content central
  • Newsprint off-white (#E8E3D9) handles all body text, pull quotes, and manifesto statements, providing legibility without breaking the dark mood
  • Typewriter ribbon charcoal (#2B2B2B) defines card boundaries inside the bento grid, separating cells with editorial precision
  • Breaking-alert red (#C0392B) is reserved exclusively for hover states and active video borders, functioning like a live tally light that only switches on when the visitor interacts

Mobile & speed optimization

The bento grid layout is structured to adapt cleanly across screen sizes, keeping video thumbnails accessible and the lead generation form functional on smaller viewports.

  • Grid cells reflow responsively so that the escalation sequence from lightweight features to frontline dispatches is preserved on mobile
  • The floating call to action pill and the closing form section remain prominently positioned regardless of device, ensuring both conversion paths are always reachable

How this template helps you convert

Byline is engineered to move a qualified visitor from discovery to outreach without friction. Every design decision reduces the distance between "impressive work" and "let's talk."

  1. The Before/After Slider creates an immediate emotional and professional impression, giving news directors and producers a reason to stay before they have seen a single full piece
  2. The escalating bento grid builds credibility progressively, so by the time a visitor reaches the closing form they have already been convinced by the work itself
  3. The dual conversion paths, an active conversation form and a quieter press kit download, meet visitors wherever they are in their decision process, capturing leads at two distinct levels of intent

Other information about this template

Byline is purpose-built for the journalist video portfolio niche and carries design decisions that generic portfolio builders cannot replicate through settings alone.

  • The creative direction is Manifesto, meaning every visible text element on the grid reinforces journalistic conviction rather than simply labeling content
  • The template style is Bento Grid, a layout format that gives each editorial piece its own visual weight while keeping the full body of work readable as a single collection
  • The header concept is Before/After Slider, a specific interaction pattern that no static thumbnail header can match for communicating production craft
  • The theme is Dark Immersive, which positions the journalist as a serious, field-tested professional rather than a digital generalist
  • This landing page is suitable for journalists working across broadcast, digital, documentary, and podcast formats
Journalist Portfolio Directory Website Template
Journalist Portfolio Directory Website Template
Journalist Portfolio Directory Website Template
Journalist Portfolio Directory Website Template

Theme

Dark Immersive

Creative direction

Manifesto

Color system

Ink & Paper

Style

Bento Grid

Direction

Lead Generation

Page Sections

Before/after Slider Header

Manifesto Bento Grid Layout

Editorial Escalation Structure

Full-width Philosophy Breaks

Dual Lead Generation Paths

Ink and Paper Color System

Related questions

Can I customize the conviction statements on each bento grid cell?

Does the page support video from different hosting sources?

Is the press kit download option separate from the main contact form?

Who is the primary audience this landing page is designed to impress?

Can the bento grid order be changed to reflect my own editorial priorities?