iOS 11 關於 iPhoneX 的尺寸與版面
每次 Apple 發表會結束,出現新版的 macOS 或 iOS 時,我都很想仰天大喊「殺~人~喔~」。這次 iOS 11 當然有改新東西,但變化最大的是 iPhoneX 。
發表會一結束就跑去看 Guidelines 是 UI 設計師必備行為。
iOS 解析度製圖設定
有人跟我提到:「iOS 在 psd 設計時解析度建議設為 144,這樣文字大小才會是正確的」。當年 iPhone4 剛出的某個晚上我和老公躺在床上聊 iOS 變 2x 了會遇到什麼狀況。聊著聊著兩人就槓上吵架了,也不管當時是凌晨兩點,通通爬起來開燈開電腦,一個翻出 Photoshop、一個翻出 Xcode,打字、設定字型字級、拿出 iPhone 設定一樣的字型字級。之後,我的製圖習慣一直使用 72 dpi。
iOS 支援向量切圖
起因是這一篇 iPhone 6 / 6 Plus 出现后,如何改进工作流以实现一份设计稿支持多个尺寸? 1F 和 2F 的回答。我原本的作法是 1F 的方式:PS + Slicy。不過 2F 的回答很有意思:iOS 支援向量了喔!出 PDF 就好了。
iPhone 6 及 Plus 製圖建議
iPhone 6 和 Plus 新機一發表,群裡就有人跑來哀號說老闆叫他準備 iPhone6 的適配,可現在什麼文檔都沒有完整啊!在很多細節不明的情況下,我只能建議這種最保險安全的作法:做 @1x,放大給 @2x 和 @3x 用。以下情境預設為做一套 Mockup 要切出各種尺寸的圖。
iOS、Android 字級單位
「這是靠我自己摸索出來的喔!是拿 App 截圖進 Photoshop 辛辛苦苦比對所量出來的尺寸。」這位 UI 先生/小姐,你知道世界上有 Guideline 這種文件嗎?「比起問別人,自己摸索出來的才記得深刻嘛!」你知道世界上有工程師這號人物嗎?浪費一堆時間在 PS 量半天為了什麼?文件上寫得一清二楚。字級要用是 pt 或是 px 轉頭問問 RD 立刻就有答案了。
iOS Guideline 怎麼看?(2)
iOS Human Interface Guidelines 第二章是設計策略 Design Strategies ,主要講畫面、使用者操作、反應等等的一致性與注意事項。在閱讀這個章節之前,建議把 十大易用性原則 先看過一遍、對易用性有粗淺概念後會更容易理解為什麼 Guideline 會這樣寫。
iOS Guideline 怎麼看?(1)
這是給 UI 看的教學。發現太多人不看Guideline…基礎問題問了又問,明明官方文件擺在那。就算英文看不懂,Google 打下去對岸有很多翻譯成簡中版的。最最少留意一下尺寸吧?(這次的 iOS7 官方文件省略很多沒寫到、建議回頭去看看 iOS6 的Guideline,兩份加起來比較紮實。)
直式與橫式螢幕設計的挑戰與解決方案
每次看到使用者拿著手機,橫豎切換自如,我都在想:「他們知道這背後的設計巧思嗎?」
Portrait 和 Landscape。
螢幕方向不只是視覺上的轉變,更是使用者體驗的關鍵。