如果你正在從事 B 端設(shè)計(jì)，或者在表單設(shè)計(jì)上比較苦手的設(shè)計(jì)師，那么上周的3篇表單設(shè)計(jì)相關(guān)的實(shí)用文章，絕對是拯救你的福音。Taras 的 20 個(gè)簡短精煉的技巧一針見血，「INDEX設(shè)計(jì)筆記」的系統(tǒng)指南則深入細(xì)致，都是難得的好東西！

表單設(shè)計(jì)指南

表單是 UI 界面中最為常見的元素，它通常是用來搜集和呈現(xiàn)一些數(shù)據(jù)、信息和特定的字段。這篇文章來自資深設(shè)計(jì)師 Taras Bakusevych，長期從事金融和企業(yè)類數(shù)字產(chǎn)品的設(shè)計(jì)，在表單設(shè)計(jì)領(lǐng)域造詣精深。這篇文章梳理了他總結(jié)的 20 條表單和輸入框的設(shè)計(jì)經(jīng)驗(yàn)，實(shí)用性極強(qiáng)。

表單（不是表格），作為最為常見的 Web 頁面模塊，是不是都快忽略它的存在了？回想一下你登錄網(wǎng)站填寫信息、購物填寫地址、填寫調(diào)查問卷、修改個(gè)人中心信息時(shí)……都是在和表單發(fā)生互動。但是，想要設(shè)計(jì)一個(gè)優(yōu)秀的表單并不容易。這篇我文章梳理了設(shè)計(jì)優(yōu)秀 Web 表單的 5 個(gè)有效策略：

每個(gè)人生活中，都在和表單打交道，各種表格，表單需要填寫。而在數(shù)字產(chǎn)品當(dāng)中，表單是實(shí)現(xiàn)數(shù)據(jù)采集的重要手段。最近幾年，隨著 B 端的興起，和表單打交道的設(shè)計(jì)師越來越多，這使得了解表單設(shè)計(jì)成為了很多設(shè)計(jì)師同學(xué)的必修課。這篇萬字干貨是這個(gè)表單設(shè)計(jì)指南的上半部分：

新視野

對于絕大多數(shù)的用戶而言，Mac OS X 是21世紀(jì)初頂尖設(shè)計(jì)的范式，在今天，它是最優(yōu)秀操作系統(tǒng)的當(dāng)中的典型。在今天的視角之下，2001 年步入新世代的 Mac 系統(tǒng)似乎一步登天，成為了新時(shí)代人機(jī)交互設(shè)計(jì)的典范，但是其實(shí)在此背后，有一段長達(dá) 10 多年的瘋狂試探，并且「沉淀」下了一大堆失敗產(chǎn)品。第二篇 「Mac 視覺史」就聊聊這次 90 年代的史詩級失敗背后的故事：

發(fā)消息帶表情已成為「網(wǎng)上沖浪」的社交禮儀，QQ 內(nèi)自帶的黃臉表情同樣被廣為使用。但伴隨著社會文化的變遷，黃臉表情在使用時(shí)總讓人感覺「表情用時(shí)方恨少」。別著急，新表情已安排。QQ 4 月上新了一批神仙表情，「疑惑」「 辣眼睛」「 滄?！埂?尷尬」，這些表情是否也是你的日常？如果你也被擊中的話，跟我一起看看表情的設(shè)計(jì)故事吧：

UI·視覺

不知道大家有沒有覺得自己做的東西總是很土、很普通，反正我是經(jīng)常有這種想法，所以總是想盡一切辦法做到更好。如何在設(shè)計(jì)過程中，徹底告別土味？菜心設(shè)計(jì)鋪的這篇文章，就用近期的一個(gè)設(shè)計(jì)項(xiàng)目作為案例，分享了他的設(shè)計(jì)經(jīng)驗(yàn)：

初級與高階設(shè)計(jì)師的區(qū)別，有時(shí)候不在于說整體大的布局上有什么差別，其實(shí)往往就在于文中提到的這些小細(xì)節(jié)點(diǎn)上。在騰訊，一個(gè)界面中的細(xì)節(jié)，往往會摳到像素級，大 1px 或者小 px 都可能要出幾稿，調(diào)優(yōu)后也確實(shí)會有不一樣的感覺。而這些關(guān)鍵的細(xì)節(jié)，都在這里：

海報(bào)的創(chuàng)意與玩法，不只限于排版，優(yōu)秀的海報(bào)可以把作品的高度拔升好幾個(gè)層級，省去了大量繁瑣文案的贅述，讓人一目了然，這樣的作品既不乏深度，也不失美感。這篇文章以近年的一些設(shè)計(jì)實(shí)戰(zhàn)來給大家分享關(guān)于海報(bào)設(shè)計(jì)的經(jīng)驗(yàn)：

我們在做設(shè)計(jì)的時(shí)候總離不開字體，可是多如牛毛的字庫字體里，免費(fèi)的只有那么幾個(gè)，難以滿足我們的工作需求。鋌而走險(xiǎn)的話又會容易招到律師函警告，那么怎么辦呢？最直接粗暴的方式就是學(xué)會字體設(shè)計(jì)，需要用什么字體就做什么字體，自己動手，豐衣足食。這篇文章先給大家介紹一些最基礎(chǔ)最基礎(chǔ)的字體設(shè)計(jì)知識：

說到 HMI 大多數(shù)設(shè)計(jì)師應(yīng)該是既熟悉又陌生，HMI 是 Human Machine Interface 的縮寫，「人機(jī)接口」，也叫人機(jī)界面，只不過是在某些場合和設(shè)備上管他叫 UI，比如移動端設(shè)備，而在另外某些場所和設(shè)備上管他就叫 HMI，比如汽車車機(jī)和數(shù)控機(jī)床。

而這次的文章，就是圍繞著汽車上的 HMI 界面設(shè)計(jì)來進(jìn)行探討的。它的前世今生有哪些故事，而現(xiàn)今在 HMI 領(lǐng)域的設(shè)計(jì)，又有哪些獨(dú)特的點(diǎn)？這篇文章一定要看看：

在進(jìn)行數(shù)據(jù)可視化設(shè)計(jì)的過程中，座標(biāo)軸是繞不過去的一個(gè)元素。但是常用的座標(biāo)軸有哪些，哪些座標(biāo)軸知識是做可視化設(shè)計(jì)必知的？這篇超專業(yè)的文章，就給你進(jìn)行了一一梳理：

產(chǎn)品·體驗(yàn)

任何一名設(shè)計(jì)師應(yīng)該都會接觸到運(yùn)營活動頁，產(chǎn)品落地頁此類需求。而這些落地頁設(shè)計(jì)需求的業(yè)務(wù)目標(biāo)衡量標(biāo)準(zhǔn)都相當(dāng)明確——即轉(zhuǎn)化率。再進(jìn)一步，與我們的設(shè)計(jì)輸出直接相關(guān)的就是首頁轉(zhuǎn)化率/點(diǎn)擊率。所以，在日常的落地設(shè)計(jì)中，其實(shí)最終都是為那個(gè)關(guān)鍵數(shù)據(jù)服務(wù)的。于是，我們最終還是要面對這個(gè)終極問題：在頁面當(dāng)中，按鈕要放到左邊還是右邊？答案，在這里：

微信小程序要如何做設(shè)計(jì)？相比于普通的 UI 設(shè)計(jì)相關(guān)的文章，這樣的文章還是相對比較少的。來自 Zeal-莊治柱 根據(jù)自身的經(jīng)驗(yàn)，完整梳理了這么一篇相對全面的微信小程序?qū)崙?zhàn)向的文章，幫助越來越多需要進(jìn)行小程序設(shè)計(jì)的設(shè)計(jì)師同學(xué)：

神器·干貨

可視化大屏的視覺效果超級棒，很多同學(xué)都想實(shí)現(xiàn)這樣的視覺效果，但是在具體的實(shí)現(xiàn)效果上，大家還是充滿疑惑。如果你也是其中的一員，那么這篇文章一定不要錯(cuò)過！這里整理了一些可視化效果常見的設(shè)計(jì)工具和實(shí)現(xiàn)方法！快來看看吧：

大家都知道建立個(gè)人圖庫的重要性，回歸到圖片的來源，怎么扒才算優(yōu)雅呢？不是所有網(wǎng)站的圖片都能右鍵保存的，去問開發(fā)小哥么？ 一來，他們很忙可能沒空理會，二來，這個(gè)問題太基礎(chǔ)會被鄙視。于是，這篇文章就分享給大家 4 個(gè)實(shí)用性極強(qiáng)的扒圖技巧：

職場·規(guī)劃

這篇文章可能是《我的十四年設(shè)計(jì)路》系列文章當(dāng)中，對于設(shè)計(jì)師同學(xué)們最有價(jià)值的一篇——它總結(jié)了設(shè)計(jì)師最容易走偏的4個(gè)設(shè)計(jì)誤區(qū)。如果你發(fā)現(xiàn)自己并沒有陷入這些誤區(qū)，那非常值得高興。如果你不小心陷入了某一個(gè)，那么這篇文章的建議，應(yīng)該能夠給你提供一點(diǎn)幫助：