A lot of designers are going out of their way to create something special in the CSS of the wordpress theme that will make an impact, but the fact remains, no CSS trick will ever compete with what Photoshop (or Illustrator) can provide in web layout, especially in such a competitive area like wordpress themes. Here is a selection of truly, incredibly breathtaking Wordpress Themes that you can not only worship and admire, but also download 100% free and use for your blog. Enjoy!

1.  Puteulanus Wordpress Theme [demo]

2.  Deskspace Wordpress Theme  [demo]

3.  Blogging Cream Wordpress Theme [demo]

Read the rest of this entry »

I have not updated this blog for a while mainly because I was busy offline but these days the only thing that has occupied me was re-designing PSwish.com After a dark, very dramatic design, we decided to follow the trend and switch to eco style.  While this design is still in beta and we are working on cleaning the bugs and struggling to make it bearably visible to the IE users, I thought I would start with giving some credits.

Icons used in this design: Coquette. They were featured a while ago on Smashing Magazine and I just fell in love with these little

Leaf made following the tutorial from Vectortuts.com

Design + Coding: LoreleiWebDesign.com (us, that is and you may consider hiring us!)

Took me about 2 days to complete the psd and then approximately 1 day to convert the psd to wordpress. I hope you like the new layout and please feel free to report any bugs you find, it was 3 a.m. when I finished this theme so I am pretty sure I could miss something!

This is yet another very small freebie made in Photoshop in less than 10 minutes, but I am sure the outcome will be used on hundreds of blogs! All I did was drawing a circle, applied styles I previously posted and added a bit of a gloss. That’s all. The feed shape itself was a bit tricky but like I said, it didn’t take long at all. In the zip folder you will find 3 icons without shade and 3 with shadow (as you see on the previous picture, all in PNG format against transparent background so they are more than read-to-use. Hope you like them!

 FREE DOWNLOAD (124 kb)

I am happy to finally offer a nice texture for web designers. There are quite a lot of  Wordpress themes and website using the colorful strips backgrounds, so I thought I’d create one of my own. This texture is free for both personal and commercial use. Download this file, open the .png image in Photoshop, and go to Edit >> Define Pattern >> name it, and press OK. That’s all. Now you can easily access it via Layer Styles >> Pattern option. Enjoy!

I f you use this pattern, kindly link back to PSwish.com

There are so many tutorials and guides online that teach you how to make effective use of the web 2.0 design. While most these tutorials are useful, at the same time they kill the originality in web design. For example, most “guides” tell you that web 2.0 is about having a glossy badge, stripes background, and bold fonts. Result? There are countless hundreds of designs with badges, stripes and bold big letters… and they are no different from one another. It does not matter if you make a web 2.0, web 1.0, or web 75.0 design, it all comes down to being original and memorable.

However, if can’t really find anything particulary original to symbolize your design, it’s “safer” to go with the current trends of web design. So here is a very small fragment of web design layout, and how to turn a regular layout into a web 2.0 layout.

This is what we had…

And this is what we are going to do…

We are going to work in Photoshop, using nothing but layer styles; focusing on mild gradients and shadows.

Start off by Read the rest of this entry »

When followed, this guide will prove to be quite a valuable web design resource. From the inexperienced to the experienced, this guide has something for everyone.

The Process of Great Web Design Just to make sure we are all on the same page, lets begin with the basic definition for “web design”. According to Wikipedia, web design is:

“a process of conceptualization, planning, modeling, and execution of electronic media delivery via Internet in the form of Markup language suitable for interpretation by Web browser and display as Graphical user interface”.

The process of web design can be compared to the process of writing a research paper. In the conceptualization/planning stage, flowcharts (the outline) are created which illustrate the navigational structure of your website. In the modeling stage, static wireframes are created (the rough draft) which illustrate the skeletal layout for each section of your website. After the wire frames are created, graphics, colors and text are used to create the design of your web pages based on the layout of the wire frames. In the execution stage, your design is converted into a format supported by web browsers, text and content are added, and finally, your website is published live to the Internet for the world to see (final draft).

All three stages of the design process are equally important. Many web designers skip a stage in order to save time or because they don’t think that is is necessary. However, all three stages are necessary if your goal is to create a successful design and respectable website. Even if the three stages are used, there are many mistakes that web designers can make that will lead to poor-quality, non user-friendly websites.
It’s time to clean out the cabinet of bad web design practices and restock it with the good ones.

Stage 1: Conceptualization and planning
This stage is skipped more often than the other two stages. Most writers don’t enjoy creating outlines for research papers, and most web designers don’t like creating flowcharts either. Don’t be lazy. If you put forth the effort and plan out your website, then you will find the web design process to go smoothly with fewer mistakes made along the way.

There are a few things that you will need in order to effectively conceptualize and plan your website:

-a brain
-a pen and paper
-(optional) flowchart software
-a general idea of the different sections of your website Read the rest of this entry »