精选 · 开放 · 免费
Tomorrow Happens Studio
一个极简主义设计工作室的落地页,使用连续的、淡入淡出的诗意滚动,并以静态词汇'Tomorrow'为锚点。
StudioEditorialTypographyCalmRestraint
01
设计气质 DNA
极简诗意设计工作室沉思
一本安静的诗集,以单个词汇为锚点
02
色彩
#000000Ink
#ffffffBG
#e3e3e3Muted
rgba(0,0,0,1.0)Line
高对比度极简主义,使用严格的单色调色板,并通过变化透明度来建立视觉层次。
03
字体
transitional-serif
- display
39px · 200 - body
12px · 500
04
间距
4px
8px
16px
24px
32px
48px
60px
96px
充足的留白,主要展示文本采用紧凑的行高。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 0px
使用1像素纯黑实线作为精细、精确的导航分隔线。
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
侧边栏导航,主要内容集中在一个垂直滚动的文本块上。
07
动效与交互
150msmicro
500mssmall
0msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
连续的垂直滚动,单行文本伴有透明度淡出
导航项目透明度淡出。 · 在侧边栏和页脚导航链接上触发。
08
组件
- button 纯文本导航链接,后缀为'+'。
- hero 一个全屏的、连续的文本滚动,带有一个固定的、静态的锚点词汇。
09
文案语气与禁用清单
- 语气 诗意的、沉思的、富有哲理的
- 标题风格 小写、句首大写的、碎片化的陈述,持续滚动
- 按钮文案 带'+'后缀的极简文本链接
- 不要使用明亮的强调色——截图显示的是严格的单色黑白调色板。
- 不要为展示文本使用粗重的字体权重——截图显示的是非常纤细、优雅的衬线字体。
- 不要使用投影或复杂的3D效果——截图显示的是完全扁平的二维元素。
- 不要为按钮或卡片使用圆角——截图显示的是尖锐的、几何的、无边框的布局。
- 不要使用杂乱的背景图案或图像——截图显示的是干净、纯白的背景。
- 不要使用复杂的、多层级的导航菜单——截图显示的是简单的、扁平的文本链接。
- 避免: 大写标题
- 避免: 明亮的强调色
- 避免: 密集的段落
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个极简主义设计工作室作品集。其主要视觉标识建立在纯白(#ffffff)和纯黑(#000000)的鲜明单色调色板上。它主要依赖纤细的过渡衬线字体来呈现诗意、持续滚动的展示文本,并与用于导航的小号无衬线怪诞体形成对比。核心交互是垂直滚动,为文本创造淡入淡出的效果。关键的禁忌包括:永远不要使用明亮的强调色,永远不要为展示文本使用粗重的字体权重,永远不要为元素添加投影、复杂边框或圆角。设计应保持严格的扁平、通透且以排版为核心。
en · zh-CN · zh-TW · ja · ko