Interaction Design

This is a mock up of what my website looks like: i used a 16 column grid and several div tags in this mock up. this image is a good example of what it will look like.

I am not sure if I tagged this post correctly when I did it.

The post is title Photoshop Comps and I do believe that it is listed under my name.

I hope this helps

I went through 5 different mockups and I ended on this one. I still don’t like it though!

I don’t even like yellow that much. My favorite part is definitely the sidebar though. I love how subtle the change is when you hover over it. Width-wise, I think it may be a little small?

Please critique… I want to redo it.

This is it…

The photoshop file I’m trying to use as a guide for my website which I’m coding in dreamweaver.

My current Portfolio site mock-up’s. They are alot better them my first one’s these are a redesign,  but i am having a bit of trouble turning them into a website.

Here are some of structure pages that are guiding my design decisions.

[caption id="attachment_4423" align="aligncenter" width="300" caption="Wireframe of Portfolio page"][/caption]

The 12 column grid really helps keep proportion and positioning. I think next time I do a site that I will use the 16 column grid for more options. I had to remember to KISS.

I’ve made a lot of progress in the past couple of weeks on my site. I’ve figured out many things that will help me to complete my task, and hope fully get it up on wordpress in time.

From my original mock-up, I basically mirrored it. Otherwise at first glance it looks really similar.

But after the first glance You’ll be able to see just how much has changed (lots!)

Original Mock-up

Final Lay-out

In the original you can see my idea to separate content into separate but related columns, but I had glossed over the details of how they would actually work. When I got down to actually creating the website and seeing how I wanted the viewer to interact with the page I flipped it. It seemed to me that it gave a more natural flow from beginning to end that way.

The mock-ups that I created represent all of the pages on my site, even though I just have the illustration page, it will be a template for my design, Advertising, and web pages. I have also included my Home page which allows you to go to the different galleries, the About page which gives basic information about me and also where you go to download my resume, and also included what the blog page will look like.

I have made a couple changes to my site. Let me know what you guys think.

 

 

 

 

 

 

This would be my home page. It shows a couple of my recent projects and a blurb about me.

 

 

 

 

 

 

This is what will show up when people click on my portfolio page. They can look at all my projects in the graphic design section or click on photography or artwork and have that change also.

 

 

 

 

 

 

This is what the page will look like when someone clicks on one of my projects. I want people to be able to click on the smaller images and have them show up above in the bigger spots. 

 

 

 

 

 

 

This is what I am thinking for the about me part of my site. I really like picture so I decided to make it more interesting to put up a lot more pictures.

 

 

 

 

 

 

 

This is what I have so far on the blog. It needs some work but I am not sure what yet. Let me know what you think.