Saturday, April 6, 2013

Design Tutorials and Case Study

Theory
http://vector.tutsplus.com/articles/theory/don-norman-on-3-ways-good-design-makes-you-happy/

Inforgraphic Design
http://vector.tutsplus.com/sessions/infographic-design/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-a-3d-map-pullout-for-information-graphics/
http://vector.tutsplus.com/articles/tuts-workshop-freestyle-map-infographic-challenge/
http://www.hongkiat.com/blog/50-informative-and-well-designed-infographics/

http://infosthetics.com

http://vector.tutsplus.com/tutorials/designing/quick-tip-spice-up-your-graphs-with-column-designs/
http://vector.tutsplus.com/articles/tuts-workshop-freestyle-map-infographic-challenge-final-round/

 CI VI Design
http://vector.tutsplus.com/articles/news/new-video-course-identity-design/
http://vector.tutsplus.com/sessions/logo-and-identity-design

http://vector.tutsplus.com/articles/web-roundups/the-process-of-designing-a-killer-logo/ 
http://vector.tutsplus.com/articles/inspiration/logos-for-print-versus-online-%E2%80%93-identify-your-audience-and-design-accordingly/
http://vector.tutsplus.com/articles/inspiration/a-clever-collection-of-40-inspiring-ambigrams/
http://vector.tutsplus.com/articles/20-weird-logos-that-work-and-why-they-do/

Typography 
http://psd.tutsplus.com/articles/techniques/a-20-minute-intro-to-typography-basics/ 
http://vector.tutsplus.com/articles/inspiration-40-typographic-posters/ 
http://vector.tutsplus.com/articles/web-roundups/40-free-headline-typefaces/

http://vectips.com/tutorials/turn-any-font-into-a-sketch-font/
http://layersmagazine.com/blueprint-style-text-in-adobe-illustrator.html 
http://vector.tutsplus.com/articles/news/ultimate-type-twisting-with-adobe-illustrator-vector-plus-tutorial/ 
http://vector.tutsplus.com/articles/communicating-with-typography/ 
http://vector.tutsplus.com/articles/inspiration/inspiration-45-examples-of-illustrative-lettering-in-vector/

http://vector.tutsplus.com/tutorials/text-effects/learn-to-create-a-variety-of-script-lettering/
http://vector.tutsplus.com/tutorials/illustration/quick-tip-how-to-easily-outline-curly-letters/
http://vector.tutsplus.com/tutorials/typography/professional-typography/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-transform-any-plain-font-into-a-grunge-font/
http://vector.tutsplus.com/tutorials/text-effects/quick-tip-how-to-create-a-gummy-text-effect/
http://vector.tutsplus.com/tutorials/text-effects/quick-tip-how-to-create-a-simple-sticker-text-effect/

http://vector.tutsplus.com/tutorials/typography/how-to-create-an-entangled-lettering-illustration-part-1/
http://vector.tutsplus.com/tutorials/typography/how-to-create-an-entangled-lettering-illustration-part-2/
http://psd.tutsplus.com/tutorials/text-effects-tutorials/liquid-filled-glass-text-effect/
http://vector.tutsplus.com/articles/news/create-illustrated-type-from-sketch-to-vector-vector-plus-tutorial/

http://vectips.com/tutorials/create-a-editable-stitched-label-type-treatment/

http://vector.tutsplus.com/articles/talking-typography-and-more-with-claire-coullon-of-op45/
http://vector.tutsplus.com/tutorials/text-effects/acid-glassy-text-effect/

http://vector.tutsplus.com/tutorials/text-effects/quick-tip-how-to-create-colorful-neon-text-with-adobe-illustrator/

http://vector.tutsplus.com/articles/news/creating-imaginative-typography-with-adobe-illustrator-vector-plus-tutorial/


Graphic / Graphical Element Design
http://vector.tutsplus.com/tutorials/illustration/quick-tip-how-to-create-a-cartoon-rocketship-with-inkscape/
http://vector.tutsplus.com/sessions/poster-design/
http://vector.tutsplus.com/sessions/core-art-skills/
http://vector.tutsplus.com/articles/community-project/community-project-vectortuts-creative-t-shirt-project-round-1/
http://vector.tutsplus.com/articles/web-roundups/best-of-how-to-illustrator-brush-tutorials/
http://vector.tutsplus.com/articles/news/create-a-vector-space-rocket-in-illustrator-cs5/
http://vector.tutsplus.com/tutorials/text-effects/quick-tip-create-an-airport-time-table-type-effect/
http://vector.tutsplus.com/tutorials/tools-tips/how-to-create-a-three-dimensional-airplane-with-adobe-illustrator/
http://www.denisdesigns.com/blog/2009/03/create-a-simple-spaceship-in-illustrator/
http://www.vectordiary.com/illustrator/illustrator-tutorial-perfect-silhouette-with-live-trace-tutorial/
http://cg.tutsplus.com/tutorials/luxology-modo/adam_ohern_luxology_modo_3d_cg_modeling_cut_and_paste_cmyk_heart_tutorial/
http://vector.tutsplus.com/tutorials/typography/quick-tip-how-to-make-a-text-mask-in-adobe-illustrator/
http://vector.tutsplus.com/tutorials/how-to-trace-a-sketch-with-a-vintage-comic-style/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-multi-tone-vector-noise/
http://vector.tutsplus.com/tutorials/illustration/how-to-make-a-retro-rc-airplane-poster/
http://vector.tutsplus.com/articles/theory/the-elements-of-cute-character-design/
http://vector.tutsplus.com/articles/news/creative-sessions-a-new-set-of-educational-posts-every-month/
http://vector.tutsplus.com/tutorials/comics/the-brads-learning-about-contrast-in-design/
http://vector.tutsplus.com/tutorials/tools-tips/how-to-create-roads-and-rail-tracks-on-a-path/
http://vector.tutsplus.com/tutorials/illustration/how-to-convert-a-photograph-into-abstract-line-art/
http://vector.tutsplus.com/tutorials/designing/how-to-create-seamless-watermark-patterns/
http://vector.tutsplus.com/tutorials/illustration/create-an-milk-bottle-with-a-funny-cow-label/
http://vector.tutsplus.com/tutorials/illustration/create-a-twitter-style-bird-mascot/
http://vector.tutsplus.com/articles/news/create-a-stylized-twitter-bird-icon-in-illustrator-vector-plus-tutorial/
http://blog.spoongraphics.co.uk/tutorials/illustrator-tutorial-create-a-gang-of-vector-ninjas
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-make-an-escher-esque-metamorphosis-with-the-blend-tool/
http://vector.tutsplus.com/articles/web-roundups/free-animal-vector-graphics-cute-cartoon-characters/
http://vector.tutsplus.com/tutorials/icon-design/vector-chalkboard-icon/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-a-simple-set-of-map-pins/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-ios-map-indicators-with-graphic-styles/
http://vector.tutsplus.com/tutorials/how-to-create-a-pub-chalk-board-ui-in-adobe-illustrator/
http://vector.tutsplus.com/tutorials/illustration/how-to-create-an-open-and-closed-zipper-in-adobe-illustrator/
http://vector.tutsplus.com/tutorials/how-to-create-to-mailbox-alert-icon-in-adobe-illustrator/
http://pehaa.com/2010/03/illustrator-tutorial-create-a-6-egg-box-not-necessarily-for-easter/
http://vector.tutsplus.com/tutorials/illustration/create-a-super-happy-octopus-character/
http://www.pxleyes.com/tutorial/photoshop/2854/Create-a-Photo-Realistic-Broken-Egg-from-Scratch.html
http://vector.tutsplus.com/tutorials/illustration/quick-tip-how-to-create-a-simple-web-badge/
http://vector.tutsplus.com/articles/news/how-to-create-a-retro-website-design-in-adobe-illustrator-tuts-premium/
http://vector.tutsplus.com/tutorials/tools-tips/the-basics-of-clipping-paths-and-opacity-masks/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-illustrate-a-retro-speech-bubble-with-the-spiral-tool/
http://vector.tutsplus.com/tutorials/text-effects/creating-an-environmentally-friendly-green-type-treatment/
http://vforvectors.com/create-a-folded-paper-text-effect/
http://vector.tutsplus.com/tutorials/text-effects/how-to-create-a-3d-lego-text-effect-in-adobe-illustrator/
http://www.cutelittlefactory.com/tutorials/design-a-cute-hamster-avatar/
http://vector.tutsplus.com/tutorials/illustration/quick-tip-how-to-create-a-heart-illustration-without-the-pen-tool/
http://vector.tutsplus.com/tutorials/illustration/how-to-create-a-seamless-bird-pattern-with-retro-touch-in-illustrator/
http://vector.tutsplus.com/tutorials/designing/quick-tip-how-to-create-an-ornament-illustration-for-a-holiday-sale/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-a-set-of-bubble-gum-buttons-in-illustrator/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-create-a-speech-bubbles-set-with-the-appearance-panel/
http://vector.tutsplus.com/tutorials/illustration/toilet-plunger/
http://vector.tutsplus.com/articles/case-study/realistic-vector-motorcycle-portraits/
http://vector.tutsplus.com/tutorials/designing/make-an-old-style-sign-from-scratch-in-coreldraw/
http://vector.tutsplus.com/articles/inspiration/40-free-tutorials-on-advanced-drawing-techniques/
http://vector.tutsplus.com/tutorials/create-a-glowing-neon-sign-using-the-appearance-palette/
http://vector.tutsplus.com/tutorials/effects/quick-tip-how-to-use-the-opacity-mask-to-make-high-gloss-icons-and-reflections/
http://vector.tutsplus.com/articles/interviews/roughly-speaking-character-design-sketching-approaches/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-a-gradient-brush/
http://vector.tutsplus.com/tutorials/tools-tips/a-comprehensive-guide-to-the-pathfinder-panel/
http://vector.tutsplus.com/tutorials/tools-tips/a-comprehensive-guide-to-the-pathfinder-panel-part-2-screencast/
http://vector.tutsplus.com/tutorials/illustration/dress-up-your-desktop-with-a-sharp-dual-screen-wallpaper/

Technical Illustration
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-uniform-stroke-scaling/
http://vector.tutsplus.com/tutorials/illustration/how-to-create-a-see-through-information-graphic/
http://vector.tutsplus.com/tutorials/designing/create-a-personalized-toolkit-for-making-maps/
http://vector.tutsplus.com/tutorials/illustration/working-with-orthographic-projections-and-basic-isometrics/
http://vector.tutsplus.com/articles/news/how-to-create-x-ray-bubbles-in-a-technical-illustration-vector-plus-tutorial/

Icon Design
http://vector.tutsplus.com/articles/news/5-traits-of-a-successful-icon-designer/
http://vector.tutsplus.com/articles/news/new-book-rockstar-icon-designer/
http://vector.tutsplus.com/tutorials/how-to-create-a-fun-circus-tent-icon/

User Interface Design
http://vector.tutsplus.com/articles/inspiration/bill-van-hecke-designing-graceful-gracious-interfaces-for-ipad/
http://vector.tutsplus.com/tutorials/web-design/how-to-create-a-simple-step-by-step-progress-bar-in-illustrator/
http://vector.tutsplus.com/tutorials/interface-design/quick-tip-create-a-simple-pagination-bar-using-the-appearance-panel/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-a-set-of-dark-check-buttons/
https://tutsplus.com/tutorial/how-to-create-a-detailed-sign-in-login-screen-in-illustrator/

http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-illustrate-a-modern-volume-dial/

http://vector.tutsplus.com/articles/case-study/the-making-of-gui-design-icons-font/


InDesign Magazine Layout
http://vector.tutsplus.com/tutorials/designing/how-to-create-a-professional-magazine-layout/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-how-to-create-a-text-wrap-in-indesign/


InDesign Tutorials
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-using-the-print-booklet-feature-in-adobe-indesign/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-using-a-photoshop-clipping-path-within-indesign/
http://vector.tutsplus.com/tutorials/tools-tips/quick-tip-creating-a-french-fold-template-in-indesign/
http://vector.tutsplus.com/tutorials/text-effects/quick-tip-create-a-highlighted-text-effect-with-adobe-indesign/
http://vector.tutsplus.com/tutorials/text-effects/quick-tip-creating-a-custom-text-box-using-type-and-indesign/

Web &  CSS
http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/

Printing & Pre-press
http://vector.tutsplus.com/articles/printing-prepress-basics/
http://vector.tutsplus.com/articles/inspiration/beyond-the-boring-rectangle-fantastic-die-cut-business-cards/

Other Useful Resources
http://vforvectors.com/
http://www.typographyserved.com/
http://www.onextrapixel.com/
http://www.google.com/fonts/
http://vector.tutsplus.com/articles/interviews/interview-with-giulia-balladore/
http://psd.tutsplus.com/articles/web/16-great-graphic-design-blogs-and-sites/
http://rwillustrator.blogspot.com.au







Web Design Reference

1. Bad Design Samples

Worst Websites of the Year
www.webpagesthatsuck.com

2. Great Design Samples

The Favorite Website Award
http://www.thefwa.com

3. Web Design Theory

10 Principles Of Effective Web Design
http://uxdesign.smashingmagazine.com/2008/01/31/10-principles-of-effective-web-design/


4. Typography and Resources

The Principles of Beautiful Typography
http://www.sitepoint.com/principles-beautiful-typography/

Google Web Fonts
http://www.google.com/fonts/


5. Color Theory

Adobe Kuler
 https://kuler.adobe.com/



6. Markup Validation and Accessibility Check
 
W3C Markup Validation Service
http://validator.w3.org/

Web Accessibility Evaluation Tool
http://wave.webaim.org/

Browsers Display Test
http://spoon.net/browsers/


Other Useful Resources

Fuel Your Creativity
http://www.fuelyourcreativity.com/

Pseudo Dummy Text
http://loripsum.net/