Displaying object states with minimal UI changes (for large numbers of objects)
I've been tasked with a design challenge, which apparently seemed so simple for me, but I've almost come to a dead end.
There are states for an object that need to be represented visually on a page. For instance, the object ( a network group ) need to be modelled first. This is the stage where an admin creates a model of his network. The model then would be queued for the top-brass to approve. Once this is approved, it would move to a synchronized state. At this stage the model and the network are in sync with each other. If the user makes a change to the synchronized state, it would push itself to an updated state, which from there would follow the cycle of Queued and Synchronized again. Phew!..
So essentially, the states starts with MODELLED, once modeling is done, moves to QUEUED, once the queued model has been approved, it moves to SYNCRONIZED. Any changes on a synchronized state would immediately push it to UPDATED, and this when ready to be evaluated to again be moved to QUEUED...
I have to design visual representations for each of these states. The state of an object in its initial state (MODELLED) has already been defined earlier.
The task is to show the rest of the states with minimal pixel changes, should be clear ( since we would have about 3-4000 of these on the canvas at any given point in time .. it is an infinite canvas).. and they should not be dependent on just the color since accessibility is an issue.
The stake holders do not want too many icons also involved because that makes the screen look too complex with too many variations.