Last week we published a tutorial for designing a basic corporate website layout in Photoshop, and in this tutorial we will walk through the process of coding that design in HTML and CSS. Here is a look at the design that we will be coding (click the image to see it in full-size).

Today we’re going to walk through the process of designing an example corporate website in Photoshop.

Here is a look at the end result of what we will be creating (click on the image to see it in full size).

The new O.S. Windows 7 has improved aesthetics to make the user interface at least more appealing. There are huge ultra detailed icons for folders, devices and so on. This time we will use Illustrator CS4 to create a nice briefcase with the Windows 7 style. You need only a few basics on how to copy, paste, rotate, scale and color the shapes. Let’s focus on business.

Step 1:

Start selecting the Rounded Rectangle Tool (fig. A) and make a single left click on the art board to bring the Rounded Rectangle options configuration window appear. Use 16 px. for corner radius (fig. B) and press Accept. Then left click and drag to draw a shape as shown.

I’m happy to release a free WordPress portfolio theme called Modest Folio. It’s a simple design and layout that will allow your work to take center stage. It features a tabbed featured area on the front page to show the different services that you offer. Modest Folio was design by me and coded by our friends at Snobby Slice. They offer PSD to HTML services, as well as PSD to WordPress (and other CMSs).

Gadgets are a favorite subject for many designers. There are some excellent tutorials out there to help you create amazing results in Photoshop for this type of design, and we’ll feature 30 of them here. You’ll find tutorials for designing iPods, iPhones, a Blackberry, cell phones and more.

MP3 Player Design

Today we are going to design the homepage layout for an ecommerce site in Photoshop. Our sample site will be an electronics shop, and since we are in the holiday season, our site will include some special promotions, which is typical of ecommerce sites at this time of year.

A Preview of the End Result:

Here is a look at what we will be designing in this tutorial (click the image to see it in full-size).

As the community of WordPress designers and developers continues to grow, and as new versions of WordPress are released, there are more opportunities to learn different techniques and tricks that you can apply in your own work. In these 10 tutorials you will find strategies that should prove to be very useful in your own theme development.

1. Using Custom Taxonomies to Create a Movie Database

Custom taxonomies in WordPress are similar to tags and categories, but they provide almost endless possibilities. In this tutorial Justin Tadlock shows a practical use for custom taxonomies while working on a movie database website. He shows how to set up custom taxonomies for actor, director, genre, producer, studio, and writer. This will make it easier for visitors to navigate the site as they can click on the actors name and see all of his/her movies. Justin also wrote an introductory post to Custom Taxonomies in WordPress 2.8.

You can also find more about custom taxonomies in Chris Coyier and Jeff Starr’s new book, Digging into WordPress, which I highly recommend.

Today we will be designing a one-page portfolio in Photoshop. We’ll go through the process step-by-step and you can download the PSD file from Folio Focus if you would like to use it. The portfolio will include some brief biographical information, some sample work, brief description of services, your latest tweets, links to social profiles, and a call to action.

The Final Result:

Here is a look at what we will be creating (click the image to see it in full size)

Today we will be designing a homepage layout for a premium template or theme seller. The design uses a dark color scheme and some texture. Here is a preview of the final result (click the image to see it in full size). At the end of the tutorial you will be able to download the original PSD file used to create the tutorial if you would like it for your own purposes.

Today we will be working through the process of designing a corporate website in Photoshop step-by-step. For this example we’ll be creating a site for a marketing company, but just about any other type of service business could use this design as well. At the end of the tutorial you will be able to download the PSD file used in the tutorial.

A Preview of the Final Result

Here is what we will be designing.