Graphic stuff.. almost done.

(L-R: Ivan, Peter and Mats)

It started off with a couple of layouts Mats made in Dubai, and then we worked in cycles to refine the different pieces which make a webpage look good and usable.

We gathered a group of interested logistics staff (those with the red hats) and webgurus (those with green noses), who commented on the the layouts through a discussion forum on Quickr.

Every week, we would gather for an hour, and agree on the different topics covered in the discussions, after which the graphic designers could further refine the mockups.

After three weeks, it came down to the little details, and we asked Ivan - one of the professional designers - to work for a day in the office (picture above). The end result is the designs people are now voting for.

Hover-over Navigation!

We had a big discussion today about the navigation system we wanted for the portal.

Both me and Peter are very persistent on what we want and if we feel we can't have something implemented because it is ”the way we work”, ”Our old standard system cant do that ” or ”we never did that so we don't want to do that” type of answer, then by default neither of us will ever give in ;-)

By coincidence we had seen a very good navigation system on a website for one of the potential suppliers we had shortlisted:


I think all people who saw the navigation agreed it would be a model for how we wanted ours to be. It is so smooth and have a pleasant way to expand out. The "only" thing different we wanted was to have Hover-over instead of clicking down in the navigation tree. Perfect we all thought and left it at that.

Yesterday Diana mentioned that there was a problem with the navigation when we hover. It would expand down but then jump in a crazy way when moving from one main group to another, especially if there was a lot of pages in between. I looked at it quickly but it looked simple enough to solve and I left it to think about over night. I could not see anything really problematic as the jumping itself we should be able to prevent with a smart code solution. Diana's boys are sharp so it might be more work but not impossible.

Today when coming back from another meeting one of the boys came over and wanted to chat more about it and I explained what I thought and the discussions got more and more heated. My smart coding solution did not really convince anyone. But ”yeah a smart coding might be the solution” Toby said and left the room in a voice and look on his face, saying ”This guy must be nuts”.

We ended the discussion without a solution but I could not stop thinking about it. I went back to the site we had found the navigation structure on. I was clicking away while thinking about how it would react if the clicks I made was already happening when I would hover the mouse over instead. Back and forth I tested to see what the problem would be. It was so smooth. I hover over and the menu expands down in a smooth very pleasant way. Then I go to the next main category... eh..eh... hmmm.. only then did I realize that if this was hover over, we would have created a menu that would make anyone leave the site and never come back, Ever.

If you have seen the small prank screens where they show a small pop-up window with a ”click here to cancel” button that you never can click as it moves when the cursor gets close. That is exactly what we would have created with our ”lets hover over expansion”.

What can I say : 10 points to Diana and her boys..

The graphic look of the Portal takes shape

Gradually, the graphic design of the new portal takes shape.

Here is how the current portal tryout sites look like (screenshot)



This is what the new one will look like.



We're not quite there yet. The top banner still needs tuning. But we are getting there.

Ma! Look what they 'done to my specifications!

Well, it looks like the tabs we specified (in this post), did the trick!

This is how Diana's graphic designers translated it:



Looks good, no?