Category Archives: Posts

Afgn

Posted on by

Afgn

 

In this website, the photo of the children in grayscale provides a means of emphasis in the orange-red type and graphics. The heat of the color contrasted with the black and white of the photo creates key emphasis of the Afgn logo, the dropcap, the Helmand Province graphic, and the previous and next buttons. All of the emphasized aspects are vital to the webpage. However, they do not stand out from the picture, which creates a friendly face for the area and detracts from the Islamist extremist stereotypes of the region. The photo is covered up by the black transparency on the left, but the whiteness of the boy’s smile captures the initial attention in the site.

TWLOHA

Posted on by

Screen Shot 2013-10-18 at 4.22.24 PM Screen Shot 2013-10-18 at 4.22.46 PM

To Write Love on Her Arms is a campaign designed to allow anyone to express themselves as the wonderful individuals they are. TWLOHA aims to help people who are struggling with depression, addiction, self-injury, and suicide. Photography has always been a large part of this website, specifically because images of self harm, in any form, were used to encourage this sort of harm by others, and TWLOHA tried to be the movement to stop that. The black and white color scheme, and image at the top of the page, serves to provide a striking contrast to the world of color that we live in. Sometimes, dealing with any type of harm, can be seen as black and white, and the color that brightens a day has to be found by one’s support system – the point of this movement. The rest of the pages throughout this website are coded to an image, and the images have something to do with that specific page.

Photography in Webdesign

Posted on by

Screen Shot 2013-10-18 at 3.45.52 PM

 

 

I chose Media Storm as a ideal site that uses photography to draw in an audience. The website is a place to display media and showcase photography. Here they use a key frame to draw the audience into the site and click on the video to see the story. The audience is for everyone, but probably mostly for other content creators to see what others are doing in the field. In this case the key frames in the videos are actually the bulk of the content making it user friendly and easy to navigate.

Photography in Web Design

Posted on by

Screen Shot 2013-10-17 at 6.02.06 PM

The large photo here was used as a visual element to effectively communicate with its viewers. Since this is a portfolio of Shelby Jacobs’ photography, the target audience of this is anyone who is interested in photography. She choose this particular image because it was simple, but could be interpreted in multiple ways. She also addressed a relationship between two people. According to Professor Taylor, showing relationships between people in photos is very important because it helps the viewers relate to the image. Additionally, I really like how the photo is taking up most of the space on the page. According to Bruni’s article, big photos sell! I also like how she used dark text over a light background. It helps the text stand out to the viewer.

Photos in web design

Posted on by

Screen Shot 2013-10-17 at 2.59.54 PM

This is the homepage of Syracuse University’s official website. Photos are used very effectively on this page. The big picture in the header shows the current season in Syracuse, giving readers a sense of what the place SU sits looks like. Also, the picture blends greatly into the navigation bar. Pictures on the left side are also very effectively used, considered the text information it provides. Headshots in those pictures are clear — the background is blurred, making the subjects popping out. Also, picture in the main section also looks great — the photo is sharp; it has rich colors in it, which makes the photo look fun and interesting. It also relates closely to the story it is covering.

 

Sweet Picture by Sweet Basil

Posted on by

Food Shot

 

The photo on this website was used to give the viewer a sense of the restaurant. It is apparent by the appealing visual presentation, that the restaurant serves upscale food. The target audience is people who can afford and are willing to pay for an expensive/luxurious meal. The designer chose this image to entice the viewer to make a reservation and come to the restaurant. The visual works really well with the content on the page as well. The bone on the lamb points to the navigation and directs the viewer’s eye to the information about the restaurant. The footer is appropriately placed below the edge of the plate. This is an excellent use of a photo background; I know I found the food very enticing.

The Whitney’s Website and Gestalt Principles

Posted on by

Screen Shot 2013-10-11 at 9.19.38 PM Screen Shot 2013-10-11 at 9.19.56 PM

This website was newly published by the Whitney Museum of American Arts. I think it serves as a good example for other museums how to make pages readable and clear. It uses white color as a background and black color for most words, and the visuals are very colorful. Hence, it is such a great contrast that objects can easily stand out. We can see that it groups information well under the “EVENTS” column. Top is dates, middle is visuals and bottom is the name and other information. White space is between each event. Each group of information can be clearly consider as a unity and separate with each other. Regarding visual hierarchy, the website uses the same font but different colors, different sizes, bold or regular, and upper or lower cases. For example, it uses black color, bigger size and upper case for the dates in EVENT column, while uses smaller size and lower case for the events’ names. And it uses grey colors, for the least important information—the time.

Studio MPLS Gestalt Principles

Posted on by

studiompls

 

Many of my favorite websites are often simplistic. This website, studiompls.com is no different. A good website also follows gestalt principles. Here are a few examples of gestalt found in this example:

Similarity: This site has panels that change. The grouping of the multiple shapes into the form of the toucan creates a similar shape that distinguishes itself from the rest of the web page.

Closure: The toucan beak is not connected or closed off with the rest of the toucan, so the mind seeks closure and does so to assume the beak and body are one object.

Proximity: The formation of the section words in the top right are close together in proximity, allowing for the mind to group these concepts together.

Figure and Ground: The website easily differentiates the background with the figure because the background is white. Regardless, even with the toucan graphic, the toucan is easily distinguishable from the background because of the vertical vs horizontal contrast.

Law of Symmetry in Circlex Web

Posted on by

 

 

34493

This website uses Gestalt’s Principle- Law of Symmetry. The main image of the web has a element of rotational symmetry because it has a central reference point (the hands) and rotates around the central point.  Because of it, the web looks much more interesting, engaging, and attractive to the visitors.