Picture Superiority Effect
People remember pictures easier than words. In advertising, an ad with a picture and words will help consumers to recall a product when they have seen it associated with a picture. I think of this like signs for McDonalds and Wendy’s and Burger King. The same pictures (emblems) are associated with the name of the restaurants on their signs. Children recognize these establishements long before they can actually read the words.
Recognition over Recall
It is easier to recognize something than it is to recall it. That is why children (and adults) cry when teachers give them essay and fill in the answers tests as opposed to multiple choice. In multiple choice, you might not be able to scream out the answer, but may recognize it once you see it as a choice. Kind of like an agh ha moment.
Serial Position Effects
This is when people try to recall items from a list and how it is easier to recall the items at the beginning and also the ones at the end. Kind of like the middle child syndrome. (I am the oldest and my sister used to cry about this all the time growing up). It was interesting to learn that if you are teaching something visual, you should present the most important facts at the beginning and the opposite if you are teaching something auditory.
Monday, June 30, 2008
Friday, June 27, 2008
Website Review Assignment -
Search engine - http://www.google.com/
Google has a non distracting white background, a very simple design. Google needs to portray simplicity because they want users to choose their site with the idea that is it easier to use than other search engines. They need the site to be free of distraction and other non essential hoopla and unnecessary items on the screen to focus on the reason for the website, searching for other websites. The idea is to not spend a lot of time on the website, it is to keep people coming back over and over again. The designers also use the primary colors. I think that this too has users feeling at ease and is associated with feelings of youth and familiarity connected with elementary school. Google will also sometimes change the colors on their logo to coincide with the seasons. I have seen red and green at Christmas and pastel colors around Easter.
The menu bar is at the top left and uses a simple blue lettering. If you choose to click on the different pages of the website, the pages follow the simplistic design of the Home page. The Google Logo is in primary colors and there is very little else on the page. The Map and News tabs are an exception because their function is a little different than the search screens. On the Map page, the background of the map is a lighter blue color that is soothing on the eye, not distracting in any way almost inviting you to use the map. The lettering on the Map is a gray which is cool and calming. Maps can be overwhelming and scary to some (myself included) and I think that the softness says to the viewer, do not be afraid to try it out. The news page is a little busier and is a new addition to the site. The top of the page has the signature Google Logo in its primary colors and a white background. This is underlined by a red line signifying authority. The top of the screen mirrors the tranquility of the other pages. Under the red line there is a lot more text and it not as calm as you would expect from a news site. This particular area of the site is not designed like the rest of the site because its function is different. Overall, I think that Google site was designed with the above ideas in mind and were very successful in doing so.
College Website - http://www.kent.edu/index.cfm
Kent uses its school colors to portray a sense of school spirit. I also nicely uses different tints of the colors by adding white to compliment each other instead of the hue of the color which would deeply contrast each other. White lettering is also used in the top block of the website as a subtle contrast (in the darkest of the three choices of backgrounds). The letters stand out, but are not offending. Another feature that was nice for someone that might have sensitive eyes or poor vision, is that there is an option available to change the color combinations on the website. There is also an option for a text version of the site that removes all of the images and only has a white background with blue text. The text is bright blue and easy to read. This too is an option to help viewers with special needs. I prefer the color combination of the darker blue top with the light blue and yellow. I am not sure what about this combination is more attractive to me. I have been starring at it for several minutes trying to figure this out. I think because in the light blue version there is no contrast on the screen in the top to the bottom and in the yellow version, I am just not a big fan of that tint of yellow (which I want to call a shade automatically but a shade is actually adding black to the hue which would be incorrect!). It is more of a color preference than a design flaw I would say.
It was smart for the designers not to use the pure hue of yellow, as yellow is the hottest color and this would have portrayed a different atmosphere to the website. I believe that the feel that the creators are going for is Prestige and Classical. Using muted colors helps create the targeted atmosphere. Overall, I say that this website was very nicely created.
The web designers also did a very good job of consistently carrying over the same color scheme throughout the website. This applies to the different pages and the sub pages on these pages. An exception to this rule, I found is the Kent’s Sport’s page. I think that it is appropriate to use the bold natural hues of the school’s colors for this section of the website. The yellow signifies the hotness of the Golden Flashes and the bold blue is a great contrast to the yellow. It gives a feeling of boldness or fearless fighting to victory. (this unfortunately does not always carry over into the actual field!). I think that the designers of the Kent State website also did a great job in their design.
Online Retail Website - http://www.anntaylor.com/home.jsp
I love the Ann Taylor clothing store. I do not get to if often because the mall is about 25 minutes from my house and with having two kids, a full time job, a husband and taking graduate classes, I do not have a lot of spare time to drive to the mall. Online shopping at anntaylor.com is the next best thing. I happen to partake of this fun more often than getting to the real brick and mortar store. Before I start evaluating the website with the criteria from required reading article at http://www.colormatters.com/des_ecom.html, I must say that I am not pleased with the sites choice of background color for what is probably its summer look. They chose a bright yellow. I am sure that it is supposed to signify the hot summer months ahead, but I do not think that it goes with Ann Taylor’s conservative look of their clothes. They did not change anything else about the site, just slapped up a bright yellow background. It just does not go with the subtle colors in the rest of the website.
According to the article there are four formulas for success in an online retail store. The first consideration is whether the images are converted into the correct formatting which allows the images to open quickly and also delivers the best color quality. I do not know a lot about the different choices of formatting for pictures on the internet but I can say that the images of the clothes opened in less than two seconds. I think that this is a pretty fast response time and I would say that the site passes the test on the first part of the criteria. The images are also nice and crisp and clear. They are not blurry in any way.
The second part of the evaluation of retail websites is selecting the appropriate colors after analyzing the store’s products and target market. If you omit the awful background color of the site, the main part of the site follows this rule of thumb. The colors are conservative. Light colors, medium gray lettering on top of a mostly gray and some white background. The designer pulls out a dominant color in the clothing of Rose and uses this to contrast items that are on sale and also for some of the sub categories like types of clothing. Again, meeting the second criteria for evaluation.
The third part of the evaluation is using color to move the viewer through the page in the correct sequence. Where they should look first, go next and so forth. When first looking on the Home page my eye is drawn to the bright Rose type telling me about the new June line of clothing. From there I look down to the categories of clothing that I want to look at. I select the appropriate page and then begin browsing the new clothing line. As I move through the new clothes, my eye is brought to some sale items that are highlighted with the rose type. I enjoy a good sale. After I am done browsing and I select my choices, my eye is taken to the top of the page where in the rose color again, I notice the banner that tells me that the shipping on every order is only six dollars. (this color is a nice contrast with the otherwise gray and white type on the site). If I was not going to purchase anything, I think that the sale in shipping would sway my decision. From there I would move to the check out screen and proceed with my purchases. I am not sure how if this is exactly what the designers of the website had planned, but it worked just fine for me. I did not run into any snags and did not have trouble navigating through the site. I would say that they did a great job on this section of criteria too.
The last piece of evaluation suggests that the color should create harmony along all of the pieces of the website (navigation, type, images, merchandise). All of the parts of the website should work together. As I stated earlier all but the background color of this site, which is not a permanent fixture, work together in harmony. The contrasting rose colored type is pulled out from the color that is dominant this season’s clothing in the same rose color. The light gray background with white works in harmony of the darker gray type. Overall, this site was designed very nicely except for the BADLY contrasted hot yellow that they have added for the summer months. I hope this is not a permanent fixture on the site.
Food - http://www.mcdonalds.com/corp.html
I was very surprised at how unexciting McDonald’s website was when I looked it up. The background is black and on the Homepage, the only yellow on the page is one Golden Arch. There are few colors on the website. Black, white, red and then the yellow from the Golden Arch are the only present. There is one tiny picture on the Homepage and it is sort of blurry. I would have expected the McDonald’s website to have the familiar Golden Arc all over its pages and the colors of McDonald’s predominant throughout the website. If you removed the one Arch on the Home page, one would not know they were looking at the McDonald’s website.
There is a nice contrast at the top of the page in the red banner. The designer uses white type in the red banner. This is appealing to the eye. The combination is flipped on the right side of the Homepage, red type in a white box. This is not as pleasing to the eye and frankly hard on the eyes. This theme is carried out throughout the various pages. The designer at least does a good job of using the same repetition of color throughout the site, sticking with the same layout.
The Franchising page is the most pleasing page to the eye and should have been the model of how the whole site was designed. There are various pictures of McDonalds in the middle of the page. The pages accent the Golden Arches and this is pulled out and brings out the yellow in the Arch at the top of the page. This gives you the feel of being a child and eating at McDonalds. This caused an emotional reaction in me and this page would make me want to eat at McDonald’s.
Overall, I have to say that this was a very unprofessional looking website. I am disappointed. As I said above, had the designers used the Franchise page as a guide, the site would have been so much nicer.
Electronics - http://www.bestbuy.com/
When you look at the Best Buy site, you know you where you are. The color alone holds the theme of Best Buy. The designer uses different shades and tones of the Best Buy Blue throughout the site. There is a nice Best Buy Banner in the upper left hand corner of the site and then they carry that color in type throughout the site.
The designers of this site use saturation in the pictures and type. Which is a nice touch since most things on the site are metallic or in the black and gray family already. They use the same colors in the type and it just gives the website a nice crisp feel. Another nice use of color on the site is when you put your cursor over the headings of the different pages, it highlights them in the Best Buy yellow. This is very appealing to the eye.
Best Buy, like all of the other sites reviewed, does a nice job of carrying the repetition of color combinations into the other pages of the site. The top blue bar at the top of the Home Page is exactly the same in each of the different pages.
One last thing that I noticed about the Best Buy site was they had an option to select Spanish as the primary language on the site. They managed to create an identical site by replacing the English language with Spanish. Not technically a special need, but something very helpful to those who do not speak English. This was a very smart move for the designers. This site gets my two thumbs up! I would pick the Best Buy site as the best designed out of the five that I reviewed.
Google has a non distracting white background, a very simple design. Google needs to portray simplicity because they want users to choose their site with the idea that is it easier to use than other search engines. They need the site to be free of distraction and other non essential hoopla and unnecessary items on the screen to focus on the reason for the website, searching for other websites. The idea is to not spend a lot of time on the website, it is to keep people coming back over and over again. The designers also use the primary colors. I think that this too has users feeling at ease and is associated with feelings of youth and familiarity connected with elementary school. Google will also sometimes change the colors on their logo to coincide with the seasons. I have seen red and green at Christmas and pastel colors around Easter.
The menu bar is at the top left and uses a simple blue lettering. If you choose to click on the different pages of the website, the pages follow the simplistic design of the Home page. The Google Logo is in primary colors and there is very little else on the page. The Map and News tabs are an exception because their function is a little different than the search screens. On the Map page, the background of the map is a lighter blue color that is soothing on the eye, not distracting in any way almost inviting you to use the map. The lettering on the Map is a gray which is cool and calming. Maps can be overwhelming and scary to some (myself included) and I think that the softness says to the viewer, do not be afraid to try it out. The news page is a little busier and is a new addition to the site. The top of the page has the signature Google Logo in its primary colors and a white background. This is underlined by a red line signifying authority. The top of the screen mirrors the tranquility of the other pages. Under the red line there is a lot more text and it not as calm as you would expect from a news site. This particular area of the site is not designed like the rest of the site because its function is different. Overall, I think that Google site was designed with the above ideas in mind and were very successful in doing so.
College Website - http://www.kent.edu/index.cfm
Kent uses its school colors to portray a sense of school spirit. I also nicely uses different tints of the colors by adding white to compliment each other instead of the hue of the color which would deeply contrast each other. White lettering is also used in the top block of the website as a subtle contrast (in the darkest of the three choices of backgrounds). The letters stand out, but are not offending. Another feature that was nice for someone that might have sensitive eyes or poor vision, is that there is an option available to change the color combinations on the website. There is also an option for a text version of the site that removes all of the images and only has a white background with blue text. The text is bright blue and easy to read. This too is an option to help viewers with special needs. I prefer the color combination of the darker blue top with the light blue and yellow. I am not sure what about this combination is more attractive to me. I have been starring at it for several minutes trying to figure this out. I think because in the light blue version there is no contrast on the screen in the top to the bottom and in the yellow version, I am just not a big fan of that tint of yellow (which I want to call a shade automatically but a shade is actually adding black to the hue which would be incorrect!). It is more of a color preference than a design flaw I would say.
It was smart for the designers not to use the pure hue of yellow, as yellow is the hottest color and this would have portrayed a different atmosphere to the website. I believe that the feel that the creators are going for is Prestige and Classical. Using muted colors helps create the targeted atmosphere. Overall, I say that this website was very nicely created.
The web designers also did a very good job of consistently carrying over the same color scheme throughout the website. This applies to the different pages and the sub pages on these pages. An exception to this rule, I found is the Kent’s Sport’s page. I think that it is appropriate to use the bold natural hues of the school’s colors for this section of the website. The yellow signifies the hotness of the Golden Flashes and the bold blue is a great contrast to the yellow. It gives a feeling of boldness or fearless fighting to victory. (this unfortunately does not always carry over into the actual field!). I think that the designers of the Kent State website also did a great job in their design.
Online Retail Website - http://www.anntaylor.com/home.jsp
I love the Ann Taylor clothing store. I do not get to if often because the mall is about 25 minutes from my house and with having two kids, a full time job, a husband and taking graduate classes, I do not have a lot of spare time to drive to the mall. Online shopping at anntaylor.com is the next best thing. I happen to partake of this fun more often than getting to the real brick and mortar store. Before I start evaluating the website with the criteria from required reading article at http://www.colormatters.com/des_ecom.html, I must say that I am not pleased with the sites choice of background color for what is probably its summer look. They chose a bright yellow. I am sure that it is supposed to signify the hot summer months ahead, but I do not think that it goes with Ann Taylor’s conservative look of their clothes. They did not change anything else about the site, just slapped up a bright yellow background. It just does not go with the subtle colors in the rest of the website.
According to the article there are four formulas for success in an online retail store. The first consideration is whether the images are converted into the correct formatting which allows the images to open quickly and also delivers the best color quality. I do not know a lot about the different choices of formatting for pictures on the internet but I can say that the images of the clothes opened in less than two seconds. I think that this is a pretty fast response time and I would say that the site passes the test on the first part of the criteria. The images are also nice and crisp and clear. They are not blurry in any way.
The second part of the evaluation of retail websites is selecting the appropriate colors after analyzing the store’s products and target market. If you omit the awful background color of the site, the main part of the site follows this rule of thumb. The colors are conservative. Light colors, medium gray lettering on top of a mostly gray and some white background. The designer pulls out a dominant color in the clothing of Rose and uses this to contrast items that are on sale and also for some of the sub categories like types of clothing. Again, meeting the second criteria for evaluation.
The third part of the evaluation is using color to move the viewer through the page in the correct sequence. Where they should look first, go next and so forth. When first looking on the Home page my eye is drawn to the bright Rose type telling me about the new June line of clothing. From there I look down to the categories of clothing that I want to look at. I select the appropriate page and then begin browsing the new clothing line. As I move through the new clothes, my eye is brought to some sale items that are highlighted with the rose type. I enjoy a good sale. After I am done browsing and I select my choices, my eye is taken to the top of the page where in the rose color again, I notice the banner that tells me that the shipping on every order is only six dollars. (this color is a nice contrast with the otherwise gray and white type on the site). If I was not going to purchase anything, I think that the sale in shipping would sway my decision. From there I would move to the check out screen and proceed with my purchases. I am not sure how if this is exactly what the designers of the website had planned, but it worked just fine for me. I did not run into any snags and did not have trouble navigating through the site. I would say that they did a great job on this section of criteria too.
The last piece of evaluation suggests that the color should create harmony along all of the pieces of the website (navigation, type, images, merchandise). All of the parts of the website should work together. As I stated earlier all but the background color of this site, which is not a permanent fixture, work together in harmony. The contrasting rose colored type is pulled out from the color that is dominant this season’s clothing in the same rose color. The light gray background with white works in harmony of the darker gray type. Overall, this site was designed very nicely except for the BADLY contrasted hot yellow that they have added for the summer months. I hope this is not a permanent fixture on the site.
Food - http://www.mcdonalds.com/corp.html
I was very surprised at how unexciting McDonald’s website was when I looked it up. The background is black and on the Homepage, the only yellow on the page is one Golden Arch. There are few colors on the website. Black, white, red and then the yellow from the Golden Arch are the only present. There is one tiny picture on the Homepage and it is sort of blurry. I would have expected the McDonald’s website to have the familiar Golden Arc all over its pages and the colors of McDonald’s predominant throughout the website. If you removed the one Arch on the Home page, one would not know they were looking at the McDonald’s website.
There is a nice contrast at the top of the page in the red banner. The designer uses white type in the red banner. This is appealing to the eye. The combination is flipped on the right side of the Homepage, red type in a white box. This is not as pleasing to the eye and frankly hard on the eyes. This theme is carried out throughout the various pages. The designer at least does a good job of using the same repetition of color throughout the site, sticking with the same layout.
The Franchising page is the most pleasing page to the eye and should have been the model of how the whole site was designed. There are various pictures of McDonalds in the middle of the page. The pages accent the Golden Arches and this is pulled out and brings out the yellow in the Arch at the top of the page. This gives you the feel of being a child and eating at McDonalds. This caused an emotional reaction in me and this page would make me want to eat at McDonald’s.
Overall, I have to say that this was a very unprofessional looking website. I am disappointed. As I said above, had the designers used the Franchise page as a guide, the site would have been so much nicer.
Electronics - http://www.bestbuy.com/
When you look at the Best Buy site, you know you where you are. The color alone holds the theme of Best Buy. The designer uses different shades and tones of the Best Buy Blue throughout the site. There is a nice Best Buy Banner in the upper left hand corner of the site and then they carry that color in type throughout the site.
The designers of this site use saturation in the pictures and type. Which is a nice touch since most things on the site are metallic or in the black and gray family already. They use the same colors in the type and it just gives the website a nice crisp feel. Another nice use of color on the site is when you put your cursor over the headings of the different pages, it highlights them in the Best Buy yellow. This is very appealing to the eye.
Best Buy, like all of the other sites reviewed, does a nice job of carrying the repetition of color combinations into the other pages of the site. The top blue bar at the top of the Home Page is exactly the same in each of the different pages.
One last thing that I noticed about the Best Buy site was they had an option to select Spanish as the primary language on the site. They managed to create an identical site by replacing the English language with Spanish. Not technically a special need, but something very helpful to those who do not speak English. This was a very smart move for the designers. This site gets my two thumbs up! I would pick the Best Buy site as the best designed out of the five that I reviewed.
Tuesday, June 24, 2008
Color according to Williams
Man.. I should have read her book first.. She has such a great way of simplifying things for the not so savvy designer.... I was able to understand for the first time the Color Wheel. I like the way that she started with the three primary colors and went on to explain where the rest of the color wheel came from and also about white (absence of all color) and black (the combo of all color).
In the color category I think this might be my Wimpiest area!!! I could never see mixing orange and blue.. and then when you get into the crazy triads and split compliment triads. It will probably take me a while to work up to that. I tend to be very conservative. Something that I hope to work through.....
In the color category I think this might be my Wimpiest area!!! I could never see mixing orange and blue.. and then when you get into the crazy triads and split compliment triads. It will probably take me a while to work up to that. I tend to be very conservative. Something that I hope to work through.....
Monday, June 23, 2008
Attractiveness Bias
You see this all the time in advertisement. A pretty, skinny lady is going to sell more bottled water than an over weight unattractive lady. A buff man is going to see a gym membership easier than a man with a potbelly. You even notice good looking people in TV ads and print when the product has nothing to do with exercise or fitness.
I found it very fascinating that babies looked longer at attractive people regardless of their gender, age and race. Though I do question the theory of "Beauty is in the Eye of the Beholder". I wonder how this comes into play in the Attractiveness Bias. Who's idea of attractiveness are we talking about?
I found it very fascinating that babies looked longer at attractive people regardless of their gender, age and race. Though I do question the theory of "Beauty is in the Eye of the Beholder". I wonder how this comes into play in the Attractiveness Bias. Who's idea of attractiveness are we talking about?
Alignment
Wow.. I know, I use this term a lot. What a great example of how important alignment is using the ballot from 2000. It is sad that something so poorly designed is associated with something as important as a Presidential election. That image was almost as powerful as the one on pg 33 with the poor girl that was hit by the drunk driver symbolizing Classical Conditioning.
I tried to use diagonal alignment on my Visual Timeline. This was hard to do. I am not sure what angle mine was at. I did note that if trying to use diagonal alignment in the future, that I should use the 30 degree rule.
I tried to use diagonal alignment on my Visual Timeline. This was hard to do. I am not sure what angle mine was at. I did note that if trying to use diagonal alignment in the future, that I should use the 30 degree rule.
My thoughts and observations on the articles for this week
First article
http://www2.peterli.com/spm/resources/articles/archive.php?article_id=551 – Color in Education
I found in interesting to think about using faux chrome in an automotive vocation classroom, or using colors of race cars to enhance the learning environment. Another thing that I found interesting was to think about using different colors in classrooms in different areas of the country. For example using orange in a sunny state might over stimulate the learners as using grays in classrooms in the northern states where winters are gray is not a good choice either.
I really liked the idea of using paint as a cheap alternative to updating schools. My favorite idea was to get the children involved in the paint selection process.
http://www.colormatters.com/computers.html - Color Matters
I realized the importance of a good monitor after reading this article. Interesting that even if you have a good video card, good operating system and also good application software, the color can be distorted by a cheap monitor. It was crazy to see the differences in color that a different viewer sees depending on the computer components.
I had no idea the amount of effort that went into creating colors and getting colors to our computers. I made my head spin. I often think about things like this and think how in the world did someone come up with that sequence to make it happen?
Another interesting fact that as color technology in video improved, it switched from digital to analog. I liked how the article went on the explain how all the components worked together and it also suggested if you are in the market for a new monitor, to actually bring your PC in to test out the different monitors and how compatible they are with your particular components.
http://www.colormatters.com/culturematters.html - Green trivia..
Very interesting tidbits about green. I am glad that in the US we wear white wedding gowns.. though my bridesmaids did wear green.
http://www2.peterli.com/spm/resources/articles/archive.php?article_id=551 – Color in Education
I found in interesting to think about using faux chrome in an automotive vocation classroom, or using colors of race cars to enhance the learning environment. Another thing that I found interesting was to think about using different colors in classrooms in different areas of the country. For example using orange in a sunny state might over stimulate the learners as using grays in classrooms in the northern states where winters are gray is not a good choice either.
I really liked the idea of using paint as a cheap alternative to updating schools. My favorite idea was to get the children involved in the paint selection process.
http://www.colormatters.com/computers.html - Color Matters
I realized the importance of a good monitor after reading this article. Interesting that even if you have a good video card, good operating system and also good application software, the color can be distorted by a cheap monitor. It was crazy to see the differences in color that a different viewer sees depending on the computer components.
I had no idea the amount of effort that went into creating colors and getting colors to our computers. I made my head spin. I often think about things like this and think how in the world did someone come up with that sequence to make it happen?
Another interesting fact that as color technology in video improved, it switched from digital to analog. I liked how the article went on the explain how all the components worked together and it also suggested if you are in the market for a new monitor, to actually bring your PC in to test out the different monitors and how compatible they are with your particular components.
http://www.colormatters.com/culturematters.html - Green trivia..
Very interesting tidbits about green. I am glad that in the US we wear white wedding gowns.. though my bridesmaids did wear green.
Thursday, June 19, 2008
Aesthetic-Usability Effect
The basic of this concept is.. the better the item looks, the easier it is to operate. Though sometimes something that is not as aesthetically appealing could in fact be easier to use.. but, people are more apt to try the aesthetically pleasing item.
It also stated that aesthetically pleasing items are used more frequently, more readily accepted and more tolerable to users.
The book gives an example of Nokia creating colorful skins for their phones to help hide their flaws, making the trouble of lost signals and interference more tolerable.
It also stated that aesthetically pleasing items are used more frequently, more readily accepted and more tolerable to users.
The book gives an example of Nokia creating colorful skins for their phones to help hide their flaws, making the trouble of lost signals and interference more tolerable.
Subscribe to:
Posts (Atom)