Msc Final Project

Lay out

alpha_layout login&page design

The first picture above is my alpha homepage layout draft. Its inspiration comes from dribbble and behance. Because this is a texture sharing website, so the navigation and sidebar should be inconspicuous and  the part of texture gallery should be highlighted. While when I put this draft into practice, I feel the homepage is more or less not so interesting. As TEXTUR will be a niche site and mainly face designers. Then why not make our index more artistic?

So I prefer the second draft below, its inspiration comes from: http://thedrawingroomcreative.com/ .

beta_layoutI examined how these divs work, they all rotate -45 degree. And the width and margin of them do cost me a few time to calculate.

 

CSSprocessAbove is the nearly accomplished draft. When I add {display:none} to the unwanted green cube, the last green cube(23) appear in the unwanted cube position. To solve this problem I use {background:none} instead.Bingo!

 

css rotate

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s