{"id":39148,"date":"2016-09-01T05:35:11","date_gmt":"2016-09-01T12:35:11","guid":{"rendered":"https:\/\/creativemarket.com\/blog\/?p=39148"},"modified":"2024-04-12T02:35:03","modified_gmt":"2024-04-12T09:35:03","slug":"graphic-design-diagrams","status":"publish","type":"post","link":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams","title":{"rendered":"15 Diagrams That Make Graphic Design Much Easier"},"content":{"rendered":"

If you’re a graphic designer reading this blog, there’s probably a good chance you already know how tough graphic design can be. However, practice makes the design process<\/a> easier — and your products better — over time. In addition to simply honing your craft, there are also some helpful resources out there that can make design easier and more insightful so you can spend more time unleashing your creativity and less time figuring out the basics. These 15 diagrams contain valuable shortcuts that will help you become a better designer.\n

<\/span>1. Infographic Layout Cheatsheet<\/span><\/h2>

\nThe Infographic Layout Cheat Sheet<\/a> is a graphic design cheatsheet created by SeeMei Chow of Piktochart. This cheatsheet contains six unique infographic layouts, and a description of what type of infographic each layout is best-suited for. This design reference sheet will be helpful to you if you are trying to find the perfect layout for an infographic filled with numerical data, a versus comparison chart or a timeline, among others.\n\"15-Graphic-Design-Diagrams-Infographic-Layouts\"<\/a>\n<\/p>

<\/span>2. Specification Guide for Social Networking Sites<\/span><\/h2>

\nThe folks at Raidious designed the Specification Guide for Social Networking Sites<\/a>, which is a helpful guide for designing content of the right size for different social media platforms. The design reference sheet includes dimensions for Facebook, Twitter, Google+, LinkedIn and YouTube images. This guide is helpful for any designer who wants the content they design for social media to look ultra-professional.\n\"15-Graphic-Design-Diagrams-Social-Media-Image-Sizes\"<\/a>\n<\/p>

<\/span>3. Typography Cheatsheet<\/span><\/h2>

\nIn this Typography Cheatsheet<\/a>, Typewolf shares a host of typography shortcuts that can make typing unusual characters much easier. The cheatsheet contains copy-and-paste, Mac keyboard shortcut, Windows keyboard shortcut and HTML entity options.\n\"15-Graphic-Design-Diagrams-Typography-Cheatsheet\"<\/a>\n<\/p>

<\/span>4. Design Elements & Principles<\/span><\/h2>

\nMary Stribley at Canva designed this infographic, called Design Elements Principles<\/a>. It is a design reference sheet that outlines and illustrates the 20 most important design principles: line, scale, color, repetition, negative space, symmetry, transparency, texture, balance, hierarchy, contrast, framing, grid, randomness, direction, rules, movement, depth, typography, and composition. It is a great refresher for anyone who wants to go over the fundamentals.\n\"15-Graphic-Design-Diagrams-Design-Principles\"<\/a>\n<\/p>

<\/span>5. The Missing Cheatsheet for Brilliant Color Combinations<\/span><\/h2>

\nFor a color theory cheatsheet, check out The Missing Cheatsheet for Color Combinations<\/a> from Peter M. at Creative Market. The cheatsheet outlines important color terms, gives some psychological associations with each color, and then explains how to pair colors<\/a> unexpectedly to look great.\n\"15-Graphic-Design-Diagrams-Color-Combinations\"<\/a>\n<\/p>

<\/span>6. Design Dictionary: 36 Terms You Should Know and Understand + Cheatsheet<\/span><\/h2>

\nNeed to brush up on your designer lingo? The Design Dictionary: 36 Terms You Should Know and Understand + Cheatsheet<\/a> by Igor Ovsyannykov at Creative Market is a great place to start. The terms included will help ensure you know what you’re talking about (and what they’re talking about) when you discuss a project with a client or supervisor.\n\"15-Graphic-Design-Diagrams-Design-Dictionary\"<\/a>\n<\/p>

<\/span>7. Photography 101 – Cheat Sheet & Camera Basics<\/span><\/h2>

\nBecky Thompson created this Photography 101 – Cheat Sheet & Camera Basics<\/a> reference guide to outline important photography terms like aperture, shutter speed, ISO and exposure. She offers tips for the right settings for each, depending on how you want your photos to look.\n\"15-Graphic-Design-Diagrams-DSRL-Photography-Cheatsheet\"<\/a>\n<\/p>

<\/span>8. Always Up-to-Date Guide to Social Media Image Sizes<\/span><\/h2>

\nFor a helpful social media reference guide, check out Kevin King’s Always Up-to-Date Guide to Social Media Size Images<\/a> on SproutSocial. Updated regularly, the guide outlines appropriate image sizes for Twitter, Facebook, Google+, Pinterest, LinkedIn, YouTube, Instagram, and Tumblr.\n\"15-Graphic-Design-Diagrams-Social-Media-Image-Sizes-Twitter-\"<\/a>\n<\/p>

<\/span>9. HTML Tag Cheatsheet<\/span><\/h2>

\nSkillcrush created this awesome HTML Tag Cheatsheet<\/a>, which is a great beginner’s reference guide to using HTML for building a site. The cheatsheet is also helpful for any designer who works in WordPress.\n\"15-Graphic-Design-Diagrams-HTML-Cheatsheet\"<\/a>\n<\/p>

<\/span>10. Bootstrap 3 Cheatsheet<\/span><\/h2>

\nThis Bootstrap 3 – Cheat Sheet<\/a> created by the Creative Alive staff is a Bootstrap design reference guide that contains screen size cheat, grid behavior, and all classes names.\n\"15-Graphic-Design-Diagrams-Bootstrap\"<\/a>\n<\/p>

<\/span>11. Anatomy of Typography<\/span><\/h2>

\nMartin Silvertant designed Typography Series – 01- Anatomy of typography<\/a> as a helpful typography cheatsheet. The sheet outlines the actual physical elements of typography, like the aperture, apex, arc, arm, etc., with a labeled diagram and corresponding list.\n\"15-Graphic-Design-Diagrams-Type-Anatomy\"<\/a>\n<\/p>

<\/span>12. Cascading Style Sheets (CSS 3)<\/span><\/h2>

\nThis Cascading Style Sheets Quick Reference Guide<\/a> from Smash Magazine is a useful, succinct reference guide for the style sheet language CSS 3. At five pages long, this guide is your go-to for basic and helpful CSS info.\n\"15-Graphic-Design-Diagrams-CSS3-Cheatsheet\"<\/a>\n<\/p>

<\/span>13. CSS Font Shorthand Property Cheatsheet<\/span><\/h2>

\nAnother helpful guide to CSS is the CSS Font Shorthand Property Cheat Sheet<\/a> created by Louis Lazaris. This explanation of CSS design shortcuts can help designers save time by cutting a few lines of code.\n\"15-Graphic-Design-Diagrams-CSS-Typography-Shorthand_jpg\"<\/a>\n<\/p>

<\/span>14. Lettering Anatomy<\/span><\/h2>

\nAnyone who has ever wanted to improve his or her hand lettering should check out the Lettering Anatomy<\/a> sheet by Mary Kate McDevitt. This lettering cheatsheet was hand-drawn by McDevitt herself, and it contains an explanation of the anatomy of hand-drawn letters (depicted), as well as examples of different weights and faces.\n\"15-Graphic-Design-Diagrams-Lettering-Anatomy\"<\/a>\n<\/p>

<\/span>15. Print Terms Cheatsheet<\/span><\/h2>

\nAs designers, there are times when we need to print our designs. For a better understanding of printing technical terms, check out the Print Terms Cheat Sheet<\/a> on the Proforma Blog. The sheet includes info about ink, registration, paper weight, binding, finishing and more.\n\"15-Graphic-Design-Diagrams-Print-Terms-Cheatsheet_jpg\"<\/a>\n<\/p>

\nIf you’re a designer looking to get better at design, cheatsheets are an easy and convenient reference. For more basic but helpful info on graphic design, check out the design basics<\/a> from Creative Market.\n<\/p>

Products Seen In This Post:<\/strong><\/p>

<\/figure>\n \n
<\/figure>\n \n<\/p><\/p>\n","protected":false},"excerpt":{"rendered":"

If you’re a graphic designer reading this blog, there’s probably a good chance you already know how tough graphic design can be. However, practice makes the design process easier — and your products better — over time. In addition to simply honing your craft, there are also some helpful resources out there that can make design easier […]<\/p>\n","protected":false},"author":57,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[34],"tags":[694],"topics":[],"class_list":["post-39148","post","type-post","status-publish","format-standard","hentry","category-creative-inspiration","tag-design-education"],"acf":[],"yoast_head":"\n15 Diagrams That Make Graphic Design Much Easier - Creative Market Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"15 Diagrams That Make Graphic Design Much Easier\" \/>\n<meta property=\"og:description\" content=\"If you're a graphic designer reading this blog, there's probably a good chance you already know how tough graphic design can be. However, practice makes\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams\" \/>\n<meta property=\"og:site_name\" content=\"Creative Market Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/crtvmrkt\" \/>\n<meta property=\"article:published_time\" content=\"2016-09-01T12:35:11+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-12T09:35:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2016\/09\/11223240\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp\" \/>\n<meta name=\"author\" content=\"Creative Market\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:site\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Creative Market\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams\",\"name\":\"15 Diagrams That Make Graphic Design Much Easier - Creative Market Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2016\\\/09\\\/11223240\\\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp\",\"datePublished\":\"2016-09-01T12:35:11+00:00\",\"dateModified\":\"2024-04-12T09:35:03+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#\\\/schema\\\/person\\\/d6927fab89f28e3dd8f6bb7b36219d66\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams#primaryimage\",\"url\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2016\\\/09\\\/11223240\\\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp\",\"contentUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2016\\\/09\\\/11223240\\\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/graphic-design-diagrams#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"15 Diagrams That Make Graphic Design Much Easier\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\",\"name\":\"Creative Market Blog\",\"description\":\"Creative Market Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"15 Diagrams That Make Graphic Design Much Easier - Creative Market Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams","og_locale":"en_US","og_type":"article","og_title":"15 Diagrams That Make Graphic Design Much Easier","og_description":"If you're a graphic designer reading this blog, there's probably a good chance you already know how tough graphic design can be. However, practice makes","og_url":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams","og_site_name":"Creative Market Blog","article_publisher":"https:\/\/www.facebook.com\/crtvmrkt","article_published_time":"2016-09-01T12:35:11+00:00","article_modified_time":"2024-04-12T09:35:03+00:00","og_image":[{"url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2016\/09\/11223240\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp","type":"","width":"","height":""}],"author":"Creative Market","twitter_card":"summary_large_image","twitter_creator":"@creativemarket","twitter_site":"@creativemarket","twitter_misc":{"Written by":"Creative Market","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams","url":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams","name":"15 Diagrams That Make Graphic Design Much Easier - Creative Market Blog","isPartOf":{"@id":"https:\/\/creativemarket.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams#primaryimage"},"image":{"@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams#primaryimage"},"thumbnailUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2016\/09\/11223240\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp","datePublished":"2016-09-01T12:35:11+00:00","dateModified":"2024-04-12T09:35:03+00:00","author":{"@id":"https:\/\/creativemarket.com\/blog\/#\/schema\/person\/d6927fab89f28e3dd8f6bb7b36219d66"},"breadcrumb":{"@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creativemarket.com\/blog\/graphic-design-diagrams"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams#primaryimage","url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2016\/09\/11223240\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp","contentUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2016\/09\/11223240\/15-Graphic-Design-Diagrams-Infographic-Layouts.jpg.webp"},{"@type":"BreadcrumbList","@id":"https:\/\/creativemarket.com\/blog\/graphic-design-diagrams#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/creativemarket.com\/blog\/"},{"@type":"ListItem","position":2,"name":"15 Diagrams That Make Graphic Design Much Easier"}]},{"@type":"WebSite","@id":"https:\/\/creativemarket.com\/blog\/#website","url":"https:\/\/creativemarket.com\/blog\/","name":"Creative Market Blog","description":"Creative Market Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/creativemarket.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/39148","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/users\/57"}],"replies":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/comments?post=39148"}],"version-history":[{"count":0,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/39148\/revisions"}],"wp:attachment":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/media?parent=39148"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/categories?post=39148"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/tags?post=39148"},{"taxonomy":"topics","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/topics?post=39148"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}