iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 5
0
Mobile Development

[初探] 用 SwiftUI - 打造一個自助洗衣應用系列 第 5

第五日、用SwiftUI 打造自助洗衣應用-圖示與icon篇

ICON

首先我們先來提到icon
我們可以在apple icon 裡面找到他的規範
icon與圖標規範

Icon 原則

在設計icon時,保持著以下的原則:

  • 簡單並具有主題性
  • 背景不透明
  • 保持四方(因為它會自動切圓角)
  • 避免使用螢幕截圖作為icon
  • 尊重智慧財產權

Icon 屬性規範

  • 格式以PNG為主
  • 背景不透明保持正方形
  • 大小的話依照裝置規範,這裡是以iphone為主並因為,適應不同前後的iphone機種,需切圖為@2x@3x:
  • 180px × 180px = @3x
  • 120px × 120px = @2x(另外apple watch也是@2x)

接著提到設備上不同圖標上的尺寸:

Spotlight

120px × 120px (40pt × 40pt @3x)
80px × 80px (40pt × 40pt @2x)

設定圖標

87px × 87px (29pt × 29pt @3x)
58px × 58px (29pt × 29pt @2x)

通知圖標

60px × 60px (20pt × 20pt @3x)
40px × 40px (20pt × 20pt @2x)

Icon 工具

一鍵搞定
這個是其中之一,在設計時很好用的工具,你可以把製作好的 app icon ,丟進 Assets.xcassets 裡面

接著,我們會再提到操作與其他工具的使用


上一篇
第四日、用SwiftUI 打造自助洗衣應用-介面簡單介紹篇
下一篇
第六日、用SwiftUI 打造自助洗衣應用-圖示與icon工具篇
系列文
[初探] 用 SwiftUI - 打造一個自助洗衣應用30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言