Articles Archive


Weekly Freebies: 30 Amazing Free Fonts From Behance

Welcome to another installment of our weekly collection of awesome design freebies from around the web. This time we have a real treat: thirty gorgeous free fonts from Behance. There’s a ton of great work on that site and if you know where to look you can score some spectacular finds.

Peruse the options below and download your favorites, then feel free to leave a comment to let us know what you think.

February 4th, 2012 Posted in Freebies

5 Online Playgrounds for HTML, CSS and JavaScript Compared


Local coding environments are great, but it’s often the case that I don’t want to crack open Espresso and spend a few minutes setting up to code when all I really want is to test out an idea or work on a bug. Also, sharing options for most local coding apps are limited and typically require integrating an outside app like Dropbox.

Online playgrounds or sandboxes such as jsFiddle solve this problem by providing you with an instantly ready coding environment for you to begin experimenting in as soon as the page loads. These tools let you combine CSS, HTML and often even JavaScript to create and share coding examples. I’m completely addicted to these things and have extensively tested every one I can get my hands on. Today I’ll go over my five favorites and discuss not only why what I like about each option, but also where they fall short.

February 3rd, 2012 Posted in CSS

How to Create a Facebook Timeline Cover Photo: Examples and Best Practices


Facebook announced Jan. 24 that it will be moving all users to the timeline format in the next few weeks. Although the change will be mandatory soon, you can make it early as some users have been doing since it was launched in September. Timeline is the new Facebook “wall” and highlights your personal information based on when it happened.

The biggest visual change included in Facebook timeline is creation of a cover photo. When someone lands on your page they not only see a small square profile image but also a large photo that you have selected for the top of your page. The shape can a little intimidating and includes a hole where the profile image rests. But you can crop or create your own timeline cover photo in just a few minutes. Follow along as we take a look at some great examples and advice for creating the perfect cover photo.

February 2nd, 2012 Posted in Layouts

Why Almost Is a Dirty Word in Design


Almost. It seems innocent enough right? Surely there’s no evil lurking in those six letters. You might even see this as a positive word. However, as a designer, you should always be on guard when this word can describe certain aspects of your work.

Read on to see why “almost” can be a dirty word and how it just might be bringing down the quality of your work. We’ll also take a look at two underlying foundations of good design that provide ready solutions to solve your “almost” design woes.

January 31st, 2012 Posted in Graphics

Code an Awesome Animated Download Button With CSS3


Follow along as we create a simple and fun download button using some fancy CSS3. Our button will use lots of fun goodies including border-radius, box-shadow, linear-gradients, z-index and transitions to achieve a unique double sliding drawer effect on hover.

As we go, I’ll discuss why some techniques that you might think to use should be avoided. Transitions are tricky to work with and are quite prone to refuse to work with certain properties. Read on to find out more.

January 30th, 2012 Posted in CSS

Web Design Critique #75: Income Diary

web 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 to those that could use some work. Finally, we’ll finish by asking you to provide your own feedback.

Today’s site is Income Diary, a blog that offers simple, practical advice for how to earn money online. Let’s jump in and see what we think!

January 28th, 2012 Posted in Critique

Weekly Freebies: 15 Free Business Card Templates That Don’t Suck


Business cards are an awesome creative outlet where designers tend to push themselves to come up with unique and interesting solutions. If you’re a newbie to business card design though it can be difficult to break out of the cliché unoriginal layouts that will no doubt pop into your head. This post of over 15 free layered business card templates should help you out.

As a bonus, we’ve included not only layered business card templates, but a few editable 3D mockup files as well so that once you start creating your own awesome designs, you can show them off in style.

January 27th, 2012 Posted in Freebies

Pick the Right Typefaces for Your Project


Sometimes the most daunting part of a new project can be the brainstorming phase. Thinking of color schemes and font selections can be inspiring in your head, but really tough when you start mixing and matching elements on paper or for your website.

Understanding some of the history of fonts and typography can help make any project a little easier. Learn how to pair different typefaces to get desired effect every time and learn what things to avoid. Sharp typography and font selections can really make or break just about any project.

January 26th, 2012 Posted in Typography

Addictive UX: Why Pinterest Is So Dang Amazing


Today we’re going to examine a very specific example of good design and discuss what makes it so successful. Along the way we’ll discover the importance of good design and how to structure experiences that turn users into addicts.

We’ll hone our sights in on Pinterest and perform a seriously in-depth analysis to see why this seemingly generic idea seems to stand so far out from the competition. The ultimate conclusions will equip you to design experiences that your users will absolute love.

January 25th, 2012 Posted in Business

Jumpstart Your Web Project With HTML KickStart


Recently, we took a look at a really solid framework from the good folks at Twitter called Bootstrap. This toolkit is a swiss army knife of utilities and includes both a functional layout grid and enough pre-styled elements to get a great jumpstart on any project.

Today we’re going to look at a very similar tool from Joshua Gatcke called HTML KickStart. This framework is simply overflowing with great stuff that will enable you to build web page prototypes at light speed. Let’s jump in and build a page with it to see what we think.

January 24th, 2012 Posted in CSS