Times they are (rapidly) a-changin’

How rapid prototyping evolves the process for mobile UX professionals, clients, and users

App wireframe displayed on an iPhone 4

Sample app wireframe, created using Axure RP Pro

Slow down. What’s all this talk about rapid prototyping?

Depending on your industry, rapid prototyping can mean different things. But to a mobile user experience (UX) professional, it means your job is now worlds better. Seriously, gone are the days when you have to marshal static wireframes in an attempt to (poorly) convey how a mobile app or website will work.

What’s wrong with static wireframes?

Static wireframes are…well, they’re static. It can be very hard for anyone who didn’t create them to interpret them and to really get the gist of how the finished application will work. They often go hand-in-hand with copious annotations, which might be great documentation but can make the review process quite cumbersome for clients. I think we can all agree: It doesn’t quite represent a typical user experience to have to read through annotations while you use an application.

That’s why we’ve started using Axure RP Pro to produce interactive wireframe and design prototypes. The difference is blowing our mind. To be clear, with this new approach, we are not cutting out the critical steps of documenting app content and process requirements, priority of content, functionality, and navigation. And we’re still using our full “bag of tricks” to produce the caliber of design our clients expect (not limiting ourselves to Axure’s somewhat limited styling options). But the Axure prototyping approach does afford some nice ways to streamline our efforts and otherwise evolve our UX process. Here are just a few ways:

Evolving the process for mobile UX professionals

You can view your work on your phone very early in the process!

This means you can detect glitches in your approach sooner rather than later, which means you can revamp before you’re too far down the wrong path. When you tap through a wireframe via a prototype on your phone, you can much more readily intuit if something in your flow isn’t quite right, and you can address it promptly. It’s really helpful to be able to more easily visualize where “the fold” falls, too.

Your team can work on the same files at the same time!

One of the sweet features that we are just starting to take advantage of is being able to share files with coworkers. It’s easy to create a shared file (provided you have access to a shared drive somewhere), and through a somewhat-Dreamweaver-like check-in/check-out process for individual screens of your app (or pages of your site), you can work on the same file at the same time.

You can make and use custom type styles!

This one really deserves three exclamation points, IMO. We used to use Visio, and you had to hand-style each piece of text you put into the wireframe, if you didn’t have a usable stencil item for it. Axure lets you create a style and then reuse it as you create new text elements (and when you edit the style, the changes will apply to all type with that style applied – YES!). My one wish is that Axure would let you make derivative styles, so you easily could make an H3 based on an H2, based on an H1, and so forth. Ok, and my second wish is that you could apply all-caps as a style.

You can save yourself some of the painstaking annotations!

Remember the maxim from high school English to “show, don’t tell”? Making an interactive prototype lets you do just that. I can’t lie – I’m still writing a lot of annotations. After all, there will always be important functional requirements to impart to others on your internal team and to document for the client. And while you could spend the time working out the logic to produce complicated dynamic results, it may be more expedient to just write certain annotations, and leave it to a skilled programmer to generate the code. But what you won’t need to do is spend time annotating a lot of the basic interactions!

You can demo designs as an interactive prototype, too!

It doesn’t have to stop with wireframe prototypes. We are producing design prototypes, too, which not only are useful for the client, but I’ve found they also improve my personal creative, iterative process. For now, I’ve stuck to bringing Photoshop slices into Axure as images, rather than using Axure’s design tools to produce page elements. I realize this has some process limitations, but I like the Photoshop control this gives me. With this approach, I can still get a preview of how my font sizes look on an actual phone, whether my button sizing feels right, and once again, where “the fold” falls. If things are not to my satisfaction, I can immediately tweak them in Photoshop and easily update the image in Axure until I get the prototype where I want it. And with Axure’s “Image Map” widget capability, I can still turn my sliced images into interactive screens.

What’s evolving for clients?

Clients can view the app on a phone very early in the process!

Let me just say this about our first client to view wireframes as an interactive prototype: they were beside themselves. They could really see what they were going to be getting! And they could take it back and demo it to colleagues without having to do a lot of explaining. That makes them look good to their supervisors, and what client doesn’t like that?

Clients can easily provide feedback!

At least with Axure, there’s a super-easy way for clients to provide feedback – on a discussion tab, available on the desktop view of the prototype, which the client can access via a link (which you can password-protect, by the way). And there’s a discussion tab for each screen of your app, so clients don’t have to waste time pasting links into an email to try to explain where their comments apply. It also lets multiple clients comment at the same time, and tracks who says what. After our clients provide feedback, I can print out all of the comments, easily tell what screen they relate to, and even write response comments.

I’m not saying we’re doing away with direct client presentations and feedback conversations. No way – the immediate reaction and feedback to an initial presentation is priceless. But these ways of capturing client feedback after-the-fact are proving really useful to us.

There are fewer deliverables to manage!

Having the interface, requirements, and feedback all in one place is a very nice thing to be able to offer a client. Enough said.

Most importantly, how will users benefit from the evolution?

Better user experience!

Of course the rapid interactive prototyping process will not be visible to end users, but the results will be. Your app will be much stronger from having been viewed on a mobile phone so early (and often) throughout the process by lots of internal and client stakeholders. This means you get a bunch of testers who can provide valuable feedback that will no doubt result in a better user experience. That sounds like evolution to me.

So, how will the process continue to evolve?

Evolving our process is an integral part of the Q way of doing business. We will keep an eye out as Axure develops and rolls out new features and versions, as mobile (and desktop web) UX practices evolve in the industry, and as needs and expectations evolve among our clients. For the moment, we hope to see evolution in how Axure facilitates prototyping of responsive design solutions (to date, it doesn’t seem that Axure has a solid way of handling responsiveness). But for now, Axure’s features are going a long way to helping us evolve our process.

Read More Comments


Why daily deals need to evolve beyond location

Verizon states their Location Based Service (LBS) API offers a resolution of 150m. That figure is conservative in my estimate as I have seen my location on some apps better than 10m. LBS are used for all manner of applications. Outfits like Living Social offer instant deals depending on where you are. These deals seldom inspire me to try the deli on the corner with the dusty ceiling fan.  Focusing deals on where you are is cool. Once the cool factor has worn off, the $10 for $20 deal at the dusty deli remains. Not cool.  Other than maps and directions, the killer application for LBS still eludes us. The added fidelity of knowing where and who you are at the same time is the ultimate prize.

Read More Comments


This Week’s Top Tweets (March 11)

1. 9 Ways to Transform Your Website Into a Social Media Hub
By Rich Brooks on Social Media Examiner

There are plenty of resources out there to provide guidance on best practices for social media platforms, but what about using your website as a hub for social media? This post offers 9 great tips for adding social power to your website.

Takeaways: If your website isn’t integrated with your social media profiles, even in a small way, it should be. Integrating social tools to your website adds a human touch to something that is often used as a sales vehicle or online brochure, and social media integration can help increase traffic to your website and drive conversions from places that may not have been expected in the past.

Read More Comments


This Week’s Top Tweets (February 4)

This week’s top tweets were all about mobile.

1. Marketing Mobile Apps Effectively
By Ann Smarty on Search Engine Journal

It may be hard to believe if you work in digital, but mobile is still a new and confusing concept for businesses on the client side. For those who have taken the leap to investing in a mobile application, it can be difficult to understand how to market it effectively. Ann Smarty offers great tips in this article on Search Engine Journal.

Read More Comments


This Week’s Top Tweets (January 7)

1. HOW TO: Use Social Media to Create Better Customer Experiences
By Maria Ogneva on Mashable Business

Businesses have been using social media for customer service for some time, but Mashable offers some great tips on how you can leverage social media tools to create a holistically positive overall experience with your brand for valued clients and customers.

Takeaways: Whether you’re a nonprofit seeking to connect with members and donors or a large corporation like Comcast, there’s room for everyone at the social media table when it comes to engaging constituents.  And beyond engagement, social media tools offer brands of every type great opportunities to “listen” to their audiences – What are they talking about? How do they perceive your brand? How can you contribute to the conversation (without a heavy-handed sales pitch)?

Read More Comments