Design posts

Trends start everyday: an idea is adopted, passed on and before you know it it’s being discussed on design blogs. However, most trends vanish as quickly as they appeared. To paraphrase Andy Warhol, everything will be trendy for 15 minutes. Once in a while, an idea is found to have something so fundamental about it that it thrives, even after the initial clamor dies down. Responsive design was one such ‘trend’ and flat-design looks like becoming another.

Flat design...

While fine art is a subjective field, graphic design is more formulaic in its fundamentals. An effective design should make people feel a certain way and take a certain action. In this article I’d like to share Gravity Switch’s web design principles and our thinking behind them.

Those rules are: define goals first; focus on users second; design for emotion; follow the rules of...

As so much of the content available on the web is text it’s essential for web designers to understand the basic principles of good typography. Having such knowledge allows designers to communicate more effectively, enabling them to create better designs and websites that are easier to use.

For more experienced designers setting text may come naturally but for those who are just starting out I’ve decided to put together a...

I’m a lucky person. Every day I get to do what I love, which is helping clients work out what their web project is going to look like.

As any good account handler or project manager will tell you, their primary role is to make sure that a project goes as smoothly as possible. This can mean managing people on both sides of the fence, and keeping everyone happy is no mean feat.

I’m a big believer that getting a project off to a strong start is integral to the success of that project, and for me that means helping the design team hit the ground running, and making sure they can begin doing what they do best as soon as possible.

I’ve read plenty of material recently describing account handlers as having a negative effect on the creative process of a project. These criticisms range from the account handler...

The Phraseology Project was originally setup by Drew Melton as a way for him to hone his typography skills. The idea is that people submit words or phrases and Drew, or a guest contributor, creates a typographic treatment of the submissions.

The list of contributors include designers such as Ray Brown, Luke Ritchie, Simon Ålander...

Recently, Condé Nast Digital undertook a complete redesign of the articles published on wired.co.uk. The aim was to provide a more content-first and immersive experience. These aims were established after research by our Information Architect.

We started on the path of fulfilling those aims over a year ago with the redesign of the GQ.co.uk articles and the introduction of what we call the ‘StickyScrollRead’ component, which allowed the editors to embed media that would be pulled out of the body copy at screen widths wider that 1000px and pinned on screen. That meant the user could continue to read the article and still refer to the peice of media that the copy was about. This proved to be a much more immersive experience and allowed the body...

Hidden away in the depths of the CSS specification you’ll find CSS counters. As the name suggests they allows you to count a thing on your page with CSS incrementing the value every time it appears on the document.

This is principally useful if you have a tutorial website — whether that be about cooking or web development — they all have steps to follow, and you’ll most likely have to write the step number before the actual content. CSS counters can help by doing that automatically, you can even use it to count the images on your file and add figure numbers...

In part one, we touched on how to harness the power of display: flex in your website layouts, and how versatile this new layout concept has proven to be. With those thoughts from the previous video kept in mind, we can now adapt the process and use it as part of a responsive design.

Responsive design allows the user to view a layout considered and targeted specifically for the platform they’re viewing the page on, and in today’s tutorial, I’ll be using the flexbox markup to show you help you create dynamic, malleable layouts for all devices, utilising traditional media queries used frequently in responsive design markup.

We’ll...

The side project series is a series of posts in which we’ll be taking a look at the best of designers’ side projects. To get things started, this week we’re going to be looking at Type Fight, a side project by designers Drew Roper, Ryan Paule and Bryan Butler.

Type Fight plays host to weekly “fights” in which two designers are asked to create a typographic treatment of the same character and then have their final designs voted on to determine whose is best. So far, Type Fight has hosted 61...

The May edition of what’s new for web designers and developers includes new web apps, jQuery plugins and JavaScript resources, educational resources, wireframing kits, image tools, Photoshop extensions, web development tools, coding resources, and some really great new fonts.

Many of the resources below are free or very low cost, and are sure to be useful to a lot of designers and developers out there.

As always, if we’ve missed something you think...

One of the most important tasks on your plate as a web designer is usability. Usability is defined as a gauge of the quality of the user’s experience when interacting with your website. Any website you design should always be seamless from the standpoint of the user. They should find your site easy to navigate without having to first undergo special training. Usability is normally based on several different factors.

A person looking through your site wants their ease of learning to be top-notch. They’ll want to quickly learn the user interface so that they can jump right in and accomplish fundamental, navigational tasks. Efficiency of use is another factor: after they’ve learned to navigate your site, they’ll want to accomplish tasks speedily. Even if the user has used the site before, they’ll need to easily remember enough of the process to be able to use the site effectively the next time. This is called memorability. When they’re using your site, they may experience some errors, but are these errors frequent...