terrain-1

猜猜这是哪儿？                                        

                                           #Antd# #像素# 一个非常纠结的设计小问题，秉着求真务实（钻牛角尖）的态度，总算理清楚一些了。
图1：之前看UI体系里面发现Antd喜欢用15%的不透明度的黑来做boder（button的和input的等等），其官方设计资源里面就是这样（如图1）。每次从kitchen里调用的也是。
图2：但是这样会出现一个问题，当fill颜色不一致的时候，boder显示的颜色就会出现差异。比如网页输入，固定内容的边框就会明显深，强迫症就受不了了。每次看antd这个资源组件都觉得不太对。后来看element的组件，其boder用的都是非透明色，就直接解决了这个统一的问题。
图3：后来我去用F12翻Antd官网的样式，发现样式表里写的boder基本都是纯色D9D9D9，不是透明度的纯黑，简直呵呵了。和资源里的不一致。
图4：事实证明，在纯白bg下，d9d9d9和15%的000000观感是一样的。



最后，我决定去改下component的样式。                                        

                                           #交互细节#

来自新浪微博网页端。“确定取消投票吗？确定/取消”。

本质上是一个文案设计的问题。逻辑上没有争议点，并且”确定/取消”基本是此类二次确认框的法定语句。但是此行为环境下，在直观意义上很容易混淆这里“确定”和“取消”两个按钮的结果暗示。

应该采用是否取消投票，是Y，否N来代替会更好。或直接改为“确定取消/暂不取消“等明确按钮文字表达。                                        

                                           #UI设计细节#

windows菜单，根据press的位置，选择的内容（图中是M）会有角度扭曲的差别。相当细节。很拟真地实现点击感的视觉性。
磁贴、设置，基本都有这样的设定。

频繁交互使用的地方，还是做细致。收益比较明显，用户潜意识也会觉察到。
                                        

                                           之前（9月份）发了一个behance改版之后，首页卡片信息全部默认隐藏，只有鼠标悬浮才出现的设计。实际上非常不便于浏览。

然后
（左图是9月改版后，右图是现在）

不知道什么时候他们也改了回来。虽然默认情况下只加入了点赞互动的信息和创作者名称。但是无论在视觉还是可用性上都有了足够的改观。                                        

                                           #细节#不要轻易去颠覆既有的规则

企业微信以前直接用“已读”“未读”的文字标签来告知用户告知人的接收情况，非常明晰表示出消息是否已发送，对方是否已读。而在新版本中改成了图形化的表达。图1表示已发送未读，图二表示对方已读。这种变化不止一次让我困惑。

消息旁边的圆圈和标识基本已经在各种约定俗成的环境下成为发送进度和发送状态的表示。这已经由微信等社交软件所固定了。

强行用图形化来表示对方接收状态我认为是非常没有必要并且容易犯错的。蓝色圈圈给人的第一感觉总是消息正在发送的状态，总是让人下意识检查网络，直到图二用户通常才认为发送成功。                                        

                                           随记#

这种图按说不太应该出现在新闻中，纵轴的零点设置成6%。整体视觉上让原本降幅大概在一半左右的感觉变成降了几乎百分百。扩大了涨幅跌幅。
这种利用视觉上的误导和第一感觉通常出现在商业宣传（性能各方面），用在严肃的数据图表中还是不合适。                                        

                                           细节#
Pinterest个人主页的背景图默认使用采集的画板拼合而成。

1.出现了一个动态的（随着用户采集行为），个性化定制的背景图。渲染优化得很出色，加载速度也足够。
2.极大避免了某些平台没有上传主页背景图就采用灰调提醒的状况，相当干扰。而且照顾不到有选择困难症和没有合适底图选择的用户。
3.这样，用户在使用中一些状况下也就不会去自己去选择图像替代。整个平台视觉风格的一致性得到更好的保证。
4.修改背景图中设定的choose a board更是非常细心考虑的功能。                                        

                                           #细节#

这个改动可能蛮久以前就有了，只是今天才注意到（版本一直也没有保持最新）。

Adobe Acrobat高亮文本的默认颜色黄色加了40%的透明度，整体柔和度好了很多。一点点变化，整体页面视觉品质提升很多。
由图1变为图2                                        

                                           页面动效练习
gif严重压缩

figma+protopie