ARTM2210 Intro to Web Design

Just another Intro to… site

Archive for Spring 2012 Section A

Bi Weekly 5

BlogName is a kind dull boring site with a gray background. There is no texture from the first page to the second and has really no color either.  The viewer has to scroll down to look at the content and links to navigate the site.

Evan Erkcad is an interesting site.  The bright colors and the black background draws interest to the viewers and leads them to the vertical and horizontal navigation bar.  The second and first page have the same qualities to keep the viewers interested.

ResNet is a great site which has many colors and textures for the viewer to see. The texture helps the viewer navigate the site by having the navigation bar at vertical and horizontal.  The site does not change page to page.

Dizi is a very bright and pink site that attracts people to look around.The bright pink bars around the site shows the viewer where to click to navigate the site. The creme color texture matched the pink to keep the viewers looking at the site and not have a headache.

Franophone Prague Guide is a well put together site.  The yellow and oranges texture is suited for the viewers eyes to navigate around the site to view the content. The navigation bar is vertical which lets more on the page for the viewer to see.

The Seen

The Seen website has a very wide use of color and textures. On their site it says they are “a small multi-disciplined creative design business born out of F1.” They design for a few different companies, but mainly ones dealing with some sort of racing. Each block has a different form of animation that makes me want to see what will happen next when I click on the block. Also the use of color is extraordinary. It has a dark background that makes me want to get a little closer to read the text and spend that much more time on the pictures within the page. Due to the fact with all the animation on the page it makes me want to play around with the page and see what it all has in store. Overall i really enjoy the colors and textures on this page mainly because it can keep me interested and wanting to learn what this specific site has to offer.

Bi-weekly review

 

I choose to analyze the web page of an organization that manages carbon emissions named Carbonica (http://www.carbonica.org/). The web site of Carbonica has a very interesting texture. The main background is made to look like it was some kind of old cardboard paper; one has a darker tone than the other which allows it to stick out to the viewer. The top of the page has a part that look like a mesh fabric and some graphics that represent a hill with some trees scattered on it. The web site use line and shape to subdivide the information so that it is easy to mentally organize. It also uses light and shadow on the background to give it the illusions of depth and make it look 3 dimensional. Overall I like the way they included texture in their design as it emphasis the ecologically friendly activities of the company.

Bi-Weekly Review 4

The Helmy Bern website is very interesting and beautifully textured. It is a company that offers products for skateboarding, skiing, and surfing. The overall textured theme involves a ripped piece of cardboard. To get the textured effect, they use a slight drop shadow on the cardboard, and give it paint splatters and signs of wear and tear to make it look authentic. As for the background, it is somewhat grainy (like the texture of a street), with brush designs at the top that make it look as if it was painted. The whole site has elements of “grunge” to them, which really ties into one main aspect of their company–skateboarding. The grungy theme is uniform throughout, with articles having the same kind of diagonal brush design in the upper left hand corner.

The Ernest Hemingway Collection

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.

Bi-weekly review: Texture

The site Kayintveen.com used texture in a very subtle way. The dark gray background has a very fine grain texture, which is just noticeable to the naked eye. The texture is contrasted to the “clean” or flat colors used for the background of the subject boxes. The competition between the texture and non-textured elements creates a focus on to subject within the boxes along with the use of light.
Light in this site is used to focus the reader to the information within the subject boxes. There are very small and faint shadows surrounding the main boxes, which contain the pictures. The shadow designed to create depth in the webpage. These shadows are along the edges of the subject boxes.
Shape is utilized in abundance throughout the site. Kayintveen.com used shape to create separate bodies of information in a unifying way. There is only one shape, the rectangle, repeated down the site. This repetition created a pattern in order to enhance the texture of the website.

Bi-weekly Review- Coalmarch Productions

The site for Coalmarch Productions looks like they’re going for an old-timey coal miner look. They accomplish this through giving their main body a texture like parchment or an old coal document. The shading for the body is like a golden creamy color with darker speckles and spots mixed in, they even put what looks like a big water stain on it. The shadows on the sides add to the overall look of the site, instead of a flat lighting it looks more like it could be lit by candlelight. The lines that break up the body from the asides serve their purpose without taking away from the aesthetics of the site by using a different shading from one side to the other. This site does a very good job of portraying something older through textures with a modern medium.

Bi-Weekly Review

For this review I have chose the site The Seen.  This webpage would draw peoples attention for many reasons.  One because of the dark background.  The dark background really makes the pictures and texture stand out.  After exploring the site more, one begins to realize that the shapes and lines in the background is what really draws me into this sites layout.  With all the images and bright colors in each of them makes for an attention grabber and makes you think about what the designer is trying to say about his or her work.

Towards the top and the middle of the page, the color begins to become darker and noticeable. The edges of the page have a jagged shape that gives the webpage texture. As  you scroll over the photos a links appear to the pictures and take you off the site and into another link.  This makes for an exciting and interesting site.  As I navigated The Seen I came across different creativity and bold ideas. The Seen is a very plain site, but it makes for all the better because the real message is when you click the photos and give you that particular photos and gives more detail information on it. The outside of the page has a darker color which gives the page a  sort of different look. However, one might say this webpage is simple with not much design, not having much design is what really makes this webpage work in a way of its simplicity.

Bi-weekly Review 4

The Ernest Hemingway website from http://sixrevisions.com/ uses an interesting collection of texture. The hardwood pattern background serves as the base of the website giving the user an overhead perspective of what seems to be a desk.  The use of space and varying scale of objects creates an almost tangible depth to the website.

The wrinkled paper of the tag, layered on top of the pictures with ripped edges paired with the slightly discolored corners of the main page keeps with the theme of a desk that someone has used. When the user scrolls down they will notice the spotted brown ring that the coffee cup left on the paper. The light opacity of the ring adds texture to the page, making the user imagine that someone left the cup in that place long enough for the liquid to seep in. The top menu is centered in the page with a strip of material behind it; the sheer detail of the element adds yet another piece of the site that looks real enough to touch.

The glare on the coffee surface makes the light appear to be coming from the above right. That harsh reflection was not paired with a strong enough shadow to the side; which then made the site a little less realistic. Also when scrolling down the pattern of the hardwood turns black, not because of the lack of light because the darkness was not matched on the paper above. This change in brightness makes the whole desk theme less realistic. The overall site is trying to make something realistic, but it does not follow through with each of its elements.

Lanikai Texture Review

Lanikai Properties is a real estate firm located in Oahu Hawaii. Because the real estate is located on an island, the look of the website is drastically different than websites on the main land. The main texture of the website is a wooden floor. The lines on the wood run vertical, the same way the page scrolls. The wood is a light color representing the light and airiness of the island. If the wood was a dark chestnut, it would give the website a completely different feel. Along the right hand side of the website, there is a distress striped banner that runs down the side of the page. The colors are a bright, cheerful color palette. The distressed look of this banner remind the visitor of the beauty of nature, of the house in Hawaii. The distress look may also be nostalgic for those who have traveled to Hawaii at a younger age. The web designer also distressed a lot of other shapes and boxes on the site.
There are many smaller textures that Lanikai uses to their advantage. The header is highlighted with lines and a circular shape to attract visitors’ eyes to the companies’ name. To keep the website organized, Lanikai uses boxes to hold the text and pictures. These boxes are also distressed to keep the feel of nature to the website. Some of the boxes are tilted to a right of left direction. The tilt removes any seriousness feeling for the website. The top box utilizes diagonal stripes, as diagonal stripes give the website a feeling of fun movement. The vector graphics placed around including a Volkswagen car and Hawaiian flowers enhance the lighthearted whimsical feel.
Lanikai Properties have a lighthearted fun website that is achieved with the use of texture. Light colors and wood grain work distressed boxes to keep the overall theme naturalistic. Rotations, vector images and order of placement keep a fun feeling to the website. Overall the website represents a Hawaiian real estate well.
-Shelbey Surgent

The Rugged Texture of Bridge55

Bridge55


 

Bridge 55 is an online men’s fashion clothes store whose website features an interesting use of texture to convey their style of urban, ruggedness. The most obvious use of texture is the brick wall background of the site. It is a rough, beat up brick wall that uses contrast and a gradation of color to keep it interesting; some parts of the wall are fading to white while others are nearly burnt black. Furthermore, the bricks are not consistently shaped and are cracked at points; as a result, it looks like a very, old thrown-together sort of wall. One nice touch about the wall is exclusively featured on the home page, aesthetically differentiating it self from the rest of the website. The brick wall is shorter in height and opens up in the center to reveal the website’s specials. In a sense, the background becomes a foreground frame to showcase their sales and exclusive items. The frame the wall creates is staggered, not a perfect rectangle, but it keeps with the whole rough and rugged feel of the whole site. Also, the wall features graffiti art of some of the brands the site sells on the wall, which of course, only makes the site feel more urban.
Many of the lines on the website have a torn look to them; the most notable example of torn lines is the navigation bar at the top, center of the page. The background of the navigation bar is a black, torn rectangle that runs up against the background on all sides except for the top, which touches the white banner that extends the length of the page. The white banner and the black navigation bar create a strong contrast with torn edges that immediately place the visitor subconsciously into the world of the site. The banner is clean, white and easy to read. As soon as the viewer’s eyes cross the torn edges of the navigation bar and enter the bricked wall background, they are in an urban world of rugged style where store’s clothes become the spotlight. The only other unique use of line and texture on the site is the side bar on the left side that appears on the left, it is a simple rectangle with a page pealing effect in the upper right corner. It is a nice touch that makes the page feel less plain and two dimensional, but it is the only place they use that effect and consequently, it feels slightly out of place. The website does not use shadows and feels very two dimensional for the most part. It would be nice to see the background move with scrolling to separate it from the rest of the page, and also use shadows and transparency to give it more depth. All dimensionality aside, the texture of the website replicates the feeling of urban, ruggedness of their clothes by using a simple, well picked background and a smart use of torn lines.

~John Marshall

Texture and Feel

The ernesthemingwaycollection.com website is all about making the screen of the computer seem as if it were the top of a wooden desk. It accomplishes this through several details. Most of it includes areas, items, wherein information is displayed as well as the personalized simple color choices.
To begin with the lines and shapes of this site are both simple and complex. The site is supposed to be a desk and as a desk it would have things on it such as coffee and papers to read off of. It has those things as well as some of Hemingway’s personal I.D and his photographs. These are all straight edged, lined, pieces but they lay on the desk haphazardly as if it were someone’s real desk. Within these items is the text, which give the information.
The color of this site is very much muted and faded colors. There is not much shadow other than the desk wood gets dark near the bottom of the page. It is probably to make it feel like an overhead light source of either a lamp or a window. There is also some reflection of light in the coffee cup but that was most likely done in a graphic.
Overall texture and feel of this webpage is very well done. It all fits together very nicely and pulls off its intended purpose nicely. I would think that this is a very reputable website for information on Ernst Hemingway.

Texture: “The Ernest Hemingway Collection” [http://www.ernesthemingwaycollection.com/]

After careful review of “The Ernest Hemingway Collection,” the texture and appearance without a doubt stand out.  Take the stained wood grain for example.  It’s rich brown color and wood rings set the tone for the site as a whole.  From quick glance, the scattered items off to the left side give the site a very open, intricate, and personal touch.  Almost as if the viewer is looking into Ernest’s living room.  A filled coffee mug, some loose change, a couple of photos, a passport, and name tag all give off a personal touch to the page viewer.

As far as line, shape, light, shadow, and patterns, the layout features many of these elements.  Having the old, torn beige paper right-justified with all of the site’s information and links was a wise choice by the designer.  The shape and color of the torn paper compliments the wood grain perfectly.  The rectangular shape of the paper also flows with the site as the viewer scrolls down.

Going back to the items on the left, the shadows that are given off make the site 3-dimensional.  The coffee for example has a grayish shadow, or “glow,” which makes it not only realistic, but also easy to look at.  The photos, loose change, passport, and nametag all have drop shadows, which make the site seem practical.  It’s realistic and believable if shadows all come from the same light source.  (Whether it’s natural or unnatural.)  And since all these items have proper shadows, with a proper light source, it looks extremely real.

The items and wood grain truly make the website.  Without the grain, and realistic elements/items, the tone of Ernest Hemingway would not be successfully portrayed.  It gives the site a personal touch.  And for the viewer, personality is a key element.

Bi-Weekly 4

Pikaboo website can easily get someone’s attention. The texture of the website brings out the everything to catch the viewer.   The background as a darker brown-greenish shade helps bring out the links to navigate the site.  The bright colors help bring out the texture so it is easier to read for the viewers.  The squares outlined in black layer on top of background brings them out plus the bright colors.  Having the person blurred and on the corner makes it feel real.

Bi-weelky Review

Bi-weekly review3:

The website I choose is called Geekthletics. The site uses of color works really well, it uses 3 main colors that are; Pink, White and purplish pink, because of this, the overall look of the site is really homogeneous. As far as the navigation is concern, it is pretty simple to navigate, the user can choose from 4 different options by clicking on small circular icons, at the bottom of the page there’s a quick description of what Geektletics actually is and also couples different links. Whenever you click on an icon, you are taken to a sub part of the website. For examples if you click on apparel you are redirected to a page that display different clothes that they sell, at this point the navigation become s much more like a regular retail web site, you have option to put items in your cart then check out to pay. Overall the web site has a very efficient design, it keeps it simple and go straight to the point, it is also fairly easy to navigate.

Webpage Template Bloom

Bloom

Bi-Weekly Review #3

The responsive one page website template Bloom is a sophisticated page that allows users to navigate solely through scrolling or also by using a fixed navigation bar at the top of the page the scrolls with the user. It is an interesting approach to a website because it gives users the unique opportunity to experience the site in a linear manor or by traditionally skipping to the sections they would like to see. It is strictly a vertical experience, unless the user shrinks the browser size which forces horizontal scrolling. When a link is clicked from the navigation bar, the web page automatically scrolls the user to the corresponding location on the index page. The website adjust for whatever device the user is browsing on, including smart phones and iPods.

The website template showcases some sophisticated artwork and color scheme, and boasts they have many to chose from. The primary color scheme they show features a very limited color palette. The background features a deep grayish brown backdrop with a centered light, grey/brown oval. Both items of the background are fixed and scroll with the user. Text is written in a similar light grey/brown color and sometimes white for headings and emphasis. They contrast the chromatic grey color scheme with light yellow green text for other headings and hovering over links for further emphasis. The yellow green color can also be found much of the artwork.The way the site is designed, the users eye’s are drawn to the lightest parts of the screen, which in most cases are the headings and navigation which are either white or light yellow/green.

Overall it is a really nice web page template; one of the only complaints someone might find with it is that the site has a longer loading time that come with it. This is most likely due the large amount of information on a single page and the videos and pictures they included on it, so it comes with the territory considering the content.

-John Marshall

Comic Sans Criminal

For my bi-weekly review, I chose to review the Comic Sans Criminal website. I was already familiar with the site, having seen images from it on social media websites such as Facebook and Twitter. At first, I noticed that each page is a different, calming color (though two of the colors are used twice).  The first page tells you to click anywhere on the page to continue, and sets the page navigation for the entire site. You can either scroll, or click anywhere on the pages. There is also a static menu at the top, which has external links to alternative fonts, font software, and stickers and posters. The link on the far left takes you back to the very top of the page. The overall mood of the site is calm and quirky, as intended. The site guides the user’s eye steadily downward. The text is appropriately centered and not long and drawn out on the page, which works with the page’s orientation nicely.

Bill Paterson Hydraulic Fracturing

Hydraulic Fracturing-

 

What really strikes me about this site is that it is excellent graphic design that is well transferred over in to code and function.  The colors all work well and do not compete to much against each other, they flow and accent each other well.  The attention to detail on this site is very evident, from the shadow on the truck, to the transition of light to dark browns while scrolling on the page. The detail is very well done and clean. Scrolling on the page is fairly easy and logical, the pop up effects for the different fact is also well done and clear.  The site is easy to follow and put good emphases on the information that matter and gives good background visuals to help explain its message.

 

Comic Sans Criminal

ComicSansCriminal.com is a one page site that has championed a campaign to stop the inappropriate use of the font “Comic Sans”.  The site is a simple concept and has a user-friendly, simple layout.  Comic Sans Criminal is one page but feels as though it is made up of several pages.  When one first enters the site the page seems whole and complete.  Visitors can either scroll down through the following sections or they can simply follow the on-screen directions and click anywhere to continue on.  The rest of the site is separated by different colored sections that take up the entire browser window.  The content is centered and easy to read if not just a little boring.  Upon clicking on the page the browser window scrolls down until the next colored section takes up the entire space and again the content is centered and clear.  This separation between sections of content makes for an easy to read and easy to follow site that feels less like a one page site and more like a multiple page site.  The content is very clear to even the least web savvy people.  At the bottom of the site you can print and sign a pledge to use Comic Sans in the way that the site’s creators deem appropriate and you can send the site to other people that you believe use the font incorrectly.  At the top of the page, no matter what section you are in, you are able to click on links that take you to other content such as alternative fonts for dislexia and other font resources on outside pages.  All-in-all the site is incredibly user-friendly; just click to scroll down.  The website also has a clear message in well organized content and a fun message.

Third bi-weekly review (onepagelove.com)

In this week’s bi-weekly review, I decided to discus the design techniques used on the site www.leaderstheconference.com. The website was created by Grayden Poper for an organization called The Resolved Church. Different forms of multimedia are used to illustrate the elements of a conference hosted by The Resolved Church. The elements are situated in a “list” format, which forces the reader to scroll down the page in order to read more information. The focal point of the page is a silhouette of a man in the background that guides the viewer down the page, along with the placement of the information. The silhouette is the reason for the viewer to navigate through the page a specific direction, in contrast to using color.
The range of colors is limited to very few colors: black, white, gray, red, and yellow. All colors consist of a high-density texture that adds visual appeal; in addition every color has been faded in order to weaken the intensity of the color. The red has been toned down but still attracts the viewer’s attention because of the grayish background. Since the red is very different, it stands out from the rest of the content on the page, which creates emotions of pride, fortitude, or confidence. Those emotions are important to influence the viewer to join the conference, because there will be leaders from all over the U.S. Also, yellow is used to emphasize the titles and names along with tracking; the designer increased the space between the letters. Overall, this was a strong design because of the simple color palette and the use of texture to tie all of the colors together.

Grayden Poper: One Page Review

Grayden Poper is an interactive designer with a one page portfolio website. Poper uses color to attract viewer to his website. Bright green, blue, red and yellow are used as a main color scheme to attract attention. These bright colors are also placed on a black background, which stands for power. The website also uses a lot of geometric shapes, to attract attention. He has even listed that shapes inspire him. The artwork he has listed “pops” off the page because it is placed on the black background. The heading text on the website is extremely large font size. Also the artwork he chooses to display is very large and takes up the whole screen. The size of the text and the images, paired with the bright colors, is a lot for the viewer to take in. Poper may benefit from scaling down some of the images of his artwork.
Along with the bright colors, Grayden Poper portfolio website is unique because it is a one page website that scrolls down. Viewer scroll down to see Poper’s work, and his random ideas about design. Each section is separated with a large heading. Poper also has a right-hand side bar that allows the viewer to click on specific artwork, rather than scrolling through them all. Although the page is scroll down oriented, on a 15-inch Mac Book Pro, viewers are given the option to scroll left and right. This scroll is around ½ inch so it confuses the viewer. It seems like there should be something more to the right to look at but there is not. The scrolling is also confusing because Poper places his “design thoughts” randomly in-between his artworks. When the viewer is only expecting artwork, the design thoughts look out of place, and are ignored.
Grayden Poper has a website that is a cry for attention. Poper has designed a portfolio that screams look at me and what I can do. The bright blue, green, red and yellow will bring the viewer in making them feel comfortable. The black background gives Poper a sense of importance. The scrolling portfolio sets him apart from every other interactive designer you see today. The real test is how much business this web site gains him.

Single Page Review

The site that I reviewed was the Strongarbh House.   This website is very creative when you enter the site.  There is a lot of color and variety that draws the viewer into the site.  There are images that move as a side show when you enter the site.  I think that this drawls me right to the site. The images are black and white and really make the site come to life. The web page has a navigation on the top of each section that you can click and it will automatically scroll down to the part that you clicked, or you can just scroll down and it will also take you through the whole page.  This feature really makes it very easy to navigate.  The website is also divided into different colors, and they repeat the colors for the different sections. The colors go with each other so there is a flow of style throughout the site. We can see that the colors make it look like a single page website.  They also designed the website placing pictures at the end of each section so the people that are navigating know what to expect when looking at the different sections.   Also as you navigate the site towards the bottom, the contact info is in different font and size to catch your attention.  So when you exit the site you remember what the experience was like.  Overall this single page site is very simple and gets the point across to the viewer.  The style, color, and simplictity really makes the site stand out and makes you want to read and scroll to find out what it has to offer.

One Page Love

I picked to look at the Switch Wine website. Going through the pages, this one jumped at me the most. The sites use of color is very colorful and really draws the viewer into the page. The colors of each page change as you scroll right to left. The use of graphics that come in when you get to the second section of the page is really neat and makes you want to see how the pictures relate to the information. Like i said the page reads left to right. Also if the viewer were to try and scroll up and down it still moves the page to the left or right. It starts with the title page which has the prime information on what the site is all about. This page has a good vibe and some graphics that really brings in the viewer. It is a simple easy maneuvering site with all the information easily found.

Bi-Weekly Review 3

For my single page review I picked, Comic Sans Criminal.  The website is very colorful when the viewer keeps scrolling down to view the page.  The site uses the color to help the viewer know when one comic ends and another one begins.  The tone of the website tries to be funny to the viewer and the color pushes the viewer to read on.  The viewer could either scroll down or click anywhere to continue to the next joke.

I did ind this website entertainment with some of the jokes they had on the page and very colorful.

Flight of the fireflies, bi-weekly review by Alex Antonacci

After looking through numerous sites on one page love I finally picked one to review, flight of the fireflies. It was simple, visually interesting and a pleasure to scroll through. When opening the page the user first sees a quite dark blue-grey background with faint white stars. In the front there is a cluster of yellow spots to represent the fireflies and a white arrow to direct you where to scroll.

When scrolling down the dark blue color becomes progressively lighter and the stars are replaced with clouds. The slow change to a brighter tone of blue represents the scene of night turning into day. The fireflies roam from one side of the page to the other when scrolling; this is the primary guide for the users eye. When the user hits the bottom of the page the fireflies form the words flight of the fireflies. Underneath the firefly formation a video is placed with a dark green field and a black tree line in the distance.

Single Page Website: “The Better Chip” [http://www.thebetterchip.com/]

After searching and flipping through various single page websites on onepagelove.com, “The Better Chip” was no doubt the one that spoke to me.  The simplicity of the homepage is not only easy to read, but it is also easy to figure out.

When you are directed initially to the site and waiting for the contents to load, a graphic is shown that reads, “Be Patient…You’ll Be Crunching in No Time.”  This clever message engaged my interest right off the bat.  It was entertaining to me a viewer that had no knowledge on the product.

After entering the site, the graphics and color set the tone immediately.  The soft green grass that fills the lower half of the page give a feeling of nature and the outdoors, which then turns into a very organic feeling.  The sky’s soft blue and grayish upper and lower menu bars also add to this organic feeling.  Even the font type appears very natural and soft, which also complements this feeling.

Another big aspect of the webpage that sets the tone is the texture of the four main chips.  The crisp clarity of the photos is evident because the chip looks almost as if it is coming off the page.  The texture of the sweet onion, jalapeno, red pepper, and fresh corn look organically delicious.

As far as the navigation, as the viewer clicks on each chip, a drop down tab appears at the top of the screen and practically takes over the page.  From there, you are able to read little tidbits about each flavor and view graphically designed photos.  There are clickable arrows on the right and left of the tab to flick through and learn about the four flavors.  Once the viewer clicks on a flavor, the drop down tab remains there on the screen for other viewing.  You can click on the top bar on, “About,” “Products,” “FAQ,” “Where to Buy,” and “Contact,” for other information about the product.

Although simple, “The Better Chip,” seemed to speak to me.  The tone is definitely achieved through the color palate and graphics, and the navigation with clickable arrows is extremely easy to function and use.

Single Page Website-Nick Evanko

The site I chose to observe was twofishillustration.com. This site was created by a designer who’s name only appeared as Jon Doe. On the single page website his work is displayed as well as a brief profile description as to how he got started in his work. At first glance, the site’s header “Creating Stuff Since 1984,” was quite hard to make out due to it’s white letter color against a light grey background. I had to highlight the title just so I could read it clearly. The rest of the site was very interesting. The main attraction was the artists work, which was displayed in a black, white and grayish tone and when the mouse hovered over it, it changed to full color, therefore drawing in the viewer’s attention on the selected item. The mix of black and white to color was an interesting approach I found to be effective in drawing the viewer in. The black and white is a calming tone, and when the color appears, it creates excitement in the viewer.

The designer also made it very easy to navigate the single page with the use of header options at the top of the page such as, Introduction, My Work, and Profile, that when clicked, directed you to the desired section, without having to search with the scroll bar. This makes for fast, efficient navigation that becomes useful when viewing a large single paged site. The designer also used a great deal of negative space, especially towards the bottom, to separate the information so that it does not blend together and create confusion for the viewer. Overall the site was very effective and well designed.

 

Bi-Weekly Review Single Page Website

Elliott Burns

Web Design

Bi-Weekly 3

February 12, 2012

 

For my single page website I choose http://www.dura-edge.com/. This site is for a company that specializes in soils for athletic stadiums. As such the color pallet of this sight is very earthy with rich browns and greens. The color choice gives the site a very natural feel and makes it seem like something traditional or correct for sports with a history. The most intense colors are at the top of the page where the company lists key facts about its business that might entice a potential customer.

The layout of the site is a top to bottom scroll but it also has a ribbon across the top to take you immediately to a particular section of the page. The page is laid out from top to bottom with information at the top about who they do the work for. These are big name sports teams and will definitely impress a visitor. Then further down the page discusses how it maintains a proper athletic stadium. After that it explains the products that dura-edge sells to make this perfect soil happen. Finally at the bottom of the page after the visitor has been impressed and informed all they can on dura-max they come to the contact section. This will allow them to buy the dura-max product that they have been so impressed with from reading about it.

Comparing coffee sites

The two websites I chose to compare for this review were Starbucks.com and Crazymocha.com. Starbucks’ layout is simple; there is a navigation list stretched across the top, a video is the largest element in center of the page, and more articles underneath the video. There is a very limited amount and use of color throughout the layout. The site is balanced, for example, the video has text and thumbnails beside the image, and below the video is a list of articles adjacent to a row of small images. The main focal point of the site is the video since it is the largest and most central element. Certain text is emphasized throughout the site by the color green, which separates those phrases from the black text. The simple color palette creates unity within the site, in comparison to Crazymocha.com.

Another site to use very limited amounts of color is Crazymocha.com. The site uses black, red and a white background; this creates unity throughout the site. The site is asymmetrical with the slideshow in the center, navigation stretched across the bottom, and the logo in the top right corner. This layout is much more simpler than the Starbucks website. There are few options for the viewer to click on, but it leads the viewer to click on certain elements. The most obvious focal point is the large image on the center of the site. Both sites create unity, balance and emphasis in unique ways.

Starbucks vs Crazy Mocha

Starbucks and Crazy Mocha have two completely different websites. The Starbucks website has more going on as opposed to the flash-based Crazy Mocha site. Both are unique, yet effective in the way they display information and how their users are able to navigate through the information.

When I first glanced at the Starbucks website, I found it to be very sleek and modern, with their famous white and green color scheme emphasized. It is very complex in that it holds a lot of information and there is a lot going on on the website itself (links almost everywhere, a video, top stories, etc.). The site is balanced, however I noticed it has a fixed layout, which could pose a problem for web users with monitors that have a high screen resolution. The site is unified very nicely, with all of the main stories and events emphasized.

Crazy Mocha, on the other hand, is quite different from the Starbucks website. Although it is very simplistic, I found it to be the more pleasant and eye catching of the two. It is completely flash based, and offers a full screen view of the site, which you do not see every day. It seems as if the information a customer would want is very easily obtainable. Balance wise, although it has a large amount of white space, the site works in that the layout is not fixed and adjusts to any window size. The elements of the site work together to create a simple, user friendly environment.

« Newer entries · Older entries »