Website | Murphy

Erica Murphy | Website rationale

Non-for-profit event

My non-for-profit event is affiliated with a club that I was involved with in High School. I chose this specific club because it was the club I was the most involved with in high school. I chose the annual bowl-a-thon because I had my own pictures from previous events. I thought that this would make it easier to create a design when I already knew what visuals to use.

Design strategy

I chose to use a 12-grid system because I felt that my containers were too large for the 16-grid system. I also thought that spreading objects and type across two columns was easier to design. I used the same color pink throughout each page and just changed the opacity to create visual continuity. Pink is the official color of the Susan B. Komen foundation, so I thought this worked well with the theme of the bowl-a-thon. I used a bowling ball to dictate which page was the main page and kept the circle theme going with the shape of my pictures. I also used a bowling pin on each page to hold extra information and to help contain the main text.

Choice of Type

I wanted to use somewhat girly and fun fonts to contrast the brown, boyish colors of the bowling ally. I couldn’t find the font I wanted for the headline in suitcase, so I found a font on dafont.com titled Sooperfresh. I used Emmascript for the links on my web pages and trade gothic LT Std for the body text. The script and sans serif fonts provide a nice contrast to each other.

Schwartz - Week Fourteen

Design Strategy

I immediately knew that I wanted to use Phi Hoops for my website design. I really enjoyed creating a poster for this event because it is relevant to me, as my sorority plans it every year. Similarly, I was so interested and enthralled by this project, as I was able to extend my passion for AEPhi and our events into my schoolwork once again. For my website design, I chose to focus around the pictures that were already in my possession. I got lucky, because I had a large selection of photos to choose from, as I helped organize this event in the fall. I chose to pick links to pages that applied to the event specifically and I knew enough information about so that I could provide the most information possible. I tried to maintain visual consistency throughout by keeping a similar model for all pages.

Typefaces

For my typefaces, I chose Antique Olive Std for my header and side bar. I like this font because it compliments Verdana, my body text, as they are both sans serif. I thought this was a fun test to use for headers, because it attracts attention but adds a playful touch, which is applicable to the event. These are the two typefaces I used consistently throughout the web design.

Color

I chose to use green and white as my primary colors for my site, because they are my sorority’s colors and I was also able to pull them out from the logo. I kept consistency for using these colors throughout, and added a touch of orange for the basketball touch. This is the only presence of color in my project.

Images

Sidebar Image: http://www.afghanbuzz.com/events/wp-content/uploads/2009/01/british-performance-basketball-logo-31.jpg

Logo: http://www.rowan.edu/clubs/aephi/pediatric-aids-foundation.gif

Payment screenshot: www.pedaids.org

All other images are personal photographs taken by myself or friends at previous Phi Hoops events.

Week Thirteen | LaSorsa

The Apple website provides a perfect example of web hierarchy. The top toolbar lists the main sections of the Apple company including Support, Store and iTunes. These categories are on top because they are the first step in filtering all the information the website provides down to one specific thing a person is looking for. Once a category is clicked, the top scroll bar shows all of the items available. For your convenience, Apple supplies a picture and the name (just incase you are unaware of either). The main advertisement in the middle provides the latest news, depending on the subject of that certain page. If all of that does not allow you to find what you are looking for, there is a search bar on the top right. This website is very easy to navigate and does so well because of its visual hierarchy.

Week 14 - Schwartz

This is a good example of visual hierarchy on a website. This site is designed in a visually appealing way because the images at the top attract your attention, and your eye is then drawn to the text and links on the righthand side. The eye is led throughout the page in a systematic way. The headlines are bigger than the body text, so it is clear what is important to look at first. The site is set up in an easily accessible way.

Week 13- Mikaelian

The Syracuse University website is an excellent example of hierarchy. It is obvious that there are 4 vertical grids, the middle one being made into one double-sized column. It also uses the grid effectively to separate the information being shown on the website, and to lead viewers to where they need to go. The site is also effective because the picture at the top of the page catches the readers attention. This picture is also where the links to the most commonly sought-out information is, so people can easily find them. The colors- orange, white and gray- are also effective because they're clean, but also grab people's attention. The orange type used for headlines makes people read them, And the different shades of gray effectively separate the white boxes, making it easier for viewers to tell where certain information starts and stops.

Web Hierarchy - Seo

Web hierarchy determines how content is well organized on the website and provides convenient tools to find the information for people. Goodmagazine.com is a great example of web hierarchy that has an excellent website structure and visual aspects. The navigation bars which are very noticeable and it has many categories for people to find the information they want to get. Additionally they have consistency in use of color which the light blue color used in both for their images and contents. The typeface of the body content is Arial which is easy for people to read. The images and contexts matched well that images do not distract people to read the information.

COHN- Magazine Post

For my magazine layout it was hard at first to decide where to place pictures, being that the story was about two new stadiums. At first I wanted to put two pictures of the old stadiums the Mets and Yankees played in on the cover but it looked awkward and too crammed. I decided I didn't need pictures of the old stadiums so I got creative with the new stadium pictures. On the first spread I have two pictures of the facade of each stadium facing inwards towards my deckhead, with plenty of white space above for my headline. Then on the second page I put two inward facing pictures of the inside of each stadium, sort of welcoming the reader to the new stadiums with the text. For my text I used Futura because it felt new and fitting for the new stadiums. Because of the amount of images I put in the article I kept my text more traditional by using Times font. My sidebar fits in well with the story because it is about the really expensive ticket prices which is mentioned throughout the article.