有了解和學(xué)習(xí) B 端的同學(xué)必然都聽(tīng)說(shuō)過(guò) SaaS 這個(gè)詞，這在 B 端行業(yè)是個(gè)非常重要的產(chǎn)品形式和分支。
雖然它重要，但新手對(duì)這東西的理解充滿了讓人遺憾的扭曲。比如常見(jiàn)的誤解式提問(wèn)，Saas 應(yīng)該怎么設(shè)計(jì)？適用哪些設(shè)計(jì)風(fēng)格？
……
所以我從最底層的技術(shù)層面，來(lái)解析 Saas 到底是什么，在未來(lái)你再也不用擔(dān)心對(duì)這個(gè)詞匯一知半解，無(wú)法正常參與業(yè)務(wù)討論了。
講解什么是 Saas，或者剛剛圖例出現(xiàn)的 Paas、laas 是什么，首先要認(rèn)識(shí)一個(gè)問(wèn)題，一個(gè)需要聯(lián)網(wǎng)的軟件，是如何落地的，需要哪些前提條件。
通常，我們可以把一個(gè)普通的聯(lián)網(wǎng)產(chǎn)品要正式上線并使用，需要滿足 9 個(gè)層級(jí)的條件，我們簡(jiǎn)稱 “9層塔”，分別是：
下面，我們根據(jù)每個(gè)大層級(jí)來(lái)解釋一下，它們分別都是什么。
1.1 基礎(chǔ)設(shè)施層
基礎(chǔ)設(shè)施層是一切網(wǎng)絡(luò)服務(wù)的根基，由現(xiàn)實(shí)世界的硬件組成，是所有技術(shù)、代碼、數(shù)據(jù)的運(yùn)行基礎(chǔ)。
層1：網(wǎng)絡(luò)（Networking）
即基礎(chǔ)的互聯(lián)網(wǎng)電信寬帶服務(wù)，通過(guò)電信運(yùn)營(yíng)商在各地搭建聯(lián)網(wǎng)用的設(shè)備，并使用線纜相互連接，滿足數(shù)據(jù)的物理傳輸可能。
比如你想要在家上網(wǎng)沖浪（非移動(dòng)上網(wǎng)），最基礎(chǔ)的條件是就是購(gòu)買(mǎi)和開(kāi)通寬帶服務(wù)，通過(guò)接入光纖的形式，實(shí)現(xiàn)從家中連接到互聯(lián)網(wǎng)世界的可能。
層2：服務(wù)器（Serves）
服務(wù)器，本質(zhì)上也是一臺(tái)電腦。有了聯(lián)網(wǎng)的條件，我們就要把網(wǎng)絡(luò)接入到這臺(tái) “電腦” 上，讓它來(lái)完成各種數(shù)據(jù)的處理和存儲(chǔ)。
但不管它能做什么，要做什么，首先你得先有這臺(tái)設(shè)備，不然后續(xù)的工作都無(wú)從談起，所以服務(wù)器指的就是用來(lái)完成后續(xù)工作的電腦設(shè)備。
層3：存儲(chǔ)（Storage）
存儲(chǔ)就是硬盤(pán)，你想要運(yùn)行的任何程序、代碼，還是想要收集的數(shù)據(jù)，都需要容納的地方，那就是硬盤(pán)空間。存儲(chǔ)就是關(guān)聯(lián)到服務(wù)器的硬盤(pán)，是數(shù)據(jù)存儲(chǔ)的物理環(huán)境。
之所以硬盤(pán)被獨(dú)立出出來(lái)，而沒(méi)有把 CPU 內(nèi)存這些拿出來(lái)，是因?yàn)閿?shù)據(jù)的存儲(chǔ)和安全（物理上）是網(wǎng)絡(luò)服務(wù)的重中之重。CPU、內(nèi)存、電源壞了，替換就可以，硬盤(pán)損壞導(dǎo)致數(shù)據(jù)的丟失是無(wú)論如何不可能接受的。
所以，工程師們開(kāi)發(fā)了非常多特殊的技術(shù)來(lái)保障存儲(chǔ)的穩(wěn)定和安全。
1.2 技術(shù)應(yīng)用層
技術(shù)應(yīng)用層，就是具備了網(wǎng)絡(luò)、服務(wù)器、硬盤(pán)以后，讓這些基礎(chǔ)設(shè)施充分發(fā)揮作用和能效的相關(guān)技術(shù)。
層4：虛擬化（Virtualization）
虛擬化是個(gè)比較抽象的概念，它是一種資源利用的技術(shù)，讓服務(wù)器最大化的利用和分配自己的資源。
比如一臺(tái)服務(wù)器，有8核心、8G內(nèi)存、8G存儲(chǔ)，如果賣(mài)個(gè)一個(gè)客戶運(yùn)行一個(gè)程序，那么很可能這個(gè)這個(gè)程序日常只使用一個(gè)核心的算力，1GB內(nèi)存，1G不到的存儲(chǔ)，剩下的算力資源不就浪費(fèi)了嘛？
于是，虛擬技術(shù)就可以把這臺(tái)服務(wù)器切割成 8 臺(tái) “虛擬機(jī)” 賣(mài)給 8 個(gè)這樣的客戶。讓他們?cè)谶@臺(tái)設(shè)備上運(yùn)行 8 個(gè)不同的程序，并根據(jù)它們各自使用的消耗靈活分配 CPU 和內(nèi)存資源。
所以，今天如果你想要搭建一個(gè)網(wǎng)站，云服務(wù)商出售的 “虛擬主機(jī)”，就是在實(shí)體服務(wù)器主機(jī)上切割出來(lái)的一部分。這樣客戶省錢(qián)了，商家利潤(rùn)率也更高了！
層5：操作系統(tǒng)（OS）
每臺(tái)電腦都有自己的操作系統(tǒng)，我們熟知的 Windows、Mac OS等等。如果硬件沒(méi)有搭載操作系統(tǒng)，那它們就只是一堆工藝精密的廢鐵。
對(duì)于服務(wù)器來(lái)說(shuō)也是，任何服務(wù)器想要正常運(yùn)行，都必須搭載相關(guān)的服務(wù)器操作系統(tǒng)，有了基本的系統(tǒng)，我們才能創(chuàng)建程序，讓服務(wù)器去運(yùn)行我們想要的功能。
前面提到的虛擬機(jī)，就允許同一臺(tái)服務(wù)器通過(guò)虛擬技術(shù)運(yùn)行多個(gè)系統(tǒng)。
層6：中間件
中間件也是個(gè)比較復(fù)雜的技術(shù)概念，它是個(gè)獨(dú)立系統(tǒng)軟件服務(wù)程序，是軟件的直接面向?qū)ο螅ǘ皇欠?wù)器），是一種支撐軟件。
舉個(gè)不太嚴(yán)謹(jǐn)?shù)睦樱覀兂Ｒ?guī)的邏輯是一個(gè)程序?qū)?yīng)一臺(tái)服務(wù)器（或虛擬機(jī)），但真實(shí)情況往往是一個(gè)程序會(huì)關(guān)聯(lián)好幾個(gè)服務(wù)器和不同的系統(tǒng)，來(lái)完成不同的網(wǎng)絡(luò)服務(wù)。正常情況下，你需要對(duì)每個(gè)服務(wù)器和系統(tǒng)進(jìn)行適配。
而中間件的作用就是幫助你省掉這個(gè)麻煩的步驟，讓你只需要對(duì)接唯一的翻譯和話事人，他會(huì)幫你向不同的任務(wù)對(duì)象傳達(dá)你的要求。
層7：程序環(huán)境（Rumtime）
程序環(huán)境，就是編譯代碼用的環(huán)境。我們常聽(tīng)說(shuō)的 C 語(yǔ)言、C++、PHP、Java、.Net 等編程語(yǔ)言，都需要安裝一個(gè)對(duì)應(yīng)的運(yùn)行環(huán)境。
許多熱衷電腦游戲的同學(xué)一定很熟悉游戲第一次啟動(dòng)觸發(fā)的 Java 安裝界面，那就證明這個(gè)游戲中運(yùn)用到了 Java 的代碼，如果你沒(méi)有 Java 的運(yùn)行環(huán)境，那么它們就無(wú)法生效。
1.3 產(chǎn)品表現(xiàn)層
層8：應(yīng)用（Application）
在這個(gè)系統(tǒng)下，應(yīng)用程序指的不是你在自己電腦手機(jī)上安裝的程序。而是安裝在服務(wù)器上運(yùn)行的程序，不管是后端程序還是前端程序。
它們需要使用某些特定的程序語(yǔ)言來(lái)編寫(xiě)，并運(yùn)行在上面所說(shuō)的對(duì)應(yīng)環(huán)境中。我們所說(shuō)的后端開(kāi)發(fā)，通常就是開(kāi)發(fā)服務(wù)器所運(yùn)行的程序的程序員。
層9：數(shù)據(jù)（Data）
這個(gè)詞放在這里可能有比較大的歧義，數(shù)據(jù)實(shí)際上就是使用這個(gè)程序所產(chǎn)生出來(lái)的數(shù)據(jù)，而不是單指數(shù)據(jù)庫(kù)（數(shù)據(jù)庫(kù)也是環(huán)境的一部分）。
比如你打開(kāi)一個(gè)網(wǎng)站注冊(cè)了賬號(hào)，上傳了頭像，那么這些信息就是使用程序所額外產(chǎn)生的數(shù)據(jù)，它是項(xiàng)目正常運(yùn)作的必然產(chǎn)品。
1.4 SaaS 到底是什么
理解上面的9個(gè)層級(jí)的內(nèi)容是什么，我們就可以看下面這張圖表了。
SaaS 全程 Software-as-a-Service，翻譯叫 “軟件即服務(wù)”，講人話就是 “賣(mài)聯(lián)網(wǎng)軟件” 的。
前面提的 9 個(gè)層級(jí)，除了最后一層數(shù)據(jù)是我們普通人可以負(fù)責(zé)的，其它每個(gè)層級(jí)都需要對(duì)應(yīng)的開(kāi)發(fā)和工程師來(lái)負(fù)責(zé)對(duì)吧，那么我們普通人還是企業(yè)就不能使用網(wǎng)絡(luò)軟件服務(wù)了嘛？
這肯定是不符合事物發(fā)展規(guī)律的。
SaaS 的存在，就是讓用戶不用管什么服務(wù)器、代碼、中間件這些有的沒(méi)的高深玩意，直接讓你在瀏覽器或本地客戶端上直接使用這款聯(lián)網(wǎng)軟件，并創(chuàng)建對(duì)應(yīng)的數(shù)據(jù)信息。
換句話講，只要這個(gè)軟件是聯(lián)網(wǎng)的，且軟件本身的功能就是服務(wù)的核心（劃重點(diǎn)：社區(qū)電商類軟件的服務(wù)顯然不是軟件功能本身），它就是 SaaS。SaaS 既可以免費(fèi)，也可以是通過(guò)批量出售軟件功能的使用權(quán)來(lái)賺取收益。
免費(fèi)情景：
微軟：如果你使用了基于 Web 的電子郵件服務(wù)（例如 Outlook、Hotmail 或 Yahoo!Mail），那么你已經(jīng)使用一種形式的 SaaS。
https://azure.microsoft.com/zh-cn/overview/what-is-saas/
付費(fèi)情景：
在 B 端的語(yǔ)境下，SaaS 通常就是指制作一個(gè)面向商業(yè)用戶的聯(lián)網(wǎng)軟件，然后批量出售這個(gè)軟件的使用權(quán)。它并沒(méi)有特指這個(gè)軟件必須是 CRM、ERP、HRM 還是商用 HMI……
所以明白了嘛，SaaS 只是一個(gè)商業(yè)形式或技術(shù)形式的統(tǒng)稱，它根本沒(méi)有具體的設(shè)計(jì)規(guī)范或者學(xué)習(xí)方法，完全根據(jù)業(yè)務(wù)的實(shí)際需求和場(chǎng)景決定。
最后，再問(wèn)你們一個(gè)問(wèn)題，你們現(xiàn)在負(fù)責(zé)的項(xiàng)目是 SaaS 嘛？
在 9 層塔中，SaaS 是完全制作好軟件讓用戶直接上手使用的軟件，而 PaaS 和 IaaS 就不一樣。
2.1 PaaS
PaaS 全文 Platform as a Service，是平臺(tái)即服務(wù)的簡(jiǎn)稱。這屬于完全技術(shù)化的服務(wù)，是非程序員的一般用戶難以參與到的業(yè)務(wù)類型了。
即服務(wù)商提供了基礎(chǔ)的 7 層服務(wù)，只要用戶購(gòu)買(mǎi)了這些使用權(quán)，那么就可以直接在這個(gè)基礎(chǔ)上編寫(xiě)或安裝運(yùn)行的程序進(jìn)行使用了。
比如全球最大的開(kāi)源 CMS 博客程序 WordPress，是由 PHP+MySQL 編寫(xiě)的，如果要?jiǎng)?chuàng)建這樣的網(wǎng)站，就可以直接購(gòu)買(mǎi)符合程序?qū)?yīng)環(huán)境的服務(wù)器，再進(jìn)行安裝部署即可。
2.2 IaaS
IaaS 全文 Infrastructure as a Service，就是用戶只購(gòu)買(mǎi)一個(gè)完全空白的虛擬主機(jī)，類似你購(gòu)買(mǎi)了一臺(tái)硬盤(pán)格式化后完全空白的虛擬電腦。
用戶可以自己選擇安裝什么樣的系統(tǒng)，編寫(xiě)什么樣的中間件，最后再搭建自己的框架。這適合定自定義要求更高的用戶，完全根據(jù)自己的需要 DIY 項(xiàng)目的服務(wù)器功能。
2.3 Hosting
Hosting 則是比 IaaS 更進(jìn)一步的服務(wù)，從原本的虛擬服務(wù)器升級(jí)到了完整的服務(wù)器。
也就是說(shuō)，在一些特定業(yè)務(wù)環(huán)境下（比如特殊的數(shù)據(jù)安全要求），用戶需要購(gòu)買(mǎi)完整的服務(wù)器硬件使用權(quán)，從原本的合租換成整租。
所以，Hosting 就是服務(wù)器托管的意思，用戶向一些服務(wù)商購(gòu)買(mǎi)了完整的服務(wù)器硬件使用權(quán)和聯(lián)網(wǎng)功能，然后遠(yuǎn)程進(jìn)行控制和使用。而商家負(fù)責(zé)硬件層面運(yùn)維，防止服務(wù)器斷電、斷網(wǎng)、損壞、過(guò)熱、故障等一系列硬件問(wèn)題。
2.4 Co-location
九層塔中，我們其實(shí)還省略了一個(gè)更底層的環(huán)節(jié) —— 數(shù)據(jù)中心。
數(shù)據(jù)中心是一個(gè)物理名詞，在今天指的是大規(guī)模的服務(wù)器數(shù)據(jù)設(shè)備安置和運(yùn)行的空間。比如蘋(píng)果的云上貴州，就是典型的數(shù)據(jù)中心。
Co-location 的服務(wù)也叫場(chǎng)地出租，就是數(shù)據(jù)中心的商家，把數(shù)據(jù)中心的物理空間使用權(quán)租用給用戶，用戶自己購(gòu)買(mǎi)服務(wù)器或商家的（不是臨時(shí)租用）放進(jìn)去，再借助數(shù)據(jù)中心的網(wǎng)絡(luò)和其它基礎(chǔ)服務(wù)實(shí)現(xiàn)服務(wù)器的正常運(yùn)轉(zhuǎn)。
這個(gè)概念大家簡(jiǎn)單理解就可以，我就不多做介紹了。
所以，九層塔中包攬了不同層級(jí)數(shù)量的技術(shù)，就可以形成不同的服務(wù)，每一級(jí)服務(wù)有各自的優(yōu)缺點(diǎn)，是由項(xiàng)目的實(shí)際情況決定的。
相信看完前面的介紹大家已經(jīng)知道，SaaS 等服務(wù)是建立在聯(lián)網(wǎng)的基礎(chǔ)之上的，也就是說(shuō)，除了可以獨(dú)立運(yùn)行在你客戶端里的本地軟件，還包含更多需要聯(lián)網(wǎng)的軟件，或者干脆運(yùn)行在遠(yuǎn)程服務(wù)器主機(jī)上的軟件。
這是一個(gè)發(fā)展的過(guò)程……
最早的軟件安裝是我們到軟件店里購(gòu)買(mǎi)軟盤(pán)、光盤(pán)，回到家里的電腦安裝，這些軟件往往只在本地運(yùn)行，是不需要聯(lián)網(wǎng)的孤島。
隨著互聯(lián)網(wǎng)行業(yè)的發(fā)展，孤島漸漸被消除，聯(lián)網(wǎng)上傳和獲取數(shù)據(jù)越來(lái)越普及，甚至，軟件都不需要再下載和安裝，直接用瀏覽器就可以訪問(wèn)使用。
這種模式，就催生了軟件的開(kāi)發(fā)維護(hù)與服務(wù)器、網(wǎng)絡(luò)的硬件運(yùn)行進(jìn)行了分工，一般的產(chǎn)品開(kāi)發(fā)團(tuán)隊(duì)專注在軟件應(yīng)用層面的開(kāi)發(fā)工作，而把網(wǎng)絡(luò)、遠(yuǎn)程服務(wù)交給其它商家，并付費(fèi)購(gòu)買(mǎi)。
這樣不僅帶來(lái)更高的效率，而且降低了各自的成本，實(shí)現(xiàn)了多方的共贏。
所以，我們?cè)賮?lái)理解云服務(wù)這個(gè)詞就很容易了，云就是網(wǎng)絡(luò)，云服務(wù)就是基于聯(lián)網(wǎng)實(shí)現(xiàn)的各種軟硬件服務(wù)的總和。
除了遠(yuǎn)程的虛擬機(jī)、中間件、數(shù)據(jù)庫(kù)外，還有遠(yuǎn)程計(jì)算、渲染、CND加速、直播分流等等。
這也是為什么云服務(wù)會(huì)成為互聯(lián)網(wǎng)發(fā)展的基礎(chǔ)，因?yàn)樗鼘?shí)在太重要了，幾乎所有互聯(lián)網(wǎng)公司都無(wú)法脫離云服務(wù)帶來(lái)的支持。
這也是為什么各個(gè)大廠紛紛投入云服務(wù)的賽道中，因?yàn)檫@是互聯(lián)網(wǎng)的基建和命脈之一，擁有非常廣闊的前景與市場(chǎng)。而在馬太效應(yīng)強(qiáng)者越強(qiáng)的現(xiàn)實(shí)環(huán)境下，頭部的廠商擁有更好的機(jī)群、技術(shù)、人員，可以大幅度降低運(yùn)作成本，提供更優(yōu)質(zhì)但價(jià)格更低廉的服務(wù)。
雖然云服務(wù)在今天不可或缺，價(jià)格也越來(lái)越有優(yōu)勢(shì)。但是，并不是所有企業(yè)都一定要選擇購(gòu)買(mǎi)外部的云服務(wù)，這就是我們要理解的另一個(gè)課題 —— 私有化部署。
云服務(wù)再怎么便捷，也有一個(gè)缺陷，那就是數(shù)據(jù)是存儲(chǔ)在別的商家、企業(yè)的服務(wù)器中，有一定的數(shù)據(jù)安全隱患。
雖然數(shù)據(jù)安全是云服務(wù)的最基本保障，但很多對(duì)數(shù)據(jù)隱私、安全極度重視的企業(yè)，是不愿意承擔(dān)任何外部風(fēng)險(xiǎn)的。所以他們就會(huì)通過(guò)自建本地服務(wù)器（私有云）的方式，實(shí)現(xiàn)從網(wǎng)絡(luò)、硬件到軟件全局私有化的部署。
也就是說(shuō)，服務(wù)器機(jī)房是自己公司的，網(wǎng)絡(luò)是自己遷進(jìn)機(jī)房的，服務(wù)器自己買(mǎi)的，環(huán)境、虛擬化、數(shù)據(jù)庫(kù)自己搭建的，后端程序也是自己寫(xiě)的，最后電腦手機(jī)上運(yùn)行的客戶端，是連接這些服務(wù)器的。
哦對(duì)了，當(dāng)然這些硬件日常的維護(hù)也要由自己公司的運(yùn)維負(fù)責(zé)……
這樣的成本高嘛？非常高。但類似國(guó)企、銀行、證券、國(guó)防、政府機(jī)關(guān)等機(jī)構(gòu)，對(duì)數(shù)據(jù)的安全性是異乎尋常的執(zhí)著的，他們是有足夠的動(dòng)力劃出預(yù)算來(lái)確保數(shù)據(jù)的私密與安全，用來(lái)運(yùn)行自己內(nèi)部的 B 端系統(tǒng)。
這也是為什么這些機(jī)構(gòu)從一開(kāi)始就拒絕使用 Figma 這種公有云端軟件，尤其是服務(wù)器在國(guó)外的。
再問(wèn)下一個(gè)問(wèn)題，私有化部署，就意味著這個(gè)環(huán)節(jié)中所有步驟全是自己搞定嘛？
當(dāng)然不可能，因?yàn)閼?yīng)用這個(gè)層面，有時(shí)候不是想開(kāi)發(fā)就開(kāi)發(fā)得出來(lái)，或者成本實(shí)在超出了預(yù)算。因?yàn)樗接谢闹饕繕?biāo)是數(shù)據(jù)安全，但不是應(yīng)用的工具一定得個(gè)性化定制。
比如在即時(shí)設(shè)計(jì)官網(wǎng)的價(jià)格頁(yè)面，就可以看到 “私有部署” 這個(gè)選項(xiàng)。它的實(shí)際作用，就是允許客戶在自己的服務(wù)器上安裝它，讓內(nèi)部的員工使用設(shè)計(jì)軟件時(shí)是同步到公司指定的服務(wù)器而不是官方的公共服務(wù)器中，滿足客戶的數(shù)據(jù)隱私需求
注：這例子大家討論最多適合理解，非恰飯
所以，了解完上面的概念，你也就大概能明白什么是云服務(wù)，什么是私有化。如果需要在工作中碰到更細(xì)節(jié)的名詞還是概念，可以再進(jìn)一步做理解。
文章來(lái)源：UI中國(guó) 作者：超人的電話亭
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
綜合監(jiān)管平臺(tái)是對(duì)自然資源管控的一個(gè)OA系統(tǒng)。主要功能是對(duì)國(guó)土資源相關(guān)業(yè)務(wù)的監(jiān)測(cè)、評(píng)估和統(tǒng)計(jì)，將各專項(xiàng)規(guī)劃實(shí)現(xiàn)“多規(guī)融合”，從而優(yōu)化城市自然資源配置，做好國(guó)土空間規(guī)劃統(tǒng)籌。
為什么要有設(shè)計(jì)規(guī)范
1、多個(gè)設(shè)計(jì)師同步設(shè)計(jì)
我們部門(mén)有2名UI設(shè)計(jì)師，所以在我們同時(shí)畫(huà)同一個(gè)項(xiàng)目界面時(shí)，為了保持整個(gè)設(shè)計(jì)的統(tǒng)一，就需要我們?cè)O(shè)定設(shè)計(jì)規(guī)范。
2、設(shè)計(jì)與前端之間的溝通
與設(shè)計(jì)同理，開(kāi)發(fā)人員參照統(tǒng)一的設(shè)計(jì)規(guī)范寫(xiě)頁(yè)面，可避免同一系統(tǒng)中出現(xiàn)設(shè)計(jì)控件混亂的情況，從而提高開(kāi)發(fā)效率、減少溝通成本、減少返工率。
3、在公司內(nèi)部復(fù)用
在公司內(nèi)部，設(shè)計(jì)規(guī)范可運(yùn)用在多個(gè)項(xiàng)目中，從而減少開(kāi)發(fā)的工作量、提高開(kāi)發(fā)效率。
建立設(shè)計(jì)規(guī)范前的工作
從產(chǎn)品經(jīng)理手中接到原型圖，首先是與產(chǎn)品經(jīng)理的溝通，包括客戶需求、設(shè)計(jì)風(fēng)格的確定、頁(yè)面內(nèi)容的布局等等，關(guān)于設(shè)計(jì)尺寸，因?yàn)槲覀兛蛻粲玫氖?920*1080分辨率的電腦，所以設(shè)計(jì)就基于1920*1080尺寸來(lái)做；但有時(shí)會(huì)基于1440*900的尺寸來(lái)設(shè)計(jì)，然后上下適配1920*1080和1366*768。所以設(shè)計(jì)尺寸要根據(jù)具體情況而定。
頁(yè)面框架
a、主體框架分為四個(gè)區(qū)域：頂欄、左側(cè)欄、頁(yè)簽、主體內(nèi)容
b、主體內(nèi)容上、左邊距為10px，默認(rèn)顯示一屏高度，超出的內(nèi)容加上下滾動(dòng)條
c、頁(yè)面中的各個(gè)組件根據(jù)不同屏幕分辨率采用自適應(yīng)
如何建立設(shè)計(jì)規(guī)范
1、顏色規(guī)范
后臺(tái)系統(tǒng)主色調(diào)大多運(yùn)用藍(lán)色，這是因?yàn)樗{(lán)色往往圍繞著科技、安全、信任等等，很符合業(yè)務(wù)場(chǎng)景，比如智慧城市、智慧醫(yī)療、智慧交通等。但是藍(lán)色用多了也會(huì)讓人感覺(jué)沒(méi)有新意、審美疲勞，所以在色調(diào)這塊，后臺(tái)系統(tǒng)可以采取皮膚功能的擴(kuò)展，做兩套配色好的皮膚供客戶選擇，這樣避免了因客戶的不滿而一次次的修改，從而提高工作效率。
2、文字規(guī)范
因?yàn)槲覀兠嫦虻目蛻舳酁檎ぷ魅藛T，且年紀(jì)稍長(zhǎng)，所以字號(hào)要比平常的網(wǎng)頁(yè)設(shè)計(jì)要稍大一些；常用字體，中文：微軟雅黑，英文或阿拉伯?dāng)?shù)字：Arial；行間距=字體+8px。
3、按鈕規(guī)范
按鈕是用戶與系統(tǒng)間交互的一個(gè)重要觸點(diǎn)，用于特定觸發(fā)事件的發(fā)生。按鈕類型可分為線性按鈕、面型按鈕、文字按鈕、圖標(biāo)按鈕、圖標(biāo)+文字按鈕，按鈕狀態(tài)分為常規(guī)、懸停、按下、禁用。按鈕的寬、高、曲率、文字離邊框的間距需要在規(guī)范中寫(xiě)明。
4、表單規(guī)范
在后臺(tái)系統(tǒng)中，表單多用于登錄注冊(cè)、搜索框、選擇器、信息錄入等。表單類型可分為輸入框、下拉框、時(shí)間選擇框、單選框、多選框等等，表單狀態(tài)分為默認(rèn)、輸入/選中、填寫(xiě)完成/已選擇、不可填寫(xiě)/不可選、錯(cuò)誤提示。對(duì)于必填表單，需在標(biāo)簽前后或輸入框后增加“紅色*號(hào)”。輸入框的高度、曲率需要在規(guī)范中寫(xiě)明。
5、表格
此圖為可進(jìn)行單選或批量選擇、排序、表頭分組和帶有凍結(jié)列的復(fù)合型表格：
a、固定列表格：對(duì)于屏幕無(wú)法展示完全的內(nèi)容，可以采用凍結(jié)重要列的方式，然后橫向加滾動(dòng)條左右滑動(dòng)
b、可對(duì)數(shù)據(jù)進(jìn)行排序：升序和降序
c、文字類字?jǐn)?shù)限制：重要字段全部顯示，其他文字信息超出寬度以“...”代替，鼠標(biāo)懸停時(shí)顯示全部?jī)?nèi)容
d、對(duì)齊方式：文字信息左對(duì)齊，因?yàn)槿说拈喿x習(xí)慣是由左到右、由上到下的，此外在主從型列表中，采用左對(duì)齊錯(cuò)開(kāi)文字，可使用戶一目了然，降低視覺(jué)噪音；數(shù)據(jù)信息右對(duì)齊，因?yàn)閿?shù)字單位個(gè)十百千萬(wàn)...是由右向左，方便比較數(shù)據(jù)大小
文章來(lái)源：站酷 作者：Alice冰冰
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
本文是參考國(guó)內(nèi)交互設(shè)計(jì)標(biāo)準(zhǔn)網(wǎng)站及用戶行為研究實(shí)現(xiàn)的用戶體驗(yàn)設(shè)計(jì)規(guī)范，用于后臺(tái)設(shè)計(jì)，網(wǎng)站設(shè)計(jì)等。
涉及到的產(chǎn)品越多，產(chǎn)品統(tǒng)一性越強(qiáng)，實(shí)現(xiàn)信息同頻，開(kāi)發(fā)和設(shè)計(jì)快速了解信息
一個(gè)項(xiàng)目中會(huì)涉及到多種按鈕，甚至一個(gè)頁(yè)面中也會(huì)涉及到多種不同功能的按鈕，這個(gè)就需要把同一類型或同一功能的按鈕，它們的位置統(tǒng)一。減少用戶學(xué)習(xí)成本。
因?yàn)槿绻粯拥墓δ馨粹o在不同的變換位置的話會(huì)打亂用戶已經(jīng)形成的習(xí)慣，增加其學(xué)習(xí)成本。（盡量采取以下情況的一種）
幫助說(shuō)明的表現(xiàn)形式有很多種，但不管選那種整個(gè)項(xiàng)目要保持統(tǒng)一，一些特殊情況除外，固定一個(gè)位置，可以方便用戶在最短的時(shí)間內(nèi)，快速完成此項(xiàng)操作和獲取內(nèi)容。
權(quán)重是為了突出有效信息，也能在不同元素建立一種有組織的層次結(jié)構(gòu)，讓用戶快速識(shí)別關(guān)鍵信息。
為了讓用戶能在操作上（類似表單、彈出框等場(chǎng)景）快速做出判斷，來(lái)突出其中一項(xiàng)相對(duì)更重要或者更高頻的操作。
突出的方法，不局限于強(qiáng)化重點(diǎn)項(xiàng)，也可以是弱化其他項(xiàng)。
但是在一些需要用戶慎重決策的場(chǎng)景中，系統(tǒng)應(yīng)該保持中立，不能替用戶或者誘導(dǎo)用戶做出判斷
表單在遵守操作流程的情況下，讓用戶涉及到的操作從易到難，讓用戶有填下去的動(dòng)力。
排序規(guī)則
（1）有“有默認(rèn)項(xiàng)”的選項(xiàng)；
（2）有“選項(xiàng)”的選項(xiàng)；
（3）只輸入“數(shù)字”的選項(xiàng)；
（4）“添加圖片”“修改”等涉及復(fù)雜操作的選項(xiàng)；
（5）“備注”“商品賣(mài)點(diǎn)”等選擇。
左右排版的時(shí)候?qū)ⅰ爸匾靥铐?xiàng)”先在從左邊（縱向排列）開(kāi)始排版（排版時(shí)仍按照我們的從簡(jiǎn)到難的規(guī)則）
注：當(dāng)“必填項(xiàng)”比“非必填項(xiàng)”多時(shí)，排版上要考慮，就按照次序，左邊排滿，再排右邊。
在使用Table 時(shí)，文字鏈的點(diǎn)擊范圍受到文字長(zhǎng)短影響，可以設(shè)置整個(gè)單元格為熱區(qū)，以便用戶觸發(fā)。
注：當(dāng)懸浮在“客戶”所在的文字鏈單元格時(shí)，鼠標(biāo)
【指針】隨即變?yōu)椤臼中汀浚瑔螕艏纯商D(zhuǎn)。
當(dāng)需要增強(qiáng)按鈕的響應(yīng)性時(shí)，可以通過(guò)增加用戶點(diǎn)擊熱區(qū)的范圍，而不是增大按鈕形狀，從而增強(qiáng)響應(yīng)性，又不缺失美感。
注：在移動(dòng)端尤其適用。
鼠標(biāo)移入按鈕附近，即可激活Hover 狀態(tài)
當(dāng)『易讀性』遠(yuǎn)比『易編輯性』重要時(shí)，可以使用『?jiǎn)螕艟庉嫛?
狀態(tài)一：普通的瀏覽模式，不區(qū)分可編輯行和不可編輯行；
狀態(tài)二：鼠標(biāo)懸停時(shí)，『指針』變?yōu)椤菏中汀唬庉媴^(qū)域底色變黃，出現(xiàn)『Tooltips』提示單擊編輯；
狀態(tài)三：鼠標(biāo)點(diǎn)擊后，出現(xiàn)『輸入框』、『確定』、『取消』表單元素，同時(shí)光標(biāo)定位在『輸入框』中。
當(dāng)『易讀性』為主，同時(shí)又要突出操作性的『易編輯性』時(shí)，可使用『文字鏈/圖標(biāo)編輯』
狀態(tài)一：在可編輯行附近出現(xiàn)文字鏈/圖標(biāo)；
狀態(tài)二：鼠標(biāo)點(diǎn)擊『編輯』后，出現(xiàn)『輸入框』、『確定』、『取消』表單元素，同時(shí)光標(biāo)定位在『輸入框』中。
當(dāng)『易讀性』遠(yuǎn)比『易編輯性』重要時(shí)，可以使用『?jiǎn)螕艟庉嫛?
注：編輯模式在不破壞整體性的前提下，可擴(kuò)大空間，以便放下『輸入框』等表單元素；其中，在Table 中進(jìn)行編輯模式切換時(shí)，需要保證每列的不跳動(dòng)。
減少負(fù)擔(dān)，增加輕量化的操作
注：刪除的操作是謹(jǐn)慎的，系統(tǒng)在不打斷當(dāng)前操作的時(shí)候給出二次提醒確認(rèn)。
填寫(xiě)表單的條件反饋。
注：不需要提交后才出現(xiàn)提示，輸入及時(shí)給用戶反饋
完成整個(gè)操作后的提示以及系統(tǒng)提示
注：重要的，文字多于15個(gè)字以上不適合放在toast里面提示。
提供下一步操作的入口
不僅要提示他發(fā)生了什么，還能引導(dǎo)他怎么做，甚至能讓他一步到位直接跳轉(zhuǎn)到要進(jìn)行下一步操作的頁(yè)面去操作
當(dāng)頁(yè)面沒(méi)有按鈕時(shí)，提供明確的入口。
最后，關(guān)于后臺(tái)的用戶體驗(yàn)設(shè)計(jì)規(guī)范就總結(jié)到這里啦。
文章來(lái)源：站酷 作者：chaih
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
讓信息架構(gòu)，和產(chǎn)品架構(gòu)，產(chǎn)生“化學(xué)反應(yīng)”
這個(gè)信息架構(gòu)的角度，具體而言，就是只包含一級(jí)頻道的交互設(shè)計(jì)。
核心功能、輔助功能、重大功能，作為產(chǎn)品的三大類功能，更多是從發(fā)展的角度來(lái)劃分。
除此之外，大部分 App 都還有一些非常基礎(chǔ)的功能，比如“個(gè)人資料”、“我的收藏”、“設(shè)置”、“搜索”等，此類功能，我們稱其為通用功能。
核心功能、輔助功能、重大功能和通用功能，是產(chǎn)品的四大類功能。
總的來(lái)說(shuō)，本文主要以底部 tab 導(dǎo)航的 App 為例，探討一下，如何在一級(jí)頻道來(lái)落地產(chǎn)品的四大類功能。
01 宏觀上講，怎樣更好的擺放四大類功能？
網(wǎng)易云音樂(lè)是我個(gè)人很喜歡的一款產(chǎn)品，日常用的也比較多。不過(guò)，它的新版（6.0 系列）給我的直觀感受是，有點(diǎn)復(fù)雜了，我甚至在很長(zhǎng)時(shí)間里找不到“私人 FM”這個(gè)以前常用的功能。
給我類似感受的產(chǎn)品，還有 Keep 和知乎。
究竟是什么，讓我覺(jué)得，這些產(chǎn)品變得有點(diǎn)復(fù)雜了？
個(gè)人簡(jiǎn)單總結(jié)了一下，最直接的一個(gè)原因，是這些 App 都新增了重大功能，并給這個(gè)重大功能單獨(dú)加了一個(gè)一級(jí)頻道。
比如 Keep 的“計(jì)劃”頻道、知乎的“會(huì)員”頻道、網(wǎng)易云音樂(lè)的“視頻”和“云村”頻道，都分別占用一個(gè)一級(jí)頻道。
企業(yè)為什么這么設(shè)計(jì)？個(gè)人的猜測(cè)，這些重大功能于企業(yè)而言，很重要，要么肩負(fù)商業(yè)化使命，要么被寄予厚望，所以企業(yè)就單獨(dú)給了一個(gè)一級(jí)頻道。
這是一個(gè)相對(duì)簡(jiǎn)單的邏輯。但如果想要更好的去平衡用戶體驗(yàn)和商業(yè)化之間的關(guān)系，那我們就需要考慮更多的因素。
之前在信息架構(gòu)那篇文章里，個(gè)人的建議是，如果想讓 App 始終保持簡(jiǎn)單，那就只保留 4 個(gè) tab，也即只有 4 個(gè)一級(jí)頻道。
如何將產(chǎn)品的四大類功能、以及未來(lái)很大概率會(huì)不斷出現(xiàn)的重大功能，以接近最優(yōu)的方式，安置在寸土寸金的 4 個(gè)一級(jí)頻道上？
我想，這中間一定有一些原則，值得我們探討和參考。
1 和重要程度保持一致
通常而言，重要程度越高，分配到的空間就越多。這是一個(gè)比較普世的道理。
也就是說(shuō)，這條原則，主要會(huì)影響到，四大類功能，各自占用多少空間比較合適。
我們有 4 個(gè)一級(jí)頻道，每個(gè)一級(jí)頻道代表了 25% 的空間。
再來(lái)看四大類功能，按其大概的重要程度，簡(jiǎn)單的分析一下。
先說(shuō)核心功能，這個(gè)最重要。
核心功能是立足之本和護(hù)城河。先換個(gè)角度看這個(gè)問(wèn)題，假設(shè)有三種可能，即核心功能可以占用一個(gè)、兩個(gè)或三個(gè)一級(jí)頻道。
先用下排除法。三個(gè)一級(jí)頻道難免顯得過(guò)多，剩余的三種功能擠在一個(gè)一級(jí)頻道里也會(huì)顯得過(guò)分擁擠；一個(gè)一級(jí)頻道的話，倒也可以，但是平分四分之一的空間很難體現(xiàn)出核心功能的重要性。
相比之下，兩個(gè)一級(jí)頻道就顯得較為合適。
綜合考慮到有四大類功能，通常兩個(gè)一級(jí)頻道也不會(huì)完全給核心功能所用。
所以，核心功能，大概占用一個(gè)半一級(jí)頻道，也即 40% 左右的空間即可。
再說(shuō)通用功能，這個(gè)比較容易。
此類功能通常比較多，重要程度可能不及重大功能，但是又不能沒(méi)有，所以通常我們也會(huì)單獨(dú)給一個(gè)一級(jí)頻道，就是“我”或者“設(shè)置”之類的一級(jí)頻道，大概占用 25% 的空間即可。
第三，說(shuō)下重大功能，這個(gè)比較重要。
通常而言，重大功能的重要性僅次于核心功能，而且重大功能可以有多個(gè)，再考慮到通用功能一般單獨(dú)占用一個(gè)一級(jí)頻道。
那么，相對(duì)而言，重大功能，完全可以單獨(dú)占用一個(gè)一級(jí)頻道，甚至更多，大概占用 30% 左右的空間即可。
最后，說(shuō)下輔助功能，這個(gè)比較特殊。
首先，很多產(chǎn)品是沒(méi)有輔助功能的；其次，輔助功能是個(gè)小功能；最后，輔助功能的數(shù)量一般也不多。
總的來(lái)說(shuō)，輔助功能是沒(méi)有必要單獨(dú)給一個(gè)一級(jí)頻道的。再考慮到 4 個(gè)一級(jí)頻道所剩空間已經(jīng)不多，所以，輔助功能一般和重大功能共用一個(gè)一級(jí)頻道即可，大概占用 5% 左右的空間。
2 和使用頻率保持一致
通常而言，用戶用的越多的功能，就排的越靠前。
也就是說(shuō)，這條原則主要決定四大類功能的排序問(wèn)題。
具體而言，用戶用的最多的是核心功能，所以核心功能最靠前。
重大功能和通用功能，有時(shí)候很難說(shuō)哪個(gè)使用頻率更高，比如微信里的“搜一搜”和“收藏”。但是比較明確的是，很多 App 在誕生之初，并沒(méi)有重大功能，只有核心功能和通用功能。
所以自然而然，通用功能排在了核心功能后面。
個(gè)人有個(gè)猜測(cè)，一方面，有時(shí)候很難說(shuō)清重大功能和通用功能，哪個(gè)使用頻率更高；另一方面，通用功能起初是排在最后的。
所以，當(dāng)重大功能出現(xiàn)時(shí)，就延續(xù)了舊傳統(tǒng)：通用功能依然排在最后。最終結(jié)果就是，重大功能和輔助功能排在中間。
值得一提的是，現(xiàn)在市面上開(kāi)始出現(xiàn)兩類現(xiàn)象。
其一是，有一些擁有 5 個(gè)一級(jí)頻道的 App，開(kāi)始把核心功能放到中間那個(gè)頻道，比如 Keep 的“運(yùn)動(dòng)”頻道。
其二是，企業(yè)開(kāi)始人為的控制打開(kāi) App 時(shí)默認(rèn)展示哪一個(gè)頻道，而且默認(rèn)顯示哪一個(gè)頻道，存在多種情況，例子依然包括 Keep：以前默認(rèn)顯示中間的“運(yùn)動(dòng)”頻道，現(xiàn)在默認(rèn)顯示“計(jì)劃”頻道。
個(gè)人覺(jué)得，對(duì)企業(yè)而言，這兩類做法，都是得不償失的。
因?yàn)檫@樣做，會(huì)讓 “從左起，1、2、3、4”這個(gè)排序失去價(jià)值。沒(méi)有這個(gè)前提，也就談不上“和用戶的使用頻率保持一致。
而且，這種默認(rèn)不顯示左邊第一個(gè)頻道的做法，有時(shí)候會(huì)讓用戶產(chǎn)生一種被綁架的感覺(jué)（默認(rèn)顯示收費(fèi)頻道），有時(shí)會(huì)讓用戶感覺(jué)企業(yè)在自作聰明（默認(rèn)沒(méi)顯示收費(fèi)頻道，但也沒(méi)顯示核心頻道）。
3 符合用戶預(yù)期
主要有兩個(gè)預(yù)期，邏輯預(yù)期和習(xí)慣預(yù)期。
3.1 邏輯預(yù)期
用戶確實(shí)很懶，但不代表用戶不會(huì)思考。
比如前文提到的，網(wǎng)易云音樂(lè)的“私人 FM“功能，在我的認(rèn)知里面，”私人 FM“和”每日推薦“一樣，都是個(gè)性化推薦，性質(zhì)極其相似，應(yīng)該放在一起。
所以，當(dāng)我在新版里的“每日推薦”旁邊找不到“私人 FM”時(shí)，心里就覺(jué)得很奇怪很不解，心想這么好的功能不會(huì)是給刪了吧。
后來(lái)某一天，當(dāng)我在第三個(gè)一級(jí)頻道“我的”里面發(fā)現(xiàn)“私人 FM“的時(shí)候，我又覺(jué)很別扭，不好用。
在新版里面，一開(kāi)始我是去“發(fā)現(xiàn)”頻道的“動(dòng)作庫(kù)”找的，怎么找都找不到，跟找不到網(wǎng)易云音樂(lè)的“私人 FM“是一樣的心情。
因?yàn)槲矣X(jué)得，“動(dòng)作訓(xùn)練”和“動(dòng)作庫(kù)”，是很接近的一對(duì)事物，從邏輯上來(lái)講，用戶會(huì)覺(jué)得這倆事物挨在一起，或者會(huì)猜他們是不是挨在一起。
3.2 習(xí)慣預(yù)期
這里的用戶習(xí)慣，主要有兩類。一類是自家產(chǎn)品培養(yǎng)出來(lái)的，一類是市面上的產(chǎn)品培養(yǎng)出來(lái)的。
通常情況，一級(jí)頻道的設(shè)計(jì)，是要符合用戶習(xí)慣的。
最忌諱的情況是，自己一手培養(yǎng)的用戶習(xí)慣，到最后自己再一手去打破，這樣很容易引起用戶的煩躁、不滿和失望等負(fù)面情緒。
比如 3.1 段的兩個(gè)例子，同樣也沒(méi)有符合用戶的習(xí)慣預(yù)期。因?yàn)樵谧铋_(kāi)始，網(wǎng)易云音樂(lè)的“每日推薦”和“私人 FM“是挨在一切的，Keep 的“動(dòng)作訓(xùn)練”和“動(dòng)作庫(kù)”也是融合在一起的。
4 良好的擴(kuò)展性
就一級(jí)頻道而言，重大功能和通用功能是最有可能擴(kuò)展出更多子功能的。所以，就擴(kuò)展性而言，需要重點(diǎn)照顧到這兩類功能。
通用功能大部分都收納在“我”這個(gè)一級(jí)頻道，通常也是一個(gè)列表的樣式，天然自帶良好的擴(kuò)展性。所以，擴(kuò)展性的難點(diǎn)和重點(diǎn)，最后是落在了重大功能這里。
在一級(jí)頻道，重大功能的展現(xiàn)形式，通常有兩種。
一種是像核心功能一樣，直接把重大功能的內(nèi)容鋪陳出來(lái)，典型代表是網(wǎng)易云音樂(lè)的“云村”。另外一種是把各個(gè)重大功能都收納起來(lái)，只展示一個(gè)入口，典型代表是微信的“發(fā)現(xiàn)”頻道。
對(duì)企業(yè)而言，現(xiàn)實(shí)問(wèn)題是，當(dāng)重大功能的數(shù)量上升到兩個(gè)、三個(gè)甚至更多時(shí)，如何展示他們？
市面上的常規(guī)做法，也是兩種。
一種是像網(wǎng)易云音樂(lè)和 Keep 這樣的，直接開(kāi)辟一個(gè)新的一級(jí)頻道，供重大功能使用。還有一種是微信這種，把所有重大功能都收納起來(lái)，有新的重大功能出現(xiàn)時(shí)，新增一行列表即可。
個(gè)人推薦微信這種做法，因?yàn)檫@種做法的擴(kuò)展性最好，可以應(yīng)對(duì)無(wú)窮盡的重大功能。
至此，我們簡(jiǎn)單總結(jié)一下。個(gè)人看法，四大類功能，具體咋擺放，并沒(méi)有標(biāo)準(zhǔn)答案，但是可以參考以上 4 個(gè)原則。
02 微觀上講，有沒(méi)有補(bǔ)充和例外？
有。借這個(gè)話題，聊兩個(gè)比較特殊的問(wèn)題。
1 頂部標(biāo)題欄的兩側(cè)，適合放什么功能？
先來(lái)分析一下這個(gè)位置，頂部標(biāo)題欄的兩側(cè)，位于屏幕的左上角或右上角，是個(gè)很顯眼的位置。
個(gè)人認(rèn)為，有三類功能比較適合這個(gè)位置。
第一類，是和當(dāng)前頁(yè)面內(nèi)容有密切關(guān)系的功能。比如“編輯”型功能，可參考微信讀書(shū)“書(shū)架”頻道的“編輯”。再比如“新增”型功能，可參考 Twitter 首頁(yè)信息流的發(fā)推圖標(biāo)。此類功能，最適合這個(gè)位置，而且一般也沒(méi)有更合適的位置來(lái)擺放他們。
第二類，是比較高頻的通用功能或重大功能，比如搜索、消息、設(shè)置等。
第三類，是某些高頻功能的快捷入口，比如微信的掃一掃和收付款。
除此之外，如果是一個(gè)比較低頻的功能，不管是通用功能、重大功能還是輔助功能，放在這里，都不合適，因?yàn)闀?huì)對(duì)用戶形成打擾。
2 一個(gè)功能，最多可以出現(xiàn)幾次？
大部分功能，在 App 里只會(huì)出現(xiàn)一次。但在日常使用各種 App 的時(shí)候，我們也會(huì)多次看到同一個(gè)功能，在不同的地方。
有時(shí)候，能看到三次，比如搜索，在微信、知乎和網(wǎng)易云音樂(lè)都出現(xiàn)了三次，我們也不會(huì)覺(jué)得哪里不對(duì)勁兒。實(shí)際上，搜索雖然出現(xiàn)了三次，但也沒(méi)有引起我們的特別注意。
還有一些功能，是出現(xiàn)了兩次。我們?cè)诘诙慰吹降臅r(shí)候，會(huì)有點(diǎn)煩躁，心想怎么又來(lái)了；有時(shí)候會(huì)有點(diǎn)困惑，心想下次我該用哪一個(gè)，哪一個(gè)最快捷。
這中間有什么原則可以參考嗎？
先來(lái)看下搜索，在微信、知乎和網(wǎng)易云音樂(lè)，都是比較高頻的功能。換句話說(shuō)，用戶在不同的一級(jí)頻道，都有可能需要搜索一下，所以搜索出現(xiàn)三次，在不同的一級(jí)頻道，是有這個(gè)需求存在的。
搜索以外的功能，個(gè)人認(rèn)為，只有一類適合出現(xiàn)多次，通常兩次足矣。
那就是，此類功能確實(shí)比較高頻，同時(shí)路徑又比較長(zhǎng)，使用起來(lái)不夠方便。這時(shí)候，就適合給此類功能一個(gè)快捷入口。這個(gè)快捷入口，一般是出現(xiàn)在標(biāo)題欄。
一個(gè)功能，如果只是單純的重復(fù)出現(xiàn)兩次，兩次都沒(méi)出現(xiàn)在標(biāo)題欄。那給用戶的感覺(jué)，就是，App 并不是在給我提供快捷入口，而可能只是通過(guò)重復(fù)的方式來(lái)強(qiáng)推這個(gè)功能，就容易產(chǎn)生煩躁和困惑的負(fù)面情緒。
文章來(lái)源：站酷 作者：SnowDesign
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
用戶體驗(yàn)四維度的概念、價(jià)值以及相互之間的關(guān)系
用戶體驗(yàn)，是用戶在使用產(chǎn)品過(guò)程中建立起來(lái)的一種純主觀感受。
解讀用戶體驗(yàn)，可以有很多視角。本文提供一個(gè)以人為本的視角：用戶體驗(yàn)四維度。具體如下。
HI X：Human Interface Experience，人與界面的交互體驗(yàn)。
HC X：Human Content Experience，人與內(nèi)容的交互體驗(yàn)。
HH X：Human Human Experience，人與人的交互體驗(yàn)。
HB X：Human Brand Experience，人與品牌的交互體驗(yàn)。
用戶體驗(yàn)四維度
01 四維度的概念
怎樣判斷一款產(chǎn)品有幾個(gè)維度？這就要從四維度的概念說(shuō)起。
1. HI X（人與界面的交互體驗(yàn)）
HI X 是指用戶在瀏覽、閱讀、操作界面過(guò)程中產(chǎn)生的主觀感受。
HI X 既受信息架構(gòu)、交互設(shè)計(jì)和UI設(shè)計(jì)的影響，也受根需求和功能架構(gòu)的影響。主要依托手機(jī)和電腦的互聯(lián)網(wǎng)產(chǎn)品，天然存在界面。所以，HI X 屬于基礎(chǔ)屬性，所有產(chǎn)品都有。
2. HC X（人與內(nèi)容的交互體驗(yàn)）
HC X 是指用戶在消費(fèi)內(nèi)容時(shí)，內(nèi)容本身帶給用戶的主觀感受。
這里的內(nèi)容，既包括衣服、鞋子等實(shí)體商品，也包括文章、圖片、視頻等虛擬內(nèi)容。諸如淘寶、網(wǎng)易嚴(yán)選等電商產(chǎn)品，以及公眾號(hào)、Instagram、抖音等 UGC 產(chǎn)品，都具備 HC X 屬性。
3. HH X（人與人的交互體驗(yàn)）
HH X 是指用戶與其他用戶、產(chǎn)品工作人員溝通交流時(shí)產(chǎn)生的主觀感受，或產(chǎn)品的社區(qū)氛圍、溝通氛圍帶給用戶的主觀感受。
所以 HH X 有兩層含義。第一層發(fā)生在用戶與用戶之間，是指當(dāng)用戶扎堆或溝通交流時(shí)，交流氛圍、交流內(nèi)容帶給用戶的主觀感受。第二層發(fā)生在用戶與產(chǎn)品工作人員之間，是指當(dāng)產(chǎn)品依靠人力向用戶提供咨詢、售后、配送等服務(wù)時(shí)，產(chǎn)品工作人員的服務(wù)行為帶給用戶的主觀感受。
關(guān)于第一層含義，不管是更強(qiáng)調(diào)社區(qū)屬性的產(chǎn)品，比如天涯社區(qū)、豆瓣小組、百度貼吧，還是更強(qiáng)調(diào)內(nèi)容屬性的產(chǎn)品，比如公眾號(hào)、微博、小紅書(shū)的筆記，都具備 HH X 屬性。
關(guān)于第二層含義，常見(jiàn)的 HH X 由客服人員提供。如果是電商產(chǎn)品，提供人員還包括快遞員和售后人員等。
4. HB X（人與品牌的交互體驗(yàn)）
HB X 是指當(dāng)用戶想起、談?wù)撈鹌放?，或使用品牌的產(chǎn)品、體驗(yàn)品牌的服務(wù)時(shí)，品牌帶給用戶的主觀感受。
只要一款產(chǎn)品做成了品牌，它就有 HB X 屬性。
HB X 會(huì)直接影響到我們是否信任、喜歡一個(gè)品牌，以及是否會(huì)使用它的產(chǎn)品和服務(wù)。所以，我們對(duì) HB X 往往會(huì)有一個(gè)抓重點(diǎn)的綜合評(píng)價(jià)。就像一個(gè)外向活潑的女生，雖然在外向程度方面和一個(gè)內(nèi)向安靜的男生不一致，但雙方也可能會(huì)選擇在一起，因?yàn)閮?nèi)向、外向并非雙方關(guān)注的重點(diǎn)。
因?yàn)?HB X 牽涉到對(duì)品牌的綜合評(píng)價(jià)，所以就像工作都有一段試用期、戀愛(ài)都有一段了解期一樣，HB X 的形成往往也需要較長(zhǎng)時(shí)間，通常至少要 3~5 年。
02 四維度的價(jià)值
每一個(gè)維度，各有什么價(jià)值？
1. HI X（人與界面的交互體驗(yàn)）
作為基礎(chǔ)屬性，HI X 的價(jià)值主要體現(xiàn)在以下兩方面。
如果是一款只具有 HI X 屬性的工具型產(chǎn)品，比如視頻會(huì)議產(chǎn)品 Zoom，那于這款產(chǎn)品而言，HI X 就是一切，這款產(chǎn)品的成敗也幾乎完全取決于 HI X。
如果是一款同時(shí)具有 HC X、HH X 屬性的內(nèi)容型社區(qū)型產(chǎn)品，比如 B 站、快手這些視頻類產(chǎn)品，那此時(shí)的 HI X 就會(huì)扮演一個(gè)類似交通出行（基礎(chǔ)設(shè)施）的角色。如果 HI X 比較差，這個(gè)“出行”過(guò)程就會(huì)像出去玩時(shí)的塞車(chē)一樣，讓人難受；如果 HI X 很優(yōu)秀，這個(gè)“出行”過(guò)程就會(huì)像準(zhǔn)點(diǎn)的高鐵、飛機(jī)一樣，又快又爽。
2. HC X（人與內(nèi)容的交互體驗(yàn)）
HC X 主要從內(nèi)容層面影響用戶滿意度。
如果 HC X 比較好，用戶消費(fèi)時(shí)的決策時(shí)間就會(huì)被大大縮減，同時(shí)用戶滿意度也會(huì)比較高。比如淘寶上就有一些原創(chuàng)設(shè)計(jì)、質(zhì)量不錯(cuò)、價(jià)格不貴的精品小店，很受歡迎。我們?nèi)ゾW(wǎng)易嚴(yán)選、優(yōu)衣庫(kù)天貓旗艦店這些質(zhì)量不錯(cuò)、設(shè)計(jì)不錯(cuò)、價(jià)格適中的店鋪買(mǎi) 東西時(shí)，也會(huì)很快很省心。
以上說(shuō)的是電商產(chǎn)品，對(duì)于 UGC 類的內(nèi)容產(chǎn)品，也是類似的道理。比如站酷上的首頁(yè)推薦和編輯推薦，相對(duì)而言，HC X 比較不錯(cuò)，所以看這些內(nèi)容的用戶也會(huì)比較多。
3. HH X（人與人的交互體驗(yàn)）
HH X 是用戶情緒的最大影響因素，在情感方面對(duì)用戶具有最大吸引力。物以類聚，人以群分。HH X 良好的產(chǎn)品，會(huì)像一場(chǎng)談笑風(fēng)生、其樂(lè)融融的聚會(huì)，吸引用戶去扎堆。
良好的 HH X 往往意味著良好的氛圍，它不僅能帶給我們諸如輕松、愉快等積極情緒，還能在一定程度上帶給我們一種歸屬感。最終的結(jié)果，就是我們喜歡用這款產(chǎn)品。比如 B 站的 HH X 就比較好，具體而言就是彈幕氛圍比較歡樂(lè)友好，這樣的氛圍帶給用戶的感覺(jué)是比較好的，用戶也喜歡在 B 站就著彈幕看視頻。
4. HB X（人與品牌的交互體驗(yàn)）
HB X 事關(guān)品牌能不能以正面形象住進(jìn)用戶心里。
良好的 HB X，往往意味著良好的品牌美譽(yù)度和忠誠(chéng)度。HB X 良好的產(chǎn)品，就像你信任和喜歡的男/女朋友一樣，他/她會(huì)在你心里占據(jù)一定的分量和地位，讓你樂(lè)意介紹給家人和朋友認(rèn)識(shí)。比如蘋(píng)果的 Mac，就有很高的品牌美譽(yù)度和忠誠(chéng)度，用戶也很樂(lè)意把 Mac 推薦給身邊的朋友。
03 四維度的關(guān)系
四維度之間存在怎樣的關(guān)系?
1. HI X 是另外三個(gè)維度的基礎(chǔ)
HI X 作為基本維度，相當(dāng)于“水之源，木之本”。如果把用戶體驗(yàn)四維度比作一個(gè)金字塔的話，塔底的基石一定是 HI X，塔尖則是 HB X。
2. HC X 通常是 HH X 的基礎(chǔ)
HH X 的產(chǎn)生，通常離不開(kāi) HC X。也就是說(shuō)，通常得有一個(gè)合適的“內(nèi)容”或“主題”，才能把人聚攏過(guò)來(lái)。比如結(jié)婚的時(shí)候，你可以邀請(qǐng)到很多親朋好友來(lái)參加婚禮，但在平時(shí)，你很難邀請(qǐng)到這么多人。我們?cè)?B 站看視頻的時(shí)候，彈幕通常比較歡樂(lè)友好，氛圍不錯(cuò)，但如果沒(méi)有這些視頻，也就不會(huì)有這些彈幕，以及不錯(cuò)的社區(qū)氛圍。
3. HI X、HC X 和 HH X 共同構(gòu)成了 HB X 的基礎(chǔ)
HC X、HH X 和 HI X 一樣，都可以成就 HB X。
以早期 Keep 為例，剛開(kāi)始只有課程這個(gè)功能，也就是說(shuō)只有 HI X 和 HC X 這兩個(gè)屬性。其中，HI X 還可以，HC X 比較優(yōu)秀。在此基礎(chǔ)上，慢慢發(fā)展出了社區(qū)功能（HH X 屬性），而且做得不錯(cuò)。再往后，有了“自律給我自由”的品牌精神。在課程、社區(qū)、品牌精神等因素的助力下，Keep 有了不錯(cuò)的品牌美譽(yù)度和忠誠(chéng)度。也就是說(shuō)，HC X、HH X 和品牌精神等因素，一起成就了良好的 HB X。
4. HB X 也可以僅有 HI X 這一個(gè)基礎(chǔ)
有些產(chǎn)品并不具有 HC X 和 HH X 這兩個(gè)屬性，而是僅有 HI X 這一個(gè)屬性。單憑一個(gè)良好的 HI X，也可以成就良好的 HB X。
比如 Zoom，作為一款開(kāi)視頻會(huì)議的工具應(yīng)用，它最初只有 HI X 這一個(gè)屬性。但是因?yàn)楹芎糜茫琀I X 很優(yōu)秀，所以如今的 Zoom 即便沒(méi)有內(nèi)容（HC X）和社區(qū)（HH X）屬性，依然成了一個(gè)在全球都很受歡迎的品牌，擁有了不錯(cuò)的 HB X。
總的來(lái)說(shuō)，在四維度的金字塔里面，它們的關(guān)系如下圖所示。
文章來(lái)源：站酷 作者：SnowDesign
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
目錄
1.百度網(wǎng)盤(pán) ：會(huì)員標(biāo)識(shí)
2.當(dāng)當(dāng)：搜索記錄隱藏
3.當(dāng)當(dāng)：分享動(dòng)效 ? 一鍵制作朋友圈分享海報(bào)
4.抖音：點(diǎn)擊復(fù)制 ID
5.飛書(shū)：效率工作—語(yǔ)言自動(dòng)轉(zhuǎn)化
6.美團(tuán)：優(yōu)惠卷新到提示
7.墨跡天氣：一鍵登錄（大部分應(yīng)用已上線該功能，部分應(yīng)用仍未上線）
8.起點(diǎn)讀書(shū)：長(zhǎng)按可進(jìn)行互動(dòng)
9.騰訊視頻：亮度調(diào)節(jié)的動(dòng)效設(shè)計(jì)
10.微博：點(diǎn)贊動(dòng)效設(shè)計(jì)
11.知乎：刪除搜索記錄
12. QQ：可隱藏會(huì)話
13. QQ 音樂(lè)：搜索入口的聽(tīng)歌識(shí)曲
14. QQ 閱讀：長(zhǎng)按復(fù)制的放大設(shè)計(jì)
在開(kāi)通會(huì)員后百度網(wǎng)盤(pán)會(huì)進(jìn)行對(duì)于應(yīng)用圖標(biāo)的更換，使得應(yīng)用圖標(biāo)更加高級(jí)，在分享鏈接時(shí)也會(huì)加入會(huì)員分享的標(biāo)識(shí)。
屬于用戶激勵(lì)體系中的一個(gè)板塊，增強(qiáng)用戶的標(biāo)識(shí)和身份。
搜索隱藏功能設(shè)定。
我們?cè)谑褂酶鞔髴?yīng)該的搜索功能時(shí)總會(huì)遇到過(guò)這樣的場(chǎng)景，當(dāng)你要某人或者在某種場(chǎng)景下需要進(jìn)行搜索時(shí)，來(lái)不及刪除自己的搜索記錄出現(xiàn)社死的情況。
而當(dāng)當(dāng)?shù)乃阉麟[藏就可以完美的解決這個(gè)問(wèn)題，退一步講我們可以思考一下為什么別的成熟型應(yīng)用，沒(méi)有采用這樣的方式。大部分是沒(méi)有這個(gè)功能，其余則是在搜索這一個(gè)功能上已經(jīng)添加了其余用戶體驗(yàn)的設(shè)計(jì)。所以在這一塊就沒(méi)法加入這個(gè)設(shè)計(jì)。
在當(dāng)當(dāng)應(yīng)用中點(diǎn)擊分享進(jìn)入頁(yè)面后不同于傳統(tǒng)的分享頁(yè)面，而是把分享到微信和分享到朋友圈進(jìn)行了動(dòng)態(tài)設(shè)計(jì)。并且在分享到朋友圈的右上角加上了海報(bào)的標(biāo)識(shí)。我們點(diǎn)擊會(huì)自動(dòng)跳轉(zhuǎn)生成海報(bào)。
這樣的設(shè)計(jì)可以更加吸引用戶的眼球并且自動(dòng)生成海報(bào)可以激發(fā)用戶在朋友圈轉(zhuǎn)發(fā)的次數(shù)。
主頁(yè) ID 點(diǎn)擊可進(jìn)行復(fù)制 很多應(yīng)用都有 ID 。但是當(dāng)我們要進(jìn)行 ID 搜索的時(shí)候，我們便需要一遍一遍的反復(fù)查看或者記住這個(gè) ID 然后再進(jìn)行搜索。
目前部分的應(yīng)用也上線了類似的功能,讓用戶點(diǎn)擊 ID 區(qū)域可進(jìn)行復(fù)制。對(duì)于用戶體驗(yàn)的提升有著很顯著的效果。
飛書(shū)屬于一款協(xié)同辦公類的應(yīng)用
在飛書(shū)的設(shè)置用有語(yǔ)音直接轉(zhuǎn)換文字的說(shuō)明，飛書(shū)本身便是一款協(xié)同辦公類的產(chǎn)品。此產(chǎn)品效率便是產(chǎn)品關(guān)鍵詞之一，所以加入這樣的設(shè)置可極大的提升用戶的體驗(yàn)。
有提示用戶新到多少?gòu)垉?yōu)惠卷的提示
可以促進(jìn)用戶消費(fèi)的同時(shí)能幫助和提醒用戶去使用消費(fèi)卷不僅提高了商家的銷量還使得用戶在消費(fèi)中發(fā)現(xiàn)自己的優(yōu)惠卷及時(shí)使用
一鍵登錄
應(yīng)用登陸中目前主流為（1.第三方登錄，登陸之后需要再次綁定手機(jī)號(hào)。2.手機(jī)號(hào)注冊(cè)登陸，登陸之后可選擇是否綁定第三方。3.一鍵登錄，登陸之后可以選擇是否綁定第三方）在設(shè)計(jì)流程中，設(shè)計(jì)開(kāi)發(fā)者需要盡可能的減少對(duì)流程的復(fù)雜化。
一鍵登錄在為看來(lái)是最喜歡的一種登陸方式。導(dǎo)致現(xiàn)在如果需要各種注冊(cè)綁定，除非必要的情況下，我會(huì)直接放棄這款應(yīng)用。
長(zhǎng)按頁(yè)面可以框選當(dāng)前的段落，并且出現(xiàn)互動(dòng)選項(xiàng)。
增加用戶和用戶之間，用戶和作者之間的互動(dòng)。使得用戶在讀書(shū)的同時(shí)有著較強(qiáng)的參與感。
滑動(dòng)可調(diào)節(jié)亮度
左邊的小動(dòng)效的設(shè)計(jì)加上右邊的漸變進(jìn)度條，使用戶可以更加明確的知道自己所處于一個(gè)什么樣的觀看環(huán)境，并且加入了漸隱漸現(xiàn)的出場(chǎng)和入場(chǎng)。
用一個(gè)小巧的動(dòng)效設(shè)計(jì)幫助用戶確定自己的亮度屬性，
點(diǎn)擊點(diǎn)贊會(huì)出現(xiàn)彩色的波浪并且不斷擴(kuò)散的同時(shí)有小表情彈出。
增加趣味性和互動(dòng)性。
清空時(shí)會(huì)在進(jìn)行確認(rèn)，再次點(diǎn)擊全部刪除方可刪除。
在下方列表中可逐一刪除，上面清空中不是點(diǎn)擊后就全部清空。而是再次出現(xiàn)，起強(qiáng)調(diào)和確認(rèn)的作用。
增加用戶體驗(yàn)，幫助用戶進(jìn)行二次確認(rèn)和防止用戶誤觸。作為一款咨訊類應(yīng)用用戶的搜索記錄也是比較重要的。
前幾天發(fā)現(xiàn)的一個(gè)神級(jí)功能（雖然我已經(jīng)不用 QQ 進(jìn)行社交了），當(dāng)時(shí)我外甥和我講述了這個(gè)功能他么00后戲稱為養(yǎng)魚(yú)神器。
在好友的設(shè)置中可隱藏會(huì)話，開(kāi)啟隱藏會(huì)話以后。此聯(lián)系人發(fā)來(lái)的消息不會(huì)顯示在聯(lián)系人列表。需要自己手動(dòng)去設(shè)置隱藏會(huì)話列表去尋找。
應(yīng)用的功能更加多樣化滿足多種不同的需求。
在搜索入口加入了聽(tīng)歌識(shí)曲且進(jìn)入界面后可進(jìn)行聽(tīng)歌識(shí)曲和哼唱識(shí)別的切換
搜索歌曲界面的使用場(chǎng)景為：1.用戶得知該歌曲的名稱或者歌詞進(jìn)行搜索。2.用戶聽(tīng)到了某一首很好聽(tīng)的歌曲想進(jìn)行搜索。此時(shí)在場(chǎng)景二的情況下，正好可以進(jìn)行聽(tīng)歌識(shí)曲。聽(tīng)歌識(shí)曲此功能在比較舊的版本屬于主頁(yè)中的一個(gè)模塊，把聽(tīng)歌識(shí)曲放到搜索入口處更加符合用戶場(chǎng)景。
對(duì)用戶場(chǎng)景進(jìn)行細(xì)致的研究，增加了用戶體驗(yàn)。
長(zhǎng)按復(fù)制會(huì)有放大鏡設(shè)計(jì)
當(dāng)用戶處于復(fù)制文案的場(chǎng)景下時(shí)，由于復(fù)制需要拖動(dòng)，在拖動(dòng)的過(guò)程中會(huì)按壓住自己所處于的復(fù)制內(nèi)容位置。所以在用戶進(jìn)行復(fù)制時(shí)加入放大鏡的設(shè)計(jì)會(huì)使得用戶清楚的明白自己復(fù)制到哪里，不需要后續(xù)用戶在進(jìn)行刪減。
極大的加強(qiáng)了此場(chǎng)景下的用戶體驗(yàn)
文章來(lái)源：站酷 作者：張陽(yáng)光Designer
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
GUI（Graphical UserInterface）圖形界面，市面上最常見(jiàn)的交互方式。點(diǎn)觸，滑動(dòng)，作為主要輸入方式。圖像顯示作為主要輸出方式。
VUI（Voice User Interface）語(yǔ)音界面，常見(jiàn)沒(méi)有屏幕的智能音箱/耳機(jī)，靠語(yǔ)言輸入和交流，如我們常見(jiàn)的小艾同學(xué)，天貓精靈等。
1973年第一個(gè)可視化操作的Alto電腦在施樂(lè)帕洛阿爾托研究中心（Xerox PARC）完成。Alto是第一個(gè)把計(jì)算機(jī)所有元素結(jié)合到一起的圖形界面操作系統(tǒng)。它使用3鍵鼠標(biāo)、位運(yùn)算顯示器、圖形窗口、以太網(wǎng)絡(luò)連接。
1981年施樂(lè)公司推出了Alto的繼承者Star，Alto曾首次使用了窗口設(shè)計(jì)。
1983年蘋(píng)果電腦公司推出Apple Lisa個(gè)人電腦，是全球第一款搭載圖形用戶界面（GUI）的個(gè)人電腦。
1984年蘋(píng)果電腦公司推出Macintosh。
1986年首款用于Unix的窗口系統(tǒng)X Window System發(fā)布。
1988年IBM發(fā)布OS/2 1.10標(biāo)準(zhǔn)版演示管理器（Presentation Manager），這是第一種支持Intel計(jì)算機(jī)的穩(wěn)定的圖形界面。
1992年微軟公司發(fā)布Windows 3.1，增加了多媒體支持。
1995年微軟的Windows 95發(fā)布，其窗口操作系統(tǒng)的外觀基本定型。
1996年微軟發(fā)布Microsoft Bob，此軟件具有動(dòng)畫(huà)助手和有趣的圖片。
1996年IBM發(fā)布OS/2 Warp 4，它的交互界面得到顯著改善，至今仍有不少ATM機(jī)運(yùn)行這樣的系統(tǒng)。
1997年KDE和GNOME兩大開(kāi)源桌面項(xiàng)目啟動(dòng)。
1997年蘋(píng)果電腦公司發(fā)布Mac OS 8，這個(gè)系統(tǒng)具有三維外觀并提供了SpringLoaded Folder功能。
2000年蘋(píng)果電腦公司推出Mac OS X系統(tǒng)的默認(rèn)外觀Aqua。
2001年微軟發(fā)布Windows XP，實(shí)現(xiàn)了主題支持。
2003年Mac OS X v10.3提供了一鍵單擊訪問(wèn)任何已打開(kāi)窗口的功能。
2003年Sun公司的Java桌面系統(tǒng)為GNOME桌面添加了和Mac類似的效果。
2006年微軟發(fā)布Windows Vista，對(duì)此前其視窗操作系統(tǒng)的外觀作了較大的修改，實(shí)現(xiàn)了Aero功能。
20世紀(jì)90年代，誕生了第一個(gè)可行的、非特定的（每個(gè)人都可以對(duì)他說(shuō)話）的語(yǔ)音識(shí)別系統(tǒng)，交互式語(yǔ)音應(yīng)答（Interactive Voice Response，IVR）系統(tǒng)的出現(xiàn)代表了VUI的第一個(gè)重要時(shí)期。人通過(guò)電話線路進(jìn)行交互并執(zhí)行任務(wù)，如機(jī)票預(yù)訂、銀行轉(zhuǎn)帳、業(yè)務(wù)查詢等。
目前很多像siri、Google這類集成了視覺(jué)和語(yǔ)音信息的APP，以及Amazon Echo這類純語(yǔ)音的設(shè)計(jì)產(chǎn)品，逐步發(fā)展并成為主流。隨著語(yǔ)音識(shí)別技術(shù)、AI技術(shù)、互聯(lián)網(wǎng)技術(shù)的發(fā)展，我們已經(jīng)可以在手機(jī)設(shè)備中用語(yǔ)音處理很多事情，但還有很多事情目前無(wú)法通過(guò)語(yǔ)音完成，需要我們探索。
交互的多樣性：
不同于PC機(jī)通過(guò)鼠標(biāo)來(lái)點(diǎn)擊，在觸控設(shè)備上通過(guò)手指點(diǎn)按，由于手指的精確度相對(duì)于鼠標(biāo)指針差很多，所以子啊移動(dòng)頁(yè)面設(shè)計(jì)當(dāng)中的交互元素一定得辨識(shí)作用，手機(jī)并沒(méi)有懸停操作所以圖標(biāo)如果特征不明顯時(shí)一定要加文字識(shí)別，設(shè)計(jì)時(shí)也應(yīng)注意圖標(biāo)和菜單元素的尺寸。
拖拽和移動(dòng)是很相似的交互工作，被拖拽的元素始終跟隨著緊貼屏幕的指尖
除了使用單指之外，還可以用兩個(gè)手指放大，縮小圖片，如果設(shè)計(jì)了一些新的多指交互一定要給用戶提示和指導(dǎo)。
智能家居
在智能家居領(lǐng)域VUI應(yīng)用越來(lái)越廣泛，相信在不久的將來(lái)我們一定能夠享受到更多的VUI所帶給我們的便利。
輔助駕駛
車(chē)載語(yǔ)音交互系統(tǒng)使得我們可以在開(kāi)車(chē)的同時(shí)接聽(tīng)電話、聽(tīng)廣播等。
企業(yè)應(yīng)用
未來(lái)大型企業(yè)中將會(huì)多領(lǐng)域應(yīng)用VUI，用于書(shū)寫(xiě)、記錄等工作。
醫(yī)療教育
智能記錄病例、管理病例的出入。
過(guò)多的聲音干擾，不但會(huì)增加用戶的心智負(fù)擔(dān)，將會(huì)引起用戶感到厭煩，尤其是，語(yǔ)音在資訊的負(fù)荷量上又比單純的聲音來(lái)的更多，考量是否存在存在的必要性就放在格外重要。而言，可以尋找替代的方式，透過(guò)震動(dòng)和燈光甚至狀態(tài)變化來(lái)提示，減少使用者的認(rèn)知負(fù)荷，并確保聲音只會(huì)在特定的時(shí)間點(diǎn)出現(xiàn)，并提供使用者自行設(shè)定關(guān)閉聲音的功能
除了聲音本身的設(shè)計(jì)外，還要考慮整體環(huán)境的影響因素，可能周遭受非常的吵雜。換句話說(shuō)，在KTV的包廂，吵雜的環(huán)境，會(huì)使用者無(wú)法聽(tīng)到消防警鈴響，而容易造成危險(xiǎn)事件的產(chǎn)生。也因?yàn)槿绱?，消防警鈴的聲音頻率設(shè)計(jì)就應(yīng)該介于2kM到4kM，因?yàn)檠芯恐赋鋈祟惖亩鋵?duì)于這個(gè)范圍的聲音最敏感
從音量的角度來(lái)看，耳朵對(duì)不同頻率的音量有不同的感知程度，有些聲音聽(tīng)起來(lái)很響亮，有些則是很沉悶因人而異，但比較客觀的量化體驗(yàn)指標(biāo)就是分貝（decibel，dB） ，在尺度上超過(guò)70分貝以上，會(huì)讓人產(chǎn)生憂慮不安，并引發(fā)各種癥狀，因此要盡量避免尺寸大小過(guò)大的設(shè)計(jì)， ，，降低主動(dòng)的侵入性?；谶@些因素總和來(lái)說(shuō)，還要考量到用戶和產(chǎn)品間的距離，與產(chǎn)品愈近，對(duì)于體積的需求量較大，反之為然
在聲音體驗(yàn)設(shè)計(jì)（Amber Case，2018）一書(shū)指出，當(dāng)警告或提示音出現(xiàn)的頻率愈高，就應(yīng)該設(shè)計(jì)成愈短，但不足就是，如果把聲音設(shè)計(jì)成短而急促，從而使用者需要集中相反地，事件發(fā)生時(shí)間間隔長(zhǎng)且久，則聲音提示更需要明顯且激烈的聲音來(lái)提醒用戶，例如手機(jī)鈴聲響時(shí)，需要告知用戶
文章來(lái)源：站酷 作者：張陽(yáng)光Designer
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
組件化思維對(duì)于一個(gè)設(shè)計(jì)師來(lái)說(shuō)十分重要，它能夠幫助你更好的去進(jìn)行產(chǎn)品的設(shè)計(jì),那么組件化思維對(duì)于設(shè)計(jì)者都起到什么作用呢?
1.符合產(chǎn)品功能邏輯，組件化的設(shè)計(jì)理念能幫助設(shè)計(jì)符合產(chǎn)品功能邏輯。
2.有助于保持交互一致性，在一個(gè)項(xiàng)目里，選擇日期應(yīng)該是統(tǒng)一的交互方式，在整個(gè)產(chǎn)品中就應(yīng)該只有一種存在形式。所以時(shí)間選擇器就是一個(gè)組件，一個(gè)可以復(fù)用的組件，如果你沒(méi)有組件化思維，很可能出現(xiàn)好幾個(gè)不同的時(shí)間選擇器，一會(huì)兒是流輪撥盤(pán)，一會(huì)兒是日歷，一會(huì)兒又是下拉列表，這樣的設(shè)計(jì)絕對(duì)是不能上線的。當(dāng)然該統(tǒng)一的地方還有很多，比如:錯(cuò)誤提示的形式，講度條的交互方式，導(dǎo)航欄和按鈕的樣式。表單，下拉菜單等等。
3.減少開(kāi)發(fā)工程師的工作量,開(kāi)發(fā)時(shí)使用不同的技術(shù),了解不同技術(shù)之間的差異,設(shè)計(jì)時(shí)按照每個(gè)開(kāi)發(fā)軟件的組件來(lái)做設(shè)計(jì)極大的減少了開(kāi)發(fā)的時(shí)間.
4.保持視覺(jué)風(fēng)格的統(tǒng)一，在同個(gè)項(xiàng)目不同頁(yè)面按鈕等組件的樣式上應(yīng)該保持統(tǒng)一。
5.便于多設(shè)計(jì)師協(xié)作組件化設(shè)計(jì)是大型設(shè)計(jì)項(xiàng)目的必要條件，多人協(xié)作完成項(xiàng)目時(shí)，應(yīng)當(dāng)保持視覺(jué)統(tǒng)一規(guī)范，組件化建立就起到了至關(guān)重要的作用。
6.便于修改設(shè)計(jì)，設(shè)計(jì)總是需要修改優(yōu)化的，只需要根據(jù)需求調(diào)整需要調(diào)整組件即可。
針對(duì)各種組件的開(kāi)發(fā)軟件做了以下介紹,歡迎在評(píng)論區(qū)進(jìn)行補(bǔ)充與探討!
echarts
幫助各行業(yè)進(jìn)數(shù)據(jù)處理以及分析,一鍵生成餅圖,柱狀圖,甘特圖,折線圖等多種圖表;簡(jiǎn)道云的圖表分析
各種圖示效果樣式案例可供設(shè)計(jì)者參考
https://echarts.apache.org/examples/zh/index.html#chart-type-line
Ant Design
ant通過(guò)模塊化解決方案，降低冗余的生產(chǎn)成本，讓設(shè)計(jì)者專注于更好的用戶體驗(yàn),規(guī)范設(shè)計(jì)的設(shè)計(jì)思維,有豐富的設(shè)計(jì)資源與組件,對(duì)設(shè)計(jì)樣式的表達(dá)起到非常好的參考作用
https://ant.design/index-cn
Element
與Ant Design稍加相似,可供設(shè)計(jì)者作為輔助參考
https://element.eleme.cn/#/zh-CN/guide/design
另外其它的開(kāi)發(fā)工具:
React是用于構(gòu)建用戶界面的JavaScript庫(kù)，起源于Facebook的內(nèi)部項(xiàng)目
Hook 可以中文譯為“掛鉤”或者“鉤子”，逆向開(kāi)發(fā)中改變程序運(yùn)行的一種技術(shù),在逆向開(kāi)發(fā)中是指改變程序運(yùn)行流程的技術(shù)，通過(guò)Hook在別人的程序中。需要了解其Hook原理，這樣就能夠?qū)阂獯a攻擊進(jìn)行有效的防護(hù)
Umi 是一個(gè)可插拔的企業(yè)級(jí) react 應(yīng)用框架。 插件化 umi 的整個(gè)生命周期都是插件化的，甚至其內(nèi)部實(shí)現(xiàn)就是由大量插件組成
可擴(kuò)展 Umi 實(shí)現(xiàn)了完整的生命周期,并使其插件化,Umi 內(nèi)部功能也全由插件完成。此外還支持插件和插件集,以滿足功能和垂直
Vue 有兩大特點(diǎn)：響應(yīng)式編程、組件化。其優(yōu)勢(shì)為：輕量級(jí)框架、簡(jiǎn)單易學(xué)、雙向數(shù)據(jù)綁定、組件化、數(shù)據(jù)和結(jié)構(gòu)的分離、虛擬DOM、運(yùn)行速度快。
vue是單頁(yè)面應(yīng)用，使頁(yè)面局部刷新，不用每次跳轉(zhuǎn)頁(yè)面都要請(qǐng)求所有數(shù)據(jù)和dom，這樣大大加快了訪問(wèn)速度和提升用戶體驗(yàn)。它的第三方ui庫(kù)很多節(jié)省開(kāi)發(fā)時(shí)間。https://cn.vuejs.org/v2/guide/index.html
注: vue是我們的常用框架，大多數(shù)客戶的選擇。ant?react?hook?umi，中后臺(tái)這個(gè)也比較多，最近的項(xiàng)web端的基本上是這兩種選型。
其它常設(shè)計(jì)有wpf/qt/mfc/開(kāi)發(fā)，在c++或c#下運(yùn)行的客戶端程序
其它例如:
Bootstrap 是Twitter推出的一個(gè)用于前端開(kāi)發(fā)的開(kāi)源工具包。是基于 HTML、CSS、JAVASCRIPT 的,它簡(jiǎn)潔靈活,使得 Web 開(kāi)發(fā)更加快捷
https://getbootstrap.com/docs/5.1/examples/
developer與material匯聚了ios、安卓組件框架及人機(jī)交互指南,相關(guān)鏈接:
https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/
https://developer.android.google.cn/docs/quality-guidelines/core-app-quality
https://material.io/components?platform=android
藍(lán)藍(lán)設(shè)計(jì)—— 作者：純純
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
先舉個(gè)例子來(lái)理解一下：我要點(diǎn)擊手機(jī)上的確認(rèn)按鈕所需要的時(shí)間，和 手與按鈕的距離（D） 按鈕的大?。⊿）有關(guān)。 當(dāng)距離越長(zhǎng)，所需要的時(shí)間越長(zhǎng)。當(dāng)按鈕越大，所需要的時(shí)間越短。
這里是說(shuō)合理的大小。一般來(lái)講越大用戶越容易到達(dá)，但是屏幕的大小是一定的，某一按鈕/目標(biāo)越大就會(huì)降低其他按鈕/目標(biāo)的大小。所以大小是相對(duì)制衡的，要根據(jù)具體情景和需求制定合理的大小（包括肉眼大小和實(shí)際熱區(qū)大?。?。但是關(guān)于手指點(diǎn)擊的最小熱區(qū)有規(guī)定是44x44px，一般的圖形的熱區(qū)大小都要高于這個(gè)大小，才能便于點(diǎn)擊。其他大小要根據(jù)功能需求進(jìn)行制定。
相對(duì)距離指的是界面內(nèi)部各個(gè)元素與控件之間的距離。一般通過(guò)研究 整個(gè)流程 的交互動(dòng)作，相互關(guān)聯(lián)的操作元素/操作手勢(shì) 距離會(huì)相對(duì)比較近，這樣能有效減少操作的時(shí)間。
屏幕邊界是可以確定的（鼠標(biāo)向某一方向一直移動(dòng)終會(huì)停留在屏幕邊界），但是屏幕中央確是較難確定的（四個(gè)方向鼠標(biāo)均能延展出去）。一些重要和主要的操作放在屏幕的邊界，可以方便用戶快速到達(dá)，也是菲茨定律的普遍應(yīng)用。
業(yè)務(wù)目標(biāo)有時(shí)候是與用戶目的是相違背的，也需要根據(jù)具體場(chǎng)景來(lái)判斷菲茨定律的使用走向。在特殊情境下也會(huì)通過(guò)距離和自身大小來(lái)反向增加使用時(shí)間來(lái)完成目的。
選擇增加也就意味著事情可以發(fā)展的方向更加多元化，用戶就需要權(quán)衡事情該往哪個(gè)方向發(fā)展，而這就需要時(shí)間。不要讓你的用戶思考太多，所以一般給出的選項(xiàng)在滿足需求的情況下要盡可能的少。（這里注意：一般情況下要少但也不能太少，強(qiáng)迫用戶也是不可取。）
事情越復(fù)雜，越難處理。盡可能的將復(fù)雜的事件通過(guò)交互或者版式等手段進(jìn)行簡(jiǎn)化，讓用戶覺(jué)得容易把握，而不是大量事物/流程/元素的堆砌。
同一類型或者同一層級(jí)的元素出現(xiàn)，數(shù)目一般控制在5-9個(gè)。
面對(duì)有大量信息的時(shí)候（數(shù)字/文字/段落）將其分割到5-9個(gè)等大腦容易記住的數(shù)量。
看到了有一些設(shè)計(jì)并沒(méi)有按照米勒定律去執(zhí)行，因?yàn)殡S著時(shí)代的發(fā)展，有一些定律并不是萬(wàn)能適用的。定律不可照搬，要根據(jù)具體情境去做取舍，以最終效果為導(dǎo)向。
在面臨很多復(fù)雜功能時(shí)，簡(jiǎn)單的堆砌顯得啰嗦，需求又不能隨意刪減。這時(shí)候就可以將相類似的功能放在同一個(gè)組別里面進(jìn)行收納整理，這與席克定律也相接近。
這里與視覺(jué)設(shè)計(jì)也有很多重疊，即落實(shí)到頁(yè)面的高保真的細(xì)節(jié)。保證內(nèi)容想接近的元素間距要小，內(nèi)容有區(qū)分的間距要大。
事物的復(fù)雜性是固定，但是要思考你所面對(duì)的是最簡(jiǎn)程度的復(fù)雜性么。首先優(yōu)化內(nèi)部系統(tǒng)的整個(gè)流程和不必要的步驟能夠有效降低系統(tǒng)本身的復(fù)雜性。
再把復(fù)雜性降低到最低程度之后，事物/流程仍然表現(xiàn)出一定復(fù)雜性時(shí)。就要考慮造成復(fù)雜的元素是什么，是否要將造成復(fù)雜的元素進(jìn)行收納組合，甚至隱藏。
想清楚這張界面的主要目的是什么，順著這個(gè)目標(biāo)去引導(dǎo)用戶，其他元素的視覺(jué)層級(jí)要讓步，來(lái)讓用戶抓住重點(diǎn)。
少代表流程/步驟/界面元素的減少，多意味著用戶量的增加 體驗(yàn)感的增強(qiáng)。
產(chǎn)品在功能迭代改版上，會(huì)出現(xiàn)大量不同的聲音和方向。但功能不是越多越好，用戶的時(shí)間是確定的，在某一功能上消耗的時(shí)間長(zhǎng)，在其他功能上就短了。奧卡姆剃刀就要求我們找到主功能點(diǎn)，其他功能點(diǎn)要做出讓步妥協(xié)甚至砍掉。
有一些功能在你操作之前就禁止操作，避免了錯(cuò)誤的發(fā)生。或者通過(guò)告知操作之后會(huì)產(chǎn)生的不良后果
在操作過(guò)程中，進(jìn)行錯(cuò)誤提醒，有效避免錯(cuò)誤的進(jìn)行
用戶在使用app的過(guò)程進(jìn)入錯(cuò)誤的路線，需要給用戶彌補(bǔ)的機(jī)會(huì)
倒計(jì)時(shí)會(huì)給人一種緊促感，逼迫用戶去注意，無(wú)形之中給用戶規(guī)定了任務(wù)，這個(gè)任務(wù)也就是咋們的業(yè)務(wù)目標(biāo)。倒計(jì)時(shí) 讀條等交互方式也應(yīng)該謹(jǐn)慎恰當(dāng)使用，因?yàn)椴皇敲恳粋€(gè)任務(wù)場(chǎng)景都需要給用戶緊迫感。
這一點(diǎn)也是利用未完成任務(wù)的相關(guān)信息反饋達(dá)到讓用戶去完成任務(wù)的業(yè)務(wù)目的。
創(chuàng)新意味著改變，改變的不僅僅是你的界面還有用戶習(xí)慣和長(zhǎng)久以來(lái)的認(rèn)知模型。破壞習(xí)慣重建習(xí)慣是有很大風(fēng)險(xiǎn)的。
其實(shí)能看到很多Dribble頁(yè)面很有特點(diǎn)，也不是完全沒(méi)有落地性，但是實(shí)際國(guó)內(nèi)產(chǎn)品并沒(méi)有看到這樣的設(shè)計(jì)，原因就是不符合雅各布定律。
這一點(diǎn)好像和上一點(diǎn)有點(diǎn)相悖。但是其實(shí)也不違背，有很多分寸的拿捏往往不是理論能完全決定的。微信后來(lái)居上絕不是因?yàn)檎瞻醧q，如果新的創(chuàng)新帶來(lái)的優(yōu)勢(shì)能夠彌補(bǔ)不相同所帶來(lái)的不足，也是可以嘗試的。
文章來(lái)源：站酷 作者：花城丶
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
保持好奇，巧妙融合，追求卓越，自然而然
文章來(lái)源：站酷 作者：SnowDesign
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( m.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.yvirxh.cn
<p id="vsvpl"><kbd id="vsvpl"></kbd></p>