Goal
Lab archive Mock Up ideas to help players reduce page scrolling by up to 95%.
The new page layouts/views could be optional which would allow players who like the current page layout to continue to use it. The ideas are based on modified views of the current layout or having a new sideout menu. Current first page has a main lab content div length of 40832px which is very long.
A better Archive page view
Below is an idea for the Archive page layout with List view.
Click to view larger image
list view
This would be a useful option could be useful for people who don’t or can’t remember a lab project name, giving them a list to view which would be less than 95% in length then the current first page.
Using the current sizes of the lab description header, boxes would have a height of 64px with 15px margin between boxes. In the example image boxes the project Title, Data,
Featured by and if it was feature project or not using the same icon.
Current Archive page view
Below is an image of the current Archive page layout.
Click to view larger image
Click to view larger image
Above is an image of the Archive page layout with standard boxes.
Sidebar view
Another option could to make use of a sidebar. Which would increase the useable screen space without modifying the current centre content layout. The sidebar would be hidden until a player toggled it.
Below images show how the sidebar could be used with thumbnail image or Name list shortcuts.
Click to view larger image
Click to view larger image
Quart Double the amount of information on same space
The current Lab archive already has a number of boxes with a height of 462px as shown in Image A
Click to view larger image
Having an optional view using a standard box size height of 462px and keeping the same margin between lab descriptions boxes would reduce the current of the first page lab constants by 75%. Boxes would be expandable to still allow people to write a detailed description for their lab project.
Click to view larger image
The image above is to show the size comparison of a standard box (on the left) and an expanded lab description (on the right). Each lab description could be expanded via clicking on a button that would be hidden until a player hovered over the lab description.
Current view
Click to view larger image
Image A - Standard size box
Click to view larger image
