Self-Assessment Two

This project is a combination of two different processes: 1) improving the web design of my website, and 2) creating three more stop motion animated commercials in continuation of the first project. I hoped to finish the most work-intensive and central component of my publicity campaign for the Campus Farm, and I succeeded in doing so. Because much of the process for making the animations was very similar to what I talked about in the first self-assessment, I will be focusing on the improvement of the website, which was inspired by the unattractive layout that I had made last semester.  The website was too dark, the color scheme was not visually pleasing, and the buttons on the home page seemed to create disorganization on the page.

I began by looking into websites that were much cleaner, such as my friend’s template website, The Young Catholic Woman. My first design was inspired by a desire to illustrate the earthiness that I was promoting, but the picturesque background of dark soil seemed to be a dated and dark method of doing so. I found the cleaner, and lightly-colored websites to be much more attractive. So, I began to work with Adobe Kuler for a more pastel color scheme. This part of the process was incredibly time-consuming, and required hours of playing with different shades, tones, and color combinations. I looked into premade color schemes, and considered color options that I had not previously, such as purple, blue and yellow earth tones, and this opened my mind to different color options. I ended up using a Digital Color Meter to extract lighter shades from my main image on the home page in order to gather the colors that I needed, and noted their Hex numbers. My color scheme relies predominately on three colors: white, olive, light green, and dark brown.

Next, I needed to better organize my site. I enjoy the consistency of a banner and navigation bar along the top of the page to give every page solidarity and cohesiveness, and ease of navigation at all times. The hardest part of this process was creating a rollover navigation bar using CSS. I attempted to create this navigation bar several times, using different references, but succeeded in finding a very user-friendly YouTube video byMohit Manuja. I had issues centering this navigation bar though, so I had to use an additional source that told me to separate commands for the “ul” and the “li” aspects- I still do not fully understand this concept, but I do know that it worked.

The last part was to build the banner. I wanted to keep an earthiness to the site, but without overwhelming the page with realistic images. So, I took a picture of basil and made it black and white, overlayed a transparent layer of the light green on top of the image, and then painted the edges of the image so that it would blend better with the background of the webpage itself. I used a cursive font for the title so that it looked journalistic and handwritten, to reflect the journalistic nature of the written content.

I spent a large portion of time solely on the web-editing aspect of the design in order to ensure its professionalism and aesthetic appeal. There were many times that I wanted to give up on different parts, but I was able to pull through, and even search for alternative resources when others were failing me. I should have used the TA option more heavily, but I was insistent and pride-driven to figure this out without much guidance, which is folly. I believe my time was well-spent, and contributes to a large success in the inviting appeal of the website as a whole.

The final product is definitely more cohesive and attractive than the original. The color scheme is lighter, warmer, and more reflective of the spiritual and healing atmosphere that I am trying to convey with the project as a whole. It is more organized, and easier to navigate by eliminating the necessity to return to the home page for navigating the website, and allows the audience the ease of skipping around the pages without extraneous clicking. There are a few edits that I still need to make in terms of making the site more pleasing. The videos needs to be larger to emphasize the artwork that I slaved over and to show the reader that this video is just as important, or related to the writing below it. There needs to be a minimum and maximum window size setting so that the writing does not become too close together if the window is too thin, and the content of the page is not overwhelmed by the green-to-white gradient background if the window is too large. I also need to fix the pictures hanging over the bottom line of the writing section.

I think that my project is cohesive and inviting, and I hope that my audience will appreciate it in the coming month. I believe that I deserve an A for my efforts.

Paravel Web Design

     Paravel is a web design and branding agency comprised of three men- Reagan Ray, Trent Walton, and Dave Rupert. They all contribute to the web projects in their own ways, but it seems that Reagan Ray is the graphic designer of the websites, judging by his individual portfolio site where he displays a lot of his branding designs. I was attracted to the "handmade" feel to his artwork, especially on the first page of the Paravel website because I intended to have the same effect for the homepage of my own website.

Home Page of Paravel

    

      Within the site is a portfolio of different sites that the team has worked to create. The layout of the site is very simple, using black and white rollover images in a grid layout to organize their works. After clicking on their images, you are taken to a new page where they have a large image capturing the design of their sites. 

      Below the main image, the page is divided into several small sections by a simple gray line. Each section contains small captures of aspects of the sites they create, and then simply describe the process of their designs. Their images are very clean, but they add in elements of "homemade" which is most likely Ray's doing. 

       They create responsive web sites, which are supposed to be very easy to use and available to resize on several different technological appliances, so they make good use of Div Tags, as opposed to AP Div Tags, which is a good choice in a time where smartphones and tablets are becoming more popular in use. Their simple and sleek web layout is attractive, easy to read, and easy to negotiate. 

      I hope to design a website with a similar design. For my homepage, I have an image with a homemade feel, like theirs, comprised of rollover images that will take the viewer to a new page elaborating on each section of the site. Below that, I hope to take inspiration from their site and create small sections in which I take sections of my art pieces as visual representations of each section of my writing. I will be more cautious about the size of my font, however. I think that the font size of Paravel is obnoxiously large, and distracts from the display of their work.