Images in this post missing? We recently lost them in a site migration. We're working to restore these as you read this. Should you need an image in an emergency, please contact us at imagehelp@codebetter.com
Web Design for Developers?

Some time ago I was writing on my old blog about web form design.  Since then, I've been thinking about web design, and I have to say … as developers, we're not very good at it. There are tons of guidelines about web design, but a lot of them are geared toward designers not developers. There are of course great guidelines about standards, CSS, positioning and general web design from the code point of view and yes, these are useful resources for us, but it's not enough, and our job as developer/designers is getting harder... Let’s take a look closer to AJAX web pages.

LukeW, my favourite design blogger, wrote about AJAX and design problems. The basic idea of AJAX is to avoid postback and page reload, that’s obvious. Recently on DDD3 one of presenters shows two images that are differ in only one detail. When there was a standard reload no one could say where the difference is, but when there was no reload, everyone saw it. This is interesting, but doesn't tell the whole story.

Imagine a grid with twenty or so rows, full of numbers. When a user clicks somewhere in the grid, one of the numbers will change. Theory says that this should be pretty easy to detect but in fact, it isn’t,  especially, when the page is using a typical postback. In this situation, it's essential that the application focuses the user’s attention to what has changes. There are various methods to do this, however colour and animation are most popular. The new version of the Atlas Control Toolbox contains support for animations. This is great idea to show what has changed on page. There are also a few interesting thoughts in that area in Luke’s post.

This highlights a new UI problem that we can encounter in our daily work with AJAX. I think we consider two main ways of web application creation. One, let’s name it proper way, is when designer has created whole site design, all menus, interface elements and so on and developer have to use this; and second when developer is a designer in the same time. Proper way seems to be ideal but I’ve never heard about designer that made things like AJAX change indicator, mentioned above. And there are other possible elements.

I've encountered cases such as this many times in my work. For example, often the designer hasn’t even imagined that I will have to do wizard on the page so he's designed everything except this for me, leaving me to design this on my own. No big deal, right?  But this is my point. It’s not a big deal when you know how to do this or this is so small element as wizard, where you can reuse other GUI elements, but what about when a developer has to design all application from the scratch.Developers, need guides, examples, rules and any other help we can find and there is a lot of designs, images, menu templates but finding a good guide about how to design useful application is not such easy.

And there is the other side of coin. In one of other articles, Luke (again) wrote about developers, who change design. There is a nice example when designer made slick 3 pixels padding in the table while developer left it by default at zero. Almost nothing changed but all table looks a bit different and didn’t follow the design.

Good Design is much a matter of your perspective. What are your experiences? Let’s talk. Maybe I will invite Luke to join later into discussion as a voice from designers’ world.


Posted 09-25-2006 11:29 PM by Jimmy
Filed under:

[Advertisement]

About The CodeBetter.Com Blog Network
CodeBetter.Com FAQ

Our Mission

Advertisers should contact Brendan

Subscribe
Google Reader or Homepage

del.icio.us CodeBetter.com Latest Items
Add to My Yahoo!
Subscribe with Bloglines
Subscribe in NewsGator Online
Subscribe with myFeedster
Add to My AOL
Furl CodeBetter.com Latest Items
Subscribe in Rojo

Member Projects
DimeCasts.Net - Derik Whittaker

Friends of Devlicio.us
Red-Gate Tools For SQL and .NET

NDepend

SlickEdit
 
SmartInspect .NET Logging
NGEDIT: ViEmu and Codekana
LiteAccounting.Com
DevExpress
Fixx
NHibernate Profiler
Unfuddle
Balsamiq Mockups
Scrumy
JetBrains - ReSharper
Umbraco
NServiceBus
RavenDb
Web Sequence Diagrams
Ducksboard<-- NEW Friend!

 



Site Copyright © 2007 CodeBetter.Com
Content Copyright Individual Bloggers

 

Community Server (Commercial Edition)