UX & UI Design Resources

UX-&-UI-Design-Resources.md

UX & UI Design Resources on the Web

Index

1. Online Prototyping
2. User Testing & Feedback
3. UI Design Patterns
4. Colours & Gradients
5. User & Profile Photos
6. Stock Photography
7. Icons
8. Fonts
9. Design Inspiration
10. Useful Tools
11. Form Handling & Mailers
12. Resources & Guides

1. Online Prototyping

InVision: http://www.invisionapp.com/
Marvel: https://marvelapp.com/
Pixate: http://www.pixate.com/
Webflow ($16/month): https://webflow.com/
UXPin ($15/month): http://uxpin.com
Flinto ($20/month): https://www.flinto.com/
Proto.io: http://proto.io
Codiqa ($16/month): https://codiqa.com/

2. User Testing & Feedback

FiveSecondTest: http://fivesecondtest.com/
Verify: http://verifyapp.com/
Typeform (awesome surveys): http://www.typeform.com/
User Testing: http://www.usertesting.com/
Feedback Army: http://www.feedbackarmy.com/
Usabilla: https://usabilla.com/
CrazyEgg - Visualise where your visitors click: http://www.crazyegg.com/
Try My UI: http://www.trymyui.com/
Criticue: http://www.criticue.com/
Feedbackify (free trial, then $19/month): http://www.feedbackify.com/
Ghostrec: http://www.ghostrec.com/
Concept Feedback: http://www.conceptfeedback.com/
UserBob: https://userbob.com

3. UI Design Patterns

Pttrns - Mobile User Interface Patterns: http://www.pttrns.com/
Pttrns Beta: http://beta.pttrns.com/
User Flow Patterns: http://userflowpatterns.com/
User Onboarding: http://useronboarding.com
iOS apps animated user flows: http://uxarchive.com/animated

4. Colours & Gradients

Adobe Color CC: https://color.adobe.com/create/color-wheel/
Color Scheme Designer: http://paletton.com/
Color Lovers: http://colorlovers.com
uiGradients: http://uigraduents.com
Subtle Patterns: http://subtlepatterns.com/
Material Design Color Palette Generator: http://www.materialpalette.com/
Blend - generate CSS3 gradients http://colinkeany.com/blend/

5. User & Profile Photos

UI Faces: http://uifaces.com/
Impor.io: http://www.impor.io/
Random User Generator: https://randomuser.me/
Facebox (paid collection, royalty-free): http://facebox.io/
Random Users Generator: http://www.designskilz.com/random-users/

6. Stock Photography

Little Visuals http://littlevisuals.co/
Unsplash http://unsplash.com/
Death to the Stock Photo http://join.deathtothestockphoto.com/
New Old Stock http://nos.twnsnd.co/
Superfamous (requires attribution) http://superfamous.com/
Picjumbo http://picjumbo.com/
The Pattern Library http://thepatternlibrary.com/
Gratisography http://www.gratisography.com/
Getrefe http://getrefe.tumblr.com/
IM Free (requires attribution) http://imcreator.com/free
Jay Mantri http://jaymantri.com/
Public Domain Archive http://publicdomainarchive.com/
Magdeleine http://magdeleine.co/
Foodiesfeed http://foodiesfeed.com
Picography http://picography.co/
Raumrot http://www.raumrot.com/10/
ISO Republic http://isorepublic.com/
All The Free Stock: http://allthefreestock.com
Pexels: http://www.pexels.com
Stocksy: http://www.stocksy.com/

7. Icons

NounProject: http://thenounproject.com/
Google Material Design Icons: https://github.com/google/material-design-icons/releases/tag/1.0.0
Flaticon (awesome): http://flaticon.com/

8. Fonts & Typography

Dafont: http://dafont.com
UseModify: http://usemodify.com/
Typewolf (Font inspiration, recommendations, and resources): http://www.typewolf.com
Golden Ratio Typography Calculator: http://www.pearsonified.com/typography/
Font pairings: http://fontsinuse.com/ http://www.typewolf.com/ http://www.typ.io/ http://blog.fontshop.com/category/great-pairs/ http://justmytype.co/ http://zurb.com/tavern/questions/what-are-your-top-5-go-to-fonts

9. Design Inspiration

Niice: http://niice.co
Codrops: http://tympanus.net/codrops/
Unmatched Style: http://unmatchedstyle.com
Product Hunt: http://www.producthunt.com/
Flat UI Design Showcase: http://fltdsgn.com/
http://thematboard.com/

10. Useful Tools

Dunnnk - Generate Device Mockups: http://dunnnk.com/
Pixelapse - Visual Version Control for Designers: https://www.pixelapse.com/
Screen Sizes (popular device screen dimensions): http://screensiz.es/phone
Am I Responsive?: http://ami.responsivedesign.is/
uilang - a minimal, ui-focused programming language for web designers: http://uilang.com/
Hologram - build and maintain beautiful style guides: http://trulia.github.io/hologram/

11. Form Handling & Mailers

http://mailthis.to/
https://www.elformo.com/
http://flipmail.co/
https://getsimpleform.com/

12. Resources & Guides

Design Kit: http://www.designkit.org/
User Research Techniques: http://designresearchtechniques.com/
Repository of Design Guidelines: http://findguidelin.es
Usability.gov: http://www.usability.gov/how-to-and-tools/index.html
CSS and JS Easing Animation Cheatsheet with snippets: http://easings.net
Google Material Design Guidelines: http://www.google.com/design/spec/material-design/introduction.html#
iPhone 6 Screens Demystified: http://www.paintcodeapp.com/news/iphone-6-screens-demystified
The 7 Deadly Sins of User Research: http://www.slideshare.net/dtravisphd/the-7-sins-of-user-research

Thanks, please add Figma (https://figma.com) to 1. Online Prototyping section.