手機/平板旋轉時，如何設計才能「流暢無形、交互視覺雙升級」？譯自 Smashing Magazine 干貨長文，建立設備方向設計的完整知識體系，強烈建議收藏學習。

核心認知：方向轉換 = 第二顯示畫面機會

內嵌加速器觸發縱橫切換，無需點按鈕即可呈現新版面。但設計挑戰在於：思路縝密確保用戶不唐突、轉換無感，需理解整體環境關係。

四大方向設計分類

類型	定義	典型案例
流暢類	界面單純適配新方向尺寸佈局變化	Skype 圖標位置移動；Pocket 相同版式不同寬度
延展類	根據方向增減版面元素	IMDb iPad 橫向左側增加片單列表(縱向需點按鈕顯示)
互補類	轉向觸發補充信息輔助屏	金融 App 縱向主視圖 → 橫向補充視覺圖表
延續類	轉向獲得二級界面，保留原功能	YouTube 縱向瀏覽 → 橫向全屏播放；智能遙控橫向顯示節目單保留換台功能

反面教材：CardMunch 橫向轉盤相冊 — 缺乏視覺線索、無編輯入口、用戶放棄旋轉

關鍵設計決策

1. 慎重考慮默認方向

• iPad 默認縱向，Android/Win8/BlackBerry 平板默認橫向。
• 首選方向必須匹配設備默認模式與功能。
  反例：Above & Beyond 電子書，關鍵互動元素(回主菜單)僅橫向有，縱向無，用戶迷惑。

2. 理解前後關聯 — 場景化設計

• 案例：廚房 iPad 食譜 App。
  縱向 = 翻頁瀏覽/閱讀食譜詳情；
  橫向 = 料理模式(大按鈕/分步說明/防熄屏/揮手翻頁解決髒手問題)。
• 理解使用環境(廚房/做飯)，方向轉換才能真正服務用戶。

3. 轉向視覺線索 — 讓隱藏功能可被發現

• 經典反例：iPhone 計算器橫向變科學計算器，多數用戶不知情。
• 三大線索模式：
  ① 標題欄鎖定：頂部標題欄固定默認位置，微妙提示轉動設備查看；
  ② 轉換開關圖標：長期顯示標準化旋轉圖標，引導用戶從點擊轉向旋轉操作，最終達到無需開關直覺旋轉；
  ③ Coach Marks：首次啟動教程介紹第二界面存在。

方向設計不是炫技，而是基於設備屬性、使用場景、用戶心智模型的系統性決策。掌握四分類、守住默認方向、深耕場景關聯、設計可發現線索，才能創造真正「轉換於無形」的卓越體驗。