Ames' syllabi

Shopping at Amazon.com is simple because the website interface design is user friendly. There is a wide rectangle box to search millions of products with one click. The searching box helps customers finding the desired product by providing auto suggestion phrases. At the upper left corner, there is a list button that opens a list of categories. These categories are the main divisions of the products available on the website. Each division is divided into smaller categories to make it accessible for users to find their desired products. In addition, the main webpage of Amazon consists of other elements such as ‘Deal of the Day’, customized recommendations, and other advertisements.

I find the shopping experience at Amazon.com to be fun and straight forward. There is less typing required to find what I need which is more convenient to me. After finding what I need, there is enough information about the product including reviews, seller, estimated delivery time, price, description, and similar products. After all, it is only a few clicks to add the product to the cart and find out the exact cost and delivery details. Because I already have an account with Amazon, the checking out process is really simple where my address and payment details are already saved. In fact, there is a button in any product page called “Buy Now with 1 Click”. This button can be customized to automatically charge a payment method and ship to an address associated with the button. It accelerates the checking out process for users to save even more time.

In conclusion, I think that Amazon.com is accessible and usable to different users. The interface uses simple words and more graphics to provide more usability to elders and non-educated users. It requires less thinking and more common sense to place an order on Amazon.com.

Website=”Sweetwater”https://www.sweetwater.com/?mrkgcl=28&mrkgadid=3230723992&rkg_id=0&campaigntype=paidsearch&campaign=*Sweetwater%20-%20Branded&adgroup=Sweetwater%20-%20Exact&keyword=sweetwater&placement=google&adpos=1t1&creative=219897786869&device=c&matchtype=e&network=g&gclid=EAIaIQobChMI2ay5hMmE4wIV0MDACh38XQ2AEAAYASAAEgKBr_D_BwE

Sweetwater is a very popular website where users can purchase musical instruments and music related products. They have a wide variety of guitars, drums, keyboards/synthesizers, and studio equipment such as microphones. The website is very user friendly as I have never had a problem finding products in the several years I’ve used the site.  To test the website’s capabilities, I entered “Jazzmaster” into the search bar. I then was pleased to see several Jazzmaster guitars organized by price and brand. Sweetwater sorts all of it’s products by brand whenever you search for something. For example, the more expensive Fender Jazzmaster guitars appeared first while Fender’s less expensive Squier Jazzmasters appeared below. 

            The website makes it very easy for first time users to find exactly what they are looking for. The top of the webpage contains five options of navigating the site. These options are: “Shop by Category”, “What’s New”, “Deals”, “News and Research”, and “Support”. Most users will be drawn naturally to the first option of “shop by category”. Hovering the cursor over the “shop by category” option will allow a secondary drop down menu to appear. The menu displays all of the types of products Sweetwater carries. One of the best features of Sweetwater is that the website has no shame in telling you that they don’t carry a product. For example, searching for “Danelectro” guitars result in a message that they do not carry Danelectro products. This can save users a lot of time instead of continually searching a website for products they do not carry. Sweetwater also allows you to search for products utilizing a variety of criteria. You can search by brand, price, body style, 6 string, 7 string, and 8+ string. This website is one of the most popular musical instrument suppliers in the U.S.A. It’s easy to use, detailed, and allows for a carefree shopping or browsing experience.  

Shop NHL is a site where you can get merchandise for any hockey team in the NHL. They mainly sell jerseys for almost everyone on each team along with player t-shirts. Along with that they also sell a large variety of other things that include:  hats, bags, and jackets. There is a bar at the top of the page where you can select the option of shop by team, jerseys, hats, more, or the option to search for something specific. The color scheme is neutral with there being a light grey bar at the top of the page and two dark grey bars below it with a white background. I clicked on the search bar at the top of the page and I searched for a Sidney Crosby jersey instead of clicking on the shop by team link and then finding the jersey on the Pittsburgh Penguins site.

When I searched for the jersey, all of the Sidney Crosby jersey options showed up immediately. At the top of the page it says how many jerseys are on that page. Along with that there is a drop down box that says top sellers to refine the search and a drop down box to pick how many things you want to see on each page. On the left, there is a vertical bar that has the options to refine the search more. It has an NHL drop down box with Pittsburgh Penguins below it, a drop down shop for box with the options of men, kids, women, and baby. There is also a department, custom shop, and a price range drop down box to pick from.

The usability of this website is easy to use for anyone that wants to get any NHL merchandise. There are multiple ways to find what you are looking for by either searching for it in the search bar or going through the shop by team option. From the time I went onto the website to the time I had the jersey in my cart it took less than a minute due to the website being easy to use and laid out perfectly.

            I researched the website Avon.com. Avon is a beauty website where people can buy makeup, clothes, etc., at great prices. The site is huge and has a lot of products for people to choose from. The site does a great job making finding products easy, even though there is a lot of products. There are even beauty tips to help those purchase their products, and there are even rewards for shoppers. Some can even become an Avon representative to sell their products outside of the website. 

The website has a white background, which is great to show off products because makeup is colorful and stands out on its own. They are trying to sell the makeup and they need a clean background in order to have the makeup look appealing. Also, the use of fonts is clear and easy to see. Some of the font is a little small because they try to fit everything on their website in one place. The title of the page does stand out without it being to flashy. The site has a very basic set up, it’s very rectilinear. Also, they have some pink colored areas on the website where they grab people’s attention. I think that there could be more pink areas on the website because there are other things that need the attention. They do well in marketing their products but there could be a bit more added to the site to have things stand out. 

I chose to analyze the Sim Sim Falafel page. My eyes are immediately drawn to the bright colors and the inherently appealing textures of the food. This is a restaurant site that does a lot to hold your attention. At the top of the page, you’re immediately drawn to the bright colors and simple food images on the page. They grow and shrink depending on the location of the cursor. The Sim Sim Falafel logo is the cursor itself on the page – it follows you as you scroll, so there’s no chance you’ll be forgetting the site that you’re on. It has a great feel as you scroll, it automatically moves to the right placement for each new section of the page using different colors to differentiate and give it more appeal. It’s simple and easy to use. Even though it’s in a foreign language, I didn’t have any problem deciphering what each of the sections contained – that’s pretty impressive. The color palette used sticks to primary and secondary colors, which is engaging and almost festive. A lot of thought was given to the physical dimensions of the site. It uses liquid width and is designed to be equally appealing regardless of the width you’re viewing it. Although there was not a lot for me to click through on the site, I thoroughly enjoyed navigating it as it was clear that all of the visual details had been thought through.

I chose the website “Sim Sim Falafel”, is the website to analyze for this review. The bright colors caught my eye while I was scrolling to find a website. Once on the page, the user can immediately interact with the page. Moving the cursor, the food images change size. Going further into the website, the elements are separated with an appealing grid layout. Another interesting point, the logo moves with the user when scrolling, moving to different parts of the screen.

This particular website does not scroll left and right, only up and down. I believe this is just a small restaurant website, so it may not be necessary for them to have tabs and a number of other elements. The simple animations are clean and smooth, almost making up for the lack of other things to click and play with. 

The grid layout and  make the website easy to look through, and I like how the user can scroll, but it’s more of a snap-to effect. In a way, this one page site almost acts as seven. I do like how the sort of separate pages are a single block of color, however there are some issues with it the further down the user scrolls; I will explain in my next paragraph. I also like the typeface used for the titles on the site. It is simple and the font demands attention. The same typeface is used for the other information about the food (however I am only guessing, I cannot read the language; German?).

Alright, so there are a few improvements to make the site stronger. I can appreciate the direction the designer was going in. Bright colors made the site seem fun and exciting, and the images were high quality and cut well. The title screen is very appealing with the motion effect. The typeface and fonts are also appropriate for the content. There are a few other sections where the images and bold color are compatible, however there are a few that are difficult to read. It also seems as if the designer got lazy the further down the website goes. The bottom of the page has what seems to be a Google Map attachment. The cursor changes to a hand to drag the map, but I could not get this feature to work. Not sure if this is a bug or an operating system issue? I wished the food images were throughout the page, there were less and less the further I scrolled down. I’d also like implementing the motion effect that was at the top of the page in other spots. My expectations were set high with that title section. Also, even though this restaurant may only be a local shop, I still feel some sort of a translate button may be helpful. 

All in all, since this is a site for a small local business I believe the layout and design as a whole is acceptable. As said in The Principles of Beautiful Web Design, “There’s a strict usability angle, which focuses on functionality, the effective presentation of information, and efficiency. Then there’s the purely aesthetic perspective, which is all about the artistic value and visual appeal of the design”. I would give Sim Sim Falafel a 7/10 on usability and for aesthetics; I feel the usability is also effected by the aethetics. Changing a few of the background colors where it is hard to read the black text, such as the dark purple, would help the usability. I would also maybe change the map attachment to something the user can click rather than drag. The map would be opened in a separate tab.

The website that I chose to evaluate is milkshake. This website uses a lot of different colors throughout the site. At the top there is a banner that changes color and takes up the whole page that has the logo milkshake at the top and ‘Make a free Insta website on your phone’ with a link for get app for early access and one for a video. Along with the different colors, as you scroll through the website pictures pop up on the side of the screen to add texture. 

Since this is a single page, to navigate you have to scroll top to bottom to find the content that you are looking for. 

The design elements that make the website easy to scan are that it has a standardized appearance, has effective visual hierarchies, things are “nested” visually, and has a format text that makes scanning easy. 

I think that this website is done well because it has a lot of layers to it without being overbearing. All of the content is easy to find and the different color blocks and animation help dictate what piece of information goes where.

I am Subzero is a storefront ice cream parlor located in the United Kingdom. They have been making ice cream for over fifty years and offer over sixty flavors of ice cream. They have a single-page website for their business. In some situations, a single page website may be boring or include too much information, but surprisingly, it worked extremely well for I am Subzero’s needs. The sites’ use of color, texture, and page layout makes this a captivating and appealing design. 

When looking at the website, it is easy to see and comprehend all of the content on the page. Some design elements that contribute to the clean aesthetic are the font size, the use of negative space around the content, bold headers, hierarchy, and colors that help define buttons and important information. 

The first panel invites the user to scroll down by using a vibrant pink circle with minimal text and an arrow pointing downward. This makes it clear to the user that the website utilizes a top to bottom scroll direction. While you are scrolling, there are dividers to indicate the start of a new section of content. Intuitively, the website designer used dividers that represented scoops of ice cream. Also, instead of a harsh line for a divider, a more organic wavy line was used. In my opinion, this gave the impression of melted ice cream dripping down the screen which again, invites you to scroll further down the page. 

However, I found some of the more subtle features of the site the most interesting. The navigation bar is black but fades in opacity, which makes the bar less of a distraction while scrolling through the page and also leaves the page looking more friendly because it is not a harsh line. Also contributing to the friendliness of the site is the colors. There are many fun, bright colors on the page, making the page look vibrant and young. To balance out the flat colors, a texture that appears to represent sprinkles is used throughout. 

Overall, the website is very easy for users to navigate because of the clean and innovative position of the content. While using bright colors and subtle animations, the site maintains a professional feel overall. The colors and textures are brilliantly balanced throughout, which makes for a lovely overall experience. 

Reference

Welcome to the Magical World of Subzero Ice Cream. (n.d.). Retrieved June 29, 2019, from https://iamsubzero.com/

Walmart is a department store and has a wide variety of products to choose from. Because it is the largest retailer in the world, you may think that the website would look crowded and give too many options when it comes to looking for a specific product. However, this was not the case. Walmart.com has a simple and sleek look to the site and it was very easy to find the product that you need.

When looking at the site’s homepage, it is easy to see where you need to go. The search bar attracted my attention mainly because of its pure white color against the dark blue title bar but also because it is centered at the top of the page.

I decided to search for a water filter that purifies tap water, but I simply searched “water filter.” When I searched without picking a department the exact brand and product that I wanted came up with a large picture advertisement that spanned the page. On this ad was an arrow directing me to click on an icon. On the left-hand side, I could still refine my search if I needed to. After clicking on the icon, it took me to a specific page that only showed that brand’s water filter, with pictures and descriptions of different color options to choose from.

I selected the “Lake Blue” filter that was listed as the second product on the list. The next page very clearly showed more pictures, the price, and an ‘add to cart’ button. The button’s dark blue color stood out against the bright white background.

Overall, The usability of this website is easy for users with minimal experience with websites or the internet. Everything you could possibly want to look for can be searched for and refined to find the perfect product. At no point did I dwell on or think “Where should I begin”. I just instinctively knew where to click next. Its minimal color scheme and layout make the experience easy on the eye and mind.

References

Carbonara, Peter. “Walmart, Amazon Top World’s Largest Retail Companies.” Forbes, Forbes Magazine, 6 June 2018, www.forbes.com/sites/petercarbonara/2018/06/06/worlds-largest-retail-companies-2018/#591d8de213e6.

In comparison to other shopping platforms, I would have to say Amazon the most user friendly. The large, white search bar is easily seen at the top of the screen over a dark navy background. If the contrast in colors is not enough, the magnifying glass that is the universal symbol for ‘search’ is seen beside the bar in orange and navy. Typically, the user can easily find the good needed with ease in less than a minute by just searching what is wanted. I searched “bluetooth apple mouse”.  Normally, it is not necessary to pick a department to search, but searches can be refined – in my case, by selecting “Computer Mice”, “Computer Keyboards & Mouse Combos”, and so on. Not only is the search process simple and easy to understand, Amazon is also visually appealing. I believe being visually appealing aides in customer usability.

If I was unsure of what brand I was looking for and only searched “bluetooth mouse”, other products show up that are not Apple products. On the left hand side, Amazon shows all brands of bluetooth mice. I can then check the sub head “Brands” and select “Apple”. There are many other categories to search with to cater toward what is most important to the customer, including searching only for “Prime” items (Free shipping for the customers who pay a monthly fee), “Average Customer Review”, “Color”, and even specific categories that only apply to the item that is being searched. In my case, these specific categories include “PC Mouse Feature”, Mouse Interface”, and so on.

Users with low experience with websites can easily navigate Amazon. Items are placed in departments and have keywords attached to them are created with common sense.

References

Krug, S. (2014). Dont make me think!: Web & Mobile Usability – Revisited(3rd ed.). Retrieved June 15, 2019.

I’ve been a big fan of Zappos.com and their culture and work environment for awhile. So I chose this site to look at from the standpoint of usability. When you type in “sandals” it populates with a lot of different types of sandals to choose from. I noticed that if you choose one of the choices, it is defaulted to show you women’s shoes first. I picked of pair of shoes and then got different options as far as color and size before adding to cart. Once added, Zappos.com requires you to sign in. I get why they’re doing this, they want my information to get me hooked into their marketing. However, I want the option to just purchase as a guest and move on to the purchase process. Everything else in the checkout process is pretty much as I would expect and didn’t cause me any heartache to complete the purchase. The other thing I noticed about the site is that they limit the amount of hovers that they use. Even the horizontal menu across the top requires a click to bring up the next window. This seems like an extra step from what I’m used to in online store experiences. Overall, the site is aesthetically pleasing. I would say that the assumption that I’m looking for women’s shoes makes sense but is an annoying one as a man looking for shoes.

Whether it’s a business or a restaurant, there is going to be competition, and every industry needs to be able to stand out from its competitors to succeed. In terms of restaurants, there are many different ways for them to stand out. It could be providing only the best quality meals, creating a one of a kind experience, or even just giving providing customers someplace with a unique and wholesome atmosphere. The point is that every successful restaurant has something to make it stand out in the crowd. This goes beyond just the restaurant itself and into how they market themselves. A website for a restaurant also needs to be able to communicate to the viewer what they might expect before even going there.  

One restaurant that I look at as a possible competitor for my own would be the Square Cafe located in South Braddock Ave. in Pittsburgh, PA. Square Cafe is a small cafe that specializes in breakfast and lunch. They enjoy using their restaurant to help show off the artworks of local artists with a style that is simple and well organized. As such, their own website is just as simple, as well as being quick and easy to navigate. For anyone first visiting the website, the overall style is what sets it apart from its competitors. The homepage is presented in a standard display with a header at the top that is present on all pages, a brief summary with images telling about the cafe, and additional information at the bottom. The design of not just the homepage but the entire restaurant is shown with a bright, flowing, colors. The whole website is displayed with a colorful backyard picket fence and blue sky that I would imagine is inspired by Van Gogh. The colors and style give off a fun, welcoming experience that the cafe wants to provide to its guests.  From there, the menu is the third option in the header. It is quick and easy to find, and the layout is a simple display that shows off their seasonal menu and the drink menu. Both the website and its menus are visually fluid and smooth, providing a stylized version of the artwork they display to the overall design. I feel that the impression they’re trying to make is a fun, inviting atmosphere for anyone new or old.

The restaurant that my group and I created is called EYEPOP, it is a breakfast dinner/cafe with an overall theme that draws inspiration from the pop art movement. The website we’ve created greatly reflects this inspiration, with an overall display, designs, and colors drawn from different artists and their artworks. The layout is simple but eye catching, all while being easy to navigate. From the homepage, there is a single display in the style of pop art by Andy Warhol. Each individual panel leads to another page of the site. Each page is unique and has a style influenced by various artists. The menu is a simple click away from any page, from the header at the top of each page but the homepage where it is the first option displayed. With a more distinct theme to tie both the restaurant and website together, I feel our website has a little more to offer compared to Square Cafe’s. While Square Cafe’s design & layout provide a unique identity, in its entirety, it seems like multiple ideas just arbitrarily put together. With my group’s restaurant, I feel our website has a better unifying theme and overall concept. While Square Cafe shows off local artists in their restaurant, they would have to update their website to match the current display of the restaurant. This in turn results in more work overall for them. Whereas, EYEPOP is influenced definitely by the pop-art movement, it allows for enough influence from various artists and styles when it comes to designing the website, without being too limiting or restricting. Of course I don’t believe out website by any means perfect, and if anything I’d say we might have “too much of a good thing”. While each page provides various information along with graphics and drastic color palettes, it might be a little too chaotic for someone first visiting the website. However, aside from the little things, I’m proud of the site my group and I have created.
It’s not until you begin to create your own site that you start to understand how much thought, time, and effort is put into creating something as “simple” as a website. Both Square Cafe and EYEPOP are great websites that compliment their restaurant. Square Cafe isn’t only good competitor for our website, but it is also a good source of inspiration for EYEPOP. They both strongly serve the purpose of providing a early look at what each restaurant has to offer in terms of food, design, layout, and atmosphere. It never hurts to study the work of others for the chance to discover a new perspective, understanding, or idea that can help you develop your own creations.

Playa Bowls sells açaí bowls and a variety of healthy shakes. If there is one thing that stands out about their website, it is their use of animation. There is a bar that automatically scrolls right after a certain period of time and gifs are used with some of the pictures of the bowls. If you click on their staff page, each person’s picture has a stop-motion element to it which shows their personality and it is entertaining to watch. 

Their layout of text is centered while there are a balance of graphics on both sides of the page. The text is not only centered in the navigation bar but within each paragraph of text. This is a subtle layout feature I noticed but it goes a long way of keeping the website consistent. To break up different sections, they either use a straight line or wavy line. This balance of straight and wavy adds character to the page while still breaking up the information effectively. The overall layout of the website is simple but they make it stand out by their use of color and textured elements.

The colors for their website are very saturated. This color palette is appropriate because they are selling a variety of fruits which have those strong colors. It makes sense to highlight those colors. Three consistent colors they use throughout their site is sky blue, dark grey and white. The sky blue they use is very saturated. One thing they do to break it up is to add texture. The texture is similar to a watercolor look with different spot illustrations used throughout. The texture breaks up the solid colors and keeps the page interesting as you scroll. If there is one more thing that makes this website stand out, it is the navigation system.

One thing that stands out is their standard header and footer. The header stays at the top of the screen which is helpful while scrolling. When you reach the bottom of the screen, the footer appears which has all the categories in the navigation bar, the logo and other detailed information. There is no lag time on the scroll which is nice for the user to feel like they are in control. I am not confused if a word or button is clickable because whenever I hover over it, it changes color or the opacity goes down. Lastly, If I click on a link that takes me to another site, I am still able to get back to their site by the “BACK TO WEBSITE” button they offer.

The Playa Bowls website compared to our website will have a similar style in terms of colors and pictures. Our website will not stand out by the use of navigation or animation but by the colors and product itself. By taking our own photos, we took advantage of making the ingredients of our product stand out. Our logo colors are consistent with the overall site which makes it pleasing to look at along with consistent. Overall, our website has a simple layout that will go a long in users searching for what they need.

After searching the web for a website that looked similar to my fusion restaurant website, I stumbled upon www.eggslut.com. The restaurant basically incorporates eggs with any type of meal. The layout was basically one column, it always featured a photo before any content appeared and in between each section. The color theme is yellow and white, which makes sense because egg-white, yolk-yellow. Navigation was very easy and had everything at the top menu bar. I think they made it easy for users to scroll through the content. Like I said previously, everything was basically one column and had more content as you kept scrolling.

Mine and eggsluts websites were fairly similar. The navigation bar & logo were pretty much in the same place except I feel like I had more items in the nav bar and two drop downs. Their pictures were always at the top of the site and in between each section, but mine took up the entire page.

My website will probably stand out more because you don’t have to scroll to get the content you’re looking for. I think the photos of the food in the background give my site less white space and by looking at the food, it would persuade a person to come to the restaurant- or in my case a food truck. I also think that since they do not have their gallery, faqs, quality & taste, customer service, gallery or online orders in the nav bar its annoying for people to have to scroll.

For this review I decided to review the Ihop’s website. My fashion restaurant serves breakfast food just like Ihop. When deciding on pricing I used Ihop the help decide on prices. Ihop’s website is very easily navigated. On their homepage you can easily either click on one of the tabs on the menu bar or you can scroll through the site and click on something. It had plenty of pictures and popping colors to catch the eye as well. One thing I noticed at the top near the menu bar the location closest to you shows up. I thought this was pretty cool because instantly you can know where the nearest one closet to you is. You can also click on it to get more information about it and directions. When on the website it is very easy for the user to know where they need to go to figure out whatever they were looking for when coming to this site. When my group designed our webpage we looked at Ihop’s to try to get an idea of what we needed to do. Our homepage is definitely different than theirs. On our homepage you don’t scroll up and down as much. We nine squares that when you click on them it navigates you to where you need to go. Then we have a tool bar that can help bring you elsewhere. Also Ihop has a pretty general background with coloring popping in the text and pictures. Our website all around is colorful and popping. Each of the nine pages has their own assigned colors but have the same general theme to help keep the website consistent but also different.