# Brand directions for a premium web, automation and AI studio

Prepared 6 October 2026. STUDIO is a temporary wordmark; these are theme names, not proposed business names.

## Business context

Based on Web_Automation_AI_Agency_Business_Plan.pdf and the earlier “Suggest business names” discussion. The plan proposes websites, booking portals, automation, AI agents and ongoing maintenance for UK service businesses, especially care and health, with Indian manufacturers and exporters as a secondary audience. The naming discussion explores a globally pronounceable identity that can grow beyond an agency into software and AI products. No final business name was confirmed in the retrieved discussion.

The design should communicate technical capability, taste and dependable delivery. The website itself can demonstrate 3D craftsmanship while keeping its offer, real work and booking action clear. Visual luxury does not require replacing the plan’s practical positioning with luxury pricing.

## 01 — Kinetic Chrome

**Recommendation for your stated visual ambition.** Precise, cinematic and unmistakably technical.

| Role | Color |
|---|---|
| Background | Carbon `#0B0D10` |
| Surface | Graphite `#171B22` |
| Primary text | Ice `#F4F6F8` |
| Accent | Cobalt `#316BFF` |
| Secondary text | Steel `#A5AFBF` |
| Accessible button variant | Deep cobalt `#2457E0`, with white text |

**Typography:** Space Grotesk 600 for headings; Manrope 400 for body, 500–600 for interface text. Add IBM Plex Mono 400 only if a few technical annotations need it.

**3D:** A polished chrome frame represents building and connecting systems. On scroll it unfolds into website layers, then connects into booking and automation modules. Pointer movement makes a subtle lighting change. The work section uses dimensional website planes containing actual project screenshots.

**Style:** Large geometric headlines, dark spacious surfaces, a controlled cobalt seam and crisp chrome reflections. Keep most pixels neutral; reserve blue for the focal object and calls to action.

**Tradeoff:** This requires excellent materials and lighting to feel distinctive. A generic blue orb would lose the identity.

## 02 — Sculpted Ivory

**Best for refined premium service.** Architectural, editorial and approachable.

| Role | Color |
|---|---|
| Background | Ivory `#F3F0E8` |
| Surface | Limestone `#E4DED2` |
| Primary text | Espresso `#191814` |
| Accent | Bronze `#8A4B2A` |
| Secondary text | Stone `#746F64` |

**Typography:** Instrument Serif 400 for display headings, with selective italic; Manrope 400–600 for body and UI. The serif is expressive enough without a heavy weight.

**3D:** Interlocking travertine and brushed bronze frames create an architectural opening. Scroll moves through the opening to reveal selected work. Realistic shadows and quiet camera movement make the site feel tactile and expensive.

**Style:** Warm editorial whitespace, espresso typography, restrained bronze buttons, with a darker work gallery for contrast.

**Tradeoff:** It needs visible functional demos and clear service copy to establish its software expertise alongside its design taste.

## 03 — Emerald Systems

**Best fit for the plan’s initial business audience.** Calm intelligence and reassuring competence.

| Role | Color |
|---|---|
| Background | Forest black `#071B17` |
| Surface | Deep evergreen `#10332B` |
| Primary text | Porcelain `#F0F5EF` |
| Accent | Mint `#72E2B1` |
| Secondary text | Sage `#A3B8AE` |

**Typography:** Sora 600 for headings; DM Sans 400–600 for body and UI.

**3D:** A smoky optical-glass monolith houses connected modules. Scroll follows an enquiry through booking and follow-up. Selecting a service highlights its module; a nearby HTML panel explains the actual business outcome.

**Style:** Deep green, warm white, refractive glass and restrained mint lighting. Mint buttons use forest-black labels.

**Tradeoff:** The motion needs one dramatic reveal to meet your showcase ambition while retaining its calm character.

## 04 — Editorial Engine

**Best for a bold creative agency.** Confident typography and mechanical craft.

| Role | Color |
|---|---|
| Background | Graphite `#141414` |
| Surface | Charcoal `#242424` |
| Primary text | Paper `#F2F0EB` |
| Accent | Vermilion `#F06A45` |
| Secondary text | Warm steel `#AAA59C` |

**Typography:** Outfit 600 for headlines; Manrope 400–600 for body and UI; IBM Plex Mono 400 for small project labels and occasional technical details.

**3D:** A milled vermilion frame separates into machined layers, then assembles into a complete website on scroll. Project planes create a dimensional work gallery. Camera direction and type composition provide the drama.

**Style:** Oversized type, precise rules, off-white text and a single strong accent. Vermilion buttons use graphite labels.

**Tradeoff:** This is the most assertive direction; care and clinic landing pages would need particularly reassuring copy and proof.

## My choice

Choose **Kinetic Chrome** if the priority is a memorable cinematic 3D studio site. Choose **Emerald Systems** if the priority is the first niche and positioning in the business plan. For your current request, I recommend Kinetic Chrome with clear, calm service sections and real functional demos.

Use one coherent direction across the wordmark, site, project presentations and social content. The brand should stay recognizable when the 3D scene is absent.

## Type and color implementation

- Desktop hero type: start around 88–112px and adjust to the final headline and viewport. Mobile: 42–56px with intentional line breaks.
- Body type: 17–18px, line-height 1.55–1.7. Small labels: 12–14px. Keep meaningful copy readable.
- Sans display leading: approximately 1.0–1.1. Instrument Serif: approximately 1.05–1.15. Avoid clipping ascenders and descenders.
- Start with roughly 75% base/surface, 20% text and secondary neutrals, 5% accent. These are art-direction proportions, not a pixel quota.
- Verify contrast on the implemented backgrounds. Measured button pairs: deep cobalt/white, bronze/ivory, mint/forest-black and vermilion/graphite are intended for small readable labels. Bright cobalt `#316BFF` against ice `#F4F6F8` measures about 4.14:1, so use the deeper button variant.

Official font specimens: [Space Grotesk](https://fonts.google.com/specimen/Space+Grotesk), [Manrope](https://fonts.google.com/specimen/Manrope), [Instrument Serif](https://fonts.google.com/specimen/Instrument+Serif), [Sora](https://fonts.google.com/specimen/Sora), [DM Sans](https://fonts.google.com/specimen/DM+Sans), [Outfit](https://fonts.google.com/specimen/Outfit), [IBM Plex Mono](https://fonts.google.com/specimen/IBM+Plex+Mono).

## Website experience to build after selection

1. Hero: one compelling 3D object, the niche/outcome pitch and a visible booking action.
2. Work: actual project screenshots and case studies. Distinguish live work from demos; publish only supported results.
3. Services: clear packages for websites, booking and automation/AI, presented with restrained motion.
4. Interactive proof: a booking demo and a clearly labeled AI assistant demo, matching the business plan.
5. Process and contact: explain delivery, maintenance and next steps; make the free 20-minute call easy to book.

The hero object can change throughout the page to create a continuous 3D story. The content should remain ordinary readable HTML. Preserve normal scrolling, keyboard access and a reduced-motion path. On smaller or slower devices, lower scene complexity or show an art-directed still. Lazy-load 3D after essential content; evaluate mobile speed on the completed site. The plan’s 2–3 second mobile target remains a design constraint, not a verified result.

One well-directed scroll sequence will also provide a coherent 15–30 second capture for social media.

## Deliverables and scope

Four generated static concept boards, exact palette and font specifications, and a local interactive comparison page. The comparison page previews actual web fonts when online and lets you switch themes and copy colors. Generated-board letterforms approximate the intended fonts; the written specification and live specimens are authoritative. These concepts do not constitute a completed 3D website, final vector logo, domain selection or brand-name clearance.

The image prompts are saved in `generation-prompts.json`; the boards were generated using the built-in image generation tool.