Human Life Value website -- hybrid: Xara (DPX 9), PHP, jquery, google visualizations

[jonazen]

This project started to be a simple cloning of a single page of an old site that a client wanted to move to its own URL with some additional info. The old site appeared to be very straightforward (if a bit ugly and dated). It really looked pretty easy: I'd create something new and prettier, add the extra content pages, and mimic the conversation between the web page and the back end CGI program that generated some of the content on the fly.

Suffice it to say -- it got a lot more complex after that -- but largely due to me encouraging the client to contribute design ideas, preferences, etc.

In the end, I've got a few pages assembled in DPX9, and augmented by a number of tools and tweaks, some provided by our sledger, without whose quite and helpful responses and tweaks I'd have struggled a lot longer. Acorn's jquery to handle wrapped links turned out to be a perfect solution for my FAQ page.

I've embedded jquery in the header part of placeholders (brilliant feature, Xara!), and calls to PHP code in the body portion of placeholders. Perhaps some of the more interesting parts of this involved having PHP embedded in a DP page, with the PHP code generating and writing out jquery on the fly as the page was processed.

I designed the more complex form using CoffeeCup's form builder, but in the end, I found that I could control both field-level AND form level validation by use of jquery. I didn't want to reinvent the form entirely, so I've stuck with this. But the second (and simpler) form I put together by hand. In the end, I think I may have discovered that although tempting, form builders may take just as much time as design forms and code by hand -- and the hand-coded stuff is much tighter, giving you more control over its function.

Instead of standard javascript alert boxes (which look different on every browser, and generally ugly anywhere), I included "Alertify", an open source javascript library to replace the need for standard alerts. Very nice visual effects possible with this.

If you go to the "Analysis" page and fill in all the parameters, the site talks via PHP "curl" a back-end server at my client's office, and gets an XML response. PHP parses the response, and writes out dynamic jquery that makes use of Googles "Visualization" library to generate really nice graphs and tables on the fly.

So -- yeah -- definitely more complex than I anticipated, but it came together nicely in the end. Now that I know how all the pieces should fit together, it needs some refactoring. But using Xara DPX9 as the primary design tool was invaluable, and continues to make ongoing support end edits incredibly easy.

Take a look at it here:

http://www.humanlifevalue.com/