Stylish Web Design Template $300

[aspen]

(Admin code added by Palmer - 94834U)

I need a template for a new site I am going to make.

The title of the site is

"4 Web Templates"
"Your guide to web design on a budget."

It is a review site for web template sites. Like an hosting review site.

Anyways, I want a very stylish/colorful template. This site needs a really good/fancy design.

I want lots of colors with a plastic-y look.

http://www.boxedart.com/

Basically, I want something very similar to boxedart.com

Now some technical specifics.

The layout should be a standard left menu and top graphical header. I want a 100% width layout, so it needs to be able to expand based on resolution. The minimum width can be set at 780 pixels (or smaller if you want).

On the left menu I want graphical menu headers, and text based options below that. They need to be vertically expandable (I should be able to fit as little as 5 or as many as 50 text links under each menu option).

For instance on boxedart.com the "Affiliate Program" menu header is graphical, but the links below it are text. I want that.

In all aspects of the design, when using "4 Web Templates" it is important that there are spaces between the words. Do not run them together.

I'm going to need both a template and a raw unflatted psd file for this project. I envision in the future the need to add new graphical menu items and I'll need the files so that I can do this myself. So if you use a weird font for the menu graphics I'll need the ttf file.

For font styles I'm picturing something trendy and stylish. MTV - Like.

If you use stock art you best have the rights to it. Don't be stealing stock images, get them legit.

I would like the inclusion of content area "boxes." You know like area of interest boxes that coincide with the site design. For instance Boxedart has like 5 such boxes as their homepage content section. I don't want that, but the design for a single box would add some flexibility to the design that I could add later. So basically a content box that can expand easily horizontally or vertically. Any questions I can clarify.

For starters the left menu should have the following graphical headers.

Free Web Templates
Web Templates
Adult Templates
Custom Services
Logos, Mascots, and Site Elements
Free Art & Photos
Stock Art & Photos


There should also be a small footer menu to go with the copyright statement. About/Contact/Privacy you know what I mean. Just simple text.

[aspen]

Couple additional notes.

1. There needs to be room for ads. Atleast one of the following: 728x90, 120x600, 160x600. I'd prefer skyscrapers I think.

2. The left menu needs to be decently wide (160 pixels atleast).

3. The left menu graphical headers could be made with normal text on a graphical background. That way it'd be easy to add new ones. Your choice though. Also they should be able to be links if I need them to be.

[sparkie]

You know, if you're looking to have mascot design done through the site (and much better than what Boxed Art offers!), then I'd be glad to work with you on that end of things. :)

Good luck with your contest!

[aspen]

Thanks... but I'm not going to be offering any services through this site.

Think of it like a web hosting directory but for design and template services.

I'm not looking to resell services.. if that is what you were asking.

[zing]

I will definately try to enter this one! :)

Just a few questions...

1. For the left menu are those links you gave the headers? and we just leave space for text under each?

2. Is this any particular colour which you would like to see used any more than certain others?

3. Do you just want the left menu with no top menu at all?

4. Can you provide a logo or do we just install a filler?

5. In the header do you want anything like a login box? Otherwise it may look a little sparse with only a logo...

thanks, I will start work ASAP :)

[aspen]

1. Yes
2. No
3. Yes
4. I don't need a real logo, I'm expecting you to come up with a graphical representation of the site name.
5. No login box. It could be a place for an ad though.

[zing]

ok thanks :) I'm very busy today but I might try and make a start on something later tonight...

[_firstwave_]

here is a concept. ive created a really plasticy colourful effect as required like boxed art. Ive have left room for a banner underneath the header . but let me know where you would like to see a banner.

also unsure if I have got the left navigation right from your instructions. does each link have its own menu?

let me know if this is in the right direction and if the style agrees with you!

hope its ok

[aspen]

You get an A for plastic colors.

The menus are wrong though.

The list I provided is a list of menu headers.

The actual menu should look something like this:

Free Web Templates
-freewebtemplates.net

Web Templates
-templatemonster.com
-boxedart.com

Adult Templates
-adulttemplates.com

Custom Services
-designoutpost.com

Logos, Mascots, and Site Elements
-ascotartist.com

Free Art & Photos
-istockphoto.com

Stock Art & Photos
-corbis.com

Get it?

The subtitle at the top had "on a budget" cut off.

The center content bubble I'm not a fan off. I was thinking more of a plastic outline with a fancy top but then pretty simple walls. In function something like the right side of the homepage of duenow.com (recommended papers) but much more fancy. I basically want a simple design for a box that can serve as an area of interest to draw the user's eye. The sides can be simple, and I want the top be similar in style to the top graphical header. Like the top header's baby brother.

The "baby box" should be able to expand horizontally and vertically as I need it (just like the overall design).

I've attached a very rough mockup. The top header and left menu can be connected or seperated. I don't care.

[_firstwave_]

ill rework the template. I was just putting out some feelers as I was unsure on a few points ;)

[zing]

does it have to have three columns as in your template? I thought that you just wanted two...

[aspen]

2 columns, but a floating area of interest box.

[sparkie]

Hi Chris,

Thanks for your reply. I'd be happy to be listed as one of the sites rated/reviewed then :)

I might enter this contest if I get a chance.

Thanks again,
Sherice

[zing]

hows this? :)

[aspen]

You got the layout right. The menu layout and the side box on the right look good.

However I prefer the colors/bubble-plastic of firstwave's design.

Also the subtitle is "Your Guide to Web Design on a Budget."

[zing]

I can change the sub-title easy enough :) Any specific changes that you would like to see?

[aspen]

Different colors, a more "plastic-y" feel.

[zing]

do you mean for the various boxes to be different colours for each box? also I'm not exactly sure how to create the plasticy feel that you want more than I already have. I suppose that a greater contrast between colours used (e.g.: on the boxes darker shades of orange and lighter shades...) This is just a style that I am not familiar with...

[aspen]

There is an e-plastic tutorial on phong.

http://www.phong.com/tutorials/eplastic/

The boxes do not need to be different colors. I just want different colors. Your blue is like an aqua blue and I'd prefer a darker blue. I also would like to see some greens or reds.

[JeremeDavid]

I wanted to see if you like my plastic style before I invest the time on a whole template.

If you like it, I will work out the rest of the design.

[aspen]

I like the plastic style. Not a fan of the font.

[Anne]

Here is my entry.

Looking forward to your feedback.
/Anne

[aspen]

Sorry anne, all I see is a broken image.

[Anne]

It's fixed now.

[aspen]

Anne I like the logo you did. I like the top header. Overall the plastic look is good.

For the boxes (both left and right) I think a little stroke would make them look better. A small border between the solid color of the box at the white of the rest of the page.

For the right interest box I want a white interior.

Overall the colors seem very segregated. I also prefer the slightly darker colors of firstwave's design. Perhaps one way to make things seem less segregated would be to connect the header/left menu/footer.

I don't need each color represented equally. One or two main colors with small amounts of the others is fine.

Good start though.

[Anne]

Made some changes.

[aspen]

Much better anne.

What about making the top logo blue like the bottom logo you put in the footer?

[Anne]

Here is the logo in blue. Let me know if you want to se the template with more content.

- Anne

[_firstwave_]

here is a revison to my first submission! it has a subtle blue background I can submit a version with a white background if you want?

hope you like it!

[aspen]

Looks good. The top header and especially the logo could use a little more detail/visual interest.

The top menu buttons are quite large. They do not need to be so large (they're not the most important things on the site) and they might look better right justified.

[_firstwave_]

hows this? ( I think ive fallen in love with my own plastic :P )

[aspen]

That looks good.

The only change I'd have is to remove the ".com" from the title and copyright.

Also, would it be a problem for you to include a variety of colors for the right content box assuming you win? Colors that match the menu colors.

[_firstwave_]

Hi aspen,

I cant see that being a problem at all :)

[DesignGeneral]

I'll have something today :)

[Palmer]

<!--QuoteBegin-aspen+Apr 14 2004, 11:41 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (aspen @ Apr 14 2004, 11:41 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> That looks good.

The only change I'd have is to remove the ".com" from the title and copyright.

Also, would it be a problem for you to include a variety of colors for the right content box assuming you win? Colors that match the menu colors. [/b][/quote]
Can you remove Design Outpost from the Adult Template category as well :rolleyes:

[_firstwave_]

lol .. so u not opening the new adult board then palmer ;) ill re-upload!

[DesignGeneral]

Hi there,

Here is what I have so far.

Let me know if I'm on the right way.

Thanks

[aspen]

That looks good. but how about adding a stroke or a border to the right content box and the left menu boxes (notice I gave Anne this same advice earlier in this thread.)

You are on the right track though. Good use of color.

[DesignGeneral]

There is already a stroke but is yellow. I'll play with it.

Thanks for the feedback.

[aspen]

Yes. its very very slight.

I like the borders in firstwave's template if that helps.

[DesignGeneral]

what about this? ;)

[aspen]

The border is good, I honestly do not like your borders as much as firstwave's. I don't like the bottom menu footer thing though -- its too big and eye catching.

I do like your design a whole lot though, the colors and header image and all that.

[DesignGeneral]

I'll come back shortly with a revision :)

[DesignGeneral]

I'm back :D

[DesignGeneral]

HI Aspen,

Waiting for your feedback regarding last revision. Let me know if you want more changes.

I'll be happy to do them.

Thanks

[aspen]

Your latest is your best, and I still like the colors. However, I still like Firstwave's box borders. Probably because of the interior shadow effect.

[DesignGeneral]

OK.

Let me see what I can do ;)

I'll be back in few min.

[DesignGeneral]

Is this better?

[DesignGeneral]

another idea ;)

[DesignGeneral]

B)

[Luc]

Just letting you know that I'm working for this.

[aspen]

okay Luc.

DG, you've certainly given me some options to look at. I can tell you though that I do not like the one with the inner shadow oriented at the top.

[DesignGeneral]

OK Aspen,

Let me know which one you like and if you want to make other changes to it.

Thanks

[aspen]

I guess here is the difference.

You seem to have a slight inner bevel (on your most recent one) for the whole box.

Firstwave has a seperate border with it's own stylizing (embossing of some type it looks like).

Your inner bevel creates a shade around the box that acts somewhat like a border, but it isn't as strong as a border as firstwave's.

[DesignGeneral]

Hi Aspen,

What about this?

[DesignGeneral]

;)

[DesignGeneral]

Hi Aspen,

What is the deadline for this contest?

[aspen]

No deadline. Luc said he is working on something so I'll wait for him.

BTW, your latest is your best.

[DesignGeneral]

ok.

Do you want any revisions at my last entry?

[Luc]

My entry: Looking forward to your feedback.

[aspen]

quite nice luc.

My notes are relatively minor.

1. In the header image.. add some more space between "4" and "Web" Perhaps butt the end up templates up against the side of the arrow more.

2. I love the menu, but the right highlight box does not match the menu entirely. It is missing the additional highlighting at the top that the menu boxes have.

3. The view cart/checkout stuff at the top is not needed.

4. Where do you envision me placing banners?

5. With the gradient background in the left menu boxes is that going to cause a stretching problem? The menu boxes will need to stretch vertically to accomodate more links. I'm not the worlds best designer so I don't know if you can get around that with css.

Overall, excellent choice of colors.

Here is what I want for the end product (to everyone):

1. A color for each individual menu section. I don't care what colors go where but the adult section should be red (luc, you have it as yellow). Also one additional color for the homepage.

2. A matching right content box for each section, including the homepage.

3. A matching title bar (luc only, since her design is the only one to incorporate it), for each section and the homepage.

4. Again for luc only, a "more info" button for each individual color.

So to give you an example. On the homepage the title bar and the right content box could both be olive green. If you were on a page about adult templates both the title bar and the right content box would be red. Get it?

For the final template I'd like it setup so that the text headers of the boxes are CSS. So the boxes are easily interchangeable.

Also, as I originally said, the right content box needs to be able to growth width wise and length wise as needed.

Ideally the winner would give me the following files:

1. an unflatted psd of the homepage.

2. A full template of the homepage. I'd prefer a nice standards following CSS design with cross browser compatibility.

3. A directory of red images, a directory of blue images, etc etc. For each color. buttonred.jpg, boxtopred.jpg, boxbgred.jpg, titlebarred.jpg You get the picture.

Does anyone have a problem with those parameters?

-----------

DesignGeneral, the only real notes I think I could give you at this point would be to make it more like Luc's and Firstwave's. You put in a valiant effort, and its a very good template.

Anne, yours is good too. But right now my two top ones are firstwave's and lucs.

I have been thoroughly impressed with the talent of you all. If any of you had entered my first contest here (shortly after it opened) you probably would have won. Even now, with this one, my 4th or 5th contest, I had doubts about whether anyone would be good enough since I've never seen anyone here make this style before. I'm glad to say I was proven wrong. All 4 of you have exceeded my expectations.

[Luc]

Thanks for the quick feedback. The only problem now is I cannot make CSS. :( Sorry about that.

[DesignGeneral]

I can help u with CSS Luc, if you win ;)

[DesignGeneral]

Thanks for feedback aspen.

I'll see what I can do at my entry :rolleyes:

[aspen]

One more thing Luc, you're missing one of the left menu items (the Logo one).

[Palmer]

Chris there seems to be some confusion. Luc thinks you want a tableless design, that is incorrect right? When you're talking about css, you're talking about your basic style sheet that you would change is that right?

[JeremeDavid]

Here is my entry. The top left category box is a finished version. The links inside will be text. I can accomplish the rollover with CSS.

The design's width and height will be flexible.

[aspen]

<!--QuoteBegin-Palmer+Apr 24 2004, 10:20 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Palmer @ Apr 24 2004, 10:20 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Chris there seems to be some confusion. Luc thinks you want a tableless design, that is incorrect right? When you're talking about css, you're talking about your basic style sheet that you would change is that right? [/b][/quote]
Yes and no. I would prefer a tableless design, but it is not necessary.

What I really want the css for is the handling of the boxes (menu and side). So that the title is text superimposed on the graphical background. That could be done with tables as well, but not as elegantly.

What is most important to me is a functional html template. If it works, and its not css, thats fine. so long as it works.

[aspen]

<!--QuoteBegin-JeremeDavid+Apr 24 2004, 06:32 PM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (JeremeDavid @ Apr 24 2004, 06:32 PM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Here is my entry. The top left category box is a finished version. The links inside will be text. I can accomplish the rollover with CSS.

The design's width and height will be flexible. [/b][/quote]
Thats good. I especially like the rounded corners at the edges. You often see rounded corners in content boxes and menus but not often at the edges of 100% width layouts.

I like the choice you made with the menu. I personally prefer to use css to make background colors change with my menus, which is similar to what you graphically represented.

Overall though your design lacks the detail of the other ones.

[aspen]

If Luc is unable to do the markup perhaps he would be willing to share the prize (if he wins) with someone like DesignGeneral.

Otherwise I'm just waiting for Luc to come back with a template that takes my notes into account then I'll make my decision.

[geofharries]

For anyone interested, here are 2 great tutorials on how to use rounded corners with CSS:

Solid background colours
http://www.alistapart.com/articles/customcorners/

Gradient backgrounds
http://www.alistapart.com/articles/customcorners2/

best of luck,

geof

[Luc]

<!--QuoteBegin-aspen+Apr 24 2004, 09:31 PM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (aspen @ Apr 24 2004, 09:31 PM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Yes and no. I would prefer a tableless design, but it is not necessary.

What I really want the css for is the handling of the boxes (menu and side). So that the title is text superimposed on the graphical background. That could be done with tables as well, but not as elegantly.

What is most important to me is a functional html template. If it works, and its not css, thats fine. so long as it works. [/b][/quote]
Ah ok. I will post the revision later.

[Luc]

Revision:

. With the gradient background in the left menu boxes is that going to cause a stretching problem? The menu boxes will need to stretch vertically to accomodate more links. I'm not the worlds best designer so I don't know if you can get around that with css.

I just removed the gradient background in the left menu so it's easier to code :P

Where do you envision me placing banners?
This is just a placeholder for the banner. It should be 160x600 in the actual template if ever I win.

A matching title bar (luc only, since her design is the only one to incorporate it), for each section and the homepage.

Again for luc only, a "more info" button for each individual color.

One more thing Luc, you're missing one of the left menu items (the Logo one).

I will provide these if ever my design wins.

[Michael]

If Luc is unable to do the markup perhaps he would be willing to share the prize (if he wins) with someone like DesignGeneral.

Otherwise I'm just waiting for Luc to come back with a template that takes my notes into account then I'll make my decision.


She (Mary Luc) ;)

[JeremeDavid]

<!--QuoteBegin-aspen+Apr 24 2004, 10:36 PM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (aspen @ Apr 24 2004, 10:36 PM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Overall though your design lacks the detail of the other ones. [/b][/quote]
I knew you'd say that. ;-)

I will make some revisions to add little detail stuff. You seem to be leaning towards Luc's design, so I'll wait for the go-ahead before I do in case you're planning on ending the contest.

[aspen]

<!--QuoteBegin-Luc+Apr 25 2004, 12:30 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Luc @ Apr 25 2004, 12:30 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Revision:

. With the gradient background in the left menu boxes is that going to cause a stretching problem? The menu boxes will need to stretch vertically to accomodate more links. I'm not the worlds best designer so I don't know if you can get around that with css.

I just removed the gradient background in the left menu so it's easier to code :P

Where do you envision me placing banners?
This is just a placeholder for the banner. It should be 160x600 in the actual template if ever I win.

A matching title bar (luc only, since her design is the only one to incorporate it), for each section and the homepage.

Again for luc only, a "more info" button for each individual color.

One more thing Luc, you're missing one of the left menu items (the Logo one).&nbsp; Also for the homepage the color for the title bar and the right box should match. Also what about making the title bar as "bubbly" as the left menu headers.

I will provide these if ever my design wins. [/b][/quote]
luc you're still missing one of the left menu items (the logo one).

Jereme, you can add more detail, but I am leaning towards lucs (I still like firstwave's though). I do plan on ending this soon. Tommorow (Monday) perhaps.

[Luc]

luc you're still missing one of the left menu items (the logo one).

I just said in my previous post that this is only a minor change and can be done if ever my design has been declared as the winner. I hope that's ok.

[DesignGeneral]

Working at revision.

I'll be back :)

[JeremeDavid]

<!--QuoteBegin-aspen+Apr 25 2004, 08:33 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (aspen @ Apr 25 2004, 08:33 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Jereme, you can add more detail, but I am leaning towards lucs (I still like firstwave's though). I do plan on ending this soon. Tommorow (Monday) perhaps. [/b][/quote]
I will just concede to Luc. She is much better at this style than I am and you are already happy with her design. :-)

[DesignGeneral]

Hi Aspen,

I made a 468x60 ad space on top. If you don't want it I can take it off. Let me know if u want changes.

Thanks

[DesignGeneral]

I'll have something in few min :)

[DesignGeneral]

here we go :o

[aspen]

Okay. It was a hard choice. I really liked Firstwave's design, but Luc is the winner.

Luc please add the missing left menu item, make it yellow please.

Please make the homepage right side box and the homepage title bar the same olive green color.

Please make right content boxes, title bars, and buttons, for all the left menu colors.

Also there is a slight error with your last upload. If you look at the left menu boxes you'll see that the right side border is one pixel too far to the right for each box other than the red (adult templates) one. Please fix that

Then provide me with all the applicable images, an unflattened psd file of the template home page, and a html template of the homepage.

You can mail it all to chris [at] jalic.com

[Luc]

Thank you very much Chris! And thank you for my co-designers for being such a good sport :)

[_firstwave_]

well done luc!

[Luc]

Files sent.