Project Brief

Arkevio is the official website for our horror game studio. The target was not just a marketing page, but a production-ready platform with fast content updates, strong visual identity, and maintainable architecture for long-term iteration.

What I Built

• A Next.js App Router website with dedicated home, games, about, contact, and news experiences.
• A Sanity-powered editorial flow for news content with author support and rich article structures.
• A webhook-based revalidation endpoint so published content appears without full redeploys.
• Cinematic UI behavior using GSAP and custom scroll/animation utilities.
• Cookie and analytics integration (CookieYes + Umami) aligned with privacy requirements.

Architecture Decisions

I split the project into clear layers so non-trivial features stay manageable:

• Routing and app structure: Route groups in src/app keep public pages and admin/CMS functionality separated.
• Content operations: News schema lives in Sanity, while static product/studio data is centralized in src/config/siteConfig.ts.
• Rendering strategy: News pages are fetched server-side with real-time freshness goals, then revalidated through webhook triggers.
• Design system approach: Reusable section wrappers and animation components keep visual consistency while allowing page-specific identity.

Build Process

I implemented the project in phases:

1. Foundation - establish route layout, shared components, and config-first content structure.
2. CMS integration - define schemas, wire client queries, and render dynamic article pages.
3. Publishing pipeline - add signed webhook revalidation for reliable content updates.
4. Experience polish - apply animation timing, motion depth, and visual hierarchy tuned to the horror-studio brand.
5. Production concerns - plug in cookie consent, analytics script gating, and SEO metadata/sitemap handling.

Challenges and Solutions

• Keeping content live without redeploy pain: I used webhook-triggered revalidation to update listing and detail routes immediately after publish.
• Balancing heavy visuals with performance: I constrained animation scope to high-impact sections and leaned on optimized image loading patterns.
• Avoiding config sprawl: I kept studio/game metadata centralized to simplify updates and reduce hardcoded values across components.

Outcome

The result is a studio site that feels premium on the frontend and practical on the content side. It showcases how I combine branding-focused UI with real engineering concerns: CMS workflows, deployment behavior, and maintainable project structure.