【Cocos Dashboard 新版 UI 预告,快来瞧瞧!】

感谢大家积极反馈,主帖的截图存在若干前端 UI 还原度不足的问题,因此可能也还未达到最理想的状态。同时发这个帖子的目的也是尽可能提前收集一些不一样的声音,为将来正式发布做好铺垫。

2.0 改版,是由专业设计团队经过论证形成了 15 页的设计调研报告,作为 UI 改版的指引方针。


由于相关设计师已接手其它更高优先级的项目,未能亲自回复,下面是针对常见反馈的设计师回复,由我整理代发:

反馈:风格不统一,没有扁平化,混用扁平和渐变,风格乱……

Dashboard是管理工具,而Creator是重度使用的工具,Creator在颜色上需要中规中矩的表现,所以我们在Dashboard上采用了丰富的渐变颜色。

说到风格上面,【扁平风格】来源于2008年由Google提出,【渐变风格】是2018年再次流行起来的,【深色风格】2020流行风格。目前的趋势是扁平+空间设计(在“dribbble,花瓣,pinterest,Dashboard “等国外的设计网上都能看),渐变也是空间的一种表现手法,当然这也是我们的初步尝试,未来还有很多可以提升的地方。

反馈:安装板块的 item、字体过大

安装板块并不是一个高频操作的板块,大部分时候用户只过来查看有哪些编辑器,所以在 这个板块我们调整了版本字号的大小,是为了用户一眼能看清版本号。

反馈:颜色过深、颜色不好看……

我们经过色彩对比度的检测,确实相较于之前的Dashboard我们的对比度提高了,但是当前的对比度是符合Web内容无障碍指南的标准的。在当前新版本的文字的颜色使用的72%为常规色,如果采用原有的底色颜色搭配,字体颜色对比不够的情况下,会显得像是禁用。

当前版本对比度

反馈:整体不好看,不如旧版好看

我们接受大家的建议,我们也在调整细节,目前只是一个抢先的体验版,未来我们也会持续改进。当然每个人的审美不同,习惯不同,所以在感官上也是有所区别的。

反馈:风格老旧

风格上我们回答还是和第一个问题一样,深色风格的流行在近两年来上升到了系统水平的设计,在很多的产品上我们都随处可见,例如:“微信,优酷”等,所以深色风格还是在当下较为流行的。

反馈:这两个框所在的区域颜色没区分开

image

板块之间的分隔有很多种方式,例如:颜色分隔;间距分隔,分割线分隔等,只不过我们选择的用线的形式去分隔。在新版本中我们的模块较多,如果再次采取颜色分隔的方式,会显得层级更多,主要的设计思路就是区分为上下两个模块,让页面更清晰。


以上。我们也还会听取大家的反馈对 UI 进行微调,尽可能让 UI 看上去更舒服一些。

1赞

列表中版本号下,多一个 Cocos Creator 是做什么呢?完全没用啊

应该是除了cocos编辑器之外,还支持尤尼提,腊鸭,U饿,啊哈哈哈,秒破。
当然即使是想支持2dx版本,也没必要显示cocos creator,只需要显示2dx即可,其他的cocos creator真没必要显示,类似java语言的类型累赘。
还有其实路径没必要单独占领那么大空间,直接放到当前的“cocos creator”字样处即可,同时当前的路径位置让我们写一段项目或者编辑器的备注不是更好吗?

红色框框这个版本号太醒目了,毕竟是个启动器越简洁明了直奔主题越好,挂个版本号让人版本混乱。

移除这一整行,版本号放在左下蓝色框框里感觉好些。

1赞

能否直接截设计图看一下

1赞

这样表示项目状态是不是更好看哈哈

1赞

另外作为一名Cocos Creator云开发者,希望能有白色版本;这样就可以在我的电子墨水显示器上看得见字了(时刻等着cocos完善的一天)
既然是重新设计,那么设计上就应该能适配深色和浅色两种主题,或者提供第三方方便修改的主题文件包;不满意自己改;
通过SCSS\或者LESS,应该是很容易做到主题颜色配置的;可以参考bootstrap css 源码

你这个需求… 得加钱 :rofl:

1赞

抱歉目前人力不足,还涉及到内部商城和 Store 网页的适配,没办法维护浅色皮肤。

我以为找实习生做的,没想到居然是专业团队 :joy: .也对,小米换个标也得500W,找的也是专业团队. 视觉UI这方便,专家确实不少,毕竟这东西没有标准. :joy:

1赞

小小的也很可爱

这个深色是不是太重了呀,右上角彩色的框,感觉就很突兀,更换UI为了是更方便大家定位的功能还是为了好看,而且这个加粗就很一般,引擎安装搞成一长行,没必要吧,我要安装2.4.x的,还要往下滚是嘛

现在这种一个页面显示的更多

1赞

最好能加个分栏,不同版本分栏处理,默认不使用的项目icon不用那么显眼,视觉冲击有图的时候有就行了,去掉一些冗余的点缀,类似版本号下加个cocos,如果为了醒目不如在上面专门设个大的醒目标题,这整体的布局算是cocos门面,不要找实习生去设计啊,或者审核的标准就是这样?没有协调的美,没有优雅的美,老版的虽然不突出,但是也没什么短板,这个完全找不到亮点在哪里 :expressionless:

这其实是设计总监设计的,不是实习生啊,怎么会有实习生,我们公司不招实习生。有些冗余是为了排版更均衡一些,这个版本确实还不够好看,后面我们会继续迭代下去。

1赞

少浪费点时间在这些上面,多想办法把编辑器优化流畅点吧,,,这些都是小问题,花那么多时间干嘛,

1赞

这种有点立体感的设计是为了引人注目,突出该元素与其他部分不一样。但是列表最重要的就是呈现数据,而且每项数据都是平行关系,使用这种设计就很有违和感

为了占空间的,不然版本号字体更大, haha