ARTM2210 Intro to Web Design
Just another Intro to… siteArchive for Student Work
Monthly Review #4 – Madison Kozlowski
One of the websites that my group spent a lot of time looking at was that walkover.com, a site that sold vintage shoes that began as a family of shoemakers in 1758. In the beginning stages of our project we stumbled upon this site searching for vintage shoes and realized that we liked many things about it, eventually pulling a few ideas and techniques from the site.
The sites use of color is extremely simple, in fact there is very little color at all – and I think that is what the company was going for. There is more of an emphasis on the actual shoes that are being sold than the color scheme presented on the page. There is a lot of white, with touches of light browns and grays, as well as orange, which stands out tremendously against the other colors. Their photographs of the shoes are mostly always presented against white. To me, the simple design and color scheme is a reflection of their business and company culture – a great emphasis put on the quality of their shoes. The texture used on the site is very simple as well. The only texture that seems to be present is that of wood. Throughout the site I encountered two different types of wood paneling that appeared, one light and one dark. I think that this texture seemed to give the site a type of rustic and old appearance, while still maintaining a plain and clean page. I found the use of one very small gradient, but for the most part the wood backgrounds that were used was the only sense of texture.
The straight-forwardness of the site was shown in its navigation techniques as well. These too were very simple and easy to understand. There was a navigation bar at the top, and a useful footer at the bottom with links to other information. Drop down menus were used in the main navigation bar that sequentially opened more detailed destinations that could be clicked upon. I thought this was very useful, especially for a shoe site, where there are a plethora of different shoes to choose from. Instead of just clicking on boots, the menu extended and gave more specific kinds of boots (i.e. winter boots, leather boots). The logo was used as the home button, which is becoming a more popular tactic, but some people are not aware that you can click on a logo to return to the Home page. It is not an obvious button and I think that an actual “Home” button on the navigation bar is important. Your site should be easy to navigate and you don’t want users to have to use the tedious back button on their browser to get back to where they first began. However, I do think that the site does guide the user through the content nicely. A good amount of information is presented on the home page, enough so that it isn’t overwhelming. All of the tags are very detailed and easy to understand. An improvement to the site might be to add a feature that shows similar shoes, or “shoes you might like” when a specific shoe is clicked on. This might catch people’s eye and take them to a product that they otherwise may not have found. Overall, the site was well composed and detail-oriented.
Like mentioned above, my group took a few ideas from this site, but I do believe that our site stands out more than walkover.com. Ethel’s Lace Ups is a site only for women and it is obvious when you view the homepage. When I looked at the homepage of walkover.com, I thought the site consisted only of men’s shoes, but they had a women’s collection as well. I think it should be very obvious what a site sells by what is on the homepage. I think the overall feel of our site is more welcoming than Walkover’s and has a warmer color scheme. I think our site displays a more vintage feel. The minimalism of Walkover’s site reminded me of the more modern style. Overall, I think Ethel’s Lace Ups site is more original and provides a more vintage approach to the web than walkover.com.
Comments off
Monthly Review 3
The differences between the Zappos and Manolo Blahnik websites couldn’t be greater. While one, Zappos, has the primary purpose of selling online, Manolo Blahnik encourages visitors to their site to primarily engage with the company via social networking and inform potential customers where to buy their shoes in person.
Zappos has a website that is very busy, with lots of content, links, and navigation areas. The “above the fold” content (to use an newspaper term) displays the primary categories to shop by as the most prominent navigation, as well as secondary categorical navigation on the left to shop by the categories women’s, men’s, kid’s, or gifts. Also prominent at the top are the logo (complete with alteration for the holiday) a search bar, clearance link, and navigation to log-in or get live help.
Where Zappos seems to go awry of the fundamentals laid out in “Don’t Make Me Think” is in consistency of navigation throughout, and the search. The search bar becomes more confusing with text inside “Shoes, Clothing, Bags, etc.” and the links listed underneath. “Search By: Size, Narrow Shoes, Wide Shoes, Popular Searches.” It makes you wonder how you must search. Can I type in a size, or do I click the size link underneath? If I’m looking for Converse Shoes, do I type in “Converse” or “Shoes”? Further down the site, the secondary navigation on the left side does not stay consistent, with all of the heading items being links, “Shop Women’s” “Shop Men’s” “Shop Kids” “Shop Clearance.” Right below “Shop Clearance” is the heading “Specialty Shops.” However this heading does not link anywhere, but “Specialty Sizes” right below it does again. Where Zappos does well is the logo, search bar, primary navigation staying consistent throughout, as well as the page name being clearly laid out for each page.
Manolo Blahnik seems to have a completely different purpose to their website. My guess would be that they are trying to sell to a more select group of consumers, and are trying to keep the value of the brand high by only offering in store purchases as opposed to online purchases. In this way, the website is laid out to more prominently connect with them through social media, perhaps in order to feel that you’ve “joined the club” or are part of the group in the know. To that end, the website has very few links, and is a minimal and elegant design. Aside from the three social media links, only 3 other links are presented on the home page, “Home” “Contact” and “Where to Buy”
Manolo Blahnik has no indication on any page about what page you are on. This may not be much of an issue because there aren’t many main pages to explore, but as mentioned in “Don’t Make Me Think” if you arrive at a page other than the home page from a search, you would have no idea where in the site you are. Further issues arise on the “Where to Buy” page. A block of text addressing counterfeit labels, and lists the official locations to buy Manolo Blahnik shoes online, but there is no way to tell that the text has links in it. The website does attempt in a small way to breadcrumb on the submenu on the “Where to Buy” page, by having the text of your selection (where you are looking to buy) in a slightly darker gray color. However, it’s so faint that it barely registers. Completely missing is any sign of a search, with the only way apparent to get additional information being to send an email through their contact page.
Zappos and Manolo Blahnik seem to be targeting customers in completely different ways. While Zappos want to make as much information available as possible so the widest amount of people will be able to find what they’re looking for, Manolo Blahnik seems to be an exclusionary brand, that only a select group of people have access to, and that is conveyed through their site.
Comments off
Monthly Review #3
Sadie Schweinsberg
Monthly Review #3
I first looked at www.jimmychoo.com. It’s very classy and elegant and gives a feel of sophistication. It uses a lot of grays and blacks. There are a lot of panels that dictate the different categories of fashion they offer. The pictures differ from darks and mysterious to bright and flashy. There is a sense of balance because it has a grid like pattern but its asymmetrical with its panel placing. Its very interesting to watch the images scroll by and look at, let alone looking at the rest of the site.
The other site I looked at was www.zappos.com. The two couldn’t be more different. While jimmychoo uses dark colors and gives that sense of sophistication, Zappos uses bright relaxing color that give the appearance of picnics and summer. It gives off a much more relaxed feel and layout differs much. While jimmy used an asymmetrical grid, zappos uses a symmetrical grid layout. The products they offer differ much as well. Their categories are much more laid out as well making it easier to navigate from the beginning.
If I had to choose one I liked better, it would be jimmychoo because I prefer the darker colors to that of Zappos.
Comments off
Monthly Review 3
The differences between the Zappos and Manolo Blahnik websites couldn’t be greater. While one, Zappos, has the primary purpose of selling online, Manolo Blahnik encourages visitors to their site to primarily engage with the company via social networking and inform potential customers where to buy their shoes in person.
Zappos has a website that is very busy, with lots of content, links, and navigation areas. The “above the fold” content (to use an newspaper term) displays the primary categories to shop by as the most prominent navigation, as well as secondary categorical navigation on the left to shop by the categories women’s, men’s, kid’s, or gifts. Also prominent at the top are the logo (complete with alteration for the holiday) a search bar, clearance link, and navigation to log-in or get live help.
Where Zappos seems to go awry of the fundamentals laid out in “Don’t Make Me Think” is in consistency of navigation throughout, and the search. The search bar becomes more confusing with text inside “Shoes, Clothing, Bags, etc.” and the links listed underneath. “Search By: Size, Narrow Shoes, Wide Shoes, Popular Searches.” It makes you wonder how you must search. Can I type in a size, or do I click the size link underneath? If I’m looking for Converse Shoes, do I type in “Converse” or “Shoes”? Further down the site, the secondary navigation on the left side does not stay consistent, with all of the heading items being links, “Shop Women’s” “Shop Men’s” “Shop Kids” “Shop Clearance.” Right below “Shop Clearance” is the heading “Specialty Shops.” However this heading does not link anywhere, but “Specialty Sizes” right below it does again. Where Zappos does well is the logo, search bar, primary navigation staying consistent throughout, as well as the page name being clearly laid out for each page.
Manolo Blahnik seems to have a completely different purpose to their website. My guess would be that they are trying to sell to a more select group of consumers, and are trying to keep the value of the brand high by only offering in store purchases as opposed to online purchases. In this way, the website is laid out to more prominently connect with them through social media, perhaps in order to feel that you’ve “joined the club” or are part of the group in the know. To that end, the website has very few links, and is a minimal and elegant design. Aside from the three social media links, only 3 other links are presented on the home page, “Home” “Contact” and “Where to Buy”
Manolo Blahnik has no indication on any page about what page you are on. This may not be much of an issue because there aren’t many main pages to explore, but as mentioned in “Don’t Make Me Think” if you arrive at a page other than the home page from a search, you would have no idea where in the site you are. Further issues arise on the “Where to Buy” page. A block of text addressing counterfeit labels, and lists the official locations to buy Manolo Blahnik shoes online, but there is no way to tell that the text has links in it. The website does attempt in a small way to breadcrumb on the submenu on the “Where to Buy” page, by having the text of your selection (where you are looking to buy) in a slightly darker gray color. However, it’s so faint that it barely registers. Completely missing is any sign of a search, with the only way apparent to get additional information being to send an email through their contact page.
Zappos and Manolo Blahnik seem to be targeting customers in completely different ways. While Zappos want to make as much information available as possible so the widest amount of people will be able to find what they’re looking for, Manolo Blahnik seems to be an exclusionary brand, that only a select group of people have access to, and that is conveyed through their site.
Comments off
Monthly Review Three
The two sites I decided to describe and compare are Cole Haan and Jimmy Choo. I decided to go with these two sites because I have shopped at both stores and I am familiar with their products. When opening both of the sites I could easily figure out what site I was on. Both of the logos and/or company name is on the top of the page. Jimmy Choo has theirs on the left side and Cole Haan has theirs in the center. Both sites have a black and white color scheme. I think this relates to Krug’s point on minimizing noise. There isn’t any busyness. Having a simple black and white color scheme doesn’t take away from what the website is trying to sell and show you. The simply background isn’t overwhelming. It doesn’t take away from the shoes and other products. Each of the sites navigation bar lets you hover over the item, like women for example and gives you a drop down menu of the categories under women. Also, you can simple click on women as well. It then brings you to another page with all the women’s categories on the left hand side. From there the sites get a little different. On the Cole Haan site on the ride hand side next to all the categories, it has pictures promoting a friends and family event. Then if you scroll down it has pictures of handbags and shoes with links under them to shop specific categories like their new woven collection in shoes. There is some pictures bigger than others, there is two pictures the size of one. This layout breaks up the page a little and gives it balance. Now, on the Jimmy Cho page, once you click on women for example, there is all the categories on the left hand side just the the Cole Haan page. They have one big picture at the top that says “new arrivals, shop now”, then underneath is three smaller pictures side by side that say “shoes, accessories and handbags.” This gives the pages clearly define areas and helps users find what they want quickly in many different areas, which relates to Krug’s fact about make it obvious whats clickable, there is no wonder on where you need to go next. Each of the sites has different sizes of pictures. In Cole Haan, it has emphasis on the family and friends sale because the picture is larger than the rest and Jimmy Choo has more emphasis on new arrivals. Both of the sites have a clean and classy layout to them. There is nothing extra or not needed, no distracting pictures or tons of boring text. Both of the sites have the same high-end, classy feel and design because they are both high end and classy products.
Comments off
Fuss: Monthly Review 3
Two companies that sell the same general product can have two extremely different websites. Both can work well, but depending on the style of the company the results can be very different. Manolo Blahnik and Zappos are both shoe companies, but are extremely varied in what type of shoe they sell. This large difference can be seen directly in their websites.
Manolo Blahnik is a very interesting site that’s main strength is in its emphasis. When first opening the site, the color is very eye catching and interesting, and creates a great point of emphasis for the website. Unfortunately, past this initial interest, this site does not have many strengths. The balance on this site is not working well at all. On the home page there is an over abundance of open grey space below the main graphic. Usually this is not bothersome, but because the main site navigation buttons are below this blank space at the bottom, it creates an unbalanced look. The unity between pages is decent, though there are only three different pages to navigate to. Besides the over extended blank space, the layout is not completely terrible. Having the main site navigations at the bottom of the page is ineffective overall. As they are the main way to travel through the site, they should be at the top or left side, obvious and easily accessible.
Zappos is a much stronger website overall. Emphasis actually may be the only real weakness on this site. The site gets to be a little bit cluttered, which takes away from the emphasis on any certain item. The picture slideshow showcasing the shoes changes quite quickly and does not allow a person to focus on one item. Balance on Zappos is working quite well. Despite having so much on the site, taking away from the emphasis, it keeps all the madness well balanced. The layout of this site is what keeps it well balanced and saves the user from being lost by the clutter. The classic navigation bar at the top, with a list to the left for each page makes navigation simple and quick. Each page throughout the navigation is well unified with the whole site, making it easy to navigate.
While Manalo Blahnik is good at drawing your attention in at first, Zappos is overall a much easier to use and functional site.
Comments off
Monthly Review 3
http://www.manoloblahnik.com/
http://www.thefryecompany.com/
How do they use these principles and implement Krug’s five important “things” to make sure users see and understand the site?
The Frye Company
The balance of the Frye Company is more structured. There is a better balance to the site. It has more symmetry allowing the site a better visual appeal. The site feels whole and the different sections complement each other. The emphasis of this page is on the slightly opaque box over the picture. The layout of this site has a very structured hierarchy. It allows the user to easily find what they want. The site follows Krug’s 5 Things very well. It has a distinct hierarchy on every page. The pages have a clearly defined area that allows the consumer to find what they want. When something is clickable the mouse turns into a pointer. There is a lot of noise but I think it still works overall.
MANOLO BLAHNIK
The balance of the Manalo Blahnik website is off. There is too much empty space. The colors are all different and the shapes of the images don’t flow. There is no unity in this site the empty spaces are confusing. There are only three buttons that don’t allow you to very much navigation and do not provide much information. There is emphasis on the shoe in the center of the home page. My eye was immediately drawn to that. The layout of this page is dreadful. There are only three buttons at the bottom of the page. When you click on these buttons you won’t be able to ever order shoes from this site. There are links to other pages that allow you to order. This site does not follow Krug’s 5 Things very well. There is no set hierarchy to the site just the three buttons. All of the links change the mouse into a pointer which shows that it is a link. There isn’t a real distinction in the areas of a page either. Overall this site was designed poorly. Especially for being such an expensive shoe.
Is one site more effective than the other at drawing your attention, and why?
The Frye Company is definitely more effective as an overall effective website. It allows the user to actually order the shoes online. It also has more design features that would make me want to go to it instead of the Manalo Blahnik site.
Comments off
Monthly Review 3: Shoes Everywhere
For the third monthly review, we were told to analyze two different shoe company websites and compare how well design elements and Krug’s “five important things” are used. There were six different websites we could choose from. I ended up choosing zappos.com and thefryecompany.com simply after looking at their home pages. There was such a stark difference in the two sites I figured that finding stuff to compare would be easy. Turns out, in my opinion, I was right for once.
Zappos.com is the amazon of clothes, shoes, etc. From the homepage you can see how clean and organized the website feels. As you browse through some of the pages; the menu, search bar, and logo are at the top of the page. On the left side of the page there are also some subsections of some of the menus, which I think is nice. If I simply want to look at women’s shoes, I can easily click on this instead of using the menu or the search bar. The search bar worked surprisingly well for me. Like Amazon, the search bar will attempt to fill in your search for you. The search bar also accepted some pretty vague words; I was shocked that it accepted colors as a search for some reason. Once you decide on your search, the items pop up and, from there, you can narrow your search down via the “sort by” button or by the left hand subsections (which have now changed according to your search). Overall, it is a fairly straightforward shopping website.
Thefryecompany.com website is a lot more design oriented than zappos. The first thing you notice on the homepage is a rotating set of photos of people. Okay now, I realize that this is in fact a shoe/accessory company. But for some reason these photos threw me off a bit. They were highlighting the people wearing their products instead of just showing off their products. One thing that really bothered me was that, when you try to refine an item you’re looking at, there’s not really a clear indication of where the options are located. Turns out, you can find it by clicking on a little upside down arrow (carrot, whatever it’s called) thing. I did not even notice this the first couple times I tried narrowing down my searches. This website, while pretty to look at, made me a bit annoyed when I tried to do simple things.
Both of these websites are actually pretty good in their own way. They each have the basics: a menu that follows you, a search bar, a nice theme/color scheme, and good sectioning of items. I did prefer zappos.com a lot more than thefryecompany.com though mainly because I feel like it took zero effort to find exactly what I was looking for. I suppose I just prefer function over style.
Comments off
Monthly Review 3
For this monthly review I decided to compare the sites of The Frye Company and Cole Haan. Layout wise, they take a relatively similar approach to getting your attention and then displaying your products. Both start with a landing page that uses large text and images to show off their products and any featured sales or debuts. Once you go into an internal page (whether it is a list of products or a page about the company itself), they switch to a more traditional design on a one column layout. This layout means that everything below the top nav bar comes across as simply and straight forward.
Here’s where one difference arises. While both have relatively clean looking content areas on the pages, The Frye Company has a much more busy top nav than Cole Haan. Both use a series of stacking horizontal bars but Frye has several more and adds another as you drill down into products to narrow yours search. While Haan has one bar of products and one area above that for “utilities”, Frye has a bar of product categories that expands as well as several bars of utilities. Another way Haan handles the eventual increase in navigation elements is by having the tools for narrowing down your search appear to the left of the products, instead of in another top bar. This brings me to the topic of balance.
Overall, both sites do a pretty good job of achieving visual balance. The pages that use large images do so in a tasteful and logical way and the pages full of thumbnails fill out the space nicely without appearing cluddered. I do, however, thing Haan does a slightly better job. It never seems top heavy, as Frye sometimes does.
When it comes to unity I would say Haan gets the nod again. The design on Frye seems to struggle to decide on a consistent alignment. As a result, even though all of the elements have great color and typographic unity, they often don’t quite seem to fit. Haan does a good job of handling this. There are still several types of content visible on the site, each requiring their own way of being represented, but because the content is more clearly separated, there is the same sense of conflict.
As for having Krug’s 5 things to make sure are always on the page, both sites do a good job in their own ways. They generally accomplish this by keeping the top nav section consistent across all pages. It is worth nothing this is done even on less traditional pages (about us, blog) by having the content sections of those pages use unique designs or layouts. On both sites, these sections contain navigation, search, login, and site ID. This use of Krug’s most important elements makes sure the user is never lost or wondering how to get back home.
Overall I like both sites and plan on using them as inspiration for the final project. I would, as I’ve said before, give slight preference to Haan for its cleaner layout and user interface.
Comments off
Monthly Review 3
I chose to investigate the Jimmy Choo website, and the Manolo Blahnik website. Both websites are very classy looking and easy to navigate. However, the Manolo Blahnik website is very misleading. You cannot actually shop on the website. You can simply go “Home,” which is a beautiful graphic of a shoe and links to Facebook, Twitter, and Instagram; you can go to “Contact,” or you can go to “Where to Buy,” which only shows the consumer places in each region that sell Manolo Blahnik shoes. It does show 4 particular websites that you can purchase Manolo Blahnik from online, but those are the only places available online, not even from the Manolo Blahnik website itself. Also, besides the fact that there’s a graphic of a foot/shoe on the homepage, that is the only emphasis placed on shoes on the website. Every page of the site is unified between colors and clean styles though and there is very little noise and distractions on the pages.
The Jimmy Choo website, on the other hand, has several more options to explore on the website. The homepage is a bit busy, with all the images and different links, but is way more effective than the Manolo Blahnik website. You can actually buy shoes on the Jimmy Choo website. No matter what page you go to, they all have the same high-end, classy feel and design. Different sections of the site (i.e. women, men, collections, bridal boutique, etc) are clearly defined and easy to navigate and define clearly where you can click. For example, under “Women,” there are square images for “Shoes,” “Accessories,” and “Handbags,” and underneath them, it says clearly, “Shop Shoes,” so you know to click there if you want to shop for shoes. There is a little bit of noise, or distraction, but I don’t think it necessarily needs to be taken away. The abstract looking image in the background of all of the other boxes is a little bit distracting, but at the same time it adds more character to the website. The pages are well balanced with different sized boxes and images, and emphasis is placed where it needs to be placed, like on “New Arrivals.” Overall, both websites are effective, but the Manolo Blahnik website is just not fit to be a shoe website.
Comments off
Monthly Review 3
The Zappos page seems very store-like. It looks as if it was designed primarily for shopping ease. There is not really a design oriented theme to the website, compared to the Jimmy Choo site which has a strong design theme. Each page is very simple and focuses on images primarily compared to the Zappos pages which a loaded with information. I feel the Jimmy Choo site uses a “less is more” design concept and the black and white colors make it seem more luxurious. The Zappos has a very dominant search and navigation bars succeeding in making it much more simpler to navigate and shop than the Jimmy Choo site.
Comments off
Monthly Review #3
http://www.colehaan.com/ is a site that I think has a sort of classy feel to it. The site doesn’t use a lot of colors for their site, but the images of shoes and people, are what gives the site, the additional colors to stand out. The images themselves are taken so beautifully, its just what the site need to stand out even more; the pictures combine the use of texture and minimalism that makes the boring black and white seem so refined and interesting. Everything is centered and placed in a module grid, and it’s because of that symmetry that attracted me to this site. It’s orderly and easy to navigate through; their use of white space really gives the site a mature feel.
http://www.allenedmonds.com/ is also quite similar to ColeHann except they use much darker colors to make their site interesting. The rich use of black and gold, like ColeHann makes the site and their product give off the impression of maturity and class. It’s easy to navigate through their site, and like the other site, it’s also placed centered and their information is in a module grid, which means that each information line up perfectly with each other, nothing is out of place, which gives the site a clean and organized look. I wouldn’t change anything about it.
If I had to choose which one I like better, I think I would go with AllenEdmonds only because I like the dark mature look, it goes with the male dress shoes that they have for their product. It’s a very clean site, and overall the simplicity is what I like in a website.
Comments off
Monthly Review #3 – Madison Kozlowski
Out of the five websites that were provided, I chose to examine jimmychoo.com and allenedmonds.com. Both of these websites excellently displayed Krug’s 5 important factors of a website, as well as the principles of balance, unity, emphasis and layout.
Krug outlined five important factors that all websites should utilize: Visual hierarchy, proper use of conventions, breaking pages into clearly defined areas, making clickables obvious and minimizing noise. Both websites used these tips in effective ways. The Jimmy Choo and Allen Edmonds websites display a clear visual hierarchy. Jimmy Choo’s navigation bar is set at the top in a fixed position, even upon downward scroll. The navigation bar includes the different sections of the store, a search bar upon a few other things. The Allen Edmonds website is set up almost identical to Jimmy Choo besides the chosen aesthetic features.
Another component that goes hand in hand with visual hierarchy is the factor of breaking pages into clearly defined areas and conventions. Again, both websites display this nicely. Allen Edmonds basically has four set sections on its homepage; the previously talked about navigation bar at the top, a slideshow of pictures with clickable navigation, a promotional section (which I am assuming changes on a regular basis), and a footer including a lot of information that can be clicked upon. Jimmy Choo’s page is set up relatively similar as well, with four sections. The only difference is instead of a picture slideshow, the middle, or bulkiest part of the homepage, is split into different sections as well. The set up of each website’s homepage influences the use of emphasis and layout. Emphasis is put on specific items that are placed on the homepage. For example, the Jimmy Choo site has a small div for the sole purpose of counting down until the release of the Choo 08 Collection.
Krug’s fourth factor of making clickables obvious is also well-used. Roll-overs have been placed in almost every place where a clickable is located. There is a color change, a mouse cursor change, or a popup that happens when you mouse through the page. In my opinion, I think that the Jimmy Choo website did a better job of making it extremely apparent when you are able to click on something. Allen Edmonds website was a little more subtle with the rollovers, but they were very consistent.
Allen Edmonds consistency contributed to the sites overall unity and balance. The site was very simplistic. The homepage was basically a continuation of a single vertical rectangle that you could scroll through to view the information. The header and footer were the same color, making a beginning and end point very obvious. I think the color scheme and pictures went well with the products the company sold and the time of the year. Jimmy Choo had more content on its homepage but it was still organized and unified. Like Allen Edmonds, the header and footer were the same, and the different content boxes were linked by their shape and their white color.
I do not think one site is more effective than the other. I was more drawn to the Jimmy Choo website, for obvious reasons, but I do think that both websites are equally effective to their target market.
Comments off
Monthly Review 3
The home page of Zappos seems fairly easy to navigate. They include multiple ways to search for shoes. The search bar is very prominent, possibly because the users for their web site use it more frequently than other forms of navigation. They also include an additional mini search bar that allows you to choose between looking for wide and narrow shoes. Below that is a smaller bar that allows a user to search for a brand by first letter. The side navigation bar lists Mens, Womens, kids etc. Some of this information is repeated in the top navigation bar. If you scroll all the way to the bottom of the page you can search for a brand by its full name. Since there is so much navigation at the top of the page Zappos chose to put a search bar at the very bottom which seems a bit counterproductive. Upon selecting shoes, womens, then loafers categories, a breadcrumb trail appears below the main navigation. Convenient options to narrow by color, brand, size, occasion, material, theme and accents appear in the side navigation. Handy as it is it almost seems a bit overwhelming. When selecting by brand name in the smaller search bar the webpage layout completely changes. Once a specific product is selected it changes back to the websites normal navigation. The website have decent balance although it is not as good as Jimmy Choo.
Jimmy Choo conveys a higher class of shoe with lots of fancy clean design. The hierarchy of the website is apparent. The website is not as cluttered as the Zappos leaving fewer options to choose from and making navigation more direct. After selecting pumps from the womens drop down menu a page appears with pumps and side bar navigation. This side navigation also offers material, size and color ect. Similar to Zappos. But instead of laying out all the options available in the bar it shows the categories (size, color etc.) then offers the sub categories. Even though this adds an extra step, the webpage appears more functional. Jimmy Choo also uses bread crumbing but gets slightly lost from the background color. This website has a lot of unity. The colors complement each other well (grays, black, white). All the elements are neutral and have a clean feeling giving the pages good balance.
Comments off
One Page Review – onceaunicorn.com
There’s just no getting around the appeal of the unusual. Whether it’s a winter hat with a knitted beard attached or a video about laser cats, the internet is filled with unusual and magical things. Onceaunicorn.com is one of those places.
Though the purpose of the site is a bit of a mystery, there’s a bit of fun and whimsy in that fact. The whimsical feeling is aided by the background shifting through colors as you scroll and the forest background, creating a subtle texture to the site. The type is clear and large and helps this vertical scrolling site to create a pacing to the statements about being a former unicorn. It feels as if the page is talking to you, leading you through the thought process.
A little 2/3rds of the way down the scrolling site, however it loses it path just a bit, as the statements that fit on each page, you now need to scroll some to see the entire message. It may have been helpful to space those messages out as in the beginning part of the site, or reduce the images of the packages to allow them to fit on the screen.
The bottom of the site distinguishes the contact information very nicely as it has a white background that pops from the rest of the site, but still maintains the connection to the site with the text staying the same color as the changing background color of the site. There is also a sliver of the background below the white space to help make it feel more inclusive.
Also done well are the links to buy the packages. They have a box around them, with the background of the box being a very light white opacity. It helps to pop the links, with being so completely different that it breaks your immersion in the site.
Overall, it’s a very well done one pager that’s creative and mysterious. If I could afford it right now, I might consider buying a package. Because let’s face it, we all were once unicorns, and some of us still are.
Comments off
Monthly Review 2
I chose to review the Club Tropicana website. At first glance, the website has a very appeasing color and gives off the feel of a sunset beachy thingy. But in reality, its about a hockey tournament and a music festival, which took me forever to figure out.
It does have some good points though. Its one of those sites where you scroll up and down the whole time. When scrolling there is a menu bar with the different “pages” to jump between. It keeps the same background as you scroll through.
But I feel it has more cons than pros. It took me ages to figure out it dealt with a hockey tournament. The name “Club Tropicana” totally throws me off and then it talks about a music festival, which confused me even more. They really need to rethink their name and colors. Very few of the pictures on the site gave of the impression of hockey. Most just looked like a giant party. As you go through the page you com to the rules of the tournament which were pretty straight forward. Then it has a few pictures of people, which I was assuming were the captains of the teams? Then you get to the ticket buying and registration areas which were closed at the time.
I wasn’t overly impressed. I thought it was going to be interesting, but I lost interest as I went.
Comments off
Monthly Review #2
The site I chose is http://www.mindworks.gr/ it’s a very beautiful site that has a lovely color scheme, which really draws anyone who see’s it. The only animation seen are the clouds that are locked in a diagonal like barrier, I think that it’s very subtle, and gives the site a nice touch against the pink, black and white colors. The colors used are as mentioned the shades of white, black, grays, and pink, a simple color scheme, which appeals to me. The pink contrasts against the white and black, and doesn’t get lost in such heavy colors. I think any hot (neon) colors would work such as blue, or green as well. The way the user scrolls through the site is by scrolling up and down, there is no other navigator. The texture, and lines, makes the site more noticeable, almost like there is a 3D dimension and you can’t really go wrong with diamonds of course. There is also interactive piece, the user can click on it will open, into the given information, which I think is pretty interesting and the way that the site seems to have two layers, I think is also pretty cool. The site sections off their information is by using the diamonds and splitting it up into different pieces all leading to different kinds of information, the user gets to click on what interest them and can exit it at will, when clicked, the triangle will animate and expand (to a rectangle) to show the user what lied underneath that tag.
Comments off
Website Review, Monthly review 2
Analyze a Website
The website I will analyze is Asimov- Les Lois de La Robotique, a simple commemorative website to the book and author. The website starts with an “A” and a 45 degree square in the center of the screen. The Lines making up the outline of the A are loading lines. This helps keep the viewer interested in the abstract movement of the design while the page loads. The home page has the words Asimov in White with a black, blue and gray picture of space in the background. The blue color adds to the feel of openness and intelligence. The color effects on the home page give it a feel of exploration and possibility.
There is navigation on the right side that is distinguished by diamonds with numerals in them. The page you are on is distinguished by a white center on the button on the diamonds. There is also an arrow on the bottom middle of the screen to show you to scroll down to the next sections. On the left corner of the screen is an information diamond that brings up a small screen that can allow the user to like it on twitter and facebook.
The first page is laid out with circular forms of designs representing gears in the top left corners that turn in opposite direction. The font is similar to the home page. The background resembles a concrete floor look giving the page some depth.
The second page also has circles moving in the top left corners. The Background is different. It has a small grid with lighted dots moving along the lines of it. The dots move in a pulsing fashion giving it a heart beat feel to the background. This is fitting in the sense that the book I Robot was about how technology developed to the point where machines acquired a higher intelligence resembling human behavior and thought.
The last page has large gears interlocked together moving in the center of the page. Each page has a brief description of parts of the book although it is in a different language.
Each page remains consistent enough in color to give it unity. The home page color is consistent with the website but the style of the background is completely different. All the pages seem to match the feel of the book and the color scheme is appropriate. The variations in the background of each page add little more texture to the website. I really get the feel of calculation and structure that a robot would have (even though there are no representation of robots on the website). I like the design and navigation. Its easy to follow.
I don’t like the load time for the website. It is just long enough for me to think ‘this isn’t going anywhere.’ Also the website made Firefox crash multiple times. Out of laziness I kept going back to write about this website instead of a different one. Once the page was reloaded, not everything would show up. Just about every time I clicked away to write this review up and clicked back, some element of the page was missing. I would then risk reloading it and having it crash firefox again. Since it did this so many time I would say this site is very dysfunctional although a good try. Its also very simple. I think maybe adding a few more elements or information wouldn’t be a bad idea.
Comments off
Monthly review #2: Single page website
I chose to analyze Jan Losert’s page, Enthusiastic UI & Interaction Design. The page was set up pretty nicely. The website has a dark grey background with white and light brown type. The combination of these colors give the website a visually pleasing look. It also makes the design look very professional and clean cut. The usage of type in the design is well thought out. The designer used bold text as well as normal text with different colors. Not only does the designer use bold type they use all caps. by doing this the design grabs the attention of the viewer and creates an emphasis on the important parts. The text and illustrations are centered in the middle of the page making it easy to read. The page scrolls down which makes the composition flow smoothly down.
This composition is very simple and clear Which is what the designer wanted. My only issue with the design is that the website uses the words enthusiastic and interaction but there really isn’t a feel or anything having to do with enthusiasm or interaction. But overall, it’s a good design.
Comments off
Monthly Review 2
Zachery Calloway
http://akce.kia.com/cz/ is a website to showcase the anniversary model of the Kia Venga and the Kia Rio. The web sight starts on a single page with a bright red background. The cars have a 3D element to them that comes out with the details of the shadows. The sight asks you to select a model of car. When the mouse rolls over the cars to select them the lights of the vehicles turn on. I then selected the Kia Rio. The sight loaded very smoothly and fast. Although the webpage is in Czech, they included images of a mouse with the scroll wheel highlighted, as well as, arrows for the directional arrows on the keyboard. I realized that I was able to scroll through the website. This was not as smooth as I was expecting. When I hold the down arrow it seems to play a movie with facts listed. The site didn’t have a smooth transition with it at all. It was more like a stop motion animation website. I still continued down the sight to learn more about the car.
Then I came across this code in the middle of the page. This just frustrated me. If you are a well known company like Kia you would think that there would be a little testing done to the web sight prior to launching the web sight.
Overall the web sight has a nice use of colors, textures and a good design. They have a unique way of moving from section to section. I would like the movement to be a little faster and smoother. As well as fix the code that shows up on the website. I think that the sights design is well done and allows the user to learn about the two vehicles.
Comments off
Monthly Review 2: One Page Site
For the second monthly review we were told to analyze a “one page website” from the enormous list at onepagelove.com. Honestly, it took me a while to finally decide on a site. I browsed through several sites but none of them really appealed to me at the time. Eventually I came across a page that listed onepagelove.com’s top twenty websites of 2013. Thinking that this was a promising lead, I skimmed through the list and soon came across the website of a Mr. Robby Leonardi (rleonardi.com/interactive-resume).
The first thing that caught my eye about this site was actually the screenshot onepagelove.com provided of the website. The vibrant colors and the overall cartoony video game feel really drew me in. Plus, I noticed that it was an “interactive resume”. Without any hesitation I began my investigation.
When I’m taken to Mr. Leonardi’s website, a loading scroll appears with an indeterminate amount of loading progress waiting to fill. I had no idea how long this would take, it could take one second or it could take a minute probably depending on the level of interactivity of the site. Luckily, my laptop is not entirely a piece of crap, so it loaded in about ten seconds or so.
Once the page loads, I’m presented with a tiny superhero character falling onto the screen (which now looks like the initial screenshot), and the instructions to scroll up and down, or use the up and down arrow keys to navigate. I decide to use the arrow keys and the little character moves across the brightly colored video game themed screen. I notice immediately that when make the character walk a very short distance, about “two steps”, he lags a bit. Yet whenever I hold in the key, the lag still appears but then the character speeds up considerably to a point where it’s almost too fast. (Once I’m done going through the site once I end up going through it once more to try the scroll wheel. It works much better than the arrow keys in my opinion.)
As the superhero moves across the screen, information images pop up in the background in the form of “levels” like how a video game is set up. This images show various things about Mr. Leonardi’s experience in design programs, his previous design related work, and the awards he has earned over the years. It’s interesting to note that sometimes the images get too cramped if you happen to have a smaller screen like my laptop does.
It is also somewhat strange to me that although you only seem to hold down (or scroll down); you appear to move in several directions at different points of the site. When you begin you move to the right of the screen. Once you pass through level one to level two, you “jump down” into an underwater lever, then “jump back up” when you reach level three, and even continue your path upwards in a hot air balloon for level four.
At the end of your journey is where you can contact Mr. Leonardi; whether it’s through the contact box he has on his website, or by clicking on the links to Facebook or Twitter that he has linked in the right-hand corner of the page. Also a note: this contact area is the only clickable area on the site.
My overall opinion of the site: it was actually really cool. I kept wondering exactly how Mr. Leonardi pulled off what he did (I suppose experience does that), and then being extremely jealous that I cannot accomplish that quality work yet. All the colors are solid (no textures) and extremely vibrant, yet none seem to stand out more than the others.
As I’ve mentioned before; there is an obvious video games theme going on with this site. But I am curious why exactly he chose to go in that direction with this theme for his site. No where does it really mention anything regarding video games, so I wish that maybe he would’ve at least put why he designed the site like this. Maybe he was just in the mood for video games, who knows.
Again, my only other “problem” with the site is the navigation. Don’t get me wrong; the navigation is very easy, just up an down. But the fact that the page moves in different directions instead of up and down makes me a little uneasy for some reason.
In the end I’m glad that I chose to take a look at this site. It’s crazy how it works, and it’s really cool to look at. I’d give it an 8.5/10 on the “super awesome website scale” that I just made up.
Comments off
Monthly Review #2 – Madison Kozlowski
The single page website I chose to analyze was, http://projectfms.co.uk/project/blood/, a site focused on blood donation. Overall, I think the site was well-done and accomplished what it was meant to – provide viewers with facts about donating blood and encourage people to donate.
The overall feel of the website is very simple. There is definitely minimalistic qualities as you scroll down the page. The site used a Split-Complementary color scheme with the base color as dark red, making the other two colors mustard and teal. The colors went along with the simplicity as they are subtle and not ‘in your face’. I also found it interesting that the webpage did not use the primary color red a lot. Being that it is a site promoting donating blood, one would think red would be more prominent. In Chapter 2, the color red resembles adrenaline, and causes excitement and is dramatic. Now that I understand red in these terms, donating blood probably doesn’t get people’s adrenaline rushing. However, the color green is described as symbolizing freshness and hope. These two terms would better associate with donating blood and saving lives.
The background color was extremely plain throughout the website, but there were subtle background color changes as you scrolled down the page to a different section. I think this effect gave the page organization. It was clear when you were moving on from one section to the next. The background colors alternated from white to light gray. The change was not dramatic but it was noticeable and I think it was an asset to the site and its navigation. The navigation was easy as you just scrolled downward to view more information. For the most part, other than the clickables, the navigation was provided to the user. There was a navigation bar at the top labeling the different sections of the page, as well as a footer where you can share the page on Facebook or Twitter, links to their sources, as well as the names of the developers.
The clickables throughout the site are very obvious. Some things were underlined, which is a clear indication that you can click on it, other things provoked the pointer to change shape, and other buttons that moved when you rolled over them. I think that all three of these techniques were appropriate for the clickables otherwise I would not have known that they were links.
The layout of the information was straightforward and easy to follow. The information itself was easy to understand and was not above a fourth grade level. There was a clear visual hierarchy from the top of the site to the bottom, as well as in each section. The first page you see is an eye-catching graphic that portrays the ideas of the site with words and the color scheme. Each component of the site contained simplistic graphics that showed proportion and relativity to the other images. I think the site would have been more complete if at the bottom of the page there was a similar graphic as to the top with a person donating blood or saving lives.
All in the all, I thought the site was well done for the purpose it was attempting to fulfill. The composition was uncomplicated and had nice flow. I cannot say, however, that the page had a huge impact on my opinion of donating blood. I do believe that donating blood is an excellent thing to do, but it did not provoke many emotions making me feel that I want to donate my blood as soon as possible.
Comments off
Monthly Review 2- Fuss
I have chosen to use the website maidstonedrivinglessons.com to review and critique. This one page site appealed to me for a critique due to its similarities to the one page site I am designing. The maidstone driving lesson site or, as it is named on the page itself, the Ladybird School of Motoring, is a one pager that revolves around the movement of a car. As my social cause is the dangers of texting and driving, I explored the functionality of this site.
The strength of this site is its strong use of color and texture. Interesting and somewhat vibrant colors are used, yet they still seem realistic the purpose of creating a car driving down a road. The city background with multiple vibrant colors is a little bit funky, but still comes off aesthetically pleasing. The white text, overtop the dark grey speech bubble, is also quite effective. The shadowing used throughout the entire site design is effective and adds to its overall aesthetic appeal. I found the texture of the Ladybird School of Motoring to be just as well done as its color. The texture of the grass, road, and sidewalk all work well. My favorite use of texture on this page is that of the background buildings. The small size of the windows on said buildings creates a pleasing grey texture.
Navigating through maidstonedrivinglessons.com is kind of a nightmare. When arriving on the site, there is no direction or clue as to how to navigate through the sites content. One can assume that the red car is going to drive down the road, taking the user to other pieces of content on the page. But, how does the user navigate said car? I for one, thought scrolling from left to right would be the solution. That was not the case. Eventually after some clicking around I found (in small text on the upper right corner of the page, nowhere near the main content) the navigation system. One must click on a word such as “Home” or “About Me” and off the car goes to that destination with a speech bubble and further information on that topic. On top of being hard to find, these navigation words are not always functional, and even when they are, they are difficult to click. Also, the little red car is ahead of the point you click to take it to, it speeds off in reverse, looking quite unrealistic. All of these negative points add up to a mess of a navigational system.
There are a few design elements that make this site easy to scan, read, and understand. The use of the red car is the obvious element. Following the car through the navigation makes it easy and clear to see that the main focus will on it. Another design element that I found useful was the use of speech bubbles. The dark bubbles with the white text really contrast the rest of the page and make it easy to focus directly on them.
As a designer, I really want to state that this site is well done, as it is nice to look at. Unfortunately, due to a very poor navigational system, I must say that this site is poorly done. There are too many issues in trying to navigate through this sites content. For a simple one page site like this, I want simple, easy, fun navigation. Contrary to the initial appeal, this page is not simple, easy, or fun at all.
Comments off
Monthly Review #2
Brandi Calhoun
Intro to Web Design
Monthly Review 2
http://www.forkedriverbrewing.com/
The single page site I chose to review is for Forked River Brewing Company. They use a kind of navy blue, white, and gold color scheme throughout the page, which creates great contrast for easy reading and viewing. The background when you first enter the page is a photograph of two beers, one of which you can see the condensation and head on the beer just like it is right in front of you ready to be sipped. The company is outlined and introduced. To view the rest of the page, you scroll down. Also, across the top of the website is each individual section of the single page website for easy access to “The Beer,” “Our Story,” “The Brewers,” etc. From the beginning on, the background switches to white, then navy blue, and then white with skinny, subtle light blue diagonal lines, and then yellow-gold, and back to white. These color changes catch your attention when scrolling, and help you realize that you have come across a new section of the single page website. The logo, name of the company, and navy blue headline stay put at the top of the page as you scroll and so do the titles for easy access to different sections and the Facebook and Twitter links. The web designer chose easy-to-read fonts and made the headers clear. Also, at the end of the website is a map showing exactly where the brewery is located and gives the reader all contact information and hours very clearly.
I think this single page site is very successful. It is both attractive and convenient. It is also interactive with the viewer – when scrolling down a beer glass slowly empties every time you scroll down a little more; and fills up when you scroll up. The website is clean looking, but yet stylish too. The colors, textures, and images all fit well together with the beer company theme – very bold and strong. The only problem with the design of this website, as with many others though, is that some content is cut off on either side if you are not using a big screen, which hinders the interactive parts and some of the images. Other than that, you can clearly tell the website is for a beer company, no doubt about it, and can navigate it very easily.
Comments off
Monthly Review 2
For this monthly review, I chose the website for the Pushpa Project to analyze. This website caught my eye with its complex yet pleasing layering of textures and images. From the very first panel, a strong sense of design is evident. This design also enables the site to convey a lot with a relatively small amount of text. The first panel conveys the title, slogan, location of focus, and that the organization has something to do with little girls with only a couple images and lines of text. As you scroll down the page, a good mix of small and large images, textures, and solid color backgrounds keeps the overall design from seeming too busy. Color-wise, the design stays pretty muted without being boring. I theme of soft reddish pinks and yellows carries through the whole page with grey and white being used for body text to ensure readability. Any background images that appear directly below text are edited to be easy to read on top of. The series of headings and subheadings makes it easy to get a good idea of the problem simply from scanning.
In order to handle navigating a one page site, this example accommodates users who scroll through the content as well as those who want navigation to click on. There is a nav on the left that is anchored to the window so that is stays in place despite scrolling. This nav can be clicked on to move through the site but the section appearing on the screen is always represented by having its corresponding button highlighted. This keeps those scrolling freely through the site from loosing track of which section they’re on.
I think the site does an excellent job of accomplishing its goals. It strikes a good balance between emotionally striking images, attractive textures and color schemes, and informative text. It walks the user through the content in a logical manner while being very easy to navigate. Furthermore, the site makes use of several media to convey its message. From the very top of the site, striking images are used to convey the sadness of the subject matter. Next there is a media player sampling the music offered as a reward for donating, and finally a collection of videos that can be displayed in a lightbox are offered to further explain the issue. Finally, and perhaps most importantly, a strong call to action is present in the piece. The donation price is displayed in a visible yet not distracting box anchored to the lower left of the screen that is supplemented by a large button on the site itself that is placed midway through the page, only seen once the user has been informed of the cause. Beyond this monetary call to action, there are also calls to action to simply spread the word. This is evidenced by the social media icons that are also anchored to the window so they are always visible without being distracting.
Comments off
Monthly Review 2
Chelsey Wassel
Intro to Web Design
Monthly Review 2
2/27/14
For my monthly review I chose the website photoshopetiquette.com I chose this page for multiple reasons. First, my roommate and I were discussing that we need to use photoshop more often to make sure we refresh our brains and make sure we know how everything works. Second, photoshop is obviously related to Graphic Design majors so it is something we are familiar with and know about. The design of this cite is very simple. It is also very easy to navigate through and find information. The whole page scrolls down. The rule of thirds was used effectively in the website because all of the information is formatted in the middle, and there is equal negative space on either side. Therefore, the site is very balanced. Repetition is used a great amount throughout the page, as well. There is unity throughout the whole page even though the site is split into different sections as the page scrolls down. Along with each of the titles is an image. These images are simple vector images that help you recognize what the topic is on that page. At the top of the page is each of the heading and topics that are on the pages as you scroll. As you scroll onto that page they turn different colors which tells you what idea you are on. You can also click on them and they bring you directly to that page.Each section titles are in bold font, which makes it stand out from subtitles. For example, the font is the same typeface throughout, but the sizes of the subheadings are smaller than the headings. This shows visual hierarchy between the different sizes of font. Each title is a specific color and all of these colors are the same tint. This helps make all of the colors flow together well. The background color starts off blue with a white typeface for the title. Blue is a calming and relaxing color. The white gives the title and dominance because it stands out so much from the background. However, the background then changes to two different shapes of gray. It goes from light, dark then back to light and so on. This helps break up the individual pages and topic points. Having a neutral background doesn’t take away from the information that is important on the page, it isn’t distracting. As the background changes color so does the text. The colors change into triadic color schemes. The changed colors makes each section their own. This cite has a lot of helpful points and is very informational. There is not a lot of long boring copy. It is easy to read and there is a basic typeface. The design is simple but sometimes less is best.
Comments off
Monthly Review #1: Nikeid
I chose to go on Nikeid and shop for a pair of running shoes. The website is very involved and complex from the beginning. As a shopper, you have to choose your language and then what country you are in before you actually go to the store itself. When you are in the store, the website is set up to help you find what you need. To the left hand side of the page, there are several tabs for the different genders, the categories (shoes or gear), the sport you are looking for, the featured products, and the clearance items. Along with those tabs, there are tabs along the top with all of the genders, the sports, customizing, sportswear, and Jordan’s. There also is a search bar on the top right hand side so that customers can specifically search their items if they know what they want instead of just browsing. Everything is clearly laid out on the webpage so that customers can easily find what they are looking for.
When I clicked on the women’s category, automatically the webpage was set up to show the most featured items right in the center. The shoes that I wanted were in the featured section. I was able to click on them and go to the specific web page for the Roche Runs. From here, Nikeid gives me the option to keep the shoe that I clicked on or the option to fully customize my shoes to my pleasure. These options are clearly made to stand out on the page. The size option is a white tab, the customize option is a black tab, and the buy now option is a bright orange tab.
Throughout my process of buying a pair or shoes off of Nikeid, I felt as though I could find everything I wanted and needed right away without any problems. This website is meant for everyone but main directed towards athletes and that is really apparent. It is very easy to follow this website and buy the products you want to buy.
Comments off
Monthly Review-1-Fuss
I have chosen to use the Puma website to review and critique. As a well known shoe and athletic-ware company, it would be expected that they would have a very user friendly and accessible site. One would expect this, but the only way to be certain that the site can be easily used for shopping is to use it and find out.
The first impression of www.puma.com is overall positive. The site is quite aesthetically pleasing right off the bat. The image of the colorful shoes is of high quality and catches the eye right away. Directly upon arriving at the site, the two options: “World of Puma” and “Start Shopping” are seen, big and bold near the middle of the page. I found this direct route to shopping very effective at first. A menu then pops up, with options to link to sites for many different countries around the world. This accessibility is great for their international market, though from my aspect I would have liked a direct link to shopping when I selected the “Start Shopping” option.
Once arriving to shop.puma.com, it is apparent that the sports that are in season, and the deals the company has going on at the time, are the priorities of the website. Almost the whole page is devoted to a rotating banner, showing off specific products. Above this, seeming much more secondary is a bar of selectable categories of products that Puma offers including: Men, Women, Kids, Collections, and Sale. Upon running my mouse over any of these options, a menu appears showing every type of product they have in this categorie. I found this menu much more effective than the last, as it narrows down much the scope of what product is being looked for, as apposed to having to visit another page before doing so.
Selecting any option will take you to the desired type of product, ex. men’s running shoes. The page allows you to order the list of products by the categories of: featured, newest arrivals, best sellers, rating, name, price (high), and price (low). These categories are helpful to help the user get to the product they are looking for quicker. The products are shown off with a medium sized photo, three products wide scrolling down the page. To add an item to your “Shopping Bag,” one must click on one of the pictures of the products, which will take you to a page with all the product information, and a button stating “Add to Bag.”
The site is overall easy to use and can be quickly navigated. To make the site even more successful, it would be nice to have an “Add to Bag” button directly next to each image of the products, so one would not have to navigate to a new page every time they wished to add a product to their bag. Other than that, I found Puma’s site to be a success.
Comments off
Amazon.com
For this monthly review I’ve decided to take a look at a classic shopping website. This is a website most have heard of, and probably where many turn to when they want and/or need to order something online. This website supposedly has a fantastically easy layout to navigate, and its overall appearance is nothing to scoff at. Steve Krug, web consultant and author of the book Don’t Make Me Think, continually praises this site throughout his book and even uses it as comparisons to “worse off” websites. I actually have not visited this website recently, so this will be a good test to see if the site deserves my love as well.
This website is none other than Amazon.com.
Before I even begin clicking on every available link that I can get ahold of, I take a quick scan of the homepage to see what’s going on. The homepage seems pretty clean overall. Every section of the page is labeled and separated from the rest well enough that I don’t assume that it’s all one jumbled pile of items that Amazon is featuring for the day. My search bar is conveniently at the top of the screen, next to the logo, along with the user login, the cart, etc. Overall, it’s not really an overbearing homepage.
The item I’m looking for is an extension cord for a usb cable. Let’s see how well the search goes, considering I’m not the savviest at finding the hardware section in most stores.
The moment I type “usb” into the search bar, tons of “results” flow out from underneath. To my surprise, after scanning through the new list that just popped up, I find the keywords I’m looking for; usb extension cable. When I click on those words in the list (I’m assuming I can click on that), my search loads a new page as if I typed the whole phrase in the bar and hit enter. On this new page the items appear under the search bar (the phrase I just searched also appears under the search bar along with other related searches), and there is also a new column on the left side of the page. This column contains various lists that, when you click on them, narrow down the original search to only show what items you checked from those lists. I decide to sort them by consumer rating (and then by price, which apparently was also above the items.
When I decide what cable I like I click on its link, and I’m taken to that item’s page. Just for fun I decide to go back a page and then click on the picture of the item to see what happens. The picture also takes me to the item’s page, which I think is pretty neat. On this new page, the item’s picture and general information are most prominent on the screen. The price is listed directly under the name of the item, and under the price I actually find that the wire I chose comes in different lengths. Then, while casually scrolling around the screen, my mouse moves across the picture of the item. I’m actually surprised (but not surprised because, hey, it’s Amazon) that there’s suddenly an enlarged image of the item that pops up on the page.
When I decide that this is the item I want, I look to the right side of the page where the “add to cart” button is located. I take note of how the button is suitably large for the section it’s in, how the button is colored differently than any of the other buttons, and how there’s even a little cart icon on the button. No mistaking that this is the button I’m looking for. I also casually take note that: above the button there is a dropdown list for how many items I want to buy, and below there is an “add to wish list” button.
I decide I want one cable and then add my item to the cart. I’m then taken to a new page where my added item is displayed at the top of the screen in its own little section. Within this section I can “edit my cart” or “proceed to checkout”. I suddenly decide I hate this cable and I do not want to buy it, so I click on the “edit my cart” button. At the shopping cart page, my one item is displayed along with my subtotal underneath it. Under the details of the item are the options “delete” or “save for later”. I’m not really sure what save for later means and how it works, but I don’t really care. I want to delete my item. So I click on the link and the item vanishes from my cart (without even changing pages). In its place there is a confirmation that my item was removed, and a link back to that item.
All in all, I would say that this hypothetical online shopping experience was probably one of the least painful I’ve had in a while. Had I not deliberately taken my time to notice all the details I was going through for my process, I could have done this in about five minutes or less (instead of an hour and a bit since I wrote while I went through the site). Amazon.com is a very user friendly website, in my opinion, for several reasons Mr. Krug mentions in his book. I only needed to scan through certain items on the pages before I found what I want, and even when I barely typed my query in the search bar the website did the thinking for me. The layout was also pretty clean so it was easy to tell the differences between the sections of the page. No wonder Amazon.com had so many praises from Mr. Krug, especially since the site has probably changed quite a bit since 2005. 10/10 would hypothetically shop again.
Comments off
Chelsey Wassel- Monthly Review 1
Chelsey Wassel
Bi-Weekly Review 1
Intro to Web Design
1/23/14
Nike
I chose Nike for my bi-weekly review. Nike is a corporation that is engaged in the design, development, manufacturing and worldwide marketing and selling of footwear, apparel, equipment, accessories and services. They sell mostly sports related items and workout attire for men, women and children.
The color scheme of white and grey with black text and search bars is pleasing. Their logo is mainly black and white so I understand why they went with that scheme. Whenever I put my curser above one of the drop down menus like “men” for example, the text turns orange. They did this to show clearly what your curser is over and what tab you are about to click on. It’s a subtle way to add color to the webpage.
Across the top is multiple drop down menus. The first one is a Nike symbol. If I want to go back to their homepage I simply click the logo. The rest of the menu bars include men, women, kids, sports, nike sportswear and Jordan. They show me all aspects of what different groups they have to offer. There is also a search bar right next to the menu bar. If I can’t what you are looking for I can search it. I don’t even need to pick which department I want to search in the drop down box if I don’t want to. When I choose a department like women, everything imaginable comes up under categories. If I am looking for sports bras in the women’s department, it is very simple to find under tops. I can click on a specific type of top or I can look at them all. I have many options for broad and specific items. It doesn’t take me very long to find what I am looking for. Everything I am looking for is in an obvious location. The departments go into categories and then specific items like pants or hoodies.
If I scroll through the homepage they have an area called “get the latest from Nike” and it has four pictures with descriptions on new offers. I can also click on those to bring me to the page about that new offer and item. Below that there is an area where I can follow or like Nike or even a specific Nike department like Nike Soccer. It brings me to the Nike Twitter or Facebook page. This is a great way to keep up with what Nike has to offer through social media. If I was to scroll down to the bottom of the the website it gives me options to get help, order or register with Nike. If I have any questions it can easily be answered there.
Overall the website is very usable to all users. There is no question on where a topic would be. The departments and categories are easily displayed and navigable. I never once thought “where is this or where can I find that.” I can navigate through the site without any confession and find projects simply.
Comments off