写点什么

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

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

    阅读完需:约 3 分钟

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

价值点分析:卡片式设计的优点

1. 重塑空间利用价值

我们将卡片当做一个承载内容的容器,不同的内容被规划成不同的卡片,不同的卡片有着适合自己的尺寸。这个时候传统的框架被打破,卡片组成卡片集,空间利用上会得到极大的拓展,同时看起来也具有整体性。


卡片式设计配合以卡片相应的交互操作,可以让空间利用率更加合理。



在 iOS 系统下,appstore 将卡片式设计发挥的淋漓尽致,不同的内容被盛放到相应的卡片容器中。


1.【专题】卡片就像窗口,卡片内的信息可以平铺在一个很大的画布上,用户可以通过窗口滚动浏览信息,当点击的时候,窗口会展开变大,使用户专注于这个类目的浏览与选择;


2.不同的卡片之间采用常规竖向滚动与横向滚动相结合,使得卡片集的组合空间更大,并且可以在横向同类卡片与纵向不同栏目之间快速切换,方便快捷。

2. 内容前置,信息分级

卡片作为一个独立的容器,可以在内容上进行良好的布局组织,将信息分块,突出重点,让用户快速找到感兴趣的内容,避免在繁杂的信息集中浪费时间。



类似于电商中的商品类卡片,商品图片、商品名称、折扣信息、价格等被按重要性组织布局,组成一个友好且连贯的内容体,整齐简练。

3. 跨越终端,多元场景

正因为卡片是一个内容的盛放容器,所以它有一个特别重要的特性是它可以自由变换大小,这使得它在跨终端的响应中表现出色。


同时在不同的终端中,卡片的信息组织并不受影响,这也是保证跨终端体验一致的重要因素。



google 极度推行卡片式设计,正是为了保证各式各样的安卓机分辨率下的一致体验。

4. 拟物视觉,赏心悦目

人机界面交互是一门语言也是一门艺术,界面需要给用户呈现信息,也需要给用户心理感知。感知源于习惯,习惯源于现实,这就是拟物化设计,将用户在现实生活中的习惯与感知传承到界面交互中。



iOS 中的卡包在空间布局允许的情况下,使用卡片式的拟物化设计,将真实且亲切的感知带给用户,同时增加界面趣味性。


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


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


2019-12-31 14:47759

评论

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

MobTech秒验,一键登录快人一步!

MobTech袤博科技

前端 App 免密登录 登录验证 秒验

Flink 实践教程:入门(11):MongoDB Sink 的使用

腾讯云大数据

流计算 Oceanus

[硬核技术] 时序数据预测算法研究:Prophet

乘云数字DataBuff

信创产业未来发展如何

小魏写代码

信创 信创产业

软件测试/测试开发丨Python 内置库 文件处理 学习笔记分享

测试人

Python 程序员 软件测试 文件处理 内置库

建设数字工厂:生产订单批量拆分的实现方法

华为云开发者联盟

云计算 后端 华为云 华为云开发者联盟 企业号 7 月 PK 榜

国内常见的16款低代码开发平台介绍

优秀

低代码开发平台 低代码平台 企业级低代码平台

JMeter 查看 TPS 数据

Liam

程序员 测试 Jmeter 测试工具 TPS

IDC公布2022中国大数据平台私有化部署市场份额,柏睿数据位列第一梯队

新消费日报

全球视频编码领域顶级大赛放榜,网易云信首次参赛即斩获H.265赛道多项指标第一

网易智企

音视频技术 H.265

聊聊测试当下的求职困境

老张

软件测试 求职面试

什么样的程序员在35岁后仍然保持竞争力?

互联网工科生

程序员 技术 持续学习 经验

低代码:告别繁琐,提速软件开发

互联网工科生

软件开发 低代码 数字化

AI算力爆发,新职业出现,你发现了吗?

小魏写代码

人工智能 AI算力

大模型时代,企业如何重构 AI 应用落地范式?

Fabarta

全球视频编码领域顶级大赛放榜,网易云信首次参赛即斩获H.265赛道多项指标第一

网易云信

音视频 H.265 音视频通话

企业做数字化转型,请先避开这5个坑!

优秀

数字化转型

ChatGPT下程序员应该何去何从?

小齐写代码

对线面试官 - HashMap

派大星

HashMap底层原理 Java 面试题

人人都有大模型用!大模型ChatGLM2-6B新手速通!

飞桨PaddlePaddle

人工智能 百度 paddle 飞桨 百度飞桨

信创产业未来发展如何

小齐写代码

和鲸 ModelWhale 与海光适配认证,“国产 CPU +开发平台” 双轮驱动信创生态建设及 AI 产业应用

ModelWhale

cpu 数字化转型 信创 数据科学 信创产业

2023 数字生态发展大会,和鲸 ModelWhale 入选中国信通院“铸基计划”《高质量数字化转型产品及服务全景图》

ModelWhale

数字化转型 中国信通院 铸基计划

PoseiSwap 即将开启质押,利好刺激下 POSE通证短时涨超 30%

BlockChain先知

新鲜出炉!Go薪资最高,JS需求量最大!

树上有只程序猿

Java c++ Python 编程语言

DWS轻量化更新黑科技:宽表加工优化

华为云开发者联盟

数据库 后端 华为云 华为云开发者联盟 企业号 7 月 PK 榜

ChatGPT下程序员应该何去何从?

小魏写代码

ChatGPT 新手用ChatGPT

暑期参加百度网盘AI大赛,夺万元现金、获大厂内推!

飞桨PaddlePaddle

人工智能 百度 paddle 飞桨 百度飞桨

云图说丨初识华为云OrgID:轻松实现统一帐号、统一授权

华为云开发者联盟

云计算 后端 华为云 华为云开发者联盟 企业号 7 月 PK 榜

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