Website or Mobile design guidelines is a document that outlines the elements used in the design mockups and prototypes. The design guideline is based on your company’s or application logo. The design guideline importance is that when designing prototypes, all the elements will look the same hence providing quality work. Take for example a button with a specific design, you would want to see the same button with the same design across all pages, not looking different from one page to another.
“The public is more familiar with bad design than good design. It is, in effect, conditioned to prefer bad design, because that is what it lives with. The new becomes threatening, the old reassuring.” — Paul Rand, graphic designer
So, what does a design guideline contains? First, it tells you how to use the logo across bright and dark backgrounds. Additionally, it defines the main color pallets used across your design prototypes, the secondary and background color pallets; all inspired and relevant to the logo colors. Secondly, it defines your primary and secondary fonts along with the font designs and sizes for a header, title, sub-title, paragraphs and even price tags on products if you are building an E-commerce platform. Thirdly, depending on what you are building, be it a website or a mobile application, it defines different sections like how the forms and their fields will be outlines such as a contact us form as well as all the design icons such as social media and login icons to give harmony to the overall design.
