Focused production
Company Website Re-Design
Key Features
Video production, showreel, single film pages, contact
Fast, easy to navigate, clean
- Impactful Homepage: Hero video, intro tagline.
- Portfolio: Film grid, single film pages.
- Services: Production service, incentives, region.
- About Us: Company story, team.
- Contact Page: Contact details, form.
- MORE: Partner agency showcase.
- Trusted Brands: Client logo wall.
- Interactive Elements: Video backgrounds, animations.
- Social Media: Vimeo, Facebook and Instagram links.
- Responsive Design: Mobile-friendly layouts.
- Security: SSL throughout.
- Call to Action: Clear CTAs closing each page.
- Company Presentation: One-click download.
- Studio Counters: Years in business, projects.
- Awards: Housekeeping festival laurels.
Introduction
Client and Project
About Focused Production
Let’s be Focused!
We are a boutique production house, small enough to pay super close attention to every single detail, but big enough to handle every task.
We don’t see ourselves as just a team. It’s more of a dream team. We know our job and we know each other. Experience, expertise and energy are our main strengths.
We focus on what’s important: quality, cost-effectiveness and professionalism.
Style Guide
Color and Font
The palette works like a film set after dark: warm cream type on near black, so the footage stays the brightest thing on the page. Slate carries secondary text and the rules under the counters, and Sand appears only once, on the band that offers the company presentation. Faustina, a warm serif, sets the headings and buttons with a cinematic tone, while Open Sans in its light weight keeps longer passages about services and incentives easy to read.
We are a boutique production house, small enough to pay super close attention to every single detail, but big enough to handle every task. Experience, expertise and energy are our main strengths.
Showreel
Showreel Mood
Six commercials from the Focused catalogue set the mood for the design. The dark, quiet interface exists to let footage like this lead, so every page gives the films the most room and the interface the least.
TVC Big Fashion K2Client: Big Fashion
TVC Big Fashion HeistClient: Big Fashion
TVC Cedevita ono nesto CEClient: Atlantic Grupa / Cedevita
TVC Najlepse Zelje CookieClient: Atlantic Grupa / Najlepse Zelje
TVC Doncafe MomentClient: Doncafe
TVC Cedevita Vitamin WaterClient: Atlantic GrupaSitemap
Flowcharts
Work follows Home directly, because producers and agencies arrive wanting to see the reel before anything else. Every film opens on its own page with previous and next links, so a visitor can keep watching without returning to the grid. MORE, the partner creative agency, gets a top level place of its own, in the same order as the main navigation.
- TVC portfolio
- Studio counters
- Single TVC
- Prev / Next
- Creative agency
- Experience
- Showcase
- Awards
- Media recognition
- Production service
- Incentives
- Our region
- Region facts
- Our story
- Our approach
- Team
- Trusted by brands
- Contact form
- Contact details
12 Column Grid
Layout grid
Every page is laid out on a 12 column grid: 1920px wide with 120px margins, twelve 129px columns and 12px gutters, giving a 1680px content width.
Home Page
Desktop View
The home page opens on the showreel itself, playing full screen behind one line of introduction and a single call to action. Below it the page answers the questions a producer asks, in the order they ask them: the work, the team and its track record, the brands that have trusted it, and the award winning short film Housekeeping, before closing on an invitation to get in touch.
Interior Pages
Work, Services, About Us
Every interior page follows the same spine: a full width hero with the page title and one line of introduction, the content itself, then the shared close of a call to action and the presentation download. Work lays out the full catalogue as a dense grid of stills, so a producer can scan it in one scroll. Services explains the Serbian production incentives and the region, and About Us puts faces and direct contacts to the team.
Work
Services
About Us
Responsive Design
Mobile Version
On a phone the showreel still leads, with the introduction and the call to action kept together in one block over the footage. The multi column grids collapse to a single column, so every film still reads at full width, and the navigation folds into a full screen menu that also carries the office address, phone and email, so a producer can call straight from the menu.
Featured work
Work
Our region
Trusted brands
Contact
Navigation menu
What Focused gained
Outcomes of the rebuild
Focused came to the redesign with a strong reel, a client list of international brands and a website that kept all of it on one long page. What follows is what the company got out of the rebuild, and the evidence for each.
The old home page went straight from the reel to a grid of titles. The new one sets out 25 years in business, more than 250 projects, a wall of client brands and the award winning short film Housekeeping.
The old site had no contact form, only an address in the footer. The rebuild gives enquiries their own page with a form, closes each main page with a call to action, and keeps the company presentation one click away.
Everything used to live on one page more than 9,000px long, reached through jump links. The rebuild gives Work, Services, About Us and the MORE partnership pages of their own, each with an address that can be shared and found in search.
The old home page had no main heading, and 55 of its 57 images had no description. The new home page has headed sections and descriptions on 71 of its 77 images.
The old site ran on WordPress 5.3 from 2019, never updated, and loaded an online store plugin on every page with no shop behind it. The rebuild launched on WordPress 6.7 without it.
focusedproduction.tv
Thank you!