Back to Projects.

Bardo

Year

2024

Industry

Creative / Entertainment

Scope of work

Framer, Video Optimization, Scroll-Driven Animation, WebP

Timeline

5 weeks

The Brief

Bardo is a creative studio known for cinematic, boundary-pushing work across film, advertising, and experiential design. Their website needed to be more than a portfolio — it needed to be an experience that demonstrates their creative philosophy before a visitor reads a single word.

The brief was refreshingly bold: make it feel like entering a world, not browsing a website. Video backgrounds, scroll-driven storytelling, and atmospheric transitions would replace traditional sections and static imagery.

Discovery & Strategy

Experience Mapping

Rather than a traditional sitemap, we created an experience map — plotting emotional states across the visitor journey. The entry should feel immersive and cinematic (wonder), the work section should build confidence (trust), the about section should reveal personality (connection), and the contact section should create urgency (action).

Each emotional state informed specific design decisions: the hero uses a full-screen autoplay reel for wonder, the work section uses large-format stills with hover-triggered video previews for trust, the about section breaks the grid with candid team photography for connection.

Design Approach

Cinematic Web Design

The design breaks nearly every "best practice" rule — intentionally. Navigation is minimal and initially hidden. Text is sparse. The screen is dominated by motion and imagery. But every unconventional choice serves the goal: demonstrating that Bardo thinks differently about visual communication.

The color palette is essentially monochrome — near-black backgrounds with white text — letting the work's natural colors provide all the visual variety. Typography is bold and condensed, used sparingly as punctuation between visual moments rather than as primary content delivery.

Development & Build

Video Performance

The biggest technical challenge was serving multiple background videos without destroying load times or mobile battery life. We implemented adaptive video loading: desktop receives full 1080p background loops, tablet gets 720p, and mobile receives static poster frames with play-on-tap. All videos are encoded in VP9/WebM with H.264 fallback.

Scroll-driven animations use Intersection Observer for trigger precision and CSS transforms for smooth rendering. No JavaScript animation libraries — everything is native browser APIs for maximum performance. The site maintains 60fps scroll performance even with multiple video elements in the DOM.

Results & Impact

Creative Impact

The site immediately became a talking point in Bardo's industry. Multiple creative directors reached out specifically citing the website as the reason for initial contact. The immersive approach proved that creative studios can — and should — use their own website as a portfolio piece, not just a container for one.

Book an intro call

Time to get introduced and explore how AGR Studio can help you

Book a free call

Do you prefer email communication?

artyum@agr.studio

For instant messaging:

+1 (507) 626-9148

Frequently

asked questions

What does a typical project timeline look like?

Full website builds take 6–8 weeks. Migrations from WordPress, Webflow, or Wix ship in 4–6 weeks. Rush projects can launch in as fast as 2 weeks. Every timeline includes design, development, CMS setup, and launch support.

What’s included in a full website build?

Custom design across desktop, tablet, and mobile. Framer development with CMS collections for your content. Form integrations (HubSpot, Zapier, Cal.com). SEO optimization with meta tags and structured data. Plus 2 weeks of post-launch support included.

Do I own the website after launch?

Yes, 100%. You get full ownership of the Framer project, all custom components, and complete CMS access. No lock-in, no recurring fees. You only pay for a retainer if you want ongoing design and development support.

Can you migrate my site from WordPress, Webflow, or Wix?

Yes. We’ve migrated sites from all major platforms. Content is preserved, SEO redirects are configured to protect your rankings, and the new Framer site launches with significantly better performance and page speed.

What if I need changes after launch?

You can edit content, images, and CMS items yourself — that’s the whole point of building in Framer. For design changes, new pages, or structural updates, we offer monthly retainers. Most clients manage day-to-day content independently within days of launch.

Do you work with startups or larger companies?

Both. We’ve built sites for pre-seed startups and publicly traded companies. The process scales to fit the project — whether it’s a 4-page launch site or a 20-page enterprise platform with multiple CMS collections.

What industries do you specialize in?

SaaS, fintech, AI/ML, B2B platforms, maritime, and creative studios. But Framer expertise transfers across any industry — we’ve worked with food companies, space tech startups, insurance providers, and more.

How do you handle CMS and content management?

We set up Framer CMS collections tailored to your content — blog posts, case studies, team members, products, whatever you need. Your team gets a recorded walkthrough covering publishing workflows and SEO best practices. Most clients are adding content independently within days.

What does a typical project timeline look like?

What’s included in a full website build?

Do I own the website after launch?

Can you migrate my site from WordPress, Webflow, or Wix?

What if I need changes after launch?

Do you work with startups or larger companies?

What industries do you specialize in?

How do you handle CMS and content management?

What does a typical project timeline look like?

What’s included in a full website build?

Do I own the website after launch?

Can you migrate my site from WordPress, Webflow, or Wix?