Ant Design 4 For Sketch

释放双眼,带上耳机,听听看~!

虽然Ant Design 4已经在2月份就推出了,而且相关文档已经到4.3.3了,可是我到现在才稍有闲暇时间下载来看看。本文首次发布在“xuesketch”公众号上。

挑毛病的评测|Ant Design 4 For Sketch

虽然Ant Design 4已经在2月份就推出了,而且相关文档已经到4.3.3了,可是我到现在才稍有闲暇时间下载来看看。

以前我吐槽过Ant Desing的组件看起来很全,用起来很傻(移动端更傻),我还自己修改过一版发出来了。当初是3.0,如今是4.0,理论上应该会把那些不足都修复了吧,但是官方没详细说,只是说

使用全局的图层样式、文字样式进行管理,支持智能布局 (需要Sketch58版本以上,建议升级)

新增了「暗色模式」,新增了icon图标 https://ant.design/components/icon-cn/   

我想自己体验一下再把感受给大家分享出来。本次体验的计划是:

  1. 了解全局图层样式、文字样式;

  2. 了解智能布局;

  3. 了解暗色模式;

  4. 了解3.0欠缺的组件和细节是否完善。

  • 全局样式

我看了一下,确实是以Color和Container为一级分类做了全局的图层样式,Color下设Dark、Grey、Light三个二级分类,再往下就是根据颜色的种类和深浅来分类了,这里的图层样式可以在任何一个组件上套用。

挑毛病的评测|Ant Design 4 For Sketch

挑毛病的评测|Ant Design 4 For Sketch

文字全局样式也是可以看到能正常使用的。而且从分类来说,也确实更加直观了。

  • 智能布局

我理解的智能布局大概就是能按照实际应用场景模拟尺寸变化时的内部元素的相对位置布局,此前就遇到过3.0里面很蠢的布局设定,也就是利用sketch的resize功能来实现的。本次我随机挑选了几个典型组件来做了一下试验,结果如下图。

挑毛病的评测|Ant Design 4 For Sketch

可以看到,侧边栏菜单、次按钮、下拉菜单是可以的;而主按钮、标题录入标题则还是没有做好(我又有事做了)。

  • 暗色模式

直接把上图的底色改成深色,然后把组件替换成深色主题后,可以看到所有的深色组件都做了调整,包括主按钮的明度也都降低了。但是resize还是没做好,依旧延续了亮色主题的问题。

挑毛病的评测|Ant Design 4 For Sketch

通过第2和第3条,可以得出,3.0遗留的问题还是没有得到改进。而且,带有图标的按钮现在不能换图标了…

挑毛病的评测|Ant Design 4 For Sketch

人已赞赏
交互设计

选择的陷阱

2020-8-13 23:17:27

交互设计

一个让《三十而已》许幻山都崇拜的偶像!

2020-8-14 23:19:11

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索