Get the Look Corporate
OK, get out the big guns: you want to design a professional, corporate, expensive look. This graphics template will help you get started.
Download the Guides
Download Corporate Part 1 / Colors and Fonts / 42 kb
Download Corporate Part 2 / Techniques and Wrap-up / 75 kb
Colors
Corporate colors are bold and bright, but not so bright that they’re fluorescent or hard on the eyes. Almost any color can be made to look professional simply by decreasing the luminosity (the lightness or darkness in the color).
Use bold colors like red, blue, and green to imply that your company is strong and stable. Tans and beiges will reflect the professional aspect of your company. By mixing subtle colors with bold colors you’ll get the best of both worlds.
Fonts
As you can see, corporate fonts are very simple, and almost elegant. Both serif and sans-serif fonts will work, although sans-serif fonts will give your site a contemporary touch. Stay away from gaudy, decorative fonts — I know it’s tempting to use them, but trust me, they almost always look unprofessional, and leave your company looking untrustworthy.
Techniques
1. Tab navigation
Probably one of the most popular looks on corporate sites, this will give your design a professional edge. Experiment with the shapes and colors of the tabs: have them stick out from the top or side of the page. The main idea here is to experiment — there really is an endless number of things you could come up with.
2. Enough white space
Not too much, but not too little — sites that are cluttered appear unprofessional and sometimes tacky. Leaving white space gives your content room to breathe and will make it stand out. This is a case of ‘less is more.’
3. Dotted or dashed lines
This is another extremely popular technique. Dashed lines will make your site unique and stand out. Use them for content division or to outline tables and cells. I simply used text (- – -) to create these dashed lines.
4. A central image that explains the company
Use this as a sort of center-piece that everything will revolve around. Here you can put all your graphic skills to work. Include images that are associated with your company or reflect a positive attitude, a tagline, short and to-the-point reviews, the URL of the site, and the company name. Don’t make the mistake of excluding this essential information. If you do, the image will only act as a distraction from the rest of your site. You want to make this something that the person can recognise and gather basic information from when they first enter the site.
5. Extremely simple logos; nothing gaudy
Corporate logos usually consist of text and basic shapes. These, along with some simple effects, can produce very professional logos. For example, with the ‘teleCommunications’ logo, I used many small effects to produce the final product:
- ‘tech’ is normal and ‘Communications’ is bold
- ‘tech’ is highly kerned
- ‘tech’ is red and ‘Communications’ is black
- the dots of the ‘i’s in ‘Communication’ are red and there is a thin, arched line between the dots.
Here, a basic shape (the arched line) represents something much larger (communication between people and things). Notice that I didn’t use any complicated effects to make this logo: it’s another case of ‘less is more.’
6. Clean and simple navigation
Do you see a pattern forming? Here we have yet another example of ‘less is more.’ Don’t get me wrong, extravagant navigation can look professional, but the beauty here is in the simplicity of it. Use a clean font that looks good at small sizes. Experiment with the bullet shape: circle, square, triangle, cross, diamond. Notice the beauty in the subtleness of the different bullet colors.
7. Navigation across a block of color
Extend the block of color completely across the page, from border to border, but make the text take up a small amount of room, again, leaving breathing space. Play with different bullets for your links. Also, split the block up into smaller boxes on either or both ends. It helps break up the design a bit, and adds a very professional touch.
Putting It All Together
I made an example ‘corporate’ Website using every technique that I mentioned above. Notice how the ‘less is more’ theory comes together to form a very professional looking site. See what you can come up with!
Get the Look Vintage
Want the secrets to the old-fashioned diner, vintage, retro look? Well then, you’ve come to the right spot.
Download the Guides
Download Vintage Part 1 / Colors and Fonts / 42 kb
Download Vintage Part 2 / Techniques and Wrap-up / 122 kb
Colors
Vintage colors are ones that have that ‘really old and worn out’ look to them. Try and imagine an old t-shirt from the early 90’s that you used to wear all the time; pale orange, grayish-blue, green turned yellow-green, etc. Those are the colors that I went towards with this template.
To get a vintage look, try using three similar tones. For example choose a dark, faded green, a faded green-yellow, and a very pale green (that almost looks gray).
Fonts
Vintage/retro fonts are very noticeable. Just close your eyes and picture and old-fashioned diner sign. The best way to explain it is: they look old-fashioned. One thing to look for is small star shapes throughout the font.
Techniques
1. Old-fashioned, vintage photos in duotone
I found this photo at Google’s Image Search, but you can find old photos anywhere. Pick a nice black and white photo, and simply colorize it with your favorite graphics program to get and old look.
2. Old-fashioned sign shapes
I came up with these shapes simply by thinking of old movies and how I picture old diners and gas stations. Come up with your own! Keep in mind the fact that vintage shapes are never symmetrical.
3. Asterisks and stars
These were quite popular elements of design and will help make your webpage scream ‘vintage!’ I simply used the asterisks that came with the vintage fonts I provided here.
4. Small textures: grids, diagonal stripes, cross hatch
This is a very nifty trick that adds a pretty nice touch to the design of your site. Using Fireworks, I simply set the shapes’ fill to white, put a check in ‘Transparent’, chose a texture, set the texture to 100%, and added a 1px white border to help the shapes stand out more. See your favorite tutorial Website for more info on how to do this in other programs.
5. Old-fashioned, vintage borders
Just another simple technique that can give your site that touch of retro. The design that I used simply reminded me of old-fashioned architecture. Be creative!
6. Unaligned, 1px borders
This simple technique was used very often in the ‘old days’. Start by drawing a vintage shape (see technique 2) and making two copies of it. Fill one with a color on the lighter side. Set the other shape to no fill and give it a 1px border of a color on the darker side. Now simply ‘unalign’ the two by a few pixels and you’re done! This technique is actually making its way back into design today.
7. Dotted lines
I’ve seen this technique used while surfing through websites, and I’ve always thought that it was a cool look. See what you can do with it!
8. Thin, outlined shapes (especially over color)
Another vintage effect I obtained by simply making a number of rounded rectangles with 2px white borders (no fill) and layering them.
Putting It All Together
I made an example ‘vintage’ website using every technique that I mentioned above. Notice how the unaligned borders, vintage colors, and old-fashioned design elements come together to create one pretty retro site! See what you can come up with!
Get the Look American Southwest
Want your design to scream American Southwest, cowboy, or old saloon? Look no further. This is the perfect graphics template for you.
Download the Guides
Download American Southwest Part 1 / Colors and Fonts / 57 kb
Download American Southwest Part 2 / Techniques and Wrap-up / 146 kb
Colors
Western colors are often ‘browned down,’ and look almost toasted. Although many Western colors are very dark, you don’t have to work with a dull palette. Throw in some sunny colors as accents to add some spice — colors that contrast a lot are good for getting that Southwest look. Look to Spanish palettes to spur you on to more ideas (no pun intended!).
Fonts
Western fonts often have rough edges or large serifs, so keep an eye out for those. Some typefaces have an obvious Old West feel, but don’t forget those that say ‘New West.’ Play around with some of the fonts in the template. For example, Spanky’s Bungalow comes with a number of different characters to achieve that ’sign’ look.
Techniques
1. Old, burnt paper
To achieve this look I began by drawing a shape with a few zigzagged edges. I applied an inner glow, using a dark brown, to make the edges look old and burnt. I also applied a very slight texture to add to the old effect, and finished it with a hard-edged drop shadow. Be sure not to use bright white for the paper, as that will make it look too new.
2. Nailed wooden planks
These were very easy to create in Fireworks, and they have that great, Old West look. I began by drawing three fairly simple shapes that nearly fit together. I used the satin fill so that they weren’t solid in color throughout, and applied a very slight confetti texture so that they would look more like a worn piece of wood. I finished the planks with small inner bevels, for depth, and soft drop shadows to make them pop out. For the nails, I simply drew a circle and gave it a radial fill, before adding a small inner bevel to finish them up.
3. Avoid anti-aliased text
This simple effect will give your text an older, rougher look.
4. Old rope
In Fireworks, I drew a shape similar to the one that represents a hurricane on the weather report! A circle with two little tails, you might say. To this I added a soft inner glow and a smooth inner bevel. I simply made many copies of the shape and fit them together into a long line, but don’t forget to experiment with colors and shapes!
5. Carved wood
For this effect, begin with a piece of text or a shape. Fill your object with a color slightly darker than that of the wood that you’re going to ‘carve into’, and make sure that your shape isn’t anti-aliased. To finish the look, apply an inset emboss with the softness set to ‘0′.
If you use a program other than Fireworks, try adding two shadows: a dark inner shadow and a lighter drop shadow, and make sure that the shadows are on opposite ends of your object. If this doesn’t work, consult your favorite tutorial site on how to get an inset embossed look.
6. Zigzags
This is a very popular Western element of design. Think of Spanish rugs or a bag of ‘Tostitos’ chips. Use a variety of colors to spice them up!
7. Cow print
What can I say? It just screams Southwest!
Putting It All Together
I combined most of the techniques here to create a pretty cool Southwestern sign. I put nails in the corners of the old, burnt paper, to make it look like it’s nailed to the wood board. Some little doodles (^) are carved into the wood and the whole thing is hung from a wood plank with rope. To make the holes for the rope, I drew two white circles and gave them an inset emboss. The text was angled to give it a rough look. See what you can come up with!
Get the Look
One of the most difficult aspects of designing is taking that first step: when you know what style you would like to achieve, but you just don’t know where to start. We’ve all been there at one time or another, thinking to ourselves “what colors should I use,” “what fonts would work best,” and “what are some elements of the style I want?”
Well, look no further. I have put together a wide range of “Get the Look” design guides that include everything you need to help jump-start your new design project, whether it be a touch of inspiration or the perfect font. So wait no longer — come on in and take a look… literally! Be on the lookout for new additions to the series.
By the way, I’ve downloaded the fonts that appear in the following guides from a number of places across the web. You should be able to find them simply by searching Google.
Grab a Look and Have Some Fun
Chic Simplicity Published July 2003
Chic simplicity. What exactly is chic simplicity, you ask? It is somewhat of an oxymoron: simple yet sophisticated. The design exudes simplicity through its forms, fonts, and layout, and sophistication through its textures, details, and tastefulness. It’s a fantastic look that can be used for almost every genre of websites: a professional, yet hip, corporate site; a stylish, yet clean, commercial site; or just a fun and colorful personal site. Whichever style you’re going for, this look will fit.
UltraHip Published May 2002
Sometimes you want your design to be vibrant, to scream. UltraHip is just the look. It is very sleek and ultra contemporary. Think posh night clubs in Los Angeles, Paris, or New York City — vivid colors set off by charcoal grays, combining to form atmospheres that encourage dancing, partying, and lots of fun. Use this look to bring a personal site or blog to life, or for a hip corporation whose target audience is of a younger age group. Have fun with this one!
Corporate Published March 2002
OK, get out the big guns: you want to design a professional, corporate, expensive look. This graphics template will help you get started.
American Southwest Published November 2001
Want your design to scream American Southwest, cowboy, or old saloon? Look no further: this is the perfect graphics template for you.
Vintage Published November 2001
Want the secrets to the old-fashioned diner, vintage, retro look? Well then, you’ve come to the right spot.
