Articles - Page 158

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

Business / 25 Nov 2013

10 Tips to Gain More Confidence as a Designer

Sometimes when a project fails, it can be hard to get back on your feet again. We all take the occasional confidence knock from time-to-time. But to see continued success in this tricky industry, it’s important to be able to regroup and recover gracefully.

Here, we’ll look at ten things you can do to gain confidence as a designer. These tips can work for experienced designers after a troubled project, or new designers looking to break into the market. It’s advice worth taking to heart.

Graphics / 22 Nov 2013

Learn by Example: 6 Lessons for Designing Restaurant & Food Websites

Today’s topic is a delicious one: restaurant and food websites. Small businesses pay the bills for freelance designers and local restaurants can serve as a major source of revenue. If you’re embarking on your first restaurant site design though, there are a few things that you should know.

In this article, we’ll learn by example as we take a look at lots of mouthwatering food and restaurant websites. By examining what these designers got right, you’ll help ensure your own success in this area.

CSS / 15 Nov 2013

Build a Super Easy CSS Slider With Thumbnails

Today’s project is another exploration of the types of practical applications that you can achieve with a little ingenuity and some fairly basic CSS. You’ll be blown away by how much you can achieve with just a few lines of code.

The final result with be a great way to display a strip of small image thumbnails that the user can hover to see larger images. Let’s dive in and see how it works.

CSS / 8 Nov 2013

Build a Freaking Awesome Pure CSS Accordion

Who has two thumbs and loves to push the bounds of CSS? This guy. Let’s jump into a project that does just that. It’s pretty experimental and won’t pass the semantic police, but it’ll teach you a heck of a lot about advanced CSS tactics and will be tons of fun.

What we’re going to build is a pure CSS horizontal accordion slider. You’ll be able to insert as many slides as you want, each with unique content and each accessible via a click event, all without a lick of JavaScript. Impossible you say? Never!

Business / 7 Nov 2013

Food-Based Web Design Tips to Make Visitors Hungry

It’s the same routine every date night: “where are we heading for dinner?” To the web we go, looking for restaurants around us that whet our appetites. And the places we always seem to hit after this dinner search are the locations with websites that just make us hungry.

Certain techniques, from color to photos to imagery, are common among the best food-based websites. These sites employ a specific strategy designed to make you hungry. Today we’ll look at how photography, colors, shapes, vivid copy and simple design are used to make mouths of website visitors water.

CSS / 1 Nov 2013

How and Why to Build Your Own Design Calculators

Design is a complex beast, web design doubly so. There’s a lot more than visual harmony and balance to consider, it’s often the case that you have to dig in and perform some real life mathematics (gasp!).

Oddly enough, I love thinking about this stuff, so much so that I actually build my own calculators rather than use the tools available from other developers. Today I’ll show you how and why to build your own design calculators so that you can master the numbers behind your designs.

Inspiration / 22 Oct 2013

The Design Process: How Do You Get Started?

Sometimes the toughest part of a new project is actually getting started. In fact, just this small step can be a process in itself.

As designers, we all have different processes and habits, but there are a few common things that everyone can do to make getting started that much easier (and hopefully result in more efficient use of time, and a better end result).

CSS / 18 Oct 2013

5 Steps to Drastically Improve Your CSS Knowledge in 24 Hours

You’ve been coding for a while now and know your way around a CSS file. You’re certainly no master, but with enough fiddling you can get where you want to go. You’re wondering though if you’ll ever get past that point where CSS is such a struggle. Will you ever be able to bust out a complex layout without ultimately resorting to trial and error to see what works and what doesn’t?

The good news is that you can indeed get past that frustrating point where you know enough CSS to code a website, but lack the solid foundation that allows you to code without the annoyance of not exactly understanding how you’re going to get where you’re going, and this point is a lot closer than you think. I propose that there are five topics that will drastically boost your understanding of CSS. Spend some time reading about each over the next twenty-four hours and you’ll change the way you code forever.

CSS / 11 Oct 2013

How to Pull Off a Tilt Shift Effect With Webkit CSS Filters

Thanks to mobile image editing apps like Instagram, the faux tilt shift fad seems to be at its height. But why should we let iPhones have all the fun? Let’s bust out a tilt shift effect using pure CSS.

In this tutorial, we’ll learn all about the new CSS filters in Webkit and how to implement an image mask in CSS. We’ll then use these techniques for our final tilt shift effect. We’re going to hit on all kinds of crazy stuff so read on and we’ll have some fun.

Inspiration / 8 Oct 2013

E-Commerce Website Design: 10 Interesting Examples

E-commerce design is one of the most common – and sometimes most overlooked – types of design project. Just think of how often you click “buy now” on a website.

But what makes it work? Of utmost importance in e-commerce design is user experience and the purchase flow, but more and more sites are also beginning to develop awesome design schemes as well. Here, we’ll look at ten e-commerce sites that function well, and also look fantastic.

Graphics / 3 Oct 2013

Designing With Circles: Tips and Advice

Once shunned by designers, circles seem to be making a comeback. The perfectly round shape – and its oblong counterparts – can be difficult to work with. The shape does not stack as well as the more standard rectangle and creates a much different overall feel.

The circle is a perfect shape, meaning that it is the same no matter how you look at it. It is complete and in harmony with nature – consider how many natural elements are circle-based. So, as a designer, how can you make circles work for you?

Minimalist Graphic Design / 2 Oct 2013

5 Traits of Successful Minimalism

At first glance, minimalist websites might look like they’ve just been slapped together as quickly as possible. After all, they’re plain and simple, and most people tend to associate lots of detail with good craftsmanship. But the same rules just don’t apply to the online world.

It only takes a small amount of user interaction to quickly reveal the quality of a minimalist site. This is because the original idea that fueled the rise of minimalism was that functionality is inherently beautiful. A design that clarifies and reveals the structure of a website can be just as appealing as one that obscures its purposes behind fancy decorative additions. Furthermore, it often yields a much better user experience, because those unnecessary distractions are eliminated.