Category: Articles

Categories

DSCRT-72-f
Critique / 17 Dec 2011

Web Design Critique #72: Atlantic Corporate Interiors

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 Atlantic Corporate Interiors. Let’s jump in and see what we think!

wf-fatfonts-f
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.

managingcreatives
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.

blurrydesign-f
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.

fourbuttons-f
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!

sassless-f
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.

headerimage-f
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.

wf-uikit-f
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.

newnewtwitter-josh-f
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.

smashingbooks-f
Deals / 8 Dec 2011

Get 5 Smashing Magazine eBooks for Only $20!

This week on Design Shack Deals we’re brining you something that’s simply too good to pass up. We’ve teamed up with the venerable Smashing Magazine to bring you five amazing books from the Smashing Ebook library at over 46% off their normal price.

Read on to see a summary of each book and to learn how you can take advantage of this sweet offer before it’s too late!

2011-trends-f
Layouts / 8 Dec 2011

Popular Web Design Trends in 2011: Over 50 Inspiring Examples

December is here and it seems we’re finally wrapping up 2011. It’s been a year filled with new and exciting forefronts for the web. CSS3, HTML5 and responsive design were at the top of the most-discussed topics. We also mark the passing of the old ways. Flash, Silverlight and similar proprietary plugins received an all out assault in 2011, one that they may never recover from.

To end the year with an informative retrospective, we’ve scoured the web in search of patterns and trends that emerged or became increasingly popular throughout 2011. Follow along as we examine over fifty websites in an attempt to spot similar tricks and themes. I guarantee it’ll be difficult to read without spotting a few trends that you jumped on in your own projects this year!

anatomyofaletter-f
Typography / 7 Dec 2011

Typography 101: Understanding the Anatomy of a Letter

Every designer, whether you’re in print or web, should possess a basic understanding of fonts and type. Using the right typeface and understanding how a font will impact your design can add that extra pop to print and digital projects and will set them apart from all others.

One important area to understand is the anatomy of type. Ascenders, descenders and serifs may sound like words from another language but are the basis for understanding the style of a typeface and how if relates to your project. Today we’ll take a brief run through of some terminology that you should know.