Final Necktie Collection

Here are a few rollover and activation states of my final collection design that, is sadly to say not uploaded to my server space due to difficulties with my connection and computer. But Here are the 3-4 different navigation/sorting states that it is in. These are direct screen shots from my flash and swift files.

Final Collection Design

From the feedback of the last critique, I have had some layout and hierarchy issues to deal with. This revised design eliminates the bottom navigation bar, I think that was a problem of giving me less web realty to work with. This new layout has 1 macro and micro view with color coated rollover sorting indicators. Each detail of a tie consists of a brief description and a coordinating infograph about neckties. I think the limited palette puts tension on the information and gives hierarchy to images and educational text.

Info Architecture: Collection Final Design

Final Design for All Tied Up.

Collection Progress

Here are some stylistic and layout changes for my collection site as well as all of my photography is done for the 16 neckties. Mo sent me a few inspirational packaging designs that helped with the tightening up of my own designs. there are a few iterations for the navigation bar, which is an easily comprehensible navigation way finding system. It shows where you will go, have been, what you'll find, etc. This sophisticated classic look has taken over my design in a good way; I think this new layout and aesthetic approach relates to the stereotype of the true gentleman that we all idealize about.

Final Design Direction

My final design came from the influence of fashion photography and the layout came from the tie bars that cut right across the necktie from the left. A simple horizontal view and color coating with subtitles  shows an easy navigation and categorical view of the collection. The macro view shows the individual tie, a brief overview and a supporting infograph of tie information.

I am still editing and image correcting my collection. So I am currently using the same tie image to represent the entire collection.


Landing Page

Sort View

Macro View

Collection Site: 3 proposals

Here are my three proposals based off of different elements of my wireframes. They include different variations in sorting methods, layouts, pages, and mouse states.

Proposal #1

Proposal #2

Proposal #3

Info Arch: Image Rendering

My image making tests comprise of vector icons, photo-shape masks, multiple perspective and cropped images, direct photography, in context shots, color tests, and illustrative styling. Each document below shows an individual tie tested in many ways to promote the best experience.