Discovering Your Visual Preferences

Website design isn’t so much about designing how content looks, it’s about designing the framing of the content. Good design puts the content in a context that reinforces and extends your brand, and underscores your message.

 

In a perfect world, every company and organization would have branding design and guidelines that run as deep as the Coca Cola Company’s. But in world of limited resources, web designers and their clients sometimes need to extend the brand to a website without visual precedent. In order to aid this process of determining the right look without reference, the examples below have been collected to help narrow down visual preferences.


Color Palette: Cool/Warm/Complementary

Cool Color Palettes

web-snapcolor-1113-24

 

web-snap263

 

 

Warm Color Palettes

web-snaprew-24

 

web-snaprew-23

 

 

Complementary Color Palettes

web-snapbig-bg-2_mini

 

web-snapcolor-1113-3

 

 

Color Palette: Neutral/Vibrant

Neutral Color Palettes

web-snapchurch-sites-14-25

 

web-snap0414-da-3

 

 

Vibrant Color Palettes

web-snap163

 

web-snapcolor-1113-25

 

 

Tonal Value: Light/Dark/Really Dark

Light Tonal Palette

web-snapmnml-18

 

web-snap1013-min-1

 

 

Dark Tonal Palette

web-snap0414-da-24

 

web-snap0414-da-29

 

 

Really Dark Tonal Palette

web-snap0414-da-11

 

web-snap0414-da-8

 

 

Pattern & Texture: Rich/Smooth and Flat

Rich Patterns & Textures

web-snapatdetail-14

 

web-snapchurch-sites-14-20

 

Smooth and Flat Patterns & Textures

web-snapchurch-sites-14-24

 

web-snap1-page-19

 

 

Line: Irregular and Organic/Smooth and Straight

Irregular and Organic Lines

web-snap1013-ecom-47

 

web-snapnp-14-16

 

web-snapnp-14-7

 

 

Smooth and Straight Lines

web-snap1013-min-25

 

web-snapchurch-0113-18

 

 

Image Framing: Boxed/Breaking the Box

Boxed Image Framing

web-snap1013-ecom-49

 

web-snap67

 

 

 

Breaking the Box Image Framing

web-snaprew-4

 

web-snaprew-27

 

 

Dimensionality: 2D/2.5 D/3D Things

2D Dimensionality

web-snapchurch-sites-14-12

 

web-snap0414-da-12

 

 

2.5D Dimensionality

web-snapcolor-1113-7

 

web-snapchurch-0113-19

 

 

3D Dimensionality/Things

web-snap1-page-23

 

web-snap55

 

 

Photo Use: Max/Minimal

Maximum Photo Use (NOTE: this requires investment in quality photography)

 

web-snapbig-bg-13_mini

 

web-snapbig-bg-6_mini

 

web-snap1-page-26

 

 

Minimal Photo Use

mnml-1

 

 

mnml-14

 

 

These examples have been brought together to help you refine and articulate what you are looking for in the visual direction of your web site. We understand that it’s not always easy to tell a designer what you like, that’s why at Atomic Blue we go the extra mile to clarify and communicate so we deliver just what our clients want.