19 KiB
19 KiB
Awesome Web Design !Awesome (https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg) (https://github.com/sindresorhus/awesome)
▐ A curated list of awesome resources for digital designers.
Check out my website (http://nicolesaidy.com) & blog (http://blog.nicolesaidy.com). ✨
Contents
- Blog & News (#blog--news)
- Inspiration (#inspiration)
- Colors (#colors)
- Typography (#typography)
- Icons (#icons)
- Images (#images)
- Guidelines (#guidelines)
- Design Tools (#design-tools)
- Prototype Tools (#prototype-tools)
- Tutorials (#tutorials)
- Books (#books)
- Productivity (#productivity)
- Slack Teams (#slack-teams)
Blog & News
⟡ Web Designer News (http://webdesignernews.com): The best curated stories for designers.
⟡ Marvel Blog (http://blog.marvelapp.com): The latest news, resources and thoughts from the Marvel team.
⟡ The Next Web (http://thenextweb.com/section/creative/): International technology news, business & culture.
⟡ Medium (https://medium.com/tag/web-design): A community of readers and writers offering unique perspectives on ideas large and small.
⟡ Creative Bloq (http://www.creativebloq.com/): Art & design inspiration.
⟡ Smashing Magazine (http://smashingmagazine.com): For professional web designers & developers.
⟡ Sitepoint (https://www.sitepoint.com/design-ux/): A hub for web developers & designers to share their passion for building incredible internet things.
⟡ Designer News (https://www.designernews.co/): Where the design community meets.
⟡ Reddit Web Design (https://www.reddit.com/r/web_design/): A place for designers to contribute useful posts, ask questions or engage in discussion.
⟡ Morning Reader (https://morningreader.com): Breaking tech news.
⟡ Google design (https://www.youtube.com/channel/UClKO7be7O9cUGL94PHnAeOA): Youtube channel featuring videos for designers about Google design.
Inspiration
⟡ Awwwards (http://awwwards.com): Best web design trends.
⟡ One Page Love (http://onepagelove.com): Design gallery showcasing the best Single Page websites.
⟡ Inspired UI (http://inspired-ui.com/): Mobile apps design patterns.
⟡ Behance (http://behance.net): Showcase & discover creative work.
⟡ Dribbble (http://dribbble.com): Show and tell for designers.
⟡ Product Hunt (http://producthunt.com): The place to discover your next favorite thing.
⟡ UI Movement (https://uimovement.com): The best UI design inspiration, every day.
⟡ Pttrns (http://pttrns.com/): The finest collection of design patterns, resources and inspiration.
Colors
⟡ Brandcolors (https://brandcolors.net/): Official colors for the world's biggest brands.
⟡ Adobe Color CC (https://color.adobe.com/): Create color schemes with the color wheel or browse thousands of color combinations from the Kuler community.
⟡ Paletton (http://paletton.com): A designer tool for creating color combinations that work together well.
⟡ Coolors (https://coolors.co/): Generate infinite color palettes for your designs.
⟡ Lol Colors (http://www.lolcolors.com/): Curated color palette inspiration.
⟡ Colordot (https://color.hailpixel.com/): A color picker for humans.
⟡ Gradients.io (http://www.gradients.io/): Curated gradients for designers & developers.
⟡ UI Gradients (http://uigradients.com/): Beautiful color gradients.
⟡ Colorzilla (http://colorzilla.com): Eyedropper, color picker, gradient generator.
Typography
⟡ Google Web Fonts (http://fonts.google.com): Offering an intuitive and robust directory of open source designer web fonts.
⟡ Font Face Ninja Browser Extension (http://fontface.ninja/): You’re browsing a website and you want to find the name of a font? Here comes the ninja!
⟡ Fontpair (http://fontpair.co): Beautiful Google Font combinations and pairs.
⟡ Type Anything (https://typeanything.io/): Create great font combinations.
⟡ Type Scale (http://type-scale.com/): Preview and choose the right type scale for your project.
⟡ WhatTheFont (https://www.myfonts.com/WhatTheFont/): Seen a font in an image and want to know what it is? WhatTheFont will find the closest match.
⟡ Typewolf (https://www.typewolf.com/): Comprehensive web typography info, suggestions for font alternatives, and links to usage in the wild.
⟡ Typ.io (http://typ.io/): Typography inspiration from real websites.
Icons
⟡ Flat Icon (http://flaticon.com): Thousands of free flat icons.
⟡ Font Awesome (http://fontawesome.io): The iconic font and CSS toolkit.
⟡ Icon Finder (http://iconfinder.com): 1 million free and premium icons.
⟡ The Noun Project (https://thenounproject.com/): Icons for Everything.
⟡ Favicon Generator (http://www.favicon-generator.org/): Favicon & app icon generator.
⟡ Freepik (http://freepik.com): Free vectors in different formats.
⟡ Vecteezy (http://vecteezy.com): A collection of free vector art, vector graphics, illustrator backgrounds, etc.
⟡ Material Icons (https://material.io/icons/): Free to use material design icons from Google.
⟡ Ionicons (http://ionicons.com/): The premium icon font for Ionic Framework.
Images
⟡ Pexels (https://pexels.com): Best free stock photos in one place.
⟡ Unsplash.it (http://unsplash.it): Placeholders using a beautiful image gallery.
⟡ Pixabay (https://pixabay.com/): High quality photos and illustrations free for commercial use.
⟡ Placehold.it (http://placehold.it): A quick and simple image placeholder service.
⟡ Imgur (http://imgur.com): The most awesome images on the internet.
⟡ Flickr (https://www.flickr.com): The home for all your photos.
Guidelines
⟡ iOS Human Interface Guidelines (https://developer.apple.com/ios/human-interface-guidelines/): Offers everything you need to design beautiful, engaging iOS apps.
⟡ Google Material Design (https://material.google.com/): A close look at the design, components & resources for Google's brand.
⟡ Laws of UX (https://lawsofux.com/): A collection of the maxims and principles that designers can consider when building user interfaces.
⟡ Ultimate Guide (https://www.moveoapps.com/ultimate-guide-to-mobile-app-design-principles): The ultimate guide to mobile app design principles that make your app shine.
⟡ GoodUI (http://www.goodui.org/): 5 Ways You Can Get A Better UI.
Design Tools
⟡ Sketch (http://sketchapp.com): A lightweight program for digital design for Mac.
⟡ Figma (http://figma.com): The collaborative interface design tool.
⟡ Adobe XD (https://www.adobe.com/products/experience-design.html): Prototyping & wireframing Tool.
⟡ inVision Studio (https://www.invisionapp.com/studio): Rapid prototyping, animation, built-in design systems, and collaboration.
⟡ Canva (http://canva.com): Amazingly simple graphic design software.
⟡ Framer X (https://framer.com/): Interaction Design and UX design software.
Prototype Tools
⟡ Zeplin (https://zeplin.io/): A great collaboration tool between designers and developers.
⟡ Avocode (https://avocode.com/): A workspace open to all designers and developers.
⟡ inVision (https://www.invisionapp.com/): The world's leading prototyping, collaboration & workflow platform.
⟡ Justinmind (http://justinmind.com): Prototype faster, communicate better, for web and mobile apps.
⟡ Marvel App (https://marvelapp.com/): Free mobile & web prototyping for designers.
⟡ Atomic.io (https://atomic.io/): Free in Browser interactive design Tool.
⟡ Flinto (https://www.flinto.com/): App to create interactive and animated prototypes of designs.
Tutorials
⟡ Treehouse (https://teamtreehouse.com/tracks/web-design): Brings affordable, technology education to people everywhere.
⟡ Tuts Plus Web Design Tutorials (http://webdesign.tutsplus.com/): Free web design and development tutorials.
⟡ Springboard (https://www.springboard.com): Personalized approach, designed to help you achieve your goals and advance your career.
⟡ Learn Sketch (https://www.sketchapp.com/learn/): Short videos and compiled invaluable resources to help you get started!
⟡ Adobe XD Guide (https://www.xdguru.com/adobe-xd-guide/): A 12,000-words-long comprehensive guide for XD beginners and current users.
Books
⟡ Web design playground (https://www.manning.com/books/web-design-playground/): A step by step guide from writing your first line of HTML to creating interesting, attractive web pages.
⟡ Don't make me think (https://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758)
⟡ The design of everyday things (https://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/1452654123)
⟡ 100 things every designer needs to know about people
(https://www.amazon.com/Things-Designer-People-Voices-Matter/dp/0321767535/ref=sr_1_1?s=books&ie=UTF8&qid=1419267906&sr=1-1&keywords=100+Things+Every+Designer+Needs+to+Know?utm_source=CMblo
g&utm_medium=post&utm_campaign=blog_)
Productivity
⟡ Pomodoro (http://tomato-timer.com): A cool time management technique for a more productive way to work and study.
⟡ Toggl (http://toggl.com): Time tracker to improve workplace productivity.
⟡ Trello (http://trello.com): Organize and prioritize your projects in a fun, flexible and rewarding way.
⟡ RescueTime (https://www.rescuetime.com): Helps you understand your daily habits so you can focus and be more productive.
⟡ Qbserve (https://qotoqot.com/qbserve/): Automatic time tracking, invoicing, and real-time productivity feedback.
⟡ Paste (http://pasteapp.me/): A smart clipboard history manager for Mac.
⟡ Sip (http://sipapp.io/): A color picker for Mac.
⟡ Timing (https://timingapp.com/): Automatic time and productivity tracking for Mac.
⟡ Taskade (https://taskade.com/): Collaborative task lists and outlines for teams.
Slack Teams
⟡ Team Sketch (http://teamsketch.io): A community for Sketch designers powered by Slack
⟡ Designer Hangout (https://www.designerhangout.co): A place where UXers from around the world discuss user experience.
⟡ Design Talks
(https://docs.google.com/forms/d/e/1FAIpQLSeKT_LC8kKTzJ4JjmgVQVpfl24i1qBkjJ7TYyQcNHL7fBQkYQ/viewform?c=0&w=1): A community for UI/UX design, web design, freelancing, design critiques, etc.
⟡ TheDesignerShip (http://thedesignership.com/): A community of over 1,500+ designers and founders.
Share
⟡
⟡
License
!CC0 (http://mirrors.creativecommons.org/presskit/buttons/88x31/svg/cc-zero.svg) (https://creativecommons.org/publicdomain/zero/1.0/)
▐ A curated list of awesome resources for digital designers.
Check out my website (http://nicolesaidy.com) & blog (http://blog.nicolesaidy.com). ✨
Contents
- Blog & News (#blog--news)
- Inspiration (#inspiration)
- Colors (#colors)
- Typography (#typography)
- Icons (#icons)
- Images (#images)
- Guidelines (#guidelines)
- Design Tools (#design-tools)
- Prototype Tools (#prototype-tools)
- Tutorials (#tutorials)
- Books (#books)
- Productivity (#productivity)
- Slack Teams (#slack-teams)
Blog & News
⟡ Web Designer News (http://webdesignernews.com): The best curated stories for designers.
⟡ Marvel Blog (http://blog.marvelapp.com): The latest news, resources and thoughts from the Marvel team.
⟡ The Next Web (http://thenextweb.com/section/creative/): International technology news, business & culture.
⟡ Medium (https://medium.com/tag/web-design): A community of readers and writers offering unique perspectives on ideas large and small.
⟡ Creative Bloq (http://www.creativebloq.com/): Art & design inspiration.
⟡ Smashing Magazine (http://smashingmagazine.com): For professional web designers & developers.
⟡ Sitepoint (https://www.sitepoint.com/design-ux/): A hub for web developers & designers to share their passion for building incredible internet things.
⟡ Designer News (https://www.designernews.co/): Where the design community meets.
⟡ Reddit Web Design (https://www.reddit.com/r/web_design/): A place for designers to contribute useful posts, ask questions or engage in discussion.
⟡ Morning Reader (https://morningreader.com): Breaking tech news.
⟡ Google design (https://www.youtube.com/channel/UClKO7be7O9cUGL94PHnAeOA): Youtube channel featuring videos for designers about Google design.
Inspiration
⟡ Awwwards (http://awwwards.com): Best web design trends.
⟡ One Page Love (http://onepagelove.com): Design gallery showcasing the best Single Page websites.
⟡ Inspired UI (http://inspired-ui.com/): Mobile apps design patterns.
⟡ Behance (http://behance.net): Showcase & discover creative work.
⟡ Dribbble (http://dribbble.com): Show and tell for designers.
⟡ Product Hunt (http://producthunt.com): The place to discover your next favorite thing.
⟡ UI Movement (https://uimovement.com): The best UI design inspiration, every day.
⟡ Pttrns (http://pttrns.com/): The finest collection of design patterns, resources and inspiration.
Colors
⟡ Brandcolors (https://brandcolors.net/): Official colors for the world's biggest brands.
⟡ Adobe Color CC (https://color.adobe.com/): Create color schemes with the color wheel or browse thousands of color combinations from the Kuler community.
⟡ Paletton (http://paletton.com): A designer tool for creating color combinations that work together well.
⟡ Coolors (https://coolors.co/): Generate infinite color palettes for your designs.
⟡ Lol Colors (http://www.lolcolors.com/): Curated color palette inspiration.
⟡ Colordot (https://color.hailpixel.com/): A color picker for humans.
⟡ Gradients.io (http://www.gradients.io/): Curated gradients for designers & developers.
⟡ UI Gradients (http://uigradients.com/): Beautiful color gradients.
⟡ Colorzilla (http://colorzilla.com): Eyedropper, color picker, gradient generator.
Typography
⟡ Google Web Fonts (http://fonts.google.com): Offering an intuitive and robust directory of open source designer web fonts.
⟡ Font Face Ninja Browser Extension (http://fontface.ninja/): You’re browsing a website and you want to find the name of a font? Here comes the ninja!
⟡ Fontpair (http://fontpair.co): Beautiful Google Font combinations and pairs.
⟡ Type Anything (https://typeanything.io/): Create great font combinations.
⟡ Type Scale (http://type-scale.com/): Preview and choose the right type scale for your project.
⟡ WhatTheFont (https://www.myfonts.com/WhatTheFont/): Seen a font in an image and want to know what it is? WhatTheFont will find the closest match.
⟡ Typewolf (https://www.typewolf.com/): Comprehensive web typography info, suggestions for font alternatives, and links to usage in the wild.
⟡ Typ.io (http://typ.io/): Typography inspiration from real websites.
Icons
⟡ Flat Icon (http://flaticon.com): Thousands of free flat icons.
⟡ Font Awesome (http://fontawesome.io): The iconic font and CSS toolkit.
⟡ Icon Finder (http://iconfinder.com): 1 million free and premium icons.
⟡ The Noun Project (https://thenounproject.com/): Icons for Everything.
⟡ Favicon Generator (http://www.favicon-generator.org/): Favicon & app icon generator.
⟡ Freepik (http://freepik.com): Free vectors in different formats.
⟡ Vecteezy (http://vecteezy.com): A collection of free vector art, vector graphics, illustrator backgrounds, etc.
⟡ Material Icons (https://material.io/icons/): Free to use material design icons from Google.
⟡ Ionicons (http://ionicons.com/): The premium icon font for Ionic Framework.
Images
⟡ Pexels (https://pexels.com): Best free stock photos in one place.
⟡ Unsplash.it (http://unsplash.it): Placeholders using a beautiful image gallery.
⟡ Pixabay (https://pixabay.com/): High quality photos and illustrations free for commercial use.
⟡ Placehold.it (http://placehold.it): A quick and simple image placeholder service.
⟡ Imgur (http://imgur.com): The most awesome images on the internet.
⟡ Flickr (https://www.flickr.com): The home for all your photos.
Guidelines
⟡ iOS Human Interface Guidelines (https://developer.apple.com/ios/human-interface-guidelines/): Offers everything you need to design beautiful, engaging iOS apps.
⟡ Google Material Design (https://material.google.com/): A close look at the design, components & resources for Google's brand.
⟡ Laws of UX (https://lawsofux.com/): A collection of the maxims and principles that designers can consider when building user interfaces.
⟡ Ultimate Guide (https://www.moveoapps.com/ultimate-guide-to-mobile-app-design-principles): The ultimate guide to mobile app design principles that make your app shine.
⟡ GoodUI (http://www.goodui.org/): 5 Ways You Can Get A Better UI.
Design Tools
⟡ Sketch (http://sketchapp.com): A lightweight program for digital design for Mac.
⟡ Figma (http://figma.com): The collaborative interface design tool.
⟡ Adobe XD (https://www.adobe.com/products/experience-design.html): Prototyping & wireframing Tool.
⟡ inVision Studio (https://www.invisionapp.com/studio): Rapid prototyping, animation, built-in design systems, and collaboration.
⟡ Canva (http://canva.com): Amazingly simple graphic design software.
⟡ Framer X (https://framer.com/): Interaction Design and UX design software.
Prototype Tools
⟡ Zeplin (https://zeplin.io/): A great collaboration tool between designers and developers.
⟡ Avocode (https://avocode.com/): A workspace open to all designers and developers.
⟡ inVision (https://www.invisionapp.com/): The world's leading prototyping, collaboration & workflow platform.
⟡ Justinmind (http://justinmind.com): Prototype faster, communicate better, for web and mobile apps.
⟡ Marvel App (https://marvelapp.com/): Free mobile & web prototyping for designers.
⟡ Atomic.io (https://atomic.io/): Free in Browser interactive design Tool.
⟡ Flinto (https://www.flinto.com/): App to create interactive and animated prototypes of designs.
Tutorials
⟡ Treehouse (https://teamtreehouse.com/tracks/web-design): Brings affordable, technology education to people everywhere.
⟡ Tuts Plus Web Design Tutorials (http://webdesign.tutsplus.com/): Free web design and development tutorials.
⟡ Springboard (https://www.springboard.com): Personalized approach, designed to help you achieve your goals and advance your career.
⟡ Learn Sketch (https://www.sketchapp.com/learn/): Short videos and compiled invaluable resources to help you get started!
⟡ Adobe XD Guide (https://www.xdguru.com/adobe-xd-guide/): A 12,000-words-long comprehensive guide for XD beginners and current users.
Books
⟡ Web design playground (https://www.manning.com/books/web-design-playground/): A step by step guide from writing your first line of HTML to creating interesting, attractive web pages.
⟡ Don't make me think (https://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758)
⟡ The design of everyday things (https://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/1452654123)
⟡ 100 things every designer needs to know about people
(https://www.amazon.com/Things-Designer-People-Voices-Matter/dp/0321767535/ref=sr_1_1?s=books&ie=UTF8&qid=1419267906&sr=1-1&keywords=100+Things+Every+Designer+Needs+to+Know?utm_source=CMblo
g&utm_medium=post&utm_campaign=blog_)
Productivity
⟡ Pomodoro (http://tomato-timer.com): A cool time management technique for a more productive way to work and study.
⟡ Toggl (http://toggl.com): Time tracker to improve workplace productivity.
⟡ Trello (http://trello.com): Organize and prioritize your projects in a fun, flexible and rewarding way.
⟡ RescueTime (https://www.rescuetime.com): Helps you understand your daily habits so you can focus and be more productive.
⟡ Qbserve (https://qotoqot.com/qbserve/): Automatic time tracking, invoicing, and real-time productivity feedback.
⟡ Paste (http://pasteapp.me/): A smart clipboard history manager for Mac.
⟡ Sip (http://sipapp.io/): A color picker for Mac.
⟡ Timing (https://timingapp.com/): Automatic time and productivity tracking for Mac.
⟡ Taskade (https://taskade.com/): Collaborative task lists and outlines for teams.
Slack Teams
⟡ Team Sketch (http://teamsketch.io): A community for Sketch designers powered by Slack
⟡ Designer Hangout (https://www.designerhangout.co): A place where UXers from around the world discuss user experience.
⟡ Design Talks
(https://docs.google.com/forms/d/e/1FAIpQLSeKT_LC8kKTzJ4JjmgVQVpfl24i1qBkjJ7TYyQcNHL7fBQkYQ/viewform?c=0&w=1): A community for UI/UX design, web design, freelancing, design critiques, etc.
⟡ TheDesignerShip (http://thedesignership.com/): A community of over 1,500+ designers and founders.
Share
⟡
⟡
License
!CC0 (http://mirrors.creativecommons.org/presskit/buttons/88x31/svg/cc-zero.svg) (https://creativecommons.org/publicdomain/zero/1.0/)