Android與iOS：應用程序用戶界面設計的差異和比較

移動領域的兩大風向標--Android和iOS，也是移動應用設計時最大的兩個競爭對手。Android與iOS在市場份額、受歡迎程度、使用人口統計方面數據不相上下，在這里，我們對比了Android和iOS之間的簡單設計差異，這將幫助我們弄清一個與另一個有何不同。

創新互聯公司2013年開創至今，先為蠡縣等服務建站，蠡縣等地企業，進行企業商務咨詢服務。為蠡縣企業網站制作PC+手機+微官網三網同步一站式服務解決您的所有建站問題。

由于碎片化的原因，安卓系統的應用設計會有細微的差異。

我們先來了解一下Android與iOS UI應用設計在扁平化設計和材質設計方面的對比。

人機界面指南主要基于三個原則。清晰、尊重和深度。簡單來說，該方法支持極簡主義，使用簡潔的元素，注重排版和扁平化色彩。

簡而言之，Android Material Design被認為是Flat設計的升級版，帶有擬態性（一種流行的設計概念，即讓所代表的物品與現實世界中的對應物相似）。

用Google設計副總裁 MatíasDuarte 的話來說，它是–

有了這些基礎知識，讓我們從7個方面研究兩個平臺之間的差異。

目錄

1. 導航

2. 按鈕

3. 圖標和屏幕分辨率

4. 字體

5. 控件

6. 卡片

7. 警報

對于iOS應用程序，總是在“后退”按鈕旁邊提示上一個選項卡的名稱。在中間，顯示當前選項卡的名稱，而在右上角則顯示“編輯”或“完成”（控制按鈕）。

說到Android的設計規則，應用程序通常在抽屜菜單或后退按鈕（可選）之后的左上角顯示標題。移至右上方，總是有一個操作項，例如搜索圖標（也可以是多個，例如“收藏夾”圖標），其后是溢出菜單。

在iOS中，主導航始終顯示在底部，功能菜單專門用于存儲一次性功能。而在Android中，通常會在功能菜單中看到主要導航，或者以搜索欄，浮動操作按鈕等形式在整個界面中存在。

ios界面指南中，沒有類似抽屜導航菜單的標準控件。iOS的全局導航被放置在應用屏幕的底部，一般位于最末位的 "更多"標簽下找到二級導航。

Android中，二次導航是一個抽屜，一旦按下功能菜單圖標，就會從左到右打開，同時產生一個深色的遮罩層。

有四種方法可以在iOS應用中實現“后退”操作：

在某些情況下，Android應用程序中給出了類似后退的操作，您可以通過該操作進入前一個標簽。但是，最常見和最簡單的方法是使用導航欄中的后退按鈕（Android 10中現在是可選的）。

iOS和Android中的按鈕風格最主要的設計區別在于，iOS中的按鈕遵循扁平化的設計模式，不帶陰影、支持標題大小寫。Android遵循Material Design，帶陰影且字母大寫。

另一個比較重要的按鈕是Floating action button（FAB行動呼吁按鈕）。例如安卓系統中Gmail的compose按鈕，iOS系統中社交媒體應用的新建文章按鈕。

兩種系統都使用8dp的網格來構建屏幕結構，而最常見的邊框是16dp。

在開發移動應用程序時，以預定義的尺寸設計圖標是非常關鍵的。這里有一個表，描述了所有的測量。

這些表格一開始可能會讓人有點不知所措，但是如果你知道基本尺寸，并且能夠使用倍數進行檢查和導出，會發現這并不復雜。

多年來，蘋果一直是Helvetica Neue字體的粉絲，然而在2015年，蘋果開始使用San Francisco，它更節省空間，非常適合手機、臺式機和iOS Watch使用。

Android系統，一直使用Roboto作為標準系統字體。在可預見的未來，谷歌也沒有計劃改變這一深受喜愛的元素。

控件設計包含搜索、CTA按鈕、選擇控件和標簽等元素。每一個都滿足了這樣或那樣的目的，讓我們來看看他們的位置。

搜索功能對于兩個平臺來說都非常重要，蘋果最近還在iMessage中加入了 "搜索欄 "。

在蘋果中，搜索選項有兩種類型--突出和隱藏。通常情況下，搜索圖標會顯示在上邊的選項卡上，而有時需要從上到下拖動屏幕才能顯示搜索欄。此外，如果要取消搜索查詢，可以按 "取消"，如果要清除，可以用 "X"。

在安卓系統中，沒有隱藏的搜索欄，你總能在上層標簽中找到一個。如果要取消搜索，只需點擊"←"圖標即可，如果要清除查詢，則和iOS中的一樣。

浮動的動作按鈕（FAB）在Android中充當主要行動按鈕，可以出現在頂部應用欄或一些組件的邊緣。而iOS應用中的主要行動按鈕總是出現在頁面的右上角。

不過也有一些例外，少數iOS會在底部工具欄顯示CTA，而Android則在上部工具欄顯示。

如果需要顯示一些選項，可以在iOS平臺上使用選取器控件，選取器一般出現在底部。

對于在Android平臺上顯示很少的選項，通常使用一個出現在原地的下拉菜單，或者一個出現在中心的模態對話框，使用模態框時應用背景變暗。

據觀察，iOS系統并沒有一個視覺上類似于 "標簽"的控件。它使用的是一個分段的按鈕。Android使用了"扁平化設計的tab"來實現同樣的效果。

卡片是圖片、文字、視頻的集合，還包括按鈕和評論。

在iOS中，卡片的特點是無陰影、全寬、無圓角。而在安卓系統中，卡片的設計有陰影、溝槽、圓角等功能。

安卓系統的提醒采用的是扁平化的按鈕樣式，具體尺寸可以在材質設計指南中找到。操作按鈕被放置在提醒的右下角。這些 "按鈕 "完全以文字為主（全大寫），讓用戶更容易理解。

至于iOS系統的提醒，則是用分割線隔開。它們基本采用句子或標題的形式，在獨立的區塊中呈現。它們被放置在彈出窗口的中心。

本文涵蓋了iOS和Android所有的初步差異，希望對你有所幫助，而設計一個iOS或Android的移動應用，總是有迭代的準則，所以，一定要保持信息的更新，及時調整自己的產品設計。

Q. 為什么iOS和Android上的應用看起來不一樣？

品牌和意識形態的不同，已經波及到他們的操作系統的運作方式。兩個平臺的UI設計已經成為品牌的符號化。

Q. 如何設計一個原生應用？

在設計原生應用時，必須始終遵守iOS UI應用設計指南和Material設計指南。這樣才能使應用與它所要針對的平臺同步。另外，這些平臺有不同的要求，所以你的應用必須滿足它們才能在應用商店上發布。

Q. iOS比Android更方便用戶使用嗎？

這個問題的答案是純主觀的。它是基于用戶的個人偏好。有些人可能會覺得iOS更實用，而有些人則在各方面都偏愛Android。

Android 平臺設計規范有哪些

眾所周知，安卓系統是開源的，國內又有超多的手機廠商，小米、魅族、華為、oppo、三星等，每一個品牌有屬于自己的UI設計規范，但是我們主要分析UI界面尺寸規范。

1、字體

安卓系統中文采用的是思源黑體，英文字體為robot字體。

只使用偶數單位 24 pt，28 pt，36 pt等字體大小

2、mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi、dp、px到底是什么意思？

講圖標之前先來分析一下一排英文的意思：

mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi都是表示的屏幕密度大小，依次數值越大，其分辨率越高。常用的是xxhdpi和xxxhdpi。

dp是安卓系統專用的長度單位，設備獨立像素的意思。不同設備有不同的顯示效果,這個和設備硬件有關。多為圖標使用，文字則用sp(放大像素)，主要用于字體顯示best for textsize。

px是像素的意思， 不同設備顯示效果相同。

安卓各屏幕密度關系如下：

3、圖標

不同手機品牌的圖標的標志是不一樣的，對應不同大小屏幕的尺寸如下：

系統圖標的尺寸：

快捷圖標的尺寸：

應用圖標的尺寸：

4、應用欄的尺寸

從左到右依次是：① 應用欄高度：56dp；應用欄左右內邊距為16dp；應用欄圖標上下左內邊距為16dp；應用欄標題左內邊距為72dp；應用欄標題下邊距：20dp；

②應用欄高度為128dp；

③操作欄高度為56dp；標題欄高度：80dp；標題欄底部內邊距：8dp；描述區域高度：72dp；描述區底部內邊距：16dp。

5、列表高度

垂直邊框、水平外邊距、邊框左右外邊距各16dp；帶有圖標或者頭像的內容有72dp的左邊距。

垂直邊距

①狀態欄：24dp；②工具欄：56dp；③子標題：48dp；④列表項：72dp

垂直邊框、水平外邊距、邊框左右外邊距各16dp；帶有圖標或者頭像的內容有72dp的左邊距。

垂直邊距

①狀態欄：24dp；②工具欄：56dp；③標題和列表項：48dp；④子標題：48dp；⑤內容區域間距離為8dp

6、切圖

上周我們講到iPhone 6與iPhone 6 Plus約是1.5的關系，而xhdpi的Android手機屏幕與xxdpi的屏幕剛好是1.5倍的關系，所以iPhone 6 Plus和xxhdip也可以共用一套切圖，掌握好尺寸關系，能讓工作變得簡單很多。

7、界面適配

安卓多屏幕支持的基礎是它能夠管理應用程序的布局和位圖可繪制對象的渲染以適當的方式對當前屏幕配置的能力。該系統處理的大部分工作由布局縮放以適合屏幕尺寸/密度和縮放位圖可繪制在屏幕密度正確呈現您的應用程序在每個屏幕的配置，來優化用戶界面設計，帶來更良好的用戶體驗。

如何做到安卓界面適配呢？大家一定要很清楚的了解分辨率、屏幕大小、密度的關系；明白實際密度和系統密度的關系，dp、sp、px的區別；明白dp與px的轉換。這里不做過多闡述，后期寫一篇具體的~

安卓的界面規范就講到這里，要明白設計界面規范的意義是確保設計的統一性與合理性，規范維護的是項目的統一，為了項目利益最大化，高效化。所以作為UI設計師的我們，如果一點設計規范不遵守，全靠自己想當然，那就別發給前端人員啦，他也看不懂。

移動端設計必學（Android設計規范）

◆組件最小間隔建議為8dp或10dp。排版/文字最小間隔建議為4dp?;

◆組件尺寸建議能被4整除;

◆組件尺寸建議為偶數(單數容易出現鋸齒)。

觸摸式UI組件通常使用48dp作為基準單位。

◆48dp轉換為物理尺寸大約9mm左右。這是一個用戶手指能夠準確舒服觸摸的最小寸。

◆48dp指組件最小實際尺寸也指最小觸摸區域

◆狀態欄: 24dp

◆操作欄: 44/48dp

側邊導航: 286 / 304dp

◆懸浮操作按鈕: 56dp

◆操作欄+TAB: 36+33dp / 44+ 40dp

◆底欄: 44/48dp

屏幕水平外邊距,尺寸建議為: 6dp、8dp、16dp。

操作欄/?App?Bar?:可放置工具欄,顯示應用的LOGO、主標題、導航、菜單以及功能等。

工具欄/Tool?Bar?:?Android5.0推出的Material?Design風格導航控件,用于取代Action?Bar控件。相比Action?Bar?,?ToolBar在樣式、布局、運用上更靈活:?Actionbar一定要固定在Activity頂部?，ToolBar可以放到界面的任意位置;有更多的定制修改屬性:

側邊導航/?Side?Nav?:左側導航和右側導航可固定顯示,也可通過側滑顯示,覆蓋在應用上。左側導航主要用于導航菜單或重要信息顯示,右側導航主要顯示二級擴展內容及相關信息。

底欄/?Bottom?Bar?:用于展示最核心、最重要的功能、導航,方便用戶快速

切換,也是用戶單手操作最舒適的區域。

◆Android程序開發統- 使用虛擬尺寸單位: dp/dip. sp

? dp/ dip :用于Android元素尺寸,如按鈕、導航尺寸。

◆sp :用于Android字體大小尺寸。

◆按Android開發原則,文字的尺寸一-律用sp單位,非文字的尺寸一律使用dp單位。

? 例如textSize= "14sp" 、layout height= "40dp" 。

◆dp= dip= sp

◆px與dp單位的轉換與ppi有直接關系

◆ppi指每英寸所擁有的像素數/每英寸像素。

屏幕擁有像素的總數以及屏幕水平(寬)和垂直(高)方向的像素數量。單位為像素。像素/px是組成屏幕圖像的最小點, -個相對大小單位,同屏幕里越小越密越清晰。

ppi指每英寸所擁有的像素數/每英寸像素。像素密度越高,代表屏幕圖像顯示越清晰。

dpi平面設計/印刷計數單位,指每英寸所能印刷出來的網點數。衡量打印機打印精度的主要參數之一，,值越大,表明打印機的打印精度越高。

用戶需求、體驗研究

信息架構、操作流程、頁面交互設計產品原型圖輸出,推進UI落地

交互說明文檔輸出,推進前端落地產品可用性測試,優化改進

當你拿的手機距離你約25-?30厘米,如果手機pp達到300以上,你的眼睛將無法分辨出像素點。這就是蘋果提出的視網膜屏幕。

顯示分辨率:屏幕擁有像素的總數以及屏幕水平(寬)和垂直(高)方向的像素數量。單位為像素。

ppi?:屏幕像素密度,每英寸所擁有的像素數/每英寸像素

ppi?=?dpi

◆逗號不排在最左側

◆左對齊優先右對齊

標題越重要、級別越大顏色越深、越突出

◆字體設計有層次,有主次

◆正文行寬建議不超過320dp

◆dp/pt與px的裝換與乃配

◆Android手機竝用結杓

◆Android基本布局入冂

◆Android文本排版入冂

網頁名稱：android應用設計,安卓應用設計與開發
文章出自：http://m.newbst.com/article24/dsighce.html

成都網站建設公司_創新互聯，為您提供微信小程序、面包屑導航、服務器托管、商城網站、動態網站、App設計

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯