如何規範移動應用交互設計？UI/UX設計師須知的11個小技巧

如下內容由Mockplus團隊翻譯整理，僅供學習交流，Mockplus是更快更簡單的原型設計工具。

 

十年前，手機的使用只是爲了溝通。

而近幾年，狀況發生了很大變化，咱們很難找到不使用手機的人。手機在極大程度上改變了人們的生活，特別是智能手機，人們沉迷於手中的這個小盒子裏。是什麼令人們如此沒法自拔？打開手機才發現裏面充斥着琳琅滿目的移動應用程序。

儘管移動應用在行業中已經達到飽和點，但真正的設計師依然能夠設計出脫穎而出的應用程序。在這裏，我基於本身的一些經驗和Google指南爲設計師列出了11個有用的小技巧，這將有效地幫助設計師們設計出既實用，又能解決問題的應用程序。

№1.     使鍵盤與所需的文本輸入框相匹配

自定義鍵盤

據相關人員研究發現：用戶在鍵盤模式和觸摸屏模式之間的這種切換，增長了用戶的認知負荷。如何減少用戶的認知負荷？設計師應該爲用戶提供一個可自定義的鍵盤。

系統鍵盤

系統鍵盤如何與所需的文本輸入框相匹配？系統鍵盤則應該嘗試根據上下文進行自動更改，並顯示保存的密碼。

https://dribbble.com/kukareka

№2 .充分利用硬件中的手勢識別優點

移動端的主要優點是當考慮到網絡環境時，手機能夠支持大量的本地硬件的使用，如加速計，GPS，藍牙，手勢識別等。

最大限度地利用手勢優點進行設計，不要經過打字實現滑動，輕敲等；固然，也不要忘記使用其餘硬件優點，你能夠經過這些硬件來減小許多表單字段。

https://dribbble.com/shots/3605964-Airbnb-AR-Map-Concept

№3. 不要隱藏密碼

在移動設備中不須要顯示和隱藏密碼選項。因爲移動設備的屏幕較小，用戶使用起來也比較安全。所以，刪除顯示和隱藏選項將有效減小很差的用戶體驗。

https://dribbble.com/greglilley

№4. 顯示搜索欄

若是你可以設計出一個完美的搜索框，那麼你的用戶體驗幾乎成功了一半。

儘管全部的應用程序都有本身的獨特性，但用戶最喜歡的搜索方式仍是向下滑動而後搜索所需內容。除此以外，設計師在設計搜索欄交互時，爲了提供良好的用戶體驗，必定要根據用戶的使用習慣顯示他們最近搜索和最喜歡的搜索時間。

https://dribbble.com/virgilpana

№5. 在正確的時間請求權限。

有時候，設計師認爲得到權限是一個好的設計主意，用戶只需點擊並授予全部權限便可。

但事實並不是如此，用戶對他們的數據很是認真，因此若是你須要獲取關於他們的數據，請確保你在正確的時間詢問權限。

由於它可讓用戶信任你的應用程序，同時他們也極有可能發展成你的老用戶。

https://dribbble.com/hugodesgayets

№6. 不要使用閃屏

優先向用戶展現應用程序的價值主張，直接把它們放在主屏幕上。當用戶打開應用程序時一眼就能看到。

不須要製做花哨的閃屏，這樣你也不用爲漂亮的插圖而苦惱。根據研究代表，用戶平均會花費45秒來選擇一個應用程序。

他們一般會下載十個應用程序而選擇一個，所以你的應用程序必須在10秒內吸引住用戶並顯示其價值。所以，使用閃屏顯得不合時宜。

https://dribbble.com/shots/3668351-Funding-app-Home-screen

№7. 注意應用程序的屏幕方向

對於移動應用程序的設計，咱們老是在豎屏模式下進行設計。設計師應該同時檢查屏幕橫向和縱向的適應效果，不要忘記在橫屏模式下測試你的應用程序。

若是用戶30％的時間都在使用橫屏模式，則設計必須考慮橫向模式。

例如用戶在駕駛時，或使用金融，書籍和遊戲等應用程序時，手機的主要模式爲橫屏模式。（https://thomaspark.co/2011/10/in-portrait-or-landscape/ ）

https://dribbble.com/shots/3639526-Album-Landscape-Interaction

№8. 形式簡單明瞭

總所周知，桌面端的主要操做是鍵入，而移動端的主要操做則是輕擊，點按，長按。嘗試簡化表格試用，用戶沒必要不在這裏填寫重要的表格。因此，請嘗試設置不一樣的交互方式來填充表格。

https://dribbble.com/shots/3519538-My-Diet-App-Onboarding

№9. 測試手機上的應用程序

測試手機上的應用程序，這是我給每位設計師的第一個建議。若是你正在設計一款手機應用程序，當你開始設計時，不妨鏈接你的筆記本電腦來看看你的應用程序設計。你的設計不只僅應該適用於高清桌面，也應該適應於低分辨率的低劣屏幕 ; 請確保你的設計適用於最糟糕的狀況。

№10. 提供直觀的導航

這是很是基本的，但有時設計師每每容易忽略。90％的時間裏用戶都試圖使用他們已經習慣的系統模式的導航，用戶使用這種導航可使你的應用程序更加智能，但前提必須是你導航足夠直觀，用戶不會由於搜索導航過久而卸載你的應用程序。

https://dribbble.com/shots/1766396-Animated-Tab-Bar-Icons

№11. 篩選和排序選項。

在設計產品時，設計師應該多考慮如何讓用戶感到滿意。

當一個網站能夠在一個屏幕上顯示14張圖片時，一個手機屏幕一次只能顯示三張圖片。大多數設計師在沒有考慮這一客觀事實的狀況下，在屏幕上刪除了許多功能，並製做了一個普通的屏幕過濾器來迷惑用戶。

我強烈建議設計師提供一個有效的過濾器和排序選項，帶給用戶滿意的體驗。所以，不妨多花點時間根據上下文爲用戶提供一些有效的選項。

以上就是設計師在移動應用交互時能夠學習的11個小技巧，以供參考。

原文做者：Johny vino

原文連接：https://medium.muz.li/11-things-every-designer-needs-to-know-about-mobile-app-interaction-a22c635527b3

學習工具，但不受限於某種工具。Mockplus作原型，更快更簡單，如今下載Mockplus，免費體驗暢快的原型設計之旅。