It’s hard for me to understand how someone can design for interactions in a static environment. Let me explain.

On a project at my current job I’m working with a client who is also a designer. I’ve had to take their Photoshop documents (>150mb PSD file, ouch), make them “pixel perfect” (not my term), and design some additional pages they have not (it’s an eCommerce site).

Typically, I would sketch and then move to HTML/CSS. But, I couldn’t do that with this client because they already had some Photoshop files and that’s what they wanted back. To start, I thought about how limiting Photoshop is. I’ve read about people designing for the web in Illustrator, and thought about that, but decided against it. I decided against AI because I wanted to learn Fireworks, and thought this would be a perfect time. I could still provide the designer with PSD files (FW allows for PSD exports of each page), and still provide developers with enough of a prototype that, hopefully, between the FW HTML output and my notes, they could understand the flows. I’m still not happy with this route because I can’t customize things like I would if I was using some jQuery script.

While doing this, I also started work for another project in Axure. I had never used Axure before, but the project was relaxed enough that I didn’t have to worry about a learning curve and how much of my time would be eaten up by learning something new. After a couple YouTube videos it was smooth sailing. The interactions were easy enough to pick up on and I could add notes inside the prototype to assure the dev understood the more complex pieces.

I couldn’t imagine designing in a static environment and handing these files off to a developer for them to implement on their own. There would end up being so much back and forth like, “Ok, is this menu supposed to slide down on hover or fade in? If it’s fading in and out how long should it take? What about this image slider? What type of transition should I [the dev] be using - fade, slide, cut, etc?” I would be very frustrated as a developer, because these pieces are important, and need to be designed.

Many designers will say they need Photoshop to create their graphics and buttons… and that’s fine. Go ahead, use Photoshop for things that are static. However, when you’re designing for the web, understand this is a place full of interactions, and that’s what you need to be designing for.

Hudl is a sports video editing company based out of Nebraska. They allow coaches to upload their video footage, edit it, mark it up, and distribute it to their team. In doing this, it cuts out a lot of time coaches would normally spend burning dvd’s to give to their players. Hudl asked me to take a crack at redesigning their Manage Roster feature. To present my findings and prototype, I wrote a little article on my process.

You can read the article, and view the prototype, here.

The Problem

Parking your vehicle in a parking garage/deck is one of the worst experiences I have every few weeks. Any time I go to the mall, my boyfriend and I often park in the deck, and every time I freak out. Maybe the mall location is a bit worse, since there’s always a lot of people in that given location, but even somewhere local in our mid-sized town is a piece of work.

You drive up to the ticket spitter-outer, realize you’re too far away so you have to keep your foot on the brake, take off your seat belt, extend half your body out the window, push the button and reach even further for a ticket. Now there are 4 cars behind you waiting. You wait a few seconds for the barrier to be lifted, and you start your search for a spot. Don’t even bother with the first level, not worth it. So, you try and make your way straight to the ramp. Good luck. Someone is trying to back out, and the person in front of you wants their spot. Wait. Wait. Oh, great, the oncoming traffic of vehicle’s don’t feel it necessary to extend forth basic common courtesy and let a vehicle back out of the spot, so now it’s been three minutes and the guy just cannot for the life of him back out. Your patience grows thin. You start wondering why you even bothered; I don’t need that god damn waffle iron. This isn’t worth it, what was I thinking? Ugh.

At this point, you’ve gotten the guts to go around the guy in front of you, heading straight for oncoming traffic. Faster, faster. Ok, good, I didn’t cause an accident. Ten minutes later, that same experience three times, and you have a spot at the top of the deck. Ok, whatever, let me just go in and get this waffle iron and then I’m out of here. I shop and return to my car. I now become the asshole I was so mad at earlier who wouldn’t let people back out of their spot and just glide down the ramp, not a care in the world. Except, I forgot to pay at the kiosk. Really, parking people, I have to take my ticket with me and pay at the kiosk? Come on. Don’t make this harder than it needs to be. No one is manning the booth! Mini freak out. Where is the nearest kiosk? I have no idea! Shouldn’t one be by the office that no one is in? Yes! Score! At this point my car is unattended at the exit and there is a line building behind me. I’ll end this narrative here.

This service could be far better designed.

This is what I usually see when I enter a parking garage:

^{_{Photo courtesy of kpao.org}}

No one knows what to do. Every vehicle here has taken a ticket, yet the ticket gives them no valuable information about how to navigate this garage. Instead, most often it tells them what time they entered the garage so the company can be sure to get their money when they leave.

When you’ve made it to a ramp and level that is less crowded, if you’re really lucky, you’ll see this:

^{_{Photo courtesy of projectpoppycock.com}}

Ah, the person who thinks their 1 vehicle deserves the same amount of space dedicated to 2 vehicles. Of course, they’re super important.

Now that you’ve found a space to park, time to have fun. You return from your trip, and if you have a good memory, you remember you need to stop at the kiosk. If you have a really good memory you didn’t forget your ticket stub in your vehicle.

The kiosk. A lot of the time they look like this:

^{_{Photo courtesy of montgomerycountymd.gov}}

^{_{Photo courtesy of aspenpitkin.com}}

These are confusing for everyone. How often are you waiting in line at a kiosk similar to those above because someone is trying to figure out what button to press, where to insert their credit card and what task to start first? For me, it’s every time.

Sometimes you’ll hit the jackpot in the parking kiosk world and get one that has a step by step process, like this:

^{_{Photo courtesy of bellinghamherald.com}}

Still, hard to follow.

All in all, a process that was never designed to meet user needs, just business goals.

So, how can we fix it?

I’ll have my thoughts on this soon.

As I was reading through Julius Tarng’s blog one day, I came across a photograph of a water bottle and I fell in love. I didn’t need a new water bottle, the plastic BPA free one I had at the office was serving its purpose. However, I couldn’t get over the design of the Takeya Classic Water Bottle, so I had to have it. 

It’s made of glass, with a silicone sleeve, so it’s pretty darn heavy. I got the black, and immediately wished I had gotten a colored version. I wish the sleeves were interchangeable since they have quite a few color variations. But, I wasn’t going to let that be a deal breaker. I brought it to the office, and while I had to have the 22oz version (I fill up a 22oz bottle around 6 times a day), found myself wishing I had gotten the 16oz, if only because it’s height is a bit large; I have trouble getting it underneath the water dispenser at work, as that space isn’t too large.

While the handle on the bottle was a large reason I bought it to begin with, I’ve found that when drinking out of the bottle, the handle rotates so it’s hanging right below my mouth as I’m sipping. It’s not a big issue, as it never gets in the way, but a slight annoyance. I guess the decision to allow the handle to rotate in a circular fashion took precedence over having it be slightly annoying while drinking out of it.