From 0d715680563bc7d8b8e8586e390c3ff5ca7262f0 Mon Sep 17 00:00:00 2001
From: Amp <amp@ampcode.com>
Date: Fri, 4 Sep 2026 00:41:42 +0000
Subject: [PATCH] feat(marketing): refresh observability screenshots for
 product pages

Replace the shared Chat Room inspector screenshot and the workflows blog
image with dashboard captures of an agent-built app pipeline
(examples/agent-factory in rivet-dev/rivet):

- Actors / homepage / enterprise: project Actor State tab with the build
  summary and per-step attempts and timings
- Dynamic Apps: appRelease Actor State with the active release, publish
  history, and request counter
- Workflows: buildPipeline workflow graph with the publish step selected

Assets are served from assets.rivet.dev/website/marketing/screenshots/ and
must be uploaded before merge.

Amp-Thread-ID: https://ampcode.com/threads/T-01a0689c-e97a-74fb-8527-7b59926c1ebd
Co-authored-by: Nicholas Kissel <nicholas@rivet.gg>
---
 .../marketing/actors/ActorsObservabilitySection.tsx       | 8 ++++----
 .../enterprise/EnterpriseObservabilitySection.tsx         | 8 ++++----
 .../marketing/sections/ObservabilitySection.tsx           | 8 ++++----
 src/pages/dynamic-apps.astro                              | 8 ++++----
 src/pages/workflows.astro                                 | 8 ++++----
 5 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/components/marketing/actors/ActorsObservabilitySection.tsx b/src/components/marketing/actors/ActorsObservabilitySection.tsx
index 5a19ad38..d82930ef 100644
--- a/src/components/marketing/actors/ActorsObservabilitySection.tsx
+++ b/src/components/marketing/actors/ActorsObservabilitySection.tsx
@@ -3,7 +3,7 @@ import { CARD_TITLE_CLASS, SECTION_H2_CLASS, SECTION_LEDE_CLASS } from "../typog
 import { SITE_SECTION_CLASS, SITE_STANDARD_RAIL_CLASS } from "../layout";
 
 const INSPECTOR_SRC =
-  "https://assets.rivet.dev/repo/website/src/components/marketing/images/screenshots/rivet-actor-inspector.png";
+  "https://assets.rivet.dev/website/marketing/screenshots/rivet-actors-inspector-state.png";
 
 const features = [
   {
@@ -64,9 +64,9 @@ export const ActorsObservabilitySection = () => (
       <figure className="mt-12 overflow-hidden rounded-xl" data-site-reveal>
         <img
           src={INSPECTOR_SRC}
-          alt="Rivet Actor Inspector showing state, events, and callable actions for a running Actor"
-          width="2688"
-          height="2018"
+          alt="Rivet Actor Inspector showing the live state of a project Actor: build summary plus each pipeline step's status, attempts, and timing"
+          width="2944"
+          height="2202"
           loading="lazy"
           className="block h-auto w-full"
         />
diff --git a/src/components/marketing/enterprise/EnterpriseObservabilitySection.tsx b/src/components/marketing/enterprise/EnterpriseObservabilitySection.tsx
index 1e058d8c..9676b5c9 100644
--- a/src/components/marketing/enterprise/EnterpriseObservabilitySection.tsx
+++ b/src/components/marketing/enterprise/EnterpriseObservabilitySection.tsx
@@ -3,7 +3,7 @@ import { CARD_TITLE_CLASS, SECTION_H2_CLASS, SECTION_LEDE_CLASS } from "../typog
 import { SITE_SECTION_CLASS, SITE_STANDARD_RAIL_CLASS } from "../layout";
 
 const INSPECTOR_SRC =
-  "https://assets.rivet.dev/repo/website/src/components/marketing/images/screenshots/rivet-actor-inspector.png";
+  "https://assets.rivet.dev/website/marketing/screenshots/rivet-actors-inspector-state.png";
 
 const features = [
   {
@@ -55,9 +55,9 @@ export const EnterpriseObservabilitySection = () => (
       <figure className="mt-12 overflow-hidden rounded-xl" data-site-reveal>
         <img
           src={INSPECTOR_SRC}
-          alt="Rivet dashboard showing state, events, and callable actions for a running Actor"
-          width="2688"
-          height="2018"
+          alt="Rivet dashboard showing the live state of a project Actor: build summary plus each pipeline step's status, attempts, and timing"
+          width="2944"
+          height="2202"
           loading="lazy"
           className="block h-auto w-full"
         />
diff --git a/src/components/marketing/sections/ObservabilitySection.tsx b/src/components/marketing/sections/ObservabilitySection.tsx
index 16b9222c..37aa22b4 100644
--- a/src/components/marketing/sections/ObservabilitySection.tsx
+++ b/src/components/marketing/sections/ObservabilitySection.tsx
@@ -3,7 +3,7 @@ import { BODY_CLASS, CARD_TITLE_CLASS, SECTION_H2_CLASS } from "../typography";
 import { SITE_SECTION_CLASS, SITE_STANDARD_RAIL_CLASS } from "../layout";
 
 const inspectorSrc =
-  "https://assets.rivet.dev/repo/website/src/components/marketing/images/screenshots/rivet-actor-inspector.png";
+  "https://assets.rivet.dev/website/marketing/screenshots/rivet-actors-inspector-state.png";
 
 const features = [
   {
@@ -74,9 +74,9 @@ export const ObservabilitySection = () => (
       >
         <img
           src={inspectorSrc}
-          alt="Rivet Actor Inspector"
-          width="2688"
-          height="2018"
+          alt="Rivet dashboard inspecting a project Actor built by an agent: live state with the build summary and each pipeline step's status, attempts, and timing"
+          width="2944"
+          height="2202"
           loading="lazy"
           decoding="async"
           className="block h-auto w-full"
diff --git a/src/pages/dynamic-apps.astro b/src/pages/dynamic-apps.astro
index 77be9956..eaf53e53 100644
--- a/src/pages/dynamic-apps.astro
+++ b/src/pages/dynamic-apps.astro
@@ -48,7 +48,7 @@ const APPS_EXAMPLE_ROOT = 'https://github.com/rivet-dev/dynamic-apps/blob/main/e
 const AI_BUILDER_EXAMPLE_URL =
 	'https://github.com/rivet-dev/dynamic-apps/tree/main/examples/apps-ai-builder';
 const INSPECTOR_IMAGE =
-	'https://assets.rivet.dev/repo/website/src/components/marketing/images/screenshots/rivet-actor-inspector.png';
+	'https://assets.rivet.dev/website/marketing/screenshots/rivet-dynamic-apps-release.png';
 const INSTALL_COMMAND = 'npm add @rivet-dev/dynamic-apps';
 
 // Dynamic Apps snippets live in the agentOS repo (`snippetFrom: "agentos"`).
@@ -431,9 +431,9 @@ const compositionLayers = [
 				<figure class="mt-12 overflow-hidden rounded-xl" data-site-reveal>
 					<img
 						src={INSPECTOR_IMAGE}
-						alt="Rivet dashboard inspecting a deployed app, showing Actor state, events, and callable actions"
-						width="2688"
-						height="2018"
+						alt="Rivet dashboard inspecting an app release Actor: the active release, its publish history with content hashes, and the request counter"
+						width="2944"
+						height="2202"
 						loading="lazy"
 						class="block h-auto w-full"
 					/>
diff --git a/src/pages/workflows.astro b/src/pages/workflows.astro
index 5bde625e..63751d4e 100644
--- a/src/pages/workflows.astro
+++ b/src/pages/workflows.astro
@@ -53,7 +53,7 @@ const ACTOR_EXAMPLE_ROOT =
 const BUG_FIXER_SOURCE_URL_ROOT =
 	'https://github.com/rivet-dev/agentos/blob/main/examples/workflows';
 const INSPECTOR_IMAGE =
-	'https://assets.rivet.dev/website/blog/2026-02-24-introducing-rivet-workflows/inspectorworkflow.png';
+	'https://assets.rivet.dev/website/marketing/screenshots/rivet-workflows-inspector.png';
 
 const actorsRoot = requireDocsRoot('actors');
 const workflowsProduct = getProduct('workflows');
@@ -343,9 +343,9 @@ const compositionLayers = [
 				<figure class="mt-12 overflow-hidden rounded-xl" data-site-reveal>
 					<img
 						src={INSPECTOR_IMAGE}
-						alt="Rivet workflow inspector showing a run history with nested steps, statuses, durations, and recorded details"
-						width="3808"
-						height="2338"
+						alt="Rivet workflow inspector showing a build pipeline run: plan, provision, checkpoint, write, verify, publish, and smoke-test steps with durations, and the publish step's recorded output"
+						width="2944"
+						height="2202"
 						loading="lazy"
 						class="block h-auto w-full"
 					/>