Friday, October 19, 2012

Post 24 - Site Examples 2

More of my websites provide some general inspiration, and some new ideas.
 
"Think Geek Site"
I notice the general set-up actually has 3 body areas. The set up has it in a sort of symetrical design, and that works here. I will say the right should be level with the left, but that might make it weird.


"Blastr Site"
While it can't be seen here, there's not alot of focus on the header and navigation. Moreover, the navigation seems oddly placed. The body area seems about right.

Of the two, I can see taking some design sensibilities from the Think Geek site. I like the small areas that show the background on the upper areas of the left and right body areas. I may add that to my final design in some sense.

Post 23 - Navigation Bar Examples


I'm aware that when it comes to navigation bars, the most important thing is to make sure they don't look like buttons. Button navigation bars go back to the early designs of the internet, and that is something that has to be avoided.

I found a few different examples that avoid that.
 
 
"Example 1"
The general design here is a bit odd. The area above the navigation is weird and serves no real purpose, but it's alright.


"Example 2"
I really enjoy the simplicity present here. It's not distracting, and it does what it needs to do. They almost feel like folder tabs, but not in a bad way. I might use a similar design for my website.
 
 
"Example 3"
This one feels like a singular object, but the highlights are an interesting idea. It gives it a feeling of depth, but not in a way that it would get distracting.

Of the 3, example 2 is my favorite. It isn't flashy, but it's functional, and sometimes, that's enough.

Post 22 - Site Examples

I decided to look at some of the sites that I normally visit to get a good idea about general site structure. From taking the advanced web class, breaking things down is much simpler.
 
"Destructoid Site"

 The general header has been combined with the navigation, and the logo on the left may very well be it's own object. The main articles take up a majority of the left area, and the right is reserved to advertisements. it's a general set up, but it works.

"IGN Site"
IGN has a more general set-up. The Header and Navigation bars are their own thing, and go across the whole page. The body area is centered, with the left side taking up more room.

I've gathered the left generally takes up the most roonm in these situations, and thats understandable.

The left is where the eye generally travels, so thats how it works.

Post 21 - Site Sketches 1

With designing my website, creating different ideas was easier than I thought. My first crop ideas are presented below:


"Concept 1"
 
 
"Concept 2"
 
 
"Concept 3"
 
"Concept 4"
 
 
"Concept 5"



 I find that I like bits and pieces from each individual design I've done here, but my favorite so far would have to be number 10 of the group.

I remember while I was searching, I found a site that went with different design choices when it came to designing the header. I would very much like to incorporate that design idea into my final design in order to do something different. Am I confident it will work? NO.


Post 20 - Project 2 Thoughts

Project 2
CGR 257 – Advanced Web
Project 2

Web Site

Project:
Create a website for Ocha Green Tea. The website will establish our brand on the internet. Be sure to create sub pages for: Products, Events, History, Contact Info, and FAQ. The copy for the site can come from the internet or you can use Lorem Ipsum. Focus on the graphics and layout of your page. Consider who is viewing the page and market it accordingly. Design the page to look good on monitors that have a resolution of 1024x768. (955x600)
Objectives:
Discover new ways to market your product and continue its image. Know how to layout a company website and continue a brand on it.
Thumbs Due: Sept 27
Project Due: Oct. 11


I feel that with this project, there will be some overall difficulty with getting it off the ground. In the past, I've had a good amount of difficulty getting my projects to work properly, and this is no different.

The fact that I have to match it with the overall feel of the logo and aim for my target audience is another thing. More often than not, what I make in illustrator is vastly different than what I make in Dreamweaver, so I'm fairly nervous.

Post 19 - Final Flash Logo

"Ocha Logo Animation"
Overall, I'm happy with how this turned out overall. While it is true that the actual animation for the logo is much quicker, I think this gets my point across.

I did have to make some changes to what I had originally. The Ocha and Green Tea portions were color swapped because when the Green Tea is made as the darker color, ther'es proper weight distribution in the bottom of the design. Had it stayed like I wanted originally, it would have been top heavy.

Post 18 - Favorite Logos

I've read alot of articles on the internet, and my overall favorites are mostly video game oriented logos:
 
"IGN Logo"

This logo is very simple, and it also has a subtle nod to a video game controller pad in the symbol present. I will say I could do without the two tone of the lettering, but beggars can't be choosers.


"Kotaku Logo"
I like how this is just typing. Most logos focus on a symbol of some sort, but not this one.

The lettering also has a sort of japanese feel, since Otaku is present in the word itself.

I could do without the quotation marks at the end, since they're just at the end. It feels weird for them to be there.
"Blastr Logo"
This is another one that just has type. It's extremely simple in it's design. Unlike the Kotaku logo, the letters don't need to be stylized like they are there. The only visual thing it has goin g for it is the "r" at the end colored orange.

The orange drags your eye across the word to get to it, so it gets your attention and gets you to see the whole word in doing it.

I should try and incorporate that idea into my final design.