SpaceX 网站预览
SpaceX 网站预览

SpaceX

指挥中心深空视窗

SpaceX 在电影级的黑暗中运作。整个界面仅有一个声音——绝对黑色背景上的偏白技术型无衬线字体,没有任何装饰性色彩与航天器及天体满幅摄影形成竞争。D-DIN,一种几何工业风无衬线字体,让每个标签都具有仪表盘读数的质感;大写字间距设为 0.09-0.10em,使导航信息呈现出指挥中心的缩略语风格。页面将视觉空间完全让渡给影像:文本漂浮在火箭和行星之上,而非被限制在独立的卡片中。按钮为细线描边,从不填充。色彩仅作为光线的函数出现——页面没有强调色、没有暖色调、没有柔和色感。

查看原始网站

使用规范

建议采用

  • 每个区块均以 #000000 为画布;页面没有其他背景表面
  • 所有标题设为 48px,使用 D-DIN-Bold 大写,字间距 0.02em
  • 所有导航项、标签和按钮均使用大写 D-DIN,字间距 0.09-0.10em——字间距不可妥协
  • 按钮设计为 1px 细线描边的透明按钮,背景色为 #f0f0fa,圆角 4px;从不填充
  • 由满幅摄影承载整个页面;文本块始终被限制在视口左三分之一区域
  • 元素间距设为 18px,区块垂直节奏设为 60px
  • 正文设为 13px,行高 1.7,字间距 0.10em——宽字间距是其标志性特征

建议避免

  • 绝不引入任何色彩强调——系统设计为单色
  • 绝不使用填充按钮背景;所有操作均为描边形式
  • 绝不将文本置于卡片、面板或有色容器中——文字直接漂浮在摄影或黑色背景上
  • 结构元素的圆角绝不超过 4px(32px 仅用于胶囊控件)
  • 绝不使用具有人文或编辑感的字体;系统要求工业风几何字体
  • 绝不添加阴影、渐变或发光效果——页面没有任何立体感
  • 绝不使用会割裂影像的布局网格;所有区块均为满幅单列