'UI設計師來看iOS 13 隱祕的細節:系統組件·下'
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
最近在公司內分享到這段時,同事楊新坤提及一段有關Facebook的設計細節:
在2015年時,Facebook有一段時間也對帶性別剪影的圖標作了調整:原本男性剪影在前的圖標,且“男大女小”的好友圖標,被改成了女性剪影在前,並將男女的大小進行了統一。
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
最近在公司內分享到這段時,同事楊新坤提及一段有關Facebook的設計細節:
在2015年時,Facebook有一段時間也對帶性別剪影的圖標作了調整:原本男性剪影在前的圖標,且“男大女小”的好友圖標,被改成了女性剪影在前,並將男女的大小進行了統一。
而發起這一改動的,正是一位Facebook的女設計師 Caitlin Winner
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
最近在公司內分享到這段時,同事楊新坤提及一段有關Facebook的設計細節:
在2015年時,Facebook有一段時間也對帶性別剪影的圖標作了調整:原本男性剪影在前的圖標,且“男大女小”的好友圖標,被改成了女性剪影在前,並將男女的大小進行了統一。
而發起這一改動的,正是一位Facebook的女設計師 Caitlin Winner
她曾經就讀於女子學院的女性,這讓她很難忽略圖標中所代表的性別意義,她就想女性必須直處於“男性的陰影”中麼?於是他對Facebook的圖標作了上述的調整。並獲得認可,應用到公司的新產品以及更多的平臺之上。
不過對與這個改動,也有很多人認為Caitlin Winner的做法過於女權主義:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
最近在公司內分享到這段時,同事楊新坤提及一段有關Facebook的設計細節:
在2015年時,Facebook有一段時間也對帶性別剪影的圖標作了調整:原本男性剪影在前的圖標,且“男大女小”的好友圖標,被改成了女性剪影在前,並將男女的大小進行了統一。
而發起這一改動的,正是一位Facebook的女設計師 Caitlin Winner
她曾經就讀於女子學院的女性,這讓她很難忽略圖標中所代表的性別意義,她就想女性必須直處於“男性的陰影”中麼?於是他對Facebook的圖標作了上述的調整。並獲得認可,應用到公司的新產品以及更多的平臺之上。
不過對與這個改動,也有很多人認為Caitlin Winner的做法過於女權主義:
目前,Facebook當前的版本,也採用了去性別化的圖標的設計:
本次iOS 13全局細節調整較多,我將之分為兩部分進行闡述:
第一部分 - 全局組件:Switch、分段控件、Sheet彈窗、Context Menu等;(第一篇、第四篇)
第二部分 - 原生App:相機、Safari、短息、地圖等。(第二篇、第三篇)
本文繼續講述全局組件。
系統設置
以下是“設置”中相關模塊的設計變化:
1.屏幕時間
1.1 “今天、過去7天”兩處文案變成更加常見的“每天、每週”。減少文案帶來的歧義,比如過去我還和朋友討論,iOS 12中的“過去7天”是否包含“今天”...
1.2 新版iOS調整了“每天”、“每週”的排列順序。難道是使用“每週”的用戶佔比最大?
過去優先展示“每天”,而在iOS 13中,優先展示“每週”。
1.3 還有一個細節,新版屏幕時間支持左右切換時間:
如上圖所示:頁面上滑後,出現左右切換的浮層。
2. 圖標去投影
iOS 13控制中心去掉了“刪除”和“添加”兩處圖標的底部投影。圖形中間的加號、減號也由直角變圓角。
3.壁紙設置
過去壁紙設計界面底部,採用了吸底的矩形大按鈕。如下圖:
在iOS 13中變成了非吸底的“膠囊按鈕”。這樣的設計更加適合自帶圓角的全面屏,如下圖:
此外,像“靜止”、“透視”這類原本清晰的文字按鈕,變成抽象的圖標。如下圖:
在我看來,新圖標的含義著實不好理解。
誰能想到這個類似“放大”的小圖標居然表示透視?
4.視圖
操作路徑:設置→顯示與亮度→視圖
通過切換不同的視圖,可以調整手機分辨率(截屏可獲得不同分辨率的尺寸)。
我們可以把iOS中的視圖切換,看成是電腦端的分辨率調整。
分辨率低,則視覺層面圖像變大、分辨率高,則視覺層面圖像變小。
不過在此前版這個頁面設計的不是很好,用戶需要切換頁面,並細心對比不同頁面中的靜態圖片,才能察覺出兩種視圖模式下手機界面的差別。
我曾問過好幾個朋友,他們都不知道有這個功能。
Apple在iOS 13中對這個頁面做了重新設計:將兩種模式放在同一頁面中進行展示,並增加動效展示。如下圖:
新設計,有助於用戶更直觀的瞭解兩種視圖下手機界面的差別,從而選擇自己需要的視圖。
PS:下面附上各機型,標準視圖和放大視圖對應的分辨率:
控制中心
等了7年,iPhone終於可以和Android手機一樣,通過長按底部控制中心的Wifi和藍牙,進行快速鏈接或跳轉到對應設置頁。如下圖:
底部彈窗
此次系統彈窗可謂是大變樣,下面逐一說明:
1.佈局變化
最明顯的一個變化是,Apple在彈窗上放棄了使用多年的十字交互,改用列表進行展示。
我想這麼做主要是為了便於信息的直接展示。讓功能更好的觸達用戶。併為日後系統功能拓展做準備。
簡單來說,TV端很早就開始使用十字交互,旦如今越來越多的TV端放棄了十字交互,除了頂部分類導航外,都在儘可能減少橫滑,改成清一色的上下滑動。其中最主要的原因就是橫向的信息觸達率太低,而豎向的瀑布流便於用戶查看信息。
試想一下,如果你想查看AppStore榜單的前十名,你會選擇橫滑?還是點擊全部進入列表模式進行查看?
總之我都是進去列表模式進行查看。
所以在我看來,變成列表不僅更有助於信息展示(結合彈窗上拉變大),也便於Apple日後在彈窗中推廣新功能。
不過可惜的是,Apple在取消十字交互的同時,過去長按調整按鈕位置的功能也被取消了,如下圖:
好遺憾......目前,iOS 13只能通過”更多“和”編輯操作“調整按鈕位置。
2.文案調整
舊版中的”更多“按鈕,在新版中改為更加具體的”編輯操作“。
過去光看”更多“兩個字,以為點進去是更多功能入口,結果卻是進入了一個編輯操作頁面。真是一臉懵,嚇得我趕緊關閉返回上一頁。
雖然底部的更多發生了變化。但橫滑右側入口依舊是”更多“。
3.AirDorp摺疊
過去一打開彈窗,彈窗頂部AirDrop區域佔據了1/3彈窗的高度。點擊使用的話,自己想要隔空投送的設備一開始未必會加載出來,等後面加載出來,又未必出現在開始或結尾的位置。需要一直左右滑動查看等待需要連接的設備是否出現。
新版則將Airdrop變成一個普通的圖標入口,在用戶要使這個功能時,在調起一個彈窗頁面,專門展示所掃描到設備。這無疑解決了上述提到查看設備的問題,大大提高了操作效率。
4.左上角增加APP縮略圖
彈窗上滑後,以標題欄的形式常駐。對此,我的理解是,由於新版彈窗支持上滑,這樣一來多個APP都可能處於全屏彈窗的界面。如下圖:
此時如果缺少頂部的APP標識,那麼當用戶在多個APP中調起彈窗時,很難分辨當前所處的軟件。
5.底部取消按鈕
舊版彈窗底部有一個明顯的取消按鈕,而新版彈窗的因為採用Sheet彈窗*的形式,所以關閉按鈕轉移到了右上角。另外,新版彈窗還支持下拉關閉的操作,這樣一來也解決了關閉按鈕在頂部不易點擊的問題。
Tips:Sheet彈窗,我在《iOS 13:第一篇》中有做專門介紹。
三指交互
最後再說一下三指交互
在《第一篇》中提到,iOS 13中新增了一個三指菜單。只要用3個手指點擊屏幕,就可以呼出一個全新的菜單。用來完成:撤銷、剪切、複製、粘貼、重做這五個操作。
其實,用戶可以不呼出菜單就完成上述五種操作,分別是:
拷貝:三指捏合,可以快速拷貝;
剪切:連續三指捏合兩次,即可剪切;
粘貼:三指外擴,即可粘貼;
撤銷:三指向左輕掃,即可輕鬆撤銷;
重做:三指向右輕掃,即可重做;
講真,我看一次,就記住瞭如何快速拷貝,其他四個都沒記住......
也許不久之後,國內軟件上也會興起類似的多指交互,也未可知。讓我們拭目以待吧~
默認頭像
在《第一篇》中,我曾提及iOS 13中默認頭像的變化:
在iOS 12系統中,“默認頭像”都具有性別特徵。比如通訊錄的圖標,就是由一男一女的剪影組成。
在其他位置,比如:通訊錄詳情頁、短信列表、AppStore所用的默認頭像均為“男性”剪影。
而在iOS 13中,上述這些位置的頭像,都變成了去性別特徵的圓形頭像。如下圖:
當初我對此的理解是:Apple可以根據賬號中的性別設置,提供男/女兩套頭像,而是採用“無性別頭像”。我想這麼做也許是為了更好的照顧到“跨性別群體”的感受。
此前跨性別群體曾要求Apple在Emoji表情中增加“特殊人群”、“特殊家庭”和“彩虹旗”等標誌,這些眼下已出現在iOS 12.2的Emoji中。畢竟蘋果的CEO庫克,自己就是一位好同志。
最近在公司內分享到這段時,同事楊新坤提及一段有關Facebook的設計細節:
在2015年時,Facebook有一段時間也對帶性別剪影的圖標作了調整:原本男性剪影在前的圖標,且“男大女小”的好友圖標,被改成了女性剪影在前,並將男女的大小進行了統一。
而發起這一改動的,正是一位Facebook的女設計師 Caitlin Winner
她曾經就讀於女子學院的女性,這讓她很難忽略圖標中所代表的性別意義,她就想女性必須直處於“男性的陰影”中麼?於是他對Facebook的圖標作了上述的調整。並獲得認可,應用到公司的新產品以及更多的平臺之上。
不過對與這個改動,也有很多人認為Caitlin Winner的做法過於女權主義:
目前,Facebook當前的版本,也採用了去性別化的圖標的設計:
一勞永逸的解決了性別誰佔主導的爭議。如今蘋果也採用了相同的做法,弱化了APP中的性別特徵。
在這裡我相信有很多想要學習UI設計的朋友,我是一名從事了多年UI設計私人定製課程,今年年初我花了一個月整理了一份最適合2019年學習的學習乾貨及教程,從最基礎到,各種框架都有整理,送給每一位UI設計取的可以關注我並在後臺私信我:學習,即可免費獲取