避免 iOS 和 Android 設計中的不良做法

您見過多少普通人同時使用 iOS 和 Android 設備？ 根據這項研究，官方數字介於 10% 和 20% 之間，但該數字還包括 Mac 用戶，而不僅僅是移動用戶。 在實踐中，人們傾向於在給定的時間內只使用一部手機或平板電腦。 如果他們碰巧使用兩個設備，通常情況下，兩者都將運行相同的操作系統。

這意味著沒有必要為應用程序的 UI 設計製作像素完美的副本，試圖適應兩個平台，完成數十種不同的屏幕尺寸、縱橫比和分辨率（我們甚至不要調出缺口、狀態欄、導航欄、硬件按鈕等）。

相反，即使用戶同時在 iOS 和 Android 上查看同一個應用程序，他們也很可能更願意在兩者上體驗原生的感覺。 這就是為什麼許多項目經理和產品負責人在移動開發中採用的方法通常不是最理想的，需要進行微調。

為什麼這仍然是一個問題？

但是為什麼利益相關者和管理者仍然會做出經常降低用戶體驗的決策，從而破壞他們自己的產品呢？ 在十年之初，每個人都還在掌握 iOS 和 Android 開發的時候，這是可以理解的，但這個惱人的問題一直持續到今天。

出現這種情況的主要原因可能是項目經理和移動開發人員表示擔心，如果他們的用戶在另一個平台上看到相同的應用程序，他們可能會感到困惑，並意識到它不能提供完全相同的感覺和 UI。 公平地說，在某種程度上，這種思路是有道理的，因為某種程度的相似性是必要的和受歡迎的。 然而，太過分了，在極端情況下，為不同平台製作應用程序的精確克隆實際上往往弊大於利。

最終目標應該是達到適當的平衡——不要強迫像素完美的一致性，而是堅持共同的設計理念，並保持兩個平台的應用程序導航圖相似； 提供相同的功能和相同的工作流程，但盡可能堅持原生行為。

每個人都喜歡隨處可見的自定義按鈕或精美的動畫，但原生元素是人們習慣的，並且使用起來更容易、更直觀。

關注用戶，而不是外觀

為了找到解決這一困境的好方法，我們應該從行尾——最終用戶開始。 研究告訴我們，Android 和 iPhone 用戶是非常不同的人，如果我們的目標是最佳用戶體驗，我們應該嘗試了解他們的使用模式。

從人們決定每月在技術上花費的平均預算開始（ iPhone：100.88 美元，Android：50.83 美元） ，通過他們每天在iPhone 上自拍的數量：12，Android：7以及他們每天發送的短信iPhone : 57, Android: 26 ，很容易發現差異很大，以至於我們可以得出結論，行為存在差異，這決定了人們使用設備的方式。

那麼，在同時為兩個平台設計應用程序時，我們應該關注什麼？

首先，盡可能選擇原生元素。 即使你使用的是跨平台框架，大部分組件都是基於純原生視圖； 所以除非你真的需要定制的東西——堅持基礎。 人們喜歡使用他們習慣的東西，您將為更重要的功能（和代碼審查！）節省一些開發時間。

自定義視圖絕對可以為您的應用程序帶來個性和獨特性，只要它們保持與通用視圖相同的一般想法和使用感覺 - 太少，您的應用程序很無聊，太多，它不必要地浮華且難以使用。

有時，即使是與自定義視圖稍有不同的微小觸摸也可能會改變您的應用程序的遊戲規則，但如果您在所有屏幕上填充新元素供用戶探索，他們可能會在尋找重要信息時不知所措並迷失方向。 這些細微的修飾被稱為“拋光”絕非巧合！

如何處理不同的設計組件

根據經驗，請始終記住每個平台都有自己的設計指南。 Android 的套路是踩著 Material Design，而 Apple 則信賴 Human Interface Design。 進入我們在規劃設計時應該考慮的特定組件，有幾個主要部分需要關注：

1. 一般風格：除非我們談論的是跨平台應用程序，否則我們應該考慮遵循每個平台的一般風格指南。 總體而言，iOS 設計趨於扁平化，而 Android 則採用更分層的方法。

   從歷史上看，移動平台已經相互影響了十年或更長時間，你可以很容易地在 iOS 中發現一些 Android 概念，反之亦然。 例如，當指紋傳感器開始出現在移動世界中時，製造商正在（並且仍在）試驗傳感器的尺寸和位置，試圖讓盡可能多的用戶感到舒適。 同時，設計師和開發人員也在適應新功能，因此最終，兩個平台的視覺元素和反饋基本相同（除了一些奇特的方法）。

2. 硬件細節和導航模式：這可能是徹底克隆您的應用程序的負面影響的最引人注目的例子之一。 大多數 Android 設備仍然有一個額外的導航欄（無論是不同設備上的硬件還是軟件），包括一個後退按鈕。 由於 iOS 不提供該功能，因此應用程序必須考慮在何時何地提供後退按鈕，通常位於每個屏幕的左上角。

   菜單按鈕（本例中的方形按鈕）還可以為 Android 應用程序提供附加功能。 這在哪里相關？ 例如，當打開設置菜單或類似的導航功能時。

   

   直到最近，iPhone 還配備了 Apple 的傳統 Home 按鈕，但自從 iPhone X 推出以來，它一直被邊緣化，iOS 中的流程現在基於手勢。 如果滑動是您的應用程序的重要組成部分，請確保在應用程序容器的邊緣和您允許的滑動區域之間提供足夠的緩衝，以避免棘手的滑動巧合。

   如果您的應用程序依賴於特定於硬件的功能，例如藍牙、NFC 或有線耳機，您應該始終考慮您支持的不同硬件規格的範圍。 當用戶嘗試與特定功能交互時，嘗試向他們提供適當的反饋。 如果出於某種原因，您只需要為兩個平台之一提供特定於硬件的功能，請務必告知您的用戶不同之處。

3. 全局元素（狀態欄、標題等）：出現在您設計的所有頁面上的組件，如狀態欄、導航標題等，應該嚴格旨在提供原生感覺，所以我們不應該改變這些條的高度和样式。 兩個平台上的全局元素樣式存在細微差別。 例如，Android 使用左對齊文本，而 iOS 使用居中標題。 狀態欄是一個原生組件，因此您無需擔心它，但在規劃應用的頂部時請記住不同的凹槽和屏幕縱橫比。

   

   

4. 導航： Google 的舊 Material Design 指南建議在 Android 應用程序中使用抽屜式菜單導航，底部導航落後，但仍然是一個可行的選擇。 iOS 傾向於只使用標籤欄，這可能會限制您的頂級導航選項，但可以同時提供所有選項的清晰視圖。 在這種情況下，兩個操作系統都提供了類似的組件，可以根據應用程序的複雜程度使用這些組件，但是兩個系統的視覺差異自然會引導你——例如，Android 中的全局導航欄和 iOS 中缺乏的導航欄。

   近年來移動硬件的快速發展帶來了許多變數和未知數：全屏手機、不同形狀和大小的凹口、手勢在設備範圍內導航的使用增加等等。 所有這些變化都為用戶提供了前所未有的力量，但當我們試圖找出應用程序中給定屏幕的所有用例時，可能會很痛苦。 考慮到這些擔憂，避免用戶混淆的一個好方法是保持導航模式簡單且一致，而不會使應用程序因過多的手勢、條形和多方向滑動選項而過載。

   

5. 排版：兩個平台都有它們的默認字體——iOS 的San Francisco和 Android 的Roboto 。 除非您要使用與您的一般應用程序樣式緊密匹配的自定義字體，否則您應該堅持使用默認字體。 請記住，用戶可能會更改他們的默認系統字體，這不會影響您使用特定字體自定義的任何視圖。

   例如，如果閱讀障礙用戶已將默認字體替換為專門滿足其需求的字體，他們可能無法在您的應用中度過最佳時光。 如果您支持可能使用非拉丁字體（如西里爾文、阿拉伯文等）的用戶，請確保您的自定義字體也提供這些額外字符。 如果您喜歡游戲，您可能會看到俄羅斯玩家獲得的高分排行榜，這些玩家的名字因字體不同而脫穎而出。 這只是在開發階段犯的一個小錯誤，並不是針對特定玩家的“功能”，雖然它可能不會讓用戶放棄你的應用，但它肯定會導致用戶體驗下降或導致投訴或差評。

   

6. 其他組件：按鈕、屏幕轉換、動畫、微交互、操作表、警報和所有其他類型的流程控制超出了本文的範圍，但它們應該遵循我們迄今為止應用於其他設計元素的一般原則——兩個平台都不鼓勵過多的自定義元素，因為它們可能會分散和混淆用戶的注意力； 在設計方面，第一印象通常是許多用戶的最後印象，這就是為什麼從一開始就吸引用戶的注意力並讓他們有賓至如歸的感覺如此重要的原因。

在現實世界中，您可以看到我們討論的規則的一些非常流行的例外——遵循 Material Design 指南的 iOS 應用程序和一些遵循 Apple 人機界面指南的 Android 產品，但這些應用程序有自己的、經過驗證的風格。 用戶熟悉應用程序及其設計，對他們來說，提供稍微更自定義的感覺是有意義的。

跨平台方法做得對

另一方面，如果您的項目基於跨平台解決方案（如 React Native、Flutter、Xamarin 等），您應該考慮您想要關注的主要平台並從那裡開始。

近年來，這些新框架極大地提高了跨平台應用程序開發的生產力。 越來越多的公司正在轉向這種開發模式，因為它提供了更短的上市時間、卓越的成本效益和更少的技術障礙，主要缺點是有限的功能支持和在某些情況下不理想的用戶體驗。

雖然幾乎所有用於跨平台開發的舊解決方案都基於 Web 視圖，因此在許多設備上都遇到了嚴重的響應問題，但現在我們甚至可以在跨平台方法中使用本機組件。 這一重大改進在許多方面影響了市場，並使所有移動平台朝著統一各種設備和平台上的用戶視覺體驗邁進了一步。

如果您決定採用跨平台解決方案，則可以通過構建應用程序的骨架，從標準的原生應用程序開始。 一旦您的主要優先事項啟動並運行（設置基本依賴項、構建 MVP、達到特定於項目的里程碑、發布您的第一個版本等），您可以使用平台輕鬆分離兩個應用程序的主要設計 -每個框架提供的特定工具。 根據您團隊的規模和可用的時間框架，您甚至可以考慮在版本 1 中包含這些調整，以避免將來在給定平台版本中看起來不再相同時出現混亂。

畢竟，您應該評估哪些原則對您的應用程序有效。 就像我們行業的幾乎所有努力一樣，您應該嘗試遵循指南，同時稍微調整它們以適應您的特定需求。 例如，如果抽屜式導航對您的簡單五屏應用程序真正有意義，那麼您不需要為每個平台提出複雜的解決方案。 讓用戶輕鬆識別您的自定義按鈕和工具，無論它們是關鍵組件還是次要自定義。

好的設計尊重用戶習慣

總而言之，我們可以重複我們已經知道的東西——好的設計是在每個操作系統中尊重用戶習慣的設計。 最後一點點潤色可能會在普通應用程序和出色應用程序之間產生差異。

很多時候，您的應用無法提供足夠的獨特功能來僅靠內容贏得用戶。 大多數人會用“直覺”來描述他們選擇一種產品而不是另一種產品的決定。 這類用戶的選擇主要基於他們在使用應用程序時的感受，通過隱式評估他們在屏幕上看到的響應能力、一般樣式選擇、調色板和各個視覺組件。

因此，請嘗試確保您的產品不僅憑藉其驚人的功能而脫穎而出，而且還具有與其提供的服務質量相匹配的高檔包裝。