<sub id="1zz7z"></sub>
        <sub id="1zz7z"></sub>

        <sub id="1zz7z"></sub>

          <sub id="1zz7z"></sub>

                  <address id="1zz7z"></address>
                    <address id="1zz7z"></address><sub id="1zz7z"></sub>

                      <sub id="1zz7z"></sub>

                      如何設計一個優秀的用戶界面

                      2019-03-21    訪問量:0 字號

                      14.jpg


                      在設計Web應用程序時,功能通常被放在第一位。在大多數情況下,這是一件好事。


                      人們(大多)使用應用程序是因為它們很有用,而不是因為它們看起來很漂亮。但這并不意味著你可以忽略良好的用戶界面設計,或者只是簡單地整理一個通用的用戶界面。良好的UI設計增加了用戶對任何Web應用程序的總體滿意度。


                      好的UI設計在很多方面都類似于好的網頁設計。色彩理論、消極空間和布局原則都仍然適用。但是UI設計在很多情況下需要更多的思考,因為它需要交互性。


                      訪問者不僅會看你的網站,他們還會和你的網站互動,有時是以你意想不到的方式進行的。在開始進行web應用程序設計之前,花時間真正探索UI設計是非常重要的。


                      下面是設計一個很好的用戶界面的一些原則和想法。


                       


                      一致性是至關重要的。

                      在用戶界面設計中,頁面、功能和選項之間的一致性至關重要。用戶在使用你的程序時會對某些事情產生期望,如果這些東西在不同的頁面之間發生變化,那么這既會讓人困惑,也會讓人沮喪。


                      例如,如果在應用程序的主頁上,用戶在具有頂部導航欄的頁面之間導航,請確保在后續頁面上顯示相同的頂部導航欄,并確保從其鏈接的頁面以相同的順序顯示。


                      其他需要保持一致的內容包括您的配色方案和總體布局,以及指向重要頁面的鏈接,這些頁面可能不會直接在應用程序中使用(例如帳戶頁或常見問題解答)。


                       


                      你的用戶會犯錯誤

                      無論您如何仔細地設計用戶界面,以及它是多么直觀,您的用戶有時都會犯錯誤。有時只是因為他們無意中點擊了。其他時候,這是因為他們沒有真正注意到自己在做什么,或者沒有閱讀頁面的內容。


                      在這兩種情況下,重要的是用戶能夠輕松地撤銷他們所犯的錯誤。


                      你會注意到許多網絡應用程序,包括谷歌文檔,幾乎任何時候你做什么,一個鏈接似乎取消了最后的行動。在其他應用程序中,你可能需要使用菜單來撤銷一個動作,但是最好的網絡應用程序仍然可以讓你在任何時候都可以輕松地返回一兩步。


                       


                      突出顯示更改

                      當在使用Web應用程序時進行更改時,如果您突出顯示這些更改,則對您的用戶非常有用。例如,如果您的應用程序包含來自各種來源或用戶的信息提要,那么突出顯示新內容是一項有用的功能。


                      有許多方法可以突出顯示內容。最流行的方法之一是在新內容的背后加上陰影背景。


                      其他應用程序使用圖標來表示新內容。無論您決定做什么,請確保新內容指示不會干擾內容的可讀性。同樣重要的是,要使這些通知具有非侵入性,以避免分散當前不關心更改內容的用戶的注意力。


                      titanpad

                      TitanPad使用顏色編碼來表示每個用戶所做的更改。




                       


                      啟用鍵盤快捷鍵

                      并不是所有的用戶都會使用鍵盤快捷鍵,即使你讓他們可用。但對于習慣于鍵盤快捷鍵的用戶比例而言,不包括快捷鍵可能會對用戶的滿意度產生災難性的影響。


                      想想用戶在你的網站上執行的最常見的操作,并確保鍵盤快捷鍵是可用的。


                      也要確保您使用的任何鍵盤快捷鍵都是合乎邏輯的。某些快捷方式通常用于某些函數(如Ctrl+Z用于撤銷或Ctrl+V用于粘貼),因此請確保這些快捷鍵繼續工作,就像在其他程序中一樣。


                      合理地選擇快捷方式中使用的鍵,這樣您的用戶就很容易記住它們。確保您還將它們包含在它們各自操作旁邊的任何下拉菜單中。


                       


                      使用熟悉的標準和公約

                      廣泛使用的應用程序已經為應用程序的工作方式設定了一定的標準。例如,人們習慣于看到文件夾圖標的“打開”,或剪貼板的“粘貼”。


                      它們還習慣于在特定的應用程序菜單下顯示某些選項和操作(創建一個新文檔或文件幾乎總是位于“File”菜單下拉框下;復制和粘貼幾乎總是在“編輯”菜單下拉菜單下)。


                      想想已經建立起來的應用程序,它們所做的事情與你的應用程序所做的類似,看看它們是如何組織行動和使用什么圖標的。


                      如果您看到不同應用程序之間的一致性,您應該認真考慮為您自己的應用程序使用相同或類似的圖標。它使用戶更直觀地從另一個應用程序切換到您的應用程序,并將改善他們的體驗。


                       


                      提供個性化選項

                      許多web應用程序允許用戶對其帳戶進行自定義。有些網站允許您調整配色方案或上傳自定義圖形。另一些則允許您重新安排布局或首次登錄時顯示的內容。還有一些允許您創建自定義頁面或類似的內容來顯示您所關注的信息。


                      考慮一下可能的定制,這將改善您的應用程序的功能和用戶體驗。


                      一些應用程序可能無法從定制中獲益,而另一些則充滿了可能性。即使是簡單的事情,如允許用戶上傳自己的標志,或改變顏色方案或字體以適應他們的個人喜好,也會對用戶的體驗和滿意度產生巨大的影響。


                      highrise

                      高層允許用戶定制儀表板的配色方案。這樣的小定制選項可以極大地提高用戶滿意度。




                       


                      使用工具提示和集成幫助消息

                      許多應用程序開發人員都提供了大量的使用應用程序的文檔,這對于新用戶來說是非常有幫助的。但在許多情況下,這些文檔保存在自己的網站上單獨的部分。為了訪問它,用戶必須有效地離開應用程序。


                      雖然對于復雜的應用程序來說,大量的文檔仍然是個好主意,但是將工具提示和幫助信息集成到頁面的模態窗口或側邊欄中可以提高大多數用戶的可用性。


                      這是一種無縫的方式,可以在某人實際使用您的應用程序時提供幫助,這樣可以節省他們的時間,并使整個體驗更加愉快。


                       


                      使用選項卡式導航和按鈕執行操作

                      與按鈕或文本鏈接相比,選項卡導航具有許多優點。然而,最重要的是它所具有的微妙的心理效應。


                      標簽是用筆記本或活頁夾喚起的。每個選項卡表示一個新的節或主題。在線上也是如此。標簽會讓人們下意識地想到移動到一個站點或應用程序的一個新的部分。


                      另一方面,紐扣引起了一種行動。在提交表單之類的事情上使用按鈕在心理上是有意義的,因為人們將按鈕與做某物因此,要獲得最佳的用戶體驗,請記住選項卡=導航,按鈕=操作。


                       


                      把所有東西都遮住在Modal窗戶后面

                      這是有時被忽視的最基本的事情之一。當打開一個模態窗口時,確保你遮住了窗口后面背景中的所有東西。這使窗口更加突出,消除了分心。


                      nirvana

                      有陰影背景的模態窗口的一個很好的例子。




                       


                      使用相關圖標和標簽

                      許多開發人員選擇在他們的應用程序中使用圖標,而不給這些圖標貼上標簽。除了絕對最常見的圖標外,這通常是一個錯誤,只會混淆用戶。


                      添加在圖標懸停時出現的ALT標記并不是避免混淆的好辦法,因為它仍然需要用戶的太多努力。


                      把標簽放在你的圖標旁邊意味著它們可以立即被識別。當用戶熟悉每個圖標的含義時,他們將能夠更快地找到他們正在尋找的東西,在此之前,他們可以很容易地看到每個圖標的確切含義。


                      另一種選擇是使用戶能夠隱藏標簽,盡管確保默認選項是顯示標簽。


                       


                      保持簡單

                      最好的接口盡可能簡單有效。不要為了增加鐘聲和口哨而加鈴鐺和口哨。如果函數有明確的用途,那么添加它。如果沒有,那就不要。


                      設計元素也是如此。如果元素有目的,那么可以添加它。但要避免添加看起來漂亮的東西。它們只會增加視覺混亂,使用戶感到困惑。選擇完成任務的最簡單的解決方案。


                      這并不一定意味著你的應用程序需要極簡主義。但請記住,大多數人使用應用程序是為了他們的功能,而不是他們的設計。只要設計不影響他們高效使用應用程序的能力,那么他們甚至不太可能關注應用程序的視覺元素。


                       


                      有效工作流

                      在設計用戶界面時,需要考慮用戶的工作流程。人們使用特定類型的軟件和特定應用程序的方式是預先確定的,你需要設計你的界面以符合這些模式。


                      例如,如果某些操作通常是相互關聯的,那么將它們組合在應用程序的同一區域。


                      研究一些用戶的工作流程,看看是什么阻礙了他們高效地完成任務,然后找出如何改進UI以滿足他們的需求。在某些情況下,僅靠UI無法解決這些問題,但有時它可以解決這些問題。


                       


                      15例大用戶界面

                      有數以百計,甚至數以千計的網頁應用程序與奇妙的用戶界面設計。這里有十多個給你一些想法。


                      肖普

                      肖普用戶可以很容易地刪除、編輯或查看他們已經上傳的產品,以及添加新產品。


                      shoply



                      INVOICERA

                      Invoicera使用選項卡導航和按鈕執行操作。它還保持相對簡單和直進的布局和色彩方案.


                      invoicera



                      潘多拉

                      很明顯背后的設計師潘多拉在設計用戶界面時,考慮到MP3播放器和其他媒體設備上的界面。這是一個直觀和易于使用的設計,幾乎沒有學習曲線。


                      pandora



                      烏福

                      烏福表單設計界面是一個應用程序所能得到的最直觀的界面。當您開始設計一個新表單時,將顯示幫助消息,以便在不需要離開頁面的情況下準確地解釋該做什么。


                      wufoo



                      格羅維沙克

                      格羅維沙克使用圖標幫助導航和功能。常見的圖標,如“播放”和“跳過”按鈕沒有標簽,但其他,如主頁和收藏圖標,是。


                      grooveshark



                      威迪婭

                      威迪婭使用直觀的界面,只需單擊即可編輯任何內容。他們還使用菜單,只有當你停留在一個想法,這減少了視覺混亂,他們可以讓用戶選擇兩種顏色方案。


                      wridea



                      背包

                      背包使用按鈕進行操作,使用選項卡進行導航,使用起來更加直觀。


                      backpack



                      記住牛奶

                      記住牛奶使用選項卡導航和按鈕執行操作。它們還包括一些有用的符號,這些符號大多否定了對單獨文檔的需要。


                      rememberthemilk



                      TA-DA名單

                      Ta-da列表使他們的界面盡可能簡單。沒有額外的信息,只有手頭的任務。它令人難以置信的直觀,并創造了一個優秀的用戶體驗。


                      tadalist



                      雷倫塔

                      雷倫塔使用選項卡導航和標簽圖標。他們還堅持電子郵件程序的標準慣例,因此他們的用戶幾乎沒有學習曲線。


                      relenta



                      維維蒂

                      維維蒂使用直觀的用戶界面,考慮到非設計師用戶的需求。每當您登錄時都會提供提示,文檔很容易訪問和用戶友好,允許您在實際離開正在處理的頁面之前選擇所需的幫助類型。


                      viviti



                      彈跳

                      彈跳界面非常直接和簡單.可用的工具是直觀的(只需拖動一個區域來記錄、寫反饋,然后共享)。


                      bounce



                      梅特福爾

                      梅特福爾使用如此直觀的界面,幾乎不需要任何文檔。看一看這個應用程序,它只需幾秒鐘就能立即識別出如何使用它,以及不同的圖標和顏色代碼意味著什么。


                      meetifyr



                      DOINGTEXT

                      DoingText通過不需要任何類型的注冊過程來簡化使用。文檔只是基于URL的,協作者只需要URL。它使協作幾乎成為一個瞬間的過程。


                      doingtext



                      書寫板

                      書寫板在主內容區域旁邊的側邊欄中包括有用的樣式幫助。


                      免费看成年人视频在线观看 - 视频 - 在线观看 - 影视资讯 - 新赏网