At hedgehoglab we pride ourselves on the user-centered approach we use in designing our software, with our core product fixx seeing a number of iterations over the past few months, primarily in terms of UI design but more importantly in information architecture surrounding the views and the simplicity of use.
The process that we currently use consists of first deriving use cases of how the user will perform each operation in the system (in the form of user stories), then on to quick mock ups of real application screens in the form of wireframes (using a standard layout and component library) and finally short iterations of focused review by the entire team. We repeat this process until every use case of the system is addressed from a user perspective.
The problem with such agile reviews and lightning changes of the UI and wireframes is that it leaves some poor soul, namely me, to reflect these changes in the wireframes ready for another review. A time consuming job without the right tools believe me!
After hearing many good things from other Information Architects, we originally tried Visio for a while in the hope that this would allow for quicker iterations, but I found Visio lacking in visual appeal and there was always a bottle neck in duplicating effort by translating most Visio wireframes into visual designs after every iteration. In short, Visio sucked at providing quick turn around in terms of having realistic application screens designed.
The second option was opting for mockups in XHTML, thinking we’d save time further down the line when we could just tag some CSS, refine the XHTML and lo and behold, have a completed view. This, however, proved more effort than estimated with the intermediate & final CSS changes and mark-up tweaks ultimately ending in a mash-up of good and bad code, something we ended up throwing away and opting for a re-write. We also found that XHTML wireframes did not allow the flexibility or speed of change we required to make the wireframes as visually complete as possible.
So, what is it that has me ranting about wireframes and turnaround?…
Although not comparable to the likes of Photoshop and Illustrator (tools my designer chums swear by), Fireworks lends itself well to the needs of most web developers when it comes to slicing and dicing the visuals ready for a quick conversion into finished XHTML and CSS. It also allows us to create wireframes that are visually rich and are as close to the completed product as we would like. This also eliminates the step of producing plain wireframes in Visio first and then designing them out in a graphics package.
Working with Fireworks the past few days has seen about 10 iterations of the fixx UI go from a 5 hour job to no time at all. Each change was painless and immediate (and visually correct for everyone to review). Fireworks does a good job of keeping your pages and layers organised meaning exporting them into a reviewable image format was effortless and because Fireworks is out for both windows and mac (sorry Ubuntu fan boys, no Linux yet), we can all chip in when we need to and work on the UI of the system.
The end result? The fastest and most visually stunning wireframes & mock-ups I’ve produced in a long time with the advantage of ready-made visuals! All they need now are a little bit of eye candy thrown in, in the form of icons and content and we are away!
If you want to see sneak previews of the fixx UI we have put together keep an eye out for my next post where i will be discussing some of the changes we have made to the UI with plenty of screenshot goodness. Oh! And did I forget to mention that fixx will be entering internal beta soon at the lab?
Javascript is now part of a list of mainstream technologies on which the latest web applications and Web 2.0 is being built. Yet, it is surprising that a majority of Javascript code and developers seem to be stuck in the procedural paradigm where endless functions follow one another without any code organisation.
This is not an inherent problem in trivial systems but when we are heading towards SOFEA (Service Oriented Front End Architecture) and more applications are becoming browser-based, it can become a nightmare trying to maintain all the Javascript code. This essentially means that even where there is good use of object oriented Javascript, you could end up writing a large majority of code to just load, instantiate and configure objects.
However, while developing fixx (though we use some cool frameworks like jQuery), I noticed that we ended up writing endless amount of code to just instantiate objects and wiring up dependencies in these objects.
In a recent eureka! moment, I decided to do something about this on our last “lab day” and write an IoC container in Javascript. The result of this is Squirrel. As you guessed, it is “an IOC container in javascript”.
The current version of Squirrel is designed to ease the development of fixx client-side Javascript, allowing a greater decoupling between the complex objects that make up client-side code in fixx and resulting in code that is easier to test, maintain and extend.
A word of warning that Squirrel is currently in it infancy, but provides enough of an implementation of IOC to work with simple client-side applications.
Its been about a month now since we released version 1.0 of solomon our small business CRM & contact management software and we've been working harder than ever to get some of the features in that you asked for and we promised.
From 1.1 onwards we are giving you the ability to track your deals. With deals, you and your team can effortlessly track those lucrative deals you've been pitching for. As always we've focused on productivity keeping the user interface tightly focused on your contacts, how you work with them and the information you track against them.
With deals comes better integration with your notes and tasks. Tasks can be created, associated and tracked right there within your deals. Notes too.. ..In fact you can now associate any number of contacts, companies and users with a deal and coordinate your efforts to securing that big contract.
We've also added webCal support Thats right! Now all of your tasks seamlessly integrate with your calendar via the webCal format.
Finally we've had our resident design guru making some awesome design tweaks here and there to generally make the user interface look and feel that little bit slicker and for you techies, we've had our technical boffins, improving on the underlying REST API meaning you have more control over how you get to and work with your solomon data.
We've still got a few more features that we're aching to get in before we make the 1.1 release official but rest assured we'll be working even harder for another week or so to get this update out to you. In the meantime why not tell us what you think about what we're working on or tell us what you'd like to see in up and coming versions of solomon?