ARTM2210 Intro to Web Design

Just another Intro to… site

Archive for “Brock Switzer”

The Sewickley Hotel-Brock Switzer

April 23, 2012 at 11:09 am · Filed under Bi-Weekly Review, Spring 2012 Section A, Student Work and tagged: , , , ,

The Sewickley Hotel is a tavern style restaurant in Sewickley, PA.  The restaurant features a variety of food for breakfast, lunch and dinner from many different nationalities.  Much of this website links a user to pages outside of the website itself.  For example, the “directions” link takes a visitor directly to google maps with the address of the restaurant typed in.  Another example is the menus which take the user to a PDF file with the menus that can be saved and/or printed.  This feature is both convenient and at the same time distracting and makes navigating quite difficult.  When visitors to the site are forced to leave it with several links and then press back to get into the site again it is easy to get distracted and lose interest in the content on the main site.  A simple fix would be to have the menu actually present on the site but provide patrons the option to go to a printable PDF version at their leisure.  The map could follow a similar solution in which the “directions” link on the page takes a visitor to an actual page on the site with information as to the restaurants location but also has a link on the page that the user can click on to bring up the adress in google maps.

Another problem this website faces is that the content and links are very small and do not expand to fit the size of any window.  The size makes it somewhat difficult to read and makes it feel less complete and professional.  Simply repeating the background and expanding the content area slightly would make the site feel more open and free as well as give off a sense of completion and professionalism.

One very positive aspect of this webpage is the color pallet.  It feels very rich and deep with reds and oranges.  The homepage text mentions the “warm and cozy” atmosphere that the restaurant offers and the color pallet helps add to that sense of warmth and friendly environments.

Comments off

Navigation Use and Bread-Crumbing: Brock Switzer

March 26, 2012 at 12:27 pm · Filed under Bi-Weekly Review, Spring 2012 Section A, Student Work and tagged: , , ,

SecondStory.com

Second Story is the website of a design firm located in Portland Oregon.  The webpage for this group is amazing.  The site uses a combination of traditional scrolling on the “news” page as well as x-axis jquery to continue through the information.  The sites navigation is beautifully laid out.  The viewer has a couple options.  For the first option one can simply click on the links located on the left hand side of the page and watch as the site smooth scrolls to the side to reveal the clicked on section of content.  The other option is to press arrow buttons on the right hand side to continue through the content sections.  Obviously, this is a brilliant way to guide viewers through the site to view the content in the order desired by the designers.  Someone visiting the site must move through each section of information in order to arrive at the next.  Everything is on the same page and the order never changes but the site is very easy to use and with the addition of quick links on the left a visitor to the page can get to the information that they need quickly as well, for example the “contact” page.

 

Morethan20.com

More Than 20 is a website for a husband and wife photography team in Buffalo, NY.  This website is also pretty amazing.  The site is at it’s core a one page site that uses both jquery and self-scrolling to achieve the final goal of being taken through the content.  Again, the use of jquery to scroll for the viewer allows designers to have nearly total control over how the site is viewed and in what order.  The site shifts to multiple pages once the “galleries” section is reached.  When the viewer clicks on a photo it moves to a separate page full of photos from the session indicated by the thumbnail.  Just because this is a separate page doesn’t mean that it is difficult to return to the single page sections.  The links at the top remain no matter what page is currently displayed and when clicked on return the visitor to the main sections.  The site has a reasonable and logical flow to it.  There is an illustrated logo followed by an about section, galleries, FAQs and finally a contact form.

 

DucttapeandGlitter.com

Duct tape and Glitter is yet another website for a graphic design company.  This website is simple and on multiple pages.  When a visitor first arrives at the site it is on a simple homepage with links at the top of the page as well as linked photos near the bottom of the page.  The navigation is simple and not too cluttered there are only 4 navigation options at this point.  There is some bread-crumbing on the site.  There is a large arrow pointing to the top nav bar which is in a specific order which leads the viewer to believe that is the order in which they should be viewed.  Again a logical order is used in which the work, about, blog and contact information are viewed in that order.

 

pulpfingers.com

Pulp Fingers is a group that creates apps for smart phones.  The website for Pulp Fingers has a beautiful texture.  The entire site feels like cut out construction paper.  That being said their navigation leaves something to be desired.  The site is rather simple and there are few navigation options but they are near the top of the page and somewhat difficult to see.  The link that stands out the most is the “blog” link on the right hand side of the page that stays in the same position with the site as it is scrolled.  This link is the most important feeling and seems to take away a lot of focus from the main nav.  It may be that the designers wanted the site to have an emphasis on the blog but with other important information like what apps the team is working on, it seems an oversite to make those links less important and hardly noticeable.

 

TrailerParkTruck.com

Trailer Park Truck is a website for a restaurant in California.  This site is very simple, easy to use and the navigation and bread-crumbing are spot on.  This website like many others that are nicely laid out used smooth scrolling jquery to guide the viewer through the content areas.  The site has a simple nav bar at the top that has very limited options.  Once the visitor clicks on a link the site scrolls to the section of information and from there traditional scrolling takes over.  Logically, most viewers would no doubt click the first link and then simply scroll through the rest of the sections which are intelligently laid out to give out the information needed in a precise order.  There is however always the option at the right side of the page for the viewer to return to the top and click on other links from there.  Sites like this one that use jquery links and single pages are clearly the most precise bread-crumbing sites.  A visitor almost has no options as to the order of the informations presented which gives the designers and company owners the ability to ensure the information presented is done so in a very particular way.

Comments off

The Ernest Hemingway Collection

March 12, 2012 at 11:46 am · Filed under Bi-Weekly Review, Spring 2012 Section A, Student Work and tagged:

The Ernest Hemingway Collection is a website that sells products inspired by the lifestyle of the famous author for whom the collection is named.  The site also features information about Hemingway and links to other websites with similar products based off of the man himself.

This website is beautiful.  The entire site is laid out to look like an old desk.  The background is of dark wood and sitting on it are trinkets such as a compass, glasses, old coins and a pencil.  The item changes with each page of content.  The content itself is laid out on an old notebook page.  The corner of the page even has the mark of a cup that was sitting on it.  This elegant little detail adds another dimension of texture and realism that one doesn’t often see in websites.  Beside the notebook there are also several photos that are inside of actual photo paper, again a nice touch that adds so much realism and feeling to this site.  The photos change on each page along with the trinkets.  There is also a coffee cup sitting on the desk that stays in every page of content.

The texture of this website adds to the content greatly.  The whole site is about a man that liked to explore and write and was worldly.  The realistic objects and the texture of the paper and the old desk add to that style and let you know a little about who Hemingway was without even having to read about him.  One gets the sense of being in the home of someone knowledgable and world traveled.  It has a richness to it.  The colors are deep mainly brown and tan tones and velvety and the lighting is soft.  It makes you feel like you are in the home of someone wealthy.  It is interesting to see a website mimic realism so well.  It no longer feels like it is on a computer monitor but, instead, feels like a real desk and real photos and items.  In a world obsessed with being modern and pushing new boundaries it is refreshing to see a site with an old world texture and color scheme.

Comments off

Cummings Coffee vs. Starbucks

February 6, 2012 at 11:00 am · Filed under Bi-Weekly Review, Spring 2012 Section A, Student Work and tagged: , ,

Cummings Coffee is a small company with two locations in Butler, PA while Starbucks is one of the largest and most recognized coffee companies in the world.  Obviously you would expect their websites to show the disparity between their market sizes.  Surprisingly, however, Cummings manages to hold its own with a simple but charming website.

The Cummings Coffee website is very simple.  There is a photo in the center, a logo in the top left corner and a list of five navigation options in order on the left.  The site isn’t meant to be big and flashy much as the company itself.  Cummings has a mission of producing old school coffee and ice cream as well as an assortment of in-house-made chocolate confections.  Their website reflects the size of the company but still provides all the information you need.  The homepage also features links to maps and directions as to how to get to the two locations available.  Having directions on the homepage allows customers to find the address quickly without having to dig through layers of web pages to reach how to actually get to the physical locations.

Cummings Coffee also features a very well designed “about” section on their page.  Within the section is simple information about the company today but a customer can also scroll through the history of the coffee shop and a gallery of photos both new and old.  This section gives a good feel, yet again, as to what this company is all about.  They are proud of their long history and are looking forward to a bright future.

Starbucks coffee is one of the largest coffee companies in the world.  There are very few people, at least in the USA, who aren’t familiar with their mermaid logo, their concept of high class coffee and the feeling that they evoke.  The site is quite busy and confusing despite their lack-luster color pallet and layout.  At the top of the page there are six main navigation buttons with no less then 20 more options in drop down menus when the main options are scrolled over.  The sites body contains a rather large video surrounded with at least 20 more navigation choices and yet another 20 at the bottom of the page.

When looking through the links it is easy to get distracted and in some way discouraged.  While looking for a way to find a store location on the website I clicked on the main navigation labeled “Coffeehouse” thinking this would lead to store locations.  I was disappointed to find that it didn’t.  Instead the link to store locations is in a very small navigation link in the very bottom of the left side of the page.  Obviously Starbucks cannot offer the same method as Cummings.  Starbucks has thousands of locations but this information seems important enough to warrant a space that is easier to find.

Comparing Cummings Coffee to Starbucks seems like trying to compare a beat up old car to a brand new model but there are somethings that even that old car has that the new model only attempts to mimic.  Cummings Coffee’s website is simple and easy to navigate but they have less information to impart as well.  Still, it is difficult to look at a website with a simple elegance and not fall for it.  Cummings Coffee holds a small town charm that is reflected in their clean and easy to navigate website while Starbucks overwhelms the sense and makes navigating and finding specific information incredibly difficult.  In a battle like David vs. Goliath, the small guy wins again.

Comments off