Category: Articles

Categories

Effortless Full Screen Background Images With jQuery
JavaScript / 5 Nov 2010

Effortless Full Screen Background Images With jQuery

Today we’re going to build a simple and fun webpage for the sole purpose of showing off Fullscreenr, a great little jQuery plugin that makes it easy to add a background image to your site that automatically adjusts to the window size.

We’ll also throw in some @font-face and rgba action to keep things modern and educational on the rest of the build. Let’s get started!

10 Design Lessons From HTML Email Templates That Actually Sell
Graphics / 4 Nov 2010

10 Design Lessons From HTML Email Templates That Actually Sell

In the past we and several other blogs have outlined some useful technical information for how to code and structure your HTML emails from a developer point of view. But much less discussion has been given to how to actually undertake the design component of email newsletters.

Today we’ll take a look at some of the top-selling email templates from Themeforest and see if we can decipher what their designers did right so you can mimic these basic principles in your own designs.

Feedback From a Theory X and Theory Y Perspective
Business / 3 Nov 2010

Feedback From a Theory X and Theory Y Perspective

This article is for both designers and clients/employers. I have been on both sides of this equation so I know how it feels to give feedback as well as receive it and I firmly believe that there is a right and wrong way to go about each task.

Today we’ll look at both sides of the coin and discuss how employers can motivate the people working for them to meet necessary goals and how designers should react in the face of both constructive and destructive criticism.

As we’ll see, designers and managers are often equally guilty of approaching the problem of feedback in a poor manner. While abusive managers do exist, designers tend to unnecessarily wear their feelings on their sleeves and take offense too quickly.

Web Design Critique #25: Highwire
Critique / 31 Oct 2010

Web Design Critique #25: Highwire

Welcome to our 25th design critique! Every week we take a look at a new website and analyze the design. We’ll point out both the areas that are done well in addition as those that could use some work. Finally, we’ll finish by asking you to pitch in and provide your own feedback. Vote in the poll at the bottom of this page and/or leave a comment with your thoughts!

Today’s site is Highwire.com, a personalized online store platform.

Design an Edgy Flyer Using Your Own Photography
Graphics / 29 Oct 2010

Design an Edgy Flyer Using Your Own Photography

Today we’re going to take on a design project from start to finish using primarily resources that we create ourselves. We’ll walk through taking the photo, editing it in Adobe Lightroom, and using it as the main element of a flyer design that we’ll take on in Photoshop.

Along the way you’ll learn some great and practical techniques that you can apply immediately to your own work. Let’s get started!

60+ Awesome UI Dribbbles
Inspiration / 28 Oct 2010

60+ Awesome UI Dribbbles

It’s been quite a while since we’ve done a “Shots of the Week” post so we thought we’d make up for it by bringing you a massive collection of user interface designs from Dribbble.

Use these shots as inspiration for color, textures, layouts and anything else you spot for your next application or website. Looking through such a great collection of inspiration can serve as a springboard for your own completely original work.

Photoshop Blending Modes: Beginner’s Tips and Tricks
Graphics / 27 Oct 2010

Photoshop Blending Modes: Beginner’s Tips and Tricks

Photoshop’s blending modes are a source of constant confusion for many designers. There aren’t really any sort of built-in examples for you to see and the blending mode names are no where near intuitive suggestions of what the effect actually does to the appearance of your document.

Today we’ll help remove a little of the mystery by discussing how a few key blending modes work in addition to some hints for how to use them effectively.

Web Design Critique #24: Adminizio
Critique / 24 Oct 2010

Web Design Critique #24: Adminizio

Every week we take a look at a new website and analyze the design. We’ll point out both the areas that are done well in addition to those that could use some work. Finally, we’ll finish by asking you to provide your own feedback.

Today’s site is Adminizio.

Web Design Critique #23: Kuenstler
Critique / 23 Oct 2010

Web Design Critique #23: Kuenstler

Every week we take a look at a new website and analyze the design. We’ll point out both the areas that are done well in addition to those that could use some work. Finally, we’ll finish by asking you to provide your own feedback both through comments and by voting in our design poll.

Today’s site is Künstler.co.at.

How to Build a Website With Flux 3: A Coder’s WYSIWYG
HTML / 22 Oct 2010

How to Build a Website With Flux 3: A Coder’s WYSIWYG

Flux is a WYSIWYG website editor for Macs. Now, before you curse under your breath about how much you hate WYSIWYGs, you should know that Flux is different and is both powerful and flexible enough to be used by professional web developers.

Today I’ll introduce you to Flux by creating a super simple web page from scratch (no annoyingly rigid templates). Along the way we’ll see what a typical workflow looks like and why it just might be the best visual web editor I’ve ever used.

Ultimate Web Font Resource Roundup: 50 Awesome Sites
Typography / 21 Oct 2010

Ultimate Web Font Resource Roundup: 50 Awesome Sites

The idea that web designers ignore typography is officially dead. In recent years countless tools and services have sprung up to meet the need of making the web a more type-friendly place, and they’re succeeding.

Today we bring you a huge list of awesome websites for all things related to web fonts. You’ll find sites offering free fonts, web font services, font building tools, previewing utilities, and a lot more!

CSS3 Cookbook: 7 Super Easy CSS Recipes to Copy and Paste
CSS / 20 Oct 2010

CSS3 Cookbook: 7 Super Easy CSS Recipes to Copy and Paste

By now you’ve probably seen enough lengthy CSS3 tutorials to last a lifetime. You’re probably starting to become familiar with what CSS3 has to offer and are ready to move past basic theory and see some practical design examples that you can copy and paste right into your code without without wading through tons of commentary.

Well you’re in luck because that’s exactly what we have for you today! Below you’ll find seven fun and attractive CSS tricks that you can grab and insert right into your own projects and customize at will. Keep in mind that since this stuff is still cutting edge, older browsers won’t support most of it. I’ve tried to ensure graceful degradation where possible so that you can provide a working experience to all users and a better experience to those with using webkit.