Last month at the IBM Digital Experience Conference, Shyam Sunter, a Perficient Technical Solution Architect, and I presented on a method for abstracting the user interface code (HTML, CSS, and JavaScript) out of WebSphere Portal. A key part of this presentation was going over why this abstraction was important.. It’s of my opinion, that abstracting the UI code out any platform, be it WebSphere Portal, Sharepoint, SiteCore, what have you, is vital for building modern, cross channel digital experiences. Supporting an abstracted UI layer is a common practice for many digital platforms, especially in the start up space. It’s time that the enterprise world starts to consider adopting this practice as digital solutions become more pervasive and complex.
 

Elements of User Experience

• Design teams being given ownership and control over the development and deployment of the user interface layer. Design is naturally an iterative process, which involves creating and testing various solutions to a given problem. Having control over the UI layer, gives design teams the freedom and flexibility to try out new solutions and to simply “play” with the overall design.
• Publishing UI code more frequently. With the control of the UI layer living in the hands of the design team, code can be pushed out more “real time”. This doesn’t always mean to the production environment, but users and stakeholders are able to touch, feel, and play with a new design quicker and in a realistic environment.
• Easier to support cross channel solutions. It isn’t news that the days of people being chained to a desktop computer and chair are over. But, the new world of multiple digital devices and varying resolution sizes is a still new, and it’s really complex. By supporting a stand-alone UI layer, it’s easier to contextual deliver the right design for the right environment.
• Proper support for accessibility standards. Accessibility doesn’t just apply to UI code, but a good chunk of it does. If you don’t have a backend platform interjecting its own code or compiling code that a UI developer has written, many accessibility issues can be addressed in a more streamlined fashion.

 
Ultimately why does having an abstracted UI layer matter though? Because there is no such thing as just having a website or just having an app anymore. It’s about providing a digital service that people can interact with, play with, and enjoy at any time from any device. Many things go into ensuring that the resulting experience is a pleasing one, but taking the time to build a UI layer that isn’t, at least fully, dependent on a backend platform is one of the key methods for properly serving people who use your digital solution.

At the end of the third day of SxSW, I sat in on a session about Behavior Change and how design can use that as a value proposition. Chris Risdon, of Adaptive Path, was the speaker, and it was great to sit in on this topic again and see how much it’s matured since the last time I got to see Chris present on it. The market today is becoming filled with products and services that are designed to not only track and monitor our behavior, but provide insight into how we might change that behavior for the better. Chris covered many of the concepts and principles behind this new breed of products during his talk.
Below are the notes I took during the session, please note it is mostly a stream of consciousness so please forgive any spelling or grammer mistakes.

Behavior Change as a value proposition  #behaviordesign
Chris Risdon @chrisrisdon

• Moved from NYC to ATL to Austin
• After the move to ATL he gained weight, so did his family.
• He went from a walking town tap driving town

• When he thought about city’s and the culture they have, it was as simple as walking vs driving
• 20 minute walk in NYC was no problem, but in ATL places to check out we described by miles
• Over the course of a day or week, he didn’t want to think about which to focus on time or distance. He wanted whatwas convenient
•  If you have half a box of chocolates, I can give you half the box now or a full box in a week. Most people will take the half box now. Value decreases the longer we have to wait for something.
• This concept shows up when we decide to get life insurance vs the newest device on the market. Long term vs short term
• Fog behavior model

• If you are in an airport in 2007 having a beer, and on the news you see the destruction of tsunami and you feel for the people being affected. You see an ad about donating to the Red Cross for this – to donate you have to get all the way home and remember to go to their site to donate. The ability to implementing the behavior of denoting was blocked.
• Now today the same situation can happen, donating is as simple as texting 90999 to donate $10 that shows up on your mobile bill. This easy method of acting allows the behavior to occur without barriers
• Opportune moments are everywhere now, when you buy something at the pet store the donation act is part of the checkout sequence
• 6 methods of influencing someone

• This is the tip of the iceberg for persuasion and influence – but how do this apply to behavior design and persuasive technology
• Tactics for influence is all around us – the nail polish that is bitter to prevent us from biting our nails
• Some of these are “dumb” feedback loops, it applies to everyone and is not focused on the individual behavior of the person
• Persuasion- is a scary word. But it’s not if you think of to as a spectrum

• Good defaults are a neutral concept that isn’t meant for persuasion, they are meant to aid in the user experience and streamline the interactions.
• Intent is the primary factor in the placement on the spectrum
• Good defaults where the intent is to persuade but for good reasons – organ donation. Most people want to do this, and if the default is opt out then more people do it because they don’t have to think about it.
• The ethics of this is tricky but important
• Awareness of intent is an important factor – how aware is the user that the design is trying to persuade

• Amazon one click – high persuasion but low awareness
• Good defaults – low awareness and low persuasion
• Manipulation is where the danger area is and you run into ethical issues. Manipulating with low awareness and high persuasion to benefit you not the user

• We are starting to have products and services that are more about me, a person, than the product itself
  • Mint, Nike+, and run keeper – these have a higher level of persuasion and behavior management
• You should be focusing and watching those products that are high on both of those spectrums
• We are becoming more involved in “me”

• The user is looking for value that impacts their life directly and begins to improve our life.
• Data collection is required to do something like this and that data needs to be measured
• Recommendations and guidance s based on the data being collected both by the user and the network overall. E.g. You walked more than X today.
• Sensors & Data – Feedback – Profiling are the fuel of these new products.
• Basketball with a sensor that reports how well you are performing as a player.
• If it can have a sensor put on it, it will. This is just going to get more common and more ambiguous
• Our barriers to sharing our personal data  is lowering as we find those value statements and see others improve their life
• Feedback – the more immediate the feedback loop is on the behavior the quicker the user can adjust
• Immediate feedback loops are becoming more common in products, but right now it isn’t very personable, it doesn’t help with decision making and guidance
• At the point of decision, we need to see what the results of our possible actions might be and why we should either avoid or perform some action
• Profiling – set up the responses and the triggers that are focused on how the person using the product would best respond
  • How we decide by Jonah Lehrer

• Math is hard – and a lot of people don’t want to do the make to figure out what a lot of this data is trying to tell us. They want the decision, or the options, presented to them.
• Chicle architecture – managing the context which people make decisions
• Science Rockstars – trying to build a persuasion API which will help you define persuasion profiles around customers and improve the marketing that is done for them.
• Behavior Heuristics
  • Dan Lockton provides these
  • Perform the 5 whys to behaviors that are being exhibited or why they should conduct a behavior
  • Create a list of heuristics or principles that guide how will use persuasion and behavior design to define the strategies that create the value propositions.
• Implicit vs prescriptive
  • Implicit will hit a wide usage base but lower behavior change
  • Prescriptive will have a smaller usage base but affect more change

• Every design decision influences the user, howev benevolent of the behavior.

Slides from the presentation

The third day of SxSW started off with a provocative session given by Golden Krishna (website) on the concept of No UI and the invisible interface. On the surface, I really enjoyed the presentation and the material that Golden covered, but I didn’t “fall in love” with his argument as many others did. In fact, since the presentation several blog posts have been written that argue against the concept of No UI which aligns to my way of thinking.
Scott Berkun – http://scottberkun.com/2013/the-no-ui-debate-is-rubbish/
Timo  Arnall – http://www.elasticspace.com/2013/03/no-to-no-ui
Below are my notes from the session, please notes taken with my handy iPad mini and Evernote.
Golden Krishna – The Best Interface is No Interface #noui hash tag

• Lots to celebrate with technology these days
  • Big tube tvs to paper thin screen
• There is a terrible trend in tech though
• He is a ux designer – works at Samsung innovations
• His goal as a designer to solve problems
• As an industry we are moving away from solving problems.
• 40 years ago we offered people the worse user experience, command line
• Then xerox created a desktop GUI
• Our love of the digital interface has gotten out of console it’s become the answer to everything
• Build a better car? Slap a UI on it
• How do you build a better hotel experience? Slap a UI on it
• Somewhere along the way we equates the user experience to the user interface.
• We are surrounded by screens – greatest minds are working on ads at Facebook
• Wasn’t that long when our life was filled with paper and we damed for a paperless world. Now we are should be dreaming for a screen less future
• The best interface is no interface
  • Embrace typical process instead of screens
    • The simple processes of the past has become complicated by out new devices and screens.
    • 12 step process to unlocking a car when using a mobile app
    • The user only is involved in 2 of the 12 steps. The rest all rely on the digital interface
    • The keyless car key is a better solution thanks to radio signals
    • We think the viper app is good because we are used to looking at wireframe and prototypes.
    • We forget the context which some of these apps will be used in like carrying a cooler to the truck and using a sensor to open the truck rather than using an interface
    • Good user experiences isn’t about good screens by good experiences
  • Leverage computers instead of catering to them
    • We think that we serve computers, but computers should serve us
    • Petzl reactive head light – after 40 years of making headlights they chose not to slap a UI on it. They wanted to solve a problem.
    • The light is reactive based on what you are looking at. When looking at a map it dims and away brighter
    • When computers serve us they help us safe lives.
    • Computers should do things we don’t want to do, they should do what we want to do.
    • Goodyear is creating a tire that will refill with air while driving using sensors and small compressors
  • Create a system that adapts to individuals
    • Data science is working on this in ways like better ads or LinkedIn connections.
    • Data science can do so much more in the consumer space
    • Nest – it’s magic is that it learns and thinks about us. As we adjust it learns about when we wake up and go to sleep and it becomes part of the background is it better predicts our needs
    • Systems can learn to help us before we know we needed help
    • IBM put sensors on rugby players to monitor their health and injuries before the yogurt happen. The players didn’t need to download a new app or anything.
  • The best interface is no interface on cooper
    • People have been critical of the UI for a long time.
    • Automatic solutions – people get scared by this idea. These are hard to get right and when they are right they become embedded in our lives
    • Automatic transmission is a great example of getting this concept right – by 2009 91% of all cars had auto transmission.
    • Failure – it will occur and you will need to deal with it. Data helps predict, avoid, and recover from failures.
    • Norman – the problem with the interface is that it is an interface itself.
  • No UI worksheet
    • Identify typical process
    • Use sensors to learn about the context and environment
    • Adapt to individuals using data and analytics
    • Example problem – someone who forgets to take their medication at 3pm everyday
• Nointerface.com – samples and practice for this way of thinking. Slides, video, and PDF of essay available

Following a wonderful experience working with upcoming SxSW speakers during the Tweak Your Talk workshop, Russ Unger delivered his presentation on the life of Jim Henson and the lessons UX Designers can learn from him. I’ve personally been able to see the evolution of this talk of the years and it was great to see it presented on the big stage at SxSW. The highlight of the talk was ~1000 people singing along to Rainbow Connection. Below are my thoughts and notes from the session. (These notes are simply my stream of consciousness from the session, so I apologize in advance for any sloppiness. :D)

From Muppets to Mastery

• Went to the museum of history and they had a muppets exhibit
• Always knew of Henson and liked the shows
• Looking at the history of it noticed that a lot of the work applied to ux
• You wouldn’t decide to be a puppeteer, I don’t think – statement about his career
• Henson got to follow his passion. He wanted to create things that mattered.
• Diving onto his career. Born in the 1950
  • Grandmother was an artist and inspired him
  • During high school he did his first puppet shows – made $5 an episode
  • Graduated in college in 6 years
  • While in college he got a show Sam and friends with the first Kermit. 2 weeks turned into 6 years of shows.
  • Started to do commercials for Wilkins coffee
  • Videos of old commercial
• In the 60s doing spots on Today. He started getting more popular
  • Ralph was built for purina
  • Ralph was the first 2 person muppet
• He was hired by IBM to do training videos on how meetings should be conducted

• In the 70s he tried selling the show
  • Networks wouldn’t buy it though
  • First pilot was a bit too much for them
  • 1976 the muppets show showed up on tv – it lasted 6 years and Henson ended it on his own
  • 1979 we got the first muppet movie
  • 80s things really took off. We see this dark crystal and fraggle rock
  • Starboppers pilot was produced at the time too. Scifi muppet show
  • The labyrinth movie came out with the odd song dance baby dance
  • 90s and beyond – muppet vision 3d came out which was his last project. 1990 Henson passed away.
• Muppet are on the rise again with the new movies and a new generation is experiencing them
• MuppetLean – Henson had a long term approach to building things
• Kermit was built using his mothers coat and ping pong balls
• 13 iterations of Kermit have existed over the years.
• 2005 is the most recent version
• With something as simple as Kermit they always thought they could do better with the model they were working on
• Project ecosystem
  • Father was an agriculture researcher and taught him how everything works together
  • Fraggle Rock – showcases the working ecosystem we work in today. PM – Designers – QA – Clients etc

• Henson also taught us that good experiences are invisible
  • A lot of work went into making sure people didn’t know that muppets were hanging in the air
  • Give audiences enough to work with and they will do the rest for you.
• Visual thinking
  • Henson played around with visual thinking using the muppets to explain the process
  • We have visual thinkers today that inspire like Sunni brown, Dave grey, and James macinifufo
  • Sweetums started out as a sketch and turned into a large lovable muppet
  • We are supposed to take our sketches – to wireframe – to some beautiful visual design
  • Story boards helped plan out the shows and the action.

• Prototyping
  • Used prototyping to try and pitch new shows.
  • He didn’t want to invest in sets and computer animations and used a prototype to test out an idea
  • Sketches wireframe and prototypes are all necessary at some point. Just depends on the project
• Patterns
  • Created whatnots, changing out simple parts and you get a whole new muppet
  • The whatnot workshop shows how easy it is to create new creations.
  • When you start playing with a muppet you notice that each muppet has its own voice and personality
  • We have our own pattern libraries that allows us to not start from scratch every time we approach a new project

• Hacking
  • Henson was hacker – figured out to stuff
  • With Kermit and rainbow connection, he built an under water bubble and he could operate Kermit under the water.
  • This bubble had o2, a fan, and a monitor to see what he was doing.
  • The first big bird had a large monitor built into it so the puppeteer could see what they were doing
  • We do this know with mobile testing rigs, you can make one with $9 bucks
• Ask yourself now what would Henson do when trying to figure this stuff out.

 
Slides from the Presentation

The first day of SxSW kicked off in great fashion by attending Christina Wodtke‘s (Twitter) session on Game Design and the 7 key lessons that come from game design and game designers. Christina did an amazing job of looking at the practice and craft of game design and applying it not only the design process but looking at common sites we use and showing the gaming components that are present. Below are all my notes and photos from the session that act as a stream of consciousness from the session. This talk was recorded and I highly recommend tracking it down once it gets published (sorry the link just isn’t available at this time.)

• She didn’t play games, didn’t even want to go to baseball games. Didn’t play video games.
• Every New Years she picks a new project – one year she picked games and feel in love hard.
• Got aggregated by gamification because badges isn’t what it’s all about.
• Many great mentor

• Find your north stars, when you start to play a game you think of what makes that game fun
• As a ux designer we don’t think about fun
• Players should have fun, not the designer or the computer
• North star should be an emotion, from the heart
• Video from Ted – speaker used game pieces to teach her daughter about slavery with pieces that the daughter made herself (Link to Ted Talk)
• The game taught her more about slavery than a whole month of black history
• Wen you play games you feel emotions, good and bad. The reality of it this allows you to internalize that information
• Design is for emotion, conversion is a crap north star
• After learning about the purpose of game design, she struggled with going back to ux design methods and goals. Lower frustration, high efficiency
• Games also provide peace, removes you from the stress of life and all the things you need to get done.
• Life with alacrity – he is obsessed with iTunes ratings so his playlists are effective. The task of managing this is a joy for him.
• Thinking of Facebook photo layout – this is all they have to offer? Why can’t Facebook allow her to make a photoblog to share with her family.
• Negative emotions are wonderful – looking at plants vs zombies

• Coffee meets bagel – eating site that only allow you to pick one person a day, and if you doe revisit everyday you might miss true love
• Dan Brown created a game that allowed him to talk with his client on design conflicts and used that to facilitate that hard conversation.
• When you sit down to play a game you agree to live by crazy rules. It’s a social contract that allows you to express yourself freely
• Player types vs personas
• Creating personas is fun, but she hardly ever goes back and uses them.
• Now she uses player types
  • Killers –
  • Socialites
  • Explores
  • Achievers

• These types don’t work for every game, but its a good base line.
• Looked at amazon and applied the player type concept to how the product pages and the site is laid out.
  • Satisficers – compare products
  • Socializers – forums and discussion
  • Optimizers- golden deal and specials
  • Self discovery – surfacing new and buried content
• Core loops – from fish vile it’s buy fish, grow fish, and sell fish. Rinse and repeat
• Every game has a basic loop that drives play and complex behavior
• Aspects of the loop,define the rules, units, and strategy of playing the actual game
• The decisions fanatic result from the core loop help the player win or lose, sometimes very quickly. These decisions are complex and meaningful for the player.
• Video shown from will wright – creator of sims (Link to Video)
• Showing a loop of shop -> buy -> review
  • This applies to yelp, amazon and many other sites
• Share->  react -> consume
  • Social loop that applied to every social action or network
• These loops are not new, they just show up in new and interesting ways in the digital world
• Game mechanic
  • The things that set the rules for the game
• The concept of a pinch – when you run out of energy and you still want to play. You can either walk away until energy comes back, you can buy more energy, ask for help, or cash in your hoard to get more energy.
• City vile had an interesting pinch – you have this beautiful city but you don’t have anymore room to grow and add new buildings. This pinch is normal because it ties back to how they think they should be playing. Growing their city
• When you use the mechanics does it fit into the users story and experience.

• Games modify your behavior and manipulate you. Using the principles of persuasion
• This is a classic commerce trick too. Looking at golden deals from amazon. The time boxed sales encourage people to buy rather than wait.
• Doobers – actions that result in mini- rewards. Getting inbox zero and starts float everywhere in celebration.
• Leader boards – you have to be careful and relate to men more than women. Women think they are “gross”. Women do compete though but they don’t express it, and a leader board is a form of expression
• Mastery – single most satisfying thing that games provide to us. It’s the pleasure f pulling back the bird and knocking those pigs over. Can we make users feel more like the master of the universe?
• Replaying a game t get more stars encourage replays but it also helps users master their game skills
• Amazon top reviews – great example of a leader board where they get the behavior that the company wants.
• Showcasing Harriet Klausner – proof that the amazon leader board may have been gamingthe system
•  Design over time – what are you doing to grow your users over time
• On yahoo groups – they give admins customization on the look of the groups site
• Senior admins love to express themselves and this is for them – they are “paid” by giving them tools to make their pages unique.
• Who has been on your site forever, what do they want, are they mad with power. How can you make them more powerful and happier.
• Waterfall sucks right…but designers hate agile too … What if they all suck?

• What about a process that is routed in game design and apply that to digital design and development.
• To make really good things it will never be easy and it will be messy.
• Stop treating visual designers like they are the crew from flip this house. Game design – visual designers are there from day one and sketching very early on expressing ideas.
• The team is creative and moving forward together  and learning from each other
• Measure – if you are doing anything today you have to measure like you have OCD
• Game designers do more user testing more than anyone, they test as early as possible with post it notes
• User testing is core to the games success. Because the game HAS to work.
• This concept of play test is rare in the realm of IT
• Invite people to come in and tell you that you suck. Give them that freedom and learn from the feedback you get.
• Sid mier video show casing – CivRev battle scene that shows odds of winning a battle. Players viewed these odds like they would win the battle it was 3 to 1 and they lost! Players didn’t understand how with 3 to 1 odds they old still lose. Using this feedback they adjusted and watched more players play. With 1 to 3 odds – when the player won they didn’t get confused or wonder why they didn’t just lose. (Link to Video)
• Apply odds to the battle lead to a lot of confusion when the player assumes they should win but loses, but not the other way around. When something feels wrong – it kills the suspension of belief which is core to engaging with the game
• don’t think about where your testing, but developer a rhythms where the users are part of the design process
• Learn how to teach – every game has almost an entire new UI. Some common patterns – but with these new UIs the game designers have gotten really good at teaching the user how to play and use the interface.
• Ubisoft had dance teachers come in and teach the programmers, so when players are learning how to play and the player gets a move right the first time there is a small celebration and get to skip the lesson.
• Look at how games teach you how to play the game. Many teach you just enough at one time. More complex learning happens as the player progresses.
• Tumblr blog sxswinning

Slides from the talk

The story of how Southwest Airlines was founded is one of my favorite stories to share about the power of a sketch. If you are not familiar, take a moment to hop over to Dan Roam‘s blog post Southwest Airlines keeps up the napkin spirit…I’ll wait because I trust you’ll return. Back….good. Dan Roam refers to this story as a great example of problem solving, and that’s just what sketching is. Sketching is a standard part of my design process, and it’s an activity that happens at various stages of any Perficient XD project. Something I hear from others when I ask them if they can sketch out an idea, or ask to see their sketches, is “I can’t sketch…” This commonly happens when people equate sketching with drawing, or illustration. The ability to illustrate is very different from being able to sketch out an idea.

Getting Comfortable With Sketching

The first thing I show people that show a hesitation towards sketching is the sketchers toolkit. This is a series of simple shapes that can can be used in a sketch to visually express the an idea, like a user interface. Dan Roam, in his book Back of the Napkin, going into more detail about the type of shapes you can use and the purpose of those sketches to express a variety of ideas. For the purposes of this post, I’ll be focusing on sketching out a user interface though. Using the shapes shown below, you can quickly sketch out a layout and various features that you think may belong on a given interface.

• Line – Line of text or if combined with a triangle an arrow
• Circle – Icon place holder or button
• Square – Content area, call to action, or even an image placeholder
• Rectangle – Tab, content area, or image placeholder
• Weighted Line – Heading or line of separation

Using Sketches To Drive Design Concepts

There are a number of design activities that can be performed in a group setting that will both encourage other smart people to share their ideas for a solution but also bring up great conversation about design direction, desired functionality, and content requirements. One that is used often at the beginning of our projects is a design studio. During a design studio, a group of stakeholders from different departments are asked to sketch out a series of design concepts to meet a defined scenario that typical users would find themselves in. Once these sketches have been produced, members of the design studio present their ideas and collect critique from their peers. This critique is used to refine the design ideas and spurn conversation around the possibilities and constraints of the solution.

Sketching Before Wireframing

Another area sketching shines is prior to the production of wireframes, or interactive prototypes. I firmly believe that once you sit down with any kind of design tool, you begin to limit your thinking to the design patterns that are present within the design tool. Sketching prior to using a design tool frees you and your mind up explore ideas that may not be supported by the widget library available to you. You don’t fall into the trap of filtering out ideas in your head rather than on paper and with your peers. An idea that may not sound all great in your head might be what another designer or peer needs to produce their own concept that will push the solution to the next level.
There are a variety of paper template or sketch pads that facilitate the sketching phase of a design

• UI Stencils – Offers a variety of platforms and stencils
• UX Pin – Note pads for desktop and web UIs
• Smashing Magazine Sketching Resources
• InspireUX Sketching Resources

If you haven’t incorporated sketching into your design process yet, give it a try. Don’t be discouraged if your first couple of attempts aren’t the greatest. Also, don’t try to make a piece of art. The goal of sketching is to communicate an idea, if you are able to do that (regardless if the idea was good or not) than you have created a successful sketch. Good luck sketching!

Over the last couple of years I’ve really enjoyed learning the ins and outs of photography. It has been the creative outlet that I needed that is similar enough to user experience design, but different enough that it doesn’t feel like work. Now that I’ve been shooting for awhile now, I’m finding that many of the habits I have when practicing ux design are starting to carry over into my photography. The hook between the two lies in the attention of detail, a specific moment in time and properly serving the subject being photographed. The importance of these three concepts is the same in photography and in user experience design.

Attention of Detail

The ability to point out the minor flaws of an object or interface is curse for every designer. Personally, nothing drives me more batty now then seeing a UI widget be a pixel off from its intended alignment with other UI widgets. The curse exists in the world of photography. Nothing distracts more from a photo than an out of place object. This could someone accidentally, or intentionally, photobombing the subject, or simply a power line spanning the width of the scene. Getting the details of an experience, be it interactive or visual, wrong disrupts the user and takes away from overall engagement. Being asked to take photos for a friends family or going out on a photo walk has helped increase my attention. This experience naturally translate to the work I do at Perficient XD and makes the work I produce for my clients better.

Being In The Moment

When you use an application, website, or product there are certain magical moments that will either hook you into the experience or drive you away. The same magical moments exist when you are photographing a subject. I’ve read a lot about the best way to take photos of a sunset or sunrise. The one piece of advice that is consistent across photographers is find the scene you want to shot and wait. Wait for that moment when the light is perfect, then hit your shutter release. Once you’ve captured that “perfect” moment, wait 5 or 10 minutes and take the photo again. In just that short span of time, you will have a set of photos that tell different stories and convey a different mood. The core of this advice can best be applied to registration and up selling your customers. The span of time to ask and convince someone to sign up for your site or to buy additional products happens during “magical” moments while the person is using your site. Asking too soon or too late means you failed to convert that user or that you missed out on additional revenue. Be patient, wait for the moment that will really “Wow!” someone.

Focusing On The Subject (User)

Nothing is more important in photography than the subject. Not light, ISO, shutter speed or aperture. Without the subject all the theory and settings don’t matter because no one will pay attention to the photo. When designing a digital product, the same level of important should be placed on the user. If you don’t have visitors to your site, consumers of your products or contributors to your content then nothing else about your product manners. That’s not to say the subject, or user, should be the only focus. The settings used when taking the photo, or the design and functionality of a product all have their place. At the center of it all should be the subject though.

Wrapping Up

There are a lot of great resources out there for learning the theory behind the art of photography. I encourage you to read a post here and there, even if you don’t have an interest in photography. Look for the correlations between the craft of experience design and the craft practiced by thousands of photographers out there.
Digital Photography School
Fuel Your Photography
FroKnowsPhoto
PhotoFocus

The video highlighting the new design of the Chevrolet Corvette has been revealed, and it’s mighty impressive. What’s more impressive about the video is all the passion, creative thought and desire for greatest that is expressed by the designers of the new model is the very same thing that drives us as Experience Designers. As I was watching the video below, one thought hit me pretty hard. Why is it a given that so much time, effort and craftsmanship given towards the design of a car, but the same amount of time, effort and craftsmanship isn’t always applied to the digital world.
The process followed by many Experience Designers isn’t all the different from the design process shown in the reveal. We start off with a desire to learn and understand, then we move on to creating a vision and making sure that vision works. Finally, we put the final touches on our digital darlings to ensure they are set up for success.
Take the time to watch this short 3 minute video, and notice the emphasis on detail and collaboration. This is the level of craftsmanship that we strive for when designing for the digital space.

Inspiration sometimes sneaks up on you. That’s what happened to me when I took my son to see Wreck-It Ralph, and prior to the movie the Disney Short “Paperman” was shown. I cannot properly expresses how amazing the creative genius of this short is, and it’s great to see that it was recently nominated for an Emmy. The emotions that hit me when I watch “Paperman” range from pure joy to complete disappointment. Please take 6 minutes out of your day and watch the video below, I promise you it will leave you inspired and give you a desire to do greater, more creative work in the future.

This statement comes up a lot during the initial phases of a design project. On the outside I nod my head, note down the feature or interaction that is being described, but on the inside I’m wondering, “Does your user want to do that?” Frankly, the question I’m thinking about is way more interesting than the feature being described. What people WANT to do is typically the thing that leads to a project’s success and an engaging user experience, rather that being offered features that someone thinks they want to be doing.
So how do we find out what people want to be doing with a certain site, app, or product? It’s simple, you talk to them…scary I know. My friend and co-author Russ Unger recently gave a presentation at UX Thursday in Chicago where he provided attendees with a great overview of user research and how to get started. Below are his slides for the talk and I highly recommend looking them over. After you’ve digested the wisdom presented there, start to think about how you can find, or make, the time to talk with users on a regular basis and begin to hone your site, app, or product to better align with your users needs.

Hot on the heels of my post on the general ease of mobile prototyping and the number of tools available on the market to quickly generate these prototypes, Alexis Piperides (CEO of Proto.io) just published an article for .Net Magazine. Alexis’s article provides a deeper dive into mobile prototyping with additional information and guidance on mobile prototyping. My favorite part of the article is where he talks about techniques and what tools to use for different levels of fidelity. The article is very informative and paints a great picture of the mobile prototyping landscape, please check it out.

Mobile prototyping: a new paradigm

http://www.netmagazine.com/features/mobile-prototyping-new-paradigm

Prototyping is by far my favorite activity to perform as a UX Designer, followed up naturally with user research. Prototyping is a natural problem solving technique that allows you to quickly create a vision of the solution, or multiple solutions, for a design problem and share that vision with others. In most cases, it’s cheap and takes a fraction of the effort that proof of concept development entails.
A couple of years ago I remember prototyping up various mobile concepts and it was a chore; my prototypes contained many hacks to make them behave appropriately. Over the last year, the need for these hacks has diminished as new tools and updated versions of existing tools have been released to meet the growing demand of mobile prototyping. Below is a collection of some new and old prototyping tools that you can use to start building a vision for your mobile apps and sites prior to making large investments in development and design.

Fireworks and TAP

Fireworks will always have a special place in my heart when it comes to prototyping. It was one of the first prototyping tools, excluding counting paper, that I used when learning the process and methods of interactive prototyping. By utilizing a plug-in called TAP, you can build state-based prototypes of an iOS design and build them in HTML with touch capabilities that then can be tested on an iOS device. Using the features that TAP provides, you can take rough, hand-sketched ideas or detailed concepts and see how they behave off the monitor and on the actual iOS device it will be used on.

Resources for Fireworks and TAP
iOS Prototyping With TAP And Adobe Fireworks (Part 1)
iOS Prototyping With TAP And Adobe Fireworks (Part 2)
Rapid prototyping in Fireworks
Create Interactive Prototypes With Adobe Fireworks

Axure RP Mobile Prototypes

Hidden in the release of Axure RP 6.5 came the ability to build out an Axure prototype that could be viewed and used on mobile devices. We’ve used this feature often with our clients that wish to explore a mobile solution and want to retain some of the interaction design patterns that were being used in their desktop apps and sites. Along with the feature that builds the prototype for the mobile view, many libraries exist that provide various design patterns for the different devices that exist on the market today.

Resources for Axure RP Mobile Prototypes
Mobile Prototyping With Axure RP
Axure RP
Axure for Mobile

UX Pin Mobile Kit

The role of paper prototyping continues to grow and mature within the UX profession, and thanks to UX Pin, UX Designers have a new toolset to assist them with their paper prototypes. The Mobile Kit that UX Pin offers comes with notepads the shape and size of iPhones, common mobile design patterns and elements, and the ability to take a picture of your paper prototypes and upload them to the UXPin App. This is a great resource for working collaboratively with your fellow designers or even your clients.

Resources for UX Pin Mobile Kit
Mobile Kit for iPhone
UXPin App

POP – Prototyping on Paper

My design thinking and ideas never start off using a computer or even a tablet. When I feel like I have enough information about the problem, the users, and the projects goals I break out my notepad or sketch sheets and begin sketching. Before using POP, I would need to take photos of my sketches and load them into Axure and use image maps to flag hot spots that would drive interaction and navigation. Now using POP, I can use those same photos and build that rough prototype right on my phone. This is a great resource if you’re out on the move and don’t have the luxury of sitting at your desk and wiring up the prototype to collect user or stakeholder feedback.

Resources for POP – Prototyping on Paper
POP App
Review of POP

Proto.io

Not all prototyping tools are installed apps. A new breed of prototyping tools have joined the market that are browser based. Proto.io is a web application that allows you to layout your design, wire up the interactions, and deploy a mobile prototype for a variety of devices and resolutions. These prototypes can be viewed and used on mobiles devices, and even support a variety of touch-based interactions.

Resources for Proto.io
Proto.io
Review of Proto.io

Foundation HTML Framework

For those designers that are comfortable working with code, or for developers that have an eye for design, there exists the Foundation Framework. This HTML and CSS framework is responsive and allows you to quickly layout and program up an interactive prototype in working HTML. This type of prototype can follow any of the others listed above as a design matures and the solution has been tested to ensure it will be usable for the end user.

Resources for Foundation HTML Framework
Foundation 3
Getting Started With Foundation
Review of Foundation
Wrapping Up
New design tools are always popping up as the demand for them grows, and the tools listed in this post are just a sample of those that are available. No tool is THE tool when it comes to prototyping. The best tool to use when prototyping is the one you are comfortable using and the one that best communicates the intent behind your design so you can validate it with users.