如何搭建數(shù)據(jù)可視化系統(tǒng)，用豐富的設(shè)計(jì)語(yǔ)言清晰表達(dá)復(fù)雜和龐大數(shù)據(jù)，并形成鮮明的設(shè)計(jì)風(fēng)格？我們把數(shù)據(jù)可視化的元素進(jìn)行拆分并建立相應(yīng)的規(guī)范體系。

UI設(shè)計(jì)的最終目的就是為了更好的展示產(chǎn)品的內(nèi)容，讓用戶(hù)可以更好的接受。與傳統(tǒng)媒介相比，互聯(lián)網(wǎng)產(chǎn)品所包含的內(nèi)容更多，而且更加復(fù)雜。以書(shū)籍為例，我們讀書(shū)都是一頁(yè)一頁(yè)的翻，一句一句的讀，不能跳來(lái)跳去。但是對(duì)于app和網(wǎng)頁(yè)來(lái)說(shuō)，我們無(wú)法期望用戶(hù)像讀書(shū)一樣來(lái)使用你的產(chǎn)品。這樣不現(xiàn)實(shí)，現(xiàn)在是快速讀圖時(shí)代，即使面對(duì)文字用戶(hù)也很少去“讀”，他們更習(xí)慣一目十行的去掃描。互聯(lián)網(wǎng)產(chǎn)品應(yīng)該做到讓用戶(hù)在短時(shí)間內(nèi)就可以獲取到他們期望的信息，找到他們想要使用的功能。

這是我近期獨(dú)立完成的一個(gè)紅包分享項(xiàng)目，暫時(shí)入口在滴滴app里的積分商城，我也跟著同步上傳份項(xiàng)目總結(jié)吧

以下圖片都為設(shè)計(jì)效果圖，具體內(nèi)容，具體文案以線(xiàn)上為準(zhǔn)。

項(xiàng)目背景

1. 增加滴滴紅包樣式，拓展商業(yè)化渠道，促進(jìn)滴滴紅包變現(xiàn)。
2. 實(shí)現(xiàn)商家品牌推廣。
3. 為滴滴用戶(hù)獲得滴滴優(yōu)惠乘車(chē)券提供新的渠道。
4. 豐富滴滴產(chǎn)品形態(tài)，實(shí)現(xiàn)用戶(hù)拉新同時(shí)提升用戶(hù)使用頻次及活躍度。

項(xiàng)目目標(biāo)

1. 形成滴滴商家紅包購(gòu)買(mǎi)生態(tài)，增添滴滴商業(yè)化的新形式
2. 讓商家為乘客的優(yōu)惠出行助力
3. 進(jìn)一步提升滴滴口碑，增加滴滴良好的社會(huì)影響力
4. 新用戶(hù)拉新，老用戶(hù)活躍度提升
5. 同時(shí)為普通用戶(hù)提供紅包購(gòu)買(mǎi)渠道，促進(jìn)普通用戶(hù)之間的社交

前言：一直以來(lái)，我們都認(rèn)為“點(diǎn)線(xiàn)面”是畫(huà)面構(gòu)成最基礎(chǔ)的組成部分，而從廣義的角度來(lái)說(shuō)并不完全是這樣。傳統(tǒng)的說(shuō)法中，畫(huà)面最小面積是“點(diǎn)”，若干個(gè)“點(diǎn)”組成了“線(xiàn)”，若干條“線(xiàn)”組成了“面”，但真的是這樣嗎？假設(shè)我們把點(diǎn)放大，它其實(shí)也是一個(gè)面，而同樣的，我們把線(xiàn)放大，它同樣其實(shí)也是一個(gè)面，其實(shí)“點(diǎn)線(xiàn)面”在述說(shuō)的是一個(gè)方塊（區(qū)域），而在一個(gè)畫(huà)面中，方塊與方塊之間是相互作用的，而使各個(gè)方塊達(dá)致平衡的理論，我稱(chēng)之為“方塊理論”。

什么用戶(hù)如此熱衷動(dòng)效？

答案很簡(jiǎn)單，因?yàn)閯?dòng)效是對(duì)實(shí)時(shí)交互的本質(zhì)的補(bǔ)充。也就是說(shuō)，動(dòng)效可以營(yíng)造一種跟物理世界的物體交互事的情感體驗(yàn)。無(wú)疑，交互能夠帶給用戶(hù)滿(mǎn)足感。本文介紹5個(gè)作者認(rèn)為在設(shè)計(jì)動(dòng)效事非常有用的交互設(shè)計(jì)核心原則。

信息圖

信息圖本身是一個(gè)合成詞，由信息和圖兩個(gè)詞組成多稱(chēng)之為（Infographics或Infographics Graphics），在40年代的時(shí)候就開(kāi)始出現(xiàn)，使用在報(bào)紙及新聞?lì)愲s志方面，其中杰出的代表阿根廷的信息圖先驅(qū)Alejandro Malofiej，在1993年西班牙設(shè)立了以他為名的主要針對(duì)信息圖表設(shè)計(jì)的Malofiej獎(jiǎng)。

在報(bào)紙、雜志等紙質(zhì)媒體中，為了讓讀者感到新奇且直觀(guān)容易的理解，運(yùn)用了大量的信息圖解的表現(xiàn)。

如下圖所示：

顏色可以表達(dá)一切，最好的用色技巧是節(jié)制。如果你最大限度的遵從三原色，那么結(jié)果一定不會(huì)差。色彩的運(yùn)用一定要在平衡上多下功夫，運(yùn)用的顏色越多，越難達(dá)到平衡。

顏色在設(shè)計(jì)中的作用相當(dāng)于錦上添花?！?Pierre Bonnard

每一個(gè)選項(xiàng)都是一個(gè)tab ，tab 的形式千千萬(wàn)，但今天只講這種選中后下面帶橫線(xiàn)的。（我們給這個(gè)橫線(xiàn)起個(gè)名字叫做小短線(xiàn)吧，下文都這么叫了哈！）

今天的大綱如下：

• tab是用來(lái)干嘛的
• tab 的分類(lèi)
• 幾種常見(jiàn)的小短線(xiàn)
• 小短線(xiàn)的注意事項(xiàng)一
• 小短線(xiàn)的注意事項(xiàng)二

今天，大數(shù)據(jù)已無(wú)所不在，并且正被越來(lái)越廣泛的被應(yīng)用到歷史，政治，科學(xué)，經(jīng)濟(jì)，商業(yè)甚至滲透到我們生活的方方面面中，獲取的渠道也越來(lái)越便利。通過(guò)本系列的前面幾篇文章，我們已經(jīng)了解了數(shù)據(jù)可視化的必要性，而目前市面上也已經(jīng)具備了非常多成熟的BI繪制工具，如畫(huà)面，QlikView的的和魔鏡等等。雖然這些工具正在變得越來(lái)越自動(dòng)化，然而，隨著大數(shù)據(jù)時(shí)代的來(lái)臨，信息每天都在以爆炸式的速度增長(zhǎng)，其復(fù)雜性也越來(lái)越高;其次，隨著越來(lái)越多科學(xué)可視化的需求產(chǎn)生，地圖，3D物理結(jié)構(gòu)等技術(shù)將會(huì)被更加廣泛的使用。所以，當(dāng)人類(lèi)的認(rèn)知能力越發(fā)受到傳統(tǒng)可視化形式的限制時(shí)，隱藏在大數(shù)據(jù)背后的價(jià)值就難以發(fā)揮出來(lái)，如果因?yàn)檎故拘问降南拗茖?dǎo)致數(shù)據(jù)的可讀性和及時(shí)性降低，從而影響用戶(hù)的理解和決策的快速實(shí)施，那么，數(shù)據(jù)可視化將失 其價(jià)值。

然而，所幸的是，技術(shù)的快速發(fā)展和不斷變化的認(rèn)知框架正在為人類(lèi)打開(kāi)新的視野，促使藝術(shù)與技術(shù)相結(jié)合而產(chǎn)生新型的數(shù)據(jù)可視化形式。

2017年3月一年一度的設(shè)計(jì)盛事《設(shè)計(jì)上?！吩谏虾Ｕ褂[中心拉開(kāi)帷幕，從各國(guó)自帶品牌和文化屬性的作品中，依然不難瞥見(jiàn)未來(lái)設(shè)計(jì)的前沿趨勢(shì)和走向。其中由yang
design設(shè)計(jì)咨詢(xún)公司發(fā)布的一年一度2017-2018設(shè)計(jì)趨勢(shì)報(bào)告從材質(zhì)，用色，以及人群角度提煉出了當(dāng)代四大設(shè)計(jì)趨勢(shì)。2017年3月一年一度的設(shè)計(jì)盛事《設(shè)計(jì)上?！吩谏虾Ｕ褂[中心拉開(kāi)帷幕，從各國(guó)自帶品牌和文化屬性的作品中，依然不難瞥見(jiàn)未來(lái)設(shè)計(jì)的前沿趨勢(shì)和走向。其中由yang
design設(shè)計(jì)咨詢(xún)公司發(fā)布的一年一度2017-2018設(shè)計(jì)趨勢(shì)報(bào)告從材質(zhì)，用色，以及人群角度提煉出了當(dāng)代四大設(shè)計(jì)趨勢(shì)。