本文章是個(gè)人的工作經(jīng)驗(yàn)/積累，僅供學(xué)術(shù)交流使用，其中的所有案例均來源于他人設(shè)計(jì)，無商用目的。

每天都在看別人的優(yōu)秀設(shè)計(jì)作品，僅僅只是看看嗎？有沒有仔細(xì)想想，反推一下，別人是怎么實(shí)現(xiàn)的？

每年支付寶都會(huì)做一些很有趣的新年活動(dòng)，今年出了一個(gè)這樣的活動(dòng)。

打開支付寶，點(diǎn)擊“一字千金，紅包傳心”的活動(dòng)banner。

我們大概理解為送給你心愛的人一個(gè)祝福字，并把money包在這個(gè)字里。

看了界面，心中只有一個(gè)字：漂亮。

然而為什么別人的設(shè)計(jì)就那么美？

反思自己，我們可以嘗試多想想別人是怎么做到的？

首先我選擇送給自己一個(gè)“帥“字，在下方出現(xiàn)了一行標(biāo)語“每天都被自己帥醒”，并且出現(xiàn)了一個(gè)隨機(jī)的紅包1.66元。

當(dāng)然，你可以在上方更換祝福字，比如“俊”，“酷”等等。每選擇一個(gè)祝福字，下方的標(biāo)語就有所不同，紅包金額也不同。

---------------喝口水的分界線--------------

我們又看到在“帥”字的旁邊有一個(gè)“編輯”圖標(biāo)，這就厲害了！居然可以自定義祝福的字。

在我自定義之前，我停頓了一下，猜測：這個(gè)自定義字的功能應(yīng)該很強(qiáng)大吧，在我的水果手機(jī)里，pingfang是默認(rèn)字體，顯然這個(gè)“帥“字所代表的字體是特殊字體。

我就在 茫茫的 字體里找呀，找呀，找到了一個(gè)類似的字體。

(至于到底是哪一個(gè)特殊字體，僅僅看圖，是比較難確定的，在這里是找類似的字體打個(gè)比方。)

接著我又想：如果是完美的自定義字功能，那么我的手機(jī)里就會(huì)嵌入這個(gè)字體文件，這樣無論我寫什么字，都能被字體文件渲染。

于是我寫了一個(gè)稍微生僻的字：

這就厲害了，看樣子，應(yīng)該是嵌入了字體文件，連”鷺“字都能渲染出來。甚至，連下方的標(biāo)語都變成了和“鷺”相關(guān)的，厲害了！

我差點(diǎn)就信了~~~

我又輸入一個(gè)更加生僻的字

我那時(shí)的心情啊，多么希望是我希望的結(jié)果，然后點(diǎn)擊完成，系統(tǒng)有了如上圖的提示，不僅這個(gè)字沒有渲染為特殊字體，而且下方的標(biāo)語也沒有出現(xiàn)。

于是我又返過去仔細(xì)看那些 “看起來成功”的案例，有了如下發(fā)現(xiàn)：

對于上圖中的1，2點(diǎn)，在我與前端工程師的配合生涯來看，應(yīng)該是可以實(shí)現(xiàn)的(但不保證性能和適配)，至于第3點(diǎn)，真的有點(diǎn)困難。(如果有能實(shí)現(xiàn)的看官，我為你打call)

-----------領(lǐng)導(dǎo)總結(jié)性發(fā)言的分界線------------

從前面兩點(diǎn)來看

1，超生僻的字，渲染不出理想的特殊字體結(jié)果。

2，所有的字，還有做出漸變色，投影，模糊背影 三種效果，前端實(shí)現(xiàn)起來也很困難。

所以我大膽的推斷：

在支付寶的官方設(shè)計(jì)團(tuán)隊(duì)，在處理這個(gè)案子的時(shí)候，應(yīng)該是選擇性的把字體做成了圖片。

以下是舉例說明：

流程大致如下

然后再切圖

當(dāng)然，我們仔細(xì)看，祝福字下方的標(biāo)語，也是用的特殊字體，那么這行標(biāo)語也應(yīng)該是 做成的圖片。

用戶在輸入字的時(shí)候，如果匹配到文字圖片庫里有和輸入的這個(gè)字一樣的圖片，就顯示那張文字圖片。

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

連“鷺”字都可以得到理想的結(jié)果，

大家可以想象，支付寶團(tuán)隊(duì)?wèi)?yīng)該是做了很大量的文字圖片。

這個(gè)量的數(shù)值越大，用戶輸入任何字，能得到理想結(jié)果的概率就更高，整個(gè)結(jié)果就更漂亮。

也許上面的這一番話就，就是我想表達(dá)的“反推他人優(yōu)秀設(shè)計(jì)的意義”

如果你覺得這篇文章寫的不錯(cuò)，請為我打call或轉(zhuǎn)發(fā)。

謝謝。

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

關(guān)注我的個(gè)人微信公眾號，會(huì)有不定期的干貨分享。