Here is an interesting use of Excel. Use it to design User Interface Prototypes.
A UI Prototype is one of the steps we do while developing systems. It contains a clear and detailed user interface mocked up so that we can clearly find-out how end-users would react to such a system.
Now, there are a ton of great tools to build UI prototypes, easiest of them being pencil and paper. But I have been using Excel (ahem!) for creating UI prototypes for the last few years with great success.
In almost all the projects where I worked as a business analyst, I used Excel (or Powerpoint) to create clear, well defined UI mockups to show what the end system would look like. This has helped greatly in understanding various unstated needs of users and speeded up system development.
A Practical Example of UI Prototypes made in Excel
Today I want to show you a practical example of how UI prototypes designed in Excel helped me choose one alternative over other.
While creating Excel School sales page, I needed to clearly show both options and provide a way to select one of them for the prospective students. I had 2 ideas in mind. I wasn’t sure which one would work. My initial thought is to draw both of them on paper and show it to my wife and find-out which one she would prefer. But then, my drawing is as good as my skateboarding. Just plain awful.
Even though I cannot draw a peanut on paper, I can create a whole peach tree in excel. So I turned to it and created 2 exact mockups of what I had in mind.
Then I showed both of them to my wife. She pointed to the one on left.
So I went with that option and designed it in HTML / CSS later that night.
But, this is a lame example. What if I want to make a complex UI in Excel?
Of course my example is lame. But you can make complex UIs in Excel with same ease. Remember form controls? You can use them to quickly create a mock up of almost any system and show it to your users to get instant feedback.
Here is an example:
Download Excel UI Prototype Examples Workbook:
In this workbook, you can find above 3 examples. See them, play with them, poke them to get inspiration for your next UI prototype.
Do you use Excel for Prototyping?
As I said, I have more than once impressed my customers by quickly churning out a mockup using excel. You can easily add drawing shapes, icons, form controls and place them on the grid layout to give perfect alignment and look. I think this is a great use of Excel.
What about you? Do you use excel for UI Prototyping? Share your experiences using comments.
17 Responses to “Custom Number Formats – Colors”
You are right, Chandoo. I was playing with the colour numbers last week and some of them don't appear different from each other. Others are totally different from yours.
@Duncan
Each version of Excel, post 2003, renders colors slightly differently
Different language versions may also have different default color palettes
Hello in french
excel 2010
colo1 = couleur1 = black
[couleur1]; [couleur2]; etc..
@Hui, thank you very much again for this great post.
However - under Excel 2007, Hungarian version your solution does not work with color names. I've tried both English and Hungarian names, but drops an error message "not valid formats"
Do you have any idea how to solve this issue?
thanks in advance
@Andras
Without a Hungarian version of Excel 2003 I don't think I can assist
Have you tried using the colour numbers? I couldn't get the names to work (despite using an english version of excel). but it did work with the numbers though. I left out the "u" and was easily able to produce burgundy using [color9]
Here a possible solution: find an English version of Excel, write there the formats using English names, then open the file in the Hungarian version and see the translation.
In Excel 2007 I can't get the colour names to work e.g Sea Green but the numbers do e.g color3 - colour3 does not work so I must bow to the country that has stolen my language (ha ha!)
Hey chandoo, nice Tip!
Wouldn't be easier just apply some conditional formatting for negative numbers and another for positive numbers? Or there's some cases that you can't do that?
Unfortunately the TEXT function doesn't color the cell as number formatting does.
Hi Hui,
Great post Sir, love the new way of formatting with color numbers.
I am using 2007, and it leads me to the last color number 56.
Thanks Hui.
[…] explains how to set up custom number formats with a wide array of […]
Thanks Hui - works a treat!
Thank you, very helpful.
Trying to figure out if it is possible to apply color only to a part of the cell?
E.g. I have a value formatted as Accounting with a currency symbol.
Those I find somewhat distracting though necessary. If I could make them less obtrusive by coloring them gray while the number would stay black, that would be great. Tried tinkering with the format string, but didn't get the desired result. Single color for complete cell value works, but coloring just part of it could not be achieved. Maybe somebody managed that?
Exactly what I was looking for - thank you!
colour in the Australian doesn't work - we have to go American and no problem.
I always thought is was 56 colours notice you have 57. Cool.
thanks
Analir Pisani
Customised Microsoft Office Training Specialist
Sydney - Australia
http://www.azsolutions.com.au
Thank You!