Designing a mobile app is a long process—one that involves careful planning, brainstorming, and efficient communication of ideas.
Luckily in today’s digital world, there is simply a wealth of software tools developers and designers can and do use that allows them to overcome common hurdles in the app development process.
App design software makes it incredibly easy to quickly prototype a mobile app without a single line of code.
These tools build the foundation for planning out a mobile app’s layout and architecture, design, graphics and animations, and so much more.
Sketch and OmniGraffle are two popular rapid prototyping and design tools that have several overlapping features, but they also have their specialities and are of focus.
Should you use one over the other, both, or neither?
Let’s take a look at how these powerful tools can help you get started on your mobile app project and which one comes out on top.
Sketch has long been the go-to prototype tool for designers and it’s no wonder why.
It’s easy to use with its intuitive interface and low learning curve, and Sketch has some great collaboration features making it a must-have for many designers’ app toolbox.
Sketch is a Mac-only product that requires macOS Mojave (10.14.4) or newer to use.
You can easily download the software from their website, which offers a 30-day free trial (no credit card required).
Since it’s been around for over a decade, Sketch has a ton of free resources to get you started using the software.
Right from their download page they offer a beginner’s guide which documents everything you need to know to start a project, from navigating the interface to making the most out of their extensive features.
Their handy guide also reviews plugins and integrations that can make the software even more powerful and robust.
Here are just a few popular ones:
This plugin allows you to create elaborate charts with random, tabular, or JSON data right inside Sketch. You can customize your charts easily and change the data seamlessly.
Plant lets you invite your team members to collaborate on your project and even offers version control features.
This integration allows for collaboration between designers and front-end developers who can share specs and guidelines with ease.
If you want a head-start on coding your app, this integration lets you turn your design components into clean React, Vue, and HTML components, which you can handoff to your devs.
Sketch has a clean and intuitive interface.
Unlike other app design software, there are no floating panels.
You have a canvas where you can create your designs, a customizable toolbar that comes with a handy set of defaults, and The Layer List, where you can organize your pages, layers, and artboards.
Sketch has strong prototyping and responsive design capabilities, which is what makes it shine as a UI/UX design product.
Here are just a few ways in which you can transform static screen designs into an interactive prototype for your app:
A newer addition to the Sketch app is their Smart Layouts feature which allows you to create responsive components that will automatically resize to fit your content.
To create a truly responsive product design that works on various screen sizes, you’ll still need to manually create variant layouts for these different aspect ratios, but Smart Layouts certainly helps the process.
To preview how your app looks on real devices and not just in the Sketch app, Sketch has a free app called Sketch Mirror.
Sketch is also great for team collaboration and there are several ways to share your designs when you’re ready to get feedback.
The main way to do this is to upload your document to the Sketch Cloud. You’ll get a URL that you can share with anyone to view your document.
You can even set different levels of access. You can allow others to comment, download, or use the libraries of your project.
Giving access to your project library is how you can share all of your assets and presets.
If you want other designers to work on the same Sketch files, you can use integrated plugins like the one previously mentioned, Plant, for file collaboration and version control.
Sketch offers two different pricing options: Individuals and Teams.
For individuals, you pay for a one-time license fee of $99.
Here is a snapshot of the Individual Plan:
If you want continued updates and saving to the Cloud, you’ll need to pay $79 per year, but that’s optional.
For Teams, you pay a subscription, which is $9 per contributor per month (or $99 billed yearly).
Here is a snapshot of the Teams Plan:
Now let’s jump into another popular software tool for designers called OmniGraffle to see how it stacks up against Sketch.
OmniGraffle is also a prototyping tool, but where it differs from Sketch is that it places an emphasis on diagramming, architecture design, and quick wireframing.
It’s very similar to Microsoft Visio, another diagramming application.
In fact, since Visio isn’t available for Mac, OmniGraffle is largely considered the best alternative.
Omnigraffle is also a Mac-only product and requires macOS 10.14 or later.
You can download the software from their website which includes a 14-day trial.
OmniGraffle also comes with some useful resources out of the box, but they’re not quite as extensive as those offered by Sketch.
You can add more to OmniGraffle with Omni Automation Plug-Ins, which work with all Omni applications.
Two of these plugin components are:
These are scripts that perform automation tasks. You can assign them to documents or objects which will run through user interaction.
Omnigraffle doesn’t offer quite as many plugins and 3rd party integrations as Sketch, but there are a few, like Stenciltown.
Stenciltown makes it easy for OmniGraffle users to find free stencils to use. These stencils are shared by the community.
Users can search the collection and easily download them from within the OmniGraffle app.
The OmniGraffle interface is very user-friendly, organized, and easy to use.
A key feature of the app is its ability to create templates and stencils to compartmentalize various components so you can use them again in other projects.
This can save you time when you’re creating your designs and it gives you more control over your project when your goal is to design several interfaces that work together.
Like Sketch, OmniGraffle also uses an infinite canvas in your document which can have multiple layers.
You can also share these layers so that they appear on multiple canvases of your project.
OmniGraffle offers powerful prototyping features, many of which are similar to what Sketch offers.
You can have clickable prototypes, you can link various elements like buttons and page regions within the same document, run scripts, export PDF or HTML versions of your document and so on.
By default, all objects on your canvas are set to “do nothing”, but you can easily add an action like, “Opens a URL”, “Shows or Hides Layers”, and “Jumps Elsewhere”.
While you can export your files to share them with team members, there is no ability for real-time team collaboration with OmniGraffle.
You’ll also be hard-pressed to find any information about how to best collaborate with others on your OmniGraffle files, unlike Sketch which offers version control plugins to allow for efficient team editing and collaboration.
With OmniGraffle, it is easy however to export portions or all of your artboards to other team members to get feedback.
Omnigraffle has two pricing models: Subscription and Traditional.
The subscription model offers all features on all devices that work with OmniGraffle, like Mac, iPad, and iPhone.
It costs $12.49 a month or $124.99 a year.
This model has a lower cost up front.
Their Traditional model costs more up front but it saves you money in the long run.
The cost is $149.99 for the standard edition or $249.99 for the Pro edition.
OmniGraffle Pro comes with more advanced tools, but the standard edition is very robust and can stand up on its own quite well.
If you’re unsure which is better for your specific needs, start with the standard edition. You can always upgrade later.
Sketch and OmniGraffle are very similar in the solutions they offer.
They’re intended for designers and developers to quickly and easily create wireframes and prototypes.
With that said, they each have their specialties.
OmniGraffle is much more lightweight than Sketch and comes out on top when it comes to mapping, diagraming, and flowcharting.
It has a simple interface that allows users to create complex architectural blueprints if needed, which Sketch falls short on.
Sketch, on the other hand, is a long-time designer’s favorite for a lot of reasons.
It’s familiar interface for Mac users makes it easy to create prototypes, and it also has a huge community.
You can download web templates, plugins, various UI elements and integrate with 3rd party apps to create robust prototypes.
It’s a very capable replacement for more heavy software, like Photoshop. Anyone with a design background can easily dive into Sketch for mobile, web, and UI design.
Both applications offer a free trial. Use it!
If you don’t love the interface of one software, try the other.
Spend some time with each application to see for yourself where they fall short because neither is perfect.
Finding the right prototyping tool for the projects you need them for can take time and a little bit of tinkering.
But once you find the perfect fit, you’ll be able to create powerful designs you can share with your clients, testers, and even investors.
UX / UI Design,
3 min read