Great Moments in UI #1 – Forms

To date I’ve only touched on the not-so-great moments in UI, but since the study of user interface design is something I enjoy I thought I’d start posting about great UI I’ve seen around the internet or articles that really highlight great UI.

Mad Libs Styled Forms

First up is an article and example of “Mad Lip” styled forms by LukeW. Thanks to my coworker Adam for pointing this out to me.

Ron and his team ran some A/B testing online that compared a traditional Web form layout with a narrative “Mad Libs” format. In Vast.com’s testing, Mad Libs style forms increased conversion across the board by 25-40%. You can see a before and after view of the Contact Dealer forms where they ran these tests below.

I think there is a bit more at play here than just the mad libs styling. I personally find the new forms heading much more engaging. Not to disparage cars salesman, but they’re not especially known for their honesty, so changing the header from “Contact a Dealer” to “I’m Interested” to me really changes the perceived purpose of the form for the end user. Also the new form highlights what specifically the contact form is for. But the real star here is how the form is completely changed by wording it naturally. Gone is the feeling that you’re signing up for the draft.

I’m eagerly awaiting a chance to A/B test my own form using “Mad Lib” styling.

One drawback of Mad Lib forms though how well they scale for longer forms. By their nature they require labels within the fields and while natural text around the fields works as a label too I can see a longer form loosing out on legibility.

Tags: , , , , , ,

Image Loader 1.2

I’ve updated my jQuery Plugin, Image Loader, to version 1.2. A couple of people asked that it maintain the order of the loaded images when added to the DOM. So now Image Loader does just that while maintaining the asynchronous downloading of images.

If you’re by chance using my plugin I’d love to see what you’re doing. I built it with the idea of using it with the Cycle plugin, but in a manner that you can use it with whatever you choose. So if you’re doing something different let me know.

Tags:

T-SQL Tuesday: Spot Relationship’s with Database Diagrams

As part of this months  T-SQL Tuesday on “relationships” I thought I’d post about a handy feature in SQL Server Management Studio.

As the title of the article implies I’m going to discuss how database diagrams in SSMS can be handy to visually see the relationship’s in a database. But I think I could have also named the article “T-SQL Tuesday: Spot Relationship’s with Database Diagrams, or the Lack of Them”.

Out of the box and with a deployed database you may get a warning about trying to use a database diagram and that they’re not accessible. Quite often this is because the database does not have a valid owner. As always Books Online is our hero, you can use sp_changedbowner to change the owner. While you’re at BoL read this too, it explains database diagram ownership.

With that out of the way we can move on to the point of this article. Relationships!

SSMS’s database diagram’s when first made will ask you what tables you want to add to the diagram. Go ahead and add them all, you’ll end up with a nicely formatted diagram showing you your tables all lined up nicely with each other. Your results will vary but will likely be a mixture of the tables neatly arrayed with lines drawn between them … or … tables neatly arrayed one after another after another with nary a line to be seen. As they say, “Hope for the best but prepare for the worst.”

If you’re lucky and you have lines between tables rest assured that at least some tables have foreign keys between tables. But don’t rest too long because just because there are lines doesn’t mean there are enough of them (or there might be too many). It’s now time to look at each table neatly arrayed and familiarize yourself with the schema. I find that visually it is quite easy this way to spot likely candidates for FK’s. You’re also likely to spot other things, such as PK candidates, better normalization strategies, moments of sheer database schema genius, or pure database depravity. If you find the latter then…

Database diagrams are also great for spotting everything that’s missing as well. Orphaned tables are quite obvious sitting all by themselves, and again I find it visually easy to quickly tell if that’s the way it should be or shouldn’t be. If you find everything is missing you can start adding FK’s right there in your diagram. Simply right click on a table and you’re given quite a few options to start updating your schema. (See the warning below!)

Anyhow, I hope everyone gives SSMS’s diagrams a try. It does not replace sitting down and verifying your database’s relationship’s one by one. But it does make a great aid in doing so.

A couple of additional points to keep in mind when looking using database diagrams:

  • Remember there are times you might not want a foreign key. FK’s do imply overhead and in a performance consideration there may be a valid reason to not have them.
  • The diagram resizing isn’t really all that great, 75% means that the text is 25% less legible. Not very handy unless you want to get a REALLY high level view.
  • Go ahead and drag things around. I do all the time.
  • Try printing these out! Print to a PDF with something like CutePDF or if you’re lucky like I am with a large format printer print it out on a 3′ x 3′ piece of paper and start drawing all over it.

And finally a word of warning!

The changes you make in a database diagram can be committed! So don’t go trying to drop database objects in a production environment. I think it’s best practice to just not use them in production. Unless you’ve practiced your disaster recovery recently and feel quite confident in it.

Tags: , ,

EventVue’s Post Mortem

EventVue posted to their blog a post mortem on why they failed. Even though they say most businesses fail within the first few years you never get to hear from them post-failure. It’s sad to see anyone’s dream die, but there are valuable lessons to be had when those who fail discuss what they feel went wrong. Anyhow a couple of tidbits I found insightful for other startups:

didn’t focus on learning & failing fast until it was too late

I love how they stated it as not just learning but failing fast too. We all learn from failures and knowing what clients don’t like is just as helpful as what they do.

made compromises in early hiring decisions – choose expediency over talent/competency

You always hear how your first hires are the ones that matter most. What position are you hiring for, how do they fit the team and culture you want to build, where do you see them growing as the company quickly grows?

Anyhow, I appreciate the founders of EventVue posting what they did. It’s hard to let your startup go and harder still to admit what you did wrong. I’m sure in the future those that they’ll go on to start up new ventures that go further.

Fun with jQuery – New version of Image Loader

I released version 1.1. of my image preloader plugin for jQuery today. I’ve been having a lot of fun with jQuery on three different projects right now. I’m working on a tutorial which I hope to post here sometime next week on using jQuery to support nested data using ASP.Net MVC. Supporting nested data is actually quite easy with ASP.Net MVC but if you want to up the game and make the page a bit more dynamic you start juggling a lot.

On a different note I’m reading two great books right now. The first is Startup Nation, a look at Israel’s entrepreneurial efforts and why they appear to succeed. I’m about halfway through the book right now and really enjoying it.

The second book is a bit on the dry side it’s The Entrepreneur’s Guide to Business Law. It presents the material with a lot of “from the trenches” real world examples along with a fictional company walking through each stage where business law applies.

Tags: , ,

Image Loader – A Multi-Image Preloader jQuery Plugin

Last weekend I started my first jQuery plugin. It was for a piece of javascript I had used once and was about to use again and it occurred to me that this is exactly what plugins are for. Last night I finished it and released it on the jQuery Plugin site. You can see my apply named Image Loader Plugin on jQuery’s Plugin site right now. But I still made my own official site for Image Loader on my own site.

The plugin itself is fairly simple. You give it an array and it will load your images for you. I needed this because I recently used the jQuery Cycle Plugin for a slideshow for a client. The site loaded 20 rather large images and having the user just sit there and see nothing just wasn’t going to do, so some sort of loading splash screen was needed while images were loaded. And that’s what Image Loader does.

I approached this as an exercise to see what writing a plugin was all about and as a chance to write something that’s open source and supported for more than myself, basically to push myself in new directions. All in all it was well worth the time. Here’s few things I took away from this:

1. Turning my own code into a plugin for more than just myself forced me to look at the whole approach I took. So much so that I quickly changed how the plugin worked. It was originally made to only work with the Cycle plugin. So much so that it called it for you and you passed the options for the Cycle plugin as an option of the Image Loader plugin.

Dumb idea. 0 Extensibility? What was I thinking?

As I started turning the code into a plugin this just didn’t make sense. Why force myself into only one path? What if I want to use this for something other than this one slideshow plugin.

Now you provide a callback function where you can launch your own function. Here’s how it works.

	$("#slideShow").imageLoader({
	   images: ['images/image1.jpg'
		  ,'images/image2.jpg'
		  ,'images/image3.jpg'
		  ,'images/image4.jpg'
		  ,'images/image5.jpg']
	}, function(){
	   $('#slideShow').cycle();
	});

I’m quite happy I noticed this. And I don’t think I would have if I didn’t take this from the approach that someone else might find this useful. Even if no one else does it’ll save me time in the future.

2. As always it takes more than just code to make something. Once I had my plugin at a point I felt was release worthy I then needed to do a few things:

  • Give it a name! One that isn’t taken already… (hopefully)
  • Setup a page on jQuery’s plugin page.
  • Make a support and example page.
  • Package the whole thing up into a release.
  • Make a Twitter post about it.
  • Make a Blog post about it.

Really the only required things were the 1st, 3rd and 4th. But if I was going to do them I may as well do this the right way.

The name isn’t very creative, but I just wanted something that said what it did and wasn’t taken. I renamed it twice.

The project setup on jQuery is pretty quick and painless. It’s also customizable enough where you could honestly use it as your entire site. But since this is something I wrote I wanted people to see where it came from. Thus my own site as well. Anyhow you can’t do an example on their site.

Packaging it up was easy, but still I wanted this to be done nice so:

  • Pick a license. (I went with MIT)
  • Make a Read Me file.
  • Run YUI Compressor to make a minify version.
  • Clean up the style sheet and javascript a bit more.

3. Deciding when I had something release worthy was interesting. I already have two other features I’d like to add. Really I could have added these, but then I wouldn’t have a released plugin right now. And I would rather release often honestly. It’s not like this is for the iPhone and I won’t be able to get a release through the app store quickly. So this was great practice to start “releasing early”. Maybe I’ll release 1.1 tonight and practice “release often”.

4. Finally, I have the code on my computer here at home. No source control at all. Something I’ve been wanting to stop myself from doing lately. So I’m going to give GitHub a shot. Something else I’ve been wanting to do lately.

Like I said, this started as just an exercise to see more about jQuery plugins. But really it turned into an exercise to look at how I write software, a quick practice on getting something out the door and introduced me to GitHub too.

Tags: , , ,

Great Article: A Little Less Conversation

The only magazine I subscribe to is Inc. Magazine. I’ve been subscribing to it for a bit over two years and for the measly $10 a year I pay I feel I get many returns on my investment. And no, I’m not being paid to post this.

In the last issue Joel Spolsky had an article called “A Little Less Conversation“. It’s up now on Inc’s site and I suggest everyone to read it. I enjoyed it so much I brought it to work to share. I was a bit nervous to do this, because I know I have the ability to side rail a meeting with a joke in no time flat. However, the article is good and really highlights something I think we all know, that the more people you have in a meeting (or keep connected) the less effective it is and shows how it can really slow things down.

But communications costs add up faster than you think, especially on larger teams. What used to work with three people in a garage all talking to one another about everything just doesn’t work when your head count reaches 10 or 20 people. Everybody who doesn’t need to be in that meeting is killing productivity. Everybody who doesn’t need to read that e-mail is distracted by it. At some point, overcommunicating just isn’t efficient.

(emphasis is mine)

Anyhow, I hope everyone reads it and looks at their own teams. The information may be obvious, and I’m sure many either have inherently felt this at work or already knew this information. But it’s good to look around as your team grows and keep this in mind.

New Link: Lessons Learned by Eric Reis

I’ve added a new link under my Art of Software category. It’s to Eric Ries’s Lessons Learned blog. It’s really a must read now in my mind. I’ve been reading through his past posts. A couple of gem’s worth reading are:

Anyhow, his blog is well worth the read. I found this site looking  for a way to more coherently explain what I mean by Bootstrapping a company. I’ve always meant to do it in an efficient manner, not just out-of-pocket. This led me to the first link above which really explains quite well the direction I’ve been wanting to follow in my own ventures.

Tags: ,

Hello from Windows 7 an OS with “iPhone Moments”

I’ve been using Windows 7 and Windows Server 2008 RS (modified to look almost identical to Windows 7) during the day for a few months now and I’ve been loving it. At home though I’ve been using Vista on my main computer, where I do most of my design work and I’ve been hating it.

It’s not that Vista was out right horrible. It was just kinda horrible. And any bit of horrible in a software product really is too much of it.  Seems obvious but it’s actually hard to get rid of horrible at times. It shouldn’t be, but whenever you have lots of people working on something you have lots of ideas. Things get fractured communication and development wise, let alone “vision”. It’s sad but true. Not inevitable mind you.

But I digress.

I like Windows 7. In fact I have to say I like it enough that I no longer really care about Mac OSX. Mac OSX is nice, it has a few quirks that I don’t care for (where’s the maximize window button!), but with how incomplete Vista was feeling and how old XP was feeling I was seriously looking to give it a shot.

Then Windows 7 came along, and for the first time since the beta of XP I actually cared about Windows. With 7 I’ve had many “iPhone Moments”. These are moments I’ve termed from my initial few months with my iPhone, when I’d think of something and try it and it just worked. Windows 7 has provided many of these. Something Vista never did.

It really comes down to “iPhone Moments” for me and many other users. To get what you expect but to deliver it in a new manner. When I started thinking about this and my waning interest in Mac OSX I started to realize half of the appeal of Apple was the entire package, not just the OS. This is what Apple really gets, and what Microsoft only seems to get with the XBox and its development tools. The package deal is what really matters, the entire user experience.

So in the end what I really want right now is Macbook Pro hardware with Windows 7. An OS that supports all the apps I use and love and has those great moments delivering me what I expect in a new manner.

2010 Goals

Slightly late to the party in doing this post, but never-the-less, here it is. In many ways I started this blog to increase my professional endeavors as well as to share things I find interesting about the Art of Software. Given the former reason here are my goals I plan to complete on this front this year (along with a couple of personal goals as well). In no particular order:

Finish my Thesis: I’m a thesis away from finishing my Masters Degree in Computer Science and Business Administration. My thesis focuses on entrepreneurism involving cloud storage. I’d really like to launch the product I’m creating along with finishing my thesis, so this could be a double whammy.

Blog Twice a Week: I’d like this blog to be consistent. Life does happen, as it did this previous year, but I’d like to set a goal of at least posting twice a week.

More Social Networking: These are pretty low goals really, I’d like to get my LinkedIn connections up to 50 and Twitter followers up to 50. Both should be easily attainable.

Certify in SQL Server 2008: I wrote previously about how I’m working on my first certification and this is the year I plan on getting it.

This next one is something I’ve been wanting to do for a while, and looking at the first and fourth goals I’ve set above I’m really putting myself in over my head I think, but still, if you don’t just try to do it, it’ll never get done:

Write a Book: I’ve always wanted to write a book. And lately I’ve wanted to write a technical book. I’m not going for an 800+ page tome. But setting my goal on 200 or so pages and will either publish it as a free or paid for eBook. I feel that’s a good place to cut my teeth on writing a book. I’ve done technical writing as a profession so I know what’s involved, but I’ve never been published and I’ll have to be my own editor. Hopefully, I can find a few people to review it for me before I release it. Likely subjects are something on SQL Server 2008, though on what I’m not sure, or what I’m a bit more interested in at the moment is writing a book on Mono’s implementation of MVC.

To finish things off here are a couple of personal goals to add to the list.

To spend more time with my family: Losing my Dad this year really brought that into focus. I’ve already been pretty good at this, but I don’t want to let time slip by, so set it as a goal.

Trim 20% off my time for Bloomsday, a local short race in Spokane, WA my family does each year. Last year was our first year where we were not at the back of the pack pushing our kids in joggers. So I think this year I’ll actually train a bit and push my time down. That’s only 12 minute miles, so I think I can do that.

Well there’s my year, I think my theme this year is to “Finish and Improve”