Section 01 · Core System Architecture & Product Value

The call for this section · from STRATEGY.md

那段话的毛病不是写得不好，是它把「我们是什么」和「行业为什么烂」搅在一起了。

Banner 的活是把前者单独拎出来、配一张真机器的照片，让人 1.5 秒内知道这家公司干什么——

剩下那 60% 骂行业的内容留给正文，banner 不背。

A · Cinematic —— 全景照片压字 A-cinematic

On-screen height404pxBudget 420px

Horizontal overflowNoneMust be none

Image sharpness2× or better2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

new-hero-hardware-hi.jpg 2160×1215 · 720px on screen

Notes from whoever built it

赌的是气势。 一张满栏真机器撑住整块，字退到左侧楔形暗部里，读者第一眼看到的是那条机器阵列，

第二眼才读到「We build Intelligent Food Machines.」——它是那堵墙的门牌，不是一张 SaaS hero。

用 new-hero-hardware-hi.jpg。 三个理由：2160×1215，满栏 720 上屏 2 倍要 1440，只有它够；

它是整条机器阵列的侧视，一眼看懂「我们造的是机器」；左上那面亮墙是全套素材里唯一一块能压字的大负空间。

遮罩是楔形，不是一层平铺黑。 两层叠：轻的 .ifm-scrim（左侧软洗，55% 就收干净 + 底部一点压脚

托住三层横条），深的 .ifm-plate（96° 楔子，只管压字那一侧，向下用 mask 渐隐，让左下角的机器浮回来）。

右半照片不归任何一层管。三层标签压在照片下缘本来就暗的那条上（原图该处 avg RGB 20），

三等分 + 细竖线，不配长句 —— A 版字要少。

B · 三层堆栈（Stack） B-stack

On-screen height360pxBudget 420px

Horizontal overflowNoneMust be none

Image sharpness2× or better2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

new-arm-gantry-up.jpg 1440×810 · 718px on screen

Notes from whoever built it

这版赌的是结构。 「三层原生一体」是个结构性主张，文字讲不清、图一眼就清楚 ——

所以把三层画成一张架构图：一个盒子被三条 1px 细线切成三格，层与层之间没有缝，

外面一圈边框把照片带和三层箍成同一个物件。顺序按原文 "sitting on top of these two

foundational layers" 走，03 AI 在最上，画反了就是把论点画错。amber 在堆栈里只出现一次

（03 那条 3px 竖边），标题里只上在 "Intelligent" 一个词上。

照片：../media/new-paloalto-arm-up.jpg，object-position:50% 82%。

选它是因为机械臂 + 触屏 + 真顾客同框。但居中裁（50%）会把机器整个裁掉，只剩顾客、

木台面和绿植，那条带子就变成「一家咖啡店」，跟下面的三层堆栈接不上。82% 把横条切在源图

y≈404–721 那一层：左边机械臂和夹爪、中间冲煮头和杯子、右下触屏（蓝色 UI 看得出是屏），

右上还留着坐着的顾客和长凳。遮罩右半边收着压 —— 压狠了会把臂和屏一起洗没。

脚注色用 --soft 而非 --faint：--faint 落在 --void 上只有 3.1:1，不过 AA。

C · 编辑式分栏（Editorial） C-editorial

On-screen height268pxBudget 420px

Horizontal overflowNoneMust be none

Image sharpness2× or better2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

new-paloalto-arm-up.jpg 1440×810 · 299px on screen

Notes from whoever built it

赌的是什么 —— 赌「贴脸不违和」：不往页面上加视觉重量，赌最像招股书本身的那一版最有说服力。

读者不觉得看到了广告，只觉得这份备忘录写得讲究。赢法是精致，不是响亮。

用了哪张照片 —— ../media/new-paloalto-arm-up.jpg（1440×810），不是原定的 new-arm-gantry-up.jpg。

换的理由是量出来的：龙门臂那张右侧 25–30% 被一整块深色设备侧板占满，整块看着往右歪；

object-position 从 55% 一路扫到 26%（十档）最右一条竖带始终是全场最暗——那块黑一直延伸到源图右边缘，

挪裁切根治不了。Palo Alto 这张暖光均匀、右侧是木饰面和座位区，且画面里机械臂 + 触屏 + 真顾客同框，

正好照应 deck 那句三层一体。照片上一个字都不压，只在右下角挂一个等宽小标签。

实测上屏高度 268px（≤420 预算）。

D · traction D-traction

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

E · champaign E-champaign

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

F · mirroropen F-mirroropen

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

G · monthly G-monthly

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

H · champaign2 H-champaign2

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

I · quickfacts I-quickfacts

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

J · hero2 J-hero2

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

K · travels K-travels

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

L · pitchvideo L-pitchvideo

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

M · whymatcha M-whymatcha

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

N · heroloop N-heroloop

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

O · categories O-categories

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

P · menudeploy P-menudeploy

On-screen height—Budget 420px

Horizontal overflow—Must be none

Image sharpnessNo image used2× on-screen width

Text-over-photo contrastPasses AAWCAG ≥4.5:1

Wefunder body column · real width 720px Open this version on its own ↗

Photographs used

This version uses no photographs

Notes from whoever built it

(no NOTES left for this version)

Read the full strategy for this section ↗