Who do you bring to the fight when facing a tough market, timelines and competition?
While excellent engineering talent is a must, there are many overlooked or under-appreciated roles that I believe are essential to the success of any software company – at any stage. I often hear the excuse: “We are too small of a company to hire a ________”. Well guess what? Your competitors have one, or maybe more, so SOMEONE at your company has to be taking on these responsibilities. You might be lucky enough to have these roles filled, perhaps these responsibilities are shared within your company, but ignoring them will soon land you in a lot of trouble. Lets get started with the 3 P’s that I believe are so important for any software project to succeed.
Is your software development a linear conveyor belt of bottlenecks?
This post describes my experience mixing Agile + User Experience design while building out the mobile site for thoora.com. While this process worked for us, it won’t work for everyone/every project, however it allowed us to minimize blocked tickets and maximize the time of our small development team. Breaking the work into manageable stories, and parallelizing the work early and often is a great technique to maximize output and manage the traditionally serial and inherently blocking jobs and responsibilities when mixing UX and Agile methodologies.
I often (wrongfully) ignore great examples of UI design outside the computer world. While making a connecting flight in Vancouver, I stopped to take a picture of this (in my opinion) great “User Interface”. It reminded me of Tufte’s Envisioning Information, although I’m sure there are many other books which better exemplify this point, maybe this one.
I am always reminded of an interview question a friend had a few years ago while interviewing for a PM position at Microsoft: “Design a information kiosk assuming that your target demographic is illiterate.” That’s a cool problem that I think a lot of people freeze on. It opens up so many ways of exploring perceptual psychology and visual affordances, and generally brings up some great design questions.
The above sign is printed in English and French (Canada’s official languages), Chinese (likely due to the large amount of Chinese visitors and immigrants going through Vancouver) and some visual queues for everyone else. But realistically, the visual queues are the main focus, and the labels are just supplementary information. An arrow showing which direction to walk, the picture of a man traveling, the Canadian flag, signifying domestic, and a green light… which to be honest Im not sure what means, but lets me know that going this way is good.
Does your application’s or website’s UI communicate well to your users? Do you rely too heavily on English labels? Do you rely too heavily on icons? Does your website pass the blur test (now that green circle makes sense)? I won’t open the debate of icons vs. labels, or even the discussion about Realism in UI design, I am just thinking aloud.
An interesting thought, which stuck me while passing by this lonely sign in the Vancouver airport .
I don’t know why, but I never really used Delicious.com (actually I had an account a long long time ago). I recently made a new account and came across an interesting UX scenario. It took me like 30 seconds to figure out how to actually make a bookmark (and yes, I was trying, and no, I am not an idiot). Once I figured it out, it was simple, but it got me thinking of an important web principle: “Make your core feature offerings DEAD SIMPLE to find.” While companies probably don’t like getting simplified down to a single feature, that is often what makes them popular. Using a technique from Steve Krug’s “Don’t Make Me Think,” lets see if we can figure out what some popular websites are trying to offer to us. Instead of showing a normal screenshot, each shot has a light gaussian blur applied to it. For me, this is how I often “see” my own work through the eyes of a new visitor. I also came up with some unofficial one liners for each:
Step 1: Create a Call to Action
It’s interesting, because you can find a lot of great design resources and AB tests on “sign up” or “buy now” buttons. However, I rarely see discussion on action items in terms of core functionality of a web application or service. This first caught my eye while reading “Designing Web Interfaces” (pg. 82-83) on “Clear Call to Actions and Relative Importance.”
Youtube: Upload and Share videos
Notice the bright yellow blob in the corner -- the "Upload Video" button
Digg: “Digg”/Rank stuff from the web
Notice the 3 yellow/tan blobs running along the left - "DIGG" buttons
WordPress: Write and post blogs
Notice the blue blob on the right - the "Publish" button
I made an analogy once a while back about error pages on websites. When you are browsing a nice website and you get slammed with a default or ugly error page, it is like going to a really fancy restaurant only to find a really terrible bathroom. Now this may seem like a really weird analogy, especially because I have seen some really nice bathrooms before, but ignoring this issue can really disrupt a nice meal, or for web users, can really disrupt their user experience.
Where did all my pretty colours go? I just wanted to watch cat videos!
Ideally, if someone typed in a URL wrong, or heaven forbid clicked a deadlink on your site, I think it is only fair to quickly explain the problem and help them along their way quickly. Remember, arriving at error pages is a frustrating experience. Your user did not mean to get there, and the customer is always right, so it is your job to apologize (if you choose) but more importantly comfort them so they don’t just leave. By maintaining the same look and feel, the users don’t have the huge context switch that they might experience on a default error page served by Apache or IIS. This is how we handled it at http://thoora.com (Yes I’d like to think we are somewhat fancy)
Maybe not as fancy as the bathroom at the Ritz, but hopefully it shouldn't ruin my customers' meal
Note the link to the main page which quickly ushers them back to the regular service. Now more and more you tend to see graceful error handling, but I think it is good not to go overboard. If we don’t clearly illustrate that an error has occurred the user might not even know that something has gone wrong. Now arguably one could say that hiding errors from users is good if possible, but if we encounter a 404 and the resource literally doesn’t exist, we should tell them. I have seen error pages that look exactly like other pages, so over designed it is hard to tell what is going on. Similarly, I have seen pages that treat a missing page as an invitation to serve me something completely different (although I might not be completely opposed to a recommendation of similar alternative pages). When something goes wrong, let them know and help them recover gracefully. This is especially true for the other type of visitors on your site. The visitors that probably visit more often than you think, and really care about these dead pages. The robots.
While decorating a bathroom, and having a guy handing you a towel is great, you still have to call it a bathroom. If you don’t, Google (et all) will be constantly directing some of your traffic straight to your bathroom instead of your dinning area. The robot needs to know that something bad happened and Apache (and most web-servers) will serve them the correct HTTP response code for you. I can’t talk about this without thinking of an old commercial I used to love. I laughed so hard every time I saw this (its been years since this campaign was run). Below is a screenshot of Firebug capturing a nice 404 back from a server. This lets your browser know, and more importantly the spiders/robots know that even though it looks nice, something went wrong (Tim Berners-Lee would be so happy).
Bots aren't as smart as (most) humans, they need help from time to time
So if you are going to fail, fail gracefully. And if you are going to customize your errors, make sure you don’t forget about the robots. On a side note I encourage all to use Google webmaster tools to see what the spiders are tripping on. Google is great at finding links you didn’t even know existed on your site ;)
This post will probably make people think I am insane for bring up such a small issue. But little things bother me, and this little thing has bothered me for years, and I have been waiting for Microsoft to fix this. No matter what email client you choose to use, there is a set of basic features that all must support. Once you start looking at competitve advantages, little features make the difference.
Target for today’s discussion: Windows Live! Hotmail
As a synopsis (to those who don’t want to read the whole post): Unlike all of its major competitors, Hotmail does not allow users to mark emails as unread within the context of reading an email. As a secondary, they provide buttons that don’t actually do anything.
I will also look at some competitors: Gmail, Yahoo! Mail, and Facebook’s Message Inbox
The left navigation area of 4 popular message/email clients
I use a lot of email clients, gmail/hotmail mainly. I also use 2 other lesser known clients but mostly to keep up on innovations in the UI etc. Over the years, (after gmail came out) Yahoo! Mail seemed to be the only client that made improvements or drastic changes to their interface.
I took this above screenshot because it demonstrates how I (and many others) use email. I generally try to keep my email box with 0 unread emails. As it gets closer to Friday my work inbox sometimes gets up to 10, but I am pretty good keeping it low. When I read a message and realize it is too long to read at the current moment, I mark it as unread. Similarly, if there is an important email, with vital information I will need in the near future, I will mark it as unread. Some clients allow the ability to mark or flag as important/follow up. Most clients allow folders for organization. Depending on the user’s level of organization they may have their own way of dealing with such messages. Personally, I like to mark anything as “unread” until I have fully closed off all ties with that particular issue. It is the one thing that at the end of the day, reminds me there is something outstanding (The big number beside my inbox).
I haven’t done a paper prototype since my 3rd year of University, and when I did, it was Black/White on lined paper. Feeling the need to brush up on some basic UX practices, I decided to let my work/nerdy side invade my Halloween (yes this post is a few months late).
This happened to me a while ago, but I recently stumbled upon the screenshots somewhere on my desktop (Yes take a screenshot whenever a website does something that pisses me off). This will begin my, hopefully abundance of, rant posts about otherwise great/successful software applications and websites. I found Twitter was much to short to fully express myself, but I’ll leave my twitter rant for another occasion.
The target of this post: YOUTUBE.com, yes you.. tube </bad joke>.
Youtube’s recent UI change (last quarter or so) has some new modules on their front page which include: recommended videos, popular videos by category (love this module), videos being watched right now (which I still don’t understand) and Featured videos.
Here is what I saw:
Look at all the great suggested videos for me to watch!
Ian Chan's Blog 