1. Use one document file for an entire app
Sketch is a lightweight program and it’s possible to store the entire design for an app inside of a single Sketch file. This helps to keep design files more organized and limit the amount of asset hunting you have to do in Dropbox. Also, when your devs ask you for assets you immediately know where they are and can access them a lot faster.
2. Use Pages to separate different screens
Sketch has a great feature called Pages which allows you to store multiple documents — or organized collections of artboards inside of a single Sketch file. Use a separate page for each different screen in your app. This allows you to duplicate artboards and make quick agile iterations to the design while keeping your files very organized.
3. Use Sketch Mirror for swiping between iterations
After creating all those iterations using Pages, you can use Sketch Mirror to swipe between them right on your iOS device. This supports iPhone, iPod, and iPad screen sizes. You can even swipe up and down to access the multiple pages within your single Sketch file. Great for feedback and reviews as well.
4. Use Symbols; define and set them early
Sketch has some amazing features like Symbols, and Layer Styles which make make design changes across your app a breeze. Make a symbol out of your TabBar for example, and when you make a change on one artboard all the other artboards with that symbol of the TabBar changes and updates to match.
5. Use consistent naming conventions
This makes exporting super easy and fun. Yes, fun! With your team, set a specific list of naming conventions for your assets. For example start all icons with the prefix “ic_” or all images with the prefix “img_” etc., you get the point. Work with the developers on this one and see what naming conventions they like to use as well. Once you have this defined list, rename your groups and layers accordingly. This way when you export the assets and import them to Xcode, they are organized inside of /xcassets beautifully.
6. Use Export for easy @1x and @2x file management
There’s nothing like having your file sizes all messed up inside of /xcassets. Eliminate the problem of forgetting to add @2x sixed assets to your Xcode project by exporting both sizes from Sketch at the same time. You can even drag files to the desktop from Sketch to export them. Great for dragging and dropping into finalized .png asset folders.
7. Use Sketch Measure to aid with Auto Layout
This is a tool I just found that I’m hoping is going to make setting Auto Layout constraints a little easier. It will also help inform developers on how the interface will respond to multiple device sizes. I really recommend installing this plug-in and introducing it into your workflow.
Download Sketch Measure from GitHub
I would love to hear your Sketch workflow and other tips or tricks you use. You can find me on Twitter @nnwoodman, I’d love to chat.
Thanks for reading!
If you found this article helpful, recommend it for followers. ☺
About the Author
I am a User Experience Designer at MindSea Development Inc., where I work with a diverse multidisciplinary team designing mobile solutions that grow business and delight people.