Ultimate resource list for mobile design
By: Joanna Ngai
Tags: UX, Design, Mobile, UX Design, Resources

Ultimate resource list for mobile design

Undraw in AdobeXD

It’s been a few years since I’ve looked at mobile resources. Here’s a quick update on some tools and resources to make your workflow a bit smoother.

Feel free to add anything you find useful that I have missed in the comments.

General reference

iOS design resources

Material design resources (2)

iOS reference from Ivo Mynttinen

Material plugin (Sketch only)

Design tools

Top mobile prototyping tools and general prototyping tools

The best of design tools in 2019, 2018 and 2017

Balsamiq Mockups — low fidelity goodness.

Figma — good enough for simple animations, design libraries are a big plus and collaboration is magical. Plus wireframe kits.

Cons: Lacking plugins and some performance issues for larger files.

ProtoPie — super powerful and flexible prototypes.

POP by Marvel — for paper prototyping. Quick and fast!

icons8/ouch illustrations

Illustration

Absurd illustrations — abstract and hand-drawn illustrations.

Blush — mix and match illustration library.

Control illustrations — 18 character illustrations in 2 styles, free version in PNG.

DrawKit — mix of free and paid high quality illustration kits

Free vector illustrations — Ouch.pics — free vector illustrations for user interface.

Illustrations | unDraw — plenty of illustrations, you choose the color theme. Plugin with Adobe XD.

Illustrations.co — 100 open sourced illustrations

Isometrics — cute isometrics, voxel and 3D animations. Free to use for non-commercial projects with an attribution.

ITG — online illustration builder. Free in JPG with attribution.

Humaaans— library of mix and match human illustrations. Free for commercial/personal use.

Open Peeps — hand drawn illustration library. Free for commercial/personal use.

Struct — paid library of fully editable illustrations.

Stubborn illustrations — mix and match illustration generator, built in Figma. Free for commercial or personal use.

Smash illustrations — mix and match illustration generator. Free for commercial or personal use.

Tutorials

WalkMe — step by step guidance for software, web or app experience.

Flows

Good UX/Bad UX — publishing stories around good and bad experiences.

Mobbin — Latest Mobile Design Patterns

Really Good UX by Appcues

User flow design inspiration

UX Archive

Patterns

Android Niceties

Cocoa controls — open source UI components for iOS, iPadOS, macOS, tvOS, and watchOS

UI sources — mobile UI interactions and patterns from the best designed apps on the App Store.

Empty States — mobile — delight users by designing the empty states.

Mobile Patterns — inspiration for UI/UX

UI Garage — collection of inspiring screens

ProtoPie

Colormind

Color

Adobe color tool — updated to include trends and image browse

Cloudflare palette tool — creates accessible color combinations

Contrast tool (Mac only)

Colorblinding — chrome extension with color blindness filter

Color Oracle — color blindness simulator for Mac/Windows/Linux

Colormind — AI generated color palette

ColorBrewer — classic color palette generator for maps with toggles for color blindness

Material color tool

Nifty javascript library for color conversions

Stark — accessibility plugin for Adobe XD, Sketch (coming soon: Invision Studio, Figma)

Emails

Onboarding — Really Good Emails — perfect the art of a well designed email.

Design evaluation (besides the obvious: research!)

Design Principles collection — open source of design principles/methods.

Mobile accessibility — standards and guidelines from W3C

Mobile patterns — browse a collection of UI patterns that are A/B tested.

Respecting Focus — mobile devices can demand a lot of attention. How can we design with respect and intelligence?

Misc

Logos — vector logos of popular brands

Product presentation templates

Mobile World Conference — a way to keep up with the latest mobile changes across the industry.

Mobile anti-patterns — a short article on what not to do related to optimizing mobile performance

Rotato — puts your design into 3D mocks.

UInames — generates random fake names for use in mockups

Icons

Unicons — 1000+ Pixel-perfect vector icons and Iconfont

Nounproject — classic library of everything

iOS glyphs, Material icons and even more icons (890+ pixel perfect icons)

Resources

Collaboration

Prototyping

Did you find this useful? Buy me a coffee to give my brain a hug. 🍵

Feel free to check out my design work or my handbook on UX design, upgrading your portfolio and understanding design thinking.