Individual Artifact

http://mandalynnwilson.wix.com/luva

mobile version:

I was really inspired by the concept of "quiet structure" when working on this project.  I wanted to make the content (such as the videos done by my team mates and the images of the product) speak for itself.  I removed any boxes or lines from around the images.  I also left out any lines dividing the different sections from one another and let the clean lines of the grid do the dividing for me.  The strong and clean grid is most apparent on the front page, where the majority of the content lies.  I wanted to be sure that I could engage viewers without overwhelming them.

From the front page alone the customer has many options, each put in place to help accomplish the company's business objectives.  First, there is the commercial.  Attached to the commercial I placed the first of many opportunities that customers will have to purchase the item.  Below the commercial there are three photos of the current product, each image a link to add the item to their shopping cart. I used the bodies of the models in the photograph as frames, and to create more contrast in the figure-ground relationship between the photos and the actual website background.  I also used the log cabin background in this manner.  Additionally, I used the texture of the log cabin and the sweaters of the models to create contrast and evoke feelings of cold winter days.  I placed the product name and the price in the bottom right corner to increase the intuitiveness, however, one can purchase the item by clicking on the wording or the photos themselves.

The customer is also able to view images from the company's Instagram account as well as click on a photo to follow them.  I thought this was important to include because our company's primary target audience is youthful and hip.  This idea is echoed by the fun font choice.  Just below the Instagram images there is a form that can be filled out if the viewer has question, and links to Facebook and Twitter.  Virtually everything the customer could want or need from the website is located right on the front page.  The menu is almost obsolete, though I did include additional information and images on the other pages.

Our color concept was inspired by the changing colors of a winter sky.  I used the color palette we came up with to effectively improve our continuity.  I continued the ombre effect from our logo throughout the website by keeping the lighter colors up top and then moving into the darker palette as you scroll down.  I think this gives the psychological effect of reminding one of cold night air as the sun disappears, which, in turn, should make the viewer want to seek warmth.

Business objectives accomplished by the site:
1) Explain the uses and functions of the product.
2) Give customers the opportunity to purchase the product.
3) Keep customers engaged and in touch with the business.

Design elements:

Law of similarity, proximity (keeping sections clear.)
Figure ground relationships
Color, contrast, line, texture
Used color and texture in psychological context, cold, warmth
Heart logo and photo play into the social context, love, relationships

Axioms of Web Design

Bodega's name speaks for itself.  It is a small bodega located in downtown Salt Lake City, specializing in beers, empanadas, and small knick-knack type items.  However, below it lies a speakeasy bar and restaurant.  To keep the restaurant's (known as The Rest) mystery, the owners do not advertise it anywhere.  One has to hear about it through word of mouth.  This makes the goal of the website a little different than the average website, a challenge that I believe the designers conquered.

This is a picture of the main screen on the mobile version.  (It should be noted that the mobile and web version are identical.)  You can see that it simply features a photograph of the face of the bodega; the colors are muted blacks and grays allowing for the name of the shop to really pop as it is a bright green.  This presentation is extremely simple and, I believe also intuitive.  In the top left corner there is a button which is the universal symbol for "menu."  If one clicks on this link it will bring them to a list of essential information which a customer would seek from a website.  These include the menu, the hours and reviews.  Again, the color palette and the fonts are simple and sleek.  Overall, this is an effective approach, but one that some may find boring.  However, the fun lies in the portion of the website that is not quite so intuitive.

If one clicks on the green glowing sign that says "restroom" it will automatically scroll the visitor down, through creepy black and white images that eventually lead to a small button allowing the visitor to make a reservation at the speakeasy.  I love this little feature because I think the fact that clicking on the link is not something a visitor would intuitively do adds to the secrecy and the "word of mouth" feel that makes The Rest so unique.  Additionally, the creepy old photographs play into the psychological context, making the visitor feel that they are participating in something dangerous and wild.  Also, the fact that it scrolls the visitor down, literally gives the feeling of going underground.  It's perfect really.

The only thing that I do not understand about this site, and that I would probably change, is the other glowing sign that appears on the main photo.  I don't understand why they chose to make this sign color among all the other black and white images.  It makes one think that perhaps it is also a button, but it is not.  I would prefer the stark contrast of the all black and white site up against the two bright green signs.  I think this leads and points to the idea that the visitor should click on the glowing green sign, without making it too obvious.  The other glowing sign just seems to add confusion and clutter to an otherwise really clean design.

The site is incredibly consistent if one clicks on the various menu options.  Each features a prominent black and white image that serves as a background for the text.  Though the images are interesting and large in size, they do not distract from the important information on the page.  Also, they provide continuity between the site and the actual store, as one will find some of these images on the walls of the bodega.

Mis-en-Scene: The Virgin Suicides

I am analyzing the 1999 film, The Virgin Suicides, directed by Sofia Coppola.  This was Sofia's first full length film as a director and she was just 27 years old when they began filming.  Adapted from the Jeffrey Eugenides novel, Sofia has said that she began thinking of the film the moment she read the book. And while she was true to the beauty of the novel she definitely added her own touch to the film.

This is a story of the awkward phase between childhood and adulthood.  Of the aches and pains of your first love and the obsessive behavior of adolescents learning about the ins and outs of infatuation.  I chose to analyze this scene in which the boys across the street are desperately trying to contact the girls.  There is something iconically American about the narration by the boys in this film.  This is one of my favorite elements of Sofia's interpretation.

Her vision for this story is evident in many of the little details.  For example, this clip begins with a note written by the girls.  Notice that it is on stationary with a rainbow in the background.  This is one of many little pieces of ephemera that reflect the youth and the femininity of the main characters.  The art director really brought this idea of youth to life with lots of clutter and chaos.  The girls' rooms seem littered with clothing items, teddy bears, records and makeup.  However, with the help of the costume designer, Sofia also toys with the idea that they are budding into adulthood by use of clothing and makeup.

Notice the colors of the film and the feelings they evoke.  Everything is tinged with a vintage tone that gives a feeling of nostalgia, but the shades turn quickly from yellow and warm to cold and blue which triggers a psychological response in the viewer.  The viewer gets a cold and sad feeling from the clips of the girls in their room.  Whereas the boys seem warm and cheery.

This isn't the only contrast I see in this scene.  Throughout the film you may notice that the girls are usually dressed in light colors and they all have blonde hair, whereas the male characters wear a lot of brown and dark blue and have darker hair.  This is extremely evident when the director uses a split screen to show the two side by side.  This has the effect of really separating the two genders for the sake of the story line.

She worked closely with the director of photography, Edward Lachman, who filmed many of the shots in very tight.  This gives the viewer a feeling of inclusion, almost like you are sitting with the boys as they dial the girl's phone number.  He filmed lots of little shots of the girls hair, their eyes, their smiles.  This makes the viewer almost understand what the boys across the street must be seeing when they look at the girls.  There are other brilliantly shot scenes that show the girls through trees or other obstacles that make the viewer feel like a voyeur.  Again, this is done to put the viewer in the shoes of the narrator.