編者按:據某團隊透露,自全司上下都配備Macbook后,設計部的同事們紛紛將Photoshop換成Sketch,改變過程折騰了相當一段時間,于是留下此文,教你如何從Photoshop遷移到Sketch,那些正準備轉移陣地的同學,節省時間就從這篇開始咯。
@Teambition :Sketch可以說是Photoshop最佳替代,而且比起Photoshop,它更側重于用戶界面的設計。雖然目前Sketch素材還是太少,不過我正在著手解決這個問題。
備注:通過分析甚至是重復使用他人的作品可以取得進步,然后開始創作你自己的作品。在學習的時候,重新想像正試圖解決的問題。學習他們的技巧,并它融入到自己的設計思考中去。
可以到BohemianCoding下載試用版。如果因為需要付費而錯過了這款應用,那是得不償失,特別是它還不貴,價格只有Photoshop的1/10。它能讓你的設計變得更加高效,一旦用上你絕對會愛上它。
遷移:我的圖標(My Icons)
作為一個用戶界面設計師,圖標是唯一一種不必每次都從頭開始的組件。圖標被存儲為SVG格式,這是是一種廣泛被使用的矢量格式,已經被越來越多地被用于css中,代替那種特定分辨率的內嵌圖片。
從圖標集(Icon Sets )開始
有免費和付費的兩種。付費版也不貴,非常適合入門級別的設計師。以下是我個人使用的SVG圖標集列表:
Pixicon?by Jackie Trananh ($5)
Symbolicons?($35)
Glyphicon?($59)
Entypo?(Free)
Batch?by Adam Whitcroft (Free)
PSD圖標集( PSD Icon Sets):
Brankic1979?(Free)
IconSweets2?($8)
Broccoli?by Visual Idiot (Free)
如何從Photoshop導出形狀到Sketch中
如果你有Photoshop格式的圖標集,那么這個導出的流程會稍微復雜一些。除了Photoshop之外,還需要使用到Illustrator:
1,在Photoshop中,選擇所有的Photoshop形狀層 ( Shape Layers )和合并形狀(Merge Shapes)。
2,文件(File)——>導出(Export)——>路徑到 Illustrator(Paths to Illustrator),保存為.ai格式
3,在Illustrator中,打開以上的文件,選擇所有形狀,設置為黑色。
4,文件——>保存為SVG格式
5,導入SVG文件到Sketch中,進行編輯。
遷移:我的圖案
除非你是一個純粹的扁平設計師,否則你會需要在設計中使用到圖案材質。你的客戶可能也會要求。 Sketch有躁點預設,但是如果你有更高的要求,你可以在把Photoshop的圖案文件保存為單獨的圖案文件,然后導入到Sketch的圖案文件庫。沒有遷移工具。可以試試Subtle Patterns,一個圖案網站。
如何遷移PSD文件?
設計師應該避免回頭看自己的舊作,所以,這其實是一次從頭開始的機會。Sketch是100%矢量軟件,所以沒法導入帶有大量位圖效果的PSD文件。從我個人使用Fireworks的經驗來看,整個流程也不是完美的。許多樣式都出錯了。甚至是字體看起來也特別丑。
不過,用Sketch重現Photoshop設計非常簡單。畫圖形、上顏色,應用Photoshop類似的陰影效果即可。圖標和樣式部分是最困難也是最重要的一部分。作為一名設計師,應該專注設計基礎(設計原則、簡潔的設計元素、像素完美等等),不要依賴那些使用特定軟件實現的效果,比如樣式、濾鏡、動作。
Sketch雖然很新,但是很多出色的設計師已經開始分享Sketch文件了。坦白的說,自定義Sketch甚至比PSD更簡單。:)
Sketch iOS Kit?by Marcelo Marfil
Safari?and?iOS6 Template?by Benjamin De Cock
iOS Message UI?by Ben Breckler
我也分享一下我自己的文件
通常我是不會分享我的設計文件的,但是,既然它能幫助新用戶更快上手Sketch,那么我就破例一次吧。
iPhone(Phone image?by Paul Flavius Nechita)
Marcelo Marfil還制作了一系列視頻:《如何創作一個自定義的Sketch?UI》
結語
除非你像我一樣,已經使用了3個月以上的Sketch,要不然你可能還是會回去用Photoshop,編輯老的PSD等需求,或者圖片編輯、圖片繪制、等重的圖片設計工作。然而,我們需要知道的是,有一種Photoshop的替代品,它可以完全專注于用戶界面設計。一種集結了Photoshop、Illustrator和Omnigraffle等優勢、可以匹敵Adobe的工具。
會讓你愛上Sketch的那些好文!
心動了!超好用的預覽圖神器!
《想要一稿過不加班?Sketch絕配神器Mirror搶先體驗》心動不如行動!方便貼心功能合集!
《UI設計師新寵!聊聊sketch那些方便好用的貼心功能》直接上教程,看效果也是超贊的,過程還簡單!
《SKETCH設計教室!從零開始學APP設計利器SKETCH(二)》
原文地址:blog.mengto
譯文地址:www.teambition.com
【優設網 原創文章 投稿郵箱:2650232288@qq.com】
================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/。
設計微博:擁有粉絲量83萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的"福利"嗎?
添加 優秀網頁設計 微信號:【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加:
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
標志設計標準教程
已累計誕生 729 位幸運星
發表評論
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓