1037 lines
55 KiB
HTML
1037 lines
55 KiB
HTML
<h1 id="awesome-design">Awesome Design</h1>
|
||
<p><a href="https://github.com/sindresorhus/awesome"><img
|
||
src="https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg"
|
||
alt="Awesome" /></a> <a
|
||
href="https://travis-ci.org/gztchan/awesome-design"><img
|
||
src="https://travis-ci.org/gztchan/awesome-design.svg?branch=master"
|
||
alt="Build Status" /></a> <a
|
||
href="https://github.com/gztchan/awesome-design/pulls"><img
|
||
src="https://img.shields.io/badge/PRs%20&%20Issues-welcome-brightgreen.svg"
|
||
alt="PRs & Issues Welcome" /></a></p>
|
||
<blockquote>
|
||
<p>Awesome Design focuses on collecting high quality resources and tools
|
||
which can be used by UI/UX designers in daily work. Thanks to the
|
||
community, the repo keeps being updated continuously from people around
|
||
the world who provide amazing resources. Don’t hesitate to open an <a
|
||
href="https://github.com/gztchan/awesome-design/issues/new">issue</a> or
|
||
create <a href="https://github.com/gztchan/awesome-design/pulls">pull
|
||
request</a> to share your intelligence.</p>
|
||
</blockquote>
|
||
<figure>
|
||
<img src="/design.png" alt="design" />
|
||
<figcaption aria-hidden="true">design</figcaption>
|
||
</figure>
|
||
<h4 id="what-should-i-do-with-the-curated-resources">What should I do
|
||
with the curated resources?</h4>
|
||
<p>People, including developers, designers, scientists and others,
|
||
create awesome things every single day. To be honest, we who are not
|
||
superheroes, can’t know all best things from the world. So, for saving
|
||
your time, i suggest you to pick those you like, take benefits from
|
||
them, and finally put it into your kit. :smile:</p>
|
||
<h4 id="contents">Contents</h4>
|
||
<p><strong>Get things done</strong></p>
|
||
<ul>
|
||
<li><a href="#stock">Stock</a></li>
|
||
<li><a href="#icon-and-logo">Icon and Logo</a></li>
|
||
<li><a href="#color">Color</a></li>
|
||
<li><a href="#typography">Typography</a></li>
|
||
<li><a href="#toolkit">Toolkit</a></li>
|
||
<li><a href="#prototyping">Prototyping</a></li>
|
||
<li><a href="#mockup">Mockup</a></li>
|
||
<li><a href="#user-testing">User Testing</a></li>
|
||
</ul>
|
||
<p><strong>Concepts</strong></p>
|
||
<ul>
|
||
<li><a href="#read-and-digest">Read and Digest</a></li>
|
||
<li><a href="#styleguide-and-branding">Styleguide and Branding</a></li>
|
||
<li><a href="#tutorial">Tutorial</a></li>
|
||
<li><a href="#book">Book</a></li>
|
||
<li><a href="#award">Award</a></li>
|
||
<li><a href="#conference-and-festival">Conference and Festival</a></li>
|
||
<li><a href="#podcast">Podcast</a></li>
|
||
<li><a href="#community">Community</a></li>
|
||
</ul>
|
||
<h2 id="stock">Stock</h2>
|
||
<ul>
|
||
<li><a href="http://albumarium.com/">Albumarium</a> “The best place to
|
||
find & share beautiful images.”</li>
|
||
<li><a href="http://thestocks.im/">The Stocks</a> “The best royalty free
|
||
stock photos are delivered now along with videos, audios, icons, fonts
|
||
and colors.”</li>
|
||
<li><a href="http://www.polayoutu.com/collections">Polayoutu</a> is
|
||
community of photographers based in China who contribute photos under
|
||
the Creative Common Zero License. 🌟</li>
|
||
<li><a href="http://illusion.scene360.com/">Illusion</a></li>
|
||
<li><a href="http://www.baubauhaus.com/">Baubauhaus</a> feed your daily
|
||
need of design, illustration, photography, fashion and of all else
|
||
art-related.</li>
|
||
<li><a href="https://web.500px.com/">500px</a> over 15 million
|
||
photographers from 195 countries. 🌟</li>
|
||
<li><a href="https://1x.com/">1x</a> Shop wall art by 16000+ Curated
|
||
Artists. 🌟</li>
|
||
<li><a href="http://www.lifeofpix.com/">LIFE OF PIX</a> Free
|
||
high-resolution photos, no copyrights restrictions for personal and
|
||
commercial use.</li>
|
||
<li><a href="https://unsplash.com/">Unsplash</a></li>
|
||
<li><a href="http://stokpic.com/">Stokpic</a></li>
|
||
<li><a
|
||
href="https://www.howtostartanllc.org/free-stock-photos/">Raumrot</a></li>
|
||
<li><a href="http://deathtothestockphoto.com/">Death to Stock</a></li>
|
||
<li><a href="http://www.gratisography.com/">Gratisography</a> “The
|
||
world’s quirkiest collection of high-resolution free stock images.”</li>
|
||
<li><a href="https://picjumbo.com/">picjumbo</a> Download free stock
|
||
photos, backgrounds and images in high‑resolution for personal and
|
||
commercial use.</li>
|
||
<li><a href="https://magdeleine.co/browse/">Magdeleine</a> Hand-picked
|
||
free photos for your inspiration.</li>
|
||
<li><a href="https://www.pexels.com/">Pexels</a> “The best free stock
|
||
photos & videos shared by talented creators.”</li>
|
||
<li><a href="http://imcreator.com/">imcreator</a></li>
|
||
<li><a href="http://startupstockphotos.com/">Startup Stock Photos</a>
|
||
Free photos for startups, bloggers, publishers, websites, designers,
|
||
developers, creators, & everyone else.</li>
|
||
<li><a href="http://nos.twnsnd.co/">New Old Stock Photos</a> Vintage
|
||
photos from the public archives, free of known copyright restrictions.
|
||
recapturing history.</li>
|
||
<li><a href="http://realisticshots.com/">Realistics Shots</a> Free stock
|
||
photos (high resolution) for personal and commercial use. 7 new photos
|
||
every week.</li>
|
||
<li><a href="https://www.splitshire.com/">SplitShire</a> Free stock
|
||
photos for commercial use.</li>
|
||
<li><a href="http://fancycrave.com/">FancyCrave</a> Free travel photos
|
||
for commercial use.</li>
|
||
<li><a href="https://libreshot.com/">LIBRESHOT</a> Free fine art and
|
||
ordinary photography. Free images for blogs or websites even for
|
||
commercial use. No need to mention the author.</li>
|
||
<li><a href="https://barnimages.com/">BARNIMAGES</a> Free
|
||
high-resolution images for everyone.</li>
|
||
<li><a href="https://mmtstock.com/">MMT</a> Free photos and videos for
|
||
commercial use.</li>
|
||
<li><a href="http://jaymantri.com/">JAY MANTRI</a> free pics. do
|
||
anything(CC0). make magic.</li>
|
||
<li><a href="https://www.foodiesfeed.com/">FoodiesFeed</a> is a resource
|
||
of awesome naturally looking food photos that are completely free to
|
||
download.</li>
|
||
<li><a href="http://littlevisuals.co/">Little Visuals</a></li>
|
||
<li><a href="http://photos.bucketlistly.com/">Bucketlistly Blog</a> A
|
||
free creative commons (Attribution-NonCommercial) collection of over
|
||
8000+ travel photos from all over the world anyone can use.</li>
|
||
<li><a href="https://www.pinterest.com/">Pinterest</a> is a social media
|
||
web and mobile application company that operates a software system
|
||
designed to discover information on the World Wide Web. 🌟</li>
|
||
<li><a href="https://pixabay.com/">pixabay</a> Over 1 million+ high
|
||
quality stock images and videos shared by our talented community.</li>
|
||
<li><a href="https://depositphotos.com/">depositphotos</a> Over 100
|
||
million high-quality royalty-free stock images and high-definition
|
||
footage at the best prices to fill all your creative needs.</li>
|
||
<li><a href="https://www.stocksy.com">Stocksy</a> is home to a highly
|
||
curated collection of royalty-free stock photography and video footage
|
||
that is beautiful, distinctive, and highly usable.</li>
|
||
<li><a href="http://butdoesitfloat.com/">butdoesitfloat</a></li>
|
||
<li><a href="http://allthefreestock.com/">AllTheFreeStock</a></li>
|
||
<li><a href="https://uifaces.co/">UI Faces</a> UI Faces aggregates
|
||
thousands of avatars which you can carefully filter to create your
|
||
perfect personas or just generate random avatars.</li>
|
||
</ul>
|
||
<h2 id="color">Color</h2>
|
||
<ul>
|
||
<li><a href="https://coolors.co/">Coolors</a> The super fast color
|
||
schemes generator!</li>
|
||
<li><a href="https://color.hailpixel.com/">Colordot</a></li>
|
||
<li><a href="https://brandcolors.net/">Brand Colors</a> The biggest
|
||
collection of official brand color codes around.</li>
|
||
<li><a href="https://www.materialpalette.com/">Material Design
|
||
Palette</a></li>
|
||
<li><a href="http://www.flatuicolorpicker.com/">Flat UI Color
|
||
Picker</a></li>
|
||
<li><a href="https://www.webdesignrankings.com/resources/lolcolors/">LOL
|
||
COLORS</a> Curated color palette inspiration.</li>
|
||
<li><a href="http://www.thedayscolor.com/">The Day’s Color</a> is to
|
||
find colorful inspiration from things that surround us. Daily.</li>
|
||
<li><a href="http://colorclaim.tumblr.com/">Color Claim</a></li>
|
||
<li><a href="http://colorhunt.co/">Color Hunt</a> is a free and open
|
||
platform for color inspiration with thousands of trendy hand-picked
|
||
color palettes.</li>
|
||
<li><a href="http://colours.neilorangepeel.com/">CSS Colours
|
||
Name</a></li>
|
||
<li><a href="http://rgb.to/">rgb.to</a></li>
|
||
<li><a href="http://www.colourco.de/">Color Code</a></li>
|
||
<li><a
|
||
href="http://www.webpagefx.com/web-design/hex-to-rgb/">Colorrrs</a></li>
|
||
<li><a href="http://nipponcolors.com/">Nippon Colors</a></li>
|
||
<li><a href="https://alexbeals.com/projects/colorize/">Colorize</a> is a
|
||
website that turns any word or phrase into a hex color.</li>
|
||
<li><a href="http://jxnblk.com/hello-color/">Hello Color</a></li>
|
||
<li><a href="http://www.colorlisa.com/">Color Lisa</a> is a curated list
|
||
of color palettes based on masterpieces of the worlds greatest
|
||
artists.</li>
|
||
<li><a href="https://colordrop.io/">ColorDrop</a></li>
|
||
<li><a href="http://www.colorfavs.com/">colorfavs</a> a place that made
|
||
it easy to create and discover new colors and palettes for all of your
|
||
projects.</li>
|
||
<li><a href="https://uigradients.com/">uiGradients</a></li>
|
||
<li><a href="http://htmlcolorcodes.com/">HTML Color Codes</a> Get HTML
|
||
color codes, Hex color codes, RGB and HSL values with our color picker,
|
||
color chart and HTML color names.</li>
|
||
<li><a href="http://palettr.com/">palettr</a> is a web tool for
|
||
designers.</li>
|
||
<li><a href="http://paletton.com/">Paletton</a></li>
|
||
<li><a href="http://www.palettable.io/">Palettable</a> Generate
|
||
beautiful color palettes using the knowledge of millions of
|
||
designers.</li>
|
||
<li><a href="https://picular.co/">Picular</a></li>
|
||
<li><a href="https://colorable.jxnblk.com/">Colorable</a> “If one says
|
||
‘Red’ (the name of the color) and there are 50 people listening, it can
|
||
be expected that there will be 50 reds in their minds. And one can be
|
||
sure that all these reds will be very different.” – Josef Albers</li>
|
||
<li><a href="https://material.io/guidelines/style/color.html">Google
|
||
Colors</a> The Material Design color system can be used to create a
|
||
color theme that reflects your brand or style.</li>
|
||
<li><a href="https://webgradients.com/">WebGradients</a> Free collection
|
||
of 180 linear gradients that you can use as content backdrops in any
|
||
part of your website.</li>
|
||
<li><a href="http://zhongguose.com">Chinese Colors</a> is a collection
|
||
of Chinese traditional colors.</li>
|
||
<li><a href="https://gradienta.io/">Gradienta</a> Multicolor CSS
|
||
Gradients, JPG Downloads, 100% Free!</li>
|
||
<li><a href="https://verandacolor.com">Veranda Color</a> Browse color
|
||
palettes made by other designers, generate and submit your own.</li>
|
||
</ul>
|
||
<h2 id="icon-and-logo">Icon and Logo</h2>
|
||
<ul>
|
||
<li><a href="http://macosicongallery.com/">macOS Icon Gallery</a></li>
|
||
<li><a href="https://icon54.com">icon54</a></li>
|
||
<li><a href="https://icons8.com/">icons8</a></li>
|
||
<li><a href="https://www.iconfinder.com/">Iconfinder</a> provides
|
||
high-quality icons to millions of creative professionals.</li>
|
||
<li><a href="http://icondock.com/">icon dock</a></li>
|
||
<li><a href="https://genericons.com/">Genericons Neue</a> generic
|
||
looking icons, suitable for a blog or simple website.</li>
|
||
<li><a href="http://flaticons.net/">FlatIcons.net</a> is a free flat
|
||
icon maker.</li>
|
||
<li><a href="http://www.flaticon.com/">FLATICON</a></li>
|
||
<li><a href="http://evil-icons.io/">Evil Icons</a> Simple and clean SVG
|
||
icon pack with the code to support Rails, Sprockets, Node.js, Gulp,
|
||
Grunt and CDN.</li>
|
||
<li><a href="http://typicons.com/">Typeicons</a> are free-to-use vector
|
||
icons embedded in a webfont for easy use in any UI, whether it be on the
|
||
web or in a native app.</li>
|
||
<li><a href="https://thenounproject.com/">The Noun Project</a></li>
|
||
<li><a href="https://nucleoapp.com/">Nucleoapp</a> is a beautiful
|
||
library of 27500 icons, and a powerful application to collect, customize
|
||
and export all your icons.</li>
|
||
<li><a href="https://picons.me/">Picons</a> Vector Icons for iOS,
|
||
Android, Websites & Apps. Icons designed to perfection.</li>
|
||
<li><a href="http://pictos.cc/">Pictos</a> is back once again with
|
||
Redux: all new carefully crafted interface icons. Each icon in Redux has
|
||
three variations: Line, Solid & Color.</li>
|
||
<li><a href="https://smashicons.com/">Smashicons</a> is the largest and
|
||
most distinct Icon Pack in the World. Smashicons offers the simplest,
|
||
effortless way to use icons.</li>
|
||
<li><a href="https://symbolset.com/icons">Symbolset</a></li>
|
||
<li><a href="http://logofaves.com/">logofaves</a></li>
|
||
<li><a href="http://logooftheday.com/">Logo of the day</a></li>
|
||
<li><a href="https://www.logomoose.com/">LogoMoose</a> is a logo
|
||
inspiration and design community showcasing logos submitted by
|
||
professional logo designers.</li>
|
||
<li><a href="http://logospire.com/">Logospire</a> is a logo inspiration
|
||
gallery.</li>
|
||
<li><a href="http://thesquid.ink">Squid.ink</a></li>
|
||
<li><a href="http://game-icons.net/">Game Icons</a></li>
|
||
<li><a href="http://svgicons.sparkk.fr/">svgicons.sparkk.fr</a></li>
|
||
<li><a href="https://materialdesignicons.com/">Material Design
|
||
Icons</a></li>
|
||
<li><a
|
||
href="http://zavoloklom.github.io/material-design-iconic-font/index.html">Material
|
||
Design Iconic Font</a> is a full suite of material design icons (created
|
||
and maintained by Google) with additional community-designed and brands
|
||
icons for easy scalable vector graphics on websites or desktop.</li>
|
||
<li><a href="http://danklammer.com/bytesize-icons/">Bytesize</a> is a
|
||
tiny style-controlled SVG iconset.</li>
|
||
<li><a href="http://www.webalys.com/nova/index.html">NOVA Material
|
||
Design Icons</a> 4,000 vector icons provided in two styles: Line and
|
||
Solid.</li>
|
||
<li><a href="https://freeiconshop.com/">Free Icon Shop</a> is a large
|
||
collection of beautiful free icons in vector formats. All icons are
|
||
commercially free to use. Download free icons in PNG, SVG, Ai or PSD
|
||
formats.</li>
|
||
<li><a href="https://simpleicons.org/">Simple Icons</a> Free SVG icons
|
||
for popular brands.</li>
|
||
<li><a href="https://iconmonstr.com/">iconmonstr</a> Free, monstrously
|
||
big and continuously growing source of simple icons run by one
|
||
creator.</li>
|
||
<li><a href="https://octicons.github.com/">Octions</a> GitHub’s
|
||
icons.</li>
|
||
<li><a href="http://weloveiconfonts.com/">We Love Icon Fonts</a></li>
|
||
<li><a href="https://iconstore.co/">IconStore</a> Free icons by
|
||
first-class designers.</li>
|
||
<li><a href="https://design.google.com/icons/">Google Material Icons</a>
|
||
Material icons are delightful, beautifully crafted symbols for common
|
||
actions and items. 🌟</li>
|
||
<li><a href="http://fontawesome.io/">Font Awesome</a> Get vector icons
|
||
and social logos on your website with Font Awesome, the web’s most
|
||
popular icon set and toolkit. 🌟</li>
|
||
<li><a href="https://icomoon.io/">IconMoon</a> Pixel perfect icon
|
||
solutions.</li>
|
||
<li><a href="http://saeedalipoor.github.io/icono/">ICONO</a> pure css
|
||
icons, with only one element.</li>
|
||
<li><a href="http://leungwensen.github.io/svg-icon/">svg-icon</a> is an
|
||
ultimate SVG icons collection done right.</li>
|
||
<li><a href="http://www.iconfont.cn/">Iconfont+</a> 阿里妈妈 MUX
|
||
倾力打造的矢量图标管理、交流平台。</li>
|
||
<li><a href="http://coreui.io/icons/">CoreUI Icons</a> Premium designed
|
||
free icon set with marks in SVG, Webfont and raster formats.</li>
|
||
</ul>
|
||
<h2 id="typography">Typography</h2>
|
||
<ul>
|
||
<li><a href="https://www.typography.com/">typography</a></li>
|
||
<li><a href="http://ilovetypography.com/">i love typography</a> was born
|
||
on August 7, 2007. It exists because I have a passion for typography,
|
||
type design, and lettering, and for the pages, words, and letters born
|
||
of those disciplines.</li>
|
||
<li><a href="https://www.typeisbeautiful.com/">Type is Beautiful</a>
|
||
是一个关于文字设计和视觉文化的媒体计划。我们关注的话题包括字体、排版、平面设计、公共设计、技术和视觉文化。</li>
|
||
<li><a href="http://practicaltypography.com/">Butterick’s Practical
|
||
Typography</a></li>
|
||
<li><a href="https://www.fonts.com/">Fonts</a> store from Monotype
|
||
offers more than 150,000 desktop and Web font products for you to
|
||
preview, purchase and download. You can also learn about new typeface
|
||
releases and discover typographic tips and techniques.</li>
|
||
<li><a href="https://www.fontsquirrel.com/">Font Squirrel</a> 100% free
|
||
for commercial use.</li>
|
||
<li><a href="https://www.typewolf.com/">Typewolf</a> what’s trending in
|
||
type.</li>
|
||
<li><a href="http://typenovel.tumblr.com/">Type Novel</a></li>
|
||
<li><a href="https://fontsinuse.com/">Fonts In Use</a> is a public
|
||
archive of typography indexed by typeface, format, industry, and
|
||
period.</li>
|
||
<li><a href="http://www.myfonts.com/">My Fonts</a></li>
|
||
<li><a href="https://www.thedesignersfoundry.com/">The Designers
|
||
Foundry</a></li>
|
||
<li><a href="https://fonts.adobe.com/fonts">Adobe Fonts</a> Enjoy quick
|
||
browsing, easy use in desktop applications or on the web, and endless
|
||
typographic inspiration.</li>
|
||
<li><a href="https://fonts.google.com/">Google Fonts</a></li>
|
||
<li><a href="https://femmebot.github.io/google-type/">Google Font
|
||
Combinations</a></li>
|
||
<li><a href="http://blog.justfont.com/">justfont</a>
|
||
是新世代字型設計暨推廣教育團隊,致力於培育台灣下一代的設計力量。</li>
|
||
<li><a href="http://katydecorah.com/font-library/">Font Library</a></li>
|
||
<li><a href="http://www.typogui.de/">Type Guide</a> A Pocket Guide to
|
||
Master Every Day’s Typographic Adventures.</li>
|
||
<li><a href="https://wordmark.it/">workmark</a></li>
|
||
<li><a href="http://fontfling.com/">fontfling</a></li>
|
||
<li><a href="http://www.glyphrstudio.com/online/">Glyphr Studio</a></li>
|
||
<li><a href="http://www.losttype.com/browse/">Lost Type</a> is a
|
||
collaborative digital type foundry.</li>
|
||
<li><a href="http://brick.im/">Brick</a></li>
|
||
<li><a href="https://vllg.com/">Village</a></li>
|
||
<li><a href="https://klim.co.nz/">Klim</a></li>
|
||
<li><a href="https://www.milieugrotesque.com/">Milieu Grotesque</a> is
|
||
an independent type foundry, offering an exclusive library of digital
|
||
typefaces and related products.</li>
|
||
<li><a href="https://lineto.com/">Lineto</a></li>
|
||
<li><a href="https://www.colophon-foundry.org/">Colophon</a> is an
|
||
international, award-winning type foundry based in London (UK) and Los
|
||
Angeles (US).</li>
|
||
<li><a href="https://www.t26.com/">T26</a></li>
|
||
<li><a href="https://typ.io">Typ.io</a> at Typ.io, we’re revealing
|
||
designers’ decisions for all to see; peeking under the hood of beautiful
|
||
websites to find out what fonts they’re using and how they’re using
|
||
them.</li>
|
||
<li><a href="https://www.typenetwork.com/">TypeNetwork</a></li>
|
||
<li><a href="https://www.theleagueofmoveabletype.com/">The League of
|
||
Moveable Type</a></li>
|
||
</ul>
|
||
<h2 id="toolkit">Toolkit</h2>
|
||
<ul>
|
||
<li><a href="https://www.sketchapp.com/">Sketch</a> is a platform to
|
||
empower designers to share and collaborate on their designs and work
|
||
better, together. <a
|
||
href="http://developer.sketchapp.com/">Developer</a>, <a
|
||
href="https://www.sketchappsources.com/">Sketch App Sources</a>, <a
|
||
href="https://sketchrepo.com/">Sketch Repo</a>, <a
|
||
href="https://github.com/sketchplugins/plugin-directory">Sketch
|
||
Plugins</a>, <a href="http://sketch.im/">Sketch.im</a>.🌟</li>
|
||
<li><a href="http://www.adobe.com/products/photoshop.html">Adobe
|
||
Photoshop</a> Best imaging and design app is at the core of almost every
|
||
creative project. <a href="https://psdrepo.com/">PSD Repo</a>, <a
|
||
href="https://psddd.co/">PSDDD</a>. 🌟</li>
|
||
<li><a href="http://www.adobe.com/products/illustrator.html">Adobe
|
||
Illustrator</a> The industry-standard vector graphics app lets you
|
||
create logos, icons, sketches, typography, and complex illustrations for
|
||
print, web, interactive, video, and mobile. 🌟</li>
|
||
<li><a href="http://www.adobe.com/products/aftereffects.html">Adobe
|
||
After Effects</a> Bold new ways to put your ideas in motion. v</li>
|
||
<li><a href="http://www.adobe.com/products/project-felix.html">Adobe
|
||
Project Felix</a> A new app for working with 3D models, materials, and
|
||
lights with 2D background images to create fully rendered, high-quality
|
||
images with photorealistic effects.</li>
|
||
<li><a href="https://www.adobe.com/products/xd.html">Adobe XD</a>
|
||
Vector-based tool for designing and prototyping user experience for web
|
||
and mobile apps. 🌟</li>
|
||
<li><a href="https://zeplin.io/">Zeplin</a> Build pixel perfect apps in
|
||
peace.</li>
|
||
<li><a href="http://usepanda.com/">Panda</a> A smart news reader built
|
||
for productivity, powered by integrations.</li>
|
||
<li><a href="https://inboardapp.com/">INBOARD</a> Organize your
|
||
inspiration.</li>
|
||
<li><a href="http://sipapp.io/">Sip</a> The best way to collect,
|
||
organize & share your colors.</li>
|
||
<li><a href="https://rightfontapp.com/">RightFont</a> The future of font
|
||
manager software for Mac OS X.</li>
|
||
<li><a href="https://www.dropbox.com/">Dropbox</a> Get to all your files
|
||
from anywhere, on any device, and share them with anyone. 🌟</li>
|
||
<li><a href="https://geticonjar.com/">Iconjar</a> Organize, search and
|
||
use icons the easy way.</li>
|
||
<li><a href="https://affinity.serif.com/en-gb/designer/">Affinity
|
||
Designer</a> - Professional graphic design software for Mac.</li>
|
||
<li><a href="https://inkscape.org/en/">Inkscape</a> Free vector graphics
|
||
tool.</li>
|
||
<li><a href="https://www.figma.com/">Figma</a> The first interface
|
||
design tool with real-time collaboration. 🌟</li>
|
||
<li><a href="https://www.gravit.io/">Gravit</a> End-to-end web-based
|
||
design platform.</li>
|
||
<li><a href="https://www.taskade.com/">Taskade</a> Collaborate with
|
||
clients on the same page visually with team tasks, notes and meeting
|
||
agendas.</li>
|
||
<li><a href="https://framer.com/">Framer X</a> Design tool for creating
|
||
interactive designs, interfaces and animations.</li>
|
||
</ul>
|
||
<h2 id="prototyping">Prototyping</h2>
|
||
<ul>
|
||
<li><a href="https://marvelapp.com/">Marvel</a> Simple design,
|
||
prototyping and collaboration.</li>
|
||
<li><a href="https://www.invisionapp.com/">InVision</a> The world’s
|
||
leading prototyping, collaboration & workflow platform.</li>
|
||
<li><a href="http://origami.design/">Origami</a> Design
|
||
Prototyping.</li>
|
||
<li><a href="https://www.haiku.ai/">Haiku</a> Animation tool for UI
|
||
components, ready for iOS, Android or Web Apps.</li>
|
||
<li><a href="https://www.atomic.io/">Atomic</a> The prototyping tool
|
||
designed for teams.</li>
|
||
<li><a href="https://proto.io/">Proto.io</a> Prototypes that feel
|
||
real.</li>
|
||
<li><a href="https://www.protopie.io/">Protopie</a> Interactive
|
||
prototypes with simple triggers, connects to phone features like
|
||
vibration, proximity, and camera.</li>
|
||
<li><a href="https://www.justinmind.com/">Justinmind</a> Prototype
|
||
Faster, Communicate Better.</li>
|
||
<li><a href="http://principleformac.com/">Principle</a> Animate Your
|
||
Ideas, Design Better Apps.</li>
|
||
<li><a href="https://www.flinto.com/">Flinto</a> App prototyping tools
|
||
for designers.</li>
|
||
<li><a href="https://www.axure.com/">Axure</a> Design the right solution
|
||
and align your team.</li>
|
||
<li><a href="http://www.relativewave.com/form/">Form</a> Build and
|
||
customize native prototypes directly on device.</li>
|
||
<li><a href="https://bootstrapstudio.io/">Bootstrap Studio</a> A
|
||
powerful desktop app for creating responsive websites using the
|
||
Bootstrap framework.</li>
|
||
<li><a href="http://www.adobe.com/products/experience-design.html">Adobe
|
||
Experience Design</a> Design, prototype and quickly share user
|
||
experiences.</li>
|
||
<li><a href="https://www.uxpin.com/">UXPin</a> High fidelity animated
|
||
prototypes created in minutes.</li>
|
||
<li><a href="https://modao.cc/">MockingBot</a> Mobile prototyping tool
|
||
without headache.</li>
|
||
<li><a href="https://marvelapp.com/pop/?popref=1">POP</a> Transform pen
|
||
and paper ideas into a real working prototype.</li>
|
||
<li><a href="https://prottapp.com/">Prott</a> Prototyping tool for Web,
|
||
iOS, Android apps.</li>
|
||
</ul>
|
||
<h2 id="mockup">Mockup</h2>
|
||
<ul>
|
||
<li><a href="https://www.mockupworld.co/">Mockup World</a> handpicks and
|
||
presents the best photorealistic Photoshop mockups that designers and
|
||
agencies worldwide have published online.</li>
|
||
<li><a href="https://placeit.net/">Placeit</a> marry design and
|
||
technology to create high-quality branding and marketing tools so anyone
|
||
from individuals to large companies can create amazing visual assets for
|
||
their brand regardless of technical or artistic skills.</li>
|
||
<li><a href="https://www.epicpxls.com/">Epicpxls</a> Free & premium
|
||
curated fonts, graphics, templates, mobile app designs & UI
|
||
Kits.</li>
|
||
<li><a href="https://360mockups.com/">360 Mockups</a> Totally FREE to
|
||
download PSD Mockups to present your works.</li>
|
||
<li><a href="http://facebook.design/devices">Facebook Devices</a> Images
|
||
and Sketch files of popular devices.</li>
|
||
<li><a href="http://facebook.design/handskit">Facebook HandsKit</a>
|
||
Photos of hands holding various phones, to be used in any presentation
|
||
of your designs.</li>
|
||
<li><a href="https://uinames.com/">UINames</a> is a simple tool to
|
||
generate fake names for use in designs and mockups.</li>
|
||
<li><a href="https://ninjamock.com/">NinjaMock</a> is a small startup
|
||
based in Denmark, a country famous for its strong attitude towards
|
||
design and quality.</li>
|
||
<li><a href="https://smartmockups.com/">Smartmockups app</a> The #1 tool
|
||
for creating stunning marketing images.</li>
|
||
<li><a href="https://www.froala.com/design-blocks">Froala Design
|
||
Blocks</a> Over 170 responsive design blocks ready to be used in your
|
||
web or mobile apps. All blocks are based on the Bootstrap Library, and
|
||
they are the building blocks for beautiful websites.</li>
|
||
<li><a href="https://www.screenspace.io">ScreenSpace</a></li>
|
||
<li><a href="https://rotato.xyz">Rotato 3D mockups</a></li>
|
||
<li><a href="http://www.lipsum.com/feed/html">Lorem Ipsum</a></li>
|
||
<li><a href="https://browserframe.com/">BrowserFrame</a> is the easiest
|
||
way to wrap screenshots in browser frames. Supports multiple browsers,
|
||
operating systems, and themes. Great for landing pages and mockups.</li>
|
||
<li><a href="https://deviceshots.com">Device Shots</a> is a tool that
|
||
helps you create beautiful device mockups to share on social media
|
||
platforms, with the screenshot of your website or mobile application,
|
||
for free.</li>
|
||
</ul>
|
||
<h2 id="user-testing">User Testing</h2>
|
||
<ul>
|
||
<li><a href="https://lookback.io/">Lookback.io</a> Capture exactly how
|
||
users experience your product: no guesswork required.</li>
|
||
<li><a href="https://www.usertesting.com/">UserTesting</a> Get videos of
|
||
real people speaking their thoughts as they use your website or mobile
|
||
app. Go beyond analytics and understand why users do what they do.</li>
|
||
<li><a href="https://userbrain.net/">UserBrain</a> Keep getting videos
|
||
of real people testing your website, web app or prototype and make it
|
||
ridiculously easy to use.</li>
|
||
<li><a href="http://www.airsquirrels.com/reflector/">Reflector</a>
|
||
Wireless mirroring and streaming receiver.</li>
|
||
<li><a href="http://www.userzoom.co.uk/">User Zoom</a> All-in-One Agile
|
||
UX Research Platform.</li>
|
||
<li><a href="https://ethn.io/">Ethn.io</a> Remote user testing suite.
|
||
Intercept real people for user research.</li>
|
||
<li><a href="https://usabilla.com/">Usabilla</a> Customer feedback and
|
||
survey tool.</li>
|
||
<li><a href="https://usertest.io/">UserTest.io</a> Remote, easy and
|
||
simple user testing.</li>
|
||
<li><a href="https://validately.com/">Validately</a> Easy way to recruit
|
||
testers, launch tests, and analyze results.</li>
|
||
<li><a href="http://usersthink.com/">Users Think</a> Get user feedback
|
||
from real people, on demand, when you need it.</li>
|
||
<li><a href="https://www.crazyegg.com/">CrazyEgg</a> Heatmapping
|
||
software.</li>
|
||
<li><a href="https://www.hotjar.com/">HotJar</a> Includes screen
|
||
recordings, heatmapping, form and funnel analysis and user feedback
|
||
polls & surveys</li>
|
||
<li><a href="https://www.inspectlet.com/">Inspectlet</a> Captures user
|
||
actions and browsing, generates heatmaps, records with a realtime
|
||
timeline</li>
|
||
<li><a href="https://www.clicktale.com">Clicktale</a> is a user
|
||
experience management platform.</li>
|
||
<li><a href="http://maze.design">Maze Design</a> is a great way to
|
||
conduct user interviews</li>
|
||
</ul>
|
||
<h2 id="read-and-digest">Read and Digest</h2>
|
||
<ul>
|
||
<li><a href="http://design-milk.com/">Design Milk</a> is an online
|
||
magazine dedicated to modern design, offers what’s new in art,
|
||
architecture, interior design, furniture and decor, fashion and
|
||
technology. 🌟</li>
|
||
<li><a href="https://www.frogdesign.com/">frog</a> is a global Design,
|
||
innovation and strategy firm.</li>
|
||
<li><a href="http://danskdesigncenter.dk/">Danish Design Centre</a></li>
|
||
<li><a href="https://design.google.com/">Google Design</a> is a
|
||
cooperative effort led by a group of designers, writers, and developers
|
||
at Google. 🌟</li>
|
||
<li><a href="https://www.google.com/culturalinstitute/beta/">Google Art
|
||
& Culture</a>, explore collections and stories from around the
|
||
world.</li>
|
||
<li><a href="https://airbnb.design/">Airbnb Design</a> is a
|
||
cross-disciplinary group of experience and production designers,
|
||
researchers, technologists, writers and content strategists, graphic
|
||
designers, filmmakers, producers, interior architects, project managers,
|
||
photographers and more. 🌟</li>
|
||
<li><a href="https://www.fastcodesign.com/">Fast.Co Design</a> is the
|
||
world’s leading business media brand, with an editorial focus on
|
||
innovation in technology, leadership, world changing ideas, creativity,
|
||
and design. 🌟</li>
|
||
<li><a href="https://www.smashingmagazine.com/">Smashing Magazine</a>
|
||
founded in September 2006 in Germany, Smashing Magazine delivers
|
||
reliable, useful, but most importantly practical articles to web
|
||
designers and developers. 🌟</li>
|
||
<li><a href="http://designtaxi.com/">Design Taxi</a></li>
|
||
<li><a href="http://www.yankodesign.com/">Yanko Design</a></li>
|
||
<li><a href="http://www.swiss-miss.com/">Swiss Miss</a> is a design
|
||
blog/studio run by tina roth eisenberg.</li>
|
||
<li><a href="http://uxmag.com/">UX Magazine</a> is a free community
|
||
resource exploring all facets of experience design.</li>
|
||
<li><a href="http://www.uxbooth.com/">UXBooth</a> is a publication by
|
||
and for the user experience community.</li>
|
||
<li><a href="https://www.ideo.com/">IDEO</a></li>
|
||
<li><a href="https://designshack.net/">Design Shack</a> established in
|
||
2003, Design Shack is a magazine for creatives, designers, and
|
||
developers.</li>
|
||
<li><a href="http://www.booooooom.com/blog/design/">Booooooom</a> was
|
||
launched in 2008 by Vancouver-based artist Jeff Hamada. It is Canada’s
|
||
highest traffic art platform, and one of the largest on the
|
||
Internet.</li>
|
||
<li><a href="https://designmodo.com/inspiration/">designmodo</a>
|
||
provides articles, tutorials and industry news about trends and
|
||
techniques.</li>
|
||
<li><a
|
||
href="https://www.webdesignerdepot.com/">webdesignerdepot</a></li>
|
||
<li><a href="http://uxmovement.com/">UX Movement</a> shows you which way
|
||
gives the best user experience.</li>
|
||
<li><a href="https://speckyboy.com/">Speckyboy</a> was launched with the
|
||
intent of serving as an inspirational hub for web designers.</li>
|
||
<li><a href="http://www.hugeinc.com/">HUGE</a></li>
|
||
<li><a href="https://www.sitepoint.com/blog/">Sitepoint Blog</a></li>
|
||
<li><a href="https://articles.uie.com/">UIE</a> helps people have the
|
||
expertise they need to deliver better design.</li>
|
||
<li><a href="http://attackthefront.com">Attack the Front</a></li>
|
||
<li><a href="https://tympanus.net/codrops/">codrops</a> is a web design
|
||
and development blog that publishes articles and tutorials about the
|
||
latest web trends, techniques and new possibilities.</li>
|
||
<li><a href="https://thegreatdiscontent.com/">The Great Discontent</a>
|
||
is a print publication and online magazine featuring inspiring
|
||
conversations with today’s artists, makers, and risk-takers.</li>
|
||
<li><a href="http://underconsideration.com/">Underconsideration</a> are
|
||
a graphic design firm generating it own projects, initiatives, and
|
||
content while taking on limited client work.</li>
|
||
<li><a href="http://littlebigdetails.com/">Little Big Details</a> is a
|
||
curated collection of the finer details of design, updated every
|
||
day.</li>
|
||
<li><a href="http://wayswework.io/">WAYS WE WORK</a> is a digital
|
||
publication focused on telling stories and getting first-hand accounts
|
||
of how people do the work they love.</li>
|
||
<li><a href="https://www.creativereview.co.uk/">Creative Review</a> has
|
||
been bringing the creative community together since 1980.</li>
|
||
<li><a href="http://creativeoverflow.net/">Creativeoverflow</a> is an
|
||
online design magazine for anything creative.</li>
|
||
<li><a href="http://www.fromupnorth.com/">FORM UP NORTH</a></li>
|
||
<li><a href="http://facebook.design/">Facebook</a> is a facebook design
|
||
blogs.</li>
|
||
<li><a href="https://medium.com/facebook-design">Facebook Design on
|
||
Medium</a> experiences from the people designing products billions of
|
||
people use every day.</li>
|
||
<li><a href="http://hackingui.com/">Hacking UI</a> is a community for
|
||
designers, developers and creative entrepreneurs with a passion.</li>
|
||
<li><a href="https://blog.pixelsquid.com/">PixelSquid Blog</a></li>
|
||
<li><a href="http://www.logodesignlove.com/">LOGO DESIGN LOVE</a> is a
|
||
website and book devoted to the design of logos and brand
|
||
identities.</li>
|
||
<li><a href="https://designm.ag/">DesignM.ag</a> is a community-based
|
||
website for web designers and developers.</li>
|
||
<li><a href="http://heydesigner.com/">HeyDesigner</a> daily curated
|
||
design knowledge.</li>
|
||
<li><a href="http://nicelydone.club/">Nicely Done</a> is a curation of
|
||
the nicest digital products.</li>
|
||
<li><a href="https://medium.com/dropbox-design">Dropbox Design on
|
||
Medium</a> Stories and musings from the Dropbox Design team. 🌟</li>
|
||
<li><a href="https://www.designernews.co/">Designer News</a> is a large,
|
||
global community of people working in design and technology or those
|
||
interested in the topics. 🌟</li>
|
||
<li><a href="https://sidebar.io/">Sidebar</a> has been collecting the
|
||
best links about UI design, typography, CSS, user research, and all
|
||
other facets of design since 2012. 🌟</li>
|
||
<li><a href="https://blog.codepen.io/">CodePen Blog</a> where CodePen
|
||
post announcements, tips and tricks, new and updated features, fun
|
||
roundups, new podcast episodes, and more.</li>
|
||
<li><a href="http://www.webdesignernews.com/">Web Designer News</a>
|
||
curated stories for designers. 🌟</li>
|
||
<li><a href="https://www.uxofvr.com/">The UX for VR</a> is a curated
|
||
list of resources to help you on your journey into the User Experience
|
||
of Virtual Reality.</li>
|
||
<li><a href="http://reeoo.com/">Reeoo</a> provides web design
|
||
inspiration and gallery for web designers.</li>
|
||
<li><a href="http://www.creativebloq.com/">CREATIVE BLOQ</a> delivers a
|
||
daily mix of advice and inspiration for digital and traditional artists,
|
||
web designers, graphic designers, 3D and VFX artists, illustrators, and
|
||
more. 🌟</li>
|
||
<li><a href="https://www.pond5.com/">Pond5</a></li>
|
||
<li><a href="https://www.dexigner.com/">Dexigner</a></li>
|
||
<li><a href="https://blog.niice.co/">Nicce on Medium</a> Gather, share
|
||
& discuss ideas with your team.</li>
|
||
<li><a href="https://www.artwxrk.com">Artwxrk</a></li>
|
||
<li><a href="http://designspiration.net/">Designspiration</a> is
|
||
committed to being the best product that it can.</li>
|
||
<li><a href="https://freebiesbug.com/">Freebiesbug</a> Hand-picked
|
||
resources for web designer and developers, constantly updated.</li>
|
||
<li><a href="http://muuuuu.org/">Muuuuu</a></li>
|
||
<li><a href="https://medium.muz.li/">Muzli on Medium</a> The freshest
|
||
links about design and interactive, from around the web.</li>
|
||
<li><a href="https://www.thebestdesigns.com/">The Best Designs</a></li>
|
||
<li><a href="http://flatinspire.com/">Flat Inspire</a> is a curated
|
||
gallery & showcase of the best websites rocking a Flat Design/UI
|
||
style.</li>
|
||
<li><a href="https://www.siteinspire.com/">Site Inspire</a> is a
|
||
showcase of the finest web and interactive design.</li>
|
||
<li><a href="https://mediaqueri.es/">Media Queries</a></li>
|
||
<li><a href="https://onepagelove.com/">One Page Love</a> is the leading
|
||
showcase of beautiful One Page websites, templates and resources.</li>
|
||
<li><a href="https://www.admiretheweb.com/">Admire the Web</a></li>
|
||
<li><a href="https://pttrns.com/">Pttrns</a></li>
|
||
<li><a href="http://www.craftedbylove.com/#/">CRAFTED BY LOVE</a></li>
|
||
<li><a href="https://httpster.net/">HTTPSTER</a></li>
|
||
<li><a href="http://emptystat.es/">Empty States</a></li>
|
||
<li><a href="http://www.calltoidea.com/">Call to Idea</a></li>
|
||
<li><a href="https://siiimple.com/">Siiimple</a></li>
|
||
<li><a href="http://zurb.com/patterntap">Zurb PatternTap</a></li>
|
||
<li><a href="https://land-book.com/">Land Book</a> created this place
|
||
for Designers, Developers, Product Owners, Marketing Managers,
|
||
Startupers, Freelancers and, really, for everyone who appreciates fine
|
||
designs and well-crafted sites.</li>
|
||
<li><a href="http://oozled.com/">oozled</a></li>
|
||
<li><a href="http://www.brianlovin.com/design-details/">DESIGN
|
||
DETAILS</a></li>
|
||
<li><a href="https://www.officelovin.com/">officelovin</a> is an online
|
||
platform about office architecture & design.</li>
|
||
<li><a href="https://bestwebsite.gallery/">Best Website</a> The most
|
||
beautiful websites handpicked for you — since 2008!</li>
|
||
<li><a
|
||
href="http://freedesignresources.net/">FreeDesignResources</a></li>
|
||
<li><a href="http://abduzeedo.com/">Abduzeedo</a></li>
|
||
<li><a href="https://www.materialui.co">Material UI</a></li>
|
||
<li><a href="https://1stwebdesigner.com">1stwebdesigner</a> By web
|
||
design professionals, for web design professionals. We’re on a mission
|
||
to help you build a better web.</li>
|
||
<li><a href="https://www.webpagefx.com/tools/emoji-cheat-sheet/">EMOJI
|
||
CHEAT SHEET</a></li>
|
||
<li><a
|
||
href="https://afeld.github.io/emoji-css/?ref=webdesignernews.com">EMOJI
|
||
CSS</a></li>
|
||
<li><a href="https://www.designshock.com/">DesignShock</a> is the
|
||
biggest bundle/subscription you can find in one place including icons,
|
||
avatars, graphic elements, GUI packs, design sets and both web and print
|
||
templates</li>
|
||
<li><a href="http://www.svgporn.com/">SVG PORN</a></li>
|
||
<li><a href="https://www.uplabs.com/">Up</a> is the leading community of
|
||
creatives, offering the best downloadable resources, every day.</li>
|
||
<li><a href="http://freebbble.com/">Freebbble</a></li>
|
||
<li><a href="https://www.baianat.com/resources/">Baianat</a></li>
|
||
<li><a href="http://www.graphberry.com/">Graphberry</a> provide you with
|
||
the creative graphic resources you need to transform into your personal
|
||
or commercial work.</li>
|
||
<li><a href="http://uxchecklist.github.io/">UX Project Checklist</a>
|
||
🌟</li>
|
||
<li><a href="http://tridiv.com/">TRIDIV</a> is a web-based editor for
|
||
creating 3D shapes in CSS.</li>
|
||
<li><a href="http://www.mobilemozaic.com/">Mobile Mozaic</a></li>
|
||
<li><a href="http://wwwhere.io/">wwwhere</a></li>
|
||
<li><a href="http://www.lapa.ninja/">Lapa</a> is a gallery featuring the
|
||
best 1920 landing page examples from around the web.</li>
|
||
<li><a href="https://www.designermill.com/">Designer Mill</a></li>
|
||
<li><a href="http://freebiesjedi.com">Freebiesjedi</a></li>
|
||
<li><a href="https://webfieldmanual.com/">Webfieldmanual</a></li>
|
||
<li><a href="https://uxtools.co/">UXTOOLS</a></li>
|
||
<li><a href="https://codemyui.com/">CodeMyUI</a> Web Design & UI
|
||
Inspiration with Code Snippets.</li>
|
||
<li><a href="https://alistapart.com/">A List Apart</a> has been
|
||
discussing design, development and meaning of web content since 1997 and
|
||
remains a great resource for designers and programmers alike.</li>
|
||
</ul>
|
||
<h2 id="styleguide-and-branding">Styleguide and Branding</h2>
|
||
<ul>
|
||
<li><a href="https://saijogeorge.com/brand-style-guide-examples/">Brand
|
||
Style Guide Examples</a></li>
|
||
<li><a href="https://www.mozilla.org/en-US/styleguide/">Mozilla</a></li>
|
||
<li><a href="http://ux.mailchimp.com/patterns/">Mailchimp</a></li>
|
||
<li><a
|
||
href="http://rizzo.lonelyplanet.com/styleguide/design-elements/colours">Lonely
|
||
Planet</a></li>
|
||
<li><a
|
||
href="https://www.starbucks.com/static/reference/styleguide/">Starbucks</a></li>
|
||
<li><a href="https://www.yelp.com/styleguide">Yelp</a></li>
|
||
<li><a href="https://www.ibm.com/design/language/">IBM</a></li>
|
||
<li><a href="https://medium.com/uber-design">Uber</a></li>
|
||
<li><a href="https://www.atlassian.design/">Atlassian</a></li>
|
||
<li><a href="https://www.dropbox.com/branding">Dropbox</a></li>
|
||
<li><a href="https://developer.spotify.com/design/">Spotify</a></li>
|
||
<li><a
|
||
href="https://www.youtube.com/yt/about/brand-resources/">Youtube</a></li>
|
||
<li><a href="https://en.facebookbrand.com/">Facebook - Brand Resource
|
||
Center Book</a></li>
|
||
<li><a href="https://press.vimeo.com/brand-guidelines">Vimeo</a></li>
|
||
<li><a href="http://design.ubuntu.com/">Ubuntu</a></li>
|
||
<li><a href="http://www.bbc.co.uk/gel">BBC</a></li>
|
||
<li><a
|
||
href="http://styleguides.channel4.com/E4_StyleGuide.pdf">Channel4</a></li>
|
||
<li><a href="https://brand.twitter.com/">Twitter</a></li>
|
||
<li><a href="http://manualcreative.com/project/nike-pro-services/">Nike
|
||
Pro</a></li>
|
||
<li><a
|
||
href="https://www.behance.net/gallery/7226653/Medium-Brand-Development">Medium</a></li>
|
||
<li><a href="https://brand.linkedin.com/">Linkedin</a></li>
|
||
<li><a
|
||
href="http://www.redcross.org/images/MEDIA_CustomProductCatalog/m6440103_BrandPoster.pdf">Red
|
||
Cross</a></li>
|
||
<li><a
|
||
href="https://marvelapp.com/styleguide/overview/introduction">Marvel</a></li>
|
||
<li><a href="https://buffer.com/style-guide">buffer</a></li>
|
||
<li><a href="http://vsco.co/id/journal/p/1">VSCO</a></li>
|
||
<li><a href="https://en.instagram-brand.com/">Instagram</a></li>
|
||
<li><a href="https://www.whatsappbrand.com/">WhatsApp</a></li>
|
||
<li><a
|
||
href="https://www.snapchat.com/brand-guidelines#general-usage-guidelines">Snapchat</a></li>
|
||
<li><a href="https://atlassian.design/">Atlassian</a></li>
|
||
<li><a href="http://clarity.design">Clarity</a></li>
|
||
<li><a
|
||
href="https://developer.apple.com/ios/human-interface-guidelines/">Apple
|
||
iOS</a></li>
|
||
<li><a
|
||
href="https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/">Apple
|
||
macOS</a></li>
|
||
<li><a
|
||
href="https://newslab.withgoogle.com/assets/docs/google-trends-guide.pdf">Google
|
||
Trends</a></li>
|
||
<li><a
|
||
href="https://www.behance.net/gallery/9028077/Google-Visual-Assets-Guidelines-Part-2">Google
|
||
Visual Assets Guidelines</a></li>
|
||
<li><a href="https://developers.google.com/glass/design/">Google Design
|
||
for Glass</a></li>
|
||
<li><a href="https://material.io/guidelines/">Google Material
|
||
Design</a></li>
|
||
<li><a href="https://www.microsoft.com/en-us/design">Microsoft
|
||
Design</a></li>
|
||
<li><a href="http://fluent.microsoft.com/">Microsoft Fluent Design
|
||
System</a></li>
|
||
<li><a
|
||
href="https://sservi.nasa.gov/wp-content/uploads/2011/10/NASA_Style_Guide_v2.1.pdf">NASA
|
||
2011</a></li>
|
||
<li><a
|
||
href="https://www.nasa.gov/sites/default/files/atoms/files/nasa_graphics_manual_nhb_1430-2_jan_1976.pdf">NASA
|
||
1976</a></li>
|
||
<li><a href="http://ant.design">Ant Design</a> is a design system with
|
||
values of Nature and Determinacy for better user experience of
|
||
enterprise applications.</li>
|
||
<li><a href="https://www.audi.com/ci/en/renewed-brand.html">Audi</a>
|
||
Audi Corporate Identity Portal</li>
|
||
</ul>
|
||
<h2 id="tutorial">Tutorial</h2>
|
||
<ul>
|
||
<li><a href="https://www.lynda.com/">Lynda</a> is a leading online
|
||
learning platform that helps anyone learn business, software, technology
|
||
and creative skills to achieve personal and professional goals. 🌟</li>
|
||
<li><a href="https://www.creativelive.com/">CreativeLive</a></li>
|
||
<li><a href="https://designschool.canva.com/">DesignSchool</a> Anyone
|
||
can make beautiful designs with Canva.</li>
|
||
<li><a href="https://tutsplus.com/">Envato Tuts+</a> helps you learn
|
||
creative skills and shape the life you want.</li>
|
||
<li><a href="https://www.udemy.com/courses/design/">Udemy</a> The
|
||
leading global marketplace for learning and instruction.</li>
|
||
<li><a href="http://www.aboutcg.com/">AboutCG</a> 前身是 CG
|
||
共和国(CGGHG),
|
||
是成立于2004年的计算机图形图像教学服务网站,也是国内最早的原创CG视频教学的制作者。</li>
|
||
<li><a href="https://devdojo.com/">DevDojo</a></li>
|
||
<li><a href="https://courses.platzi.com">Platzi</a> Growth marketing
|
||
Course.</li>
|
||
<li><a href="https://greyscalegorilla.com/">greyscalegorilla</a></li>
|
||
</ul>
|
||
<h2 id="book">Book</h2>
|
||
<ul>
|
||
<li><a
|
||
href="https://www.amazon.com/Universal-Principles-Design-Revised-Updated/dp/1592535879/ref=sr_1_2?s=books&ie=UTF8&qid=1473096298&sr=1-2&keywords=Universal+Methods+of+Design">Universal
|
||
Principles of Design</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Universal-Methods-Design-Innovative-Effective/dp/1592537561/ref=pd_sim_14_3?ie=UTF8&psc=1&refRID=2NG71RWR7MKGXE1B8GZ3">Universal
|
||
Methods of Design</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/gp/product/0321965515/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0321965515&linkCode=as2&tag=office03a70-20&linkId=PF4EASLP4EM62N73">Don’t
|
||
Make Me Think</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/gp/product/1118766571/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1118766571&linkCode=as2&tag=office03a70-20&linkId=I5TMKUXHZ43SHHPE">About
|
||
Face: The Essentials of Interaction Design</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Graphic-Designer-without-Losing-Expanded/dp/1568989830">How
|
||
to Be a Graphic Designer without Losing Your Soul</a></li>
|
||
<li><a href="https://www.amazon.com/gp/product/0321703545">Simple and
|
||
Usable Web, Mobile, and Interaction Design</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Lean-UX-Applying-Principles-Experience/dp/1449311652">Lean
|
||
UX: Applying Lean Principles to Improve User Experience</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Designing-Interfaces-Jenifer-Tidwell/dp/1449379702">Designing
|
||
Interfaces</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Things-Designer-People-Voices-Matter/dp/0321767535">100
|
||
Things Every Designer Needs to Know About People</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/UX-Book-Guidelines-Ensuring-Experience/dp/0123852412">The
|
||
UX Book: Process and Guidelines for Ensuring a Quality User
|
||
Experience</a></li>
|
||
<li><a href="https://www.amazon.com/gp/product/1568989695/">Thinking
|
||
with Type</a></li>
|
||
<li><a
|
||
href="https://www.amazon.com/Elements-Graphic-Design-Second/dp/1581157622/">The
|
||
Elements of Graphic Design</a></li>
|
||
<li><a href="https://www.manning.com/books/usability-matters">Usability
|
||
Matters: Mobile-first UX for developers and other accidental
|
||
designers</a></li>
|
||
<li><a href="https://www.manning.com/books/design-for-the-mind">Design
|
||
for the Mind</a></li>
|
||
</ul>
|
||
<h2 id="award">Award</h2>
|
||
<ul>
|
||
<li><a href="http://www.g-mark.org/?locale=en">Good Design Award</a> has
|
||
been a sole comprehensive design evaluation and commendation system in
|
||
Japan sin 1957.</li>
|
||
<li><a href="http://en.red-dot.org/">Red Dot Award</a> stands for
|
||
belonging to the best in design and business. It’s international design
|
||
competition, the “Red Dot Design Award”, is aimed at all those who would
|
||
like to distinguish their business activities through design. 🌟</li>
|
||
<li><a href="https://developer.apple.com/design/awards/">Apple Design
|
||
Awards</a> is a special event hosted by Apple Inc. at its annual
|
||
Worldwide Developers Conference. 🌟</li>
|
||
<li><a href="http://ifworlddesignguide.com/">iF Product Design Award</a>
|
||
was introduced in 1954 and is annually conferred by the iF International
|
||
Forum Design. The award, which spans multiple disciplines, has more than
|
||
5,500 entries from around 59 nations every year. 🌟</li>
|
||
<li><a href="https://thefwa.com/">FWA</a> to showcase cutting edge
|
||
creativity, regardless of the medium or technology used.</li>
|
||
<li><a href="http://www.cssdesignawards.com/">CSS Design Awards</a> is a
|
||
web design & development award platform for digital folk, UI/UX
|
||
peeps and inspiring leaders of the web.</li>
|
||
<li><a href="https://www.cssawards.net/">CSS Awards</a> is a web
|
||
designer/agency/studio inspiration gallery, where a high quality of CSS
|
||
websites placed from around the world.</li>
|
||
<li><a href="http://www.creativeadawards.com/">Creative AD Awards</a>
|
||
Discover the Most Creative & Sophisticated Advertising Campaigns
|
||
around the World.</li>
|
||
<li><a href="https://www.dandad.org/">D&AD</a></li>
|
||
<li><a href="https://www.awwwards.com/">Awwwards</a> The awards for
|
||
design, creativity and innovation on the Internet. 🌟</li>
|
||
<li><a href="http://www.csswinner.com/">CSS Winner</a> is a unique
|
||
global platform awarding and showcasing the best websites and promoting
|
||
innovative web designers, developers and agencies.</li>
|
||
</ul>
|
||
<h2 id="conference-and-festival">Conference and Festival</h2>
|
||
<ul>
|
||
<li><a href="https://uideo.net">Uideo</a> talks for designers from 69
|
||
ux/ui conferences all over the world.</li>
|
||
<li><a href="https://max.adobe.com/">MAX</a> Get inspired. Learn skills.
|
||
Play.</li>
|
||
<li><a href="http://designconference.aiga.org/#!/">The AIGA Design
|
||
Conference</a></li>
|
||
<li><a href="https://www.sxsw.com/">SXSW</a> founded in 1987 in Austin,
|
||
Texas, SXSW is best known for its conference and festivals that
|
||
celebrate the convergence of the interactive, film, and music
|
||
industries.</li>
|
||
<li><a href="http://www.theillustrationconference.org/">ICON9</a> brings
|
||
together top illustrators, designers, educators, representatives, and
|
||
art buyers to explore the future of illustration.</li>
|
||
<li><a href="http://www.mirrorconf.com">Mirror</a> is a conference
|
||
designed to empower designers and front-end developers who have a thirst
|
||
for knowledge and want to broaden their horizons.</li>
|
||
<li><a href="http://interaction16.ixda.org/">Interaction</a></li>
|
||
<li><a href="http://www.iloveoffset.com/">Offset</a> has fast become one
|
||
of the world’s most inspirational, educational and vocational
|
||
conferences for the design and creative industries.</li>
|
||
<li><a href="http://conference.99u.com/">99U</a> Adobe 99U
|
||
Conference.</li>
|
||
<li><a href="http://typographics.com">Typographics</a> is a multi-part
|
||
event series focused on contemporary typography and where its future may
|
||
lie.</li>
|
||
<li><a href="http://underconsideration.com/brandnewconference/">Brand
|
||
New Conference</a> is a two-day event organized by
|
||
UnderConsideration.</li>
|
||
<li><a href="http://www.howdesignlive.com/">How Design Live</a> is one
|
||
of the largest annual gatherings of creative professionals in the world,
|
||
HOW Design Live is a career-changing, life-altering experience.</li>
|
||
<li><a href="http://betterbydesignconference.com/">Better by Design</a>
|
||
is about conference & workshops.</li>
|
||
<li><a href="http://www.whatdesigncando.com/">What Design Can Do</a> is
|
||
an international platform on the impact of design.</li>
|
||
<li><a href="https://www.designcontentconf.com/">Design and Content</a>
|
||
The Conference for Designers & Content Strategists — we’re better
|
||
together.</li>
|
||
<li><a href="https://www.generateconf.com/">generate</a> the award
|
||
winning conference for web designers returns to NYC!</li>
|
||
<li><a href="https://www.typotalks.com/">Typo International Design
|
||
Talks</a> is where the world’s design experts speak</li>
|
||
<li><a href="http://servicedesigndays.com/">Service Design Days</a></li>
|
||
<li><a href="https://www.semipermanent.com">SemiPermanent</a></li>
|
||
<li><a href="https://dribbble.com/meetups">Dribbble Meetups</a> are a
|
||
chance for designers to socialize, talk shop, and foster their local
|
||
design communities.</li>
|
||
<li><a href="https://creativemornings.com/">CreativeMornings</a> is a
|
||
breakfast lecture series for the creative community.</li>
|
||
<li><a href="https://blog.codepen.io/meetups/">CodePen Meetups</a> for
|
||
like-minded code people to hang out, do show-and-tell, and bask in the
|
||
lovely culture that is front end.</li>
|
||
</ul>
|
||
<h2 id="podcast">Podcast</h2>
|
||
<ul>
|
||
<li><a href="http://99percentinvisible.org/">99% INVISIBLE</a></li>
|
||
<li><a href="http://shoptalkshow.com/">Shop Talk</a> is an internet
|
||
radio show about the internet starring <a
|
||
href="http://daverupert.com/">Dave Rupert</a> and <a
|
||
href="http://chriscoyier.net/">Chris Coyier</a>.</li>
|
||
<li><a href="http://workmode.show/">workmode</a> is a podcast series
|
||
about being a pro.</li>
|
||
<li><a href="http://uxpodcast.com/">UX Podcast</a> is a twice-monthly
|
||
digital design podcast sharing insights about business, technology and
|
||
people since 2011.</li>
|
||
<li><a href="http://anyway.fm/">Anyway.fm - 设计杂谈</a>
|
||
是一档播客节目,由 UI 设计师 JJ Ying 和 Leon Gao
|
||
主播,我们的目标是让你的听觉更懂视觉。</li>
|
||
<li><a href="http://thedeependdesign.com/graphic-design-podcast/">The
|
||
Deeply Graphic Design</a> The web + graphic design podcast that offsers
|
||
both pratical and creative design advice you can use.</li>
|
||
<li><a href="http://tentative.fm/">Tentative.fm</a> is a podcast about
|
||
digital product design. Hosted by thoughtbot’s Chief Design Officer Kyle
|
||
Fiedler & Boston Design Director Jaclyn Perrone.</li>
|
||
<li><a href="http://www.pagebreakpodcast.com/">Pagebreak</a> is an audio
|
||
podcast hosted by <a href="http://cmdshiftdesign.com/">Liz Andrade</a>
|
||
and <a href="http://nikibrown.com/">Niki Brown</a>.</li>
|
||
<li><a href="http://www.debbiemillman.com/designmatters/">Design
|
||
Matters</a> The world’s first podcast about design and an inquiry into
|
||
the broader world of creative culture through wide-ranging conversations
|
||
with designers, writers, artists, curators, musicians, and other
|
||
luminaries of contemporary thought</li>
|
||
<li><a href="https://thegreatdiscontent.com/podcast">The Greate
|
||
Discontent Podcast</a> features in-depth conversations with today’s
|
||
artists, makers, and risk-takers.</li>
|
||
<li><a href="https://spec.fm/podcasts/design-details">Design Details
|
||
Podcast</a> A weekly conversation about design process and culture.</li>
|
||
<li><a href="http://layout.fm/">Layout.fm</a> A weekly podcast about
|
||
design, technology, programming and everything else.</li>
|
||
<li><a
|
||
href="https://itunes.apple.com/podcast/zi-tan-zi-chang/id1041704528">Type
|
||
is Beautiful - 字谈字畅</a> 是第一档用华语制作的字体排印主题播客节目,由
|
||
Eric Liu 与钱争予搭档主播。</li>
|
||
<li><a href="https://boagworld.com/show/">Boagworld UX Show</a> Every
|
||
Thursday Paul Boag and Marcus Lillington are joined by a variety of
|
||
guests to discuss a range of web design related topics.</li>
|
||
<li><a href="https://responsivewebdesign.com/podcast/">Responsive Web
|
||
Design Podcast</a> Karen and Ethan interview the people who make
|
||
responsive redesigns happen.</li>
|
||
<li><a href="http://www.adventuresindesignmarket.com/">Adventures in
|
||
Design</a></li>
|
||
<li><a href="http://hackingui.com/podcast/">The Hacking UI Podcast</a>
|
||
is hosted by Sagi Shrieber and David Tintner, who are both a designer
|
||
and developer as well as entrepreneurs, bloggers,
|
||
productivity/time-hacker maniacs, and all around tech geeks.</li>
|
||
<li><a href="https://blog.codepen.io/radio/">CodePen Radio</a> is a
|
||
podcast all about what it’s like running a small web software business.
|
||
The good, the bad, and the ugly.</li>
|
||
<li><a href="http://www.uxcoffee.com/">UX COFFEE - 设计咖</a>
|
||
设计无处不在。在这个节目里,我们试图探寻设计的力量、这个世界被创造的过程、以及参与设计了这个世界的人们。主播:Riceman、Hoka、帆啊帆、张挠挠。</li>
|
||
</ul>
|
||
<h2 id="community">Community</h2>
|
||
<ul>
|
||
<li><a href="https://dribbble.com/">Dribbble</a> Show and tell for
|
||
designers. 🌟</li>
|
||
<li><a href="https://www.behance.net/">Behance</a> Showcase and discover
|
||
the latest work from top online portfolios by creative professionals
|
||
across industries. 🌟</li>
|
||
<li><a href="https://medium.com/">Medium</a> is a place to read, write,
|
||
and interact with the stories that matter most to you. 🌟</li>
|
||
<li><a href="http://www.fribbble.com/">Fribbble</a> Free PSD files and
|
||
other free design resources by Dribbblers.</li>
|
||
<li><a href="http://www.deviantart.com/">DeviantArt</a> The largest
|
||
online art gallery and community.</li>
|
||
<li><a href="https://2.cargocollective.com">CARGO</a></li>
|
||
<li><a href="https://www.tumblr.com/">tumblr</a> Come for what you love.
|
||
Stay for what you discover.</li>
|
||
</ul>
|
||
<h2 id="contributors">Contributors</h2>
|
||
<p>Thank you for contributing to AwesomeDesign.</p>
|
||
<p><a
|
||
href="https://github.com/gztchan/awesome-design/graphs/contributors"><img
|
||
src="https://opencollective.com/awesome-design/contributors.svg?width=890&button=false"
|
||
alt="contributors" /></a></p>
|
||
<h2 id="license">License</h2>
|
||
<p><a href="https://creativecommons.org/publicdomain/zero/1.0/"><img
|
||
src="http://mirrors.creativecommons.org/presskit/buttons/88x31/svg/cc-zero.svg"
|
||
alt="CC0" /></a></p>
|
||
<p>To the extent possible under law, <a
|
||
href="https://github.com/gztchan">Tony Chan</a> has waived all copyright
|
||
and related or neighboring rights to this work.</p>
|