Looks Good Works Well

Anti-Pattern: Needless Fanfare (Turbo Tax)

2009-06-25T11:00:00.000-07:00

I mostly love Turbo Tax (except when it tells me I owe a tax payment :-). But here is one that I found to be very annoying and a good example of an anti-pattern Theresa & I write about in our book... Needless Fanfare.

While doing my taxes back in April I was constantly going back and re-entering information that would hopefully bring my tax payment down (numbers below are not my actual tax payment :-)

Here is the real time version.

When turbo tax recalculates your tax burden it plays the Biggest Loser TV show's game of running the values up & down in a random fashion. The change in the videos below is from $10,533 down to $9,177. However at one point it goes all the way up to $98,000! Now we all know that "inside the computer" calculations are not done this way. Someone thought this would be cool way to call attention to the change happening.

But let me tell you this is a horrible experience. It gave me a heart attack as it ran up & down playing with "my money" till it finally said "ok, ok it went down". But because it does this nonsense it makes it hard to see what change actually happened (a variation on change blindness).

Now watch it in slow motion to see what it is doing.

There are other ways to signal a change. The most common is to spotlight the change for a brief moment usually using a fade anything technique (see these examples.)

Torturing me is not a good user experience. This is as fake as the Biggest Loser scale.

Anti-Pattern: Geek Speak (Facebook)

2009-06-25T10:03:00.000-07:00

Need I say more?

Big D Talk - 5/30/2009

2009-05-30T12:16:00.000-07:00

Thanks to all that attended my talk in Dallas. What struck me the most is the vibrant community of designers, innovators and startup incubation that is growing locally in Big D. From my visit to CoHabitat in uptown Dallas to the Big D Conference itself I found the same conversation threads that I hear every day in Silicon Valley. Maybe it's the immediacy of information available now that brings us all closer. Or maybe the economy is driving lots of people into consulting and scrappy self-funded or low-funded startups. But it is refreshing to see it in action.

For those wanting the Big D version of the talk (slight variation on previous versions) you can get it from billwscott.com/share/presentations/2009/bigd/DWI.pdf

An earlier version is available on Slideshare.

Designing Web Interfaces Book - O'Reilly Webcast

View more Microsoft Word documents from Bill Scott.

Speaking at Big D Design Conference this Weekend

2009-05-28T10:23:00.000-07:00

Happy to be traveling to Dallas to speak at the Big D Design Conference. Lots of interesting speakers. In particular looking forward to hearing Norm Cox's keynote as well as hear from several former colleagues: Micah Laaker, Jim Carlsen-Landy, Stephen P. Anderson and Adam Polansky.

I will be speaking on Designing with Patterns at the 1pm slot on May 30th -- a shorter version of my 3 hour workshop I gave at WebVisions 2009.

On the personal side I get to visit 2 of my sons, daughter-in-law, grandkids as well as mom and brother.

WebVisions 2009 - Bringing Design to Life

2009-05-21T15:34:00.000-07:00

What are the disconnects between web design & web development? How can the two work together more efficiently? What do developers wish designers knew?

I gave this talk today (May 21, 2009) at WebVisions 2009. Enjoy!

Bringing Design to Life

View more presentations from Bill Scott.

WebVisions 2009 - Workshop & Talk

2009-05-18T10:12:00.000-07:00

Excited to be heading to Portland for the upcoming WebVisions 2009 conference. I was fortunate to attend & participate on a panel at WebVisions in 2006. I found it to be a no-hype, practical conference with good speakers and excellent attendees. And of course Portland is a wonderful city.

Designing with Patterns Workshop
I will be giving a 3 hour workshop on Wednesday afternoon (May 20) starting at 2pm. Here is the planned agenda:

Pattern Overview
Survey of Pattern Libraries
Design Principles
Principle One: Make it Direct
Exercise: It's a Drag
Present Solutions
Principle Two: Keep it Lightweight
Principle Three: Stay on the Page
Principle Four: Provide an Invitation
Principle Five: Use Transitions
Principle Six: React Immediately
Exercise 2: Button Mayhem
Present Solutions
Q & A

Here is a description of the workshop.

In every field of design one of the first things students must do is learn from the work of others. They study and break down real-world examples in order to understand the underlying principles and patterns that make for successful design. Then they are able to apply these learnings to their own set of problems. Designing for web interfaces is no different. We are constantly searching for inspiration and practical guidance in solving the problems we face as designers each day. One approach to curating and applying solutions is through the idea of design patterns. Design patterns define a solution in the context of a real world problem.

In this workshop, Bill Scott will discuss the rationale behind patterns, present a number of excellent pattern libraries for your consideration (20+), and then dive deep into 100+ examples from around the web that illustrate good interaction techniques (design patterns) as well as the not so good (anti-patterns) all organized as a set of six design principles. The main idea of the workshop is to expose you to lots and lots of real world examples and discuss the nuances and best practices that can be distilled from the them. In addition there will be time for two group exercises -- both actual problems that are currently being worked on at Netflix.

Many patterns are discussed. Here are the main ones:

You can learn from the bad examples as well. Along the way, anti-patterns are pointed out. The anti-patterns discussed are:

I will also be presenting Bringing Design to Life which explores what designers should know about interface engineering and ways for engineering & design to work in synch to bring design to production.

Hiring! Sr. Web Flash UI Engineer - Interactive TV Position

2009-05-11T16:56:00.000-07:00

* UPDATE: POSITION FILLED. Thanks everyone for your help! *

I am looking for a top-notch ActionScript developer to join my Web UI Engineering team. The special emphasis is building interactive experiences for the television. In particular experience with developing FlashLite for embedded devices along with a solid engineering background is needed.

~~Here is my job posting:~~

POSITION

Netflix is bringing its movie service directly into millions of homes with Netflix Ready Devices, partnering with companies such as LG, Samsung, Microsoft, Tivo, and Vizio. The TV-based User Experience team is responsible for building the reference Netflix experience which is launching on a variety of new devices this year. In addition, the team is responsible for prototyping and testing new user experiences, advancing the state of the art for all Netflix Ready Devices for years to come. Over the last ten years, Netflix has developed the world's best personalization and movie finding technology - this team's challenge is to bring it to the TV and create a fantastic experience used every day by our growing subscriber base of over 10 million customers.

In this role you will directly build and engineer the TV-based user experience applying your talent with FlashLite and ActionScript. The engineering effort includes prototyping concepts with the design team, building reference platforms and implementations for our device partners and primarily creating production ready user experiences for millions of customers. As such you will need to have solid engineering skills with a strong background in simple design, agile methodologies and object-oriented development as well as an understanding of what makes a great user experience.

In addition you need to have excellent communication skills and the ability to work closely with design, product management and engineering to provide rich interfaces that are highly performant in a constrained environment.

REQUIREMENTS
Excellent knowledge of FlashLite, ActionScript 2.0 and 3.0
Strong modular design and object-oriented programming skills
Rapid prototyping skills
Solid understanding of web architecture (Flash, Actionscript, DHTML, CSS, Javascript)
Solid product development experience
BA/BS in Computer Science or related technical field desirable

DESIRED
Experience developing for embedded systems and/or TV set-top boxes
Experience in developing for multiple devices, application types, and browsers
Experience with C++ and/or Java

Interested?

[Link removed]

Talk: Video Available - Interactive Prototyping with DHTML (Mix 09)

2009-03-25T09:49:00.000-07:00

The video for my Interactive Prototyping with DHTML from Mix 09 is available for my prototyping talk.

You can also find all of the Mix 09 videos online as well.

Sr. Web UI Engineer for Netflix Site - Still Open!

2009-03-23T10:35:00.001-07:00

NOTE: This position is filled!

I am of course happy to announce that Kent Brewster will be joining my team working directly with Michael Hart on our developer API & Community team!

~~But just to make it clear I am still looking for a Netflix - Sr. Web UI Engineer to join the web site team.~~

~~From my earlier post:~~

As the new year has rolled around we realize that there are so many things happening and in the works that it makes sense to add a Sr. Web UI Engineer to our Web site team. Ever wanted to work at Netfix? Do you have awesome frontend engineering skills? Love to implement great user experiences? Then this is the role for you!

You can read all about it on the Netflix Jobs site or apply for the position on the LinkedIn posting. Or if you want contact me directly at b dot scott which is at yahoo dot com.

Talk: Interactive Prototyping with DHTML (Mix 09)

2009-03-19T14:00:00.000-07:00

Gave a new talk this morning at Mix 09 here in Las Vegas. It seemed to resonate with the crowd so sharing it hopes that others find it helpful in their practice.

One note, I am a fan of rapid ideation which is often hard to do in DHTML. Sketching as Bill Buxton points out is an incredible way to do this. Both Flash Catalyst and Microsoft Expression Blend 2 (version announced this week) get us closer to this vision. But often we need to prototype directly in the technology of our web site (often DHTML). This talk works to point out ways to make this faster and more error free.

Talk Description

Prototyping can be challenging. Especially prototyping in DHTML. But over the last few years a number of tools, techniques, libraries and frameworks have emerged making the task easier. Drawing from years of experience at companies such as Yahoo! and Netflix, come hear Bill Scott discuss these solutions and best practices for laying out pages rapidly, injecting interactive behavior and simulating data for prototyping your Web applications in DHTML.

Interactive Prototyping with DHTML

View more presentations from Bill Scott.

Hiring! Creative Director UX @ Netflix

2009-02-17T16:12:00.000-08:00

We are looking for a Creative Director for our UX team! Are you the right person? Do you know someone who is? This is an amazing opportunity to lead an incredible team of designers and work in one of the best places to work.

Here is part of the description:

Netflix seeks a creative leader with bold ideas and the ability to deliver them – both on our website and on the TV user interface.

In order to lead our design team you will need strong training and background in interactive and graphic design. Consumer-based Internet experience is required, and, ideally, you have some TV UI experience as well. A passion for movies is also helpful.

You are interested in a company that feels and behaves like a big, successful startup -- that considers its $1 Billion DVD-by-mail business to be a warm-up act for delivering movies instantly to the TV.

Your job will be to continually improve the overall site experience. You will have a laser-like focus on making it easy for Netflix members to find and watch movies or tv episodes they will love.

For full details (and a cheat sheet for the interview) see the full job posting on the Netflix job site. You can also apply there.

O'Reilly Webcast Video & Audio: Designing Web Interfaces

2009-02-14T12:24:00.000-08:00

I have been having trouble getting my audio synced to the slideshare version of my O'Reilly Webcast. Hoping that the good folks of slideshare can help me figure out an easy way to get it going.

In the meanwhile, the O'Reilly team has placed the live video & audio feed from the webcast on YouTube. This video will give you a clear idea of what is kind of material is covered in the book.

NOTE: For best experience, watch it on the YouTube site in high resolution. http://www.youtube.com/watch?v=LW4MwvgW_ww&fmt=18

Interview: What Developers Wish Designers Understood

2009-02-12T10:53:00.000-08:00

Lou Rosenfeld interviewed me on the topic "Bringing Design to Life: What Every Designer Should Know About Interface Engineering". This is a really interesting subject and gets to the heart of how to get engineering and design teams to work together better.

The interview gives you some of the points I will cover in my upcoming webinar on the same topic (Feb. 26th, 10AM PST/1PM EST).

Also there is a short video presentation (about 7 minutes) that provides a sneak peek into the webinar presentation.

Use code RMWBNR for a 20% discount off your ticket purchase.

Oodles of Screencasts Available for Designing Web Interfaces Book

2009-02-10T18:16:00.000-08:00

Last Friday night I uploaded about 390 interaction movies (screencasts). I have been collecting examples (good and bad) that illustrate various patterns and finally took the time to get them out on the Flickr Designing Web Interfaces site.

Details can be found on the Designing Web Interfaces blog.

O'Reilly Designing Web Interfaces Webcast Available

2009-02-03T17:33:00.000-08:00

I presented Designing Web Interfaces on the O'Reilly Webcast today. Almost 1400 people signed up and the actual attendance hit 862. We set the record for an O'Reilly webcast :-) And we had overwhelmingly positive responses to the talk. If you liked the talk & the material then I think you will enjoy the book.

If you did not hear the webcast, check out the slideshare presentation below. It will give you the best flavor for what our book is about (keep in mind much more is in the book with lots more details and guidelines).

The audio will be available in a week or so. Look for a post here when I get the audio to share.

Designing Web Interfaces Book - O'Reilly Webcast

View more presentations from Bill Scott. (tags: rich ajax)

Netflix Sr. Web UI Engineering Position - Open Feb. 2 2009

2009-02-02T16:28:00.000-08:00

NOTE: This position is filled!

Netflix - Sr. Web UI Engineer

As the new year has rolled around we realize that there are so many things happening and in the works that it makes sense to add a Sr. Web UI Engineer to our main Web site team. Ever wanted to work at Netfix? Do you have awesome frontend engineering skills? Love to implement great user experiences? Then this is the role for you!

You can read all about it on the Netflix Jobs site or apply for the position on the LinkedIn posting. Or if you want contact me directly at b dot scott which is at yahoo dot com.

Two Upcoming Webcasts

2009-01-29T10:03:00.000-08:00

On Tues, Feb. 3rd I will be presenting a short talk on Designing Web Interfaces as a webcast for O'Reilly. This talk is free and space is limited (and filling up fast), so if you are interested sign up now.

And a reminder on a completely different (brand new) talk I will be giving on Feb. 26th: Bringing Design to Life: What Every Designer Should Know about Interface Engineering. This talk comes out of my longtime experience bouncing between the design & engineering worlds and in particular lessons learned at Yahoo! and Netflix. This 60-minute webinar is initially available as a live class, and then is made available in a DRM-free recorded, edited format. By avoiding the travel required in attending a physical seminar or conference, you save money and reduce your impact on the environment. You are free to watch the webinar with colleagues in a conference room, making for an even better value. The cost is only $129.

Details here:

O'Reilly Webcast - Designing Web Interfaces: Principles and Patterns for Rich Interaction. Feb. 3rd (18:00 GMT / 1pm EST / 10am PST)
Rosenfeld Media Webinar - Bringing Design to Life: What Every Designer Should Know about Interface Engineering. Feb. 26th (18:00 GMT / 1pm EST / 10am PST)

Designing Web Interfaces Book Site and Flickr Companion Site Live

2009-01-16T10:51:00.001-08:00

I am happy to announce that the two companion sites to my book are now live.

designingwebinterfaces.com is the companion book site as well as the book's blog site. Look for some exciting articles on the blog in the next few weeks.

The companion Flickr site should also be helpful as it provides all of the book's figures under a generous Creative Commons license.

Upcoming Talk: Bringing Design to Life (Rosenfeld Future Practices Webinar) - Feb 26th

2009-01-15T09:20:00.000-08:00

I am excited about a new online seminar that I will be giving Bringing Design to Life: What Every Designer Should Know about Interface Engineering. This is part of the Rosenfeld Future Practice Webinars series (a joint venture of Smart Experience and Rosenfeld Media).

For the last 25 years I have been solidly focused in the world of user interface creation. At times I have been solely focused on design and at other times on interface engineering. At other times I have held both responsibilities at once (e.g., leading a UX team while leading two interface engineering teams). Having spanned both design & engineering, I deeply understand the challenges is translating ideas into products. For this talk I decided to focus specifically on how web designers can work in the most efficient manner with their engineering counterparts. It is the "stuff" that most engineers wish their design colleagues knew.

This 60-minute webinar is initially available as a live class, and then is made available in a DRM-free recorded, edited format. By avoiding the travel required in attending a physical seminar or conference, you save money and reduce your impact on the environment. You are free to watch the webinar with colleagues in a conference room, making for an even better value. The cost is only $129.

Join me on Feb. 26th (18:00 GMT / 1pm EST / 10am PST) for Bringing Design to Life: What Every Designer Should Know about Interface Engineering.

(Previous webinars include Luke Wroblewski on Modern Web Form Design and Indi Young on Using Mental Models for Tactics and Strategy. Also check their schedule for a complete lineup of monthly webinars.)

Also, if your are interested in purchasing materials from Rosenfeld Media, please use my discount code when you visit the site (good for a 15% discount): SCOTTWBNR.

Photo credit: Auroville: Under Construction from premasagar's flickr stream, Creative Commons License.

Update: Designing Web Interfaces Book Available for Pre-Order

2008-11-20T09:12:00.000-08:00

In an earlier post I mentioned our upcoming O'Reilly book, Designing Web Interfaces that I coauthored with Theresa Neil. The good news is we are getting very close to publish date -- December 2008 or January 2009. It is now live on Amazon and available for pre-order.

You can read about the contents of the book here and here.

The book is a partial outgrowth of various talks I have given over the last few years: Designing for Ajax, Designing Web Interfaces: Principles and Patterns for Rich Interaction and When Designers Get Too Clever: Anti-Patterns.

(By the way, the bird on the cover is the Guianan Cock-of-the-Rock and the image is from Johnson's Natural History. Yeah, I feel like strutting ;-)

The work on the Yahoo! Design Pattern Library also helped frame of lot of the ideas presented in the book (there are 75+ patterns discussed).

Additionally the work that Theresa & I did at Sabre Airline Solutions in documenting design patterns, performing heuristic evaluations on two dozen complex airline products as well as actively designing new solutions for the suite of products brought a lot of the principles to light while writing this book.

Two other items I am very excited about.

Companion Flickr Site
First, following the example of Luke Wroblewski (who also wrote the Forward to the book) we will be making all of the figures and illustrations (over 500 images) available on the companion Flickr site. In addition since many of the images are keyframes that illustrate steps in an interaction, I will be making the original screencast movie available on the flickr site as well. You can see an example of this for All the Web's Live Search (Yahoo! experiment that is no longer available). Like Luke, we will make all this material available via Creative Commons. You will be free to use it in your presentations, etc. We only require attribution back to our book.

Companion Book Site
Additionally, Theresa & I will be posting and keeping up to date a companion book site, DesigningWebInterfaces. We will be posting new examples, new patterns, new anti-patterns as well as links to other great pattern sites or books. Note, that it is just a "parked" page at the moment. Look for the site to be live around the book publish date. Stay tuned here for the go-live announcement.

Sr. Web UI Engineer for Customer Service Engineering

2008-10-28T16:24:00.001-07:00

** Update: Position Filled! **

We recently filled the position I posted earlier.

~~I now have a new position to fill -- Sr. Web UI Engineer for Customer Service Engineering. In this role you will help design and engineer a new suite of web-based customer service applications.~~

In the previous role it was challenging to find someone with the right mix of semantic markup skills, javascript prowess, css wizardry, and java/jsp experience. In this role the requirement to be a DHTML god is lessened. What I need is someone who:

Is passionate about designing and engineering great interfaces
Has solid experience designing & building enterprise web applications in a Web 2.0 manner (rich in features, more complex in interaction than our main Netflix site)
Has strong proficiency in server-side UI technologies (Java, JSP, Struts, Tiles)
Has a solid background in simple software architecture and design as well as can communicate their solutions to the rest of the engineering team

Your job profile will probably include a good deal of experience with building user interfaces for non-consumer oriented sites.

If you have always wanted to work for a site like Netflix, but were unsure you had enough consumer web site experience then this could be a great opportunity. The applications you will design and build are not for the main Netflix member site, but instead for our #1 rated customer service team.

The person in this role will be part of the Customer Services Engineering Team as well as a member of my Netflix Web UI Engineering team. Since much of the work is greenfield you will have the opportunity to help design the user experience as well as build the web applications. In addition, the Netflix UI framework that the site runs on is shared with these applications. As such you will help flesh out this framework as we go forward.

So what technologies would you be using?

HTML, CSS
JavaScript
Java
JSP
JSP Tags
Struts2
Tiles2
YUI Grid
jQuery

For more details, check out the official job posting. Also, feel free to contact me directly at b DOT scott AT yahoo DOT com.

Here is the LinkedIn Posting.

Designing Web Interaces Talk (Ajax World)

2008-10-21T09:53:00.000-07:00

Slides from Ajax World talk:

Designing Web Interfaces

View SlideShare presentation or Upload your own. (tags: design web)

Update: Yahoo! Account Fixed or "The Awful Face of Customer Service"

2008-10-21T09:34:00.000-07:00

As noted before I was having trouble with my Y! id. My alias account (that I give out most frequently) no longer worked.

As I mentioned my experience with emailing Yahoo! was really bad. Canned messages saying the same thing no matter what I wrote -- the only difference was the signature at the end.

Phone calls weren't any more helpful. After searching and finding the phone number, I called to explain the situation. It seemed we had reached the point where she finally got my dilemma. However just at that point of epiphany the phone went dead. Somehow we were disconnected. So I called again. Finally reached that point again and she promised me a response in 3-5 business days. Yea, right. That was 2 weeks ago and nada :-(

Fortunately I used to work at Yahoo! I still know lots of people internally so in parallel I sent them a note about my problem (as well as many emailed me when they saw my blog post). Once I got in contact with one of the leads on Y! Mail they got the ball rolling internally. Somehow my alias account got corrupted. It was now a "child" account (you can create parent/child accounts for minors) and could not be accessed. It took a little over a week but finally it got fixed. Very thankful to the hard work of some of the folks in the Mail/UDB/Member teams that resolved the issue.

This got me thinking though. What if I had not worked at Yahoo! before? Well this account I guess would just be dead and I would have lost that email address. I really don't see any other outcome.

It also got me thinking about the various faces of any company. If my only experience had been email then I would have felt that Yahoo! was uncaring and faceless. If my only experience had been the phone I would have heard a sympathetic voice but no follow through. But I happen to know that once the problem came to the attention of people inside Yahoo! they jumped on it and worked extra hours & the weekend to resolve the problem.

This is always the problem with anytime we have a problem with a company. It does not matter if the engineers inside the company are caring, dedicated people. The customer service organization is the face to our users. Unlike in most cases, I also had the unique perspective to know that the number of user accounts created on a daily basis is staggering. And the level of calls/contacts to customer support is huge.

I guess if I did not have the inside view I might have fallen prey to conspiracy theories -- seems that when people have a problem with a company it becomes personal or the screw up is really a way for the company to squash the little guy.

But it was not. Nor is it hardly ever that way. It was just an odd, rare bug that just happened to clobber my account that was not easy to detect and not simple to fix right away. And if the right people get it brought to their attention they work hard to resolve it.

YUI Carousel Component (2.6.0)

2008-10-14T10:54:00.000-07:00

On October 1, 2008 Yahoo! announced the release of YUI 2.6.0. This
release contained the official YUI Carousel component.

As you know, the intent of my carousel component was to fill in a gap in the YUI library. In 2006, I created the ycarousel component. Thankfully, many people have found it useful over the last 2 years.

Before I left Yahoo! in 2007, I spent some time with the YUI team,
discussed the ideas behind the way I approached my component, what I
liked about it and more importantly what I did not like about it :-)

The newly released YUI component shares some of the same
properties/api with my component but has been written from the ground
up. So I am excited about their
new carousel and encourage everyone to migrate to it instead of using
the carousel shown at this site.

The fact is you will get better support for their component. I am just
too busy with other projects to really support it the way I would like
and there is just no reason to cloud the space with two components
(even named similarly ;-)

You can find the new YUI Carousel component at the YUI library site.

The latest version of my carousel can be found at my site.

Ajax World Interview: Bringing Excellence to the Field of UI Engineering

2008-10-13T09:22:00.000-07:00

Jeremy Geelan over at Sys-Con interviewed me about the field of user interface design & engineering.

You can find the interview here.

I will also be presenting at the Ajax World conference in San Jose, CA on Crafting Rich Web Interfaces.

The talk is based on my upcoming O'Reilly book Designing Web Interfaces (co-authored with Theresa Neil). The session happens on Monday, Oct. 20th @ 4:30pm.