為商業(yè)Web應(yīng)用設(shè)計用戶界面

1、為商業(yè)Web應(yīng)用設(shè)計用戶界面商業(yè)Web應(yīng)用的設(shè)計經(jīng)常會被疏忽。我見到過大量既不符合企業(yè)目標也不能滿足用戶需 求的應(yīng)用，因此導(dǎo)致利潤的虧損和糟糕的用戶體驗。甚至是，設(shè)計師完全沒有參與到應(yīng)用開 發(fā)過程當(dāng)中，而是由開發(fā)人員承擔(dān)全部的職責(zé)。對于開發(fā)人員，這是一個艱巨的任務(wù)。開發(fā)人員也許擁有前端或后端的豐富開發(fā)經(jīng)驗， 但是他們的設(shè)計知識有限。最終只能是客戶不滿意、用戶沮喪和項目失敗。因此，我將介紹商業(yè)Web應(yīng)用界面設(shè)計的基礎(chǔ)。雖然在UI設(shè)計時，可以使用許多不同 方法、技術(shù)和原則，但我們這里主要專注于商業(yè)Web應(yīng)用。Web站點VS Web應(yīng)用很容易將Web應(yīng)用（Web Applications）和web網(wǎng)

2、站（Websites）相混淆，就像將用 戶界面設(shè)計和網(wǎng)頁設(shè)計相混淆一樣。但是它們從本質(zhì)上及其它許多方面都不同，我們將在本 文中進行探討。Web網(wǎng)站由許多頁面組成，這些頁面往往包含許多靜態(tài)文本、圖像和視頻，只有有限的 交互性功能（例如，聯(lián)系表單和搜索功能）。網(wǎng)站的主要作用是傳播信息。一些網(wǎng)站使用CMS （內(nèi)容管理系統(tǒng)）生成動態(tài)內(nèi)容，但是其性質(zhì)仍然是提供信息。而Web應(yīng)用是動態(tài)、交互式的系統(tǒng)，幫助企業(yè)執(zhí)行重要的商業(yè)任務(wù)，達到衡量和提升企 業(yè)生產(chǎn)力的目的。因此，Web應(yīng)用的主要作用是根據(jù)定義的業(yè)務(wù)規(guī)則，去執(zhí)行那些服務(wù)于用 戶任務(wù)的功能。對用戶而言，Web應(yīng)用需要較高層次的參與和應(yīng)用知識。用戶不會只是

3、偶然性的發(fā)現(xiàn)這 個應(yīng)用和無意識的隨便使用。他們會將這個應(yīng)用作為一個日常性使用的工具，去完成非常重 要的商業(yè)任務(wù)。最后，即使用戶不喜歡它，也不能輕易的停止使用它和用其它應(yīng)用替代它。CampaignMonitor是一個強大的電子郵件營銷應(yīng)用軟件，而Jeff Sarimento的網(wǎng)站旨在向 讀者展示他的生活和工作。Web應(yīng)用的類型商業(yè)Web應(yīng)用的業(yè)務(wù)范圍廣泛，從貨品計價、內(nèi)容管理系統(tǒng)、文檔管理系統(tǒng)，到金融和 財務(wù)系統(tǒng)等等。我們可以將商業(yè)Web應(yīng)用區(qū)分為開放的和封閉的應(yīng)用。開放的系統(tǒng)是在線應(yīng)用，任何人 都可以注冊賬戶，然后輕松的訪問。用戶可以通過web網(wǎng)絡(luò)訪問這個應(yīng)用，可以免費或付費 注冊賬號。封閉的

4、系統(tǒng)是離線應(yīng)用，不能在公司外部訪問和使用（雖然很多系統(tǒng)通過一些服 務(wù)或是專用接口，向商業(yè)伙伴展示了一些功能）。這些應(yīng)用往往是在公司內(nèi)部網(wǎng)絡(luò)中運行， 只有公司員工才可以使用。我不知道是誰創(chuàng)造了 weblication這個詞，但我喜歡這個詞，它大致說出了 web應(yīng)用是 什么。但這并不是說一個web應(yīng)用是一半網(wǎng)站和一半應(yīng)用的混合體，web應(yīng)用比這可要復(fù)雜 的多。首先，理解你的用戶也許你已經(jīng)不斷的聽到說要理解你的用戶，并且理由也很充分：一個成功的用戶界面要 以用戶和用戶任務(wù)為中心。然而，這就是為什么大多數(shù)開發(fā)人員無法創(chuàng)建良好用戶體驗的關(guān) 鍵所在。正如Steve Krug說的：“開發(fā)人員喜歡復(fù)雜性，他們

5、喜歡去探索系統(tǒng)是如何運行 的?！碑?dāng)你去識別和確認誰是用戶時，記住客戶不是用戶，你自己也不是用戶。雖然客戶的管 理層經(jīng)常會對項目感興趣和試圖影響決策，但他們不會一天中在電腦面前坐上幾個小時去使 用它（除非這個應(yīng)用就是針對他們的）。如何識別用戶？你可以使用許多技術(shù)去識別用戶，例如用戶訪談、商業(yè)利益相關(guān)者訪談和“影子”觀察 法。通過訪談，你可以知道用戶對于系統(tǒng)和計算機的基本理解和認知。而通過“影子”觀察， 你可以知道用戶如何執(zhí)行任務(wù)和犯了哪些錯誤的更加詳細的信息。之所以叫“影子”觀察法， 是因為觀察者就像一直跟隨用戶的影子一樣，去觀看和記錄用戶的每一個任務(wù)步驟。如果你沒有遇到真正的用戶（可能是因為你

6、沒有權(quán)限，或是在設(shè)計開放的應(yīng)用），你可 以使用“人物角色”來幫自己識別用戶?！叭宋锝巧笔钦鎸嵱脩舻拇恚擞脩舻牧?xí) 慣、目標和動機等等。由于有關(guān)用戶的某些信息往往是通過商業(yè)分析中確定的，所以你可以 利用它來創(chuàng)建人物角色。如果你對人物角色方法不太熟悉，Brand Colbow的漫畫將對你有幫 助（如下圖）。這個人物角色有這些目的人物背景：目標和動機Mike是一個家小型制造公司的現(xiàn)場支持工 程師，他經(jīng)常會被委派外出，一天之中只 有一兩次在辦公室。Mike想要在到達客戶那里進行維修之前， 就知道發(fā)生了什么問題。目的是為了第一 時間就能準確的修正問題?；卦L或超過計 劃日程，會占用他個人時間和公司

7、最低要 求時間。人物角色任務(wù)分析有助于確定用戶在工作中需要完成哪些任務(wù)、如何完成、需要多長時間、犯了 哪些錯誤。有時用戶正在使用你將要重新設(shè)計的舊版本應(yīng)用。你正好可以利用這套舊系統(tǒng)， 來看看用戶是如何操作的。這樣你會很容易了解到用戶的任務(wù)和遇到的挑戰(zhàn)。無論誰是你的用戶，有一點可以肯定的是：在大多數(shù)情況下，您必須同時考慮新手和專 家。要讓新手用戶盡可能快的學(xué)習(xí)和上手，而專家用戶要盡可能快速高效的完成任務(wù)。這就 可能要分別為他們創(chuàng)建單獨的用戶界面。但在很多情況下，你可以使用各種技巧（比如隱藏 高級功能，逐漸顯露 progressive disclosure），來保證不同類型的用戶正常使用同一界面。

8、這些研究通常由市場分析來完成。但當(dāng)沒人來負責(zé)這項業(yè)務(wù)時，你應(yīng)該去完成它。一旦 得到了必要的信息，就可以開始設(shè)計了。設(shè)計流程有許多種界面設(shè)計流程你可以采用，或者你已經(jīng)使用了某一中。然而，我建議你考慮敏 捷（Agile）方法。為什么呢？因為對于用戶（或客戶）來說，用戶界面就是產(chǎn)品。他們不 會關(guān)心你的概念構(gòu)思、先進的后臺技術(shù)或強大的服務(wù)器。他們希望看到的只是用戶界面。那么，敏捷方法有何幫助？主要是它的重要的原則：迭代方法。每一次迭代都包括了你 所定義流程的所有步驟。這就意味著，第一次迭代結(jié)束后，你將得到一個可以進行測試的產(chǎn) 品：即一個原型。早圖(Sketching)草圖是探索思路的一種強大方法。目的

9、是通過起草各種不同的概念，找到最佳方案。大 多數(shù)草圖會被丟棄，但這無所謂。正如Bill Buxton在他的Sketching User Experience 一書中說的：草圖快速低廉且容易處理，這正是它為何如此強大。草圖(sketches )和線框圖(wireframes) 一樣嗎？也許區(qū)別是模糊的，但是我覺得不 同。線框圖不是捕捉粗略的想法，而是對粗略想法的延伸實現(xiàn)?？梢宰x讀IxDA上的精彩討 論：線框圖前的草圖。一旦你得到“正確”的草圖，或者至少你認為正確的一個，你便可以創(chuàng)建更加詳細的線 框圖或直接去創(chuàng)建可交互的原型。F函砒I1ESH 畚 F”，ftJason Robb的早圖有關(guān)草圖和線框

10、圖的趣味閱讀：35杰出的線框圖資源起草構(gòu)思用戶體驗的工具20步改進線框圖原型(Prototyping)接著就是去創(chuàng)建能夠模擬真實應(yīng)用的原型。原型可以包含一個或多個功能（或所有功能）， 但它只是模擬真實應(yīng)用的行為，而不是對功能的真正實現(xiàn)，讓用戶感覺到好像真的在運行。 但原型也可以包含一些真正的功能，例如復(fù)雜的計算。由于HTML原型是臨時性的（它的目的是驗證想法），所以不用花時間在代碼上。讓bug 最少，但只要能夠運行就行，畢竟你最終會扔掉它。你也可以使用一些專門的原型設(shè)計工具， 如 Axure，有些人甚至PowerPoint 做原型。PM 如a 囪士, F理中Nam du prodonit #3

11、bCwH 4 曲 E# nr du pflMlH i n urjf fltyjEBl以畔獨OngTw 田 nilMiririK監(jiān) “mriitu kihBOriBaim ItpikHVialr prvdutt-Gwr lit* d la marai節(jié)45I 柄K “E“ ,。呼1.片1網(wǎng) 呻flf Pg腎虬 F 中 WiM iMTTpfl-心 呻班 營可 中El!i1|ib llfur 5 imrt d rrniwn% nilrid EMnrifiMkEn -tai!i uitdr nsi. if LiiffYiide Si1&呷 it Qua -.iv d tkn kt irp-itfit

12、frltfi 1 ill4i1 AIM td.-iiidMv toupniriLi Efw劇* ifffKC iib；ii cdMai rwripSHi w4 m cvi v-r -IniiuM gH IrtTWFF TFW 國口網(wǎng).*虬 trf 電 PWF 1F. rafilrud v Evrcrlofin sjtAmqg Ufna. hi ftl L-iiTB-ri=d: tTrlM Dxri *JSrid-dbJ-1- j岬hi idmd JiM34I dekr* ipifiriji E ppr irfir ant atcH 網(wǎng)尋衛(wèi) rwri |i ci-Hi iu#ir唧. 卜，4#c

13、r 1 商run nwfbilitorvnRffrpss-ili li marw N=* m diCI2lr!TUl嚴心嚀戶T*牝rpm擊中| 1, rant-tajBflpr 明磚pi |舟；村 為叫日”押Ifrr產(chǎn)四心四J Ihlitr K 姐研 Fig iLqj a U rftrn * 頑町 f inL.d rfeiKittfN 都并金卻IM tf a *i MMHda El: !fcl. J : fFm一個電子商務(wù)網(wǎng)站的Axure交互式原型，e-maujean提供。原型設(shè)計的相關(guān)閱讀和工具：5個Web設(shè)計規(guī)劃和原型設(shè)計的實用工具一個實踐者的原型設(shè)計指南:來自Rosenfeld Medi

14、a的一本書16個用于原型和線框圖的設(shè)計工具測試（Testing）原型如果不用于進行測試，原型也就失去了其真正的意義。測試并沒有那么難，正如Jakob Nielsen和Steve Krug提倡的“簡易可用性測試”方法，它成本低廉、快速，并為 你的設(shè)計決策提供寶貴建議。你也可以將測試結(jié)果作為另一次迭代（草圖-原型-測試）的基 礎(chǔ)。至少在主要問題解決之前，你都該進行測試。我們知道軟件項目的時間和預(yù)算都很緊張， 所以為了更加高效，要盡早測試和經(jīng)常測試。Steve Krug的這本Rocket Surgery Made Easy書是簡易可用性測試的最好資源， 你可以找一本進行閱讀。E圖是對Deliciou

15、s進行可用性測試，(nz)dave提供更多閱讀:為什么你只需要測試5個用戶可用性測試不神秘可用性測試神話設(shè)計原則現(xiàn)在流行許多設(shè)計原則，但還沒有形成最終的普遍共識。所以我們這里去看一些非正式 的設(shè)計原則，但并不進行嚴格定義。一致性一個優(yōu)秀用戶界面的關(guān)鍵要素是“一致性”和“熟悉感”。用戶界面在整個應(yīng)用的所有 部分的應(yīng)該一致，從導(dǎo)航、顏色到術(shù)語，這叫做內(nèi)部一致性。用戶界面還應(yīng)該和該應(yīng)用所處 的環(huán)境一致，例如和操作系統(tǒng)或其它配套應(yīng)用達到一致，一個典型的例子就是微軟Office 套裝應(yīng)用，這叫做外部一致性。保證一致性的一種有效的方法，就是為每個項目或為一組項目定義用戶界面指南(user interfac

16、e guidelines)。每個詳細的設(shè)計決定都應(yīng)該遵循它。用戶界面指南不僅能保持界 面一致性，還能夠作為文檔幫助團隊成員更好的理解你的決策。雖然是一個簡單例子，SprinklePenny在整個應(yīng)用中達到了一致性和熟悉感一致的用戶界面使得學(xué)習(xí)曲線縮短，因為用戶已經(jīng)認識了系統(tǒng)的某些部分和復(fù)用以前的 使用經(jīng)驗。但是“熟悉感”有時會和“一致性”相混淆。具有“熟悉感”的用戶界面能夠吸 取用戶的心智模型和利用合理的隱喻方法。例如，文件夾就是對文件組織方式的著名的隱喻， 而不再是使用以往命令行操作系統(tǒng)的“目錄”?？傊?，就是要使用用戶的語言。很多企業(yè)用戶有一個共同的觀點是：一個良好的用戶界面應(yīng)該看起來像微軟

17、的Office 產(chǎn)品，尤其是Outlook。我不想去解釋這是否有意義。但是我想說的是：要遵循“以用戶為 中心”的方法這里，我只提出不同于他們的建議：要沿用“以用戶為中心”的方法，并解釋為什么為 員工、客戶和合作伙伴（合作伙伴的用戶）設(shè)計應(yīng)用程序才是重要的。盡管如此，大多數(shù)企業(yè)都不相同，他們的工作流程也不同。例如，來自同一行業(yè)的兩個 公司可能有完全不同的流程，將迫使你超越和創(chuàng)新。設(shè)計流程中的這部分可能非常有趣，當(dāng) 然你也要在創(chuàng)新的程度上多加把握。更多閱讀：. 為設(shè)計和選擇組件. 為什么一致性如此重要高效毫無疑問，當(dāng)用戶使用商業(yè)應(yīng)用時應(yīng)該能夠達到高效，這正是客戶花錢的原因，也正是 管理者對應(yīng)用的期

18、望。用戶界面應(yīng)該能夠讓用戶高效工作，并以最輕松和快速的方式完成任 務(wù)。但事實上并非如此。開發(fā)人員們有一種觀點(至少實際行動上確實如此)：用戶界面應(yīng) 該和系統(tǒng)后臺一樣復(fù)雜。無論這聽起來多么荒謬，但問題已經(jīng)出現(xiàn)，可能還會令你很頭疼。 這就是為什么必須與開發(fā)人員進行良好的溝通和協(xié)作。當(dāng)用戶專注于某個特定任務(wù)時是高效的。前面提到，任務(wù)分析可以幫助你識別任務(wù)和確 定用戶如何完成該任務(wù)。如果一個任務(wù)需要較長時間，就需要將其分解成許多較小的任務(wù)， 這樣能加速用戶完成任務(wù)。你還可以通過提供鍵盤輸入和快捷鍵來提高效率。試想一下，當(dāng) 用戶必須在鼠標和鍵盤之間來回切換是多么耽誤時間。在某些情況下，你需要為習(xí)慣于命令

19、 行界面的用戶設(shè)計，他們將強烈渴望支持鍵盤輸入。給你一個建議：定義快捷鍵時，應(yīng)與常 用程序的快捷鍵相同。例如，Ctrl + s永遠應(yīng)該是“保存”等等。FileEdu VieA! Insert Fwmafi Fom T&alaHie4p尸$ %- tGplB -tw A-甜- 4 奉E ABIf&Fe-r0ne&iLFRLDe&enplisn.壬如*ePH招T多bisHt ciXnrnvni:3-10II薄13ehangs wlco 屈h riIb-sU35WedITISInSM舊211_Shflre *Coi ylc docs link?Google Docs中的表格就為用戶提供了鍵盤快捷鍵和

20、快捷菜單，并借鑒了用戶熟悉的桌面程 序，使用戶高效率完成工作。通過個性化定制也可以提高用戶使用效率。用戶自己定制界面時，不但會更快上手，更 重要的是，在使用時會更有信心。個性化可以體現(xiàn)在許多方面：選擇儀表板(dashboard) 中的模塊、定義快捷鍵選項、設(shè)置偏好、改變元素順序等等。也應(yīng)該注意可訪問性(accessibility)，雖然許多人覺得Web應(yīng)用中的可訪問性并不重 要，但實際上你該像對待公眾網(wǎng)站一個對待它。Web應(yīng)用程序在處理信息時也必須是高效的。因此，局部呈現(xiàn)和朗5求產(chǎn)生的耗資 源的交互行為需要慎重使用。反饋對于系統(tǒng)處于何種狀態(tài)，界面上應(yīng)提供有效的反饋。如果發(fā)生錯誤，應(yīng)當(dāng)通知用戶并

21、設(shè) 法恢復(fù)。如果程序正在運行中，需要通知用戶進展如何。我們可以更進一步說：用戶界面應(yīng)該防止用戶犯錯。這一法則被稱作容錯，確認對話框、 撤消選項、智能輸入(forgiving formats)等就遵循了它?！叭蒎e”讓用戶更安全地探索 界面、降低了學(xué)習(xí)成本并提高了整體滿意度。由于商業(yè)Web應(yīng)用程序很復(fù)雜，你還需要提供一個全面的幫助系統(tǒng)。這可以通過聯(lián)機幫 助、支持數(shù)據(jù)庫、知識庫或是向?qū)?包含視頻，圖像和文字)來達到。更多閱讀：UI設(shè)計中的容錯Web表單驗證：最佳實踐和練習(xí)小心處理用戶錯誤：讓用戶回到正確軌道上讓用戶滿意滿意度是一個比較主觀的詞，它是指用戶使用界面時的愉悅程度。我們之前介紹的每一 條設(shè)

22、計準則，都會影響滿意度。還有一些準則需要在這提一下：簡潔是界面設(shè)計的一條基本準則。越是簡潔的用戶界面，就越容易使用。但對商務(wù)應(yīng)用 程序來說，讓用戶界面簡潔卻是一個挑戰(zhàn)，因為這些應(yīng)用往往有許多功能。問題的關(guān)鍵就是 要平衡功能和簡潔。最有效的解決方法就是“約束”。換句話說，就是找到最簡單的解決方 案。BUILDITWITH.MEPE0PUE壓 M51GMWM0W rn_i mt HTwr*BWTJurrftn “hFWe*I 知，Jh3 EM ArMi*4Sots-GnCcwti nine郵b- Tft ! AH ,口fiLLF .b頃上廣BuildWith.me有一個簡單而高效的用戶界面，它并沒

23、有為此犧牲美觀。美觀，雖然是有些主觀甚至隨意的評價，但也是影響滿意度的重要因素。用戶喜愛漂亮 的用戶界面，甚至可以為此犧牲功能。但你也要注意自己并不是在創(chuàng)造藝術(shù)品。有關(guān)美觀的 最好的文章之一是美麗無罪(In Defense of Eye Candy)。最終，由于用戶會花很長時間去使用一個商務(wù)應(yīng)用程序，無論界面多么好用、一致性和 容錯性，評價界面成功與否的決定因素還是：用戶滿意度。更多閱讀:7個界面技術(shù)簡化和整潔你的界面克制(Restraint)美麗無罪其它和UI設(shè)計相關(guān)的資源：優(yōu)秀用戶界面設(shè)計的12個實用技術(shù)成功用戶界面的8個特征用戶界面設(shè)計原則(維基百科)UI設(shè)計大師的10大原則幫你掌握用戶

24、界面設(shè)計的20個網(wǎng)站W(wǎng)eb應(yīng)用的必要元素Web應(yīng)用雖然各異，但它們大多包含有相同的元素。每個應(yīng)用對這些元素的使用方式并 不相同，讓我們先看看最常見的三個元素。eb 表單(WebForms )一般來說，表單對Web應(yīng)用程序非常重要。不過，正如Luke Wroblewski在他的Web 表單設(shè)計的著作中說的：“沒有人愿意填表單?！边@里說的表單，就包括許多商業(yè)Web應(yīng)用程 序的注冊表單。盡量減少用戶填寫表單時的挫折感。提供內(nèi)部驗證與良好反饋，并盡可能使用默認值。 不要忘記新手用戶，通過向?qū)Щ螂[藏高級(或不常用的)功能，來幫助他們更快地完成任 務(wù)。主從窗格(Master-DetailViews)這是一

25、種在兩個獨立且相關(guān)的窗格顯示數(shù)據(jù)的技術(shù)。一個窗格顯示項目列表，另一個顯 示所選項的詳細信息。主從窗格可以在單一頁面或通過多個頁切換進行實現(xiàn)。儀表板(Dashboards)很多Web應(yīng)用程序都有儀表板。一個儀表板是將需要操作和決策的最重要信息展示在一 個視圖上。它一般僅在單一頁面出現(xiàn)，而且是一個應(yīng)用程序的初始頁。儀表板非常重要，因 為它讓用戶無需深入界面，就可以看到信息并執(zhí)行任務(wù)。ACCOUNT WATCHLISTM DNEV GOING OUTijAnv iccuyT；JieElMieAnBSm-OnL* COmiG IRCXero在儀表板中顯示了用戶的最重要的財務(wù)信息(如銀行帳戶和信用卡信息

26、)，以便于用戶 迅速看到自己的財務(wù)數(shù)據(jù)狀況。大量使用的表格(Heavy Use of Table)由于Web應(yīng)用常常需要處理大量容易取得和歸類的數(shù)據(jù)，表格也就不可避免了。這其實 并不是壞事。事實上，表格就是干這個用的。不要將其與無表格頁面布局相混淆。高效表 格能夠易于閱讀。因此在多數(shù)情況下，你需要一個有意義的標題、合理的表格列數(shù)、分頁、 行顏色交替顯示、適當(dāng)?shù)牧袑R，并提供排序和過濾功能等等。表格是可以人為調(diào)整的，這就是說你可以為它們添加更多信息，甚至去修改它們的數(shù)據(jù) 項。Your Company* Cbh n*W ，-porl T iirnpjn.c5WUur 11 Adejnin：Cash

27、 FlowUHM*rhAjr州-岫酎tWH 弟 HAHDI I鼻WEbLireDD 亶田窗 、i*ooo msod u_iwic 4r.Br/Cujd lu-iacoINCOMEr%.W4品 w Win SJIPHL 卻2DQCIqJ W B.WW4.30.4W-M-.&inuoS.IW&.W-IJU E由做L8?.weaJ4AWg2.W#7_SO$WC g i.LE.WjU，.頃I湘fjDaLlidd 時* 他性相*miSM桐sWWflW蹄gPMffl-加OfWW岫妙* *wi0riibriMiirHMrtFIlJQ 疇qpjQ4M&O5也W如, J4悼* 曲MilngoaP.UDKSIM.WMsA.mnIA%.曲v miMM*uwioafi-JW-Wl_I J4&44LT睫做*LijfrKfLJMJLM4.&LWWE3M-L順的L施田L(fēng)Ml折PulseApp是“表格如何有效顯示和處理復(fù)雜數(shù)據(jù)”的優(yōu)秀案例。報表（Reports）大多數(shù)企業(yè)都離不開一些類型的報表。由于打印報表是常用功能，你就要重視報表的設(shè) 計。打?。ɑ蜉敵觯┑膱蟊硗ǔＪ窃诰€報表的簡化版本，所以需要優(yōu)化以適應(yīng)單色打印。FreshBooks具有打印、PDF輸出和“以電子郵件發(fā)送”功能。它還能提供打印預(yù)覽。不要忘記UI設(shè)計模式我們經(jīng)常聽到或討論UI設(shè)計模式，但有時還是會忽視它們！