Product Manager Design Resources (UPDATED 2014/11/20)

Matthew
Matthew
Nov 20, 2014 · 3 min read

Since getting into product management over a year ago, I’ve actively curated a list of design resources that I have found valuable and helped me create products that users love.

After a year, I’ve added over 30+ more resources and I hope this will help product managers whether they at the beginning of their careers or veterans create beautiful, simple & inspirational products.

Design Patterns

Pattern Tap: #patterns #uxhttp://patterntap.com/

Ui-Transitions: #transitions #uxhttp://www.ui-transitions.com/#home

Design Experiments: #experimentshttp://andrew-hoyer.com/

Captive Co iOS UI Animations: #ui #iOShttp://capptivate.co/

Responsive Email Patterns: #Emails #Responsivehttp://responsiveemailpatterns.com/

Good UI: #uihttp://goodui.org/?utm_source=NirAndFar&utm_campaign=d4d5d4d3f2-book_deal&utm_medium=email&utm_term=0_9f67e23487-d4d5d4d3f2-97572733&goal=0_9f67e23487-d4d5d4d3f2-97572733

Design Tools/Resource

Freelance Tools: #tools #freelancehttp://2013freelancetools.com/#dealing-with-money

HackDesign ToolKit: #toolshttps://hackdesign.org/toolkit/

UI Random Name Generator: #namehttp://uinames.com/

Typography Guide: #typographyhttp://www.typogui.de/

Image Color Palette Grabber: #colorhttp://lokeshdhakar.com/projects/color-thief/

Photos, Icons, Logos Resource: #photos #icons #logohttp://www.sitebuilderreport.com/blog/where-the-best-designers-go-to-find-photos-and-graphics

Create your own logo: #logo #squarespacehttp://www.squarespace.com/logo

Iconion: #icon #createyourownhttp://iconion.com/

iPad & iPhone Placement Templates: #iOS #iPhone #iPad #templatehttps://placeit.net/

Design Inspiration: #Inspirationhttp://www.sharpandnimble.com/design-lab/

Car-UX: #UX #Car #Inspirationhttp://car-ux.com/

CSS Vocabulary: #CSS #vocabulary #Examplehttp://pumpula.net/p/apps/css-vocabulary/

Design Storytelling: #Story #Periodichttp://designthroughstorytelling.net/periodic/

Icon Library: #iconhttp://thenounproject.com/

Can I Use: #Compatabilityhttp://caniuse.com/

Animate CSS: #CSS #animationshttp://daneden.github.io/animate.css/

UI Sounds: #soundshttp://raisedbeaches.com/octave/

Design Assets

https://creativemarket.com/best-of-2013

http://glyphsearch.com/

http://facebox.io/

http://iconmelon.com/#/

http://flatuicolors.com/

Flat UI Color Picker: #flatui #colorshttp://www.flatuicolorpicker.com/

http://tobiasahlin.com/spinkit/

Nasty Icons: #iconshttp://www.nastyicons.com/

Pattern Library: #backgroundshttp://thepatternlibrary.com/

Transparent Textures: #textureshttp://www.transparenttextures.com/

What’s the closest google font to: #font #googlehttp://joelcrawfordsmith.com/new/

Getty Images Stock Photos (Free): #photos #gettyimageshttp://www.gettyimages.com/

Top Free Fonts of 2014: #fonts #freehttp://www.awwwards.com/the-100-greatest-free-fonts-for-2014.html

Free Icons: #iconshttp://mariodelvalle.github.io/CaptainIconWeb/

Free Stock Images: #images #stockhttps://medium.com/design-ux/62ae4bcbe01b

Devices in full CSS: #CSS #deviceshttp://marvelapp.github.io/devices.css/

Stock Photos: #photoshttp://thestocks.im/

Stock Photo Collection: #photoshttp://designmodo.com/free-photos/

Hipster Photo Collection: #photos #hipsterhttp://www.raumrot.com/10/

Color Schemes: #colorhttp://coolors.co/def07c-92d432-63ad95-38786d-614c56

Designer Tests

http://pencilscoop.com/trendy-designer/index.html

http://nth-test.com/

https://litmus.com/

Design Scripts

http://madebyvadim.com/layrs/

http://bjork24.github.io/Unison/

http://oridomi.com/

http://wicky.nillia.ms/headroom.js/

CSS Spinner: #CSS #spinnerhttp://jh3y.github.io/-cs-spinner/

Mix-it-Up: #jquery #frontendhttps://mixitup.kunkalabs.com/

Magic Amination CSS3: #CSShttp://www.minimamente.com/example/magic_animations/

Grumpicon: #Inline #Iconhttp://www.grumpicon.com/

Design Blogs

http://bradfrostweb.com/

http://sidebar.io/

http://demosthenes.info/blog

http://www.lukew.com/ff/

http://wefunction.com/

http://kerem.co/blog

The Industry: #designhttp://theindustry.cc/

Geisha: #designinspiration #designhttp://geisha.io/app/

Niice: #designinspiration #design #searchenignehttp://niice.co/

Design Flows

http://uxarchive.com/

http://www.mobile-patterns.com/

http://pttrns.com/

http://www.useronboard.com/onboarding-teardowns/

http://emptystat.es/

First time experiences: #onboardinghttp://firsttimeux.tumblr.com/

Design Prototyping

https://popapp.in/

https://www.flinto.com/

https://marvelapp.com/

Jetstrap: #codeprotyping #bootstraphttps://jetstrap.com/

Framer: #JShttp://framerjs.com/

Short URL: #quickeditshttp://shrturl.co/

Relativewave: #iOS #nativehttp://www.relativewave.com/form.html

Design Feedback

https://usabilityhub.com/

Designer News

Hacker News of Design: #newshttps://news.layervault.com/

Design Portfolios

Dribble instant portfolios: #portfolio #dribble #designhttp://cmdspace.com/

Graphic #Designer and #Ilustratorhttp://stasdodesign.com/

F/E Frameworks Tools

Center anything one line: #CSS #frontendhttp://gridstylesheets.org/

Scroll Magic: #CSS #frontend #parallax #properties #dynamichttp://janpaepke.github.io/ScrollMagic/

MVCSS: #designarchitecturehttp://mvcss.github.io/

CSS Shadows: #CSS #Shadowshttp://bigspaceship.github.io/shine.js/

Design Guides

Magic of CSS: #CSShttp://adamschwartz.co/magic-of-css/

Google Web Development Guide: #Google #Webhttps://developers.google.com/web/fundamentals/

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store