Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

SVG Summit

Avatar for clarklab clarklab
January 21, 2016
Technology
1
180

SVG Summit

Slides from my Sketch Workflow talk at SVG Summit

Avatar for clarklab

clarklab

January 21, 2016
Tweet

More Decks by clarklab

See All by clarklab
UX Playbook: Real World User Exercises
Avatar for clarklab clarklab
1
660
Design Workflow with Sketch
Avatar for clarklab clarklab
8
250
User Experience in the real world
Avatar for clarklab clarklab
0
3.3k

Other Decks in Technology

See All in Technology
子育てで想像してなかった「見えないダメージ」 / Unforeseen "hidden burdens" of raising children.
Avatar for Pauli pauli
2
300
OCI Oracle Database Services新機能アップデート(2025/09-2025/11)
Avatar for oracle4engineer oracle4engineer
PRO
1
210
大企業でもできる！ボトムアップで拡大させるプラットフォームの作り方
Avatar for ファインディ株式会社（イベント資料アップ用） findy_eventslides
1
850
IAMユーザーゼロの運用は果たして可能なのか
Avatar for Yuuki Yamashita yama3133
2
500
Sansanが実践する Platform EngineeringとSREの協創
Avatar for SansanTech sansantech
PRO
2
940
生成AIを利用するだけでなく、投資できる組織へ / Becoming an Organization That Invests in GenAI
Avatar for 株式会社カミナシ kaminashi
0
110
20251219 OpenIDファウンデーション・ジャパン紹介 / OpenID Foundation Japan Intro
Avatar for OpenID Foundation Japan oidfj
0
190
AIの長期記憶と短期記憶の違いについてAgentCoreを例に深掘ってみた
Avatar for やくも yakumo
4
460
Lessons from Migrating to OpenSearch: Shard Design, Log Ingestion, and UI Decisions
Avatar for SansanTech sansantech
PRO
1
150
re:Invent 2025 ~何をする者であり、どこへいくのか~
Avatar for tetutetu214 tetutetu214
0
230
品質のための共通認識
Avatar for KAKEHASHI kakehashi
PRO
4
380
多様なデジタルアイデンティティを攻撃からどうやって守るのか / 20251212
Avatar for Ayokura ayokura
0
490

Featured

See All Featured
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
348
40k
Utilizing Notion as your number one productivity tool
Avatar for Mfonobong Umondia mfonobong
2
180
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
250
B2B Lead Gen: Tactics, Traps & Triumph
Avatar for Sophie Logan marketingsoph
0
29
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
120k
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
100
sira's awesome portfolio website redesign presentation
Avatar for ElsiraPls elsirapls
0
87
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
380
The Illustrated Guide to Node.js - THAT Conference 2024
Avatar for David Neal reverentgeek
0
200
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
21k
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
1
200

Transcript

  1. Working with
 Sketch

  2. Clark InVision

  3. None

  4. The Zebra Previously UX

  5. None

  6. Why Sketch?

  7. Vector-based 1 Artboards 2 Assets 3

  8. @clarklab #SVGsummit

  9. Working with
 Sketch+SVG

  10. Exporting

  11. Mark It Set Options Export! 1 2 3

  12. Slices Groups+ Layers Artboards

  13. Saving SVGs from a .Sketch Document

  14. Single Batch 1 2

  15. Managing file paths

  16. /icons/house.svg /logos/wishlist.svg 1 2

  17. Managing resolutions

  18. @2x @3x @1x

  19. Viewbox (and other properties)

  20. 40 x 40 slice

  21. 40 x 40 artboard

  22. folder-icon.svg

  23. SVG Structure

  24. None

  25. clock.svg

  26. Yes No

  27. Maintaining an icon set

  28. Stay Organized 1 Better than a folder full of SVG

    2 Mix and match 3

  29. Using Symbols

  30. Stay in Sync 1 Keep exports isolated 2

  31. Logo sets

  32. Background colors

  33. Responsive icons when one-size doesn’t fit all

  34. None
  35. None

  36. Sketch Tool Command Line

  37. None
  38. None
  39. None
  40. None

  41. sketchtool list pages filename.sketch sketchtool dump filename.sketch sketchtool export artboards

    filename.sketch ——output ——scale ——formats

  42. InVision Asset syncing

  43. IconJar Set smashing

  44. None

  45. invisionapp.com/ecourses/ design-workflow-with-sketch

  46. @clarklab #SVGsummit