For a long time I've been a fan of Jakob Nielsen's work. His articles on paper prototyping are brilliant. At my work we've used these methods before when doing major website designs with overwhelming success.

However what about web forms. For the most part as web developers we just slap it together and worry more about the back-end functionality more then how it looks to the users, let alone how easy it is for them to use. How many of us have written some ultra cool little application that only we know how to use? I know that I have. We are so eager to get to the part we love (code)that we skip over the most important part, how users are going to interface with our code. This is what Manuel Clement calls "pouring concrete too early".

UI Design is more important to the user than our code. Why? Because the UI is what they see. It's what the feel, its how they interpret our application. It doesn't matter how great the application is, if the UI is bad the user will assume the rest of the application is bad too. How many users are going to care that we used serializable classes, or that we've written our error log to be an RSS feed? None! We need to take care of the users.

Why use PowerPoint for doing Prototyping. There are three simple reasons:

1. Almost everyone has it and can modify your prototype. Yes, let them change labels, something as simple as this makes the stakeholder feel more involved, there for you'll have more buy in on the project.
2. No coding is involved. This is very important, if you start trying to auto-fill dropdowns using dynamic form objects you're missing the point. This is not the time to be coding, we are defining the user interface. While this may seem like a very simple point you'll be amazed how often you keep reaching for you IDE to start coding.
3. You can give the user a feeling of how the application will behave. With PowerPoint you can link to other sides. In fact you can create clickable areas and disable Advance Slide "On Mouse Click". This allows you to create buttons, links, radio buttons, etc.

Why Webforms
The reasons for prototyping webforms in PowerPoint is it allows up the ability to make changes quickly to define what the user/customer wants. Again our goal here is not to do any coding yet. By prototyping we are actually extracting the customers requirements in a feedback loop much like agile programming methodology does.

There's nothing worst then a marathon programming session where you've killed yourself to get the webform done, to turn around and have all your labels changed and to find out you didn't have a clear understand of what the customer really wanted.

Here is the current PowerPoint Toolkit I'm using for Webforms. This is done in PowerPoint 2007, which is amazing. The drawing tools are more useful and complete then in previous versions of PowerPoint. As I do more and more prototyping I'm sure this will grow. This will give you a starting point for yours.

Web Form Toolkit.pptx (45.21 KB)

The best advice I can give you is to just try it. You'll be amazed how quickly you can create a simple prototype without writing one line of code.

Also here is a some helpful URLs I used started.

• Code Horror: UI First Software Development
• Wireframe Prototyping Using Powerpoint 2007 (Video)
• A List Apart Paper Prototyping
  

Happy UI Designing

The thing about gluten-free living is that it isn't something you can do alone. It's hard hard work, and you need someone to help you through the tough times. I'm very fortunate in that I have a very loving family that do their best to be supportive. My Beautiful Wife is amazing. She's basically had to relearn how to how to cook, because almost ever recipe calls for wheat. Things you don't think about like gravy or chicken. My Beautiful Wife has to read every label in the grocery store every time we shop because things that didn't have wheat in them last week, do this week. There is so much work that she has to put into each meal, and I greatly appreciate it.

My brother J actually ordered a burger wrapped in lettuce for me from In-N-Out and that's how we discovered protein style. My Mom when I lived at home had to learn what had wheat in it, and she also had to re-learn to cook family favorites.

It really isn't something you can do alone. I'm thankful to my family for wanting me to feel better and working so hard to do so.

I have a project at work coming up that will require some dynamic charts. As I don't feel the need to reinvent a wheel that others have perfected before me, I decided to take a look at Google Charts. The first thing I noticed was that this was extremely easy to use. It took me about 45 seconds to create the graphic used on this post. For a pie chart all you basically have to do is set the data and the labels and you're done.

Chart Type:cht=p3
Chart Size:chs=250x100
Data: chd=t:20,40,5,10,5
Labels: chl=muffin%7Ccoffee%7Cscone%7Cbagels%7Cdounut
So the URL to call the graph looks like this:
http://chart.apis.google.com/chart?cht=p3
&chd=t:20,40,5,10,5
&chs=250x100
&chl=muffin%7Ccoffee%7Cscone%7Cbagels%7Cdounut"

As you see this is a very simple example of what Google Charts can do.The documentation is fantastic. You can create just about any chart you'd like. The short list is: line charts, sparkline charts, bar charts, pie charts (2D and 3D), scatter plots, maps (yes maps), venn diagrams, radar charts and the google-o-meter.  Google Charts is a very nice full featured Chart API that I know I'll be using in the future.

Happy Coding

One of the things I've been working on for the past week was automating some SVN (Subversion) administrative tasks. As I originally come from a Unix background my first  thought was to use PERL. In the past I've used PERL for lots of these kind of tasks on Windows Servers. ActivePerl made it very easy to install on Windows boxes. Heck I even had a PERL script that FTPed into a remote server and downloaded files with a specific extension and deleted the files on the remote server after the download was over. That script ran for 3 years with minimum maintenance.

However I thought this time I'd see about using Microsoft PowerShell. I have to tell you I think PowerShell rocks. The best way I can describe PowerShell is it's the Windows equivalent of BASH or Korn shell in Unix or Linux. It allows you write a shell script for repetitive tasks, just like any other shell. In fact I found the syntax for PowerShell to almost be a blend of C# and PERL. So I felt comfortable writing PowerShell scripts very quickly.

In SVN I wanted to add new files to the repository.  If you're using TortoiseSVN, this task is easy to do with the GUI. However I want files to be added to the repository any time a automated file sync happens. So I wrote a quick script for this:

$results = @(svn st)
$pattern = "^\?"
$re = new-object System.Text.RegularExpressions.Regex($pattern)
$resultCount =  $results.length - 1

for($j=0; $j -le $resultCount; $j++)
   {
    $add = $results[$j]
    $match = $re.Match($add);
    if($match.Success)
    {
    $add = $add -replace("^\?.{6}","")
    svn add $add
    }
}

Let's go over what this script is doing. First we load the results of the "svn st" command in an array. $results = @(svn st)

Now we use a regular expression to find the items that need added. These are denoted by the "?" at the beginning of the line. So we define the pattern and set the System.Text.RegularExpression object. (This is the .NET System.Text.dll) Then we set the pattern "$re = new-object System.Text.RegularExpressions.Regex($pattern)".

Next we create a $resultCount variable that holds the number of items in our array. This will be used in our "for loop". Now we look through the items in the array, and if the item matches the regular expression it will be added to the SVN repository. However there's one hicup. The file path to be added from our array starts with "?      ". So we need to trip that off. Again we use a simple regular expression and the -replace parameter, and now we have a correct path.

It's added to the SVN Repository and we're done. Well almost. We have to save the script into a ".ps1" file. However it won't run just yet. It has to be signed. Signing a PowerShell script isn't hard, but it does require some work. Scott Hanselman has a great post on his blog about Signing PowerShell Scripts that is just excellent, I highly suggest you read his tutorial.

Happy Coding

How much time do you spend on the computer during the week? I know I spend at least 60 hours a week. True I need a computer for my work, but that's still a lot of time spent in front of a machine. That's a lot of time not being active. I've been thinking about this quite a bit lately. Well Saturday May 3rd 2008 is Shut Down Day. The premise is simple, don't turn your computer on that day. See if you can go 24 hours without a computer. More important it's about realizing there is life "outside the monitor". I know I can do it, and I'm sure you can too!

I'm going to start by warning you that this post is a rant. A rant that I'm sure most Technology Workers have from time to time. A minimum of once a month I meet someone new outside of work and my family. After some chitchat about the weather or whatever we have in common that brought us to whatever event we are at to keep the conversation going they always ask "That" question, you know which one. "So what do you do for a living?". I hate this question.

There are two very good reasons why I hate this question. First, what I do for a living doesn't really tell you what type of person I am. If you'd truly like to learn who I am and what I'm about, ask me about my family or my hobbies. Ask me what I'm passionate about. These subjects are something I can speak volumes on with such enthusiasm we'd talk for hours. I'd be delighted to tell you what the Little Boy did yesterday. I'd love to tell about my Beautiful Wife, and how we meet, and how wonderful she is to me. Heck, I'll even be happy to talk with you about film verses digital photography and the merits of both.

My second reason, most people have no idea what I do. I'm not trying to be mean or condescending. It just from personal experience I know people who don't work in IT (Information Technology) have no idea what I do. They'll ask me what I do for a living and I say "I'm a Sr. Web Developer." And their eyes glaze over while their brain tries to connect any synapse to any other connection to the words "Web" and "Job". The most common reply is; 'my nephew just built a website, I should send you the link, you'll love it! It's got blinking banners and a cute little bunny picture, it's great!". Honestly this has happened at least a dozens of times. So in a futile attempt I try to clarify by telling them that what I write is Online Banking software. Again, the glazed over look, and then they tell me, "You know I have trouble logging in to my Online Banking, why do you think that is?" By this point I just simply shrug my shoulders and say, I have no idea and change the subject.

I'm sure by now everyone has seen an Apple iPhone. The iPhone's true genius lies in its user interface. The ability to scroll through lists with a swipe of your finger or to resize an image by putting two fingers on the screen and moving them apart is both brilliant and intuitive. This kind of innovation is what is needed for consumer electronics. I’ve had several PDAs including an iPaq with a full size keyboard attachment, yet I was never completely comfortable with it as a single source for all my needs. Most of the time I  carried a laptop around with me too. There always seemed to be this lack of understanding between me and the device on how we should communicate. Being left handed the handwriting recognition and I never saw eye to eye. The stylus was another point of contention. Poking at the device with an object smaller than a crochet hook just didn’t seem like a good way to interact with it, let alone try to put in anything more than a couple of words.

The Wii, and more specifically the Wiimote has shown that consumer electronics that are easy to use will rule the market. Let’s face it for the last two holiday seasons in a row people have lined up to purchase a Wii. There are a plethora of articles about the elderly using and loving the Wii. This is because Nintendo understood that changing how we interacted with the games was more important than having the most realistic graphic engine. I’ve played both the Xbox 360 and the Playstation 3, and they are amazing. The graphics are crystal clear and photorealistic. However they just aren’t nearly as much fun as the Wii. The Wii is just plain fun and anyone of any age group can play it. Again the Wiimote is the reason for this.

The Wiimote is a simple controller built on great technology. It connects to the Wii via Bluetooth technology. The way the Wiimote tracks your movements is done by a infrared camera in the remote, and the Wii sensor bar has infrared LEDs in it which the camera can see. Using these common technologies allow the Wiimote to be used for other uses. That is something that Johnny Lee has done and has done well. He recently gave a TED Talk in Monterey California. If you watch this video until the end you'll notice he gets a well deserved standing ovation.

If you haven’t heard of Johnny Lee he is a research scientist at Carnregie Melon University. Instead of using hyper-expensive hardware that most people won’t have a shot at even seeing he uses the Wiimote to do some amazing things with user interfaces. Being a person that wants to share these technologies he’s put the software that he’s written up on his website. What I really appreciate about his work is that he’s made it freely available, but also decided to use tools that are freely available to almost anyone with a computer and an internet connection.

I feel these kind of innovations are vital and I applaud Johnny Lee and his work. The great thing about these technologies is that you can get your hands on it right now. If you have a Wii, you can start playing with the software with just five dollars worth of parts from Radioshack. You can even buy the IR LEDs and the Safety Glasses with LEDs for under 20 bucks.