互聯網產品設計之——APP設計規則

互聯網產品設計之——APP設計規則

2010年是移動互聯網從概念落實到人們日產生活中的第一年,這一年可稱為移動互聯網元年,移動互聯網發展至今已有9個年頭,這9年裡我們也見證了各種類型APP的完善和演變,比如某寶、某東、某易……

不知道大傢伙在使用各種移動軟件(APP)時有沒有發現這些類別不同的軟件之間卻有著很多相識的感官感受和使用方式?今天我們一起探索下移動APP設計中的那些“小套路”。

一、從桌面時代到移動時代出現了哪些主要變化?

1、載體不同:桌面時代到移動時代最大的過渡就是從單一的電腦顯示器衍生出Pad、手機、智能手錶等多平臺、多終端。

2、交互方式不同:在PC端時代和蠻荒時代我們還只是通過鼠標、觸控筆對電腦和觸屏手機進行想要做的操作,操作不便利、效率較低。

3、使用場景不同:手機之所以成為人類的“第二器官”,是因為它豐富了我們的使用情景、覆蓋了更多的使用地點、利用了更多的碎片時間,也就是說移動時代相比於PC時代,人們上網的場景變得更加多樣、時間佔比更高。

二、設計行為認知的三種設計方式?

認知心理學家唐納德諾曼指出設計的層次劃分為“本能層—行為層—反思層”,雖然設計大V提出的理論不容反駁,但個人認為互聯網產品“設計”始終由:感官設計、功能設計、體驗(交互)設計三部分組成。

1、感官設計

感官設計就是人類的耳鼻喉等器官或直覺對產品的感覺、印象和認知,主要有視覺、聽覺、味覺、嗅覺、觸覺和知覺六個部分組成。比如,微信視頻通話前的通知聲和待接聽界面,就是從聽覺和視覺兩種感官上告知我們“某某人正在邀請我視頻通話”。

2、功能設計

互聯網產品的功能設計是產品形成的基礎和必要條件,這一點和傳統的工業設計沒有明顯區分。比如,一個發送郵件的APP如果不能發送郵件,那就是個失敗的產品,因為它不具備發送郵件的主體功能。

3、體驗(交互)設計

較為抽象的設計行為就是體驗(交互)設計,因為這裡面涉及到工科學、交互學、設計學、心理學等多學科,下面“詳談APP設計規則”欄目時詳細描述。不過,可以簡單粗暴的理解成“就是讓使用者用著不費力,不需要過多思考”。

互聯網產品設計之——APP設計規則

三、詳談APP設計規則

1、無論是電腦端還是手機端都遵循的6大設計原則:

(1)、主次原則

為頁面元素(文字、圖片、視頻、鏈接、按鈕等)劃分出主要和次要,便於用戶進行常用及平臺提倡的操作。

比如,我們在購物時各種電商網站都會用鮮豔顏色突出“加入購物車”、“立即購買”的按鍵。

(2)、直接原則

一方面,被拆分後的用戶任務要將主要步驟直接展示給用戶,減少其疑惑感;另一方面能在當前頁面和步驟(當前環節)完成的動作,千萬不要遺留到下一個頁面和步驟。

(3)、統一原則

首先要保證多端統一,比如某新聞類APP在IOS端和Android端的註冊列表不同,這是很致命的問題;其次要保證APP內設計風格一致、語言一致、頁面跳轉方式一致、加載loading一致、字體一致、彈窗一致……不要出現一個流程內有多種交互風格。

互聯網產品設計之——APP設計規則

(4)、少做原則

通過標杆產品和設計心理學知“讓用戶選擇遠遠優於讓用戶填寫”。這樣做有兩個顯而易見的好處:一是,可以大大提升用戶使用產品時的操作效率,讓用戶更快的找到自己想要的東西或完成自己當前的任務;二是,有效的降低了用戶的犯錯幾率也有效的保持了頁面的簡潔性。

(5)、反饋原則

無論用戶在APP中進行了何種操作,系統都應該及時給予操作者反饋。比如,郵件發送成功,應該提示“郵件已發送”;視頻播放失敗,應該提示“當前網絡未連接”。

(6)、對稱原則

生活中很多事物存在辯證關係,移動互聯網產品設計中也不例外,有正既有反,比如“展開/收起”、“下滑/上滑”。

互聯網產品設計之——APP設計規則

2、頁面設計8大設計標準

(1)、採用用戶語言

所謂採用用戶的語言本質也就是“無論是按鈕的名稱、欄目的命名、說明文字,都可以讓使用者看起來很容易理解”。像“購買、支付”都是很易懂的詞語,而“採辦、直撥”(分別為購買、支付的近義詞)就不是日常生活中常用的詞彙,這樣的詞彙放到APP中,也同樣會給使用者帶來疑惑。

(2)、保持簡潔

保持簡潔的定義很容易理解,就好比一件純白色的T恤上面沒有任何條紋和圖像雕飾只有一個產品LOGO,這就是簡潔性。保持APP頁面的簡潔性就是給使用者呈現重要和需要的信息,讓使用者使用APP時不會感到費力氣。

互聯網產品設計之——APP設計規則

(3)、利用習慣用法

舉一個簡單常見的例子,現實世界中我們閱讀書籍時會通過“書籤”來記錄上次閱讀到的位置,以便下次閱讀時可以快速定位到閱讀歷史位置。在很多閱讀類APP中,也有類似書籤的功能,這就是利用了現實世界中的習慣用法。

(4)、建立有效的視覺層次

將每個頁面都劃分出重要、次要、包含、相關的視覺區域,可以最大限度的讓用戶快速瀏覽並找到自己想要的內容。想必很多人都會閱讀報紙或者雜誌,雜誌就是通過將頁面內容劃分出重要和非重要部分來突出重點。

(5)、把頁面劃分成明確定義的區域

(6)、明確標識可以點擊的位置

在設計APP頁面內容時,要通過視覺區分分辨出哪些地方(按鈕、選項卡……)可以點擊,因為這些可以點擊的地方是使用者們在APP中進行的最多的操作之一。

互聯網產品設計之——APP設計規則

(7)、最小化干擾

關注用戶及其任務給予明確的指引,去掉頁面中不重要的信息。比如,歡迎廣告、亞洲交友網站上花哨閃動的圖片,對用戶不僅沒有幫助還會使其產生反感情緒。

(8)、為內容創建清楚的格式

想必很多常常在網上衝浪的用戶都見到過很多《註冊協議》、《XX條款》,裡面大量的文字說明都有著清晰的格式以便於用戶們閱讀。試想一下,如果這些文字沒有標題、沒有留白、字體大小和顏色通通一致,那這些文字將會成為一堵高牆阻止我們去探索和了解。

互聯網產品設計之——APP設計規則

3、APP發展出來的獨立特性

移動軟件(APP)對於桌面軟件(PC)除了上訴通用的設計準則和標準外,移動端還有著以下不可替代的優勢:

(1)、不可忽視的移動設備硬件功能

手機上自帶的重力感應器、GPS、攝像頭,可以讓APP給用戶帶來更順暢、更便利、更及時的使用體驗。比如,DD打車、BD地圖這些常用APP,給我們的生活帶來極大的便利。

(2)、簡單實用的指點、手勢操作

在電腦上我們只可以通過鼠標間接的去操控桌面軟件,這樣不僅操作冗餘而且效率低下。移動互聯網時代,我們在APP上通過指點、手指操作就可以簡單、快速的完成一系列動作,比如“下拉刷新/上滑加載”、“右滑返回上一層級/左滑切換下一欄目”、“雙擊放大圖片”……

(3)、常被忽略的推送設計

一方面,APP可以有效的獲取到註冊用戶的手機號,所以在進行用戶運營、推廣和挽回流失用戶時,運營方可以準確、及時的觸達到APP的使用者,這點PC端桌面應用是很難做到的,哪怕做到了這點也很難保證時間有效性;另一方面,APP站內(系統內部)通知觸達效果較桌面應用更佳。

互聯網產品設計之——APP設計規則


分享到:


相關文章: