Throughout the course we are going to be using lots of cool tools and resources for designers to build our project.

To keep everything simple and organized for you, we've included all the design resources and assets in a handy dandy online companion book for this course.

Link to the Course Companion Book

Tools We Will Use

• Figma
• Concepts Apple Store App (Sketching option for Mac only, but don't worry, pen and paper is just fine! We just needed a way to show our sketching process!)
• Color Contrast Analyzer
• Logo Makers

Individual Figma Files

👉  Learn how to duplicate the file that is linked so you can use it

• Sketching
• Figma Basics
• User Flows
• Sitemaps
• Wireframes
• Prototyping
• Spacing and Grids
• Typography
• Color
• Forms and UI Elements
• Imagery and Iconography
• Accessibility
• Visual Style and Exploration
• Motion and Microinteractions
• Design System and Compositions
• Product Alignment
• Portfolio

Figma Plugins

• Design Inspo
• Unsplash
• Logo Creator
• Color Search
• Lottie Files
• Image Palette
• Auto Flow
• Sitemap
• Wireframe
• Content Reel
• Lorem ipsum
• Figchat
• Font Scale
• Font Explorer
• Color Palettes
• Color Contrast Checker
• Able – Friction free accessibility
• Pexels
• Remove BG
• Duotones
• Blush
• Illustrations
• Humaaans for Figma
• Streamline Icons
• Feather Icons
• Material Design Icons
• Iconify
• Contrast
• Chart
• Figmotion
• Design Lint
• Master
• Unused Components

Extra Figma Files by Section

1. Inspiration
   1. Figma Inspiration Board
2. User Flows
   1. User Flow Kit
   2. UX Flowchart kit for Figma
3. Sitemaps
   1. Sitemap Generator
4. Wireframes
   1. Ant UX Wireframes
   2. iOS App Wireframes
   3. Figma Wireframe Kit
5. Getting Feedback
   1. 🗣Feedback Kit | Want good feedback from your team? Feedback Kit is here to help you ask for the type of feedback ...
6. Color
   1. Color Styles
7. Imagery and Iconography
   1. Free 60 illustrations - Surface Pack
   2. 💥 Vector Illustrations
8. Mobile Design
   1. iOS Keyboards
   2. iOS App Wireframes
   3. iOS & iPadOS 14 UI Kit for Figma
   4. iOS/iPadOS 13 Design UI Kit
   5. Android UI kit
9. Design System
   1. Design System Checklist

Extra Articles/Websites and Resources by Section

1. Sketching
   1. Sketching. How to use sketching in your design
   2. Concepts App • Infinite, Flexible Sketching / For Windows: Microsoft Paint 3D
   3. 7 reasons for sketching in UX design
   4. UI/UX sketching techniques 101. UX design is indeed a complicated…
2. Inspiration
   1. 31 UX Design Inspiration Resources
   2. Dribbble - Discover the World's Top Designers & Creative Professionals
   3. Behance :: Best of Behance
   4. Pttrns: Mobile Design Patterns
   5. Pinterest
   6. Panda — The homepage for your favorite websites
   7. Awwwards - Website Awards - Best Web Design Trends
3. User Flows
   1. What Are User Flows In UX Design? (A full beginner's guide)
   2. User flow is the new wireframe. An illustrated guide on the different…
4. Sitemaps
   1. Free Sitemap Generator
   2. Sitemaps - The Beginner's Guide - UXmentor.me
5. Wireframes
   1. How to Create a Wireframe - A Beginner's Guide to Wireframing
6. Getting Feedback
   1. How to give and receive great design feedback
7. Spacing and Grids
   1. Spacing, Grids and Layouts
   2. The Comprehensive 8pt Grid Guide. Start your UI project right with this…
8. Typography
   1. Google Fonts
9. Color
   1. Colorable
   2. Coolors - The super fast color schemes generator!
   3. Adobe Color: Color wheel, a color palette generator
   4. Colormind - the AI powered color palette generator
10. Imagery and Iconography
    1. Noun Project: Free Icons for Everything
    2. Blush: Illustrations for everyone
    3. Material Icons
11. Accessibility
    1. Colorable
    2. Contrast Checker
    3. Web Content Accessibility Guidelines (WCAG) 2.0
    4. World Wide Web Consortium (W3C)
    5. Color Contrast Analyzer
12. Design Patterns
    1. Design patterns
13. Mobile Design
    1. Human Interface Guidelines - Design
    2. Android Developers
14. Visual Style and Exploration
    1. Atomic Design Methodology
    2. What is Visual Design?
    3. 5 Principles of Visual Design in UX
15. Motion and Microinteractions
    1. The ultimate guide to proper use of animation in UX
    2. Creating Usability with Motion: The UX in Motion Manifesto
    3. The importance of motion for UX design
    4. How to use microinteractions (uses, examples, tips)
    5. Better UX Through Microinteractions
16. Design System and Compositions
    1. A comprehensive guide to design systems
    2. Everything you need to know about Design Systems
    3. A Collection of Design System Resources
    4. Design Systems Handbook
    5. Design Systems articles on building and maintaining design systems