首页/风格学院/Perplexity AI

设计风格指南

什么是 Perplexity AI?

Perplexity AI 设计风格示例

Perplexity AI 将严肃的研究披上午夜图书馆的美学外衣——深色界面、电光青绿色引用,以及学术论文般的信息密度。

Perplexity AI 速览

Perplexity AI 是一款 AI 驱动的问答引擎,其视觉标识——深蓝黑色底面、唯一的电光青绿色点缀、等宽字体的引用标记,以及密集排版的文字——传递着清晰的文化信号:这是认真的人现在搜索的方式。2022 年由一批前 Google 和 Meta AI 研究员在旧金山创立,产品将对话式 AI 与实时信源检索结合,而其设计使这种结合可见——每一条答案都附有编号引用;界面从不让用户忘记,每一个论断都有来源。

传统搜索引擎将色彩与图像散落在广告、组件和轮播图中,Perplexity 则将界面剥离至其认识论核心:深色表面、接近纯白的阅读文字,以及承载着明确含义的青绿色超链接——这条事实有来源,可以核实。最终呈现的设计语言,比起消费级应用,更接近一个维护良好的学术数据库或研究终端。它刻意反对活泼、反对装饰、反对环境感。

这种美学被称为「午夜图书馆」——这个短语同时捕捉了界面的暗色调和其学术意图的严肃性。这不是作为流行趋势而采用的深色模式;这是一种完整的视觉立场。青绿色点缀并非任意的品牌色,而是一个语义标记:它标识每一条经过检索、归因与链接的信息。这套设计使认识论变得可见。

Perplexity AI 设计风格用在文章页上

Perplexity AI 从何而来?

Perplexity AI 于 2022 年 8 月由 Aravind Srinivas、Denis Yarats、Johnny Ho 和 Andy Konwinski 共同创立——四人均是 AI 研究社群中有深厚根基的研究员或工程师,拥有来自 Google Brain、DeepMind、OpenAI、加州大学伯克利分校和 Meta AI 的工作经历。担任 CEO 的 Srinivas 曾研究强化学习与生成模型,Yarats 专注于模型优化;创始团队的综合背景不在于消费级产品设计,而在于大语言模型检索与推理信息的机制。这种以研究为先的背景塑造了产品身份的方方面面。

2023 年逐渐成形、并在 2024 年趋于稳定的视觉标识,并非由传统品牌机构基于情绪板设计而来。它从产品功能中生长出来:一个实时检索、排序并引用信源的界面,需要一套能使引用变得清晰且主要——而非次要——的设计语言。选择深色基底——深蓝黑而非通用深色模式中的平板黑——赋予界面一种更接近深夜研究终端或彭博终端的气质,而非消费级社交产品。它在说:这是用来工作的。

青绿色点缀进入设计,并非作为任意的品牌差异化元素,而是一个功能性选择。在一个充满接近纯白阅读文字的深色界面中,暖中性色调的点缀会融入排版场域。青绿色——电光的、冷调的、与屏幕上任何环境元素都不相同——能立刻被读取为可交互的、有来源的、可点击的。它是脚注上标在视觉上的等价物:一个信号,告诉你这个词或这个数字指向别处。整套引用系统建立在这一单一点缀色对深色背景的可读性之上。

到 2024 年,Perplexity 的视觉系统在设计界引发了广泛关注——不是因为它华丽或追逐潮流,而是因为它代表了一种罕见的东西:一个由认识论功能决定美学的产品界面。设计说明产品做什么。功能与外观之间的这种一致性——AI 搜索时代的「形式追随功能」——将 Perplexity 置于一个重视目的清晰性胜过视觉丰富性的设计传统之中,也使其界面成为 2020 年代初 AI 产品浪潮中被研究和引用最多的界面之一。

Perplexity AI 的视觉特征是什么?

深色底面

基底表面是深蓝黑——不是通用深色模式中的平板黑,而是一种带有可感知的蓝色深度的颜色,读起来像空间而非虚空。这一选择并非装饰性的;它创造了视觉语境,使青绿色点缀达到最大可读性,使接近纯白的阅读文字达到最大对比度而不显刺目。深色底面传递严肃、专注与没有环境干扰的信号——它是研究环境的颜色,而非娱乐环境的颜色。

青绿色引用点缀

整个设计系统中,唯一的点缀色是一种电光青绿——冷调、发光,且不可能与界面的任何环境元素混淆。其功能在美学之前是语义性的:青绿色标记所有经过检索、归因与链接的内容。引用编号、超链接、交互控件,以及高亮的信源引用,全部共享这一颜色。因为只有一种点缀色存在,用户的眼睛会立刻学到:青绿色意味着「这里指向别处」——一种习得的视觉语法,使以引用为先的体验保持连贯。

等宽字体引用标记

信源编号与行内引用标记使用等宽字体渲染,刻意与答案和正文所用的比例字体区分开来。这一排版选择同时承载多重含义:等宽字体与代码、终端和技术精确性有悠久的关联;它表明这个数字是引用标识符而非正文词汇;它制造了一种视觉质感的转换,使引用立即可扫描。效果如同学术论文的上标标注,但更大、更易读,且贯穿整个系统。

信息密度

界面被设计为在不产生视觉混乱的前提下容纳高信息密度。文字以尊重复杂答案长度的阅读尺寸排版;行距经过校准,支持持续阅读而非略读;多个信源、追问问题和相关面板可以在版面中共存,而不会破坏性地竞争注意力。这种密度并非设计拥挤的意外产物——而是一种刻意的立场,它在说:来到这里的用户有能力阅读,而不仅仅是扫视。

正文衬线字体

长篇答案使用衬线字体渲染——对于一款科技产品而言,这是不寻常的选择,也是刻意的信号。衬线字体与严肃阅读有悠久的关联:书籍、学术期刊、报纸、法律文件。为 AI 生成的答案使用衬线字体,是在说:这些答案值得作为文本被阅读,而不是作为要点被略读。它也与等宽字体引用标记形成强烈的排版对比,强化了区分正文与引用的视觉语法。

零装饰噪声

界面中没有为丰富视觉而使用的渐变,没有环境光晕效果,没有插图图像,没有装饰边框,没有任何颜色被用于语义目的之外。背景区域是平面的;分割线是简单的线条;面板通过表面明度的细微变化而非投影或边框来划定。这种克制并非为克制而克制的极简主义——它是图书馆规则在视觉上的等价物:所有存在的元素都服务于一个目的,而视觉噪声是一种谎言。

焦点状态的清晰度

交互元素——输入框、按钮、引用链接、信源面板——具有精确且一致的焦点与悬停状态,全部通过青绿色点缀和锐利的边缘变化来表达,而非柔和光晕或透明度变化。这种精确性对于在持续研究会话中使用的界面至关重要——用户需要清楚地知道什么是激活状态,什么不是,没有视觉歧义。焦点处理是最严格意义上的功能性设计:它的存在是为了减少复杂多步研究中的认知负荷。

Perplexity AI 设计风格用在仪表盘上

谁塑造了 Perplexity AI?

Aravind Srinivas

Perplexity AI 联合创始人兼 CEO,Srinivas 此前在 OpenAI 和 Google Brain 从事强化学习与大规模生成模型研究。他的研究背景塑造了产品的核心主张:AI 不应仅仅生成答案,还应检索、归因并呈现答案背后的信源。这种认识论承诺——将每一个论断视为需要引用的东西——是设计系统背后的哲学引擎。Srinivas 始终将产品描述为「问答引擎」而非聊天机器人,这一区分对界面处理信息的方式产生了直接的视觉影响。

Denis Yarats

联合创始人兼 CTO,Yarats 从 Meta AI Research 和加州大学伯克利分校的工作经历中带来了深厚的模型优化与效率专业知识。他的技术工作确保了 Perplexity 答案背后的实时检索架构,能够以搜索替代产品所要求的延迟水平运行——快到足以让界面同时呈现多个信源,而不使用户体验崩溃。设计的信息密度之所以清晰可读,是因为其背后的检索系统足够快速,使密度变得值得。

Johnny Ho

联合创始人兼总裁,Ho 凭借在 Quora 等机构及多家研究机构的从业经历,带来了机器学习基础设施和系统方面的专业知识。他在信息检索系统方面的背景直接影响了产品大规模呈现有来源答案的方式。界面以引用为先的视觉语法——每一条答案都与其信源密不可分——反映了一种超越表面视觉设计的、对信息架构的系统级理解。

Andy Konwinski

联合创始人,Konwinski 带来了学术与开源 AI 基础设施领域的经验——包括参与 Apache Spark 和 Databricks——这使创始团队在研究社群和企业用户中同时获得了公信力。他的背景将产品定向于有复杂信息需求而非随意查询的用户,而设计直接反映了这一目标受众:午夜图书馆美学并非为所有人设计,这是有意为之。

今天怎么用 Perplexity AI?

Perplexity AI 的视觉系统高度可移植至任何以权威性、信源透明度和知识严肃性为核心价值的场景。正确应用它,意味着理解这套系统实际上在做什么:深色底面创造专注;青绿色点缀在排版场域之上创造语义层;信息密度传递能力感。仅仅复制表面外观——深色背景、一种亮色——而不复制其底层逻辑,会产生一个看起来戏剧化但什么也没有传递的界面。

对于演示文稿,Perplexity 风格在封面页和数据密集型内容页上效果最佳。这种风格的封面以深色底面为场域,以大号衬线字体或中性比例字体设置标题,青绿色点缀仅保留给单一组织性元素——日期、类别标签或信源说明。内容页应被当作阅读环境处理:充裕尺寸的文字、足够的行距、青绿色仅用于链接或引用信源,无装饰性图像。数据页采用研究简报的美学:图表被剥离至其基本几何形;信源标注以等宽字体脚注出现在可视化下方;青绿色之外的颜色仅在数据本身需要类别区分时使用。

对于网页界面——仪表板、分析工具、文档站点、定价页面和研究平台——Perplexity 系统提供了强大的基础。方法如下:以深蓝黑或极深中性色作为基底表面,所有主要阅读文字使用接近纯白;青绿色专门保留给交互和链接元素。卡片组件应通过表面明度的细微变化——而非投影或粗边框——来建立层次;目标是一个读起来有层次感但从不拥挤的表面。这种风格中的导航是字体性且简洁的——没有图标繁多的侧边栏,没有渐变按钮,功能控件周围没有装饰性镀铬效果。

对于编辑与营销场景——长篇文章、研究报告、白皮书,以及面向技术或专业受众的品牌材料——Perplexity 美学转化为一套关于信息层级的决策。正文以衬线字体排版,行距宽松;章节标题是字体性的而非装饰性的;引用语和信源标注通过字体切换而非颜色与正文区分。青绿色点缀在编辑场景中出现时,应保留给引用、脚注和交叉引用——不用于强调或装饰。这种风格的营销页面通过克制传递严肃性:全幅深色面板与接近纯白面板交替,青绿色仅在功能交互点出现。

在此风格中工作时,一个常见错误是将深色调色板理解为添加大气视觉效果的许可——从深到浅的渐变、UI 元素周围的光晕、背景中的环境色彩渗透。这些效果恰好破坏了这套系统所设计传递的内容。午夜图书馆美学之所以强大,是因为它平面、精确、不模糊;每一点视觉噪声都使界面少一分研究工具的气质,多一分消费娱乐产品的气质。同样,设计师有时会将青绿色点缀误解为通用点缀色,开始将其用于装饰目的——插图或视觉趣味——而非专门作为有来源和可交互内容的语义标记。一旦青绿色失去其单一的语义功能,整套引用语法便会随之崩溃。

Perplexity AI 设计风格用在幻灯片 · 封面上

Perplexity AI · 常见问题

这只是普通的深色模式,还是有更具体的含义?

这是更具体的东西。通用深色模式将浅色界面反转为深色等价物,通常作为用户在低光环境下的舒适偏好。Perplexity 的深色底面不是一种模式——它是默认且主要的状态,选择它出于语义和文化原因,而非人体工学原因。深蓝黑与研究终端、学术数据库和深夜专注工作有关联。围绕这个底面构建整个视觉标识——而非将浅色作为主要选项——是一个产品定位声明:这个界面是为严肃、专注的信息工作设计的,而非随意浏览。

为什么整个界面只使用一种点缀色?

因为点缀色承载着特定的语义含义——它标记有来源、经过检索和链接的信息——而这种含义只有在点缀色是唯一的情况下才有效。如果引入第二种点缀色,比如用于交互控件或警示状态,用户就需要学习哪种颜色意味着什么,而「青绿色等于引用」的自动语法就会被稀释。单一点缀色的约束也是界面呈现其特有严峻感的原因:在深色接近中性的场域上只有一种点缀色,设计被迫仅通过排版、比例和表面明度来传递层级。

这种美学能用于非 AI 搜索产品的品牌吗?

可以,但前提是品牌的价值观与美学的价值观真正一致。Perplexity 视觉风格传递的是:权威性、认识论精确性、研究导向和刻意的严肃性。它适用于分析平台、专业研究工具、金融数据产品、法律科技、学术出版界面,以及任何主要用户关系建立在复杂、有来源信息之上的场景。它不适合依赖温暖感、亲和力或感官丰富性的面向消费者的产品——食品、健康、儿童产品、酒店。在视觉价值观与产品价值观未对齐的情况下应用这种美学,会产生一个感觉冷漠而任意而非有目的的界面。

这种美学如何处理数据可视化?

Perplexity 风格中的数据可视化被剥离至其结构最小值:坐标轴是细线,网格线是极为细微的明度变化而非可见的笔触,标签是字体性的且小巧,青绿色点缀用于高亮主要数据系列或被引用的数据点,而非应用于所有元素。次要系列以降低透明度的接近纯白或以柔和中性色渲染,绝不使用第二种亮色点缀。整体效果更接近研究论文的图表,而非商业智能仪表板——可视化从属于文本和引用系统,而非意义的主要承载者。

应用这种风格时最常见的错误是什么?

添加模拟深度、光线或丰富感的大气视觉效果——卡片周围的柔和光晕、跨背景的渐变渗透、交互元素上的发光晕圈、唤起环境感的色彩渲染。这些效果与这套系统所传递的内容背道而驰。Perplexity 美学的力量来自其平面性和精确性:每个元素就是它看起来的那个样子,每种点缀色有特定的含义,没有任何东西仅为视觉愉悦而存在。一旦大气效果进入系统,界面就开始被读取为装饰性的而非功能性的,而设计所要传递的认识论严肃性就会随之消散。如果设计开始感觉像一件戏剧性的创意作品,这种风格就已经丢失了。

获取 Perplexity AI 完整设计系统 →