反推他人优秀设计的意义

本文章是个人的工作经验/积累，仅供学术交流使用，其中的所有案例均来源于他人设计，无商用目的。

每天都在看别人的优秀设计作品，仅仅只是看看吗？有没有仔细想想，反推一下，别人是怎么实现的？

每年支付宝都会做一些很有趣的新年活动，今年出了一个这样的活动。

打开支付宝，点击“一字千金，红包传心”的活动banner。

我们大概理解为送给你心爱的人一个祝福字，并把money包在这个字里。

看了界面，心中只有一个字：漂亮。

然而为什么别人的设计就那么美？

反思自己，我们可以尝试多想想别人是怎么做到的？

首先我选择送给自己一个“帅“字，在下方出现了一行标语“每天都被自己帅醒”，并且出现了一个随机的红包1.66元。

当然，你可以在上方更换祝福字，比如“俊”，“酷”等等。每选择一个祝福字，下方的标语就有所不同，红包金额也不同。

---------------喝口水的分界线--------------

我们又看到在“帅”字的旁边有一个“编辑”图标，这就厉害了！居然可以自定义祝福的字。

在我自定义之前，我停顿了一下，猜测：这个自定义字的功能应该很强大吧，在我的水果手机里，pingfang是默认字体，显然这个“帅“字所代表的字体是特殊字体。

我就在 茫茫的 字体里找呀，找呀，找到了一个类似的字体。

(至于到底是哪一个特殊字体，仅仅看图，是比较难确定的，在这里是找类似的字体打个比方。)

接着我又想：如果是完美的自定义字功能，那么我的手机里就会嵌入这个字体文件，这样无论我写什么字，都能被字体文件渲染。

于是我写了一个稍微生僻的字：

这就厉害了，看样子，应该是嵌入了字体文件，连”鹭“字都能渲染出来。甚至，连下方的标语都变成了和“鹭”相关的，厉害了！

我差点就信了~~~

我又输入一个更加生僻的字

我那时的心情啊，多么希望是我希望的结果，然后点击完成，系统有了如上图的提示，不仅这个字没有渲染为特殊字体，而且下方的标语也没有出现。

于是我又返过去仔细看那些 “看起来成功”的案例，有了如下发现：

对于上图中的1，2点，在我与前端工程师的配合生涯来看，应该是可以实现的(但不保证性能和适配)，至于第3点，真的有点困难。(如果有能实现的看官，我为你打call)

-----------领导总结性发言的分界线------------

从前面两点来看

1，超生僻的字，渲染不出理想的特殊字体结果。

2，所有的字，还有做出渐变色，投影，模糊背影 三种效果，前端实现起来也很困难。

所以我大胆的推断：

在支付宝的官方设计团队，在处理这个案子的时候，应该是选择性的把字体做成了图片。

以下是举例说明：

流程大致如下

然后再切图

当然，我们仔细看，祝福字下方的标语，也是用的特殊字体，那么这行标语也应该是 做成的图片。

用户在输入字的时候，如果匹配到文字图片库里有和输入的这个字一样的图片，就显示那张文字图片。

如果没有，那就有了 前面“屙”字的那种提示。

连“鹭”字都可以得到理想的结果，

大家可以想象，支付宝团队应该是做了很大量的文字图片。

这个量的数值越大，用户输入任何字，能得到理想结果的概率就更高，整个结果就更漂亮。

也许上面的这一番话就，就是我想表达的“反推他人优秀设计的意义”

如果你觉得这篇文章写的不错，请为我打call或转发。

谢谢。

-----------------------------

关注我的个人微信公众号，会有不定期的干货分享。