當(dāng)前位置：新聞中心網(wǎng)頁(yè)設(shè)計(jì) 與用戶溝通設(shè)計(jì)定稿的決定是設(shè)計(jì)的第一步

02-152010

觀點(diǎn)

與用戶溝通設(shè)計(jì)定稿的決定是設(shè)計(jì)的第一步

2010-02-15 網(wǎng)頁(yè)設(shè)計(jì)

今天，我將分享我日常工作中的所有步驟，相信這些步驟使我成為一名更好的設(shè)計(jì)師。

前處理

1.獲得盡可能多的信息（詢問(wèn)三個(gè)示例）

對(duì)我而言，沒(méi)有什么比看到一個(gè)實(shí)際的工作示例更清楚了。當(dāng)我與新客戶合作時(shí)，或在產(chǎn)品的全新登錄頁(yè)面上時(shí)，我發(fā)現(xiàn)最簡(jiǎn)單的出發(fā)點(diǎn)是要求客戶提供三到四個(gè)鼓舞人心的頁(yè)面，因?yàn)檫@確實(shí)對(duì)雙方都有幫助。讓您的客戶將想法付諸實(shí)踐，使您有機(jī)會(huì)輕松地了解他們的喜好以及對(duì)最終設(shè)計(jì)的期望。

如果您與多個(gè)團(tuán)隊(duì)合作，那么您應(yīng)該致力于與產(chǎn)品開(kāi)發(fā)人員一起度過(guò)與您的設(shè)計(jì)師同事一樣多的時(shí)間。我了解到，做出有效的設(shè)計(jì)決策的關(guān)鍵是確保您盡可能與開(kāi)發(fā)團(tuán)隊(duì)交流。就我而言，在某些情況下，我找到了解決問(wèn)題的方法，我自己無(wú)法解決。

目的是在您進(jìn)行開(kāi)發(fā)之前消除盡可能多的問(wèn)題。

2.了解角色

起初，我必須說(shuō)我對(duì)角色表示懷疑，但是現(xiàn)在這對(duì)我來(lái)說(shuō)很有意義。

因此，與我以前的過(guò)程完全相反，我可以看到角色在處理產(chǎn)品功能時(shí)是多么重要，尤其是在解決方案有許多不同的情況時(shí)。它可以幫助您了解您真正為誰(shuí)設(shè)計(jì)的。我的目標(biāo)是擁有大約四到五個(gè)角色。

3.設(shè)定確切的目標(biāo)-我們應(yīng)該精確追蹤什么？

我認(rèn)為大多數(shù)設(shè)計(jì)師/客戶都忽略了這一步驟，但是對(duì)于雙方而言，設(shè)計(jì)最重要的方面之一就是了解您正在設(shè)計(jì)的產(chǎn)品的目標(biāo)。我們傾向于直接跳入像素并快速充實(shí)項(xiàng)目的UI。如果是全新的網(wǎng)站或新功能，請(qǐng)確保為您首先要實(shí)現(xiàn)的目標(biāo)設(shè)定明確的目標(biāo)。

由于所有內(nèi)容都是可追蹤的，請(qǐng)說(shuō)說(shuō)您要追蹤的確切點(diǎn)。例如，這些范圍可能從新注冊(cè)到使用Paypal的許多客戶與使用信用卡購(gòu)買的客戶不等。始終確保您知道一開(kāi)始的目標(biāo)！

4.設(shè)置項(xiàng)目文件夾并開(kāi)始構(gòu)建情緒板

有很多啟發(fā)網(wǎng)站? -Dribbble，Behance，Pttrns 等。找到與您正在從事的項(xiàng)目相似的項(xiàng)目真的很容易。此外，對(duì)于您遇到的問(wèn)題并試圖解決的問(wèn)題，可能已經(jīng)有了解決方案。

當(dāng)我開(kāi)始一個(gè)新項(xiàng)目時(shí)，我總是設(shè)置一個(gè)文件夾，該文件夾的名稱為- ?源文件，屏幕和導(dǎo)出，靈感和資源。我將在互聯(lián)網(wǎng)上找到的所有內(nèi)容保存到Inspiration文件夾中，以便以后使用它來(lái)創(chuàng)建基本的情緒板。該文件夾中可能包含來(lái)自插件，色板甚至來(lái)自Behance的完整案例研究的所有內(nèi)容。

5.白板

如果我們想添加新功能或重新設(shè)計(jì)流程，我們坐下來(lái)，每個(gè)人都可以在白板，紙甚至iPad上草擬想法。此操作使我們可以將團(tuán)隊(duì)中的每個(gè)人都置于設(shè)計(jì)師的位置。稍后，我們將給出兩個(gè)設(shè)計(jì)選項(xiàng)，以查看哪一個(gè)效果最佳。

在此過(guò)程的這一部分中，我們始終嘗試通過(guò)整個(gè)體驗(yàn)并討論大多數(shù)邊緣情況。與設(shè)計(jì)階段甚至開(kāi)發(fā)階段相比，現(xiàn)在解決這些問(wèn)題確實(shí)至關(guān)重要。那時(shí)候您可能會(huì)浪費(fèi)很多時(shí)間和精力。

6.映射出所有屏幕（用戶需要輸入哪些數(shù)據(jù)）

現(xiàn)在是超越白板并列出用戶所有輸入和故事的時(shí)候了。寫(xiě)下用戶應(yīng)確切插入特定屏幕的內(nèi)容以及用戶如何實(shí)現(xiàn)其期望的目標(biāo)。

7.寫(xiě)下所有可能的狀態(tài)

由于所有儀表板，應(yīng)用程序或網(wǎng)站的表單都具有不同的狀態(tài)，因此這是您不應(yīng)該忘記的另一個(gè)重要步驟。

在設(shè)計(jì)時(shí)，我們需要確保解決所有這些問(wèn)題。在我們的Sketch文件或PSD中有閃亮的圖形和炫酷的個(gè)人資料圖片真是太好了。但是，用戶很可能會(huì)看到應(yīng)用程序的另一面。特別是當(dāng)它們出現(xiàn)在您的產(chǎn)品上時(shí)。有必要做準(zhǔn)備。以下是我們?nèi)绾翁幚砥渲幸粋€(gè)數(shù)據(jù)組件中的空狀態(tài)的示例。

8.準(zhǔn)備第一個(gè)圖

所有這些導(dǎo)致低保真度的最后部分。由于有了白板任務(wù)的結(jié)果，我們現(xiàn)在知道了所有可能的狀態(tài)，用戶的輸入和目標(biāo)?？偨Y(jié)所有交互，我創(chuàng)建了一個(gè)圖，說(shuō)實(shí)話，我已經(jīng)多次更改了此操作的樣式：從具有光柵化版式的Sketch文件變?yōu)閮H用矩形表示每個(gè)頁(yè)面的矩形，其名稱如下。話雖如此，這個(gè)過(guò)程總是很痛苦，我通常會(huì)遇到一種情況，我們想在此過(guò)程中稍后進(jìn)行更改或添加一些內(nèi)容。使用這些解決方案時(shí)，我通常不得不執(zhí)行更多步驟。例如更改線條，箭頭和圖像的位置。

最近，我一直在使用Camunda Modeler，這并不是一個(gè)精確的設(shè)計(jì)工具。這是一個(gè)用于創(chuàng)建技術(shù)圖表的簡(jiǎn)單應(yīng)用程序。聽(tīng)起來(lái)很奇怪，但此應(yīng)用程序旨在幫助您構(gòu)建基本圖表。最重要的是，創(chuàng)建的所有內(nèi)容都是完全可伸縮的。您可以輕松地拖放任何點(diǎn)，它將自動(dòng)為您創(chuàng)建線條和箭頭。您還可以從不同類型的要點(diǎn)中進(jìn)行選擇，這有助于突出顯示例如用戶收到對(duì)講機(jī)的電子郵件時(shí)的信息。Camunda導(dǎo)出到SVG，從而可以輕松為Sketch中的可跟蹤點(diǎn)著色。

9.滑板

當(dāng)我將所有圖像收集到Inspiration文件夾中時(shí)，便可以開(kāi)始創(chuàng)建情緒板。在開(kāi)始像素處理之前，我主要使用情緒板來(lái)與同事討論我的想法并描述一些視覺(jué)想法。

10.初稿

設(shè)計(jì)始終是一個(gè)持續(xù)的過(guò)程。您將在整個(gè)過(guò)程中進(jìn)行很多迭代，以取得理想的結(jié)果。初稿也是收集反饋的一種方式。您不必進(jìn)行像素完美的設(shè)計(jì)即可開(kāi)始接收來(lái)自隊(duì)友，客戶或潛在用戶的反饋。為了獲得他們的第一個(gè)想法并開(kāi)始討論，我通常會(huì)混合使用我們當(dāng)前設(shè)計(jì)的屏幕。這使我們能夠在不到一天的時(shí)間內(nèi)開(kāi)始使用外觀逼真的設(shè)計(jì)。您可以制作第一個(gè)簡(jiǎn)單的原型來(lái)測(cè)試事物是否可以很好地連接在一起。

11.寫(xiě)你的副本

復(fù)制是用戶決策的關(guān)鍵方面之一，我將其視為設(shè)計(jì)的關(guān)鍵部分。沒(méi)有什么比沒(méi)有令人困惑的對(duì)話框的好設(shè)計(jì)更好的設(shè)計(jì)了，用戶在其中很難找到下一步。

12.第一次實(shí)習(xí)測(cè)試

使用初稿，您可以在Marvel或Invision中快速創(chuàng)建原型。這是我最近開(kāi)始做的事情，事實(shí)證明這是另一個(gè)令人驚奇的驗(yàn)證方面。使用原型，您現(xiàn)在可以輕松地與團(tuán)隊(duì)中的3或4個(gè)人建立呼叫，并與他們共享原型鏈接，并在測(cè)試特定流程/場(chǎng)景時(shí)嘗試提出一些問(wèn)題。

這樣，您可以輕松地測(cè)試您的提問(wèn)技能，并且顯然可以在真實(shí)用戶上測(cè)試您的設(shè)計(jì)決策，而不必?fù)?dān)心浪費(fèi)資源和時(shí)間。我傾向于選擇不參與儀表板開(kāi)發(fā)的人員。也要盡量避免看到有人曾經(jīng)有機(jī)會(huì)玩過(guò)原型。

13.禮節(jié)

我們都知道保持整潔有多么困難。如何提供另一個(gè)功能。這通常會(huì)導(dǎo)致草圖或PSD文件混亂。我已經(jīng)學(xué)到了很多關(guān)于在初創(chuàng)公司中擔(dān)任單一設(shè)計(jì)師，在團(tuán)隊(duì)中工作或開(kāi)發(fā)自己的數(shù)字產(chǎn)品之間的區(qū)別的知識(shí)。

當(dāng)您在團(tuán)隊(duì)中工作時(shí)，請(qǐng)考慮您的PSD，就像您正在為其他人創(chuàng)建它們一樣。我使用的規(guī)則是，如果一個(gè)文件夾中的層數(shù)超過(guò)8，則應(yīng)創(chuàng)建一個(gè)新層。

我找到了一個(gè)很棒的Sketch插件，為我的UI套件工作節(jié)省了我?guī)讉€(gè)小時(shí)：重命名它。

提示：將所有內(nèi)容放在畫(huà)布上。我一直在努力設(shè)計(jì)漂亮的頁(yè)眉，而其余的畫(huà)布是白色的。在設(shè)計(jì)時(shí)，我學(xué)會(huì)了將所有內(nèi)容放在第一位-只是玩布局和版式。設(shè)計(jì)精美的細(xì)節(jié)并在適當(dāng)位置使用整個(gè)概念要容易得多。

14.創(chuàng)建UI元素并開(kāi)始使用LEGO

我可能參加聚會(huì)很晚，而在撰寫(xiě)本文時(shí)，這聽(tīng)起來(lái)已經(jīng)過(guò)時(shí)了。我們?cè)诖诉^(guò)程中沒(méi)有進(jìn)行任何線框圖的原因很簡(jiǎn)單。我發(fā)現(xiàn)Sketch 39帶有令人難以置信的東西，那就是“具有調(diào)整大小屬性的形狀”。這使團(tuán)隊(duì)中的每個(gè)人都可以輕松進(jìn)行設(shè)計(jì)?，F(xiàn)在，我們的Sketch文件是純拖放文件。您可以輕松地給任何隊(duì)友一塊空白的畫(huà)布，他們可以創(chuàng)建幾乎高保真的草稿。因此，我們能夠跳過(guò)所有線框圖工具，并以幾乎真實(shí)的像素開(kāi)始。

這也與我們能夠?qū)⒕€框?qū)嶋H轉(zhuǎn)換為實(shí)際設(shè)計(jì)緊密結(jié)合。任何PM都可以創(chuàng)建線框，然后我可以輕松地將其接管并轉(zhuǎn)換為高保真度。

當(dāng)您完成基于第一反饋的設(shè)計(jì)和迭代時(shí)，您還沒(méi)有完成?，F(xiàn)在是時(shí)候?qū)⒛脑O(shè)計(jì)移交給工程師/開(kāi)發(fā)人員了。

15.規(guī)格

我的主要目標(biāo)之一是始終能夠與團(tuán)隊(duì)溝通我的決定，并能夠盡我所能減少開(kāi)發(fā)人員的困難，以便為他們提供最佳的資源。對(duì)于我來(lái)說(shuō)，這絕對(duì)是我從事設(shè)計(jì)師工作中最重要的部分。

由于我們記錄了所有交互過(guò)程并從流程開(kāi)始就已準(zhǔn)備好一切，因此創(chuàng)建規(guī)格很容易。我傾向于在Google文檔中或在Sketch文件的屏幕下方編寫(xiě)規(guī)范。最好對(duì)所有功能進(jìn)行說(shuō)明來(lái)處理您的設(shè)計(jì)，以便以后任何人都可以抓取您的文件。

16.圖

此技術(shù)非常適合打印設(shè)計(jì)并與團(tuán)隊(duì)討論。但是如今，我認(rèn)為有更好的選擇。比如準(zhǔn)備好最終的原型。

17.最終原型

對(duì)我來(lái)說(shuō)，關(guān)鍵的事情之一是始終在原型中準(zhǔn)備好所有交互。在與隊(duì)友進(jìn)行的小型會(huì)議或展示一些特殊流程的過(guò)程中，我通常會(huì)在最終決賽的途中擁有3–5個(gè)原型。我傾向于在一個(gè)畫(huà)板上準(zhǔn)備Sketch中的所有狀態(tài)，然后復(fù)制這些畫(huà)板以在導(dǎo)出時(shí)準(zhǔn)備好每個(gè)狀態(tài)。

最好在設(shè)計(jì)的各個(gè)部分中添加注釋，以進(jìn)一步擴(kuò)展杭州網(wǎng)站建設(shè)，以便每個(gè)文案和對(duì)話框都能按要求工作，即使是文案撰稿人也可以輕松地檢查真實(shí)像素和流。

上一篇：什么是通知。它們的目的是激發(fā)行為的設(shè)計(jì) 返回觀點(diǎn)列表下一篇：動(dòng)畫(huà)設(shè)計(jì)的規(guī)范與必要性

本文標(biāo)簽：

本文地址： http://www.bmwdream.cn/a/1301.html

相關(guān)專題

品牌官網(wǎng)設(shè)計(jì)
杭州派迪科技為高端客戶提供品牌官網(wǎng)咨詢策劃，品牌官網(wǎng)設(shè)計(jì)，品牌官網(wǎng)建設(shè)開(kāi)發(fā)服務(wù)，以國(guó)際化視野和標(biāo)準(zhǔn)為基礎(chǔ)，為各行業(yè)領(lǐng)軍品牌提供高端企業(yè)網(wǎng)站定制、策劃、設(shè)計(jì)、互動(dòng)與制作
查看詳情
大策略營(yíng)銷門(mén)戶網(wǎng)站
杭州派迪科技有自己的營(yíng)銷型網(wǎng)站CMS系統(tǒng)，適合白帽SEO網(wǎng)站。特別對(duì)大策略的營(yíng)銷型門(mén)戶網(wǎng)站制作有一定的經(jīng)驗(yàn)，曾經(jīng)為上海天擎外貿(mào)行業(yè)網(wǎng)站、浙江兆龍營(yíng)銷型門(mén)戶、先臨三維門(mén)戶營(yíng)銷網(wǎng)站提供全程的技術(shù)支持及SEO優(yōu)化指導(dǎo)
查看詳情
集團(tuán)/上市公司網(wǎng)站
杭州派迪科技為杭州本地集團(tuán)公司提供網(wǎng)頁(yè)設(shè)計(jì)、制作、開(kāi)發(fā)服務(wù)，為集團(tuán)公司網(wǎng)站建設(shè)提供了響應(yīng)式、營(yíng)銷型、品牌型、門(mén)戶型網(wǎng)站建設(shè)需求，歡迎廣大集團(tuán)公司客戶咨詢
查看詳情
外貿(mào)網(wǎng)站建設(shè)
杭州派迪科技為高端客戶提供外貿(mào)網(wǎng)站咨詢策劃，外貿(mào)官網(wǎng)設(shè)計(jì)，外貿(mào)官網(wǎng)建設(shè)開(kāi)發(fā)服務(wù)，以谷歌搜索引起算法為基礎(chǔ)，為各行業(yè)外貿(mào)公司提供高端企業(yè)外貿(mào)網(wǎng)站定制、策劃、設(shè)計(jì)、互動(dòng)與制作
查看詳情
企業(yè)網(wǎng)站建設(shè)
高端專業(yè)、令人印象深刻的用戶界面、易于訪問(wèn)——企業(yè)網(wǎng)站必須反映一切，因?yàn)榕傻峡萍荚谶@里提供幫助，憑借精湛的技術(shù)、豐富的經(jīng)驗(yàn)、與客戶的持續(xù)溝通以及對(duì)每一個(gè)細(xì)節(jié)的關(guān)注，我們確保在快速的周期時(shí)間內(nèi)提供優(yōu)質(zhì)的服務(wù)。
查看詳情
半定制網(wǎng)站
杭州派迪科技模板網(wǎng)站建設(shè)專題_各行業(yè)方案專題欄目提供各行業(yè)產(chǎn)品適合的網(wǎng)站建設(shè)方案,幫助企業(yè)了解派迪科技建站效果等信息,您可以通過(guò)本站了解各行業(yè)網(wǎng)站建設(shè)方案,如需要獲取本行業(yè)定制網(wǎng)站建設(shè)方案,可以聯(lián)系在線客服或撥打電話咨詢
查看詳情