Skip to main content

The Programming Designer

Most developers prefer to seperate design from functionality. This is a noble goal, but sometimes hard to implement. In my experience developing web applications, the most typical collision between design and functionality happens in JavaServer Pages, the most typical templating format of web front-ends in Java web applications. Most readers know JSP's, but for those who don't, think of it as Java's PHP, or the templates we use for producing HTML.

However, a problem which is still at large in web applications today is that these templates are designed by Java developers, or pure programmers with little knowledge of web design and web standards. Or worse, programmers that believe they do know web stuff when they actually don't, or don't know how important the web front-end really is.

The problem with programmers doing these JSP's is that that they are doing design, sometimes even when they don't have to. The classical example of this is putting layout of the entire page in<>'s because they can't handle CSS. Tables are even used for lists. They embed JavasScript and styles in the HTML. If they do use CSS, they might inconsistently use classes and id's.

And by the end of the day, the result of the programmer's futile attempts at doing web design ends up plain ugly.

Then to the rescue: The web designer.

The web design is delivered in the shape of a couple of example static HTML pages with CSS and JavaScript files attached. Shipped and dropped in the lap of the programmer.

What follows are several strenuous days of the programmer picking at the JSP, trying to make the web design fit and look like the web designer's example.

There are two ways to avoid this pattern. The first one is: Programmers, steer clear of web design. Just leave the design till later on. Learn the basic DOM-elements of HTML you will be producing, and use it in a consistent way.

But remember that no matter how well the programmer uses div's and id's in the most elegant scheme of definitions, the web designer will definitely come up with his/her own ones that must be complied with across all the JSPs in an application (and there are often quite a few of these, mind).

The second way to avoid the pattern is the programming designer. The programming designer is a very rare breed. They are creative personas with an understanding of usability, colors, spaces and kindness to the eye in general. They also have basic skills of programming, master CSS and JavaScript, and are in essence able to work on the same JSPs as the programmers do. Not creating functionality or content though, but simply tweaking the div's and the id's.

Needless to say, the interests and motivations of a designer are very far from those of an innate programmer. I think one could even draw the conclusion that these two professions draw quite opposite personality types. Perhaps this is also why we often detest the products of eachother.

Me, as a programmer for instance, I hate doing web design. I can never figure out a set of good colors that work. I can't get CSS stuff working, it's just stuff bouncing around. And personally, I'm a functional person, not esthetical. I can't see the point of improving design once you have achieved usability, although I do of course recognize that there is an actual need for this in attracting use and success of an application. What more, I envy this effect that often leaves the designers being the heroes of a successful web application as they make the outlook, the good looks, the bells and whistles.

Good architecture and good programming goes unnoticed (meaning that it only gets noticed when it's done badly). Yes, I am jealous :)

Still, spite the gap between our personas, I have seen programmers successfully venturing into the world of web design, as well as designers learning the skills and becoming adapt programmers. Some have even been doing both since they started of with their own LAMP application and had no way of outsourcing design nor programming. These are programming designers. I believe that EVERY web application project should bring one of these on board.

They have a role all throught the project. From the beginning they can maintain a prototype application of static HTML pages. Moving on the start assisting the development of the infant JSPs, making sure that the programmers take no wrong turns in the use of HTML. Continually, they do their magic and paint the functional application with their magnificent colors, scripts, images and layouts using the optimal techniques of seperated CSS and JavaScript files. They ensure that the application follows all relevant standards of W3C, ensuring accessability and correct design in all Internet browsers.

I would also like to note that inversion of design/design injection can be done with SiteMesh, which is a great tool for templating and page modularization. This is a good way of giving the programming designer a file/decorator/template where he or she can work freely while not interefering with the tangles of the programmers.

Comments

Popular posts from this blog

Open source CMS evaluations

I have now seen three more or less serious open source CMS reviews. First guy to hit the field was Matt Raible ( 1 2 3 4 ), ending up with Drupal , Joomla , Magnolia , OpenCms and MeshCMS being runner-ups. Then there is OpenAdvantage that tries out a handful ( Drupal , Exponent CMS , Lenya , Mambo , and Silva ), including Plone which they use for their own site (funny/annoying that the entire site has no RSS-feeds, nor is it possible to comment on the articles), following Matt's approach by exluding many CMS that seem not to fit the criteria. It is somewhat strange that OpenAdvantage cuts away Magnolia because it "Requires J2EE server; difficult to install and configure; more of a framework than CMS", and proceed to include Apache Lenya in the full evaluation. Magnolia does not require a J2EE server. It runs on Tomcat just like Lenya does (maybe it's an idea to bundle Magnolia with Jetty to make it seem more lightweight). I'm still sure that OpenAdvant

Encrypting and Decrypting with Spring

I was recently working with protecting some sensitive data in a typical Java application with a database underneath. We convert the data on its way out of the application using Spring Security Crypto Utilities . It "was decided" that we'd be doing AES with a key-length of 256 , and this just happens to be the kind of encryption Spring crypto does out of the box. Sweet! The big aber is that whatever JRE is running the application has to be patched with Oracle's JCE  in order to do 256 bits. It's a fascinating story , the short version being that U.S. companies are restricted from exporting various encryption algorithms to certain countries, and some countries are restricted from importing them. Once I had patched my JRE with the JCE, I found it fascinating how straight forward it was to encrypt and decrypt using the Spring Encryptors. So just for fun at the weekend, I threw together a little desktop app that will encrypt and decrypt stuff for the given password

What I've Learned After a Month of Podcasting

So, it's been about a month since I launched   GitMinutes , and wow, it's been a fun ride. I have gotten a lot of feedback, and a lot more downloads/listeners than I had expected! Judging the numbers is hard, but a generous estimate is that somewhere around 2000-3000 have listened to the podcast, and about 500-1000 regularly download. Considering that only a percentage of my target audience actively listen to podcasts, these are some pretty good numbers. I've heard that 10% of the general population in the western world regularly listen to podcasts (probably a bit higher percentage among Git users), so I like to think I've reached a big chunk of the Git pros out there. GitMinutes has gathered 110 followers on Twitter, and 63, erm.. circlers on Google+, and it has received 117 +'es! And it's been flattr'ed twice :) Here are some of the things I learned during this last month: Conceptually.. Starting my own sandbox podcast for trying out everythin

The academical approach

Oops, seems I to published this post prematurely by hitting some Blogger keyboard shortcut. I've been sitting for some minutes trying to figure out how to approach the JavaZone talk mentioned in my previous blog-post. Note that I have already submitted an abstract to the comittee, and that I won't publish the abstract here in the blog. Now of course the abstract is pretty detailed on what the talk is going to be about, but I've still got some elbow room on how to "implement" the talk. I will use this blog as a tool to get my aim right on how to present the talk, what examples to include, what the slides should look like, and how to make it most straightforward and understandable for the audience. Now in lack of having done any presentations at a larger conference before, I'm gonna dig into what I learned at the University, which wasn't very much, but they did teach me how to write a research paper, a skill which I will adapt into creating my talk: The one

Managing dot-files with vcsh and myrepos

Say I want to get my dot-files out on a new computer. Here's what I do: # install vcsh & myrepos via apt/brew/etc vcsh clone https://github.com/tfnico/config-mr.git mr mr update Done! All dot-files are ready to use and in place. No deploy command, no linking up symlinks to the files . No checking/out in my entire home directory as a Git repository. Yet, all my dot-files are neatly kept in fine-grained repositories, and any changes I make are immediately ready to be committed: config-atom.git     -> ~/.atom/* config-mr.git     -> ~/.mrconfig     -> ~/.config/mr/* config-tmuxinator.git       -> ~/.tmuxinator/* config-vim.git     -> ~/.vimrc     -> ~/.vim/* config-bin.git        -> ~/bin/* config-git.git               -> ~/.gitconfig config-tmux.git       -> ~/.tmux.conf     config-zsh.git     -> ~/.zshrc How can this be? The key here is to use vcsh to keep track of your dot-files, and its partner myrepos/mr for o