Design Resources - Speaker Deck

Slide 1

Slide 1 text

LeoNguyen.com

Slide 2

Slide 2 text

References - devianART (www.deviantart.com) - Web Appers (www.webappers.com) - Dzone (www.dzone.com/links)

Slide 3

Slide 3 text

Outline - Resources - Tutorial

Slide 4

Slide 4 text

01. Resources

Slide 5

Slide 5 text

Outline - Material - UI - Templates

Slide 6

Slide 6 text

Material

Slide 7

Slide 7 text

Outline - Color Scheme - Texture - Font - Typography - Icon - Images

Slide 8

Slide 8 text

Color Scheme

Slide 9

Slide 9 text

FlatUiColors - flatuicolors.com

Slide 10

Slide 10 text

Web Safe Colors - websafecolors.info

Slide 11

Slide 11 text

Color Combinations - www.colorcombos.com

Slide 12

Slide 12 text

Adobe Kuler - kuler.adobe.com

Slide 13

Slide 13 text

Color Rotate - web.colorotate.org

Slide 14

Slide 14 text

jQuery Swatches - maxmackie.com/jquery.swatches

Slide 15

Slide 15 text

ColorSchemer - colorschemer.com

Slide 16

Slide 16 text

Color Matters - colormatters.com

Slide 17

Slide 17 text

Texture

Slide 18

Slide 18 text

Noise Texture Generator - www.noisetexturegenerator.com

Slide 19

Slide 19 text

Subtle Pattern - www.subtlepatterns.com

Slide 20

Slide 20 text

Background Labs - www.backgroundlabs.com

Slide 21

Slide 21 text

Lost & Taken - www.lostandtaken.com

Slide 22

Slide 22 text

Font

Slide 23

Slide 23 text

Google Fonts - www.google.com/fonts

Slide 24

Slide 24 text

Fontstacks - awesome-fontstacks.com/bundles

Slide 25

Slide 25 text

Font Squirrel - www.fontsquirrel.com

Slide 26

Slide 26 text

Typography

Slide 27

Slide 27 text

Type Chart - www.typechart.com

Slide 28

Slide 28 text

Cool Text - cooltext.com

Slide 29

Slide 29 text

Icon

Slide 30

Slide 30 text

Android Asset Studio - android-ui-utils.googlecode.com

Slide 31

Slide 31 text

Font Custom - fontcustom.com

Slide 32

Slide 32 text

Images

Slide 33

Slide 33 text

Remove Image Backgrounds - clippingmagic.com

Slide 34

Slide 34 text

Fake Images - fakeimg.pl

Slide 35

Slide 35 text

hhhhold! - hhhhold.com

Slide 36

Slide 36 text

Slide 37

Slide 37 text

Outline - Layout - Banner

Slide 38

Slide 38 text

Layout

Slide 39

Slide 39 text

Gridset - www.gridsetapp.com

Slide 40

Slide 40 text

Screensiz - screensiz.es

Slide 41

Slide 41 text

Px to Em - pxtoem.com

Slide 42

Slide 42 text

Banner

Slide 43

Slide 43 text

BannerSnack - http://www.bannersnack.com/en/banner-maker/software/

Slide 44

Slide 44 text

Banner Fans - www.bannerfans.com

Slide 45

Slide 45 text

Templates

Slide 46

Slide 46 text

HTML5 UP! - html5up.net

Slide 47

Slide 47 text

Dribbble - www.dribbble.com

Slide 48

Slide 48 text

Fribbble - www.fribbble.com

Slide 49

Slide 49 text

Best PSD Freebies - www.bestpsdfreebies.com

Slide 50

Slide 50 text

Deposit - www.icondeposit.com

Slide 51

Slide 51 text

Tempees - www.tempees.com

Slide 52

Slide 52 text

Pixels Daily - www.pixelsdaily.com

Slide 53

Slide 53 text

Free UI Kits - freeuikits.com

Slide 54

Slide 54 text

GraphicBurger - graphicburger.com

Slide 55

Slide 55 text

Mepholio - box.mepholio.com

Slide 56

Slide 56 text

Fluid - www.fluidui.com

Slide 57

Slide 57 text

Mobile Patterns - www.mobile-patterns.com

Slide 58

Slide 58 text

Inspired UI - inspired-ui.com

Slide 59

Slide 59 text

Pttrns - pttrns.com

Slide 60

Slide 60 text

02.Tutorial

Slide 61

Slide 61 text

Outline - Photoshop - Illustrator - 3D

Slide 62

Slide 62 text

Photoshop - Yolinator (bit.ly/12jzB1P) - Howard Pinsky (http://bit.ly/14FTRda) - Tutvid (bit.ly/18fFTnu) - KinectArt (bit.ly/16z5jZa) - Ch-Ch-Check It (bit.ly/10UqlmC) - TechnologyGuru (bit.ly/16z7bBh) - True Love Design (bit.ly/17fdWsM) - Good Creative Tutorial (http://bit.ly/124Lx4d) - Photoshop Tutorial (bit.ly/16z6HLi) - The New Boston (http://bit.ly/17JXIvA)

Slide 63

Slide 63 text

Photoshop (cont) - PixelForLife - Text Effect (bit.ly/12332lw) - PixelForLife - Web Element (bit.ly/11Hvo8s) - PixelForLife - iPhone App Design (bit.ly/1233ArN)

Slide 64

Slide 64 text

Illustrator - Stephen Looney (bit.ly/17f6DRT) - Yolinator (bit.ly/1200Pq9) - Tutvid (bit.ly/1364d8U) - TastyTuts (bit.ly/149x7TF) - Illustrator Designs (bit.ly/10UrECe) - TechnologyGuru (bit.ly/17C49AJ) - Good Creative Tutorial (http://bit.ly/19vVsIU) - Logo Tutorial (bit.ly/18fK7LM)

Slide 65

Slide 65 text

3D - PixelForLife (bit.ly/14wS2Px)