Author:

Steven Bradley is a web designer and WordPress developer who moved to Boulder, Colorado to be near the mountains. He blogs at Vanseo Design and owns and operates a small business forum helping people learn how to run and market their business better.

Twitter: Follow Steven Bradley on Twitter

Google Profile: https://plus.google.com/117416570692199036719/posts

Design Principles: Visual Perception And The Principles Of Gestalt

This article is part of a new series about design principles that can serve both as a refresher for seasoned designers and reference for newcomers to the industry. Hopefully, the content covered here isn't too obvious and self-explanatory, but it's always great to have a nice quick refresher every now and again, isn't it? — Ed.

In 1910, psychologist Max Wertheimer had an insight when he observed a series of lights flashing on and off at a railroad crossing. It was similar to how the lights encircling a movie theater marquee flash on and off.

Design Principles: Visual Perception And The Principles Of Gestalt

To the observer, it appears as if a single light moves around the marquee, traveling from bulb to bulb, when in reality it's a series of bulbs turning on and off and the lights don't move it all. This observation led to a set of descriptive principles about how we visually perceive objects. These principles sit at the heart of nearly everything we do graphically as designers.

Read more...

How To Maintain Hierarchy Through Content Choreography

One of the issues we need to be concerned with in responsive design is how to maintain hierarchy as elements on the screen are resized and reflowed. Trent Walton first called attention to the issue with his post “Content Choreography,” which showed how visual hierarchy gets lost when columns are dropped below one another.

Maintaining Hierarchy Through Content Choreography

While techniques exist to help with part of the problem, the solution also requires conscious thought in how you structure blocks of content in your HTML. You need to think about how you’ll want to rearrange blocks of content as your design moves from single to multiple columns.

Read more...

Exploration Of Single-Page Websites

We tend to think of navigating a website as clicking from page-to-page via some kind of global navigation that's always visible. When it comes to a single page, we often think scrolling is the one and only way to move from one end to the next. Sometimes global navigation and scrolling are the best, most appropriate ways to move about, (however, they aren't the only ways).

Navigation Patterns In Single-Page Websites

The websites in this article let you scroll, but they also provide alternative ways of finding cues and means for getting around. In several cases the designs encourage exploration, which is both more engaging and also teaches you how to navigate at the same time.

Read more...

Designing For A Hierarchy Of Needs

Based on Maslow's hierarchy of needs, the idea of a design hierarchy of needs rests on the assumption that in order to be successful, a design must meet basic needs before it can satisfy higher-level needs. Before a design can "Wow" us, it must work as intended. It must meet some minimal need or nothing else will really matter.

design-hierarchy-of-needs

Is this true? Or could a design that's hard to use still succeed because it makes users more proficient or meets certain creative needs? Do you have to get all of the low-level needs exactly right before considering higher-level needs? To answer these questions, let's start by looking at Maslow's hierarchy. In his 1943 paper, "A Theory of Human Motivation," American psychologist Abraham Maslow proposed the idea of a psychological hierarchy of needs in human beings.

Read more...

Does Form Follow Function?

You've likely heard the phrase "form follows function," but have you really thought about what it means or what it implies about Web design? On the surface, "form follows function" seems to make a lot of sense. The way something looks should be determined by its purpose. Is this really true? Does the phrase hold up upon deeper inspection?

Plaza de Castilla (Madrid)

In the context of designing a website, "form follows function" is often taken to mean that the designer should first gather the website's requirements from the client and then determine the aesthetics of the website based on those "functional" requirements. While that's certainly good practice, is "form follows function" really being applied? Are client requirements the "function" of a website or something else?

Read more...

↑ Back to top