Wireframes

We have each team member be responsible for different sections of the website, so that we can get several ideas and choose among those. Below you will various samples. The complete click-through version of our wireframes is in HTML. It is being used to discuss terminology /labels, as well as content and organization decisions with our client. Check out the click-through wireframes! We will continue to update the content in the wireframes as we receive more of it from our clients, using the wireframes as a tool for content development.

Sample 1

Key idea: an online news portal approach to recent news stories that lists the headline, some text and perhaps an image.

Wireframes: News

 

Sample 2

Key idea: some pages might require a list of anchor links in addition to the global and local navigation.

Wireframe: Subsystems

 

Sample 3

Key idea: adding imagery to supplement primarily textual content. For some pages the reverse will be true because we have the imagery, but textual explanations might need to be added.

Wireframes: Team

 

Sample 4

Key idea: Because the project will release some documentation after the competition is over, we have created a documentation section that will be relatively light for a while, but serves as a useful placeholder for the anticipated additions.

Wireframe: Documents

 

Sample 5

Key idea: The intranet will display data in table format, potentially with the capability to sort by different columns.

Wireframe: News Stories

 

Sample 6

Key idea: The addition of content and upload of documents will be handled through forms.

Wireframe: Add News Story

 

Sample 7

Key idea: splitting the content based on how technical it is, so that the general public does not wonder into technical and off-putting sections of the site. This was an early draft used primarily for brainstorming and preliminary group discussions.

Sample 1