life in a smart mob

social networking and other stuff

Modelling User Interfaces

As part of my day job as well as my own venture, i am doing a fair amount of work researching modelling techniques. I've used UML etc for a number of years, but the position i am in just now is the architecting of an existing system (moving from VB6 to .Net) as well as architecting my own software suite. This puts a new light on things as I need to know the whole end-to-end process a lot better.

The current part i am finding most tricky/interesting is modelling user interfaces. Now, when i say that i don't mean graphically (hell i shouldn't be allowed to dress myself never mind put colors on stuff) - no i mean the flow, controls, navigation, screens, dynamic content and so on. The things that you know can be defined for a UI without actually designing the thing.

Now, this is something i thought about when i worked at IBM Global Services a few year ago when working on a presentation layer architecture, using Xml, Xslt and so on - how to abstract the UI enough from the end users so that i could get down to what they wanted it to do, rather than just look like. It turned out there was nothing obvious to help and so i wrote my own ideas and developed a failrly simple solution (treating controls as objects, javascript methods as business rules, pages as screens and so on).

Doesn't look like much has moved on since. Having read "User experience storyboards: Building better UIs with RUP, UML, and use cases" by Jim Heumann at IBM Rational and then "UML Activity Diagrams:Detailing User Interface Navigation" by Ben Lieberman at Blueprint Technologies as well as some other pieces, i am still trying to figure out what is best.

You see, one sees Activity Diagrams as best, the other preferring Sequence and Communication diagrams. I can see benefits from both, but I don't want to create diagrams for the sake of diagrams, so i'd be interested in how other people see this. You could possibly argue that the activity diagrams would be useful for mapping out the general navigation around the site on a per use case basis, with the sequence diagrams looking specifically at each possible action in detail.

I still find it strange that they do not have a front end UML notation - if you know of some specs out there, please let me know as i'd be interested in looking at them.

This should be an interesting journey for me as i'm going from interviews with director level business folks (for my own venture) to business details for my day job's system (which has a significant number of transations per week) to the detailed technical stuff and everything along the way. And what's great is that .Net is going to be at the centre of both :) Look out for more each week.

steven

Comments

Matthew Meyer said:

Iconix proposes a diagram type called a Robustness diagram that I have found useful in sketching out what a UI should do, separate from what it should look like.

It's bascially a class diagram with Boundary (controls), process, and entity sterotypes.

Here's some quick links I found that give a good overview:
http://pst.web.cern.ch/PST/HandBookWorkBook/Handbook/SoftwareEngineering/UCDOM_robustness.html


http://www.dca.fee.unicamp.br/cursos/EA976/Referencias/sd/sra.html


http://www.agilemodeling.com/artifacts/robustnessDiagram.htm

Hope this helps. It's worked well for us in trying to address what are similar concerns to yours.

Matthew Meyer
mjmeyer_2k2@yahoo.com
# June 10, 2004 4:21 PM

Scott Galloway said:

Take a look at the book Paper Prototyping - this has the best method that I've seen for this...
# June 15, 2004 8:16 AM
Leave a Comment

(required) 

(required) 

(optional)

(required)