← ALL WORK CASE STUDY 09 / 18

Beige.

CLIENT
Beige
INDUSTRY
Creative services marketplace / AI content production (SaaS)
WHAT WE DID
UI/UX design, front-end development, interaction design, responsive build
PLATFORM
Next.js (React) + Tailwind CSS
YEAR
2025–2026

( THE BRIEF )

The challenge

Booking a shoot traditionally means chasing quotes and coordinating freelancers. Beige needed a site that explains a new, AI-assisted model in seconds and shows brands proof of scale and quality.

Like most two-sided marketplaces, it also had to speak to two audiences at once: clients booking shoots and creatives looking for work. Mix the two messages and both get weaker. All of this had to feel as premium as the content Beige produces.

There was also a speed-of-understanding problem. A visitor who cannot grasp a new category of service in the first screen rarely scrolls to find out, so the site had to show the idea, the proof and the next step almost at once.

The client

Beige is a marketplace that lets brands and individuals book a professional videographer or photographer in under 60 seconds. It combines instant pricing and AI matchmaking with AI-assisted post-production, and the site promotes Beige as "the modern operating system for content production".

Beige also recruits creatives through its Creative Partners program. This marketplace website design case study shows how Xenishio Arc designed and built a Next.js site that serves both sides of that marketplace.

What we built

We built a dark, cinematic Next.js site that leads with what the visitor wants, backs it with proof, and gives clients and creatives their own clearly separated paths.

  1. 01 Interactive hero A large gold headline sits above an "I want ___" prompt that cycles through use cases ("a commercial for tech company", "corporate event photos") and leads straight into Start Your Shoot and Sign Up. Visitors see their own need reflected before they read any explanation.
  2. 02 Tilted 3D media carousel Real shoots sit under the hero, so the quality of the work is the first proof on the page.
  3. 03 Proof points Stat tiles ($10M+ content produced, 5K+ verified creatives, 4K+ shoots booked, booking in under 60 seconds), a brand logo wall and an influencer showcase with follower counts.
  4. 04 How it works Sections on instant pricing, intelligent matchmaking and a four-stage workflow (AI matchmaking, pre-production, production, AI post-production) make a new model easy to follow.
  5. 05 Social proof A #ShotOnBeige photo gallery, a testimonial grid, an FAQ accordion and a sign-up section for priority access.
  6. 06 App promotion A call to action for the Beige mobile app on the App Store keeps the experience consistent across web and mobile.
  7. 07 Find Creative Work page A creator recruitment funnel with an Apply CTA, an ambassador and referral program explainer, a growth-milestone tier journey, a "How It Works" grid and a featured creative partners carousel.

( THE SITE, PAGE BY PAGE )

Scroll through it.

Hover to auto-scroll · scroll inside the frame

Home page of beige.app, full-page screenshot
beige.app on a phone
On a phone
Visit the live site

( WHAT WENT INTO IT )

Inside the marketplace website.

KEY FEATURES
  • Cycling "I want…" intent prompt as the hero call to action
  • 3D-tilted media carousel and photo gallery
  • Animated stat tiles and a brand/influencer social proof section
  • Separate client and creator funnels (Start Your Shoot vs Find Creative Work)
  • Milestone tiers and creator spotlight carousel
  • FAQ accordion, testimonials, mobile app call to action
  • Server-rendered Next.js pages with optimized, preloaded web fonts
DESIGN SYSTEM
Typography

Humanist sans-serif loaded through Next.js font optimization with a system UI sans fallback; headlines are bold and set in gold

Wide-tracked BEIGE wordmark the logo

Colour palette
  • #000000Base background
  • #FFFFFFPrimary text
  • #D9C29ABeige-gold headline
  • #EDE3D3Cream buttons
  • #000000Button text
  • #C9A86AGold gradient panels

Dark luxury. A near-black canvas with warm beige and gold accents, rounded pill buttons, glassy outlined navigation and dark cards with subtle borders. Full-bleed photography and tilted media give it a film-studio feel that matches what Beige sells: professional production.

TECH STACK
Framework
Next.js (App Router, React Server Components)
Styling
Tailwind CSS
Fonts
next/font self-hosted, preloaded WOFF2
Analytics / tags
Google Tag Manager, Google Analytics
Web server
Nginx on Ubuntu
WHAT IT DELIVERS
  • Beige's value proposition (book a shoot in under 60 seconds) is visible and actionable in the first screen.
  • Clients and creatives now have separate, purpose-built paths, so neither message dilutes the other.
  • The brand comes across as a premium, tech-forward production partner, consistent across web and app.
  • Server-rendered pages with self-hosted, preloaded fonts keep a media-heavy site quick to display.
  • SaaS
  • Marketplace
  • AI
  • Creative Services
  • Next.js
  • React
  • Tailwind CSS
  • Landing Page
  • Dark UI
  • UX/UI Design
NEXT CASE STUDY · 10 Vermola Shopify E-commerce store