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
| Section | Purpose |
|---|---|
| Before/After Slider Header | Shows raw footage versus finished broadcast; anchors the journalist's manifesto line |
| Manifesto Grid Row One | Opens with lighter editorial work; establishes range before escalating |
| Philosophy Text Break One | Delivers the first editorial philosophy fragment between grid clusters |
| Manifesto Grid Row Two | Advances to political profiles and mid-weight investigative work |
| Floating call to action Pill | Surfaces the "Discuss Your Next Story" prompt after the third grid row |
| Philosophy Text Break Two | Deepens the personal editorial voice with a second full-width fragment |
| Manifesto Grid Row Three | Escalates to frontline dispatches and flagship investigative series |
| Closing call to action Section | Full-width lead generation form with role dropdown and open story field |
| Press Kit Download | Quiet 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."
- 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
- 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
- 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




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?