新聞動態(tài)
用文字傳播思想
用行動感動自己
通業(yè)股份
中集集團
如果您是設(shè)計專業(yè)的學(xué)生或初級設(shè)計師，并且您即將深入研究您的第一個移動項目，那么這里有一些指導(dǎo)，說明在為這兩個平臺調(diào)整移動設(shè)計時要記住什么。
想一想 2009 年你的第一部智能手機上的應(yīng)用程序。擬物圖標(biāo)、漸變按鈕和背景紋理？還記得 Android 手機上的深色背景和充滿活力的字體嗎？
我相信你能分辨出 2009 年和 2022年移動應(yīng)用程序設(shè)計之間的區(qū)別。但你真的能指出今天 iOS 和 Android UI 設(shè)計之間的巨大差異嗎？盡管如今的移動界面清晰且用戶友好，但扁平化的設(shè)計方法使所有移動平臺樣式看起來都非常相似。
多平臺移動設(shè)計的總體目標(biāo)是實現(xiàn)品牌一致性并與特定平臺的約定保持一致。但是，真正確?？缙脚_版本、制造商、屏幕尺寸和密度的樣式和布局一致性的唯一方法是使用自定義 UI 組件。在進行定制時，您總是冒著創(chuàng)建用戶感覺不“在家”的風(fēng)險。
因此，這里對平臺進行了簡要比較，這將幫助您決定使用標(biāo)準(zhǔn)組件設(shè)計還是自定義組件設(shè)計。
材料設(shè)計為 UI 層使用不同的陰影樣式。陰影值取決于標(biāo)記特定 UI 元素重要性的 Z 軸。iOS 設(shè)計使用漸變、背景模糊和半透明顏色疊加來實現(xiàn)相同的層次結(jié)構(gòu)。
相反，iOS 的調(diào)色板簡單而充滿活力。常見的 UI 元素，如列表項、條形、背景等，大多以灰色、黑色或白色的陰影呈現(xiàn)，而鮮艷的顏色則用于圖標(biāo)、按鈕、鏈接和其他強調(diào)色。
重要的是要記住，在 Material Design 中，標(biāo)題和文本在屏幕上大多是左對齊的，尤其是在導(dǎo)航元素方面。在為 iOS 設(shè)計時，您應(yīng)該保持操作按鈕和較小的標(biāo)題居中，而標(biāo)題、副標(biāo)題和正文可以左對齊。
Material 動畫風(fēng)格是紙張分層哲學(xué)的產(chǎn)物，運動風(fēng)格包含大量的漣漪效果和戲劇性的形狀擴展，而 iOS 動畫則更加微妙和自然。
有許多使用抽屜的 iOS 應(yīng)用程序。然而，iOS 抽屜沒有原生組件或設(shè)計指南，因為推薦的導(dǎo)航解決方案是原生標(biāo)簽欄。
iOS 設(shè)計理念始終把內(nèi)容放在首位，很少隱藏任何東西。原生標(biāo)簽欄使用戶能夠在主要內(nèi)容之間輕松切換，并鼓勵用戶探索應(yīng)用程序。標(biāo)簽欄始終存在，并且很容易在導(dǎo)航的更高和更深級別之間切換。
在 iOS 應(yīng)用程序中，即使您可以在選項卡欄中的選項卡之間切換，導(dǎo)航較低級別的每個屏幕都應(yīng)該有一個返回按鈕，因為這是您可以向上導(dǎo)航根的唯一明顯方式。
想一想 2009 年你的第一部智能手機上的應(yīng)用程序。擬物圖標(biāo)、漸變按鈕和背景紋理？還記得 Android 手機上的深色背景和充滿活力的字體嗎？
我相信你能分辨出 2009 年和 2022年移動應(yīng)用程序設(shè)計之間的區(qū)別。但你真的能指出今天 iOS 和 Android UI 設(shè)計之間的巨大差異嗎？盡管如今的移動界面清晰且用戶友好，但扁平化的設(shè)計方法使所有移動平臺樣式看起來都非常相似。
多平臺移動設(shè)計的總體目標(biāo)是實現(xiàn)品牌一致性并與特定平臺的約定保持一致。但是，真正確?？缙脚_版本、制造商、屏幕尺寸和密度的樣式和布局一致性的唯一方法是使用自定義 UI 組件。在進行定制時，您總是冒著創(chuàng)建用戶感覺不“在家”的風(fēng)險。
因此，這里對平臺進行了簡要比較，這將幫助您決定使用標(biāo)準(zhǔn)組件設(shè)計還是自定義組件設(shè)計。
風(fēng)格哲學(xué)
Google Material Design 更偏向于可定制和流暢的界面，而 iOS 一直更偏向于清晰直觀的界面。在他們的核心理念中，你可以很容易地找到他們特定風(fēng)格特征的基礎(chǔ)。屏幕深度
使用應(yīng)用程序時，深度感至關(guān)重要。用戶需要關(guān)注對完成任務(wù)很重要的屏幕元素，例如按鈕、輸入字段和導(dǎo)航欄。材料設(shè)計為 UI 層使用不同的陰影樣式。陰影值取決于標(biāo)記特定 UI 元素重要性的 Z 軸。iOS 設(shè)計使用漸變、背景模糊和半透明顏色疊加來實現(xiàn)相同的層次結(jié)構(gòu)。
顏色
材料設(shè)計調(diào)色板更接近 CMYK 模型而不是 RGB。它包括各種較深或較淺的基本顏色?；绢伾饕糜?UI 重音，例如操作、項目標(biāo)題、圖標(biāo)等。相同顏色的陰影用于標(biāo)簽欄、抽屜和其他導(dǎo)航元素。相反，iOS 的調(diào)色板簡單而充滿活力。常見的 UI 元素，如列表項、條形、背景等，大多以灰色、黑色或白色的陰影呈現(xiàn)，而鮮艷的顏色則用于圖標(biāo)、按鈕、鏈接和其他強調(diào)色。
排版
iOS 和 Android 的排版層次結(jié)構(gòu)有所不同。顯示和正文字體大小的巨大對比使內(nèi)容在兩個平臺上都顯得更加生動和有趣。在典型的 Android 屏幕上，對比度是通過使用更大的尺寸和更薄的字體來實現(xiàn)的。在 iOS 11 中，通過帶有大而加粗的標(biāo)題和小標(biāo)題的權(quán)重層次結(jié)構(gòu)，對比度更加明顯。重要的是要記住，在 Material Design 中，標(biāo)題和文本在屏幕上大多是左對齊的，尤其是在導(dǎo)航元素方面。在為 iOS 設(shè)計時，您應(yīng)該保持操作按鈕和較小的標(biāo)題居中，而標(biāo)題、副標(biāo)題和正文可以左對齊。
圖標(biāo)樣式
Material 設(shè)計鼓勵使用扁平圖標(biāo)，而 iOS 設(shè)計更喜歡細(xì)的 1px 或 2px 線條圖標(biāo)。這是一個很小但很重要的樣式細(xì)節(jié)，在為另一個移動平臺調(diào)整應(yīng)用程序時應(yīng)該考慮。如果您的應(yīng)用具有特定的圖標(biāo)樣式，則您不一定要遵循此規(guī)則?？纯?iOS 11 中的新鎖屏，他們似乎正在擺脫只使用輪廓圖標(biāo)的方式。邊框
一個簡單的單像素筆劃重音在高分辨率 Android 設(shè)備上可能看起來很棒，但不要忘記 Android 設(shè)計應(yīng)該在大多數(shù)屏幕密度下都有效。在這些情況下，開發(fā)人員必須重新考慮設(shè)計元素并考慮應(yīng)用程序代碼中的不同情況。品牌推廣
品牌顏色及其色調(diào)的使用在 Material design 中更為占主導(dǎo)地位，而 iOS 指南建議使用更微妙的品牌方法。在 iOS 中，它應(yīng)該只在 UI 元素中可見，例如圖標(biāo)、顯示圖形、按鈕或鏈接。應(yīng)用程序圖標(biāo)
新的 Android 應(yīng)用程序圖標(biāo)是自適應(yīng)的，這意味著它們旨在適應(yīng)不同設(shè)備的不同蒙版形狀（圓形、圓角矩形……）。iOS 應(yīng)用程序圖標(biāo)仍僅限于圓角矩形。動畫和過渡
UI 動畫應(yīng)該只在與用戶行為相關(guān)時使用，并且它們應(yīng)該讓人感覺不顯眼。Material 動畫風(fēng)格是紙張分層哲學(xué)的產(chǎn)物，運動風(fēng)格包含大量的漣漪效果和戲劇性的形狀擴展，而 iOS 動畫則更加微妙和自然。
導(dǎo)航
清晰自然的導(dǎo)航保證了健康的信息架構(gòu)。除了風(fēng)格差異之外，了解導(dǎo)航系統(tǒng)的基本特征也很重要。抽屜
Material Design 提供了很多隱藏內(nèi)容的組件，讓用戶更容易找到最相關(guān)的功能。例如，如果您有很多內(nèi)容，您可以隨時使用抽屜。在抽屜外面展示關(guān)鍵功能，把不那么重要的東西放在抽屜里。有許多使用抽屜的 iOS 應(yīng)用程序。然而，iOS 抽屜沒有原生組件或設(shè)計指南，因為推薦的導(dǎo)航解決方案是原生標(biāo)簽欄。
標(biāo)簽欄
在 Android 應(yīng)用中，主屏幕的底部導(dǎo)航欄僅在頂級導(dǎo)航中可見，因此不要從導(dǎo)航根目錄走得太深。iOS 設(shè)計理念始終把內(nèi)容放在首位，很少隱藏任何東西。原生標(biāo)簽欄使用戶能夠在主要內(nèi)容之間輕松切換，并鼓勵用戶探索應(yīng)用程序。標(biāo)簽欄始終存在，并且很容易在導(dǎo)航的更高和更深級別之間切換。
返回鍵
Android 應(yīng)用程序同時具有向上按鈕（集成在應(yīng)用程序中）和后退按鈕（本機組件）。向上按鈕可讓您備份導(dǎo)航根目錄。后退按鈕通常會將您帶回與向上按鈕相同的屏幕，除非您之前已從一個應(yīng)用程序切換到另一個應(yīng)用程序。在這種情況下，后退按鈕將帶您返回上一個應(yīng)用程序。在 iOS 應(yīng)用程序中，即使您可以在選項卡欄中的選項卡之間切換，導(dǎo)航較低級別的每個屏幕都應(yīng)該有一個返回按鈕，因為這是您可以向上導(dǎo)航根的唯一明顯方式。
