Articles - Page 214

Browse hundreds of articles, tips, and inspiring design collections. Find helpful design advice, or the perfect resource for your next project.

5 Incredibly Useful Tools Built Into Twitter Bootstrap

Bootstrap / 21 Dec 2011

5 Incredibly Useful Tools Built Into Twitter Bootstrap

Bootstrap is an interesting framework or “toolkit” offered up to developers completely free of charge by none other than Twitter.com. According to Twitter, Bootstrap is “designed to kickstart development of webapps and sites.”

Today we’re going to jump into Bootstrap and take a quick look at some of the things that it has to offer. This should help you decide whether this is just another bloated framework or an incredibly useful tool that you should use to kickstart your next project.

Make It Snow on Your Website With CSS Keyframe Animations

CSS / 20 Dec 2011

Make It Snow on Your Website With CSS Keyframe Animations

The holiday season is at its peak and for some lucky people in weather appropriate climates, winter is in full swing. I live in Phoenix so real winter, and consequently snow, is really just a distant dream. Thus I am forced to turn to nerdery to get my fix!

Today we’re going to go over a super simple CSS technique that you can use to make it snow on your website. It’ll only take you a few minutes at the most and it serves as a great introduction to using multiple background images and keyframe animations in CSS.

Branding Lessons From the Guitar Gods: Taylor, Gibson, Fender and More

Graphics / 19 Dec 2011

Branding Lessons From the Guitar Gods: Taylor, Gibson, Fender and More

Today we’re going to discuss how design projects often require you to take a step back from who you are as a designer and forget your own personal taste while taking on the personality of a given brand.

The companies who hire you will have vastly different brands, strategies, and most importantly, customers. This principle is displayed quite prominently in the brands of major guitar manufacturers. Let’s dive in and see how Taylor, Fender, Dean, Gibson and more target the right customers through design.

Weekly Freebies: 15 Fantastically Fat Free Fonts

Freebies / 17 Dec 2011

Weekly Freebies: 15 Fantastically Fat Free Fonts

In the past, we posted an awesome roundup of 15 Gorgeous and Thin Free Fonts to add to your collection. To round out the selection we’re following that up with some nice fat fonts to utilize when you need to make a big, bold statement.

Follow along as we introduce you to some of the most popular fat free fonts around. You’ll find some great serif, sans-serif, slab serif, display and even cursive typefaces to add to your collection.

10 Tips for Managing Creative People

Business / 16 Dec 2011

10 Tips for Managing Creative People

Today’s workplace is filled with different personality styles. Understanding those differences and how they affect your workforce can make you a more effective manager.

Working with “left-brained” (more analytical) versus “right-brained” (more creative) employees has its own set of rules. Most creative workers use the right-brain style of learning and working, which is a visual, random, emotional and somewhat impulsive style of learning, according to data compiled at Western Michigan University. Right brain people like to work with sound in the background (note all those ear buds around the office), like to move about while thinking about concepts and generally start with a big idea and narrow it to the details. Left-brained workers and more verbal and logical, like things in order and prefer a formal workplace.

Take a look at your staff. How many right-brain workers are in the room? My guess it the number is pretty high among designers. Here are a few tips for managing your creative people in a way they can relate to.

Tips and Ideas for Designing With Blurred Images

Layouts / 15 Dec 2011

Tips and Ideas for Designing With Blurred Images

“The supreme accomplishment is to blur the line between work and play.”
– Arnold Toynbee

The topic of today’s discussion is blurry photos. No, not the kind that you accidentally take because your kids won’t sit still. The intentional kind, the use of which can serve several practical purposes in design.

We’ll learn all about how to use blur effects to help make text more legible, direct the viewer’s attention, and just make backgrounds more fun. We’ll also take a look at some different types of blurs and how to properly apply selective blurring.

Four Simple and Fun CSS Button Hover Effects for Beginners

CSS / 14 Dec 2011

Four Simple and Fun CSS Button Hover Effects for Beginners

Today we’re going to take a step back from advanced discussions about CSS preprocessors and return to some good old basics. We’ll work up four super simple CSS buttons, each with a unique animated hover effect.

Follow along with me and create your own fun button styles. Also feel free to grab my code and use it on your projects. If you’re a CSS newbie looking for a good way to make your buttons more interesting, this article is for you!

Extends and Control Directives: Two Crazy Things Sass Can Do That LESS Can’t

CSS / 13 Dec 2011

Extends and Control Directives: Two Crazy Things Sass Can Do That LESS Can’t

LESS and Sass are aimed at accomplishing the same thing, and are indeed so similar that you could easily confuse the two, but are they really created equal? Is there anything that one can do that the other can’t?

On a feature to feature basis, each syntax has one or two things that the other doesn’t. However, despite the fact that I was initially drawn to LESS’ simplicity, in the long run I couldn’t help but be sucked in by a few key features that make Sass really powerful. Follow along as I blow your mind with some of the amazing and unique features of Sass.

Designing Engaging Header Images: Think Outside the Box

Layouts / 12 Dec 2011

Designing Engaging Header Images: Think Outside the Box

One of the first things you do in designing a site is to decide what that first chunk of pixels that users will see looks like. You’ve got to grab their attention and communicate your message above the fold or risk that person moving on to their next open tab.

Unfortunately, many of us fall into predictable patterns for this piece of the site. We use the same old tricks, shapes and plugins and come up with a result that might look great, but isn’t really that exciting. Today we’ll take a brief look at how you can make your header images more interesting. Along the way we’ll see some live examples from sites that have implemented these techniques successfully.

Weekly Freebies: 20 Fantastic Free PSD UI Kits

Freebies / 9 Dec 2011

Weekly Freebies: 20 Fantastic Free PSD UI Kits

Designing user interface elements from scratch is a time consuming a laborious task. Don’t get me wrong, it’s incredibly fun and I highly recommend the practice, but for those occasions when you just need a good mockup or even want to spend the core of your time on other aspects of a design, using a pre-built UI kit can be an awesome time saver.

Today we’ve got a collection of twenty awesome free UI kits that have been meticulously designed down the the last pixel. Each represents hours of work and is sure to help make your design look great.

Hands on With the New Twitter Design

Reviews / 9 Dec 2011

Hands on With the New Twitter Design

Twitter launched a radically new layout to users Thursday. The first to see the new look were mobile users through the Twitter iPhone and Android apps. After updating those apps, the new look of Twitter became active on those users’ computers as well. All other users will begin to see the updated Twitter look over the course of several months.

The results are mixed. The new look and interface is great for mobile users and the sleek interface is cool. Features on the computer version mix the super-sleek interface with a few bonuses but also a few misses. Pages have more pop but still have the look and feel you would associate with Twitter. The site also rolled out branding pages for companies that have a nice look but could change the organic feel that has brought people to Twitter.

Visually, Twitter has reinvented itself consistently across various platforms. Aside from slight, device-specific tweaks the interface looks the same on the website, on a tablet and on a smartphone (no update for the Mac app as of yet). The biggest plus for designers and other visual professionals is an enhanced use of images to push you toward content. Twitter is starting to define itself as more than just a 140-character platform.