Arthur Costa

Why this design

Concept. “Built for the peak”: my strongest result came from sizing a fleet to live-event traffic, so the page is a fleet scaling along one load curve.

Navigation. Scrolling is event time; the strip at the bottom is the curve, the playhead and the section links, with a portrait whose resolution follows the load where you are. On a phone it sits at the top of the page instead, so it never covers what you read; the hero's skyline and the move figure each carry their own Pause, in sync with the strip's, and each section ends with a link back to the sections.

First screen. A skyline of instances with my face at its peak; the name and the result figures widen with the instance count as the fleet scales out.

The move. AC-001 drawn in its own order: on-prem and edge sites, cloud local zones, autoscaling, a Locust load test, the live event; the instances are dots that take my avatar's colours in the zones and resolve into my face at the peak, while the fleet is a placement listing in words (instance, status, result, node pools with one mark per placement), so each figure has its own form.

Density follows load. Sparse at baseline, densest at the peak (ten instances scheduled onto three node pools), consolidated after it.

Type. One variable family, Roboto Flex, whose width axis is the page's voice: the name and result figures widen with the instance count, headings and reading text widen with each section's load (condensed at baseline, wide at the peak), and instance names are set wide, like a scheduler's listing.

Colour. One small palette with one meaning per colour (status marks vary by form, not colour: filled done, half working, outline trial), the same in the skyline, the move, the strip and the table: ink is capacity running at the peak (and text); warm grey is capacity that has run; a lighter grey is what has not happened yet; outlines are idle capacity; terracotta, a neighbour of my skin tone, means only now or moving (the playhead, the skyline's front, instances in flight, the current step). My avatar's own colours are me, never recoloured.

Motion and access. The portrait plays once and holds; the move of AC-001 rests on its finished state, plays once and can be stepped by keyboard; Pause stops everything; reduced motion shows end states.