We’ve covered how to self learn mobile app development, but what if you’re just getting into UI/UX design — or you’re a total newbie with a great idea and a vision for how your app should look?
We asked five mobile app design experts what they would recommend to someone looking to learn how to design apps online without making a huge initial investment. Their answers helped us parse out the best of the best when it comes to free online courseware, and also surprised us with creativity (do you have a Pinterest board for UI design? If you don’t now, you will soon!) These resources will help get you up to speed on mobile app and UI design, and will do it without breaking the bank.
Recreate the Greats — And Remember, Friendship is Free!
Eli Vargas (@elijahvargas) is an Associate Creative Director at Comcast, responsible for overseeing user experience and design strategy for Mobile and PC UX teams on the XFINITY TV X1 platform. Prior to his move to Comcast, he was a Digital Creative Director at 1 Trick Pony (@1trickpony), a Philadelphia-based design agency whose clients have spanned multiple industries, from coffee roasters to wireless carriers and TV networks.
“I was asked to design an app two years after the first iPhone was introduced. I had created many websites before this — mostly flash sites — but this was my first attempt to make something that works with gestures and taps,” says Vargas. “During this process, I made many mistakes (I still do), so here are five tips to learn how to design apps.”
1. Take mobile screenshots of well-designed apps and recreate them.
This process will expose you to typography, padding, sizing, and other mobile UI considerations.
2. Download an Apple or Android GUI.
A few years ago, a company called Teehan + Lax redesigned Apple’s GUI (Graphic User Interface). Today they recreate the most up-to-date GUI for Facebook. The GUI will provide you with UI elements and basic patterns to help you start your design. Also, it’s a great introduction to Atomic Design.
3. Go to the source.
Read and reference Apple’s Human Interface Guidelines or Google Design for best practices and suggested behaviors.
4. Preview your designs on the right screen.
I stress this point to my younger designers – preview your designs on the intended screen. There are many great free resources to do this so that you don’t have to amass a huge collection of different devices. Use programs like Sketch Mirror, Skala, and Dropbox. Confirm your designs are visually accurate.
5. Befriend an iOS or Android engineer (preferably both!).
An engineer can be your greatest teacher. Partner with a developer and pressure test your designs as often as possible.
Look Into Free Online Courseware and Image Assets
Vadim Peskov is the CEO of Diffco US (@Diffco_us), a mobile and web development company that helps both startups and large corporations create great apps, drawing on almost a decade of experience and using the newest technologies on the market. Here’s what he had to say:
1. Many great courses and tutorials are totally free.
Any app development project starts with design, so every member of our team has to be design-savvy. In fact, we are all obsessed with design and involved in this matter at different project stages in one way or another. To junior team members we recommend that they study some of the courses on Envato Tuts+, which boasts thousands of free tutorials, articles and video courses. There are tips for beginners on Mobile UI design, typography, design of specific app categories and lots more cool and inspiring information. Other course collections to check out are Lynda, Treehouse, Codeacademy.
2. Stand on the shoulders of giants.
I’m convinced that the best way to learn for any beginner is to actually study the existing body of work, find examples you admire and follow successful designers’ footsteps. Pablo Picasso once said (and Steve Jobs has quoted him), “Good artists copy; great artists steal.” Inspiration often comes from the existing great works of art — then, you then bring that inspiration into a project and make it your own.
There are several great resources that accumulate some of the best mobile app design examples on the market and are simply a must to study even for more senior designers (and even startup founders!) who need to stay on top of market trends. In addition to the well-known Behance, I like Dribbble, Awwwards and looking at various UI design boards on Pinterest and resources on UI Space.
3. Download free photo and icon assets.
Various free photo and icon banks are also extremely helpful when you are starting out with mobile design projects. Just to name a few, I’d advise to keep resources like the following bookmarked in your browser: Pexels (for pictures of people, buildings, cards, nature, streets, etc.), Flat Icon (a database of over 100K free vector icons) and Font Awesome (one of the best databases for scalable vector icons).
Design Apps Online By Purchasing Apps and Reverse Engineering Them
Tess Suchoff is an entrepreneur and maker of Fliptopia (@fliptopiamarket), a “marketplace to buy and sell the full and exclusive rights to apps, a sort of eBay for apps.” Fliptopia, Suchoff explains, could also be a great teaching tool for anyone wanting to learn how to design apps online, and set their own price.
“Considering each app is essentially its own business with assets, the ability to complete a business acquisition of this sort of technology was bound to become a need. Our co-founders, Eliran Sapir and Jonathan Kay, realized back in 2011 that there wasn’t an easy and secure way to acquire this sort of new technology.
Not every app can be Whatsapp or Masquerade, but many developers want to still sell their apps for a multitude of reasons ranging from wanting to clean up their ever expanding portfolio to needing money to fund their next project. Fliptopia makes entering the app market for the app newbie equally as easy as a seasoned veteran building out their portfolio. You are able to message sellers, negotiate offers, and buy apps that already exist on the app store. Filter by platform, category or price range and sort by number of downloads, revenue and price to find your perfect app.
When you buy an app on Fliptopia, you’re purchasing the app, all of its historical data (existing users, reviews, ratings, etc), code, assets, and full intellectual property rights. Fliptopia walks you and the seller through the step by step transfer process with Google and Apple. The best part is, you are saving time and money you would have otherwise spent to build the app from scratch.”
Courseware that Crowdsources Mobile Design Experts
John Turner (@UsabilityGuyPGH) is the CEO/Founder of QuietKit, which provides free guided meditation for beginners, and UsersThink (@UsersThinkapp), which allows marketers to get on-demand user feedback on their landing pages.
“One of the best resources for aspiring designers to learn design is Hack Design, an online design course. The whole thing is free, go at your own pace, and covers everything you’d need to get started with designing apps, including great design tools to start with.
Hack Design takes an awesome approach of using expert crowdsourcing, so masters and experts of design are responsible for curating free resources focused around a specific part of design, allowing for the ability to not only learn across a number of aspects of design, but also providing a quick reference in case you’re struggling with one specific concept or focus. They also offer lesson delivery via email, so once a week you can get new assignments to help you learn in a structured way.”
Find App Development Tools That Help You Learn the Basics
Chandler Dunklin leads app software research at Clutch.co (@clutch_co), which serves up quality research and reviews on top development, design and marketing companies. As Dunklin explains, sometimes the best way to learn how to design apps online is just to dive right in and do it — provided you’re using the right tools:
“There are a number of different factors that someone should take into account when considering working with an app development software. For example, there are a number of free options that are available, but they will often greatly limit your creativity with the UI of the app (not something a budding designer wants to hear!).
If I were to recommend a do-it-yourself app software package for a designer who was trying to build an app on their own, I would go with GoodBarber. GoodBarber has a number of APIs and code templates that allow for easy development, but it still allows access to source code and extensive customization possibilities, which would be crucial for someone who is design focused.
No app created by a cross-platform software like GoodBarber will ever have all the features that are made possible with native development. However, the UX/UI of products like GoodBarber is leaps and bounds ahead of where it was as recently as two years ago, and is continuing to improve. With very little coding experience, a designer could come pretty darn close to building their perfect app on GoodBarber, or a similar platform.”
Learn How to Design Apps Online by Building a Prototype
One of the fastest ways to immerse yourself in the world of mobile UI design is by creating a prototype of either a mobile app you’d like to build or one you already use and love. With interactive prototyping tools like Proto.io, you can simply open up a new blank project or template and drag in ready-made UI design elements, from menus to animated transitions. Within minutes, you’ll have a prototype that looks and behaves like a completed app.
The best part? You can learn how to do it at no cost by signing up for a free 15-day trial and immersing yourself in helpful tutorials and documentation. Or, explore Proto.io Spaces to see the gorgeous Android and iOS prototypes, not to mention wearable prototypes, other Proto.io users have designed. You might happen upon some design choices you fall in love with, or even find inspiration for your next project!
What would you add to this list? Let us know your favorite free and low-cost ways to learn how to design apps online by tweeting us @Protoio!
