Interaction Design

Like I’ve said before, I have made a lot of changes throughout this project… but defiantly for the better.

My site structure hasn’t changed much from when I started a month ago, but the idea of my site has grown a lot. This site has one master page and stays constant throughout the site, but continues to change within the content area. So instead of structuring the whole site, I kept my mind focused on how each content page would function within itself and the site.

Keeping myself restrained has helped my creativity reach a whole new level. I’m excited for this site to be up and running in WordPress.

Sticking with a 12 column grid was important to me, because it kept my ideas simple

The wire frame was very helpful and is described in more detail in the style guide PDF

I’ve learned a lot from putting this assignment together. The style guide truly helped me realize how much goes into a site, and how much we can miss.

Here is the style guide PDF. My Complete Style Guide

I went through a lot of trial an error, as most of you probably did, but I think I found a happy medium. The Photoshop mock-ups were my greatest strength and get me out of a lot of rough spots. I couldn’t have gotten to the place I am now without working on them. I wanted to put my work in to WordPress, and tried hard to get it up. I got my main page posted on WordPress, but in order to fulfill the requirements of the assignment, I did the rest in Dreamweaver.

Here is my WordPress link to my homepage. www.paradigmredesign.com/wordpress

On the other hand, I want you guys to see how the links work. Here is my site that you can mess with some links that will work. (note: not all the links work yet, but enough to see how the site flows) www.paradigmredesign.com

I’m gained a better understanding of web design in this day in age and I have learned a lot from people around me. You have truly given me a higher respect for the industry and I’m excited to progress in this field.

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.

homepage, focus on the s.e.o. paragraph

design portfolio page, outside pages

design portfolio, inside page of a specific assigment.

This is a revamped version of several of my website’s pages.

my index and homepage layout

here is another sidebar idea, i'm still working on what is more directive

for each of these portfolios pages are going to work for both portfolio sections. (design and photography for example)

when someone clicks on a sub-buttom on the sidebar

when someone is on a specific projects page, it will give them an option of looking at several speads, or other shots.

Typography should be the most important part of a site. Because of the limitations of font choices online, I was very careful about staying within those choices for the main content along with any of the navigation buttons in order to allow and easier S.E.O. or search engine optimization.

I will use Georgia as my sidebar font, along with my main content. The entire font family will be used with bold, italic, and regular. Verdana is my san serif font that I have chosen. This is used as a top nav font along with any search result headers. I am making sure that the amount of fonts in limited to avoid irritation and confusion. This site should be easily navigated and beautiful. I’m very excited.

My Logo

The logo I have created is a serif font that has been kerned very tightly, but has been created as a single image. I have a warm color pallet for this logo and site, which is pleasing to the eye.

i think this logo color might just work better with it subtle color

DallinGMillard's logo

Looking back at the objectives, I feel that the purpose of this site is primarily for that target audience to look at the work i’ve done throughout my career as a graphic designer and photographer.

My images are all going to be layout the same way throughout my site with a drop shadowing on a white background. Going from brochures and booklets I’ve designed from photographic portraits to posters. Some examples will be posted here. I didn’t want anything distracting as they are searching through the site. It also helps it to have a clean and professional look, which is something i want.

As someone chooses a particular image, it will open to a screen that allows them to see multiple examples of the images. For example, if they were to open an images of a brochure, when they click the image, a page will open with several spreads of the brochure. This will happen in other areas of the site, such as a portrait of someone, or a specific assignment with multiple images.

An example of a portrait in the photography section. There may be more photos of the particular person, depending on the shoot.

a panoramic image for photography section. As you can see with this photograph, it has a different layout but have the same border and colored background.

a brochure in the design section. This booklet will be displayed as the cover and when that image is chicked on, it will open up its own page with selected spreads such as this one.

At first the gray box was difficult because I kept trying to work with my color. I ended up making a gray box and a photoshop mock up… kind of.

Looking at my sketches, I got to a point where two of my biggest ideas needed to be conbined into one to create my site. I took serveral of the layout ideas from one and intigrated it into a few of the color/design ideas from the other. Putting my site into a more dynamic idea has been difficult for me to grasp until now. I had done a lot of research of blogging sites and personal site in order to see how it could benifit my own site.

i personally like the subtle colors better now that i've thought it through a little more.

I added color to my graybox to give a slight idea of what direction i want to go

this gray box has a basic home page idea that i've come up with.

Figuring out how I wanted my site laid out was a challenge at first, but came very quickly after my sketches. There were several sites I looked at in preparation for this step (which will be posted soon) and I feel things are coming together.

Some thoughts on the wire frame: I wanted to make a top navigation be along the top of the browser window with the main header below that because I always catch myself going there if I’m lost in site. I want that to be a safety net for anyone who visits my site. My sidebar will be a more specific navigation, creating a simple overview. (more to come with the gray box)

creating a wireframe was just teasing me, i wanted to jump into the gritty stuff.

I found that as I was researching different personal websites and design sites, that there was a lot of flash involved. So, using the different ideas I had, I just focused on my skillset and also to help the viewer easily follow the site map.

These were my main ideas

some process of a site structure

some ideas just being thrown around.

There are many ways I saw the site. It is kind of difficult to see these sketches without a color pallet. That will be my next step in the process. I will soon put together some sort of wire frame directing to each of the different layout pages.

Throughout the process of sketching, the idea of both a sidebar and a top navagation have crossed my mind. I think it helps the viewer to feel a little safer in regards to knowing where they are. I am stick throwing the idea of a scrolling page or whether most of the page will be seen in the window.

As I have been sketching and planning what I want my site to be, some objectives were set. One of the things that I want this site to do is to be easily navigated and express to the visitor my variety of skill set.

I will allow my site to be a portfolio for my design, photography and advertising works. It will also have a blog, to discuss different aspects of design, as well and allowing a way to contact me within my site. For each portfolio section there will be information about the work and shows an image of it.

This is the site map and how it will be navigated

My target audience will be a wide range of those who will visit my site as a potential employer as well as those who are just wanted to see how certain things work. I will have a wide range of work, and depending on their interest can see specific aspects of the site. For example, if they are interested in portrait photography, they can read about it on that part of the site.

With all these parts being implemented, I hope to build a strong image that will allow me to gain credibility in the design world. This site should be pretty beefy and will give the visitor a wide assortment of pages to visit so they can learn all they can about me and my work.

Site Map Better Understood:

When i was getting my site figured out, I found that this site map made more sense to me.