Flexible visual design

Visual design beyond Photoshop

Spoken by English male demonstrating flexible visual design in a Firefox browser.

Narrator: Hi this is Stuart Johnston at Standard Ease. I just want to show you a little bit about flexible visual design.

Flexible visual design is a different approach to Photoshop-based design.

When we design at Standard Ease we work out themes in Photoshop.

For example if you look at these little tabs this would be a theme that we would work out ahead of time.

Or these little icons or the headings are part of a theme which we would design in Photoshop.

But when we build the website we design in HTML itself.

The reason why we do that is because you can get some real flexibility, we're actually designing in the medium and I'll just illustrate some of the things you can do when you do that.

You can achieve what's called a liquid and fluid layout, which means that the presentation will fit into pretty much any situation.

It's very flexible, it doesn't have dependencies.

To illustrate that I'm going to resize the browser window.

I'm going to make it a lot smaller and you'll see the website itself squishes up a bit.

It fills the space still, it proportionally still works, it doesn't collapse into chaos, it just squeezes up nicely and it's quite fluid.

I'll just move this window to show you how that works, you see that it's very fluid in the way it stays together proportionally.

The other thing you can do with good fluid design is increase the size of the presentation.

This is Firefox, just hitting "control and plus" and the whole thing jumps up a notch and it gets a lot bigger.

And I'll do that once more, now that's still pretty big and it's very readable, but it still visually stays together.

That's one of the good things you can do with good fluid visual design.

So it's design that's not tied to Photoshop. Photoshop is part of its process but it's not the real design medium itself.