Wireframe

wireframe research.

I have been looking through different website and was able to come with the new modified sitemap.

Possible colors for MIT

red red red red red
black black black black white
orange orange

I found some of the examples for different tab options
1. http://www.templatesbox.com/data/premium.templates/images/flash/flash.preview/11791728687ZT/index.html

Sometime like this is also nice and cool
2. http://www.templatesbox.com/data/premium.templates/images/flash/flash.preview/1155047014PaK/index.html

Colors and Background

This website has many sample templates that are well-designed. Look at different samples to see how colors play in webpage.
http://www.templatesbox.com/

This template is a good example of coordinating red and black color.
http://www.templatesbox.com/premium-templates/website-templates/template374.htm

Notes from chapter 4

What is Design?

• Figure-ground, contrast grouping, proximity, similarity, continuation, and unity provide the structure of elements such as point, line, and plane, or shape, color, texture, and space.

Design and Perception

• Gestalt theory: perceiving of an object as s whole is greater than the sum of its parts. èprimary reason that the designer’s primary objective to create unity.

Point, Line, and Plane

• A point is a smallest elements on the page regardless of its size
• A line is a mark whose lengths are greater than its widths.
• A thick line can translate into a plan.

Space

• Referring to both the illusion of depth and physical space in which designer manipulate compositions.
• Overlapping is good example of illusion of depth.
• Transparency and overllpaing two forms can create an illusion of space.
• Good sites to check out:
• www.enspace.com or www.pointinspace.com

Unity and Variety

• Unity is the presentation of a unified image. èCongruent relationship between type, graphics, and shapes.
• Ways to Achieve Unity
• Proximity
• Repetition
• Continuation : planned arrangement of various forms so that their edges are lined up. Grid determines page margins and divides the format into areas used.

Emphasis, Focal Point, and Hierarchy

• Focal point: starting point in the design and it is the prominent place in the hierarchical order. Isolation and value draw attention to design.
• Usually is the company’s name
• Hierarchy is the order in which users see things on the page.
• Determined by the importance of each elementèhow we define it.

Contrast: visual opposition

• Positive and negative space è fundamental components of contrast
• Heighten the overall visual effect.
• Size is the basic and most frequently used form of contrast in design.

First Version of SiteMap

This is the first version. The second version will be updated shortly.

Helpful websites for Layouts

Useful resource for checking out the designing layouts and fonts
http://websitetips.com/layout/

Progess on Site Map

January 31, 2008
Here are possible websites to check out for tabs and backgrounds:

• http://dev.portalzine.de/index?/Horizontal_Accordion
• http://www.stgeorges.edu/Default.asp?bhcp=1
• http://www.silvertipresort.com/
• http://na.blackberry.com/eng/
• http://www.yellowstonepark.com/

February 3, 2008

I looked at different pages and compiled a few tabs for the MIT page. I created one hypothetical layout page in Microsoft Publisher to give me an idea how each tab or page transits. The other one is the site map created by Microsoft Visio. The site map contains only general pages that could possibly be added to the MIT website. The site map does not include hypertext/hyperlink transition within each page. Further modifications are needed!!!!