Info Arch: Site Layouts

This first layout scrolls horizontally--divided by three topics that paula and gordon discuss in their essays (educators, theory and process) that can be compared by looking at the outline above and below the navigation. Supplemental information can be accessed through some of the smaller tabs that branch off of the other ones, as well as within the bios.



Bios and essays can be clicked on through the name/title on the left, which will pull up a window with images and information.



And images that are hovered over will appear in color, then can be enlarged by clicking on them.



The next layout is more of a side by side comparison that starts with designer bios-- then by clicking one of the three tabs, you can compare and contrast points about paula and gordon's essays.



The reader can expand the information by clicking the tab that comes up and opening the next one. (Hovering over the information will put an outline around the tab.) Information can be compared and contrast through lines and colors. Supplemental information will also appear on the page, so that all the information can be accessed in one window.



The last layout is a top and bottom comparison again, except I'm thinking this one will expand vertically. (Not sure how this is going to end up working for the top one, but I guess I won't worry about that yet.) The user will start out with a sort of "blank canvas" before clicking the navigation and opening information for each section.



Which should expand them like so. Tabs that are hovered over will have an outline around them, and once clicked, will expand some further information on the designer's quote as well as keep the outline around the box. Text color would be based on the topic that was clicked on, so even when things began to overlap, the user would know what the expanded text was related to.



Hovering over the designer's name and title in the background will open up their bio or essay:



And the user can page through the essay from the "page" navigation on the bottom. (The darkest number is the page that the user is on.)



Supplemental information will be accessed through links in the information and pop up in their own information box.



After looking at this, I was worried that trying to fit all three essay topics on one vertical moving page might get a little tight, so I tried another idea where you would only be able to view one topic at a time. Color would be based more on which designer it belonged to as opposed to which topic it was related to.



And then supplemental information would expand in closer proximity to the designer's "side".