248.AI

Overview

248.AI is a San Francisco-based startup that builds production AI applications for enterprise customers, with deep integration into Salesforce. Their approach centers on composability — reusable AI agent building blocks that can be combined to solve complex business problems, rather than rigid point solutions.

My role for this project was to develop the full brand expression around their existing dot-based logo: concept, visual language, color, typography, and its first major applied execution as a live website.

The Brief

Take a minimalist dot-based logo and build a brand around it that feels as intelligent and understated as the product it represents.

Minimal, Not Empty

The client wanted restraint — no heavy illustration systems, no stock imagery, no visual flourish. But minimalism without substance reads as unfinished. The brand needed a conceptual anchor strong enough to carry a quiet visual language.

Logo as Starting Point

The dot-grid wordmark was distinctive but isolated. A logo alone isn't a brand — it's a starting point. The system around it needed to extend the logo's own logic, not contradict it.

Intelligence as a Feeling

AI brands default to dark mode, neon gradients, and techno-futurist language. The client wanted the opposite — something quieter, more confident, and more literate. The brand had to signal intelligence without announcing it.

The Core Concept

The brand should behave like the product it represents.

248.AI's whole philosophy is composability — small, reusable AI agents that combine to produce systems more intelligent than the sum of their parts. The founders describe their work as building "lemonade factories" rather than selling lemonade — infrastructure that lets enterprises produce their own AI capabilities at scale.

Conway's Game of Life is the cleanest possible visual metaphor for this idea. A grid where simple, local rules produce emergent, surprising, living patterns. Cells appear, disappear, migrate, form structures, dissolve. It's one of the most elegant illustrations of how complex intelligence emerges from simple foundations — exactly what 248.AI's product does, and exactly what their dot-grid logo visually suggests.

The logo's dot-grid wasn't just decoration — it was the substrate the Game of Life runs on. So the brand became an expression of that principle: dots as the atomic unit, arranged and rearranged to produce meaning.

Everything else in the brand — color, typography, layout, the web experience — followed from that one insight.

The brand is literally a Game of Life. The logo is the rule set; everything else is what happens when you run it.

Brand Direction

Direction Explored

Before committing, I sketched three possible visual languages the brand could inhabit — each a different answer to "what does intelligent minimalism feel like?"

Direction A

Technical & Editorial

Monospace typography, structured grids, dense information hierarchy. A brand that reads like a well-designed research paper — all substance, no ornament. Precise, but potentially cold and inaccessible for a broad audience.

Direction B

Quiet & Literate

Clean sans-serif typography, generous whitespace, a restrained grayscale palette, and a conceptual anchor that rewards close attention. Understated by default; confident enough to not need to shout.

Direction C

Futurist & Expressive

Dark-mode aesthetics, gradients, glowing accents, and the kind of visual language typical of AI startups in this category. Familiar, attention-grabbing — but exactly the convention the client wanted to avoid.

The Decision

We landed on Direction B — Quiet & Literate. It rejected AI-category clichés without sliding into academic austerity. It gave the brand room to be recognized for its substance rather than its surface. And it made the Game of Life concept legible — a quiet brand could surprise you with an interactive hero; a loud brand would drown it out.

Exploration

Choosing Direction B was a strategic call — but the execution still had to be found. I pushed a wide range of visual routes in layout and hero studies: different relationships between headline and grid, alternate type scales, warmer vs cooler neutrals, and how aggressively the dot system should read as “tech” versus “editorial.” Some explorations leaned closer to Direction A or C; others were already flirting with the quiet execution we shipped.

The studies below are a slice of that iteration — not polished deliverables, but the working material that made the final site feel inevitable instead of guessed.

Visual Language

The Dot System

The logo establishes the visual alphabet: dots arranged on a grid. That alphabet extends across the entire brand.

At logo scale, dots form the wordmark itself.
At hero scale, dots populate the full viewport as a live Game of Life — simple rules producing emergent patterns that evolve in real time.
At interface scale, dots become loading indicators, iconographic elements, and structural marks throughout the site.
At content scale, whitespace and grid logic echo the dot-system's underlying geometry — nothing is arbitrary, everything sits on a common substrate.

One visual element, scaling from brand mark to ambient texture. The brand feels coherent because every surface is speaking the same language.

Color System

Obsidian

#1C1B20

Graphite

#40404D

Stone

#787E8E

Mist

#B8B8C1

Canvas

#EEEEEE

The palette is a five-stop grayscale — no accent colors, no primary hue, no "brand color" in the conventional sense. This is a deliberate choice. The brand's meaning lives in pattern and rhythm, not color. Removing hue forces the viewer to pay attention to composition, density, and the movement of elements — the same things that make the Game of Life interesting in the first place.

The palette is also functionally useful: the five tones provide a precise typographic and structural hierarchy. Obsidian carries primary text and critical marks. Graphite and Stone handle secondary information. Mist and Canvas define ambient structure and rest states. Every shade has a role.

Typography

Inter

Light 300 Regular 400 Medium 500

Inter was chosen for its optical precision and neutrality. At a time when most AI brands reach for geometric display faces (Söhne, GT America, Neue Haas) or eccentric serifs trying to signal sophistication, Inter steps back and lets the content lead. It's readable at any size, designed for screens, and quietly opinionated in its details — exactly the tone the brand needed.

Weight usage is restrained: Light for display moments where elegance matters, Regular for body copy, Medium for emphasis. No bold, no italic, no extrabold display. The hierarchy comes from size and color — not from weight acrobatics.

Key Design Decisions

Decision 01

The Game of Life as the Brand's Living Signature

Rather than a static hero image, the brand's first impression is a live Conway's Game of Life simulation — cells being born, surviving, dying, migrating across the viewport in real time. It's not decoration. It's the brand's conceptual foundation rendered literally — a company named after the Game of Life opening with the Game of Life itself. Visitors hovering on cells can seed new patterns, turning passive viewing into participation. The brand's first interaction is playful, intelligent, and exactly on-concept.

Decision 02

Grayscale as a Positioning Statement

Choosing no hue in a category drowning in gradients is itself a statement. It signals confidence — the brand doesn't need color to be interesting. It rewards attention — the viewer's eye is drawn to structure and rhythm instead of surface. And it ages well — a brand without a trendy accent color doesn't date itself. Grayscale became the loudest thing the brand could do, precisely because everything else is quiet.

Decision 03

Type-Only, No Imagery

I proposed — and the client agreed to — eliminating photography and illustration entirely. AI brands that rely on stock imagery (server rooms, abstract neural networks, humanoid robots) signal exactly the wrong thing: derivativeness. By restricting the brand to typography and the dot-system, every visual element becomes intentional. The brand's surface is small, but every square inch of it is earned.

Decision 04

Logo System as Modular Set, Not Single Mark

The logo provided includes full-color, two-tone, and dynamic variants. Rather than treat these as interchangeable, I assigned each a role within the system: full-color for primary brand moments, two-tone for contexts requiring maximum contrast (stamps, embossing, small applications), and dynamic for placement over photography or colored backgrounds.

Applied Execution: Website

The website was the brand's first and primary application — where every decision had to cohere into a single, continuous experience.

The Interactive Hero

The hero is a fully-functional Conway's Game of Life running live in the browser — the same implementation powering the brand's homepage, embedded here so the concept speaks for itself.

Live Embed — Hover to Seed New Patterns

I custom-built this interaction in Javascript and tuned it specifically to the brand:

The grid self-calculates the optimal cell size and count based on the viewport, so the simulation fills any screen size without breaking rhythm.
Cells inherit the brand palette — born cells are assigned one of the three mid-tone grays at random, creating subtle chromatic variation as patterns evolve.
Hovering seeds new patterns — common Game of Life structures (gliders, blocks, blinkers) drop into the grid at the cursor, giving visitors a way to interact with the simulation rather than just watch it.
Generations tick at 2.4-second intervals — slow enough to be contemplative, fast enough to feel alive.

The initial cell distribution is weighted: sparse on the left to keep space for the headline and supporting copy, denser on the right where the simulation takes visual priority. The text sits inside the brand's own living logic, not next to it.

Key pages

Homepage

Technology

Work With Us

Typographic Hierarchy in Practice

Below the fold, the site runs on the restraint the brand demands. Display type uses Inter Light at large sizes. Body copy sits in Regular. Emphasis is earned through size and color, not weight. Whitespace is generous — sections breathe, there's room for the eye to rest, and every block of content is given room to land.

Outcome

The brand launched with the website as its first surface. The Game of Life hero became the brand's signature moment — instantly recognizable, conceptually anchored, and active in a way most brand hero sections aren't.

A Brand That Behaves Like Its Name

A company named after Conway's Game of Life that opens every visit with the Game of Life itself — conceptual consistency all the way down.

Visual System That Scales

A brand built on three principles: dots, grayscale, restraint. That extend cleanly from the logo mark to any future surface the company needs.

Reflection

248.AI is the project where I saw most clearly how much of brand design is about restraint. The brand could have had a color. It could have had photography. It could have had a standard AI-category look. Each of those additions would have made the brand louder and weaker.

Instead, the strongest move was to take things away — hue, imagery, weight variation, visual noise — until what remained was just enough to carry the concept. A grid, some dots, a typeface, and one living idea.