ARTM2210 Intro to Web Design

Just another Intro to… site

Archive for fall2014

Final Review #4

a website that could be considered competition for your fusion restaurant is pizza hut, we both have website for pizza, but our restaurant has also ice creams.

The layout of pizza hut website is really organized and all pages has the same style and color each page describe a section of what they have such as pizza, wings, deals, order online. /i also like that they have on the homepage all their offers for the day or special orders.

the color of the website are dark with light text and lots of pictures. the colors make the website looks elegant and classic, that could be good and bad. it could be good because it attract the people to order or to visit the restaurant, the bad side that it reflect that the restaurant is more classic that it is In real.

The back ground of the website that appear with every page is a black texture color and that is the most thing that makes the website looks more classic.

the navigation of this website works good and similar to our website’s navigation. they have their logo on the upper left and the  bar on the top of the website the bar starts from the left to the right with the options are inside the bar and set next to each other at the end of the bar, the option “Start your order” takes a big place with a different color and that makes it so easy for people to sea it and order. whenever you click on any option, the background, the bar, and the logo would not change or move so you can sea them in every page.

Final Review: The Original Hot Dog Shop

(http://theoriginalhotdogshop.com/)

The Original Hot Dog Shop (Often called simply “The O”), while not a fusion restaurant, is the closest direct competitor to Giovanni’s. The O is a famous pizza, burger, and french fry joint in the heart of Oakland.

Layout

The page layout of their website is simple and consistent. Each page consists of a centered content area, which features a photo and logo at the very top, along with the site menu. On the homepage, main content area is divided into two columns, one featuring an overview of the store location and hours, and other important information. The second column contains a short overview of the eateries history and current services. On other pages, the entire content area is dedicated to the subject of that page. At the very bottom of each page, the menu is repeated.

This layout is consistent throughout the site, and works very well.

The site uses Arial for all body font, and the menu text uses ‘Bebas’, a narrow, bold sans-serif font served off their own site.

Color

The site’s background starts out with a dark blue to light blue gradient at the top, then meets a red horizontal line, and is white the rest of the page. For the rest of the site, dark blue is used as an accent color. The red, white and blue theme looks a little basic, but is a good, american color scheme, which goes well with a hot dog shop.

Texture

The site’s texture is very flat. The only evidence of texture is a small outer shadow around the content area.

Navigation

The navigation of the site, while simple, is effective. There aren’t any menu trees – just one menu with 9 options, with everything you could want to know right there.

 

Our website makes better use of large images to convey meaning, and the choosable themes allow the site to be tailored to the user. Our menu has even fewer options, giving the user even less confusion in finding what they want. Our layout is also responsive, meaning it delivers an excellent user experience across devices. We also include functionality to order online if the customer prefers.

For these reasons, our website will stand out dramatically, improving and innovating over the competition’s web presence.

Habitat

The restaurant Habitat is located in Pittsburgh and is a self claimed international restaurant.
The color scheme of the restaurant is very earthy, as the name is suggestive as a ‘save the planet’ website though this is not the case here.

The sites layout is great with the logo on the top right side and the main navigation on the top left side. A reservation spot drop down menu is located at the very top of the page above everything else. The left side of the pages are dedicated to sub-navigation and information. This leaves the left mid section of the page to content and images. The layout is simple and constant throughout the site. Once opened, the content is placed in the same location making it easy to navigate and scheme through. Some of the pages seem to have a lot of information and no definite hierarchy to the content given. I think better guidance for the viewer in such pages would be great, especially the homepage, less information could be displayed and the rest can be categorized.

Tan and brown are the main colors while the photography adds variety of color to the site. The color scheme of this site does not yell food to the user. Without the images one would not feel like they are on a site that is all about food and dining. Green is used for headings and to add emphasis for example in the menu the green leaf is used and stands out to let viewers not that the foods with the leaf are lifestyle cuisine selections.

Though there is little use of texture the use of a gradient in the background color makes for and interesting page overall.The main navigation at the top of the page is a great way to get the user to view content. The navigation buttons change on hover and once on the selected page the below the navigation is a page title that lets you know where you are. I like this aspect of the design as it does not change anything the design and it gives more room for creativity for the designer and a nice constant to the user.

Our site will stand out due to a more exciting and textured background. The background image will let users know that we are international without having to spell it for them. Our color choices are also attest to the international theme Pangea fusion restaurant is. The use of lines and shapes to separate sections will also make our site more interesting. Having a simple layout will definitely make the site more inviting to a user.

Victoria Lomax Review 4

Victoria Lomax                                                                                                                                                              Review 4

Burgatory

Layout: The Burgatory layout is an interesting one which is why I think it is effective. I like how the navigation is part of a drop down box. I also like the use of slideshow on the site. Overall, the layout is not consistent from page to page. However, the different layouts between pages aren’t overwhelming. Everything appears to have a purpose and the different layout on each page I think keeps the user involved on the site. The layout takes the form of interactive, which isn’t typical for a restaurant website.

Color: The coloring is what I would expect from a restaurant named “Burgatory.” There was a lot of thought that went into the color scheme. By this I mean, the color choice of black isn’t just your typical run of the mil black but rather there is a charcoal effect to it. This choice obviously goes hand and hand with the theme of the restaurant which is burgers. The use of brown is also a nice touch. The brown is representative of the color of a hamburger bun. Lastly the use of red portrays fire. Other colors that are subtly used are yellow and orange. All the colors work well, and one doesn’t out shine the other.

Texture: As I mentioned before the charcoal texture black is a nice touch. It goes over well with the char-grilled burger theme. The brown also has a bit of texture to it. I would call it a sandpaper texture.

Navigation: The navigation stands out to me because it is on the right hand side and it is also a drop down navigation. I think the navigation bar is the sites best element. While I don’t like how the navigation bar disappears, the site is aware that the navigation disappears and plays around with the user. At one point, when the navigation disappears, the dropdown box reads “Hey! Where’s My Nav?” As the user scrolls over, the navigation reappears.

This website is competition for my group’s website for two reasons: it’s relatively new, it prides itself on inventive burgers, and it considers itself to be a hip restaurant. Burgatory is effective at guiding its users through the content. Burgatory is an interactive restaurant website. From beginning to end, every element works well with the site. The Burgatory website was professionally executed. I think the site is enticing, and will attract many users.

The design layout for Burgatory is very cool; however I don’t think it is something my group will be able to execute with our skill levels. My group is aiming for effectiveness but at a more simple level. However, we will incorporate some level of interaction. For example, we will have a video that promotes our newest burger.

 

 

Final Review #4_AWolfe

For your final review choose a website that could be considered competition for your fusion restaurant. Discuss the website’s use of the following three elements: layout, color, texture and navigation. Then critique their effectiveness at guiding the user through the content. Lastly, compare this site to your final project’s design, and suggest how your website will stand out.

Our group is doing an international fusion restaurant and we chose to name our restaurant Pangea because it was all of the continents mixed together.  I think we could have a huge competitor with the Pangea restaurant in New York City. (http://www.pangeanyc.com/about/ ) They have the same name and are in a more popular destination then our restaurant.  They have a mediterrian/italian restaurant mix.  Our restaurant has possible problems because we are mixing all 7 (technically 6) continents together with different foods.  We are pairing two items from two different countries in different continents.  Their website design is a lot more playful than our groups website design.  Their logo is very colorful and it adds a bit of fun to their restaurant and website.  We are sticking with a very professional look and color scheme.  We are using a grays, blues and whites for our site and their for it adds a little bit of seriousness to our site.

I believe that we have to different views for a restaurant with a similar idea.

Final review-briansonthebeach.com

A website that could be competition for us would be briansonthebeach.com.  Brian’s Place is a restaurant that puts Italian-Spanish together as does Pepperoni to Pinto.  The layout on their website is easy to read and doesn’t jump around.  On their menu page the one thing I don’t like is how the category food titles are moved to the right and everything else is centered.  Everything in the layout has its own section.  The colors on the website consist of light browns and a dark brown.  I consider them neutral in this case, because it isn’t distracting to me and a look of a sophisticated restaurant.  In one of the sections there is green vines creeping out of the corners which brings the viewer’s attention.  For texture there are lines placed around some of the images and to separate sections.  This is neatly done and doesn’t overwhelm.  One of the pictures looks 3-D since there is nothing outlining it and the way the colors are.  The website has a navigation bar at the top allowing the viewer to instantly see it.  The navigation is pretty basic and easy to understand.  I think the color of the text blends in, though making it easy to miss.

Now with our site the navigation bar is at the top, text is bigger and easy to read, and the background is white making it not distracting.  Our images are placed at the top and what the page is about will be below.  The colors are simple being made up of reddish-brown, light brown, and black.  The lines below will help separate everything creating some texture.

Review #4

The competition I am choosing is Park Pizza and Cream. (http://www.parkpizzacream.com/) It is located on Forbes Ave. in Pittsburgh.

 

The layout of the site is different from most websites I have been on.  The main element of normalcy is that the navigation is located on the left.  The base of the website is a scrolling background of pictures of pizza that you can click through.  The next layer is he actual content screen that has the description of whichever navigation tab you are selected on.  The top and final layer is the fixed navigation with the logo in the top left.  The layout is simple and easily understood and easily recognized for the user.

The color of the website is driven by the logo and the use of pictures of pizza.  the navigation and content layers are black and white otherwise.  The pictures of the pizza are very colorful with the different vegetables and meats that are on top of the pizza.  The mix of these different toppings actually create a very interesting color palette because the content and navigation layers have a certain amount of transparency.  The camera shots are close-ups and medium shots interchanged to create even more interest.  The other dynamic of color is created by the logo itself.  The logo’s colors are red, green, red, brown, yellow, and white.  These colors match very well with the scrolling pizza, but at the same time it also stands out because of where it’s placed and the background of the fixed black navigation.

The different layer components give the website a very interesting texture as well.  The farther left your eyes go on the website, the higher the website seems to be because of the use of layering.  This immediately draws your attention to the logo and the navigation, and then it draws your eyes right towards the content.  The creation and use of texture using layers was very well done.  Due to the movement, it also has a very smooth feel to the way the website moves thanks to a creative use of jquery.

The navigation for the site is relatively standard.  It is a fixed navigation bar on the left with three main options, with a sub-menu in the “menu” tab.  The “menu” tab has five sub-menu options.  With the mount of unused space in the menu bar, it is interesting to note that the extra space was not used with the sub-menu options.  The other use of navigation appears at the bottom right of the screen.  This navigation is simply two small arrows that allow you to scroll through the different pictures of pizza.  This subtle navigation is easy gives the user more control over the site.  Both uses of navigation combined with the layout style easily guides users through the site.

Ultimately, their website is generally pretty effective.  I believe that our website is better for many different reasons.  For starters, our logo is much better.  Their logo does not combine the two ideas of pizza and ice cream as well as ours does.  The use of background images also does not support their idea because it only ever shows pizza and never any ice cream.  Our website will stand out because of the true fusion of these ideas, beginning with the opening screen that gives you an option to control your layout color and style.  The ice cream menu is also very confusing. While Park Pizza and cream is very effective in selling pizza, I think they forgot about the ice cream part.  The website, while being very “cool” is also slightly confusing.  If I’ve learned anything in this class, that is that we don’t want people to think!  Our site is very simple, easy, and self explanatory which is optimal for any website.  Park Pizza however, doesn’t quite fit this mold.  The pizza and ice cream menus on our site are very similar looking, while Park Pizza’s is not.  This lack of cohesion also creates confusion that our site makes clear from a menu standpoint.  While both of our sites use Google maps, I do not believe that Park Pizza’s use is as effective because it is placed in the background instead of as a main focus.  All in all, both websites are very good, but Giovanni’s Pizza Pies and Creamy Dreams edges out Park Pizza and Cream in every category.  Park Pizza makes us think, and Giovanni’s does not.  It’s that simple.

Review Topic 4: artisanpizza.com

When designing a website for an up in coming restaurant, it’s always a good idea to look at what the competition has to offer. I choose to examine the website for Artisan Pizza Co. (artisanpizza.com). Since I could not find any direct competition in this area for our restaurant, that offers both Mexican classics and Pizza in an MTO setting, I settled for this place. They offer MTO pizzas and claim to provide fresh, natural ingredients, as we do.

Let me start out by saying that this site has all of the anatomy that comprises an effective design. As described in chapter one of “The Principles of Beautiful Web Design,” the anatomy should include a containing block, a logo, navigation, content, a footer and whitespace. This site has all of the above, however, I do not agree with some of the design decisions. For instance, the navigation is very small and may be hard for some to distinguish. Navigation is a very important element in the design of a website and it should be dealt with accordingly. Steve Krug’s “Don’t Make Me Think Revisited,” describes the important purposes of navigation; first off, it tells you what’s there, second, it tells you how to use the site, and third, it gives you confidence in the people who built it. Other than the aforementioned navigation issue, I think the layout is fairly effective. Everything is where you would expect it to be, the site id remains static in the top left corner and the navigation is persistent throughout the entire site. Both are important elements described in Krug’s book. This and the use of similar fonts, colors and positioning, keep the site persistent throughout, an important topic discussed in “The Principles of Beautiful Web Design.”

The site uses a tetradic color scheme including the analogous colors red and orange, along with their compliments, green and blue. Chapter two of “The Principles of Beautiful Web Design,” describes this as a “simple variation of a basic complimentary color scheme.” As I stated before, the continual use of these four colors from page to page really helps to unite the site as a whole.

The use of texture in this particular site is minimal, but effective. In looking at the design, I am able to point out a few examples. The most obvious, being the use of the semi-circular shape repeated (to produce a pattern) and flushed against the left and right sides of the page. Another example is apparent in the use of the three-dimensional looking “order online” button positioned at the top of the page above the navigation. The use of shape is also apparent in the share buttons at the bottom of the page. These, and many other examples of texture, are pointed out in chapter three of ““The Principles of Beautiful Web Design.”

As described in “Don’t Make Me Think Revisited,” we look to navigation to guide us to where we want to go, whether we’re on the web or in a department store. Aside from being small and illegible to some, the navigation of this site is pretty well organized. Categories are clearly defined in the primary navigation and drop down menus are used for secondary navigation when relevant. Another important factor, as described in the aforementioned book, is the matching of the page titles to the text being clicked in the navigation; the site handles this particular issue well and ensures that you always know where you are. A couple of things that this site is missing include breadcrumb navigation, active states for the links in the local navigation and a search bar, for those “straight to the source” navigators.

In comparing the Artisan Pizza Co. site to our Pepperoni To Pinto site, theirs obviously has a lot more information to portray, which can be a bit overwhelming to the customer; whereas, our site is a lot less cluttered and more straight to the point, which could be more appealing. Also, considering the clarity of our navigation, as compared to theirs, our site would be easier to navigate and less likely to confuse viewers. All things aside, I think that designer(s) who created the site for the Artisan Pizza Co., did an admirable job. With the exception of the navigation and a few missing elements, the site is well designed. I would consider them a valid competitor.

Christopher Price Final Review

Home

The Food place that I choose is a burger place in Pittsburgh, it is a burger place that will give us a run for are money in the area. The have a very well done site with there navigation and how you  get around to see everything that they have. The layout to the site is done in a very nice and consistent way, it gives it a very easy feel with not throwing to much at you. The colors of the site make you feel warm and like you really want to go to this place. The picked a very good color pallet that works well with how everything is set up. they have a very easy way to get you around there site. It shows you everything that is under each tab and what you will find out about what they are selling/trying to get across to you . They put there site together extremely well, how it compares to what my final project will look like is kinda the same in how we want people to see our information. It has a feel to it that I want to come across from my web page.

Review Topic 3: No9park vs. Bravofranco.

No9park vs. Bravofranco.

 

No9park website is so elegant and reflect a fancy, and elegant vision to the customers. When you first take a look at the website, you will easily tell that it is an expensive restaurant.

The homepage of the website divided to 2 sides , the right side of the page and under the name of the restaurant there is a navigation bar on. The rest side of the homepage is divided to 2 sides. The top side is for pictures and the bottom is for details of each option on the navigation bar. The navigation bar has some options that reflect relax, romantic feeling to the customer. The private option and the reservation option would five a feeling of something romantic and not for family, or it could be for fancy meeting between businessmen and not a place to have children. The background of the website is dark with a white color of the options. That Simplicity is the main thing to reflect elegant, fancy, and sophisticated appearing to the people.

Another thing that is unique about the website is that when you click on any option, it shows some details and picture about the feature. All picture and details show how perfect the serving is. Another thing is that the menu does not have prices, but the pictures of the dishes that display are enough to tell the cost of the restaurant. In fact, the website is so organized and balanced so well. The navigation of the website is so easy to let people use it and explore the website.

bravo franco is also elegant restaurant and the colors that used is rely good to give a customer a good feeling to explore and read about the restaurant. When you first see the homepage, you would say it is elegant, fancy, and goof for family and friends.

The homepage of the website divided to 3 horizon sides. The first side which in on the top has a navigation bar, and the second side under the navigation has some pictures of the food and the restaurant, then the last side on the bottom has a welcoming text and some information and details of the restaurant.  The background color of the pages is a light color however; the top and the bottom sides are dark color on the background. The name and the logo of the restaurant are so big and in the middle of the navigation bar. One of the interesting things about this website, id the quotes that shows in every page when you choose an option from the navigating bar. The options are so clear and easy to find any information you need. The menu has 2 options, the dinner and the lunch menus. Each menu has the meals that would be serving at this period of time. Overall the restaurant is really organized and balanced.

In fact both restaurants are designed so well and understood. Both of them are elegant and fancy. One of them reflect a quite romantic night and the other reflect a family , friends fancy gathering.

 

 

Eman alaggad

 

 

 

Review Topic 3: Cure vs. Neid’s Hotel

Principle Cure Neid’s Hotel
Summary Cure is an upscale but informal small-menu restaurant in Lawrenceville. It best appeals to a more hipsterish crowd. Neid’s Hotel is an old-timey staple of the lawrenceville area with a ‘world famous fish sandwich’. It best appeals to the industrial working population, but also appeals to families and the general population.
Site Feel Cure’s site has an upscale yet rugged feel to it. The main background is wooden planks, giving it a tough, DIY feel evoking concepts such as quality and durability. It uses slab-serif headers and sans serif body (similar to Ashley’s syllabus site) giving it a clean professional look. The Neid’s hotel site feels much older, like it was made years ago. The background image is a picture of the beer selection, enforcing that this is your neighborhood bar. The site doesn’t really provide much of a feel, it just sort of provides information. The font Verdana is used throughout, which is good, but not great.
Homepage Cure’s homepage is laid out vertically in sections. It starts with the cure logo over a picture of food. Scrolling down reveals a parallax effect with the background images. The sections start a section to make a reservation, then a list of upcoming events, and finally social media updates. Neid’s Hotel’s homepage features two columns: the first and biggest is a blog style list of updates, and the second column has a short description with hours. At the bottom of the page, an address and contact info is listed.
Navigation Cure’s page options are always at the top-right of any page you go to, and make it simple to get to what you want. There is only one level of navigation and 8 options, so getting lost isn’t a concern. Neid’s Hotel’s navigation is listed across the top middle of their page, and scrolls with the page content. They have 7 top level navigation items, and 5 second level navigation items. Some pages seem incomplete, and navigation could have been more elegant looking.

Overall, I would be more inclined to go to Cure based only on the website. The clean, elegant interface is easy to use, attractive, and gives the restaurant an air of quality.

Review #3- AWolfe

Explore each of your choices, then describe and compare the two sites use of Balance, Unity, Emphasis, and Layout. How do they use these principles and implement Krug’s five important “things” to make sure users see and understand the site? Is one site more effective than the other at drawing your attention, and why?

I chose the Six Penn Kitchen and No. 9 as the two restaurants to talk about and compare.  The two restaurants have very similar color palettes that they use for their websites.  They both have a very slate grey background with a white type color.

The layout for the Six Penn Kitchen is simple, yet elegant in design.  The navigation bar is on the top of the page with three links on each side of the banner/navigation bar.  The website has a very good balance to it, because they divided the navigation bar into two, 3 links on one side and three on the other.  The content on each page is centered and heated presented to the viewer of the website.  Overall the website portrays that it is a 4-5 star restaurant.  The information that is important is made to be larger, usually in an green color type and/or white color type, then the less important information is smaller and in light colored text, grey or off white.  Each page follows a similar theme and set up.

The layout for No. 9 is similar in the sense of color palette to that of the color palette for Six Penn Kitchen. It has a grey/slate colored background with an off-white text and what even looks like a very light shade of blue for the navigation bar.  The navigation bar for this website is on the left hand side, unlike the previous site that was on the top.  The balance of the website is really nice, you have the navigation on the left, picture on the top and some links, and the main text on the bottom.  It really makes the website look elegant and the information is easy to read. The emphasis is not really that great with this website as it was with the previous website, because when you clicked on the menu link, it took you to a part of the site that had 4 links that were being distracted by a picture.

Both websites used a very clear visual hierarchy, although No. 9’s website lost that when venturing into other pages.  Restaurant No. 9 had a very good advantage of both naming and graphics, whereas the Six Penn Kitchen did not. I expected the color palette to reflect that of the name and geographic location but it lacked that.  The pages for both restaurants websites were both broken into easily defined areas.  You could tell what was what and where you were getting your information from.  Restaurant No. 9 was a little difficult to tell what were clickable links once you broke off from the main home page. I thought at first the text was words describing the restaurant or something but it actually was a link, but because some were not capitalized and they were italicized it made it difficult to tell at first.  The Six Penn Kitchen had clearly defined links to pages, which made it very easy to navigate through.  I feel that both websites did well with minimizing noise.

Review #3

The two websites I chose to compare were Six Penn Kitchen and Bravo Franco Ristorante.

Six Penn Kitchen’s website has really nice balance.  The logo in the center and the top left make it very clear as to what website you are on.  The text size compliments each other well with the use of Larger text with titles and smaller text as a description.  The text is also easy to read straight from my computer screen.  Each page also maintains incredible unity.  This is created by the use of color and type fonts.  The green and white lettering along with the consistent type family make a very cohesive site.  The emphasis on the site really focuses on the food, which is ultimately what creates a customer for the business.  There is also an emphasis on free wifi, which seems odd to me considering the type of restaurant I think it is.  The basic layout of the site was also very good.  As a first time user of the site, the navigation was very clear and easy to understand.  At no point did I get to the “thoroughly frustrated” part of the shopping experience.  It was only the “leave happy” experience.

Bravo Franco Ristorante’s website also has descent balance.  Its logo is only in the center and not on the left side, which is a little less clear, but still okay.  Their website also maintains unity throughout by using white, red, and tan colors on every page with a logo.  The same text is also maintained throughout.  The emphasis is on the food, the atmosphere, and more food.  The emphasis also make it clear that it is a pasta and steakhouse Italian restaurant.  The layout is very well done with clear headings.  The navigation was also fairly simple and easy as to not make me think.

When implementing Krug’s trunk test, the sites are very similar.  When it comes to site ID, both websites do very well.  Bravo Franco puts the ID in the center and makes it very large, while Six Penn puts the ID on the center and the on the top left.  The page names for Bravo Franco are much better and much more clear than Six Penn.  Bravo Franco’s page names were clear and were exactly the same as what the navigation says.  Six Penn’s page names were unclear and were either not there, or differently named from the navigation.  With this, the sections and subsections are clear and easy to recognize on both websites.  This is especially evident with Bravo Franco in the menu section, with subsections for a lunch and dinner menu.  The local navigation for both websites is based at the top of the page and features no jquery.  Both are clear thanks to the mouse button turning into a hand from an arrow.  Neither site has “you are here” or “search” indicators, which may not be necessary due to the nature of it being for a restaurant.

Ultimately Six Penn has the clearly better website in my opinion.  I think it is mostly due to the color scheme in order to make the website look slick and new which makes the idea of going to the restaurant more attractive.  Bravo Franco’s site looks old and boring because of the color scheme.  The white and tan colors are simply uninteresting.  A criticism I have of Six Penn is that it brings a huge attention to free wifi, which is confusing due to the nature of the atmosphere of the restaurant.  I know if I went there, I would not want to see people using wifi on their phones instead of actually talking to people.  At the end of the day, Six Penn did what the ultimate goal of this class is and that’s to not think when you are using a website.  Their website was easy and clean and involved very little, if any thinking.  It also directed my “lack of thinking” into an idea of hosting events at the restaurant and how easy that was.  Both are very well made sites, but Six Penn definitely has the edge and puts the icing on the cake!

Review 3-bravofranko.com, no9park.com

For my review I decided to compare bravofranko.com and no9park.com.  The Bravo Franko webpage to me is an easy reading webpage.  The balance on bravofranko.com present, because everything is in its own area.  Unity also has plays in the webpage.  The pictures on the site are equally spaced and are close together.  The food photos that are centered on the site emphasize what the restaurant is about and what it looks like on the inside.  Layout is clean and organizes the area.  At the top is the navigation bar, in the center are photos, and at the bottom is all the information a person would need about their hour of operations and a short bio about the restaurant. Krug’s five important “things” are shown because of the easy navigation and was pretty self-explanatory.

The no9park.com webpage is easy to read.  Balance is shown with the spacing between the words and nothing is spread all over the page.  Unity helps the page, because since balance is shown this helps put everything together.  What emphasizes the webpage is the photo of the building when the webpage first pops up.  The layout is clean and understandable.  Krug’s important “things” are shown by the layout and the links are readable.

I like the bravofranko.com site better, because of the design and the navigation.  I also like how they have an inside picture of the building and photos of their food.  Plus I don’t need to click on a bunch of links to get to one thing.

 

Six Penn Kitchen versus Bravo Franco by Esther Gatemba

Six Penn Kitchen balance lies heavily on its color palette. The site uses color to separate its sections, this creates balance with the sophisticated choice of colors on the site. The choice of colors also brings unity to the site. In terms of navigation the menu bar is in white giving it a higher hierarchy and making navigation easier. Each select section has a color change to a light green which indicates where you are and its subsequent subtitles. Emphasis is placed when site titles are in a larger font and different colors. The menu also emphasises the name of the meal versus the ingredients by bolding the names and prices. The home button is prominent in the middle of the menu bar a nice surprise for web browsers who are used to the logo being the home button. A tradition the site chose to keep and one that works well. On the home page is basic and great information, a picture of the location gives you information of what to look for if one was to go there. The address is at the footer of the site and easily seen without having to scroll down. There is lack of happy talk on the site yet you know they have been voted the best. The home page gives you much information in few words and with clever placement and imagery.It tells you why you are on this site, what this site is about and why you should be here. The layout of the site is great, having opened a page it gives you confidence that all the other pages will have the same presentation. The use of dotted lines to separate sections is also great as it offers a break between information being presented.You are here indicators are the page titles highlighted in green. Having a straight forward site like this one, there is no need for a search option and the creates did not include one.

Bravo Franco also uses color in different panels for unity. A black panel with stitched detailing over top a tan linen like background gives the illusion of a placemat. This combination of color and line details bring unity to the site. the navigation is easy to spot as it is white against a black background and the font is sizably bigger than the rest of the site. All the pages have titles that help a browser on the site know exactly where they are. The same navigation is placed in the footer. COntact information is also visible on the site at each page and is distracting and confusing in terms of hierarchy. Unlike Six Penn the execution of presenting this information is lacking. This site does not use much emphasis outside of subtitles and page titles, the menu is in one font size making it hard to spot meals and prices at a glance. They separate the ingredients by placing them lower than the meal and price but that does not do much in helping see and view the menu better. Through the site, i think as an attempt to create unity and consistency, the creates of the site placed the same ‘happy talk’ section below each page that welcomes you again and again. A bit redundant in my opinion it becomes annoying after seeing it twice on different pages. Having it on one page would have served the purpose. The layout of the site has a basic feel to it. It is functional but does not do much for the aesthetics for the site. The site does not have great page indicators, the color changes on hover but that is all, once clicked the color change does not linger to let one know where they are on the site. Not included on this site too is a search option, an option i do not think the site requires.This is especially difficult as the page titles do not match the navigation names.The menu layout is also a little unconventional as most menus are presented with text align center.

On both sites a navigation option for the menu selections would have been nice instead of scrolling. Looking at it more i think it would have been too much navigation on one site. I conclude that both sites made great attempts to have their information presented i the best way possible. Six Penn takes the win for me as they have taken consideration of updating their site to a more current and polished look. Bravo Francos last site update was in 2011 and it shows.

Review Topic 3: no9park.com vs. sixpennkitchen.com

When a local restaurant decides to advertise online through a website, the site needs to be designed effectively with plenty of informative content, as this will help bring new and returning customers into your business. I chose to review and compare sites for No. 9 Park, an Italian/French restaurant in Boston, and Six Penn Kitchen, an American bistro in downtown Pittsburgh. Both of these businesses are marketing, in a sense, the same product, but are designed very differently.

When considering the balance of each layout, the No. 9 Park site has more of an asymmetrical balance, with the navigation on the left side and the content on the right. In contrast, the Six Penn Kitchen site has a symmetrical format, with the navigation centered at the top around the centered logo, and the content below follows suit.

Both sites incorporate a great use of unity throughout. When you look at the No. 9 Park site, the likeness of headlines, content and rules from page to page create a very unified look. You can tell that each page belongs to the same site. The same goes for the Six Penn Kitchen site with the same fonts and colors being used throughout, as well as like borders around all of the images. Both sites also utilize the idea of persistent navigation, which, as described in Steve Krug’s “Don’t Make Me Think Revisited,” is a set of navigation elements that appear in the same place on every page of a site and create a consistent look throughout.

When you are trying to market a business, I believe that emphasis should primarily be on the identity itself. The company logo and navigation should really jump out and be the first thing you see, and keep going back to. Usually, and in the case of both of these sites, it is also a link back to the home page, which is very important. In Krug’s book, the home page is described as being like the North Star, where a simple click will lead you back to a fresh start. The Six Penn Kitchen site really showcases a good example of effective emphasis, by putting a contrasting white banner at the top of all of the pages, and placing the identity/link smack dab in the center, you really can’t help but see it. With the No. 9 Park site, the logo/link is placed well and it is large with contrasting colors and the navigation is in a predictable location, but I feel that the images used in the site are a little intense and kind of take precedence.

As I mentioned briefly before in discussing the balance, both sites are laid out very differently but effectively. Navigation placement is very important in the design of a good website. As Krug describes in the aforementioned book, navigation should be placed in a standard place, so that the viewer can locate it quickly and painstakingly. No. 9 Park uses the predictable left side navigation, with the content to the right, while Six Penn Kitchen chose to position the navigation at the top, with the content to follow underneath, another efficient layout technique.

In comparing the sites for No. 9 Park and Six Penn Kitchen, I gravitate more towards the latter. Both sites have a solid use of the design principles listed above, except for maybe the lack of emphasis in the No. 9 Park site. This one for me is primarily based on personal preference, and I like the use of symmetrical balance, the color choices and the structure of the Six Penn Kitchen site.

Web Review #2

Victoria Lomax
Web Review#2
Back in the action of learning about different kinds of websites, I found that one page websites are a very interesting concept. Beforehand, I knew nothing about a one-page website. I didn’t even know they existed. Unless a person is web savvy, I will say it’s safe to say that most of the general public has only been exposed to a typical web page with typical content.
Unfortunately, my experience with a one page site was not as fulfilling as my ecommerce experience. This time around, while viewing a one page site was out of my comfort zone, I took the experience to a new level by choosing a site whose content didn’t interest me whatsoever.
The Ronseal Story was an interesting one page site for all the wrong reasons. With so many different ways to create navigation for one page sites, The Ronseal Story web page just fell short. One of the problems I found with the navigation was while there was a clickable arrow to move down the page, there was in turn no clickable arrow to move back up the page. This was mind-blowing. Instead of having a clickable arrow to move back up on the site, there was a tiny navigation bar on the right-hand side that functioned as the master navigation. By this I mean every section of the webpage was easily accessible with this navigation bar, so there really was no need for a clickable up arrow. I just felt like there should be one to balance out the page.
Another thing I didn’t like about The Ronseal Story one page site was that I had no idea what the site was about. While I initially skimmed through the site, I was hoping that would be enough to grasp the sites general function. It wasn’t. I actually had to read the content before understanding that the site was for Ronseal wood primer and paint. Just skimming through the site, one would think that it was an interactive history lesson. Alongside my issue with the poor layout of the content, I furthermore disliked the lack of theme. Every new page had a different background selection that was simply chosen because someone thought it looked pretty. The background choices varied from tacky to bland.
Because I understand how difficult web design can be, I wish I could say there was something I thought the site executed well, however I can’t. As far as one page sites go, this was very mediocre. I think the Ronseal Story web page needed some reworking before it was uploaded.

Review Topic 2 – http://atmospheric.co/

Atmospheric is a startup drone service provider in the pacific northwest region. They offer aerial photography and videography services to businesses.

The site is primarily a white and grey color scheme. The colors that are present are heavily desaturated, so as not to stand out. Texture is present in the maps, images and videos that comprise the background and adds to the composition.

The site is vertical, and one scrolls between frames. Some sections have buttons to smoothly scroll forward, others leave the user to scroll. Furthermore, the last frame isn’t a whole page, just a part.

Text is often low contrast, and while not hard to read, could be easier. The images enrich the experience, but the subdued, desaturated colors can take away from the aerial photography wow-factor.

Overall, this is a passable website, but I would increase the contrast and saturation to add to the punch, and standardize the page sizes and navigation.

Review #2

For my review site I choose Movement of Data.  when you open the site it is very plain.  You have to click to start the journey.  They have this is the only thing that is in color.   They start the journey in a house everything is in light colors.  As you start scrolling your move along the cable.  They make the cable turn red as you scroll so you can see where you are at.  As you go through the site they explain what all goes on to get internet into your house or business.  As you scroll they show a map of the world and how we are all able to connect.  Once you reach the map of the world you start to travel back to the house.  You go back to through the site.  In the end you have reached the house and the mail or the request has been returned and the site is up and running.  Overall the site is very simple.  The colors are simple and light.  Nothing is to bright or to dark.  Scrolling through the whole site is very simple and easy to go about.  The definitions and explanations are simple and easy to understand.  I would say the site is very successful and easy to use.

Onepage site: Playmation (http://playmation.co.za/)

The site Playmation’s use of color and texture is impressive and has a great use of ‘that wicked worn look’. The page is presented as an open book on a table ready for you to view and peruse. Texture in the site is brought in by the images of the wooden surface which represent the table. The notebook itself is one that has uneven pages, some slightly torn and jagged. These elements provide a realistic view of actually flipping the pages of this notebook and finding this page with all the illustrations.
It is such a clever way of representing an art that was purely hand done and now can be computer generated. I think it honors the essence of the art. The wood color and monochromatic brown shades and tints used through out the page complement the multi colors of the illustrations. The faded pages and the white of the extra pages sticking out of the notebook are a few of the subtle color treatments that make this website work.

The navigation of the page is pretty straight foward, the presentation of the page naturally guides you to click on the image icons. This is also internet trent where navigation is presented by images and each image either expands or directs you to a different link. In playmation, the hand icon indicates a link which opens the images and enlarges them. There is no set direction of the page, the creator leaves the viewer to decide. One guide that may be provided is that newest content is placed at the top left page, this then makes a user assume that the images/illustrations on the bottom of the right page are the oldest.
Given the layout of the site, the page is easy to scan in a couple of seconds as all content is provided and only if really interested would one click on the images. The links at the bottom of the page lead to a blog and other social media sites. Body copy/text is non existence on this site.

The page is a great page for an illustration page, it works great to show featured works of the artist and extends to show the combination of old and new style of illustrating. Some of the links do not work which is not great seeing the website is active and has been recently updated. One wishes the creator of the site took the trouble to update the links or get rid of them. I also think that the illustrations could use small narrations to give background the the artist who also does not mention who they are. THis website presents itself as a second or third draft of the actual website to be designed. It feels incomplete.

Review Topic 2: thinkgreenmeeting.com

From the research that I’ve done, I can conclude that single page websites are a great way to get information out there and do it in a way that is both aesthetically pleasing and enjoyable to navigate. The site that I have chosen to review is for Think Green Meeting at thinkgreenmeeting.com. I consider this particular site a success, with its visually pleasing transitions from page to page and it’s excellent use of color and texture.

Navigating this site is relatively enjoyable. First of all, the navigation is in a very recognizable place, listed vertically along the left side of the page, below the logo. This is a great use of conventions, as described in Steve Krug’s “Don’t Make Me Think Revisited.” Also described in the aforementioned reading, is the importance of making all things “clickable” look, well, “clickable.” The site successfully does exactly that, with its distinct bold, all capital letters that in turn highlight with a rectangular shape when active. The navigation remains static, while the content moves around it in interesting ways. All navigating is done through the navigation bar; the scroll bar is not present. The landing page is definitely worth mentioning as it incorporates an interactive way of explaining this particular company’s mission statement. From there, as you click on the individual navigation links, the page takes you to that particular defined space by way of a sliding motion. There are several instances where the page slides vertically down, and even one where it slides down and then horizontally to the right, and back again. This particular approach is a good way of keeping things organized and separated as needed, which is also important in effective web design as described in Krug’s book.

The colors used in this site make it aesthetically pleasing. In chapter two of “The Principles of Beautiful Web Design,” it is explained that the philosophy associated with certain colors can create an emotional connection. The use of yellow-green in the logo and other visual elements combined with the neutral light and dark browns of the background and corresponding text really evoke the natural feel of a “green” company. In my opinion, this is the perfect pallet of colors for a company of this association. Also, explained in the aforementioned chapter is the distinction between warm and cool colors, and in what combination they can create the biggest impact. The use of the warm, yellow-green color against that neutral beige background makes it really stand out and look important, as with the darker brown color of the text against the muted beige background.

In association with color, the subtle texture also ads to the appeal of this site. The obvious use of texture in this site resides in its background. It almost has a natural canvas-like quality to it. As described in chapter three of “The Principles of Beautiful Web Design,” “Texture is anything that gives a distinctive appearance or feel to the surface of a design or object.” Another effective example of texture in this particular site can be found in the use of line between transitions, it really captures the feeling of movement and fluidity. The chapter also states that rounded corners on shapes can create a more organic essence as compared to the, almost, mechanical feel of square corners. This site incorporates the use of shapes with rounded corners, and I could not agree more with the statement in the reading, it really makes the shapes look more organic; this bodes well for the “green” subject at hand.

This single page website is a great example of effective web design. I love the use of animation, by way of sliding and the fact that it is interactive; I can see how that would be very appealing in this technological era. The use of color and texture were well thought out by the designer, considering the natural colors and forms that have been integrated. In conclusion, the site is easy to use, doesn’t require much thought to operate and has a very aesthetic appeal. It’s a great site.

Eman Alaggad: Review #2

Francescas.com

Francesca’s is a boutique that has many locations in different states. It has a huge number of different collections for women such as clothing, bright baubles, bold accessories, and  gifts. They also have their own website that called www.francescas.com.

Their website designed so well and has some worm colors also some texture. the background of all pages looks like a wall paper with some texture on it. That makes it look more elegant as a boutique than regular store. the main menu which is on the is in the header is so clear and organized. The main menu is a white color background with a  dark gray color words on it. In the main menu there is many different choices that help you to easy shop and choose the category or the section that you want such as clothing, bags, shoes, and also the shopping bag that you use when you purchase something online. and also there is a store locator in that main menu which makes it faster to get their location.

When you put your mouse on any of the menu section it Immediately open up a small menu about what is in this section. it also comes in a white background color. I think the way that they use their color is so beautiful and make things so clear.

Above the main menu they have their store menu and a space that always has their new offers or discount and it is in red color which make it so attractive for the eyes to look at. Next to that there is a search bar which is a white background color too.

in the body of the page there are many different sizes of pictures and photo each one has something written on it to show you were it takes you if you clicked on it and they have a short video about their store.

at the end in the footer they have another white bar that include different choices than the one above also they added their social media that you can follow such as Facebook and twitter. they also have a quick easy bar to put your email to get their new offers and news so you do not need to make a full registration to get their offer.  I think their website is designed pretty good and so easy to use and shop. 

 

 

Review 2-ELEKS Quality Assurance and Testing Reimagined

For my review I decided to choose “ELEKS Quality Assurance and Testing Reimagined.”  I think the site layout is easy to understand. The website is also fun and interactive.  There is a cartoon feel almost to the page, because of the animation.  The layout is similar to a map and a road leads the user to scroll down.  Throughout the layout the text is moved every once in a while.  There is also the option of a navigation system to the left side letting the person click and can take to the part they want to go.  When the person scrolls down to a section it mentions about the objective.  Only some color is used throughout the webpage.  The color that is used I think works, because only a little is used and is not overwhelming.  One form of texture on the webpage is Line.  The lines used lead the eye down to the next part and takes on different forms.  Another form found is Shape.  The shapes used help create the design and animation.  Some shapes used are circles, freeform, and squares.  Overall, I think the webpage works well and flows together.  It is easy to understand and navigate.

Review 2: Jacks Bar

http://jacksbarlondon.co.uk/

I reviewed Jacks Bar, the way that the set up there one page web site makes it easy to navigate what they have to offer as a bar. It starts out with a very nice picture of people working at their bar. It gives you all the information you need to know about where they are located what there number is and where else you can find them one the internet. Then it has a navigation bar that shows you what you will see on the website. As you scroll down you first hit a small thing about them telling who created the bat and what is special about them. Then they show you there menus with a click and a pop up window to show you what they have. Then it’s an easy click of an x to get you back to the main site. Then it shows you what the latest news of what’s going on at the bar, it tells about the Oktoberfest deals and many others and also what upcoming events will be happening there. Then you see that you can also plan an event with them with a simple touch of a button. Then they give you there contact information at the end again and a map of where they are located.

The whole web page is sent up in a nice neat way that gives it a nice flow to the website. They many only use pictures and the color white to show the separation of different information on the site. It is very inviting and it makes you want to see what they have to show one there site. It’s easy to follow and there is never too much going on that makes it hard for you to get the information out. The site is well done and I can see how these one page websites can be very effective to get your information out there.

Review #2 – One Page Site

The One Page Website I chose to explore was a website that promoted a new single ‘Glimmerman’ by a Hip Hop artist named Asaph.  http://glimmerman.wetu.co.zw/

 

The website includes the ability to download the song, read the lyrics, share it to Twitter or Facebook, and includes a short bio of the artist himself.

 

The website uses yellow and white text to contrast the dark background.  Everything that is clickable is either white or yellow and can easily be seen by the navigator.  It uses darkness to create negative space that adds emphasis to the text and an image of a person in the center.

 

The website involves no scrolling.  It fits completely on the page and is scanned only by the eyes and is not a mouse or virtual navigation.  The color makes the website easy to scan because it is so easy to see as the yellow and white stand out from the black background.  It is very interesting how the site uses value to create emphasis towards certain words or other items.  It is also interesting how much negative space there is.  It may have been better to fill more of this space.

 

Even though this website is overall visually pleasing, it is not a good website.  Why is this the case?  It makes me think!  The website leaves too many questions in my opinion.  Beyond simply downloading or playing the song, it was ineffective.  There are specifically two icons that are clickable, but when I clicked on them I had no idea where I was going.  For example, a checkout on an e-commerce website has an image of a shopping cart that says “cart” underneath it.  This website contained the lyrics to the artist’s new song, but it was so small that you might miss it, and even if you did see it, it looked like a piece of paper that was slightly folded at the top.  This meant absolutely nothing to me, and I would assume the average browser.  If it weren’t for me investigating this page for the assignment I wouldn’t have even clicked on it.

There was also an icon on the bottom right hand corner that was a big letter “W” in a circle.  This icon also means absolutely nothing to me either.  It ended up being a short description as to who Asaph was.  I also wouldn’t have looked at this either if it weren’t for the sake of this review.  The ability to share to Facebook and Twitter was also offhandedly mentioned in the bottom left hand corner.

Overall, the idea of the website was good, but it was poorly executed.  The site is very visually pleasing and interesting, but lacks the practicality in order to make it successful.  It ended up leaving too many questions in my mind to keep me interested and because of it’s causing me to “think” I would choose a different website.  Don’t make me think!  And this website did just that, made me think.

Review #2_AWolfe

I looked at PopKey.  I really enjoyed this website because the site used colors that were very popping and yet easy on the eyes.  They used white and a shade of pink.  I think it helped that they used one section pink and one white and so on and so on.  They had their page sent up as a horizontal site that you can scroll up and down to view the content.  I find that to be a very easy layout because it is natural to scroll up and down on a computer.

The design aspect of the page was really good because each section is either white or pink it makes it easy to tell when you go from what would be one page to another.  They used a good type that was bold and easy to read.  The pink pages had white type and the white pages had an almost blackish grey type.  That made it easier and more appealing to the eyes.

Overall, I think it has a very well design and it does a great job at giving the viewer a great experience.

ecommerce site review Victoria Lomax

Victoria Lomax

Shoe Dazzle.com Review

 

I have always been afraid to shop online because of my fear of getting scammed. With that said, the idea of window shopping online never even crossed my mind. For many people, online shopping is considered a stress reliever from actually going out to a store. For someone like me, physically shopping in a store is way more enjoyable. However a recent experience I had with an online shopping site opened my eyes to a new appreciation for online shopping. I still may not be comfortable with making online purchases, but online window shopping has become a step in a new direction for me.

 

ShoeDazzle.com is the place where shoes are born. The main page is very welcoming to prospective shoppers.  A variety of different shoes grace the page, enticing the shopper (or in this case myself) to want to see more. On the main page the shopper is invited to take a quick shoe personality quiz. With the click of a button, I was on my way to finding out my shoe destiny.

 

Once I completed the quiz, the website created my very own online shoe closet. Every shoe I could possibly want was on this one page.  A cool feature on the website was that as I scrolled over a shoe the picture changed to how the shoes would look on an actual person. I didn’t have to click on anything! Another cool feature on the page was how organized it was. Anyone who likes to shoe shop in a store knows that most stores can be junky and cluttered. For me, the sites organization was a plus.

 

ShoeDazzle.com has the right amount of pizazz to wow a customer. The font coloring was kept to a minimum with the usual black and a pop of pink where necessary. The site also sets itself up as very customer friendly. The shoe personality quiz acts as a personal shopper, and if that wasn’t enough the site also offers an online live chat with representatives from the company. Lastly, if shoppers wanted to know more information about ShoeDazzle.com or just keep updated on new styles, at the bottom of the page lists all of the company’s contact info.

 

One last feature that really took to me was the hour sale countdown. As I am a student learning web-design, I can’t even imagine the work that went into creating that. Usually, a feature like that would be something I would take for granted. Aesthetically, ShoeDazzle.com is a very well put together ecommerce site.

 

As mentioned before, online shopping is considered a stress reliever for many people. I no longer know if I prefer physically shopping in a store to online shopping, but with some help from ShoeDazzle.com I now understand why people enjoy to online shop.

 

 

 

review topic 1: forever21

the website i chose was Forever 21. the search bar was located at the top left hand side of the home page that reads “search ” with a magnify glass. This made navigating to find products much more simple. When typing in your search the was also a drop menu that listed out items you could possibly be looking for.

The product that i decided to search for were black dresses. i searched for this item which took me to a page of many dress options. along the left side of the page there were categories to help narrow down my search such as size, price range, color, brand, and newest. using this system i narrows down my search by price and size giving me a much more specific list of choices.

After finding the dress that i liked i clicked on the product which took me to a page that would help me purchase this item. This page listed what the item was, how much it would cost, the other options for colors this item could come in, the size, and the quantity of the item. once all was selected the “add to bag” button made it very simple to get to the check out page. On the check out page before finally proceeding to check out at the bottom of the page they listed other items that you might also like which i obviously did.

I found this website very simple to navigate from page to page. They set it up so i could find everything i wanted fairly quick. It was much easier then shopping in a store having to go through multiple products hoping you find something you like and having it in your size. Using the website took my straight to what i was looking for and had every size possible. I think this is a much better way to shop its more convenient and much easier.

Review 1

I chose to use the American Girl Doll site.  While the site has a younger feel to it mostly adults would be using it.  As I went onto the site I realized that the appearance from the brighter colors for the background with the lighter color behind the text really helped.  While I didn’t actually go on to buy anything, it made me want to buy items from their site.  It was very easy to navigate the site on the homepage you were able to click on what categories you wanted to look into.  There was dolls, clothing, bookstore and so many more.  I clicked on dolls and at that point you can read a little about the history of the doll if you like or you can click shop now.  Then you can choose which doll you either want to buy or what accessories you are looking for.  After you find the item on the list that you wanted you simple click on “Add to Bag.”  That’s it the item is added to your bag and you can checkout from there.   The site overall is very easy to use.

Review topic: Newegg

The company that I chose is Newegg. It is a site for purchasing electronic equipment. It is one of the largest of its kind. It’s takes electronics from different companies and puts them all in an easy place to find them. It is an easy way to find anything from a watch to a desktop computer. It has anything the inner nerd needs to build, upgrade, or even drones to fly.

When you get onto the site you see a search bar a drop down are for all the stores they have on the site and then even smaller categories within that store. You have your language, login, kart, wish list feedback, and help at the very top of the page.

When you search something it gives you the option of what store it’s in. after you find your item you can choose from cheapest to most expensive, the company that makes it and also size,  etc. there are a lot of things that go into this site that makes it a very well put together website.

Older entries »