sketch 快速簡短筆記
sketch 是一個用來製作 ui, mockup 好用的工具,他的強項在於 ui, mockup 的使用上,所以跟 photoshop 的比較,大概就是 JavaScript 之於 Java, 熱狗跟狗之間的關係。
這邊做個簡短筆記,將自己搜尋到的東西推薦給大家。
plugin 管理工具
目前已經推出 ui 介面,可以讓使用者方便透過視窗介面查找,安裝,移除套件(記得安裝移除之後要重新啟動 sketch)推薦 plugin
- Content-generator-sketch-plugin - 自動產生內文,圖片,假資料等假假的東西
- Dynamic Button Symbol Detacher - 動態調整 button 的寬度以及 padding 的自動化工具
- marketch - 用來自動生成標記工具,如果你沒有用 zeplin, 還蠻推薦這套的
- Sketch Measure - 設計完工之後,自動標上間距,色碼
- Sketch mirro - 將製作完成的 app mockup 透過 iphone 進行預覽
推薦外掛服務
特別增開一個外掛服務專區,上面的 plugin 主要都是針對單機,或者將資料產出,但是線上有許多好用的服務已經與 sketch app 整合在一起,讓開發流程變的更為順暢,推薦大家可以試用一下這些好服務。PS. 如果大家有推薦的,歡迎也在底下留言給我。
- zeplin - 可以免開啟 sketch, 讓開發者直接看道色碼,間距,同時也可以在上面討論的好工具
- invision - 透過 sketch 製作完成的 mockup, 產出到線上,讓多方可以互動討論
快速入門資料
族繁不及備載,許多入門及快速教學在網路上其實都很多,這邊是自己一開始的時候,查到的資料,覺得還不錯,提供給大家。奇特招數 paparazzi 擷取資料
因為 Sketch 是一個向量圖形工具,資料是向量圖基本上皆可以匯入進行調整,所以可以透過 mac 上一套工具,『paparazzi』開啟網頁之後,將擷取到的向量網頁圖檔,匯入到 sketch (用拖拉的方式即可),超級方便。後記
Sketch 其實是一個很棒的工具,透過向量物件,加上 grouping 的概念,讓以往透過 photoshop 要用來建構 mockup, wireframe 的問題都被解決了,透過 sketch 提供了許多解決方案給網頁設計師,如果你還在觀望,記得下載 30 天試用版本看看,相信會解決你許多疑惑。但是,Sketch 還是無法取代 photoshop ,許多修圖,細緻度展現上,工具的使用上,兩者是沒辦法進行比較的,所以請不要再叫我 『XXX』
如果各位有任何推薦的資料,外掛,教學等,歡迎在底下留言給我,將會持續將資料補足,透過分享,讓這個社會更美好!
留言
張貼留言