vanessaPaugh

Friday, September 13, 2013

Proposal Final Site Pages

I finally posted images of the pages of the final site.

Summary

Geometry

Texture

Lighting

Assets

Color

Tuesday, November 11, 2008

Summary

The color palette for the bridal salon virtual environment will consist of three main colors. I will use magenta, brown and gray as base colors and white and black to supplement them. This color scheme is a modification of split compliment of magenta, orange and cyan, using a gradient of magenta, a dark shade of orange and a cyan that is desaturated to gray.

There will be several shades of magenta and gray. The gray shades and the brown were drawn from the the wedding gown illustration logo. the magenta was drawn from one of my other research sites on a similar topic.

Two tints of magenta are being used for the striped background in the header. A magenta to white gradient is being used for the glassy look on the navigation bar buttons and a lighter gradient is being used for the button rollovers. A dark shade of magenta is being used for the logo and a flat tint of magenta is used to distinguish the sub-content form the main content.

Tints of gray are being used for the page background, the border of the main section, the border of the page name division, the tag line of the site and a gray to white gradient is being used in the footer.

The logo illustration has several shades of brown and one of them is being used for the main headings and body text. The background of the page name, the main content and the body text are white for maximum legibility.

Sunday, November 2, 2008

Proposal Site Texture

Summary
For the bridal salon virtual environment Web site, I will use a small version of the wedding gown illustration that I have on another research Web site as a logo. This image will provide continuity between the sites and set the wedding oriented theme.
The texture will reflect Web 2.0 style with layered glass buttons in the navigation and a gradient in the footer. It will have the simplicity, the wet table look, the fine striped background, the big text and open space of Web 2.0 style in the header.

Monday, October 27, 2008

Proposal Site Typography

Summary
For this site, I chose two fonts. Penshurst is a specialty serif font that I will use, in different sizes for the site ID, the page name and the major headings and the sub-heading links. The other font will be Verdana, which will be used in a normal style for the 12 pixel sized body text and the 9 pixel sized footer text and bold for the button labels.

Examples
I chose Penshurst for the logo to exemplify the wedding oriented graphic identity of the site. I chose it for the headings in order to add a very feminine character to compliment the content of the Web site. Penshurst is the primary font in this entire font-family: Penshurst, "Trebuchet MS Italic", "Verdana Italic", sans-serif; I chose Verdana as the primary font to provide the maximum legibility in the areas in which visitors need it most. This font-family: Verdana, Arial, Helvetica, sans-serif; is for the navigation and the body text. The site metaphor is a research paper, which would normally imply the use of Times New Roman serif font that is prescribed by the MLA style guide for print legibility. However, since maximum legibility on the Web is provided by Verdana, a sans serif font that was designed specifically for the screen viewing, I substituted it for Times New Roman.

Sunday, October 19, 2008

Proposal Site Layout

Summary
The layout of this site will use a six column, grid-based, fixed width design with the standard sections on each page. There will be a header at the top and horizontal navigation under the header that span all six layout grid columns. The content area will contain two data columns that span three grid columns each. The footer will be at the bottom and contain three data columns, spanning two grid columns each. Elements on every page will include my logo, my name, the name of the site, the copyright information, the name of that page and the navigation menu.

Influences
Some Web sites that have influenced my layout are:
http://www.webdesignfromscratch.com/current-style.cfm
http://f6design.com/journal/2006/10/21/the-visual-design-of-web-20/
http://www.templatemonster.com/category.php?cat=102

Metaphor
The metaphor for this site is a research paper. I chose a research paper metaphor for several reasons. First, this site contains information that I found while preparing to design a virtual environment level for a graduate course and I want to maintain that kind of tone. Second, I want to continue research on wedding oriented games when I graduate and I would like this site to become part of a larger Web site that showcases all my bridal themed research. I would like my site to reflect my research interests and still have an academic look and feel. In order to achieve this goal, I am going to use CSS instead of Flash, so that the site will seem more static and therefore more established and credible.

Tuesday, September 23, 2008

Proposal Site Interaction

Interaction Summary
The interaction for this navigation needs to do two things. On the one hand, it needs to allow the visitor to access the main areas of the site as they were organized in the original level plan. On the other hand, some visitors will want to view all the content of each building in the level in a sequence.
The menus and buttons on these sites inspired me:
http://www.enicola.com/
http://e-lusion.com/design/menu/
http://www.templatemonster.com/website-templates/12251.html

Interaction Modification
The navigation on these sites inspired me.
http://www.icemanmma.com/
http://www.southeastindustrial.net/
http://www.newark1.com/portfolio/000150.html
After consideration, I have decided that the main menu bar will be horizontal and be positioned near the top, just under the title image. This is similar to ice man.

Interaction Functionality
I will use the primary navigation and the sub-navigation will be to support random access function. The main navigation will be horizontal and the sub-navigation will be vertical. The main buttons will be

rectangular in shape and the oval in shape and both will have rollover states. They will all have a Web 2.0 style. In order to perform a specific directional function, I want to provide a secondary set of navigation, within the main content area. This will be comprised of four arrows: right, down, left and up. The visitor can use the right and left arrows to stay in the same building category while moving to the adjacent plan category. The visitor can use the top and bottom arrows to stay in the same plan category while changing to the next building category.

Wednesday, September 17, 2008

Proposal Site Structure

Site Structure Type
The type of site plan structure I intend to use is hierarchical. This is a link to the type of site plan I am using.
http://www.smartdraw.com/tutorials/software/websitemap/tutorial_02.htm

Site Structure Summary
The hierarchical style of site plan fits my site because there will be main pages for categories and other pages for topics within those categories. All of the categories will be accessible from the home page. There will be pages for the categories, and for the sub-topics. Including the summary page, there will be nineteen pages total.
Summary
Bridal Salon - Interior Exterior
Geometry
Texture
Lighting
Assets
Color
Ballroom - Interior Exterior
Geometry
Texture
Lighting
Assets
Color
Wedding Chapel - Interior Exterior
Geometry
Texture
Lighting
Assets
Color

Summary
	Bridal Salon		Ballroom		Wedding Chapel
	Interior	Exterior	Interior	Exterior	Interior	Exterior
Geometry
Texture
Lighting
Assets
Color

Site Structure Details
The requirements for the Bridal Salon Virtual Environment Level Design Proposal included several topics: Summary, Geometry, Texture, Lighting, Assets and Color Palette. The pages in the original site correspond to these categories and they worked well for encompassing the aspects involved in designing the level. However, since the site is complete, I would like to shift the focus of the site slightly toward the process I followed and away from my plans. This way I can use more of my own images and less copyrighted material. The text I wrote illustrates my research abilities and the screen shots of my work illustrate my level design skills.

The original site had a section on the common exterior, the Bridal Salon exterior, the Bridal Salon interior, the Ballroom exterior and the Ballroom interior on every page. There were no sections on the interior or exterior of the Wedding Chapel. In order to take advantage of the hypertext capabilities of HTML, I would like the new site to include a structure that allows easy access to cross-references between the buildings and the design descriptions. For example, I want a visitor to also be able to follow the design of the Bridal Salon through the geometry, texture, lighting, assets and color palette. The structure should allow the visitor to chose the navigation process from the summary.

Wednesday, September 10, 2008

Proposal Site Content

Summary
This Web site will include pieces from the research based hyperlinked site that I organized in 2006. It contains extensive information, in the form of html pages, but no visual design has been applied to it. The site outlines the research I did on the Regency Era and Bridal Salons for a Virtual Environment Level Design Proposal.
There are three main problems with my current collection of content. Since the site was created for a class, the HTML pages were not designed to be hosted on the Web. The page contain images, for which I do not own the copyrights and direct image links. I need to use proper hyperText referencing for any images that I still want to use.
The second issue concerns the fact that the Bridal Salon Virtual Environment has been completed since the proposal was submitted. In the finished level, I also modeled a Wedding Chapel. I would like to include screen shots of the chapel in the site. I intend use other screen shots from the level to replace as many of the other copyrighted images as possible.
The last problem is that I have two other sites with complementary content. One site was a showcase of my MFA portfolio and research prototypes of my wedding-oriented chick clicks. This site has a specific style with elements that I carried over to the other site that summarized research I did on the feasibility of a Jane Austen based computer game. I want all three sites to have a similar look and feel, and yet have their own unique aspects. In addition, I want the new site I am designing to incorporate some new trends and CSS techniques, instead of being based completely on Flash.

Images
The images I have all relate to bridal salons, wedding fashion, Jane Austen, Regency Era architecture. Topics that contain copyrighted images need to be replaced from the current site:
Regency Era Architecture
Regency Era Fashion
Jane Austen
Common Environment Exteriors
Bridal Salon Exteriors
Bridal Salon Interiors
Bridal Salon Furniture
Regency Era Building Exteriors
Regency Era Building Interiors
Color Wheel
Interior Color Examples
Exterior Color Examples
Missing images:
Color Palettes for the Bridal Salon, Ballroom and Wedding Chapel
Wedding Chapel Exteriors
Wedding Chapel Interiors

Text
The text on the pages will describe the research I have performed on the bridal salon, ballroom and wedding chapel virtual environment.
The text on the Bridal Salon is written.
The text on the Ballroom is written.
The text on the Wedding Chapel is missing.

Thursday, September 4, 2008

Proposal Site Overview

Summary
My overall goal in this project is to design a Web site that can showcase my passion for wedding fashion, my research on Jane Austen and my interest in designing computer games for women in a cohesive manner. I have this goal because I would make virtual wedding fashion interfaces for Jane Austen computer role playing games, if I could do anything for a living. In order to ultimately reach my career goal, I would like the initial audience of my site to be wedding themed Web site companies, academic search committees and female-oriented game development companies. Through my research for this project, I have found that I can appeal to Web site designers through a polished layout, to educators through the quality of the content and to gamers through a positive interactive experience.

Content
This Web site will incorporate all aspects of my research on virtual wedding fashion for Jane Austen style computer role playing games. After viewing many wedding themed Web sites such as the Knot, David's Bridal and Vera Wang, I decided that I wanted to focus primarily on fashion and secondarily on architecture as a backdrop.

Structure
Using some function based Web sites like Amazon, MSNBC and UT Dallas helped me to become very aware of how important the site structure is. I want to make sure that visitors are able to find any specific piece of content they have in mind and get a feel for the breadth and depth of the content on the entire site without exasperation.

Interaction
The navigational elements will be created in Flash. The mode of navigation between pages will be buttons with single word text labels or icons. They will have subtle rollover effects to increase the usability factor. The content will be broken into less than seven categories, which will require a main set of navigation and sub-menus. Examining some Web 2.0 Web sites: The Font Feed, Pixel Acres, Web Design from Scratch inspired me to use navigation buttons with the coolest rollovers, big text and candy textures.

Layout
In terms of graphic design, I have recently settled on a particular style. My favorite media style is a glossy fashion magazine like Glamour or Bride's or Vogue. I want my site to reflect the slick look I love of the latest high fashion clothes from the Paris runways worn by the tall, thin, elegantly made up models that would look good in even in plastic grocery bags. I looked at template monster, A List Apart and Zen of CSS Design and other Web designer's Web sites, which made me want to incorporate CSS in the basic overall layout. However, I will include Flash elements because I prefer to use it in my career.