# feat\(brand\): add original ATLANTIS logo and brand assets · PR \#134 · flambo/atlantis [View on GitCafe](https://git.cafe/flambo/atlantis/pull/134) Repository: [flambo/atlantis](https://git.cafe/flambo/atlantis) Visibility: public State: open Source repository: flambo/atlantis Source branch: feat/brand Target branch: perf/optimize Head commit: f75e6899d148b4f318c7c654876cf58cedb1450e [Discussion and reviews](https://git.cafe/flambo/atlantis/pull/134) [Commits](https://git.cafe/flambo/atlantis/pull/134/commits?format=markdown) [Files changed](https://git.cafe/flambo/atlantis/pull/134/diffs?format=markdown) ## Description --- > [!NOTE] > 🤖 **GPT-6.1-Sol on behalf of Oliver** ## Round 3 review fixes Replace Confluence with Flow trident: one shaft divides into three curved upward flows with pointed tines. Update both apps' mark, lockup, SVG/ICO favicon, Apple-touch, ordinary and maskable icons, and landing OG artwork. Wordmark and component geometry remain intact. Maskable artwork fits the central safe circle; the existing brand test now checks downloadable asset responses. Own-tip verification: format, lint, typecheck, production build, 235 web tests, 76 Playwright tests and landing lint/build passed. Human review: compare the concept sheet and selected mark at 16/32/64/256px, header/favicons in both themes, and maskable icon placement. The previous Confluence evidence below documents the before state; Flow trident is the shipping mark. Replace the raster Cisco-style bar-and-wave logo with an original Flow trident mark. Three input paths converge at a diamond node and continue as one stream, matching ATLANTIS's aggregation work. The mark has two paths on a 32-unit grid and stays readable at 16 pixels. Its blue is the dashboard's existing `--primary: #2563eb` token. Layer 5 is based on `perf/optimize` in [#133](https://github.com/flamboh/atlantis/pull/133), following [#131](https://github.com/flamboh/atlantis/pull/131), [#130](https://github.com/flamboh/atlantis/pull/130) and [#129](https://github.com/flamboh/atlantis/pull/129). Nothing merged. Layout changes only accommodate the mark; the header wordmark shrinks below the small breakpoint so the theme control stays visible at 320 pixels. ## Concepts and visual review Four distinct hand-drawn concepts were compared at actual 16/32/64/256 pixel sizes on light and dark backgrounds. Confluence has the clearest small-size input lanes and the most direct aggregation meaning. Flow A is closer to familiar triangular technology marks; Tidal packet is a common waveform; Stream bend suggests RSS or routing more than analysis. **The alternate concepts remain available for Oliver to choose instead.** The [interactive comparison sheet](https://0owmnrc1nq4y.postplan.dev) includes downloadable SVGs for all four concepts. The sources, all 32 PNG renders and decision notes remain under `/tmp/atlantis-frontend-overhaul/brand/`. ![Four logo concepts in light and dark contexts at 16, 32, 64 and 256 pixels](https://github.com/user-attachments/assets/13b2e8d6-4952-4bf1-8614-b734e8ea2047) Before, the raster logo: ![Before: Cisco-style vertical bars and rising signal curve](https://github.com/user-attachments/assets/654f38f7-1ad0-42b7-888c-1c1150b31235) After, the selected original mark and outlined lockup: ![After: Confluence mark at 16, 32, 64 and 256 pixels in both themes, plus ATLANTIS lockup](https://github.com/user-attachments/assets/dba2641e-90c7-45be-b7e1-a6304782dac5) ## Assets and integration Both `apps/web/static` and `apps/landing/public` contain `logo-mark.svg`, the font-free outlined `logo-lockup.svg`, `favicon.svg`, `favicon.ico` with 16/32/48 images, `apple-touch-icon.png` at 180, and `icon-192.png` / `icon-512.png`. The landing site also has a 1200×630 `og-image.png` and OG/Twitter metadata. Production absolute OG URLs use the existing `PUBLIC_SITE_URL` build setting; previews without it use a relative local image path. The Svelte and Astro logo components reference the deployed SVG mark through ``, inherit the theme's CSS blue, and use each app's existing CSS font for the live wordmark. The lockup has the accessible name ATLANTIS; decorative parts stay hidden from assistive technology. Both old `favicon.png` files and every reference are removed. The landing site's legacy `cisco-blue` token becomes `brand-blue`, matching the dashboard. There is no existing manifest or installation flow, so the 192/512 PNGs are supplied without adding a PWA manifest or maskable installation behavior. The SVG favicon is 312 bytes versus the former 9,582-byte PNG, a 96.7% reduction. The ICO fallback is 870 bytes. Total public brand assets are 11,071 bytes for web and 35,277 bytes for landing, including its OG image. These are file-size measurements, not a new page-performance benchmark. Layer 4's timings are not re-measured or claimed as results of this PR. ## Verification and human review guide Automated checks pass: `bun run format`, `bun run lint`, `bun run typecheck`, `bun run test:web` with 220 tests, `bun run test:e2e` with 72 tests, `bun run --cwd apps/landing lint`, and `bun run build:landing`. The changed Astro files also pass the installed Astro Prettier plugin explicitly. New e2e cases verify the accessible logo, keyboard home navigation, 320px header control bounds and spacing, and SVG/ICO/Apple icon HTTP 200 responses in both themes. Independent manual Chromium QA completed 183 checks with no open layer-5 regression. It covered all eight dashboard cards, all 12 file charts, controls, hover/keyboard/legends/brush/drilldown, URL/history, lazy activation, empty/error recovery, both themes and 320/390/768/1280/1920 layouts. Logo painting and inherited color were verified with pixels, icon responses with HTTP/content types, and the landing links and 1200×630 OG image with browser navigation/decoding. The original 320px clipping finding was fixed and rechecked. The separate final header browser pass completed 50 checks at 320/360/390/768/1280 pixels in both themes, with no page or console errors. At 320 pixels, the visible wordmark-to-Home gap is 8px and the theme button ends at 301.77px. Keyboard links, theme persistence and actual blue mark painting pass on the final deployed build. The stable landing preview also passes the final confirmation. Reports are `brand/qa/report.txt` and `brand/qa/final-header-review.md` locally. All 330 broad-pass screenshots and raw real-data observations remain private under `/tmp/atlantis-frontend-overhaul/brand/qa/`. For human review: - Compare all four concepts at 16 pixels and decide whether Confluence is the preferred direction. All alternatives remain selectable through their downloadable SVGs. - Open Home, a dataset, Files and an error route on perf :8090. Check the same mark, unchanged wordmark font, light/dark colors and keyboard home link. At 320 and 390 pixels, every header control should remain visible and usable. - Open the landing preview or a `PUBLIC_SITE_URL` build. Check the mark, three outbound links, SVG and ICO favicon links, Apple icon and 1200×630 public-only OG image. Review the separate outlined asset wordmark if it will be used outside the apps. - Native Safari/Firefox favicon selection, Apple home-screen presentation and a full screen-reader session remain manual checks. No manifest/install experience is introduced. Only the isolated perf stage was redeployed. Its data mount is read-only; source database metadata and the recorded prod process state remain unchanged. Test/prod :8080 and Cloudflare were not modified. Private real-data QA screenshots remain local; only public brand evidence is attached here. Changes made by GPT-6.1-Sol through the Codex harness in T3 Code. ![Original trident concepts and native-size theme comparisons](https://github.com/user-attachments/assets/ee4db500-f127-49f6-9606-3cd6be7c11fc) ![Before: Confluence. After: selected Flow trident](https://github.com/user-attachments/assets/0bdc381c-b8d1-4b3b-bc3d-a61fefcf166f)