Brand & identity + bespoke cinematic site + hand-coded technical SEO
alasservice.com
alas
- Role
- Brand & Identity · Web Developer · Technical SEO
- Stack
- Static siteVanilla JSVercel FunctionsView TransitionsJSON-LD
- Timeline
- 2 weeks
- Status
- Live

01
The Problem
alas is an advisory firm for artists, producers and labels — legal, management, booking, fiscal, rights and career development — entering a sector where trust and perception are everything and where competitors present themselves as generic and corporate. There was nothing to start from: no brand, no name resolved visually, no identity, no site. The brief was, at heart, twofold: build from scratch a brand and a site worthy of the service — premium, distinctive, fast, and findable on Google — that would convert artists and labels into calls, without leaning on a CMS, a template or a page builder that would cheapen the perception.
02
The Approach
Brand first, then the site. I defined the full identity — the name as a visual asset (the lowercase, the 'a' isotype, the ® suffix), a warm ink/paper/gold palette, Geist typography and a distinctive voice — and condensed it into a deliverable brand kit. On that foundation I built a 100% bespoke static site, no framework, no build, no page builder, on a hand-made design token system. The home is a scroll-driven cinematic narrative, and everything is wired as progressive enhancement: content is always visible and accessible even when the browser doesn't support the animations. Leads ship through a custom serverless function — no third-party form services, credentials only on the server — and technical SEO and structured data are hand-written.
03
What I Built
- 01Brand identity from scratch: visual naming (the lowercase as a resource, the 'a' isotype, the ® mark), color system (ink #1a1410, paper #efe9dc, gold accent #d4c089), Geist/Geist Mono typography and editorial art direction; delivered as a full brand kit (PDF style guide, SVG and PNG logos, favicon and iconography, and the fonts)
- 02Bespoke static site on a design-token-based system, no framework, no build, no page builder; vanilla HTML/CSS/JS deployed on Vercel with clean URLs
- 03Scroll-driven cinematic home with native CSS animations (animation-timeline, scroll-driven) and a custom magnetic cursor (mix-blend-mode), always as progressive enhancement and respecting prefers-reduced-motion
- 04Awwwards-grade services page: 12 services as interactive rows, page transitions with the View Transitions API, hero depth via a giant isotype and parallax, and micro-interactions, with graceful degradation where the browser doesn't support it
- 05First-party lead capture, no third parties: 'book a call' form in a card-style modal, delivered by a serverless function (Vercel Functions + SMTP via Nodemailer), with honeypot anti-spam and credentials only in server environment variables — never on the client
- 06Hand-coded technical SEO with zero plugins: dynamic titles & meta, canonical, robots.txt, sitemap.xml, Open Graph/Twitter Cards and full JSON-LD (LegalService, OfferCatalog) for indexing and rich results; set up and verified in Google Search Console
- 07Performance and Core Web Vitals: compressed background video, conditional asset loading, fonts with preload, light grain texture and zero third-party dependencies
- 08Brand infrastructure: domain and corporate email (info@alasservice.com), isotype-based favicon, live CET clock as a brand detail and full coherence of header, footer and typography between home and services
04
The Outcome
An advisory firm that launches with its own brand and a site to match: distinctive, fast and fully indexable, with a premium aesthetic that sets it apart from the sector's corporate competition. Leads land directly in the firm's inbox — no middlemen, no third-party platforms — and the site stands on its own, no CMS, no plugins, no templates locking it in. An end-to-end project shipped — from identity to JSON-LD, from isotype to lead — handcrafted, not configured.