对Ant Design的解说

刚开始,我们都不怎么了解Ant Design,之后我们上了一节有关Ant Design的课,了解到Ant Design是蚂蚁金服,蚂蚁金服是一个浙江蚂蚁小微金融服务集团有限公司。蚂蚁的企业级产品是一个庞大且复杂的体系。这类产品不仅量级巨大且功能复杂,而且变动和并发频繁,常常需要设计与开发能够快速的做出响应。同时这类产品中有存在很多类似的页面以及组件,可以通过抽象得到一些稳定且高复用性的内容。
Ant Design的设计语言,首先是设计价值观,要知道每个后台制作的原则,先是亲密度的问题,我们一定要注意要是如果信息之间关联性越高,它们之间的距离就应该越接近。
接着是对齐,这是一个很小的细节问题,我们往往在视觉看上去是对齐了,实际并没有。如果页面的字段或段落较短、较散时,需要确定一个统一的视觉起点,对于文字来说,基本左对齐。对于表单还有数字技术右对齐。我们要是对不齐可以打开参考线,来解决。
对于对比简单的理解就是被选中的,增加视觉效果最有效方法之一,同时也能在不同元素之间建立一种有组织的层次结构,让用户快速识别关键信息。
设计是也少不了重复的,重复元素可以是一条粗线、一种线框,某种相同的颜色、设计要素、设计风格,某种格式、空间关系等。如:
在这里插入图片描述
这个以线框来表示,文字格式重复。
直截了当非常直接,正如 Alan Cooper 所言:『需要在哪里输出,就要允许在哪里输入』。这就是直接操作的原理。不要为了编辑内容而打开另一个页面,应该直接在上下文中实现编辑,这样能使我们制作的效率提高。先做个示范:
在这里插入图片描述
足不出户简单的成语,能在这个页面解决的问题,就不要去其它页面解决,频繁的页面刷新和跳转,就像在看戏时,演员说完一行台词就安排一次谢幕一样。还不如直接解决,举个例子:假如是二次确认覆盖层:避免滥用 Modal 进行二次确认,应该勇敢的让用户去尝试,给用户机会『撤销』即可。相当于你在删除时,没有直接删除,而是跳出一个框,问你是否确认
在这里插入图片描述
还有一种情况就是直接删除的,它会提醒你成功删除,并提供用户撤销的按钮;用户进行下一个操作或者 3 分钟内不进行任何操作,撤销按钮消失,用户无法再『撤销』。
交互对于我们来讲是必不可少的,每一个页面都必须有交互性,这样才会使你的页面更加生动,也会使用户操作方便。比如:某个操作非常重要,就应该把它放在界面中,并实时可见。
在这里插入图片描述
看到状态1,一眼就能看出比较明显的一点,可以提现它比较重要
看到状态2,用鼠标点击会改变它的颜色,鼠标悬停时,鼠标指针变为手型
看到状态三,鼠标点击后,和未点击前有明显的区分。
提供邀请有很多富交互模式都有一个共同问题,就是缺少易发现性。所以提供邀请是成功完成人机交互的关键所在。邀请就是引导用户进入下一个交互层次的提醒和暗示。它们有两种形态,一个静态一个动态。静态指通过可视化技术在页面上提供引导交互的邀请。动态指以响应用户在特定位置执行特定操作的方式,提供特定的邀请。
巧用过渡人脑灰质会对动态的事物会对移动、形变、色变等保持敏感。在界面中,适当的加入一些过渡效果,能让界面保持生动,同时也能增强用户和界面的沟通。
改善感知性能当无法有效提升实际性能时,可以考虑适当转移用户的注意力,来缩短某项操作的感知时间,改善感知性能。
及时反映也是必不可少的,我对它的理解就是,比如在搜索框打一个字,会发现下来框有许多结果,要是不够准确还可以多添加一些字,内容越详细,得出来的结果越高。上面的提供邀请强大体现在交互之前给出反馈,解决易发现性问题;在是巧用过渡的有用体现在它能够在交互期间为用户提供视觉反馈;而即时反应的重要性体现在交互之后立即给出反馈。也可以这么理解。虽然反馈太多(准确的说,错误的反馈太多)是一个问题,但是反馈太少甚至没有反馈的系统,则让人感觉迟钝和笨拙,用户体验更差。
信息量特别多,用户输入时,下拉列表会随着输入的关键词显示匹配项。 根据查询结果分类的多少,可以分为确定类目、不确定类目两种类型。
以上都是Ant Design的设计价值观,对于以上的10原则都是比较常规的设计页面,对于这些原则我们是否认真去观察过自己页面的价值观呢?

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值