To Visual Design, or Not to Visual Design…


I started building a simple “forms on data” app for work today (in the absence of tools, sometimes you must build tools!) and my first instinct was to just use Visual Studio 2010 Win Form visual design aids.

After hacking together a solid looking form and then trying to fit logic into it, I found myself hunting high and low to make some sense of what the designer was doing.  I realize I am hugely rusty on both Visual Basic and C++/#, so I attributed at least a chunk of the confusion to my own deficiencies.  In searching across the web for some quick education uplift, I came across this entry by Charles Petzold:

http://www.charlespetzold.com/blog/2010/07/The-Disasters-of-Visual-Designer-Tools.html

My first instinct after reading was to write this off as the kind of “walked 2 miles uphill in the snow” curmudgeonry that old guys like us often fall victim to (I remember when “programming was punching holes in tape!”, and when “you soldered your computer together from a kit dag nubbit!” – this kind of thing).  Reading the comments sort of enforced that view as I saw most in agreement were regressing to a viewpoint where modern web designers should be versed in assembler so they can be “good programmers”.

I left the article aside and went back to puzzling over the birds nest of code created by the forms designer.  Something kept nagging at me though, and I returned to Petzold’s article with more of an open mind.  There is definitely something to what he is saying here.  I ended up completely scrapping the work I had done with the visual forms designer and instead started with a blank form and a single check box object.  From there I went right to the code.

This simple structure ended up replacing dozens of discrete code blocks (1 for every check box):

For ComboBoxCount = 0 To ComboBoxTotal
Me.ComboBox1 = New System.Windows.Forms.ComboBox()
Me.SuspendLayout()
Me.ComboBox1.AutoSize = True
Me.ComboBox1.Location = New System.Drawing.Point(ComboBoxPosX, ComboBoxPosY)
Me.ComboBox1.Name = ComboBoxNames(ComboBoxCount)
Me.ComboBox1.Size = New System.Drawing.Size(185, 17)
Me.ComboBox1.TabIndex = 0
Me.ComboBox1.Text = ComboBoxNames(ComboBoxCount)
Me.ComboBox1.Items.AddRange(GetComboItems(ComboBoxNames(ComboBoxCount)))
Me.Controls.Add(Me.ComboBox1)
If ComboBoxCount = 9 Then
ComboBoxPosY = 420
End If
If ComboBoxCount >= 9 Then
ComboBoxPosY = ComboBoxPosY + 22
Else
ComboBoxPosY = ComboBoxPosY + 27
End If
Next

I think even in the era of modern processors (with cores to spare) and gobs of RAM, there is something to be said for code efficiency.  There won’t be performance issues with a simple form on data app like the one I am building on a modern CPU no matter how lousy the code is behind it, but certainly there are practical issues of maintaining the thing, porting it, etc where a discrete approach to each and every design element will ultimately lead to a nightmare.

The lesson I came away from this learning is that, while incredibly powerful aids, visual design tools should definitely be used as a supplement to your design.  They should never get away from you to the point where you lose site of your own code.  Petzold was definitely right on this and I’m glad I stumbled across that article early.  It inspired me to “get back to basics” and I am sure this will pay dividends down the road!

Leave a comment