PAPER THIN LINE

Final Project

          

Radiolab Website Critique

For my final project, I will be redesigning the Radiolab website.  Radiolab is a podcast that discusses a range of topics from science to culture.  I thought that their interface was very successful and utilized all 5 points from The Basics of Web Design (the grid, color palette, navigation, design principles, typography).

They have a 2-column structure with the ability to navigate to any page from any page on the site.  The layout of every page is exactly the same with only the content and title changing to indicate where the user is located within the site.  The one possibly confusing element to their titling system is that the link and the title are not exactly the same.  For example if you click on the link ‘Read’ you are taken to a page with the title “Radiolab Blogland”.  One can infer that ‘Radiolab Blogland’ is something one can ‘Read’, but it may eradicate any confusion if the link and the titles were the same.

Their color palette is a pale turquoise, a complimentary orange, white, grey and black.  The pale turquoise in the background acts as whitespace surrounding the columns and helps to create a sense of openness.  There are also a range of fonts, sizes, and font colors to help differentiate groups and hierarchy.  They use photography and graphic illustration in combination to create a balance between the real and virtual worlds.

This site is successful in cataloguing so much information in a way that is clear in navigation and aesthetically pleasing.  I wanted to redesign this site so I could study in depth their methods of webdesign.

Below is my Web Comp basic structure, the content has not been included.

 

Competitive Analysis

             


                           Virgin America: pros

Of the three sites that I am critiquing, Virgin America’s site comes in 2nd place for least cluttered.  They also have a ticker that flips through various options on their site about every 4 seconds.  Their color palette, red, grey, and white makes for a comprehensible space that doesn’t immediately overwhelm.  They also utilize photographic artwork such as the actual interior of their planes and images with human figures.

Virgin America: cons

The ticker, being as effective as it is, distracts the viewer from their main objective.  Instead of simply looking for a certain flight location on a certain day, I am now researching deals for alternative vacation spots I may want to take in the unforeseen future.

          

Jet Blue: pros

Jet Blue wins the 1st place spot in the contest for least cluttered site.  Their text is on the whole larger, there is more empty space, and their color palette is a series of calming cobalts, sky blues, and a complimentary orange as a highlight.  They also have a ticker that changes text/imagery about every 4 seconds.

Jet Blue: cons

Jet Blue also has a ticker that changes text/imagery about every 4 seconds; however, I find their imagery to be less inviting and less effective due to their graphical nature.  There is no photography and no human figures, only iconographic pictures that imply airline seats and humans with luggage.  I find that this makes me less inclined to fly for adventure.

Air Berlin: pros

What Air Berlin does well is their use of a real human stewardess to brand the company as young, yet responsible and stylish, but with a sense of fun and admiration for the height of the 60’s “jet age”.

Air Berlin: cons

I chose Air Berlin as my third airline to critique because of the barrage of billboard advertising I have been seeing from them lately.  Those billboard ads lend a sense of excitement, that there is something going on in Berlin that we should all see for ourselves.  Their website, however, leaves much to be desired.  It is the most cluttered of the three, with information splayed on every inch.  There is barely any whitespace, the identifying red is not showcased prominently, and the choice of font looks outdated.

Design comp for Monday May Design

Design comp for Monday May Design

The Principles of Beautiful Web Design

Grid theory is a method for laying out design using mathematical principles of proportion.  There are two basic types: the golden ratio and the rule of thirds.  Implementing these rules will aid in creating pleasing compositions when used in concert with other design principles such as weight, repetition, and color saturation to name a few.

The observation of the 1 : 1.618 ratio in nature and the principles put forth by Pythagoras were foundations for creation of the golden ratio.  Because of the common occurrence of the ratio in nature, it was thought to be divine; and thusly, it has been used in art and design for hundreds of years to achieve a closer proximity to perfection.    Figure 1.1 shows the divisions of the golden ratio.

The rule of thirds is an easy method for applying these principles when one doesn’t have a ruler and calculator in hand.  It is a simplified version that allows the designer to easily divide the picture plane into thirds as is done in Figure 1.2.

Figure 1.1 The Golden Ratio

Figure 1.2 The Rule of Thirds

In addition to balance, unity and emphasis are important principles to web design.  Unity allows for the user to feel that the site is a cohesive whole and not just one page in a stream of disparate elements.  It establishes an order and a border.  Emphasis is the use or lack of continuity to invent a focal point for the user to gravitate towards.  Instituting a hierarchy of order will allow the designer to nudge the viewer to certain locations within the site. 

The “Bread and Butter Layouts” in web design, left column navigation, right column navigation, and 3-column navigation, are the tried and true staples of most websites today.  Their use, or overuse, can feel conventional and uninspired; though their apparent popularity demonstrates their effectiveness. 

Top 3 Favorite Websites

                                                             #1 - The Daily Beast

                                                         

Chosen for layout/design, videos, writers and easy navigation.  A great place for news, politics, fashion, art, literature and anything worth hearing about.

                                                          {www.thedailybeast.com}

                                                               #2 - STYLE.COM


Chosen for its vast catalogue of designers and their collections.  Also contains trends per season and has excellent photography.

                                                                {www.style.com}

                                                                      #3 - TED

Chosen primarily for content, this website also allows for various ways of searching through their catalogue of talks.  Filmed during conferences, TED provides video footage of talks given by a variety of people ranging from inventors to musicians to activists and everything in between.

                                                                     {www.ted.com}