Independent design concept · Not the official website
← RETURN TO CONCEPT
REBUILD RECIPE / SAMPLE STR-03

MATERIAL
TIME.

Sol 5.6 designed and implemented this dependency-free static concept as a material-time laboratory. It pairs a Higgsfield concrete film with procedural aggregate fields, an interactive visual timeline, and CSS 3D.

01 / FACTS

Business: STR Concrete Restoration
Category: Concrete contractor
City: Fort Lauderdale, Florida
County: Broward
Phone: (954) 788-2533
Owner: Kerry J Garris
Public listing signal: 5.0 from 3 reviews

No email, address, service list, process, certification, hours, warranty, price, project, or testimonial was added.

02 / FILM

Renderer: Higgsfield
Model: Seedance 2.0 Mini
Job: b6d516e2-5a63-4c4d-b340-489622bc9e94
Cost: 5 credits
Local asset: assets/hero.mp4

Direction: microscopic concrete aggregate becoming a calm architectural material study, lavender and mint optical light, patient macro camera move, ultramarine accents, no people, text, or logos.

03 / MOTION SYSTEM

Primary

The Seedance film provides patient macro transformation inside a circular lens and a wide authored material panel.

Secondary

The visual phase control changes plane rotation, core scale, particle opacity, and optical focus; a translucent CSS 3D specimen turns in measured stages.

Ambient

Two Canvas fields simulate aggregate Brownian motion while the lens sweep, translucent cards, grids, and quiet optical rings maintain laboratory depth.

Personality: calm and patient. Timing: 450–1200ms. Signature easing: cubic-bezier(0.4, 0, 0.2, 1). Reduced-motion removes video, loops, smooth scrolling, and long transitions.

04 / BUILD

  1. Keep hero.mp4 inside assets/.
  2. Serve the directory with any static file server.
  3. Canvas fields scale to viewport size and 2× pixel ratio.
  4. The aggregate textures and CSS laboratory remain as fallback.
python -m http.server 8080
# open http://localhost:8080

05 / DEPLOY

No framework, package install, or build step is required.

vercel deploy --prod --yes

vercel.json supplies security headers and immutable caching for the generated film.

06 / THREE PASSES

  1. Pass 1 — Composition: established the microscope hero, interactive visual-time instrument, translucent factual samples, film study, and direct-call terminal.
  2. Pass 2 — Motion and depth: added Seedance film, Brownian aggregate Canvas fields, turning CSS 3D specimen, responsive phase planes, lens sweep, and three-layer choreography.
  3. Pass 3 — Resilience and restraint: tightened mobile hierarchy, contained oversized type and panels, added reduced-motion, film fallback, semantic structure, verified owner, exact phone links, persistent disclosure, and indexing controls.