時(shí)我們傾向于將我們的設(shè)計(jì)視為藝術(shù)品。但如果我們用這種方式來思考它們，就意味著它們不會準(zhǔn)備好面對“現(xiàn)實(shí)世界”的不確定條件。但是，設(shè)計(jì)一個(gè)可以隨時(shí)改變的界面也很美 - 而且，讓我們承認(rèn)它，接口確實(shí)一直在變化。我最喜歡設(shè)計(jì)移動應(yīng)用程序的一個(gè)方面是，從最初的概念到你對所有界面細(xì)節(jié)進(jìn)行微調(diào)和拋光的時(shí)候，這是一個(gè)包含許多步驟的過程。

我們是視覺思考者，擁有訓(xùn)練有素的眼睛。這就是為什么在開始一個(gè)新項(xiàng)目時(shí)有時(shí)會直接跳到可視化UI設(shè)計(jì)階段的原因，這也是我們可能對其他任務(wù)感到厭倦的原因之一。

這也意味著我們經(jīng)常推遲工作流程的其他重要部分：定義用戶需求和目標(biāo)，草擬任務(wù)流程，處理信息的所有細(xì)節(jié)和交互設(shè)計(jì)等。這些是同樣重要的是，它們更抽象，更難以讓人想象它們將如何成為最終產(chǎn)品的有形部分。

當(dāng)我們正在進(jìn)行視覺設(shè)計(jì)時(shí)，所謂的像素完美哲學(xué)可能是一個(gè)陷阱，使我們花費(fèi)更多的時(shí)間來制作細(xì)節(jié)，直到最小的細(xì)節(jié)處于界面的“完美”位置。這導(dǎo)致一代設(shè)計(jì)師使用Dribbble和Behance主要顯示應(yīng)用程序和網(wǎng)站的精美屏幕，并且更關(guān)注外觀而不是設(shè)計(jì)實(shí)際工作方式。在現(xiàn)實(shí)世界中，事情往往不如我們期望的那樣好。

就個(gè)人而言，我認(rèn)為最好的設(shè)計(jì)（當(dāng)談到用戶界面設(shè)計(jì)時(shí)）不僅外觀和感覺良好，而且還可以優(yōu)雅地響應(yīng)變化的條件甚至不可預(yù)測的情況。

在構(gòu)建產(chǎn)品的漫長道路上，設(shè)計(jì)師需要更多的協(xié)作，而不是專注于視覺設(shè)計(jì)。這正是我為了這篇文章專注的地方。在接下來的幾段中，我將向你提供一些提示和技巧，說明如何將你正在進(jìn)行的應(yīng)用程序設(shè)計(jì)用于測試，并了解它是否已準(zhǔn)備好發(fā)布到市場。

在不完美中尋找美

當(dāng)我在大學(xué)學(xué)習(xí)平面設(shè)計(jì)時(shí)，他們教會了我們平衡，對齊，比例和張力的美感，以及如何在空間中定位元素，使它們和諧悅目。憑借這些知識，我的生活發(fā)生了變化，我開始以不同的眼光看世界。后來，我開始設(shè)計(jì)界面，我試圖將相同的原則付諸實(shí)踐，屏幕上的所有信息都應(yīng)該形成一個(gè)非常令人滿意的視覺構(gòu)圖。

如果你將這些原則應(yīng)用于移動應(yīng)用程序設(shè)計(jì)，那么我們發(fā)現(xiàn)必須顯示適量的信息。例如，如果一個(gè)屏幕必須列出人們的姓名，設(shè)計(jì)師通常會選擇一些短而普通的名字，并將它們完美地排列在一起，沒有留下任何可能破壞設(shè)計(jì)或使其在以后崩潰的意外長名稱的空間。

這種方法基于這樣的假設(shè)：在混亂和不完美中沒有美，盡管這兩個(gè)方面在現(xiàn)實(shí)世界中經(jīng)常出現(xiàn)。但是視覺界面并不是一件值得欣賞的靜態(tài)藝術(shù)品; 它們是動態(tài)的，功能性的空間，可以改變和適應(yīng)每個(gè)人使用它們。我們不應(yīng)該屈服于純粹為美學(xué)設(shè)計(jì)的誘惑，因?yàn)槲覀冇肋h(yuǎn)無法控制界面必須呈現(xiàn)給人們的一切。

相反，我們必須設(shè)計(jì)變革！這就是日本人所說的wabi-sabi，一個(gè)“以接受短暫和不完美為中心的世界觀”。

因此，以不同的方式思考和設(shè)計(jì)是很重要的：

● 嘗試以多種方式在你的設(shè)計(jì)中呈現(xiàn)數(shù)據(jù);

● 盡可能使用真實(shí)數(shù)據(jù)。

當(dāng)你嘗試以幾種方式呈現(xiàn)數(shù)據(jù)時(shí)，包括一些不可預(yù)測的數(shù)據(jù)，你將能夠測試界面是否已準(zhǔn)備好處理超出設(shè)計(jì)“舒適區(qū)”的這些情況。此外，為極端情況做好準(zhǔn)備。

如果你已經(jīng)推出了該產(chǎn)品，這將更容易，因?yàn)槟憧梢躁P(guān)注實(shí)際數(shù)據(jù)并將其用于你正在進(jìn)行的設(shè)計(jì)過程中作為參考。但是如果你正在研究一些新的東西，那么你將不得不深入挖掘，做一些研究，并嘗試了解以后如何信息。你還可以與后端團(tuán)隊(duì)的開發(fā)人員討論此問題，他們將能夠更好地向你解釋將存儲和呈現(xiàn)的數(shù)據(jù)類型。

 

我給你一個(gè)更具圖形的例子，我的開發(fā)者朋友稱之為“漂亮的朋友綜合癥”。當(dāng)我們設(shè)計(jì)一個(gè)包含人物圖片的屏幕時(shí)，如用戶檔案，我們傾向于使用在設(shè)計(jì)中看起來很好并且很漂亮的人的照片。然而，當(dāng)他看到這樣的設(shè)計(jì)時(shí)，我的朋友說：“我希望我有朋友這么帥?！?

因此，“完美”圖像的替代方案可能是使用不同膚色的人的更多隨機(jī)照片。這樣，你就可以測試重疊元素在不同背景下的外觀，讓你可以看到對比度和易讀性是否仍然完好無損。

不要過于樂觀

對于應(yīng)用程序的工作方式，我們天生就是樂觀主義者。我們認(rèn)為一切都會快速順利地進(jìn)行，而且不會中斷，因?yàn)?.....為什么不呢？這就是為什么我們有時(shí)會忘記如何設(shè)計(jì)和處理用戶可能在以后遇到的一些可能不那么好的情況。

列舉幾例，如果突然互聯(lián)網(wǎng)連接中斷，會發(fā)生什么？或者，如果瀏覽器在執(zhí)行任務(wù)時(shí)嘗試連接到API時(shí)出錯(cuò)？如果連接速度太慢，是否會有加載指示器（例如微調(diào)器或進(jìn)度條），或者在加載實(shí)際數(shù)據(jù)時(shí)是否會有一些占位符填充顯示塊？那么刷新應(yīng)用程序的某些屏幕的可能性呢？什么時(shí)候（以及在哪種情況下）可能？

正如你所看到的，我不是在談?wù)撚脩羲傅腻e(cuò)誤（例如，在填寫表單時(shí)犯了錯(cuò)誤），而是關(guān)于不受其控制但仍然發(fā)生的錯(cuò)誤。在這種情況下，與開發(fā)人員交談，并了解不同屏幕上可能出現(xiàn)的問題，然后設(shè)計(jì)一種可以讓用戶輕松解決問題的方法，讓他們可以選擇稍后再試或者執(zhí)行不同的操作。

無論如何，確定觸發(fā)每個(gè)錯(cuò)誤的特定條件并為每個(gè)案例設(shè)計(jì)有用的錯(cuò)誤消息是一個(gè)好主意。這些有用的消息將幫助用戶在每種情況下做出適當(dāng)?shù)捻憫?yīng)，并知道下一步該做什么來解決問題。即使它有點(diǎn)麻煩，也不惜一切代價(jià)避免使用通用錯(cuò)誤消息。

理解流程

界面包括許多元素，它們一起形成應(yīng)用程序的整個(gè)布局。然而，當(dāng)我們把重點(diǎn)放在用戶界面上的一個(gè)整體，我們往往忘記了一些元素也有較小的任務(wù)來執(zhí)行的總體目標(biāo)做出貢獻(xiàn)。

如果有一個(gè)觸發(fā)某種交互的按鈕或項(xiàng)目，那么請向前看并考慮下一步：在執(zhí)行操作時(shí)是否會顯示加載狀態(tài)？它可以因某種原因被禁用嗎？如果用戶按住按鈕一段時(shí)間該怎么辦？會有任何反饋意見嗎？就像整個(gè)屏幕有不同的狀態(tài)一樣，同樣也適用于單個(gè)元素。

此外，請考慮產(chǎn)品的邏輯如何與用戶的心智模型相匹配，幫助他們準(zhǔn)確有效地實(shí)現(xiàn)目標(biāo)并以有意義和可預(yù)測的方式完成他們的任務(wù)。

我要做的就是解決所有這些問題，就是停止我正在做的事情，暫停，退后一步，查看整個(gè)多屏幕流程的大局，并了解一系列步驟和動作。我將尋找導(dǎo)致該點(diǎn)的多條路徑，以及遠(yuǎn)離它的多條路徑。

你可以在使用原型時(shí)做同樣的事情，慢慢地，認(rèn)真地，謹(jǐn)慎地執(zhí)行動作。如果這對你來說太具有挑戰(zhàn)性，因?yàn)槟阒翱赡芤呀?jīng)多次這樣做了，現(xiàn)在它變成了一種自動化的任務(wù)，并問同事，朋友或活躍用戶看看設(shè)計(jì)或原型?？吹狡渌耸褂貌⑴c你的設(shè)計(jì)進(jìn)行互動可能很有啟發(fā)性，因?yàn)槲覀兺^于接近并且過于熟悉它，因此可能會忽略一些事情。

為您的屏幕設(shè)計(jì)

當(dāng)我在設(shè)計(jì)時(shí)，我通常會將手機(jī)放在我旁邊，以便我可以預(yù)覽我的工作并實(shí)時(shí)進(jìn)行調(diào)整。

我認(rèn)為這是一個(gè)很好的做法，但這種方式也很容易忘記所有其他手機(jī)與人們可能使用的手機(jī)不同。有很多不同的屏幕尺寸（特別是在Android平臺上）; 試著考慮所有可能的變化。

知道從哪里開始的一種方法是檢查你的實(shí)際用戶擁有哪種類型的設(shè)備。

在為各種屏幕尺寸和方向準(zhǔn)備設(shè)計(jì)時(shí)，不僅僅是拉伸盒子和重新定位元素。仔細(xì)考慮如何充分利用每種情況，以及如何進(jìn)行必要的調(diào)整，即使它意味著偏離原始設(shè)計(jì)。

在這些情況下，我們之前討論過的相同原則仍然適用：不可預(yù)測的情況，不同類型的內(nèi)容，可變數(shù)量的信息，缺少數(shù)據(jù)等等。你必須針對各種可能的場景進(jìn)行設(shè)計(jì)。不要陷入將屏幕設(shè)計(jì)為產(chǎn)品的單獨(dú)部分的陷阱，它們都是相互連接的。

這不僅對你有用，而且對開發(fā)人員也有幫助，他們需要了解許多可能的場景才能編寫代碼并準(zhǔn)備界面來解決這些問題。

今天你需要什么，明天你可能需要

你可能已經(jīng)注意到，本文中許多要點(diǎn)的目標(biāo)是減少意外情況。即便如此，在很多情況下你也無法得到明確的答案。開發(fā)人員經(jīng)常會問，“那么，如果我這樣做會發(fā)生什么呢？”指出你以前沒有考慮過的潛在結(jié)果。

如果發(fā)生這種情況，那么你只需要針對一個(gè)案例和一個(gè)屏幕來解決該特定問題。但總是嘗試全局思考，并考慮如何將該特定問題的答案設(shè)計(jì)為以靈活的方式工作，以便你以后可以重用它。

畢竟，這就是我們UI設(shè)計(jì)師所做的 - 我們設(shè)計(jì)和定義適應(yīng)未預(yù)料到的狀態(tài)，條件和流程的靈活系統(tǒng)。將你的界面視為移動，更換智能部件的生動生態(tài)系統(tǒng)，而不是單個(gè)像素塊的集合。

在此過程的這一部分中，你需要與團(tuán)隊(duì)中的開發(fā)人員密切合作，主要是為許多不同情況定義一組行為規(guī)則。但保持良好的平衡 - 盡量不要過度設(shè)計(jì)。用一點(diǎn)常識來設(shè)定自己的極限。你需要在功能和一致性之間取得良好的平衡。請記住，良好的設(shè)計(jì)系統(tǒng)是靈活的，并且在某些情況下為規(guī)則的某些例外做好準(zhǔn)備。

另一方面，想一想你已經(jīng)設(shè)計(jì)過的元素如何調(diào)整以適應(yīng)新的情況。如果你創(chuàng)建一個(gè)設(shè)計(jì)組件庫，你將會看到更好的結(jié)果，因此，只需快速瀏覽一下庫，你就會知道是否需要從頭開始設(shè)計(jì)某些東西，或者你可以使用現(xiàn)成的東西。

結(jié)論

基于設(shè)計(jì)系統(tǒng)的優(yōu)雅解決方案具有明確定義的問題將使我們工作中的視覺設(shè)計(jì)更加有趣，因?yàn)槲覀兛梢詫Ｗ⒂诮缑娴母倪M(jìn)，拋光和愉悅，而無需無休止地迭代。當(dāng)我們過早地跳到視覺效果時(shí)，我們必須同時(shí)解決問題并制作界面，這通常會導(dǎo)致沮喪和倦怠。

改變你的工作流程可能在一開始就具有挑戰(zhàn)性，但過了一段時(shí)間你會喜歡在限制范圍內(nèi)工作。這也將改變你的思維方式，并希望幫助你擺脫對視覺細(xì)節(jié)的關(guān)注。你將成為一個(gè)更加完善和有能力的用戶體驗(yàn)設(shè)計(jì)師，使用適當(dāng)?shù)目山桓冻晒粌H僅是生成無窮無盡的視覺模型和組合。

作者：視覺設(shè)計(jì)_小強(qiáng)哥

轉(zhuǎn)載請注明：站酷

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.820esy.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)、

UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司