Tonight I gave a presentation on Humanizing Technology at Miami Ad School. I hope the presentation was really inspiring despite the fact that it had very little to do with advertising. The students had seriously awesome questions and it was a pleasure to have time to talk to them afterward. Thanks to Mehera and students for having me. As promised I'm sharing my slides from this evening. Enjoy!

I recently spent a whopping 4 hours in an airport waiting for a plane to arrive. While waiting I decided to catch up on some of my favorite shows using NBC's mobile website which allows you to view full episodes on your phone. Before I go any further let me first say that I think NBC is an innovator for putting full episodes on a mobile site, they should be commended for that. The mobile website as a whole is easy to navigate and not run down with functionality no one cares about. Also during my 4 hour wait, it was an awesome way to occupy my time.

Episodes play in parts on the mobile website, in other words: each episode is broken up into about 4-8 Quicktime videos with a commercial baked into the front of each part. Since an episode is not one large video file, there is naturally time between the end of one part and the beginning of the next. When this happens there is a screen letting the user know the next part of the episode will begin soon. This is the trouble spot.

Before

Epic problems are bound to occur when you have a design, UX and development team who don't communicate -- I expect this was what lead to the following screen being implemented.  UX and design probably thought the developer would use the iPhone's native GUI, when really this was not the case at all. Instead of a developer pushing back and asking his/her design/UX team to re-think the approach to this screen or better yet suggesting solutions for the screen, they said nothing or worse yet...perhaps they weren't involved in the design/UX process at all. The screen below is the result  (Below image each problem is addressed individually)

1. In case you thought that because the image above is a JPG and that in the actual screen grab the spinner was actually spinning, you would be wrong. Under no circumstance does that spinner spin. Nope, instead it just sits there, dead, teasing us with its' spinner like appearance. WTF NBC, if you have a spinner on a page....well then make sure it spins! I have no interest in looking at a static picture of something that is suppose to move -- that's like sitting in a car that's not on: completely pointless.
2. Do you see a mouse on this screen? NO! Under no circumstances would you need to click on anything. On an iPhone (or any touch screen device really) you TAP not click. Copywriters take note.
3. Episode Part? Really?....really? Could you not have found a better way to say that?
4. Why is this in a box, I don't get it....it's not iPhone UI, it looks like crap...get rid of it.
5. Again...using native iPhone UI elements as an image in the hopes of providing a seamless experience doesn't work here, so don't do it.

Beyond using a single image static image, a multitude of copy flubs and implementation faux-pas, the image used is pixelated...the kind of pixelated that is like nails on a chalkboard to a designer's eyes. I'm going to file the pixelation under the 'lazy developer' files for now and move on.

After

In my re-design I had a couple of goals.

1. Make sure the user knows something is happening and that their content is being queued up
2. Correct the epic copy failures of the previous screen
3. Remind users they're being afforded the luxury of viewing TV shows on their mobile device because of NBC
4. Keep the file size reasonable, we are on mobile -- no one wants to wait for a loader to load
5. Use the peacock: NBC you have a fucking peacock as your logo...embrace the peacock! If I was NBC that peacock would load EVERYTHING. It's one of the most recognized logos in America, use it, remix it, animate it, love it.¹

By embracing the peacock (5) I am able to inform the user their content is being queued up with the animated NBC logo (1). This logo is also a way of reminding the user where they are, and that what they are watching is NBC programming (3). I adjusted the copy and hierarchy of the type to more accurately inform the user of what is going on (2). The final file size of the GIF NBC would use in their HTML is nearly half the size of the image they are currently using: NBC's image is 20KB compared to mine which is 12KB (4). That's right NBC, I pimped out your loading screen and brought the file size down.....what now?!

Taking it a step farther

While the design above reflects a change to the current DESIGN of that screen I actually feel that this screen is a missed opportunity for earning some advertising dollars. NBC could easily place a small advertisement on this page to generate additional revenue, the user is waiting anyways, popping an ad on the screen isn't going to hurt.

How to not make a user's eye's bleed and an advertiser's heart break

1. Don't assume that just because something is on screen for only 5 seconds that it can be dismissed. Five seconds is a LONG time online and it seems even longer when you're on a mobile phone because you don't have other windows open to browse while waiting.
2. Since 5 seconds is a long time, don't let your user think that nothing is happening. Inform them or entertain them with an animation or piece of trivia. Waiting is no fun, would you want to stand in a waiting room instead of sit in a comfortable chair?...I didn't think so. Don't be a douche bag to your user, if they have to wait anyways make the experience less unbearable.
3. If you have a screen that requires a user to wait anyways, why not earn some additional revenue from that time by showing them an ad. Advertising sucks, but since NBC is providing free quality content with probably 70% less advertising than a viewer watching on TV, they are well within their rights to collect ad dollars here.
4. Be careful writing copy for mobile. Many mobile devices no longer allow a user to click...instead user's tap. Also make sure you're writing copy that will makes sense to a user and if you can, don't be afraid to spice it up a bit.
5. Rub some 'Make my logo bigger cream' on it (kidding!). Don't make your logo huge, but make sure the experience is tastefully branded throughout.

A Message to NBC

Like all broadcasting companies, you too have your moments of weakness and this was clearly one of them. Since I enjoyed using your mobile website so much I'd like to provide the animated GIF I created (re-designed) to you (see 12KB animated GIF here), should you require source files as well simply contact me and I'll send them over as well. More importantly, take some pride in your work and embrace the gritty details as an opportunity to shine. While I was at the airport I probably spent about one whole minute looking at that ugly screen ya'll implemented, now you go look at that screen for a minute. Was it enjoyable? No, of course not. Now in the words of Tim Gun 'make it work'.

My name is Rachel Diesel and I am an art addict. I love art, I always have. I know I am not the only one who loves art, there are millions of art lovers across the world, which is why I was always surprised at the lack of a good website for information on the art world with the web 2.0 flavor I have come to expect of a good informational website. I was elated when I discovered NY Art Beat last week, finally the kind of site I expected and wanted to help me curate my artistic activities in the city.

NY Art Beat provides information on both their website and iPhone application. Both mediums are well designed (though I expect many additions and updates to the iPhone app, I would happily redesign the app for free -- contact me ;)) NYAB even provides an API to developers allowing their information database to basically go anywhere. As a developer, the prospect of doing a visualization of this information is extremely exciting!

Why I've fallen in love...

In NY there are about a million places to go see amazing, cutting-edge, inspiring art. Selecting, curating, and actually going to these events/exhibitions is nothing short of a small miracle at the end of the day. By the end of every year I can name at least five exhibits I missed because I put it off til the last minute and forgot the end date. I hear about exhibits all the time, I never can remember where they are if I remember them at all. NY Art Beat fixes this by allowing me to bookmark events and exhibits to my NYAB Account. Furthermore I can count on reviews of exhibits and up-to-date information about all the important art events in the city. This has become my new go-to place for my art world information.

To add to my absolute love for NYAB is a solid first version of an iPhone app, providing basic information on events around the town (GPS proximity filtering included!). My ONLY disappointments are that I can't sync my NYAB Account to my iPhone or pull the latest information to my device for viewing when internet is not available (pesky subways). That being said, I usually suggest that apps release with a lighter first version and build out from that. I hope to see these features added in the future.

What I expect in the future

Make it social

Much like the rest of my internet hubs (Hulu, Netflix, Twitter, Facebook, etc...) I expect to be able to share what I like, my recommendations, and events I'll be attending with my social network. I also want to see what my friends are doing. Facebook Connect integration would be great to find friends bookmarks, events and recommendations. Integrating Facebook Connect would also afford the iPhone an easy, pre-built login platform to retrieve user information. Another feature I think would be great is an event badge for bloggers who often talk about specific exhibits. This would not only help bloggers provide up to date information on exhibits without having to gather it all by themselves, but it would allow them to point to NYAB driving traffic to the site -- effectivly becoming a relevant in-line ad targeting it's desired demographic.

Make it .mobi

I am surprised when I see major websites that don't have a mobile version of their site, especially when the information on that site pertains to being out-and-about. If I had an android phone I would be pinching and zooming to try and see the information on the site. The extra time it takes to make the site mobile would be completely worth it in my opinion.

Make it intelligent

The more data you have, the more conclusions you can draw. Zappos knows what shoes I like, Netflix knows what movies I like, Amazon knows what books I like, FreshDirect even knows enough to remind me to buy my favorite items before I check out....NYAB should know what kind of art and art exhibits I like. The NY art world is huge, please put the content I'll like on the front page when I visit.

Remind me

If I have an exhibit saved to my account I should get a reminder via text or email before that exhibit ends. Furthermore I should be able to export or sync my NYAB saved events to my iCal or Google Calender. [CORRECTION: Email reminders are sent from NYAB]

Summary

If you're an art lover like me do yourself a favor and jump on this bandwagon. I'm super excited to see how this site grows, I think it really has the potential to become the best of the best when it comes to information, especially as expands into new locations.

Starbucks's first foray into the world of iPhone applications showed up in the App Store a few weeks ago. No now all of us advertising people can walk to Starbucks (SBUX) in our Nike (NKE) kicks then customize our morning cup-o-joe with our Apple (AAPL) iPhones and single-handedly bring back the economy.

I've taken a pretty close look at the app, and I think for a first version the app stands on solid ground. The design of the app is absolutely beautiful and maintains the Starbucks brand while remaining true to the fact that it is an iPhone application. The base level functionality is solid, it provides some great information to the user as well as including some standards we're used to seeing in branded applications such as a store locator. There are some areas however I feel the application stops short of living up to its true potential. I expect the intent of Starbucks was to launch with ground level functionality and then level up based on demands from the App Store reviews and ratings, customer feedback and (hopefully) metrics.

Design

About 80% of designs for branded applications out there are really disappointing, and of the ones that aren't disappointing, few of them truly excel -- this is a design that excels. The design of this app is a great example of how to do non-glossy, earthy designs for the iPhone. There is an attention to detail and craftsmanship that makes this app feel special. Despite a heavy feature set and multiple views there is a consistency to the style of the app. Further more the design uses unique (non-standard) functionality only to break up monotony (ie.) the Coffees Explore view -- details like this set this application apart.

Key Features

Store Locator & Invite a Friend

Sometimes I question whether early humans were actually nomadic or if they were just lost. As with most well done branded apps today, this app includes a store locator and its one of the best store locators I've seen to date. The app also allows you to easily invite a friend to coffee with you from within a store view, via your preferred method of communication. If you like calling, the app dials their number for you. Selecting email will populate a pre-written email appears for easy customization and sending within the app. Texting brings up an alert view notifying you that it has copied text to your clipboard, so in your Messages app all you need to do is paste and fill in a time. Your lazy bum doesn't need to do much, so you really have no excuse to sit in the corner acting profoundly emo while drinking your chai tea writing poetry.

Drink Customization

For those of us who aren't baristas or never will be baristas this app takes the complication out of the foreign language that is the menu at Starbucks or any other coffee shop for that matter. A menu should not be another version of the Rosetta Stone and I shouldn't need a translator to order in English in an English speaking country. Luckily the application simplifies the task to decoding the menu. The app allows you to easily customize any drink of your choosing. This is an enormous design challenge simply because of all the variables involved but it's was easy to use and well executed. Once you've customized your drink you can save it to your favorites, assign it to a friend (to remember their favorite drink, because you're a good friend) or send it to a friend via Bluetooth.

Bookmarking & myStarbucks

Because this application is information rich and the drill down to that data can be pretty deep having some type of bookmarking system is pretty much mandatory if Starbucks wants people to use their app. Luckily they realized this and provided their users with myStarbucks, you can bookmark just about anything in the app and it will save it here. It's also the first tab, so every time I open the app my preferences are there waiting for me.

Exploring Coffee

The Coffees tab allows you to browse a list of all Starbucks coffees this is great, but Starbucks has a lot of coffees. God forbid you're indecisive, on the run, and need a caffeine fix. Don't worry, Starbucks comes to the rescue allowing the user to select a type of flavor from the explore section in Coffees and it will provide a narrowed down list of coffees matching your preference.

Food Menu

This menu was a surprise to me as I don't think I've ever actually seen this much food in any Starbucks, but its good to see the possibilities I suppose. More important than seeing the possibilities is seeing what that food would pair well with and the nutritional information.

Common Themes

Starbucks is a meeting place

Coffee shops have historically been places that fostered conversation among people dating back to 16th century Mecca.¹ Starbucks realizes this. By implementing functionality that allows you to easily invite your friends, check if the store you visit has WiFi so you can work for a couple of hours, send a drink to a friend via Bluetooth, or save a friends favorite drink so that you can order it and have it waiting when they arrive Starbucks stays true to it's tradition -- not by ignoring newness and technology but by embracing it. And unlike other social technologies (ahem Facebook, Twitter and MySpace) this actually brings people together in a physical space rather than just a virtual one -- there's something nice about that.

Starbucks keeps you informed

You're busy creatures with a complicated life, we don't have time to dig for information about what Starbucks is trying to sell us. Starbucks doesn't know you're on a diet, and they won't open their doors at odd hours just because that's when its convenient for you (don't worry I think you're important). Starbucks at least gives you a tool to build your day around the stuff Starbucks provides for you. Whether it be nutritional information, store hours, menu items, coffee types or in-house amenities, Starbucks wants you to know what you need to when you need to -- they want to make your life easier, not complicate matters. That's what your job, your family, your friends and your lovers are for -- coffee is simple.

Starbucks as a coffee expert

I am not a coffee person, but I think it's really cool that Starbucks breaks down flavor options when selecting your coffee. I love wine and I know how daunting selecting a bottle is -- I imagine a coffee lover selecting their morning cup of joe could be equally as overwhelming. Furthermore allowing you to easily pair a drink to the food you ordered not only provides the customer with information, but should they choose to act on that information it could give them a better experience as well.

Starbucks knows you

Let's face it, Starbucks at the end of the day is a corporate titan. So for those of us who grew up in towns where coffee shops are run by the guy next door, with local art on the wall, live music and lots of couches -- going to Starbucks feels just a little bit like selling out. But at the end of the day the people who work at your local Starbucks are the people you live next door to, and they might very well know what you normally get every morning without you having to say anything. But if you live in a big city like New York, it is easy to feel like the intimacy gets lost with all the people, having a little pocket barista to consult before ordering, who remembers the last drink you customized or what kind of milk your co-worker likes in their coffee is nice.

What I expect from the next version

Facebook Connect

This is an app that is begging to be integrated with Facebook. Imagine if you had all of your friends favorite drinks right at your fingertips without having to manually collect them one by one on the app. One of your BFFs having a bad day? You could be the person who makes it better by getting them their favorite type of lattè customized to perfection.

Contextual Customization

When you add that extra 2 shots of caramel to your macchiato and switch from 2% milk to whole milk it would be great to see how many extra calories you're going to need to burn off at the gym that night, or how much healthier you'll need to eat at lunch to not go over your Weight Watchers points. Or what if you're a teenager and going through the "I'm a non-conformist hipster" stage (though I highly doubt your non-conformist ass would ever be caught dead in Starbucks, but whatever) and you want to be unique and you see via your iPhone that 5 other people at Starbucks while you're ordering are drinking the Caff�� Verona but no one's drinking the Komodo Dragon Blend, hell yeah you're going to order that Komodo Dragon Blend. Contextual customization gives you the tools you need to make better decisions with the plethora of choices you're presented with so you can get on with being your bad ass self even if you're still figuring some stuff out.

Some kind of barcoding system

Yeah, that's right, I said barcoding. I'm unsure of why Starbucks would create an app to customize a coffee to the nth degree without at least contemplating the possibility that scanning a barcode would effectively speed up the ordering process exponentially by allowing the customer to do it on their mobile device.

Integration of the Starbucks Mobile Card app

Having the mobile card separate only makes sense now for three reasons:

1. its still in beta, and beta means potentially messy...like powdered sugar doughnut messy
2. there's no barcoding system within the current main application
3. divide and conqure - both apps have their separate challenges development wise, by building these applications separately, it avoids complications, possibly additional bugs and places both applications on a separate timeline.

I would hope once they get their system up and running smoothly they would opt to integrate the two applications.

Rewards program

Your mobile device is probably the coolest punch card you've ever had and yet few are using it that way. By doing the Starbucks Mobile Card, barcoding and ordering all within the same application not only are they are gathering valuable information, but they could be potentially building loyalty. A rewards program might give a person the extra incentive they need to buy what some might consider that extra cup of over priced coffee.

What the future might hold

Paging system for when you've ordered drinks

Okay, I know what you're thinking...a cup of coffee doesn't take that long to make...but a frappuccino on a busy Monday morning with unmotivated workers behind the counter does. When that happens, it would be nice to have a seat rather than standing their in the way or thinking hey that's my frappuccino when really its someone elses. Efficiency is an awesome thing.

Order ahead

While I've never actually worked at a place where I have had to get a metric ton of coffee for co-workers in the morning, I imagine its probably a terrible experience. And it sucks for everyone behind you in line too, because you actually order more drinks than their are people in line, and that pisses people off and its not actually your fault - its Starbucks fault. We have the internet, we have mobile devices, and information gets transferred at light speed. The designated office coffee person should be able to order via mobile phone, select a time they will pick it up at and submit the order so Starbucks employees can pace themselves and other waiting customers don't have to wait so long. Let's face it, if we've sent a man to the moon we most definitely can figure out a way to make this process easier.

Drink gifting

Let's say you make a bet with a co-worker and that bet involved a cup of coffee for the winner...let's say you're a busy bee who really shouldn't be making bets to begin with because you don't have time to go buy a cup of coffee for the winner, let's say you lose that bet? Well what if you could Bluetooth your co-worker their winnings via your iPhone. I bet that would make your life a whole lot easier wouldn't it loser?