logoAnt Design X

DesignDevelopmentComponentsPlayground
  • ❤️ Intention 意图设计
    • 介绍
    • 明确意图类型
    • 提供意图预期
    • 引导意图表达
  • 🎭 Role 角色设计
    • 介绍
    • 真实一致
    • 流畅自然
    • 有人情味
  • 💭 Conversation 会话设计
    • 介绍
    • 开始
    • 追问
    • 提示
    • 确认
    • 错误
    • 结束
  • 💻 Hybrid UI 混合界面设计
    • 介绍
    • 唤醒|AI 标识
    • 唤醒|欢迎提示
    • 表达|用户输入
    • 表达|用户发送
    • 确认|生成过程
    • 反馈|结果应用
    • 反馈|结果展示
  • RICH 设计范式简介

唤醒|欢迎提示

Resources

Ant Design
Ant Design Charts
Ant Design Pro
Pro Components
Ant Design Mobile
Ant Design Mini
Ant Design Web3
Ant Design Landing-Landing Templates
Scaffolds-Scaffold Market
Umi-React Application Framework
dumi-Component doc generator
qiankun-Micro-Frontends Framework
Ant Motion-Motion Solution
China Mirror 🇨🇳

Community

Awesome Ant Design
Medium
Twitter
yuque logoAnt Design in YuQue
Ant Design in Zhihu
Experience Cloud Blog
seeconf logoSEE Conf-Experience Tech Conference

Help

GitHub
Change Log
FAQ
Bug Report
Issues
Discussions
StackOverflow
SegmentFault

Ant XTech logoMore Products

yuque logoYuQue-Document Collaboration Platform
AntV logoAntV-Data Visualization
Egg logoEgg-Enterprise Node.js Framework
Kitchen logoKitchen-Sketch Toolkit
Galacean logoGalacean-Interactive Graphics Solution
xtech logoAnt Financial Experience Tech
Theme Editor
Made with ❤ by
Ant Group and Ant Design Community
loading

当用户首次踏入 AI 产品的世界时,可通过欢迎推荐的方式迅速了解并开启 AI 的强大能力以及具体用法。

设计目标

欢迎&提示组件适用于【唤醒AI阶段】,让首次接触 AI产品的用户快速理解AI能做什么,可以清晰传达给用户AI可实现的意图范围和预期功能。使用合适的欢迎推荐组件,可以有效降低用户学习成本,让用户能够在短时间内对 AI 的各项能力有一个清晰的认知,并掌握其正确的使用方法,让用户快速了解并顺利开始。


👋 欢迎组件

Preview

可通过用生动文案和直观介绍让用户迅速了解 AI产品,减少学习成本和困惑;精心视觉呈现吸引用户注意力,以此打造温馨、便捷、充满惊喜的初始体验,提升用户对 AI 产品的满意度和忠诚度。

注: 欢迎组件通常搭载推荐组件,可适用于不同场景。

👂 提示组件

Preview

根据用户行为、偏好和历史数据,为用户精准推荐个性化内容和服务,提高用户发现有价值内容的效率,增强用户与产品间的互动和粘性。AI 提示组件也会随着用户数据积累和变化,持续优化推荐结果,以满足用户日益变化需求。

  • 个性化推荐: 提高用户发现有价值内容的效率。
  • 持续优化: 随着用户数据的积累动态调整推荐,满足用户的变化需求。

注: 提示组件通常与欢迎组件结合使用。

组合场景示例

示意 1:

Preview
Preview

欢迎介绍和问题推荐都比较简洁清晰,让用户快速理解。

示意 2:

Preview
Preview

简明清晰的欢迎介绍,推荐提示功能显示主标题和辅助解释,让用户更易理解,文案可自定义。

示意 3:

Preview
Preview

将欢迎背景去掉,更突显推荐功能,给予更多描述,让用户对推荐功能深入理解。

示意 4:

Preview

加入品牌形象会更加生动亲切,推荐功能较多时,可以进行合理分组,信息分层展示,直观清晰。

示意 5:

Preview

以精心设计的视觉效果和生动的文案呈现,在用户首次接触 AI 产品时,给予更多引导,更加吸引用户开启使用。