Anyway, because of all that other stuff that got in the way before I found what my calling in life was called (interaction design), I am now trying to catch up as quickly as possible by learning from the experiences of others so I don’t have to make quite as many mistakes that others have already have. I have experience with visual design and video so I have an intuitive sense for color and I know about typography, information hierarchy, and timing. Those have helped a lot so far, but I’ve decided to bite the bullet and register for courses at Cooper and UCLA Extension.

The Interaction Design Practicum at Cooper is an intensive 4-day workshop of the whole process from research to handing off a spec to developers. I need the hands on experience learning from seasoned designers. I also signed up for their 2-day Communicating Design course since that’s pretty much covering the deliverables that most interaction designers produce as well as the even more important aspect of presenting and selling designs to stakeholders. If those go well I’ll probably just continue through all their courses and do their certification program.

The UCLA course, User Experience Design for the Web, is probably going to be very similar since it’s taught by Jeanine Harriman and she used to be at Cooper. However, this course is online over 15 weeks so it’s a much longer engagement. I figure I’ll have to deliver a more substantial product at the end of that class. I also thought of taking a Drawing for Communication course through UCLA, but have decided to hold off so as not to get too overwhelmed balancing class with work. I know the drawing class is going to take a lot of time for practice. I’ll probably take that later this year after blogging about the results of these other classes.

While working on it in Flash, I decided to convey relationships by having different animations depending on the relationship between the page the user is currently on and the page the user is about to go to. Drilling down into a hierarchy would zoom in. Moving from one page to another on the same level would move side to side. Moving back up the hierarchy would zoom out. Leaving one site to go to another would fly across cyberspace (cached pages in the browser history) and arrive at the requested site. One thing I didn’t really decide on is whether the back and forward buttons would respect relationships or move from side to side. I included a small site map in the corner that shows the current page’s location in the hierarchy for reference. You can watch it here.

All of this could easily be applied to software or other digital products but I chose to apply it to the web to see what it’d look like. Apple has since, with the release of Leopard, introduced even more communicative animations into the Mac UI. They started pretty early with the cube transition for user switching and genie effect for minimizing, but have added more things like the transitions when using the Spaces feature, going to the next page in Preview, or in Time Machine when going “back in time”. Overall however, few digital products actually use animation effectively today. I’m tired of pointless animations in both AJAX and Flash sites that are purely for boom and sizzle instead of substance.

As a very practical tip, you could try doing this in your presentation with a deck of slides. Only use animations either when switching from one major point to another. Examples include subject changes or in preparation for concluding remarks. This is the same strategy those masters of temporal design use when editing film. Usually, all cuts within the same scene are immediate jump cuts because they go unnoticed and don’t distract the audience. Only at the end of a scene is there something like a fade out. Animation is a powerful tool because movement attracts so much attention from the user. It should be used more to communicate instead of distracting. Hopefully we’ll see more of this as time goes on.

Since we arrived on a Friday night, the other guests were already buzzed/drunk. They decided to have a group birthday celebration for anyone who had a winter b-day. Since mine was in Feb they asked what kind of cake I liked. I said German chocolate and thought that would be the end of it. Apparently they went out to Vons after that and bought a carrot cake, a German chocolate cake, Angel food cake, ice cream, and candles. Since they bought the cake, I felt obligated to partake in this alcohol induced bday celebration in all of its randomness. Add to this the stoned Brazilians who had come this winter to work at the ski resort and lived at the hostel in exchange for cleaning and the experience was complete.

The other cool part of the trip was just partaking and observing ski/snowboarding culture. Probably 90% of the people were snowboarding since its the cool thing to do this decade. All the skiers were older. All the people aside from my friend and me were female in the ski classes. I don’t know what all of this means but I have a feeling that skiing is very uncool these days. I chose to ski since it seems to be the more practical of the two. I figure I’d do the snowboarding thing next year. In general people were quite respectful despite the crowded slopes and lodges. It seemed very ritualistic like everybody knew exactly what to do. Everybody changing by their cars in the parking lot in the morning, lift lines with three lines merging without issue, and people un/gracefully weaving around each other on their way down the slope. It was a world away from the intense daily life of LA where you have to fight for every yard on the road yet it was only a few hours drive away. I think I’m hooked.

I was at Colin Moock’s AS3 Tour when I glanced at the guy’s screen next to me. All the colors on the screen were dark. At first I thought he had a custom interface on the app that he had darkened. But then I noticed that when he switched apps it was still all dark and that photos were also inverted. I asked him what was up. Without a word, he motioned to his keyboard ctrl + option + ⌘ + 8. I pressed those keys and my world changed. I now got more battery life on my MacBook Pro when I needed it at the cost of color accuracy. No problem for surfing or blogging. Plus it’s a neat trick even most power Mac users don’t know.

The goal is to decant liquid from the larger bottle into the spray bottle. The problem is that you either need a funnel or a steady hand to carefully pour from the wide spout into the narrow one on the spray bottle. Inevitably, some of the liquid will probably spill if you opt for the latter method (no pun intended). In all cases, the bottleneck (man they just keep coming) is the smaller of the two.

One idea is to stick something like a dish soap spout on top of the larger bottle. This would probably be the cheapest option since it’s not a custom spout. The downside would be the rate at which it would dispense the replacement liquid. Another idea would be to use a bottle with a spout that is just slightly narrower than that of the spray bottle. My third idea would be some sort of retractable pouring/funneling mechanism built into the cap of the larger bottle. Something like those pour cups built into the caps of liquid detergent except it would flip over and screw on reversibly and allow liquid to pass through.

Maybe this is over-complicating the matter and everybody else has a clean funnel even though I don’t.

Big buttons seem to be popular in the Web 2.0 aesthetic. From my experience, users love big buttons and designers hate them. Why? I’ll postulate on both.

My guess is that users like big buttons because it provides an illusion of simplicity. Part of this has to do with Fitt’s Law since it requires less precision to hit a large target, and the other part has to do with that fact that with bigger buttons you physically can’t place as many of them. It’s probably also the case that psychologically, the bigger the button, the greater the user’s sense of accomplishment upon clicking it. Hmmm. This button is large. It must be powerful and do a lot of work.

Why do designers dislike big buttons? Designers are control freaks that tend to prefer tight layouts that are perfect for a context. (That’s why so many of their heads explode when dealing with digital stuff where the context can shift quickly.) It’s similar to the reason they like small text when users prefer nice large text. The big buttons are harder to fit nicely into a tight looking layout because they stick out like a sore thumb. Plus, they take up more room than is necessary for those efficiency-minded Modernist types. My other theory is that since designers have heightened visual awareness, they notice details even when they are small, and thus big buttons are the equivalent of a screaming baby. Whereas the average user usually isn’t paying particular attention to every visual element (they’re doing whatever they came to a site to do) and wants the screaming element to direct them along.

The following is the deeply insightful IM conversation I had with another designer over the matter:

Dan: what do you think of big buttons?
Ryan: dont really like em
Dan: why? Same reason you like tiny text? (leading question)
Ryan: most of the time they seem too big, not needed. it reminds me of staples commercials. the easy button
Dan: people loved that
Ryan: big huge button
Dan: it was successful as an ad campaign
Ryan: people just want a btn to press and not have to do anything themselves and the bigger that button, the better
Dan: my theory is the satisfaction of pressing a big button for the power plus it also creates an illusion of simplicity
Ryan: what could be more simple than pressing a big button?
Dan: and IT IS easier to press a big target, you don’t have to be as precise
Ryan: yup cant miss it, 90 yr old half blind ppl could do it
Dan: i’m going to post this conversation on the blog
Ryan: don’t you wish there was big giant button that said click here to post this conversation to my blog?
Dan: yea, it would make my life easier
Dan: I wonder how well this sells
Ryan: thats pretty dorky
Dan: i want one
Ryan: it would be cool if it did something
Dan: like launching an app? the doomsday app?
Ryan: anything
Ryan: something
Dan: launches minesweeper
Dan: causes a BSOD
Ryan: at least ejects the usbs

At the risk of inciting class warfare, I think personal finances is one of the biggest things lacking in today’s education system (along with health/nutrition knowledge leading to obesity). The point of general education should be to churn out reasonably responsible and productive citizens. Money is one of those things that everybody uses but only an elite slice of the population understands. The knowledge of how to manage money is the key to everybody’s financial health. Yet nobody ever really teaches personal finance. The rich may teach their kids. But for most, it’s a matter of learning it on your own and most people just don’t have the drive to seek this stuff out since it’s not their passion. If it wasn’t for the internet, it would have been a lot harder for me to learn about all these different investment vehicles and how money works. It’s good to see some change now that the country is feeling the pain of irresponsible lending and spending.

P.S. I realize that this thing is sponsored by a credit card company. Though I’m usually skeptical of most PR, I’m willing to believe them this time when they say that educated, responsible spenders make better long term clients.

That’s why I’ve been so impressed by the fabric and materials technologies that I’ve noticed creeping into products over the past couple of years. Some of my favorites are those used in sports and performance clothing. From the spandex woven into t-shirts and jeans to give it stretch, to running fleeces that are impossibly warm for their weight, to jackets that block wind, repel water like it’s coated with oil, and still breathes at the same time. These all seem to impress me because of their seemingly magical properties.

I think my favorite material has to be bamboo. I remember having backyard fencing matches with my brother Asian style with bamboo stalks. The stuff is supposedly renewable and fast-growing like some miracle weed. None of this really matters if the performance sucks but I’ve found it exceeds cotton and wood in some cases. The NY Times had an article saying bamboo is overdone and bashing bamboo sheets. Apparently the author has never slept in the ridiculously soft bamboo sheets from The Company Store. The bamboo towels they have are also the softest towels I have ever encountered. This stuff is far better than Egyptian cotton. I also tried bamboo towels from CB2 but they came nowhere near.

Bamboo is also useful for things like salad bowls and platters. I like its earthiness, cleanliness, and durability. Case in point for bamboo is the company Bambu. Although I’m wary of bamboo cutting boards since Alton Brown mentioned in his knife episode of Good Eats on the Food Network that bamboo is harder than wood so it dulls knives more quickly than hardwoods. Eh. This stuff is still the best thing since…bent plywood.

Endless.com uses an AJAX sidebar that lets users filter shoes according to gender, category, brand, color, size, and price range. Keep in mind this was started back when AJAX was just catching on. The filters are composed of UI widgets you can interact with like accordion panes, sliders, and buttons with instant feedback. Click on your shoe size and instantly, the gallery of shoes to the right would disappear and only shoes that were in stock for that particular size would fade in. They’ve made refinements over the past two years. The fade effects are gone, the filters themselves are organized slightly differently, but overall it’s pretty much the same as when it first launched.

Why does filtering work so well for a site like Endless but less so for its parent Amazon? Filtering works for specialized niche sites where users are browsing rather than searching for something specific that they have in mind already.

First, filtering works when the store is selling only a couple classes of products. Amazon sells pretty much everything. Endless only sells shoes. Amazon uses filters for purchasing diamonds but otherwise it would be too overwhelming to use filters to browse its entire catalog. On Endless, the filter options are limited to shoe properties. This is a limited set that can fit in a single sidebar without getting too complicated. On the other hand I have found that the only effective means of browsing a huge department store like Amazon is through following a trail of suggested products.

Second, filters can only be applied to relatively clear and easily defined properties. In other words: objective criteria. You could start applying subjective categories like style but that introduces a bunch of issues. I might filter for “urban” shoes but be presented with options that I don’t feel are urban-looking at all. The only exception is if there’s a pretty clear consensus about something within a community. Something like defining furniture as mid-century modern-esque might work but it’s still a pretty loose criteria. And obviously, not all furniture shoppers are design freaks.

Third, the filters have to be visually located very near the data it is affecting. If the filters are tucked away somewhere, users are unlikely to find them or understand the relationship between the filters and the data. This is why effective filters are usually directly to the left or right of the data or above it. This way, when a user changes a setting, she sees the effect instantaneously on the data.

Finally, the hardest part of designing filters is figuring out what the filter criteria should be. The only way to determine this is to understand how the user thinks and what he would expect either through the designer’s personal experience and/or through research. Part of making these decisions is also what NOT to include. Keep in mind that the point of filtering is not to have the user arrive at one perfect product, job post, or flight. The goal is to present the user with a manageable list of highly relevant options and then let him decide.

I think going forward, we’re going to see a lot more filtering with enabling technologies like AJAX and Flex going mainstream. There’s just so much information being generated each day that search is no longer an adequate means of finding information. Like in education where a student doesn’t always know what she needs to know until she needs to know it, finding information is often the same. We don’t know what we’re looking for all the time. But often we can sense when we are getting closer to finding it. Steve Krug, author of Don’t Make Me Think, calls this sense the “scent of information”. Search isn’t going anywhere, but it’s going to be complemented by things like crowd wisdom and filters depending on the type of information being sifted through.

Several other interesting examples of filters:

Nike Store (adaptive filters change downstream filters depending on selections that come before)

Well-formed data | Elastic Lists demo (Elastic lists or adaptive filtering)

Kayak