首都国际机场·数据巨幕重构实录
——以「快缩短网址 suo.run」之名,呈现一次极致的可视化修行
一、开场白
当一块 8K 巨幕悬停于首都机场 T3 航站楼的穹顶之下,它不再是冰冷的终端,而是一枚跳动的心脏。我们以「快缩短网址」的极简哲学,将庞杂的航班数据淬炼成一束光,投射在旅客抬眼即见的方寸之间——让每一道目光,都能瞬间读懂天空的脉搏。
二、主题叙事:以线为骨,以光为魂
1. 母题:3D 地球并非炫技,而是“天地一张网”的隐喻。航线化作纤若蚕丝的光束,缠绕蔚蓝星体;飞机似萤火,沿既定轨迹编织瞬息万变的拓扑。
2. 视觉克制:除地球外,其余元素一律纤细、留白。条形图、环形图、柱形图均以 0.5 pt 线宽勾勒,与地球的光轨同宗同源,形成“重—轻—重”的呼吸节奏。
3. 色彩语法:
• 出港——青霓,象征离弦之箭;
• 进港——湛鸢,象征归巢之翼;
• 延误——琥珀,低饱和暖黄,情绪映射“等待”;
• 取消——绛砂,低饱和暗红,情绪映射“停滞”。
三、版式与元素
1. 标题:左侧静态标题过于板正,改为 8° 右斜体,微渐变自青霓至湛鸢,与航线同色联动。
2. 辅助信息:天气、AQI、时间以 40% 透明度的极细 Sans Serif 置于右上角,像机场塔台的轻声播报。
3. 负空间:刻意去除所有图表边框,仅用 1 px 分割线区分模块,让巨幕获得“云端”般的悬浮感。
四、图表淬炼
1. 总航班量
原图:堆叠柱状图,延误/取消淹没于总量。
重构:双环形嵌套——外环示“出港 / 进港”总量,内环以琥珀与绛砂点亮异常航班。一眼即知比例,二眼可追细节。
2. 延误 TOP5 机场
原图:环形图误用,排名隐晦。
重构:极坐标条形 + 环形注释。条形长度即排名,环形内部以 5° 刻度标注城市代码,兼顾多样性与直观性。
五、文案微雕
1. 关键词前置:
原「今日进港前五」→「延误·进港 TOP5」
原「今日出港前五」→「延误·出港 TOP5」
2. 数据格式:所有航班数强制整数,千位空格分隔,小数点视为设计事故。
六、3D 地球:从 Cinema 4D 到 ECharts-GL
1. 资产管线:
• 球皮:NASA Blue Marble 8K,PS 冷色曲线 + 10% 锐化;
• 凹凸:灰度高度图 × 0.3 强度;
• 航线:LON-LAT Connection 插件生成贝塞尔曲线,X-Particles 以 Hair 渲染,0.3 mm 粗,青霓/湛鸢双通道;
• 飞机:低多边形 A320 模型,Align to Spline 动画,切线锁定,速度 800 km/h 等比映射。
2. 落地:导出 2048×1024 球皮 + JSON 航线坐标 → ECharts-GL globe 组件替换贴图,GLSL 片元着色器重写光效,15 min 轮询刷新。

七、开发协同
1. 设计前:与前端约定「不可交互」原则,避免伪需求。
2. 设计中:实时同步 Figma → ECharts 在线 Demo,色值、线宽、动效时长全部 token 化。
3. 设计后:交付 Zeplin 标注 + C4D 源文件,开发直接读取路径曲线坐标,零损耗还原。

八、尾声
当最后一架飞机滑入跑道,巨幕上的光轨悄然熄灭——像一句被「suo.run」压缩后的短链,只留下最精炼的信息:
“此刻,天空无恙,旅途平安。”
