写点什么

从列表式 UI 中升华探讨:卡片式 UI 有哪些创新点(三)

  • 2019-12-31
  • 本文字数:875 字

    阅读完需:约 3 分钟

从列表式UI中升华探讨:卡片式UI有哪些创新点(三)

场景探索:寻求卡片式设计的最佳案例

Dashboard(工作台)运用场景


工作台的设计源于仪表盘,而仪表盘的核心理念是直接、高效、准确地向用户展示最重要的信息。


对于工作台的设计,需要重注三个元素:场景、角色、内容;他们的关系是在相应场景下需要给某类角色提供最需要查看的内容,而这个内容往往是多类别的。


我们将卡片式设计代入,自由的布局方式可以带来每块区域的很好的展示方式,同时更加重要的是卡片集强大的分类功能,在工作台上做信息分类布局使得用户可以更高效浏览一类信息。


数据排布主要涉及到三个心理学小知识:格式塔原则、短时记忆和神奇的 X。

应用选择运用场景


对于应用选择,我们需要展示给用户的第一要素是『这是什么应用』,每个独立卡片中承载的图标和名称可以以最生动形象的感知传达给用户。


设计师往往注重功能化导向设计,而用户体验更需要让用户愉悦的完成任务,所以注重感知和情绪设计会让用户更加喜欢。


###卡片集运用场景



这类场景往往更注重对单个信息的关注,此时用户不需要进行对比,更需要对单个信息内容进行多远互动,我们将卡片进行信息分级设计,同时设计丰富的互动操作栏。


列表更倾向于对信息进行总览、比较、过滤筛选。


###图表类运用场景



在数据可视化领域有『数据深度分析』和『数据概览』,我们借助卡片承载简单的数据概览内容,展示数据趋势与核心指标,在保证数据价值的同时也使得数据可视化的运用场景得到拓充。


将图表卡片运用在报表页面,可以打造分析型报表的业务场景。

对话式 UI 运用场景


我们打破传统对话式 UI 的体验模式,将『图形化 UI』与『对话式 UI』相结合,此时卡片就是图形化元素最好的载体,各式各样的卡片丰富了对话式 UI 的交互方式,又与之完美融合,体验具有整体性。

结语

正是因为上述价值点使得卡片化设计快速流行起来,并且会使用越来越广泛。


卡片式设计并不是一种简单的样式设计,而是一种信息自由布局的设计语言,它使人机交互方式越来越丰富,相信会有越来越多的平台创造新的卡片式交互形式,以创造更加极致的用户体验。


本文转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/vYfol56CZPMStx9JqxrCOg


2019-12-31 14:471239

评论

发布
暂无评论
发现更多内容

netty系列之:netty中的核心MessageToByte编码器

程序那些事

Java Netty 程序那些事 4月月更

Whats On Tap | Tapdata Cloud 如何助力大型家居连锁商城推进数字化经营?

tapdata

软件设计模式:适配器模式

正向成长

设计模式 适配器模式

在线JSON压缩工具

入门小站

工具

Postman中文版客户端

Liam

Jmeter Postman API swagger Mock

沙龙:如何使信息系统更加稳定

博睿数据

在线正则表达式可视化测试工具

入门小站

工具

一文浅谈:我们为什么需要云原生

穿过生命散发芬芳

4月月更

吹爆Python,解决了10个痛苦已久的难题

Jackpop

大数据洞察画像自动化实践

网易云信

大数据

北京市支援合作办公室党组书记、主任丁勇一行到正镶白旗调研京蒙协作工作

科技大数据

Tapdata Cloud 2.1.2 来啦:大波细节已就绪!字段类型可批量修改、支持微信扫码登录、新增支持 Vika 为目标

tapdata

新闻速递 I MobTech首席数据官杨冠军受CSDN之邀,探索企业数字化转型最佳路径

MobTech袤博科技

数字化转型 企业 数智未来

完美结合,10款提升编程能力的游戏项目!

Jackpop

计算机网络: IP地址,子网掩码,网段表示法,默认网关,DNS服务器详解

喀拉峻

网络安全 IP

津厦两地托育行业发展线上视频交流会成功召开

InfoQ 天津

Redis(二)分布式锁与Redis集群搭建

神农写代码

2022第12周-程序接盘侠

GeekYin

离职交接

信通院牵头数列科技参与主编的《信息系统稳定性保障能力建设指南》正式发布

TakinTalks稳定性社区

Flutter 简单实用的 fluro 路由管理插件简介

岛上码农

flutter 大前端 ios开发 安卓开发 跨平台开发

ElasticSearch写入流程详解

IT巅峰技术

elasticsearch

前端食堂技术周刊第 31 期:Vue 3、Vitest 中文文档上线、Pinia 正式成为 Vue 官方默认推荐的状态管理库、Vite v2.9.0

童欧巴

JavaScript 前端 Web web前端 前端工程师

持续精进,性能突破,openGauss 3.0社区版正式发布

Geek_32c4d0

GaussDB(for openGauss) 社区版

模块二:作业微信朋友圈的高性能复杂度

本人法海

「架构实战营」

Linux之lastb命令

入门小站

Redis集群架构剖析(4):槽位迁移,重新分配

非晓为骁

redis 分布式架构 redis cluster

中国信通院联合OpenMLDB邀您参加《开源数据库发展研究报告》调研问卷

第四范式开发者社区

数据库 大数据 开源

东方园林应邀参加人民网《人民会客厅——两会时刻》栏目访谈

科技大数据

AI 加持实时互动|ZegoAvatar ⾯部表情随动技术解析

ZEGO即构

计算机视觉 即构科技 Avatar

从列表式UI中升华探讨:卡片式UI有哪些创新点(三)_语言 & 开发_Think体验设计_InfoQ精选文章