This collection wraps up many web layout tutorials. Each tutorial underscores some characteristics, stylish, simplistic, colorful, nice, beautiful and eye-grabbing, grunge, sleek looking, unique, mockup, modern looking, etc,. Some other design tutorials are also included in this collection for your appreciation. Lacking inspiration? Check out these incredible design tutorials.
1. Design a Simple, Industrial-Style Gaming Header
In this simple & easy tutorial I’m showing you how to make a grungy-styled gaming header, just like the one shown below!
 |
2. Design a Grungy Web Layout (Part 1)
In this two-part Photoshop tutorial we’ll be designing a nice, simple grungy website design. For this tutorial I’m going to assume you have moderate knowledge of Photoshop, considering I don’t explain every single part in exact detail.
 |
3. Design a Grungy Web Layout (Part 2)
Continuing from the last part of this tutorial. We’ll be making the side panel for recent work, the updates area, and the footer bar for this grungy web template.
 |
4. Designing a Clan Template Part 1
Part one of the Designing a Clan Template tutorial will teach you how to make a wicked, general-themed game header/banner for the template.
 |
5. Designing a Clan Template Part 2
In the 2nd part of this series I’m going to show you how to design a cool set of navigation buttons, like the one shown in the below image.
 |
6. Making a Clan Template Part 3
In this part (3rd and last part) of the tutorial you’ll learn how to make the recent matches and whatnot boxes, and also the footer bar.
 |
7. Design an Awesome Band Website Template
In this intermediate Photoshop tutorial, I’m going to be teaching you how to make a really wicked, grungy-style band website template. Personally, this is one of my favorite designs/tutorials ever, so I really hope you enjoy it.
 |
8. Simple header design in Photoshop
Hello, in this tutorial I will show you a simple way to make a nice header for your web site or blog, without using any photos. We will use basic …
 |
In this tutorial il be showing you how to create a sleek looking web design layout from scratch. The design itself will have a simplistic metal feel, with the use of alot of grey color(s).
 |
10. Shopping Cart Design Mockup
Welcome to another tutorial at hv-designs, today we’ll be mocking up a shopping cart design called shop smart.
|
|
Good evening everybody, in todays tutorial we’ll be creating a design showcase style layout. The design would/could be used to showcase inspirational websites, gallerys, etc…
|
|
Hello everyone, welcome to another tutorial by the hv-designs team in this tutorial il show you how to create a stylish design lab layout.
|
|
Hello, welcome to another tutorial by the hv-designs team sorry were abit late than usual. In this tutorial il show you to create a web design layout. Lets get started.
|
|
14. Creative Design Layout Tutorial
Hi there, in this tutorial il learn you how to create a creative design layout and il be writing a follow up tutorial shortly after expaining step-by-step on how to code it using dreamweaver.
|
|
In this tutorial il show you how to create a sleek looking design studio layout.
|
|
Learn how to create a sleek looking interior design layout from scratch.
|
|
Learn how to create a web design layout, currently the 7th web design layout in our tutorial libary.
|
|
18. Create Packaging Design in Photoshop
This lesson will teach you how to make a plastic?sachet. We will be using plastic wrap filter as well as other technique to make it look more real.
|
|
19. Make swirls effect in a minute
This tutorial we will learn to make swirls and twirls in a minute. We will be using liquify filter to do this tutorial.
|
|
20. How to Create a Clean Blog Design with Photoshop
In this step-by-step web design layout tutorial, you will discover a method for designing a clean blog design with stunning gradient and lighting effects using Adobe Photoshop. This tutorial is geared for beginner to intermediate Photoshop users.
 |
21. How to Code a Grunge Web Design from Scratch
In this step-by-step web development tutorial, you will learn how to convert a beautiful and eye-grabbing grunge theme web layout–created from Photoshop in a previous tutorial–into a working HTML and CSS template.
 |
22. Coding a Clean & Illustrative Web Design from Scratch
In this comprehensive and step-by-step web development tutorial, you will learn how to convert a Photoshop mockup of a professional web layout design that features an illustrative landscape header into a standards-compliant XHTML/CSS template.
 |
23. How to Create an Illustrative Web Design in Photoshop
In this web design tutorial, you’ll learn how to create a professional web design with an illustrated "vector" header in Photoshop. You’ll see many techniques here including how to draw using the Pen Tool and a excellent type treatment using layer styles.
 |
24. How to Create a Grunge Web Design Using Photoshop
In this step-by-step web design tutorial, you will learn how to craft a beautiful and eye-grabbing grunge-themed web layout using Photoshop. This tutorial is geared for beginners and intermediate-level Photoshop users.
 |
25. How to Create a Dark and Sleek Web Design from Photoshop
In this web development tutorial, you will learn, step-by-step, how to create a beautiful dark and sleek web layout using standards-based HTML and CSS. Along the way, you will witness how to use CSS Sprites and CSS Text Image Replacement.
 |
26. Create a Dark and Sleek Web Layout Using Photoshop
In this Photoshop web design tutorial, we are going to create a beautiful, dark, and sleek website mock-up centered on an elegant navigation menu that lends itself easily to CSS background sprites.
 |
27. Coding a Clean Web 2.0 Style Web Design from Photoshop
In this web development tutorial, you’ll learn how to build a web page template from a Photoshop mock-up from a previous tutorial called "How to Create a Clean Web 2.0 Style Web Design in Photoshop" using HTML/CSS and the jQuery library.
 |
28. 9 Things You Can’t Forget When Designing a Blog
Do you ever forget to do one of these things when building a new website? These are 9 pretty essential things to keep in mind when building a new blog or site!
 |
29. Minimalism Around the Web: Design Inspiration & WordPress Themes
This post explores Minimalism, what it is, creative websites that are minimal in nature, and shares some free minimalistic WordPress themes.
 |
30. Design an Epic Fantasy Scene with Photoshop
Design an Epic, Stunning Fantasy Scene with Adobe Photoshop following the detailed instructions in this tutorial. Full PSD included, for free of course.
 |
31. Phenomenal Packaging Design & Inspiration
Lacking inspiration? Check out these incredible package designs to get your creativity going!
 |
32. Design a Coldplay/Apple Inspired Portrait in Photoshop
You don’t have to be an obsessive Coldplay fan like me to admire the beautiful effects shown in the latest Coldplay / Apple ad. This tutorial will show how to design portraits based on that style.
 |
33. ZX5 Hosting: design a contemporary hosting site
Web hosting web sites are quite popular nowadays and are certainly an often requested job for most web designers. This tutorial will teach you how to design a modern looking hosting template from scratch.
 |
34. Design a Sleek and Modern Hosting Layout
Seeing numerous host startups around the web, we decided it was time for a hosting layout tutorial. This layout features dark elements with bright text and cool buttons. It’s got a slightly futuristic feeling to it, to me it feels like some sort of portal. As always, don’t forget to download the free PSD that comes along with the tutorial!
 |
35. Design a Dark, Contrasted Layout in Photoshop
In this tutorial we’ll show you how to create a dark, contrasted layout in Photoshop. This technique makes the top of the layout stand out while the bottom has a dark, professional feel. We’re going to show you how to design this layout step by step in this tutorial. Download the free PSD and see how we did it.
|
|
36. Design a Dark, Contemporary Minifolio in Photoshop
Portfolios are nice, but what if your clients want a quicker, lighter way to see what you can do? A Minifolio is a hybrid between a full-scale portfolio and a business card. It’s quick to design and it gives an idea of your style and a little of your background information without all the bells and whistles.
|
|
37. Photoshop Web Design Tutorial
In this tutorial I will be teaching you how to make a professional website design from start to finish. You will learn how to use the most usable photoshop tools for web design purposes.
|
|
38. Design a Stylish Arcade Website Header
Wanting to start an arcade website soon and want it to stand out from the rest that have standard ugly headers? Then this is the tutorial for you! Learn how to make a simple but very stylish arcade website header.
 |
39. Creating a Travel Blog Design Using Adobe Photoshop
In this tutorial we will be creating a unique blog design for a travel website. Using this tutorial you will learn how to create a unique website headers, logo and blog layout using some great tips and tricks!
|
|
40. Create header for designer website
In this photoshop tutorial we will show you how to create nice colourful header for your website. We will create header with 5 categories, search box and Urls to your feed and Twitter accounts. In this tutorials we will use some objects that we created earlier.
 |
41. How to Design Interesting Stylish Advert
Here one more interesting tutorial about how to design interesting stylish advert in just a few steps.
 |
42. Web Design Process: Zee Site
I started Zee back in 2004 with a friend of mine, Fabiano Meneghetti. Throughout these years we have learned a lot, from our successes and of course from the failures. It’s part of the game right, even though we try to succeed more than fail. One of this mistakes however, was to partnership with people that do not share the same thoughts that we have. Different perspectives and ideas.
 |
The newly released Pixelmator includes a very important feature: the Slice Tool. Now we can slice and save pieces of the layout to create Web sites. That is really handy! Because of that, I decided to create a tutorial showing how to create a Web site design using Pixelmator.Step 1
 |
44. Dirty Design: Create a Grungy Thriller Book Cover
We’re often told to not judge a book by its cover, but in most cases we do. If a book doesn’t have a nice cover, it probably wouldn’t catch our attention in the first place. In this tutorial, I’ll be teaching you how to create a dirty grunge book cover design complete with bleeds!
 |
Hello welcome to another tutorial by hv-designs. In this tutorial il be showing you how to make a simplistic colourful web design layout from scratch using photoshop.
 |
Good evening everyone, today il be showing you how to make a colorful web design company layout. The website features multiple enlightening colors and a simplistic navigation with a 3D hover.
 |
Hello, welcome to another tutorial by hv-designs. Today il be showing you how to make cool blue web design layout. The layout features a cloud theme and a screenshot of the new hv-designs coming 2010.
|
|
48. Design a Minimal and Modern Portfolio Layout with Photoshop
In this Photoshop web design tutorial, we’re going to create a mock-up of a clean and modern-looking website. This is Part 1 of a tutorial series that will show you how to create the design, and then convert it to an HTML/CSS template.
 |
49. Create a Clean Business Web Template Design in Photoshop
In this web design tutorial, you’ll see a method for creating a professional web design mockup that’s perfect for a modern business or e-commerce website. This tutorial assumes that you know the basics of Photoshop.
 |
50. Theatre: design an elegant, dark portfolio site
Portfolio sites can be used by a whole lot of folks: from web designers, to photographers and artists. Learn how to design such an elegant and stylish web site.
 |
51. EcoZone: design a green business website
Nowadays everything is about green technologies, green business, ecologically clean products. For a web designer, it may be very probable to encounter a client, who needs just such a web site design. Ste Story teaches you how to do just that.
 |
52. Design a simple, modern web template
Today, we present a tutorial by Dedrick Payne on how to create a simple, but modern web site template from scratch in Photoshop.
 |
53. New PLUS Tutorial – SOSFactory Style Mascot Design in Photoshop
We have a new PLUS tutorial from Sergio Ordóñez. If you’re wondering who he is then review this Interview he did on the PSDTUTS site not to long ago. For this tutorial, we contracted him to create a unique character design just for the PLUS Members to review his working process in creating it. So, for those of you signed up for PLUS you’ve got a real treat in store. We also included wallpaper-size version of the final presented designs. I’ve already set one on my desktop.
 |
54. Cliff Notes on a Website Redesign – Tips and Thoughts from the Creattica Inspire Design
In this post I’m going to show you a set of twenty screen mockups for a real world project that I’ve been working on – the upcoming redesign and rerelease of our design and inspiration gallery FaveUp. I’ll explain some of the why’s and how’s that went into the design, how I use design mocks to spec out a web app, as well as some general notes on the design. The new site that we’re calling Creattica Inspire is now being developed by our crack Melbourne development team and will be hitting the interweb tubes as one of our first releases of 2009.
 |
55. PSDTUTS "Solving Poverty" Button Design Contest has Concluded
The PSDTUTS "Solving Poverty" Button Design Contest has reached the deadline, which was a few days ago on September 28th, 2008. Our goal is to have the top 10 Button Design winners chosen before October 15th when Blog Action Day launches. Make sure your already submitted entries qualify by providing the artwork in the dimensions needed. Learn more at the jump.
 |
For help, advice, tips and tricks, challenges, feel free to visit our
or Submit your good resource to share.
Reminder: Unless stated otherwise, all resources published on this site are NOT for commercial use. To use any resource from this site for commercial purposes, please contact the author.
Nice article much helpful thanks for sharing.