1 / 24

A Guide To Communicating Your Design Vision

Explore photography, texture, typography, and color schemes to communicate your design vision effectively. Trust your designer and use inspiration galleries for inspiration and discussion. This guide includes adjectives to describe images, how to take a screenshot, and valuable web resources.

weiser
Download Presentation

A Guide To Communicating Your Design Vision

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. A Guide To Communicating Your Design Vision Megan Ellinger Version 1.0, January 14, 2011 This work is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 3.0 United States License. To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/3.0/us/ or send a letter to Creative Commons, 171 Second Street, Suite 300, San Francisco, California, 94105, USA.

  2. USING THIS GUIDE • Design is complex. Color is personal. Images and texture convey meaning. Even typeface contributes to the overall “feeling” you are trying to convey. • Designers are visual. Before you meet with your designer, create an inspiration gallery. Use it as a conversation starter. (Instructions included) • Trust your designer. Use the examples here along with your inspiration gallery to help articulate your vision to the designer. • This guide explores: • Photography and Illustration • Texture and Pattern • Typography • Color Schemes • Sample Sites

  3. Photography & illustration Are there styles of photography or illustration that support the meaning you’d like to convey?

  4. Clip Art Line Drawing Aerial Photography Watercolor

  5. Pop Art Abstract Microscopy Photojournalism

  6. Texture & Pattern Are there textures or patterns that support the meaning you’d like to convey?

  7. Natural, Orderly Durable, Rugged Strong, Concrete Delicate, Detailed

  8. Antique, Established Whimsical, Fun Cutting Edge, Advanced Luxury, Elite

  9. Typography What style of typography do you prefer?

  10. Sans-serif fonts Arial Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Verdana Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Trebuchet Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Calibri Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Tahoma Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Comic Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design.

  11. Serif fonts (left column) Combining Fonts (right column) Georgia Heading Using two different fonts can add visual interest to a design. This paragraph uses Cambria. Cambria Heading Using two different fonts can add visual interest to a design. This paragraph uses Calibri. Trebuchet Heading Using two different fonts can add visual interest to a design. This paragraph uses Arial. Cambria Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Times Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design. Georgia Heading Seeing how a font looks in a paragraph can help you decide whether it’s a good fit with the rest of your design.

  12. Color Schemes Are there color schemes that reflect the meaning you are trying to convey?

  13. Bold and Bright Muted Earth Tones Monochromatic Grayscale

  14. Sample sites Putting these concepts together

  15. I Was Wondering www.iwaswondering.com

  16. What You Need To Know About Energy www.needtoknow.nas.edu/energy

  17. Carsonified www.carsonified.com

  18. One in 8 Million http://www.nytimes.com/packages/html/nyregion/1-in-8-million/index.html

  19. Your inspiration gallery A Way to Share your Vision with Your Designer

  20. CREATE YOUR INSPIRATION GALLERY • Visit a lot of websites. Visit sites with similar goals, features and topics. Visit sites that are the opposite of your goals, features and topics. • Pick 2-3 you enjoy and take a screen shot. • Pick 2-3 you dislike and take a screen shot. • For each picture you took, answer these questions: • What adjectives would you use to describe the picture? • What do you enjoy about the picture and why? • What concerns you about the picture and why? • How to take a screen shot (a.k.a. screen capture) • Press the “Print Screen” button on your keyboard. This takes a picture of the visible area on your screen and copies it to your clipboard. Click ‘Paste’ or ‘Control + V’ to add the picture to this page. • If you use the Firefox browser, you can install a plugin called “Screengrab!” It allows you to take a picture of a portion of the page. • Buy low cost software like SnagIt, or download the free trial.

  21. Name of Website http://www.example.com

  22. Name of Website http://www.example.com

  23. ACKNOWLEDGEMENTS • Leah Buley. “Things to do at the beginning of each project.” Originally published April 2010. Accessed January 14, 2010. http://www.adaptivepath.com/blog/2010/04/28/things-to-do-at-the-beginning-of-each-project/ • David Sherwin. “Better Ideas Faster.” Originally published July 1, 2010. Accessed January 14, 2010. http://designmind.frogdesign.com/blog/better-ideas-faster.html • Jared Spool. “What Goes into a Well-Done Critique.” Originally published September 23, 2008. Accessed January, 14, 2010. http://www.uie.com/articles/critique/

  24. PHOTO CREDITS “The War Machine” http://www.flickr.com/photos/digitalgrace/47469843 “Wind-up Birds Illustration” http://www.flickr.com/photos/dannypigart/1535921696/ “Batgirl Photobooth” http://www.flickr.com/photos/toymaster/266590270/ “Abstract Drum Top 2” http://www.flickr.com/photos/zen/455969659/ “Lago di Como – Lake Como, Italy” http://www.flickr.com/photos/fromthenorth/3571552628/ “Microscopy” http://www.flickr.com/photos/emsl/4332490691 “D-For Duck as Painted by Alma!” http://www.flickr.com/photos/dapaw/2218814587/ “Basket Weave Texture” http://www.flickr.com/photos/abbylanes/3334830368 “Webtreats Brown Leather Pattern” http://www.flickr.com/photos/webtreatsetc/4563912234 “Heart Mesh Scan”http://www.flickr.com/photos/fuzzyjay/2492769638 “White Silk 5”http://www.flickr.com/photos/jetheriot/2247737940 “Daisy red polka dots”http://www.flickr.com/photos/snowsicle/4309192231 “Rust Metals”http://www.flickr.com/photos/_sml/93069149 “The Bean, Day of 365” http://www.flickr.com/photos/28096801@N05/3798835277 “Free concrete texture”http://www.flickr.com/photos/seier/4338268272

More Related