SEEINGRED     STUDIOK&M         THE DESIGN & USABILITY EXPERTS   .
PAINT THE TOWN REDWe here at Studio K&M love colors. As artists, how can we not?!Colors have been our tools ever since we ...
Not everyone believes in color theory, and I will admit that it is hard toassign black-and-white meanings (pun not intende...
Red is dynamic, red is bright. Red can overwhelm the eyes in largedoses, but can also provide a great accent color to grab...
IS YOUR HEART RACING YET?
THE WORLD WIDE WEB OF REDRed can be associated with passion, adventure, and violence, whichexplains why many of the follow...
CHROME BAGSChrome is a company that makes high quality messenger bags andother apparel, most of which features their famou...
Given this strong design sensibility, it makes sense that Chrome’swebsite is gorgeous and usable. The color palette is sle...
On their product page, there is a lot of information, but it is clearlyorganized. On this page red plays a similar role, a...
GORILLA COFFEEWe were initially excited when we found this visually striking website fora Brooklyn based coffee shop, but ...
The website is flash based, which immediately raises red flags. Thismeans long load times and clumsy navigation. From the ...
The shop is overwhelmingly red, with the yellow and red types of Coffeebordering on illegibility. The buy now buttons are ...
And it does, sort of. It leads to a menu of more vaguely worded linksthat eventually give you some information about the c...
TAAMI BERRYOur last usability review is for a site advertising and selling somethingcalled a táami berry. According to the...
This earthy chic site uses a scarlet shade in a unique way. Most of thered sites that I saw paired the color against stark...
The e-commerce page is clearly organized, with the complimentary olivegreen defining important information in a more subtl...
MORE RED WEBSITESHere are some more dynamic red websites for your inspiration. Why nottry doing your own usability review?
SHADES OF REDHow does red fit in with regards to the rest of the design world, such aspackaging and printed pieces? How ca...
BRIGHT REDBright red has been a popular color throughout history, and althoughthere are many variations in hue, they all c...
DARK REDWhether it’s maroon or burgundy, dark red can be an elegant alternativeto brighter shades. It is often used for fo...
LIGHT REDLight red is a color that has been gaining popularity recently. It is a softeralternative that can have a warm vi...
It’s interesting to note how the mood of each design changes basedon which shade is used. For those who are afraid to embr...
THAT’S ALL FOLKS!We’re Studio K&M, a New York based, full-service web and graphicdesign/concept firm. Our passion is to im...
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Seeing Red: Design Inspiration
Upcoming SlideShare
Loading in …5
×

Seeing Red: Design Inspiration

487 views

Published on

This presentation features an introduction to color theory and the color red, usability reviews of red websites, and red designs for your inspiration.

Published in: Design, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
487
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
15
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Seeing Red: Design Inspiration

  1. 1. SEEINGRED STUDIOK&M THE DESIGN & USABILITY EXPERTS .
  2. 2. PAINT THE TOWN REDWe here at Studio K&M love colors. As artists, how can we not?!Colors have been our tools ever since we opened our first box ofCrayola Crayons and experienced the sweet smell of variety (or maybeit was wax). As we grow as artists and designers our appreciation andunderstanding of color grows as well, but how many of the decisionsthat we make regarding color are intuitive? How often does the scienceof color come into play?
  3. 3. Not everyone believes in color theory, and I will admit that it is hard toassign black-and-white meanings (pun not intended) to specific colors.But whether explicit or intuitive, different colors can definitely conveyspecific meanings and trigger certain emotions.
  4. 4. Red is dynamic, red is bright. Red can overwhelm the eyes in largedoses, but can also provide a great accent color to grab someonesattention. Red has been known to raise blood pressure and heart rate,and increase appetite. It’s no surprise that red is often used in logos forsports, cars, and fast food. Just take a look at some of these examples:
  5. 5. IS YOUR HEART RACING YET?
  6. 6. THE WORLD WIDE WEB OF REDRed can be associated with passion, adventure, and violence, whichexplains why many of the following websites chose to feature it in theircolor palette. But is color alone enough to convey your message andcreate a site that’s easy to navigate? Let’s take a look at some redwebsites and see whether or not their use of color affects their usability.
  7. 7. CHROME BAGSChrome is a company that makes high quality messenger bags andother apparel, most of which features their famous red seat-belt closure.Here is their Design Manifesto (from their website):Chrome’s design is born of utility and purpose. We’re anti-nonsense.Everything we make is functional. Every piece of our bags, shoes andclothes is there for a reason. If it doesn’t have a purpose, it’s gone.www.chromebagstore.com
  8. 8. Given this strong design sensibility, it makes sense that Chrome’swebsite is gorgeous and usable. The color palette is sleek andgrayscale, with their trademark red highlighted in the logo and workingwell as an accent color. The strong red banner communicates the moodof the brand and educates the user about the company. Bright redcalls to action highlight special offers like free shipping, and a clean gridkeeps the rest of the information organized. The navigation is easy tofind and use, and turns red when hovered over.
  9. 9. On their product page, there is a lot of information, but it is clearlyorganized. On this page red plays a similar role, acting as bread crumbsto let you know where you are on the site and highlighting productnames and categories.
  10. 10. GORILLA COFFEEWe were initially excited when we found this visually striking website fora Brooklyn based coffee shop, but it soon proved to be slow and hardto navigate.www.gorillacoffee.com
  11. 11. The website is flash based, which immediately raises red flags. Thismeans long load times and clumsy navigation. From the home page,we were unsure where to go next. The bright red background is alittle much on the eyes, and their logo almost gets lost, especially injuxtaposition with the giant black gorilla. The only clear call to action isthe word shop, so that’s where we chose to click (though who wantsto shop if they even know what they’re shopping for?!). The home pagedoesn’t even say the word coffee once!
  12. 12. The shop is overwhelmingly red, with the yellow and red types of Coffeebordering on illegibility. The buy now buttons are lost, as they are thesame color as the background. This site would have been much moreeffective if the background was a different color and the red was savedfor the accents. At this point we’re starting to get annoyed by the flashbased navigation, so we try to find out more about the company byclicking “From A Little Town Called Brooklyn”, figuring that might lead tosome sort of about page.
  13. 13. And it does, sort of. It leads to a menu of more vaguely worded linksthat eventually give you some information about the company. Once youmake it past the loading screen. However, we have a feeling that theaverage user would have already clicked the back button.
  14. 14. TAAMI BERRYOur last usability review is for a site advertising and selling somethingcalled a táami berry. According to the site “the táami berry is a smallmiracle fruit that has the power to flip our perception of flavors, makingsour and bitter flavors taste extremely sweet and delicious.” Their targetaudience seems to be health and beauty conscious women, whichwould explain the feminine color palette.www.taamiberry.com
  15. 15. This earthy chic site uses a scarlet shade in a unique way. Most of thered sites that I saw paired the color against stark black and white, buttáami berry uses beige and olive green to create a much softer, but stillvery elegant feel. The berries themselves are red, and this color turns upagain in the logo, slider, navigation, and calls to action.
  16. 16. The e-commerce page is clearly organized, with the complimentary olivegreen defining important information in a more subtle way, with the redhighlighting specifics such as price. The company appears to be on ahiatus (all of the products are out of stock). So maybe they don’t getpoints for dynamic content, but they definitely rock a solid design andinformation architecture.
  17. 17. MORE RED WEBSITESHere are some more dynamic red websites for your inspiration. Why nottry doing your own usability review?
  18. 18. SHADES OF REDHow does red fit in with regards to the rest of the design world, such aspackaging and printed pieces? How can different shades of the samecolor communicate such a multitude of meanings? Wikipedia has 47pages dedicated to different shades of red, and with this sheer variety,it is bound that different colors will have slightly different psychologicalassociations. Let’s take a look at some other uses of the color red andreflect on the color psychology behind these designs.
  19. 19. BRIGHT REDBright red has been a popular color throughout history, and althoughthere are many variations in hue, they all convey power and strength.Bright red is very effective for creating a memorable impression. Itmakes sense that many red designs are about passionate subjects(politics, love, health), and bright red also has a timeless quality thatmakes it perfect for creating a classic brand.
  20. 20. DARK REDWhether it’s maroon or burgundy, dark red can be an elegant alternativeto brighter shades. It is often used for food and restaurant designs, as itstill promotes appetite without being too aggressive. Dark red can havealso have a more serious tone and can make for visually striking postersand packaging, and it is associated with courage and leadership.
  21. 21. LIGHT REDLight red is a color that has been gaining popularity recently. It is a softeralternative that can have a warm vintage feel, making it both trendy andtrustworthy. Light red is associated with joy, sensitivity, and love.
  22. 22. It’s interesting to note how the mood of each design changes basedon which shade is used. For those who are afraid to embrace theboldest shades, lighter and darker versions might provide a more subtlealternative. Viva la red!
  23. 23. THAT’S ALL FOLKS!We’re Studio K&M, a New York based, full-service web and graphicdesign/concept firm. Our passion is to improve the user’s experience onthe web and deliver powerful online solutions that help drive sales andincrease conversions.Follow us on Twitter for more usability tips and updates! @StudioKandMwww.studiokandm.com | 212.987.0076 | info@studiokandm.com

×