Click up - Popover 的设计学习

20 阅读1分钟

本文仅用户个人学习记录使用,意在提高自己的交互设计,仅此而已,欢迎指正.

今日涉及组件:

Popover(弹出式提示框): A Popover can be used to display some content on top of another.

今日设计学习截图

image.png

image.png

优点

  1. 在空间有限的时候可以在特定的场景下展示出更多的信息
  2. 减少空间占用率,提高用户的交互性
  3. 能及时减少用户不同页面之间的跳转
  4. 方便使用,Popover 通常只需点击或悬停即可打开,方便用户预览内容
  5. 能吸引用户的注意,可以做提示的效果,但是显示的内容通常比 tooltip 多
  6. 提供了更多的操作选项

个人感悟

当页面空间小(为了留足够大的空间给内容区时)可以借助 Popover 来显示更多的辅助信息或者提供更多的操作选项,比如 sidebar 缩小了,但是要显示更多关于该 icon(某项) 的更多信息时可以借助 Popover 来有效提供额外的信息或功能!