Designing an App with Sketch

Our design team loves using Sketch to design apps before creating them in App Press. Here's how Sketch and App Press work together.
Scout Harlow
scout@app-press.com

Scout designs great looking apps for App Press customers, and her favorite emoji is đź’Ż.

Sketch is currently every digital designer’s best friend. It has a UX similar to programs with which we are already familiar, with improved UI and functionality perfect for digital projects and quick prototyping. 

Sketch has mastered the resolution of text on screen, optimized the environment for large project organization and workflow—think lots of Artboards—and has perfected the file exporting experience. It also has the easiest real time design previewer I have experienced outside of our App Press Now app: Sketch Mirror. 

The App Press Studio has a number of tools that allow you to create simple navigational elements, but Sketch gives designers much greater control over the look and feel of their apps. Because of this greater degree of customization, I always use Sketch to design apps for customers here at App Press. 

Here's how I design app screens with Sketch, before importing them to App Press and previewing with App Press Now.

Streamlined Project Organization

Whether the project you are tackling is big or small, both Sketch and App Press give you great tools to keep your project organized. Sketch’s “Pages” feature gives you the option to keep certain screens (Artboards) in certain places. 

I start every Sketch project by creating Pages representing the different types of content for the app I am designing. For example, if the app has complex functionality, my Pages might look something like: Splash and Login screens, Onboarding Screens, Profile Screens, and so on. 

To streamline my process of designing in Sketch to building in App Press, I make sure to name all of my Sketch Artboards as I go. That way, when I am ready to export to App Press, the file names are already determined, and will appear in my Layers Panel accordingly. 

Also, if I make a small change in Sketch—like the color of a button—then re-save and re-upload under the same file name to App Press, my file is automatically updated within the app (thanks to our file name saving cache). 

Master Time Saving Tools

Sketch and App Press have awesome Master features that save designers a ton of time. You might be familiar with the powerful Symbols tool in Sketch. 

This feature allows you to create an asset you know you will be using frequently across Artboards and Pages as a Symbol: a Master version of that asset. When you need to edit the color of your tab bar, are you going to painfully edit each and every one on each and every Artboard? 

Hell nah! You merely need to edit your Symbol tab bar and poof! The changes are made across your ENTIRE project. 

In App Press, you’ll also save design time in your app using our Master Pages feature. Master Pages allow you to build navigation elements (your headers and tab bars) that will be applied throughout your project—wherever that Master is assigned. 

You can have twenty app pages (or more) assigned to a Master Page in your project. Any change made to that Master Page will automatically appear on every.single.page. 

Quick App Design Prototyping

Sketch Mirror and App Press Now are my prototyping heroes. When designing in Sketch, I can preview my designs in real time on my phone device using the Sketch Mirror app. 

I can make edits on my desktop and watch as the changes happen simultaneously on my phone (I <3 you, wifi!). Sketch Mirror allows me to decide what looks amazing on screen quickly and efficiently. 

Once I have solidified my design and begin building in App Press, the real magic happens. The App Press Now app allows me to prototype my design as well—but with full navigation functionality. Using a share link of my project generated from the App Press Studio, I can have a lot of people view and test my app via App Press Now. 

The two applications go hand-in-hand when trying to quickly nail down a great user experience, and design a great looking app.

Create Your Own Apps with App Press

Start Building Your App
CLOSE  X
Join our mailing list and stay up with the latest App Press news.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form