Telepathic Instruments 网站预览
Telepathic Instruments 网站预览

Telepathic Instruments

广播控制室在黄金时刻——黑曜石屏幕,温暖奶油色纸张,一盏钨丝灯

Telepathic Instruments 在工作室暗调、广播清晰的视觉风格中运作:大气摄影满幅覆盖逐渐过渡到白色产品表面和胶囊形控件,唯一鲜明的色彩是单个明亮的橙色,其余世界则为单色。排版是品牌的最强表达——Suisse Intl 采用接近展示尺寸,搭配激进的负字间距(最高达 -0.03em),使标题读作工程样本而非营销文案。该美学借鉴了音频硬件UI和包豪斯标识牌:细线边框、平面表面、单一功能强调色、充足的负空间。组件保持低字重和手势感——胶囊按钮、透明描边链接、柔和 24px 的卡片圆角——让产品图像和音乐设备截图承担视觉重量。

查看原始网站

使用规范

建议采用

  • 仅在页面上最核心的动作中使用 Solder Orange #ff6c2f,且仅限一次最大值。所有其他操作使用 Carbon Black 或透明变体。
  • 将显示标题设为 100px 字号,-0.0300em 字间距和 0.85 行高,使用 Suisse Intl 400 字重。紧密的字间距是其标志——禁止松动。
  • 为所有产品卡片、社区照片和大表面容器设置 24px 圆角。输入框、标签和小型UI元素使用 2px,所有按钮和胶囊控件使用 9999px。
  • 所有按钮文本、导航链接、标签以及任何应读作技术或仪器级的元素,均使用 Suisse Intl Mono。保持全大写,正常字间距。
  • 让浮动的深色胶囊导航位于内容上方,顶部留有充足的间距(56px 以上)。它是访客最先看到的内容,必须读作控制台。
  • 构建以图像为主的卡片网格:满幅摄影填充卡片边缘,文字叠加或置于极简的标题条中。
  • 各区块之间以 80px 的垂直间距对齐。舒适的密度需要留白——不要将区块压缩到低于 56px。

建议避免

  • 不要引入额外的强调色。整个色彩系统仅限于一个橙色。加入蓝色、绿色或第二个橙色会削弱信号。
  • 不要在卡片或面板上使用柔和的阴影。设计刻意保持平面——深度来自表面色彩变化和摄影,而非堆叠。
  • 不要将正文文本设置在 14px 以下。Suisse Intl Mono 特别在 12px 以下变得无法辨识;仅用于真正标签。
  • 不要对正文段落进行居中对齐。所有非首屏内容区块均使用左对齐的两栏标题(标题在左,描述在右)。
  • 不要将 Bone 米色 #d7cdb8 用作按钮背景或交互表面——它仅作为装饰性底纹。交互行为存在于中性/橙色二元体系中。
  • 不要在 Suisse Intl Mono 上添加字间距。它本身已具技术感;增加字间距会破坏仪器级的语气。
  • 不要在 Suisse Intl 与 Suisse Intl Mono 之外混合使用无衬线字体。禁止使用衬线字体引入,最终输出中不得使用系统字体回退。