據(jù)某團隊透露,自全司上下都配備Macbook后,設(shè)計部的同事們紛紛將Photoshop換成Sketch,改變過程折騰了相當一段時間,于是留下此文,教你如何從Photoshop遷移到Sketch,那些正準備轉(zhuǎn)移陣地的同學,節(jié)省時間就從這篇開始咯。
@Teambition :Sketch可以說是Photoshop最佳替代,而且比起Photoshop,它更側(cè)重于用戶界面的設(shè)計。雖然目前Sketch素材還是太少,不過我正在著手解決這個問題。
備注:通過分析甚至是重復使用他人的作品可以取得進步,然后開始創(chuàng)作你自己的作品。在學習的時候,重新想像正試圖解決的問題。學習他們的技巧,并它融入到自己的設(shè)計思考中去。
可以到BohemianCoding下載試用版。如果因為需要付費而錯過了這款應(yīng)用,那是得不償失,特別是它還不貴,價格只有Photoshop的1/10。它能讓你的設(shè)計變得更加高效,一旦用上你絕對會愛上它。
遷移:我的圖標(My Icons)
作為一個用戶界面設(shè)計師,圖標是唯一一種不必每次都從頭開始的組件。圖標被存儲為SVG格式,這是是一種廣泛被使用的矢量格式,已經(jīng)被越來越多地被用于css中,代替那種特定分辨率的內(nèi)嵌圖片。
從圖標集(Icon Sets )開始
有免費和付費的兩種。付費版也不貴,非常適合入門級別的設(shè)計師。以下是我個人使用的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中,打開以上的文件,選擇所有形狀,設(shè)置為黑色。
4,文件——>保存為SVG格式
5,導入SVG文件到Sketch中,進行編輯。
遷移:我的圖案
除非你是一個純粹的扁平設(shè)計師,否則你會需要在設(shè)計中使用到圖案材質(zhì)。你的客戶可能也會要求。 Sketch有躁點預設(shè),但是如果你有更高的要求,你可以在把Photoshop的圖案文件保存為單獨的圖案文件,然后導入到Sketch的圖案文件庫。沒有遷移工具??梢栽囋嘢ubtle Patterns,一個圖案網(wǎng)站。
如何遷移PSD文件?
設(shè)計師應(yīng)該避免回頭看自己的舊作,所以,這其實是一次從頭開始的機會。Sketch是100%矢量軟件,所以沒法導入帶有大量位圖效果的PSD文件。從我個人使用Fireworks的經(jīng)驗來看,整個流程也不是完美的。許多樣式都出錯了。甚至是字體看起來也特別丑。
不過,用Sketch重現(xiàn)Photoshop設(shè)計非常簡單。畫圖形、上顏色,應(yīng)用Photoshop類似的陰影效果即可。圖標和樣式部分是最困難也是最重要的一部分。作為一名設(shè)計師,應(yīng)該專注設(shè)計基礎(chǔ)(設(shè)計原則、簡潔的設(shè)計元素、像素完美等等),不要依賴那些使用特定軟件實現(xiàn)的效果,比如樣式、濾鏡、動作。
Sketch雖然很新,但是很多出色的設(shè)計師已經(jīng)開始分享Sketch文件了。坦白的說,自定義Sketch甚至比PSD更簡單。:)
Sketch iOS Kit by Marcelo Marfil
Safari and iOS6 Template by Benjamin De Cock
Navigation Bars
iOS Message UI by Ben Breckler
我也分享一下我自己的文件
通常我是不會分享我的設(shè)計文件的,但是,既然它能幫助新用戶更快上手Sketch,那么我就破例一次吧。
Pinterest Concept
iPhone(Phone image by Paul Flavius Nechita)
Dribbble Concept
Marcelo Marfil還制作了一系列視頻:《如何創(chuàng)作一個自定義的Sketch UI》
結(jié)語
除非你像我一樣,已經(jīng)使用了3個月以上的Sketch,要不然你可能還是會回去用Photoshop,編輯老的PSD等需求,或者圖片編輯、圖片繪制、等重的圖片設(shè)計工作。然而,我們需要知道的是,有一種Photoshop的替代品,它可以完全專注于用戶界面設(shè)計。一種集結(jié)了Photoshop、Illustrator和Omnigraffle等優(yōu)勢、可以匹敵Adobe的工具。
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com