// 006 — SaaS Landing & Brand Study

SURFACE
STUDY.

A visual study of a modern SaaS surface — landing, brand, hierarchy, motion. Designed and built as a concept, not a shipped product. Proof of taste, not proof of users. The move I'd run on any team's SaaS surface stuck on a default template.

build.2026.05 concept study · single file surface + brand + motion [ CONCEPT ]
// The Brief

The brief was credibility of taste. A SaaS surface that reads like a finished product — not a portfolio exercise, not a static screenshot, not a stock-template dashboard with a logo dropped on top.

The decision: design the entire surface — landing, brand mark, deploy state machine, log stream, pricing toggle — as a coherent visual system. Click deploy. Watch the state animate through. Toggle the pricing and watch the value swap. The product narrative compressed into a few small interactions.

No backend. No real users. No claim otherwise. This is a study of the surface — the design move I'd run on any SaaS template that needs to stop looking like every other one.

// 01 — Product Dashboard

The Command Center

Every service, every deploy, every log line. Click a queued deploy to trigger a build.

app.signal.so/overview
Overview
Deploys
Logs
Monitors
Team
Settings
elbe@sixpct.co
Overview
99.8%
// Uptime · 30d
847ms
// Avg deploy
12
// Deploys today
signal-frontend main 2m ago [ LIVE ]
api-gateway hotfix/auth 8m ago [ LIVE ]
design-system feat/tokens 31m ago [ LIVE ]
analytics-worker main now [ QUEUED ]
// 02 — Core Features

Built for teams that ship.

Three things Signal does better than watching a Slack channel and hoping.

Real-time deploy tracking
Every push tracked from queue to live. Status updates the moment the state changes — no polling, no refreshing.
// WebSocket · Live state
Streaming log pipeline
Every log line, every service, in one stream. Filter by severity, search by pattern, pin a session for replay.
// Server-sent events · Full-text search
Team-aware monitoring
Not just uptime — who deployed what, when, and what changed. Shared context so the whole team knows before users do.
// Audit log · Presence indicators
// 03 — Pricing

Start free. Scale when you ship.

No seat fees. No per-deploy pricing. Pay for what you actually use.

Free
$0 / mo
For solo builders and side projects. No credit card required.
  • 3 projects
  • 50 deploys / month
  • 24-hour log retention
  • Basic monitors
  • 1 team member
Scale
$99 / mo
For scaling companies that need SLA guarantees and dedicated support.
  • Everything in Pro
  • SSO / SAML
  • Custom log retention
  • 99.99% uptime SLA
  • Unlimited team members

SHIP IT. WATCH IT.
KNOW IT'S LIVE.

Signal gives your team one place to see everything that's running and everything that isn't.

Start Free →
// No credit card · 5-minute setup · Free forever plan
// In review
// Craft decisions
  • The browser chrome wraps the dashboard. The user reads "this is a product" before they read what the product is. The frame does the positioning work the copy doesn't have to.
  • Deploy state machine has three states with three colors: queued (dim), building (yellow + 2.8s progress bar), live (teal). Not status badges — a real fake of a real build.
  • Log stream caps at 6 lines and shifts as new ones arrive. Each line enters with opacity 0→1, x: -4→0 over 250ms. Logs feel arrived, not pasted.
  • Pricing toggle animates the digits: out at opacity 0, y: -6, replace text, in at opacity 1, y: 0. The number changes through the transition — value is the thing, the motion reinforces it.
  • Featured pricing card surface differential is mode-specific: dark mode uses --surface-hi, light mode overrides to #D8D8D6. Tokens with the same RGB delta read different at opposite ends of the value scale.
// What I'd do differently
  • The dashboard is locked at 440px. On a 1440 screen there's room for it to breathe to 600+. Fixed height killed a chance to make the product feel substantial.
  • Log stream is round-robin from a static array. Real production would surface log severity — error lines should look different from info, and recent errors should pin.
  • No empty state on the deploy list. First-time signup would see four [ LIVE ] rows as decoration. The product needs an empty state for new accounts — and I didn't design one.
// PALETTE