IFM Overview · Section 05

Platform Empowerment Strategic Roadmap
From one machine to a platform

10 versions side by side, every one at the real on-screen size of the Wefunder body column, 720px. Every number below is measured live by script, not self-reported by whoever built the version.

← Back to the overview
The call for this section · from STRATEGY.md

这一节的毛病不是写得不好,是它把"打算做的"写成了"已经做到的"。

原文 204 词里 35% 是形容词(extremely robust / error-free / superior performance),

而平台/授权收入到今天是零(Audit-09 == Audit-01)——

读者带着这段话去读 "Platform Empowerment" 这个标题,最自然的结论是"平台业务已经在跑了"。

Banner 的活只有一个:把"已经站住的"和"正在建的"在版面上切开,让人一眼看见那条线在哪。

不是靠一句免责声明,是靠布局本身——已建成的一侧有照片、有实心字、有店名;

在建的一侧是虚线、空心、网格底。看图就知道哪半边还没盖完。


A · Ledger —— 两栏台账,右栏是个空框 A-ledger

On-screen height412pxBudget 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-hardware-island.jpg 1200×675 · 309px on screen
Notes from whoever built it

赌的是坦白本身就是设计。 左栏"已经在跑"有照片、有实心方块、有黑字;

右栏"在建"是一个画着网格的虚线空框,里面写 IN DEVELOPMENT。

这一节最大的风险是读者把路线图读成业绩(平台/授权收入到今天是零),

与其在角落里加一句免责声明,不如把"那一半还没有东西可拍"直接画出来 ——

一个字都不用解释,扫一眼就知道哪半边还没盖完。

用 new-hardware-island.jpg。 它是全套素材里唯一一张把整座机器岛拍成

一台摆在房间里的独立机器、而不是一段店内吧台的 ——

这一节讲的就是"这台东西可以搬到别人的店里去",画面得先立住这个前提。

1200 宽的图,这里上屏 309px,视网膜 2 倍要 618,够。

上下扫过三档逐张看:58% 是唯一能把柜顶到柜脚整块留在画面里的一档;

46% 切掉柜底、剩下像个吧台;74% 露出脚轮、但把一把黄椅子拖进画面。

这一版有意不放 deck。 deck 那三件事(自研硬件 / 三家店都是我们运营 / 平台层在建)

下面两栏逐条都讲了,留着就是在 400px 里把同一句话说两遍 —— 那正是原文的毛病。

代价说在前面:整块 banner 有近四分之一的面积在讲"我们还没有"。

另外那个虚线空框有可能被当成图片没加载出来 —— 网格底和居中的 IN DEVELOPMENT

是为了压住这个误读,但要是 Jack 觉得不值,这一版整个换掉比改掉它更干净。


B · Rail —— 阶段轴,实线走到第二站就变虚线 B-rail

On-screen height384pxBudget 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 · 718px on screen
Notes from whoever built it

赌的是路线图的形状。 上面一条满栏照片压标题,下面一条两站的轴:

第一站是实心 amber 圆点,实线拉到第二站;第二站是空心圆点,**从那儿开始线变成虚线,

一直虚着走出右边框,不收口。** 线的材质在哪儿变,工作就在哪儿停 ——

"分几步、现在走到第几步、后面还没走完"三件事由一根线一次说完,不用一个 will。

用 new-hero-hardware-hi.jpg。 2160×1215,满栏 718 上屏要 1436,全套素材里够这个宽度的

只有 13 张,这一节能用的里它最有规模感:一整条机器阵列,一眼是"我们造的是机器"。

横向裁切是量出来的,不是挑出来的。 这张图右半整条都是黑机身,越往下越黑;

标题只占左边 62%,右边那 38% 得靠照片自己说话。上下扫过九档,量每档右 38% 的

均值/标准差/p95:pos 70% 是 mean 26.8 / p95 78(渲出来一条黑带),

pos 20% 是 mean 42.5 / p95 153(杯桶反光和柜顶亮边都在)。选 20%。

代价是压字区落到亮墙上(mean 222)—— 那是遮罩能解决的问题,

右半没有亮部是遮罩解决不了的问题。


C · Split —— 左边是照片,右边是字,那条竖线就是分界 C-split

On-screen height386pxBudget 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 · 288px on screen
Notes from whoever built it

赌的是贴脸不违和。 左边整栏照片 = 已经在跑的那一半(它有画面可拍),

右边暖纸文字栏 = 在建的那一半(它只有字)。两边各挂一个状态章:

照片底下压 RUNNING TODAY,文字栏下半挂 IN PROGRESS。

分界就是中间那条竖规则线 —— 不加箭头、不加时间轴、不加任何"图示",

读者的感觉应该是"这是招股书里的一块版面",不是"这里插了一张广告"。

用 new-arm-gantry-up.jpg。 1440×810,这里上屏 288px 宽,视网膜要 576,够。

选它是因为竖裁之后它是三张候选里唯一还有人在里面的:龙门臂在出杯,

后面站着店员 —— "我们自己在运营这三家店"这句话在照片里就已经说了一半。

横向那一档差点毁掉整栏。 竖裁只看得见源图 49% 的宽度。

38% 那一档会把右边那台失焦的银灰机器切进来四分之一幅,渲出来是一根发灰的空柱子。

改到 20%(源图 x 10%–59%):前景虚化机身 → 出品柜 → 龙门臂立柱和相机头 → 暖木吧台,

一条竖着的景深。

照片上的实心方块用白不用 amber —— 一块 banner 只强调一处,amber 归 H1 的 platform。


D · A · 相位轨(Phase Rail) D-phaserail

On-screen height405pxBudget 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
  • cand-kiosk-up.jpg 1440×1440 · 718px on screen
Notes from whoever built it

赌的是把 NOW / PLANNED 那一刀画成一条时间轴。 分界不靠颜色也不靠标题,靠线本身的材质 ——

同一条横轨横穿 banner,走到 Phase 02 就变虚线,轨上的点也从实心变空心。

原文一半的字(102/204 词)是没出处的形容词,error-free 更是可证伪的绝对断言,全删;

换成四条带 WF 编号的事实 + 两条 We plan to,脚注主动写明「没有第三方在运营、没有授权收入」。

照片用 ../../_media/cand-kiosk-up.jpg —— 本节四张里唯一够 1440、能满栏的一张。

横裁 301px,Y 扫过 38/49/60/70 四档取 60%:38、49 整条太暗读不出东西,

70 会把 Avantco 冷柜的厂牌贴纸拉进左下角(别家商标,不上招股页)。

实测上屏高度 405 px。


E · B · 对开(Diptych) E-diptych

On-screen height380pxBudget 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-champaign-bar-up.jpg 1440×810 · 538px on screen
Notes from whoever built it

赌的是一个隐喻:已经在跑的那半边有照片,计划的那半边是一张白纸。

不识字也看得出哪边是真的。缝上再补一条虚线分栏线 —— 往右走,证据没了。

标题整块落在暖纸上、一个字不压照片,最像招股书本身。

代价是事实只装得下两条(tea/cold-brew、清洁与远程监控留给正文),换来的是照片说话。

照片用 ../../_media/new-champaign-bar-up.jpg —— 它就是 H1 底下那条证据说的那家店,

台面上三杯颜色完全不同的饮料就是「同一台机器,不同品类」的画面版。

这张两侧各约 180px 黑边(真实画面只有 1081px),

把 img 放大到 133.21% 再左移 16.605%,黑边正好挤出容器两侧。

实测上屏高度 380 px。


F · forwardplan F-forwardplan

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 · channel G-channel

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 · tam H-tam

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 · flywheel I-flywheel

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 · map J-map

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 ↗