精选 · 开放 · 免费
Sick Agency
一家专注于完整产品包装、拥有大胆且以字体排印为先视觉形象的表现型数字设计代理。
AgencyExpressiveBold TypographyPlayfulConsumer
01
设计气质 DNA
创意代理表现力包装大胆
一本充满活力、受街头艺术启发的数字杂志。
02
色彩
#0029FFAccent
#FFC700Ink
#FF4E27BG
rgba(255,199,0,1)Line
高对比度、充满活力的调色板,使用活力橙作为主背景色,搭配大胆的黄色字体排印,并以醒目的蓝色点缀交互元素。
03
字体
condensed-grotesque · transitional-serif
- display
200px · 900 - display-sm
160px · 900 - body
24px · 400
展示字体使用全大写 · 为紧缩的怪诞展示字体保持紧凑的字间距 · 正文使用过渡衬线字体以形成对比
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
非对称且紧凑,由密集的字体排印布局而非严格网格决定。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
使用背景色(#FFC700)的1px实线来划分布局区块。
06
布局
1440container
12columns
16pxgutter
768 / 1024breakpoints
非对称、密集的区块化布局,带有强烈的垂直和水平分割线。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.34, 1.56, 0.64, 1)easing
交互元素上的弹跳弹簧过渡 · 平滑的不透明度淡入
使用弹跳缓动曲线的细微缩放或颜色过渡。 · 标准的指针交互,带有即时反馈。
08
组件
- button 圆形的蓝色徽章,带有白色文字和虚线边框。
- card 由边框线条而非阴影或背景色定义的字体排印块。
- chip 用于社交图标的星爆形容器。
- hero 全幅、密集的字体排印构图,包含重叠元素和垂直文本。
09
文案语气与禁用清单
- 语气 大胆、自信且略带不羁。
- 标题风格 简短、有力,且常为全大写。
- 按钮文案 直接且具有指令性(例如,'联系我们')。
- 不要使用细字体——截图显示的是极其粗壮、厚重的字重。
- 不要使用宽字间距——截图显示的是展示字体上紧凑的字距调整。
- 不要使用柔和、不饱和的颜色——截图显示的是高饱和度的橙色和黄色。
- 不要为主要按钮使用圆角矩形——截图显示的是圆形、带虚线边框的徽章按钮。
- 不要使用大量留白——截图显示的是密集、紧凑的布局。
- 不要为正文使用无衬线字体——截图显示段落使用的是过渡衬线字体。
- 避免: 含蓄
- 避免: 柔和色调
- 避免: 标准的商务术语
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个高度表现型的数字设计代理网站,专注于完整产品包装。主调色板由活力橙背景(#FF4E27)、大胆的黄色字体排印(#FFC700)和醒目的蓝色点缀(#0029FF)构成。字体排印是紧缩怪诞体用于巨大的展示标题和过渡衬线体用于正文的混合。关键设计规则:1) 优先考虑巨大、厚重的字体排印而非图像。2) 保持密集、紧凑的布局,最小化留白。3) 使用大胆、高对比度的颜色,避免任何柔和或不饱和的色调。4) 避免使用标准的矩形UI组件,改用富有表现力的自定义形状,如星爆形和虚线圆形徽章。5) 保持字间距紧凑,并对展示元素使用全大写以维持视觉冲击力。
en · zh-CN · zh-TW · ja · ko