中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

隨著一個(gè)公司團(tuán)體內(nèi)部的設(shè)計(jì)任務(wù)復(fù)雜化和規(guī)模化，要想確保自身輸出所有產(chǎn)品的一致性，給設(shè)計(jì)流程配置一套可參考的明確標(biāo)準(zhǔn)顯然是不可避免的趨勢(shì)，但是我們應(yīng)該如何向客戶或者非設(shè)計(jì)師們說(shuō)服這一決定的主要目的并非是為了偷懶減輕工作量，或者想一勞永逸后高枕無(wú)憂，同時(shí)還讓他們也加入到這一標(biāo)準(zhǔn)的建立中，共同創(chuàng)造出被公司內(nèi)所有人認(rèn)可的方案呢？

這篇文章就是針對(duì)這一問(wèn)題很好地提供了幾種可以使用的成功策略，更好的是，它也幫助了我們加深對(duì)建立一套模塊化的設(shè)計(jì)系統(tǒng)所帶來(lái)好處的認(rèn)識(shí)。

作為設(shè)計(jì)師和開(kāi)發(fā)人員，我們知道一個(gè)占主導(dǎo)地位的（設(shè)計(jì)）系統(tǒng)能夠?yàn)楣镜牟煌w驗(yàn)輻射一致性。但有時(shí)候構(gòu)建這樣一個(gè)系統(tǒng)被認(rèn)為是一項(xiàng)極具風(fēng)險(xiǎn)的投資，并且它的價(jià)值不一定能立即可見(jiàn)。因此你應(yīng)該采取什么樣的方式向客戶推銷一個(gè)設(shè)計(jì)系統(tǒng)？你又應(yīng)該怎樣做才能說(shuō)服公司將構(gòu)建一個(gè)模式庫(kù)放到戰(zhàn)略路線圖之中呢？

你可以把一個(gè)公司的所有網(wǎng)站界面一頁(yè)頁(yè)打印出來(lái)，再集中到一個(gè)大展板上，來(lái)顯示公司內(nèi)部是多么的四分五裂。

Dan Mall 在他「銷售設(shè)計(jì)系統(tǒng)」一文中，談到我們可以把一個(gè)公司的所有網(wǎng)站界面一頁(yè)頁(yè)打印出來(lái)，再集中到一個(gè)大展板上，來(lái)顯示公司內(nèi)部是多么的四分五裂。這個(gè)例子也可以說(shuō)明每次都從頭開(kāi)始，一個(gè)個(gè)地搭建網(wǎng)站，沒(méi)有意義地重復(fù)造輪子，會(huì)浪費(fèi)多少金錢和精力。

將這些不一致可視化，有助于發(fā)現(xiàn)和找到網(wǎng)頁(yè)中潛在的問(wèn)題，但我們?nèi)绾尾拍茏C明一個(gè)模塊化的設(shè)計(jì)系統(tǒng)對(duì)實(shí)現(xiàn)網(wǎng)頁(yè)的一致性有幫助呢？

畢竟設(shè)計(jì)系統(tǒng)是由一個(gè)個(gè)模塊，而非頁(yè)面構(gòu)建而成的。我的經(jīng)驗(yàn)告訴我，最有效的方法是向客戶展示有形的利益，而不是向他們解釋操作過(guò)程或者具體步驟。

因?yàn)榭蛻舨⒉幌胫涝釉O(shè)計(jì)、模塊化設(shè)計(jì)或者獨(dú)立模式，他們更愿意看到實(shí)際產(chǎn)出，比如一個(gè)可操作的原型或者一個(gè)包含了所有組件的界面。

圖片來(lái)源于 Brad Frost 網(wǎng)站

一種更好地展示產(chǎn)出的方法是使用 project hub（項(xiàng)目中心）

還有一種能更好地展示產(chǎn)出的方法是使用 project hub ① （項(xiàng)目中心）—— 一個(gè)可以將項(xiàng)目中所有重要的素材集中起來(lái)，按時(shí)間順序排列，并保持不斷更新的網(wǎng)站鏈接。這樣客戶可以通過(guò)隨時(shí)訪問(wèn)它來(lái)查看項(xiàng)目的進(jìn)程。你甚至可以給響應(yīng)式原型中添加可編輯內(nèi)容的屬性，來(lái)使原型中的文本變得可編輯，因此當(dāng)一個(gè)項(xiàng)目的利益相關(guān)者想要調(diào)整文本時(shí)，她可以在任意瀏覽器中進(jìn)行操作，然后通過(guò)調(diào)整窗口大小來(lái)查看文本是否也可以適用于窄屏。

當(dāng)我們與其他公司合作時(shí)，我們從來(lái)不會(huì)推銷原子設(shè)計(jì)方法②，也很少推銷設(shè)計(jì)系統(tǒng)。相反，我們銷售的是一個(gè)能快速看到產(chǎn)出，（恰好）包含了模塊化設(shè)計(jì)方法論的新方案。我們“銷售”的是 項(xiàng)目中心和快速的周轉(zhuǎn)時(shí)間，而構(gòu)建一個(gè)設(shè)計(jì)系統(tǒng)通常只存在于設(shè)計(jì)師和前端開(kāi)發(fā)人員交流之中，而不是客戶需要思考的問(wèn)題。

① 一個(gè)由 Brad Frost 提出，用于跟蹤設(shè)計(jì)項(xiàng)目進(jìn)度的工具。通常是一個(gè)在線（公開(kāi)或受密碼保護(hù)）形式的文件鏈接，以便團(tuán)隊(duì)中每個(gè)人都可以進(jìn)行訪問(wèn)。

②原子設(shè)計(jì)是一種方法論，由原子、分子、組織、模板和頁(yè)面共同協(xié)作以創(chuàng)造出更有效的用戶界面系統(tǒng)的一種設(shè)計(jì)方法。

將一個(gè)設(shè)計(jì)系統(tǒng)納入到公司發(fā)展路線中的策略

有時(shí)我們不再是向客戶推銷一致性，而是要將它變?yōu)橐徽麄€(gè)公司團(tuán)隊(duì)，無(wú)論市場(chǎng)營(yíng)銷，內(nèi)容管理，還是技術(shù)支持團(tuán)隊(duì)，都明確的優(yōu)先考慮事項(xiàng)。而此時(shí)展示產(chǎn)出也同樣很有幫助，特別是因?yàn)檫@些產(chǎn)出可能不僅只是一組可操作的原型。Nathan Curtiss 在最近（由 Jina Bolton 精心策劃的） Clarity 會(huì)議的演講中建議，設(shè)計(jì)系統(tǒng)一定要確保扎根于一個(gè)公司團(tuán)隊(duì)之中。

在他的個(gè)人經(jīng)歷中，確保一個(gè)設(shè)計(jì)系統(tǒng)在公司團(tuán)隊(duì)中的成功，對(duì)提高團(tuán)隊(duì)的工作效率至關(guān)重要，比如：設(shè)計(jì)系統(tǒng)能幫助各方參與者節(jié)省時(shí)間并快速獲得結(jié)果。但你要如何讓團(tuán)隊(duì)去相信一些他們還沒(méi)有體驗(yàn)過(guò)的價(jià)值呢？

很簡(jiǎn)單，為他們創(chuàng)造這種價(jià)值。想象一下，如果在一塊具有不一致性體驗(yàn)的展板旁，放一塊能帶來(lái)一致性體驗(yàn)的展板進(jìn)行對(duì)比；或者是對(duì)頁(yè)面的基本外觀（可能只是一個(gè)標(biāo)題和幾個(gè)關(guān)鍵按鈕）進(jìn)行重新設(shè)計(jì)來(lái)使頁(yè)面間的體驗(yàn)一致，然后也打印出來(lái)，并將修改前后的兩塊展板放在一起對(duì)照會(huì)怎么樣呢？

也許你還沒(méi)注意，設(shè)計(jì)師和開(kāi)發(fā)人員就已經(jīng)興奮地對(duì)其他更多的 UI 組件進(jìn)行規(guī)范化了。

測(cè)量并提供可操作的數(shù)據(jù)

顯然，視覺(jué)設(shè)計(jì)是非常主觀的，因此引入指標(biāo)和數(shù)據(jù) —— 比如轉(zhuǎn)換率 —— 比其他任何方式都能更有效地闡明論點(diǎn)。

定義一個(gè)包含了多種體驗(yàn)（例如：一個(gè)用戶先從登錄頁(yè)面進(jìn)入，然后瀏覽商品，提交訂單，并在自己手機(jī)的本地應(yīng)用程序中查看物流狀態(tài)）的用戶旅程，然后記錄針對(duì)這些體驗(yàn)的用戶訪談結(jié)果，并展示給利益相關(guān)者。

或者更好的是，你可以邀請(qǐng)他們來(lái)直接觀察訪談的過(guò)程。接著快速繪制出一個(gè)原型再進(jìn)行一次用戶訪談，并保證兩次訪談中其他條件的一致，比較并清楚記錄下你的結(jié)果。如果這些結(jié)果遠(yuǎn)低于你的預(yù)期，你最好繼續(xù)迭代你的設(shè)計(jì)，直到能獲得滿意的結(jié)果。

解決痛點(diǎn)

如果第一種方法沒(méi)有效果或者并不適用，你可以試試去尋找公司內(nèi)的痛點(diǎn)。不一致的視覺(jué)體驗(yàn)通常是由于背后使用的系統(tǒng)不一樣——大部分情況是因?yàn)槭褂昧耸诌^(guò)時(shí)的系統(tǒng)。當(dāng)然，這些系統(tǒng)之間或多或少還是有所聯(lián)系的，就算這種聯(lián)系可能只是為了監(jiān)測(cè)銷量或者把控質(zhì)量。

或者有時(shí)我們可以花點(diǎn)時(shí)間來(lái)回顧一下客戶支持部門中積壓的工作和技術(shù)/設(shè)計(jì)上亟待解決的問(wèn)題：通常與資深的客戶支持人員進(jìn)行一次簡(jiǎn)短交流，對(duì)揭示損害轉(zhuǎn)換率或者用戶參與性的常見(jiàn)痛點(diǎn)極有幫助。然后你可以專門針對(duì)這些痛點(diǎn)，找到一個(gè)方式——可以通過(guò)使用一個(gè)具有一致性的設(shè)計(jì)系統(tǒng)——來(lái)解決它們。再次強(qiáng)調(diào)，主要關(guān)注產(chǎn)出結(jié)果而不是操作過(guò)程。

優(yōu)先考慮最不可見(jiàn)的一致性

然而，無(wú)論是利益相關(guān)者還是忠實(shí)用戶都不會(huì)喜歡重大的，具有顛覆性的，或者 “大爆炸式“ 的新設(shè)計(jì)——不管它們與之前設(shè)計(jì)具有多么無(wú)可挑剔的一致性——對(duì)于那些多年來(lái)一直使用該網(wǎng)站的用戶來(lái)說(shuō)都是弊大于利的。

因此比起進(jìn)行一次翻天覆地的設(shè)計(jì)改革，我們是不是可以規(guī)定并使用不同級(jí)別的一致性？

這些級(jí)別可以從最不可見(jiàn)的一致性（行間距、印刷比例）到最可見(jiàn)的一致性（按鈕、圖標(biāo)、排版）進(jìn)行分布，很顯然在項(xiàng)目最開(kāi)始階段 “可見(jiàn)” 級(jí)別的一致性甚至不用被提及。

在用戶訪談同時(shí)進(jìn)行短時(shí)間設(shè)計(jì)沖刺

實(shí)現(xiàn)幾張關(guān)鍵頁(yè)面的初級(jí)一致性并不困難。但隨著項(xiàng)目的復(fù)雜化，這一任務(wù)可能會(huì)讓人望而生畏。這時(shí)為了保證效率并快速地獲得結(jié)果，最好的辦法是設(shè)計(jì)沖刺：一個(gè)用來(lái)回答關(guān)鍵性商業(yè)問(wèn)題，由設(shè)計(jì)、原型繪制和用戶測(cè)試組成的五天設(shè)計(jì)流程。

圖片來(lái)源：https://www.gv.com/sprint/

設(shè)計(jì)沖刺采用了一個(gè)通過(guò)設(shè)計(jì)、原型繪制和用戶測(cè)試來(lái)回答關(guān)鍵性商業(yè)問(wèn)題的概念。

一旦在公司范圍內(nèi)解決問(wèn)題時(shí)，無(wú)論是規(guī)范用戶體驗(yàn)還是優(yōu)化前端，我們都不會(huì)有太多的時(shí)間來(lái)獲取有價(jià)值的結(jié)果。根據(jù)具體情況，我們會(huì)盡早地進(jìn)行用戶訪談，通常在第三天就會(huì)安排上 4 次緊湊的用戶訪談。

原則很簡(jiǎn)單：消除干擾并創(chuàng)建約束條件，以便在用戶訪談之中就能進(jìn)行創(chuàng)造。理想狀態(tài)是，下午 1 點(diǎn)我們先進(jìn)行 15 分鐘的用戶訪談，然后接下來(lái) 1.5 小時(shí)內(nèi)——我們依據(jù)直覺(jué)和談話內(nèi)容——來(lái)修改設(shè)計(jì)方案，因?yàn)?2 點(diǎn)半我們有另一個(gè)15分鐘的用戶訪談。

第二次訪談結(jié)束之后，我們會(huì)再花 1.5 小時(shí)進(jìn)行第二次迭代，并在下午 3 點(diǎn)準(zhǔn)時(shí)開(kāi)始第三次的用戶訪談。只有在整個(gè)團(tuán)隊(duì)都按計(jì)劃推動(dòng)進(jìn)程的情況下，你才能在用戶測(cè)試之前完成所有訪談工作。因此這意味著每位成員都必須能夠當(dāng)機(jī)立斷出下一個(gè)沖刺環(huán)節(jié)要完成的工作。

顯然，你可能需要一個(gè)計(jì)時(shí)器來(lái)避免你的安排被打亂。另外，既然用戶就在現(xiàn)場(chǎng)，在團(tuán)隊(duì)思考下一個(gè)迭代版本的時(shí)候，你還可以再安排幾場(chǎng)其他的用戶測(cè)試。

用網(wǎng)頁(yè)應(yīng)用程序輻射一致性

但是你要如何戰(zhàn)略性的選擇優(yōu)先針對(duì)哪些組件進(jìn)行設(shè)計(jì)沖刺呢？

比如：對(duì)于一家提供多種體驗(yàn)，覆蓋從內(nèi)容驅(qū)動(dòng)型網(wǎng)站（如介紹一家酒店），到任務(wù)驅(qū)動(dòng)型網(wǎng)頁(yè)應(yīng)用程序（如預(yù)訂房間，帳戶管理），再到本地應(yīng)用程序（如預(yù)訂房間，帳戶管理 ）等多種系統(tǒng)的公司，能為它的整體“性質(zhì)”帶來(lái)一致性的最佳方案是什么？

根據(jù) Nathan Curtis 所說(shuō)，由于網(wǎng)頁(yè)應(yīng)用程序最具可追蹤性、交易性和實(shí)用性，并被證明能很好地指導(dǎo)設(shè)計(jì)系統(tǒng)的構(gòu)建。最有效的方法是 “用網(wǎng)頁(yè)應(yīng)用程序輻射影響力”，或者說(shuō)是，“優(yōu)先實(shí)現(xiàn)核心產(chǎn)品的一致性，并以此為中心向營(yíng)銷類網(wǎng)站和本地應(yīng)用程序傳遞影響力” 。

圖片來(lái)源：https://twitter.com/sophshepherd/status/715611781733834752

Nathan Curits 在 Clarity 大會(huì)上提出我們應(yīng)該用網(wǎng)頁(yè)應(yīng)用程序，而不是網(wǎng)站或者本地應(yīng)用程序來(lái)輻射一致性。

這的確有一定道理。比方說(shuō)，網(wǎng)頁(yè)應(yīng)用程序無(wú)論是與本地應(yīng)用程序還是與網(wǎng)站之間都要比一個(gè)內(nèi)容驅(qū)動(dòng)的營(yíng)銷類網(wǎng)站和一個(gè)功能驅(qū)動(dòng)的本機(jī)應(yīng)用程序之間有更多的共同點(diǎn)。所以把握網(wǎng)站中關(guān)鍵或核心的組件，就相當(dāng)于同時(shí)把握了分布在整個(gè)體驗(yàn)中的所有重復(fù)性模塊，在所有“屬性”中“輻射”。值得我們?cè)囋嚒?/p>

為設(shè)計(jì)系統(tǒng)制作一張 PDF 工作表

③在開(kāi)始構(gòu)建設(shè)計(jì)系統(tǒng)前，我們需要讓整個(gè)團(tuán)隊(duì)達(dá)成共識(shí)。為此團(tuán)隊(duì)可以先召集所有成員共同完成一張兩頁(yè)的 PDF 工作表（或 INDD③）來(lái)定義系統(tǒng)中所需要的部件、產(chǎn)品和人員。制作這張表單的目的在于收集數(shù)據(jù)，最終幫助團(tuán)隊(duì)決定構(gòu)建系統(tǒng)的戰(zhàn)略和優(yōu)先事項(xiàng)。顯然它也會(huì)被用在接下來(lái)的研討會(huì)之中。

③ InDesign文件（ InDesign Document ）的縮寫。

一張兩頁(yè) PDF 工作表示例（部分），其作用是為團(tuán)隊(duì)開(kāi)始構(gòu)建一個(gè)設(shè)計(jì)系統(tǒng)達(dá)成共識(shí)。

組件剪裁研討會(huì)

為了完成表單，Nathan 建議召集盡可能多的項(xiàng)目成員到同一個(gè)房間，參與一場(chǎng)組件剪裁研討會(huì) —— 打印出所有的界面，邀請(qǐng)每個(gè)人來(lái)分別識(shí)別和剪裁上面的組件，再對(duì)它們進(jìn)行分組和命名，從而生成一份團(tuán)隊(duì)共享的詞匯表。FutureLearn 的交互設(shè)計(jì)師 Alla Kholmatova 也鼓勵(lì)設(shè)計(jì)師和前端開(kāi)發(fā)人員都參與到這樣的研討會(huì)中。

圖片來(lái)源：Alla Kholmatova

在一場(chǎng)組件剪裁研討會(huì)中，團(tuán)隊(duì)成員正在對(duì)組件進(jìn)行剪裁和分組。

除了剪裁和命名組件之外，Alla 還建議將這些組件類別賦予不同的抽象名稱來(lái)表明它們的優(yōu)先級(jí)和功能，包括了 “助手”（不能獨(dú)立存在的組件，如 “回復(fù)” 功能的按鍵），“橋梁”（作為連接器的組件，如面包屑導(dǎo)航④ 或者分頁(yè)），以及 “單行本”（可以被看作一個(gè)完整獨(dú)立單元的組件，如一個(gè) “hero”⑤ 框）。

④ 一個(gè)用來(lái)顯示用戶在網(wǎng)站或者網(wǎng)頁(yè)應(yīng)用程序中位置的輔助導(dǎo)航系統(tǒng)。

⑤ 在網(wǎng)頁(yè)中指一個(gè)位于網(wǎng)頁(yè)最突出，最中心地方的獨(dú)立組件，通常是一個(gè)首頁(yè)中占據(jù)全屏的頂圖，其中可能包含文本，按鈕等其他元素。

組件的分組和命名

圖片來(lái)源：Alla Kholmatova

你還可以在 Slack 中添加一個(gè)組件并邀請(qǐng)整個(gè)團(tuán)隊(duì)來(lái)對(duì)其命名和分組。你甚至還可以讓用戶也參與到組件剪裁、分類和命名的過(guò)程中，即使是以特別不正式的形式，比如就在一家最近的星巴克里。

總結(jié)

但這樣做真的值得嗎？每個(gè)網(wǎng)站都一定要有一個(gè)設(shè)計(jì)系統(tǒng)嗎？我們是否應(yīng)該遵從我們對(duì)一致性和可預(yù)測(cè)性設(shè)計(jì)模式的癡迷，使它們?cè)诓煌脩趔w驗(yàn)接觸點(diǎn)上保持重復(fù)呢？我并不能確定。

但我知道模塊化的響應(yīng)式方法對(duì)于以下公司非常有利：

1. 提供的體驗(yàn)中包含了大量的相似組件；
2. 希望解決移動(dòng)設(shè)備碎片化和維護(hù)問(wèn)題的公司是極具價(jià)值的。這也正是設(shè)計(jì)系統(tǒng)的用武之地。

坦白說(shuō)，我還沒(méi)有遇到一個(gè)會(huì)真的對(duì)原子設(shè)計(jì)方法或模塊化命名研討會(huì)感興趣的客戶。但每個(gè)人都會(huì)對(duì)能節(jié)省時(shí)間的功能，以及更快更好的產(chǎn)出產(chǎn)生強(qiáng)烈的好感。因此下次如果你再碰到有人還沒(méi)有意識(shí)到模塊化方法的好處時(shí)，試著用項(xiàng)目中心，可操作的數(shù)據(jù)，已解決的痛點(diǎn)和無(wú)間隙的迭代這些有形的利益和產(chǎn)出來(lái)說(shuō)服他們，而不要用你的操作過(guò)程。這樣你才更有可能成功。

原文作者：Vitaly Friedman

原文地址：https://www.smashingmagazine.com/2016/05/design-systems-responsive-design-sell-output-not-workflow/

編譯作者：大團(tuán)子，上海，在讀研究生評(píng)審指導(dǎo)

編輯整理：三分設(shè)運(yùn)營(yíng)編輯皮皮

本文由@三分設(shè) 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自Unsplash，基于CC0協(xié)議