中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

編輯導語：雖然國內軟件的iPad用戶占比不大，但依然存在著橫屏適配的需求。本文作者講述了自己做iPad橫屏適配的背景，并對競品的適配方式進行了分析研究，用自己的親身經歷提供了參考，推薦對ipad橫屏適配感興趣的童鞋閱讀。

一、背景

在我參與的一款資料查詢 App 中，對 iPad 只支持豎屏以手機 UI 尺寸拉伸，每個季度都有用戶反饋希望適配 iPad 橫屏。經過詢問用戶發現，因為 iPad mini 尺寸剛好可以放在工作服口袋中，隨時拿出來使用，而 iPad 屏幕遠比手機大，瀏覽資料視野更大更舒服。

但另外一方面，后臺數據顯示當前 iPad 用戶占比只有 1%，用戶呼聲夠不上星星之火，不足以燎原。先別談說服團隊做 iPad 橫屏適配，連說服自己都難。本來以為這事就像水中投石，水波消散就沒有下文了。直到有一天，同樣是資深用戶的高管自己拿著 iPad 裝上我們的 App 用了幾天，終于忍不了，開始推動 iPad 橫屏適配。

二、參考

我們肯定不是第一個做 iPad 橫屏適配的，但在網上搜了一圈，別說橫屏適配，連 iPad 界面設計的文章都很少，下面 3 篇算不錯的。這也是我決定寫下本文的原因，為后來者提供經驗，少踩坑。

1. 《利用好 iPad 的大屏幕 —— 如何為 iPadOS 14 設計 app？》，https://steppark.net/15942969497015.html
2. 《iPad 交互設計探索系列：iPad 適用產品篇》，https://www.jianshu.com/p/65211fddefb9
3. 《iPad 交互設計探索系列：iPad 導航設計篇》，https://www.jianshu.com/p/0c8e315d39d4

三、研究

沒得經驗參考就只能先從競品分析開始了。經過對 iOS 系統應用、微信、QQ、微信閱讀、得到、豆瓣、淘寶和有道詞典的分析，我和同事總結成 5 種橫屏適配模式。

1. 內容響應式

典型 App：iOS 應用商店

特征：標題欄和 Tabbar 通欄拉伸，內容區根據寬度向右響應式布局。

適用場景：全部場景。

評價：靈活性和用戶體驗都很好，但設計和開發成本很大。

2. 左右分欄

典型 App：iOS 設置、淘寶、微信、QQ

特征：左右分開顯示，左邊通常固定顯示首頁或者目錄導航。右側根據左側選擇顯示對應的詳情內容。

適用場景：頻繁需要使用導航切換內容。

評價：用戶體驗適中，合理的利用橫屏更大地展示更多的內容。設計成本小，需額外設計一個右側默認為空的情況。開發成本要看是否改程序架構，相當于把手機兩個手機界面合并成一個屏幕，可能有些程序架構很難這么修改。

3. 按豎屏寬度顯示

典型 App：微信閱讀

特征：標題欄和 Tabbar 通欄拉伸，內容直接按豎屏的寬度顯示。

適用場景：全部場景。

評價：用戶體驗適中，設計與開發成本小，大多數產品采用此模式，但是沒有更好的展現橫屏寬屏的優勢。

4. 全屏通欄拉伸

典型 App：豆瓣

特征：橫屏為全屏通欄拉伸，所有元素與豎屏一致。

適用場景：全部場景。

評價：設計和開發成本最小，但是相當于沒有適配。用戶體驗較差，橫屏情況下內容集中，左側右側很空，或者被拉得很長，閱讀體驗較差。

5. 混合模式

當然也不是所有 App 都采用單一的模式。比如微信閱讀，在其他頁面是按豎屏寬度顯示。但到了圖書閱讀界面，則是左右分欄充分利用 iPad 大屏幕展現內容。

以上競品分析所有截圖我們都保存在 Figma 中，有需要的讀者可前往獲取。

鏈接：https://www.figma.com/community/file/1071850659054902697/iPad-橫屏適配競品分析

四、執行

非常遺憾的是雖然高管牽頭做適配，但開發資源確實有限。不能為了設計師邀功拿業績就從頭把 iOS App 重構一遍，因此我們決定用最少的資源做最核心的優化。

適配計劃分為 2 期。第 1 期將所有頁面用按豎屏寬度顯示進行橫屏適配。第 2 期挑選核心頁面用內容響應式或左右分欄進行優化。

1. 先開發再驗收

在第 1 期我們就踩坑了，按照原來的工作流程，我們將所有的 iPad 橫屏頁面做好線框圖、再輸出所有視覺效果圖。雖然都是線上頁面不用重新設計，只需要拉伸畫面或者調整間距，但所有線上頁面也是一個不小的工作量。

就在進行過程中，iOS 工程師就皺著眉頭來提議，由于代碼架構和資源所限，設計師如果調整的視覺效果圖未必能 100% 實現。不如反過來，讓他先把所有頁面強行橫屏，再由設計師走查發現問題進行修改，這樣節省時間效果也可控。

可見，不同的項目類型可以采取不同的工作流程。 iPad 橫屏適配項目流程和常規工作流程剛好相反，以往是先設計再開發，改成先開發再走查，節省設計師產出效果圖時間，也保障最終實現效果。

2. 核心場景決定核心頁面

在第 2 期挑選核心頁面時，我也犯了錯誤。最開始我覺得核心是臉面，因此挑選 Tabbar 導航的首頁、個人中心等用戶一打開 App 就看得到的頁面進行優化。但實際上用戶真正的核心使用場景是在詳情頁查閱資料，這才是真正的核心頁面。

在得到主管糾正后，我們轉而開始為資料閱讀頁面提供左內容右目錄的布局，便于用戶方便地在長文中精確定位想讀的內容。

2 期計劃并非適配的終結，隨著 App 功能的迭代，此后老界面修改和新界面設計需要考慮到 iPad 橫屏的適配問題，就成為了日常工作的內容了。

五、總結

按照以往的項目總結，最后應該匯報項目數據結果。但由于 iPad 用戶本身可憐的占比，即使我們官方公眾號推文宣布適配 iPad 橫屏后，也沒有 iPad 用戶站出來點贊，而是又引發出使用華為、小米等安卓 Pad 的用戶，要求也適配。

考慮到不同的安卓品牌適配方式不一樣，而且安卓廠商自己又有平行世界等通用兼容方案，我們就沒再繼續參與了。

雖然沒有外部用戶反饋，但公司內部同事和開發團隊使用后確實感覺很棒。所以我覺得這次適配項目真正值得思考的是：如果一個需求用戶反饋很少，也沒有數據支撐，但對體驗影響很大，如何推動團隊進行優化呢？

作者：龍爪槐守望者，微信公眾號：龍爪槐守望者

本文由 @龍爪槐守望者 原創發布于人人都是產品經理。未經許可，禁止轉載。

題圖來自 Unsplash，基于 CC0 協議