Discovering Sketch
the designer’s toolbox
Keep knowledge current
跟国际接轨
更富有活力
容易上手
资源多
更适合当前的web design
更适合移动应用设计

2012 Apple Design Award winner
⽤用来做web design是⼤大炮打蚊⼦子
对移动端设计不友好
更新缓慢,运⾏行缓慢
贵...
old fashion
以图⽚片作为排版和装饰元素的设计越来越少
the trend
扁平化⻛风格流⾏行,以⼤大量⾊色块和⽮矢量图标为主
Features
when saving the file…
很难找回历史版本
每次保存时记录⼀一个版本,Revert to >
Browse all versions 可以找回任何时候的版
本
Photoshop
Sketch
when drawing rounded shapes…
You can dynamically edit corner radius in Sketch:
With PS, you can’t do it dynamically, you h...
If you’re a UI designer…
In Sketch:


You have a non-limit canvas.



Smart Guide will help you a lot in aligning objects....
If you’re a front-end developer…
Sketch have native Grid view support:
If you’re a front-end developer…
You can copy CSS properties from an object in Sketch
If you’re a programmer…
You can extend Sketch by plugins, get them on Github, or write your custom
scripts with JSTalk - T...
If you’re a mobile UI designer…
you can preview Sketch design on mobile devices with Sketch Mirror
Install Sketch Mirror o...
Suggestions
Efficiently Rename Layers
起个好名
Suggestion 1
Tips:
Efficiently rename your layers, groups, artboard and link styles.

Select ...
create multiple design in one page
万物霜天竞⾃自由
Suggestion 2
Tips:
Canvas is non-limit size.

Create artboards and groups to m...
Suggestion 3
设计:
!
创造力 > 复制风格 > 复制样式
!
编程:

复制思想 > 复制模式 > 复制代码
Sketch Resources
http://www.sketchappsources.com/
http://www.sketchgems.com/
http://sketchmine.co/
Sketch official Web Site
Sketch Articles
Sketch 中⽂文⼿手册
http://blog.mengto.com/photoshop-users-how-to-switch-to-sketch/
http://blog.mengto.com/sketc...
Thank	 you
peng.miao@yottaa.com
Give it a try
Upcoming SlideShare
Loading in...5
×

Discovering sketch

478
-1

Published on

对Skytch的简单介绍

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
478
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Discovering sketch

  1. 1. Discovering Sketch the designer’s toolbox
  2. 2. Keep knowledge current 跟国际接轨
  3. 3. 更富有活力 容易上手 资源多 更适合当前的web design 更适合移动应用设计
 2012 Apple Design Award winner ⽤用来做web design是⼤大炮打蚊⼦子 对移动端设计不友好 更新缓慢,运⾏行缓慢 贵...
  4. 4. old fashion 以图⽚片作为排版和装饰元素的设计越来越少
  5. 5. the trend 扁平化⻛风格流⾏行,以⼤大量⾊色块和⽮矢量图标为主
  6. 6. Features
  7. 7. when saving the file… 很难找回历史版本 每次保存时记录⼀一个版本,Revert to > Browse all versions 可以找回任何时候的版 本 Photoshop Sketch
  8. 8. when drawing rounded shapes… You can dynamically edit corner radius in Sketch: With PS, you can’t do it dynamically, you had to draw a new shape…
  9. 9. If you’re a UI designer… In Sketch: 
 You have a non-limit canvas.
 
 Smart Guide will help you a lot in aligning objects.
 
 Link Styles will help you when you edit multiple objects.
  10. 10. If you’re a front-end developer… Sketch have native Grid view support:
  11. 11. If you’re a front-end developer… You can copy CSS properties from an object in Sketch
  12. 12. If you’re a programmer… You can extend Sketch by plugins, get them on Github, or write your custom scripts with JSTalk - Talking to cocoa with javascript.
  13. 13. If you’re a mobile UI designer… you can preview Sketch design on mobile devices with Sketch Mirror Install Sketch Mirror on you iPhone and open it Your iPhone and computer must in a wifi network Choose an artboard in sketch Click connect
  14. 14. Suggestions
  15. 15. Efficiently Rename Layers 起个好名 Suggestion 1 Tips: Efficiently rename your layers, groups, artboard and link styles.
 Select a layer. Hit ⌘ + R. Start typing. Hit Enter to save. After renaming your first layer, press Tab to go to the next layer (or Shift + Tab for the previous), then hit ⌘ + R to rename it.
 Create Artboards before start, name your artboards with device name or page name. If you want to export to sub folder, you should add sub folder name and ‘/’ to a prefix for your artboard name.
  16. 16. create multiple design in one page 万物霜天竞⾃自由 Suggestion 2 Tips: Canvas is non-limit size.
 Create artboards and groups to manage your layers.
 Select multiple layers, then hit ⌘ + G to create layer group. ⌘ + + to zoom-in, ⌘ + - to zoom-out
 ⌘ + 1 to reset view, select a layer and ⌘ + 2 to view it, ⌘ + 3 to put it in the center. 
 Arrows or space + drag to move your view port. If you want to export your design, hit ⌘ + Shift + E
  17. 17. Suggestion 3 设计: ! 创造力 > 复制风格 > 复制样式 ! 编程:
 复制思想 > 复制模式 > 复制代码
  18. 18. Sketch Resources http://www.sketchappsources.com/ http://www.sketchgems.com/ http://sketchmine.co/ Sketch official Web Site
  19. 19. Sketch Articles Sketch 中⽂文⼿手册 http://blog.mengto.com/photoshop-users-how-to-switch-to-sketch/ http://blog.mengto.com/sketch-vs-photoshop/ http://blog.mengto.com/sketch-vs-fireworks/ http://blog.mengto.com/how-to-wireframe-an-iphone-app-in-sketch/ Discovering Sketch 知乎:界⾯面设计⼯工具 Sketch 的使⽤用体验如何? 初识Sketch:设计师的⼯工具箱 Sketch:⺩王冠上的钻⽯石 Supercharge your Workflow in Sketch http://sketchtips.tumblr.com/
  20. 20. Thank you peng.miao@yottaa.com Give it a try
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×