精选 · 开放 · 免费

Channel Studio

一个展示高端项目案例研究的高端品牌与用户体验创新工作室

AgencyStudioCurationPremiumClean

Channel Studio 网站截图

↓ 下载设计系统包 (29 MB)在 OpenDesign 中打开

原站: https://channel.studio

📦 浏览包内文件 →

01

设计气质 DNA

品牌创新用户体验设计工作室高端代理机构

创意工作室的极简主义建筑蓝图

02

色彩

#CACACAInk

#727272Ink soft

#000000BG

#111111BG soft

rgba(202,202,202,0.2)Line

在深色背景上使用严格单色与高对比度排版

03

字体

geometric-sans

display75px · 400
heading18px · 400

展示型文字采用紧密字距以增强视觉冲击力 · 全文统一使用400字重，呈现精致、统一的外观 · 左对齐排版创造出强烈的垂直轴线

04

间距

4px

8px

16px

24px

32px

48px

64px

96px

非对称的内边距，底部偏移量较大，以创建全视口区块

05

表面 (圆角 / 阴影 / 边线)

sm · 0px

md · 0px

lg · 0px

pill · 0px

无可见边框；边界由色块和大型图像定义

06

布局

1440container

12columns

24pxgutter

768 / 1024breakpoints

全出血区块，交替使用深色文字背景与大型项目图像

07

动效与交互

250msmicro

500mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

文字和导航元素的平滑不透明度过渡 · 页面区块在滚动时顺序出现

文字链接的微妙颜色变化 · 通过不透明度变化提供即时视觉反馈

08

组件

button 无背景或边框的极简文字链接，有时伴有箭头图标
card 全出血项目卡片，包含大标题和主导性背景图像
hero 沉浸式全视口区块，在纹理化深色背景上呈现大型、左对齐的陈述

09

文案语气与禁用清单

语气权威、直接且精致
标题风格 使用大型排版进行声明性、高冲击力的陈述
按钮文案 内敛、功能性的文字链接，优先保证清晰度而非视觉干扰

不要使用鲜艳的强调色——截图显示为严格的单色板，仅包含白色和灰色
不要使用粗重的边框或卡片——截图显示为无可见容器的全出血区块
不要为小号文字使用多栏网格——截图显示为充裕的留白和左对齐区块
不要使用活泼或圆润的排版——截图显示为结构化的几何无衬线字体
不要使用杂乱的导航菜单——截图显示为简单的垂直堆叠文字列表
不要使用投影来营造深度——截图依赖大型图像和高对比度文字
避免: 避免杂乱布局或过多界面元素
避免: 避免装饰性渐变或复杂阴影
避免: 避免装饰性图标或插图

10

包内真实截图

Channel Studio — 桌面首屏（hero） — 桌面首屏（hero）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Channel Studio — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Channel Studio 是一个高端品牌与用户体验创新代理机构。其视觉语言由严格的单色调色板定义，采用深邃黑色背景、清晰白色文字和用于次要元素的柔和灰色调。排版使用干净的几何无衬线字体类别，以大尺寸呈现并配合紧密字距，营造大胆的建筑感。布局高度非对称，依赖全出血区块和超大图像来展示项目案例研究。关键约束包括避免任何鲜艳的强调色、移除卡片或边框等装饰性界面元素，并保持充裕的负空间。过渡应平滑且内敛，专注于不透明度和微妙的颜色变化，而非花哨的动画。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko