* Got Sketch with you?
* Raffle sign-up?
* Grab some swag?
* Photos OK?
* Thank our hosts, NGA!
A software engineer and multi-hat wearer who ❤️s Sketch
let currentWork = "Frontend Web & Mobile Developer";
let currentFrameworks = "React and React Native";
Using Sketch for ~5 years
[Not paid, just for the ️️️love]
Legal Disclaimer: I do not speak for Sketch or the makers of Sketch
Sketch is UI Design Software
*"Sketch is a design toolkit built to help you create your best work — from your earliest ideas, through to final artwork."*
Sketch embraces open standards and an open source community
*JSON file types, web standards, plugin community...*
UI, UX and Graphic Design Pros @ Apple, Google, Facebook...
And non-designers and hobbyists
Easy to pick up and get going
## What Can we *do* with Sketch??
## Wireframing with Sketch
Why do we do wireframing?
🚀Usability🚀 vs. ✨Sparkles✨
...We'll come back to Libraries
Let's assume...pixel-perfect design
` File -> New from Template -> Prototyping Tutorial `
## Getting in the Deep End
We *can* build UI from the ground up...
Or we can focus on our uniqueness...
...and use others' UI resources
Sketch App Sources
Making a UI on a platform?
There are pixel-perfect elements out there
iOS, Material Design, Bootstrap, Messenger Apps...
What if your project uses a framework or design system?
First, your team is doing things right
Second, you should use Libraries
### Quick Demo: Libraries
Libraries: Symbols syncing, globally
Addons/extensions of Sketch
From the simple utilities...
To getting HTML, CSS and code
### Plugins Shown:
- [Color Contrast Analyzer](https://github.com/getflourish/Sketch-Color-Contrast-Analyser)
- [Sketch Runner](https://sketchrunner.com/)
- [Craft Manager](https://www.invisionapp.com/craft)(Invision)
### Other Plugins:
- [User Flows](https://abynim.github.io/UserFlows/)
- [Sort Me](https://github.com/romashamin/sort-me-sketch)
- [Sketch to App Store](https://github.com/bmull/SketchToAppStore)
- ...There's a plugin for that...