Fred opens by saying it’s time to nut up, He also admits that he loves prototyping, and can’t think of a situation where prototyping can’t help your design.

As designers, we’re not making solutions, we’re making hypotheses, and building towards a solution. So the process of design — prototyping is key. You need to be an effective communicator and experimenter.

But it doesn’t matter what tool you use. as long as you go through the prototyping.

Fred uses Axure in this case for Design For Health. He’ll talk about where Axure helped him, and where it bit him in the butt.

At Evantage, they start with the business, and really, in UX design, it’s all about meeting the business goals.

Fred keeps saying that he’s “Not a sexy thinker,” but I think people want to think of him as sexy he says it so much.

He tries to imagine what the users want and sketch for that. He went through 14 sketches with pen and paper to find a flow that he liked. If he did that with Axure, he would have been killed.

He’s doing more modular sketching in components, much like Nathan Curtis does at 8shapes.

He started sketching the interaction flow, again, with pen and paper because he needed to keep revising fast and repeatedly.

Define scenarios and test plan

You don’t have to have real content, but you do have to have realistic content. It helps you test comprehension a little better. But you do need to have a sense of what kind of content is going in.

Structuring a prototype in Axure:
Start with a grid – master so it’s reusable throughout the prototype.
page template custom widget
create pages

Wireframes:
1. Make the wireframe
2. Make it interactive — which is great in axure

Don’t forget, prototyping lets you take bigger risks.

He added a function showing someone very close to being funded, to try and encourage some user to donate and put it over the top. But he has no idea if it’s going to work until he tests the protoype. Now he’s showing some video of him in Axure making the prototype interactive, and allow for real testing in key interactions.

Proof of concept testing

where the benefits of taking the risks are understood and realized.

Prototype only key interactions
Strip test plans to key tasks
run quick tests
Fix what sucks
Retest

Comprehensive testing:

1. Proto. only what’s needed for test and isn’t in your Proof of Concept Prototype
2. Then two rounds of testing to make sure your fixes are actually fixed
3. Make a report. Yes, go through and tell the story to all the different team members can know what is up.

Visual design:
Visual design is an opportunity for your design to evolve. It is not simply refinement.

He makes sure that the designer has all the info, and the context of the decisions that he made going to that point. It’s not about right or wrong. It’s about getting to a better place.

You can’t have babies, you can’t get attached to the project or the design.

Collaborate, don’t dictate to visual designers. Let visual designers take risks, too.

Fred now talking through his video, about how the brain takes in stuff, and craps out ideas.

Take the time to properly set up your prototype. It saves much time and hassle all the way through the project.

Now Fred hands over the mic to Will Evans

Will starts with his conceptual model mapping every possible activity and their interrelationships. He doesn’t have a set process at all, he has a whole range of activities that are employed depending on the client and the needs.

Then he gets into sketching and wireframing.

Many people like to sell on a process. But selling repeatable process is a fallacy. Measure twice, cut once, like a circumcision.

He uses design studio to gather requirements. With the stakeholders in the room, they can sketch, iterate and present their ideas to find out what is important to them.

One of the big things is that it allows people across the company to collaborate. By the time to present a wireframe, they can identify themselves inside the design, and keeps any stakeholder from having too much input in a process based on politics.

Personas
Measure 3x and cut once. Users lie. They don’t want to admit certain truths due to embarassment. Use contextual inquiry or ethnographic study where you can observe.

Functional sitemaps, then sketching Wireflows — which are basically storyboards of the Web experience.

Get into the mind of the user and try to build around the story of how the user wants to accomplish a task.

Sketching Wireframes
He’s able to create many different concepts quickly, a transformative act of working through problems.

Don’t go right from requirements analysis right into a tool. Free yourself from the tools and do basic sketches first.

Keep the sketches quick and dirty. Restrict your time doing this. Iterate through the screens many times.

Wireframes are a thinking device for exploration of the problem space. He recommends Omnigraffle.

ugh. Honestly, in making Will’s video, I’ve seen this so much I’m gonna stop blogging it. You can just see the video:

Related posts:

1. Video: The Right Way To Wireframe Yesterday, I helped get Will Evans ready for IXD10 by...
2. SXSW Live: Creative Collaboration: Building Web Apps Together Damn this SXSW ballroom A Wi-Fi! It’s holding me back,...
3. SXSW Live: Startup Metrics for Pirates: AARRR Note — postgame commentary added for this panel here A...

Join the IDEArmy at SXSW!

If you know me, you know that I volunteer my time to lead sponsorship and marketing for the IDEA conference because I believe it’s an incredibly valuable learning experience for the UX community.

Designing for complex information spaces melding the physical and virtual is critical knowledge for anyone with a stake in designing digital today, and most everything else tomorrow.

To that end, IDEA2010 (this upcoming fall in Philadelphia) is about to engage in asymmetric promotional activities to spread the good word.

On Saturday, March 13th, we’ll be bringing the beautifully designed IDEA2009 T-shirts to SXSW and handing them out for free. Kinda like the revolutionary Minutemen. But with T-shirts. And not at all in a war. But other than that exactly the same.

All you need to do is find one of us (@mleis, @semanticwill, @russu, @simplybrad) and have your picture taken with your shirt on (please) as the newest #IDEArmy recruit.

Do you already have a T-shirt because you were one of the lucky folks at IDEA2009? Great! Please wear it on saturday, and upload your pic with the #IDEArmy #SXSW tags: make your voice heard and your presence known.

You too, speakers: we know you were at IDEA2009, and a part of the Murderer’s Row of Keynotes. Present with your IDEA T-shirts on, please!

Of course, feel free to take the above graphic and pass it along to everyone and anyone who joins us in tackling these experience design challenges.

You should follow all the fun via Twitter on your favorite device @IDEAinfo.

Thanks!

Related posts:

1. SXSW Live: Who Will Win as Most Absurd Brand? As noticed by Amy Cueva as we walked around Austin,...
2. SXSW Live: Harsh Lesson #1: Get To Sessions Early Psyched since yesterday to watch Margot Bloomstein open SXSWi with...
3. SXSW Live: Zappos. Ponchos. Zappos, meet ponchos. Ponchos, Zappos. It’s no Nike+, but a...

Email as a problem space goes so deep and so wide, it’s difficult for most people to articulate. Even though much of their job is centered around the operation of email, and passing information from one entity to another through it, people have a hard time getting past the “necessary evil,” descriptor.

Yet entire organizations, almost as a function of cognitive dissonance, continue shoveling coal (read: dollars and workplace efficiency), into this steam engine that is fundamentally broken.

This dawned on me recently as a large agency (who’s name will be withheld to protect the innocent), announced it was switching from Outlook to LotusNotes. Say there’s 1000 employees there using Outlook (there are many more, but just to have a nice number).

Is it too far fetched to say that simply by making this switch and having to adjust to a new email interface, and new email-capable phones, each employee loses 1 hour of work time in the year? What about 4 hours? Ten hours? At a blended rate of $150 per hour and net revenue of $60, the agency decision just lost $1,500,000 in billables and $600,000 of net revenue. For each employee to spend two extra minutes a day fidgeting with a device or interface. That’s completely outside any of the actual client work.

So what can we do to make email work in today’s workplace?

Equip employees with a second monitor

This is the thing you can do right now to jump how efficient people are in the workplace. Lifehacker had an article from years ago imploring office workers to upgrade from 17″ to 19″ monitors, citing research that showed an 11% increase in productivity just by adding those two inches.

Today I see it all the time. Much of people’s jobs, especially account leads and managers, is about correctly, efficiently relaying and presenting information in email. Or comparing documents. Or comparing emails and documents to Websites. Casually watching them work on a single screen is more frustrating than any user test.

With every new email or comparison, the constant switching of screens is a cacophony of inefficiency. With every application that needs to be brought to the front, the employees concentration is broken. Then the inevitable, “Wait, what was I looking for?” comes in, and a task that should take 15 seconds is now stretching into 2-3 minutes.

When you have two monitors, these tasks across applications flow with relative ease. Personally, I like to put all communications windows in one monitor and have the other dedicated to workspace. In this scenario, where you have one screen dedicated to email, IM, Twitter, Yammer, etc., new information takes only a glance instead of a small application-flipping process.

Again, this is a quick, get-IT-to-install-it-today kinda fix. The total cost to the organization is less than $1000, and you’re buying into at least 200 new billable hours and better quality for everyone that gets upgraded.

Make a new email interface for your business

Seriously. You’d never think to just roll out a default WordPress installation, or a default CRM, yet everyone in the organization is working from the default design of Outlook, a program little changed from a decade ago. How can this work well for you? It can’t. So everyone tries a workaround. From Yammer to Basecamp to Wikis, people are tacking on anything they can get funding for and alleviate their email barrage.

We need to accept that email isn’t dead; that it will evolve into something else over the next decade as boomers retire. With this acceptance, we need to start looking at how much email people get, how they use it, and the best ways to present it: on the devices the people in the organization use, and for the amount and varying levels of importance email carries. We keep the technical structure, but reformat the interface to better suit our users.

One particular interface design I’ve thought applies well to email use today is TweetDeck. While it’s built to deliver filtered information from Twitter to the desktop, think for a moment about how well it would handle email challenges.

Most emails require nothing more than a cursory glance at the first few lines to update some small bit of information: like a scheduling change, project progress, even a “thanks.” And most replies are friendly ways of saying, “I see this.”

At the same time, most heavy email users employ filters to automatically put emails into folders. But that’s not “flat,” in the sense that you can see what’s in that folder without losing the information you’re currently looking at.

Here’s a quick sketch on what such an email client, built in a platform like AIR, would look like:

Having shown this interface model to a few project lead friends, the early, highly qualitative and unanimous response is “Wow, this would be awesome.” In essence, it treats emails the way people process them: allowing them to scan first, and read selected items in more depth second.

BYO communications app ecosystem

I’ve grown into a big fan of building application ecosystems on top of Apple’s distribution infrastructure. But the bottom line is that the way your organizations runs projects has a core of repeated activities that today we spend a lot of time working around. Getting clients to review content like copy, images, and movies. Milestone and deadline awareness on different project aspects.

Let’s bring these tasks and objects into the enterprise environment: so that companies can gain not only efficiency, but control over the brand, interaction design, and ultimately the complete presentation of the deliverables that make such a valuable part of the relationship.

And this doesn’t even account for workflow that needs to extend all the way out to an external audience. These days, companies are starting to grasp that brands need to leverage social networking to atomize the brand into smaller more personal relationships with the audience.

Building a communications system that accounts for this channel, whether it’s talking directly to an audience, or flagging assets for a community manager to promote is just one of the key differentiators both agencies and brands need to embrace fully before they get left behind over the next decade.

Ultimately Social Media should be teaching companies how to be scalable and nimble enough to transact communications on any platform quickly: wherever and however the internal and external audiences want.

We’re right on the cusp of communications infrastructure being a selling point for employers and agency selection. The question is: who will be the first to tap into this next computing goldmine?

And Kudos to you for hanging with me through all 1100-some words! If you’re still with me, I’d love to hear your feedback in the comment section below, or on Twitter @mleis.

Related posts:

1. Twitter Organized for Business Valeria Maltoni recently wrote an excellent article about how companies...
2. More Email Open Tips One question that crosses all our clients’ minds at one...
3. iPad: The Greatest Gift You’ll Ever Give a Client Let me start by saying that I really don’t plan...

For those who weren’t able to join us, here’s a slidesharified version of the visuals I brought along. It’s an updated version of the presentation I gave on Future Web Trends a year ago at Colle + McVoy, with more focus on UX, and a little discussion around the concept of metric montage.

Of course I’m available for talks like this at your industry event, conference, office, or Bris*.

*Speaking at Brit Milot does not include any additional services, and I will not bring any deli platters.

Related posts:

1. Marketing for Circular Narrative Originally Broadcast on iMediaConnection As marketers, we’ve told persuasive stories...
2. SXSW Postgame: Magic and Mental Models: Using Illusion to Simplify Design Jared Spool delivers yet again in his presentation. As I...
3. Poetry, CEOs, and the Future of Narrative Now more than a week removed from SXSW, I can’t...

To expand on the description in the panel picker where you can give us a push forward with a thumbs-up, here are a few of the concepts we’ll be discussing:

Circular Narrative in Film and Web

You may have taken your children to see a great recent example of circular narrative in the newly released “Shorts.” We see, and have always depended on “classic” or “3-act” narrative to tell stories. This narrative structure is the way all stories are essentially told: with a beginning, middle, and end. Typically, classic narrative starts at the beginning of a time line and moves the audience through a linear accounting of the events.

However, Circular narrative does something a little bit differently: it uses the different characters’ perspectives to tell the story, and typically does so in a non-linear time line. In Citizen Kane, the storyline starts after Kane dies. In Pulp Fiction, the movie starts with a scene in a diner, which in a linear time line would take place 3/4 of the way through the story.

Any of this sound familiar? With every iteration of social networking sites, people’s experience on the Web is becoming more like circular narrative every day, with a central piece of content that is shaped through the lenses of comments and sharing. People who are using these sites are creating their own beginnings, middles, and ends. As Website creators, it’s important to understand these dynamics, and take these lessons into creating sites.

Common-engine Technology

Circular narrative also has technical roots, which we’re calling “Common-engine technology.” Basically, a single database that serves up content and interfaces dynamically according to the needs and perceptions of the audience.

I started working in this in ecommerce way back in 1998, where we would serve up different “storefronts” that rearranged products, prices, and design based on brand.  So if “store A” is a price-based brand, the audience is seeing a selection of products designed and ordered around price. If “store B” is a brand known for brand and caters to an audience that is less about price, the interface can be drawn to start at the brand level.

Common-engine technology offers audiences an experience that meets them at their own needs and perceptions, and offers companies a scalable methodology for serving site experiences that achieve business goals more successfully and efficiently.

Recently, we created the Miller ServerSpeak platform with a common-engine framework depending on what kind of bar the visitor works in. This puts the content an the interface into a familiar framework, giving visitors an immediate comfort level and allowing them to dive right into the experience.

In film, this presentation of objects that have meaning on the stage and in time is referred to as mise en scene, and will eventually be a blog post unto itself.

Master-scene format and mental models

One facet that Websites and films have in common is that the space people are immersed in is artificial construct created to mimic our perceived worlds. In both cases, we rely on visual cues to tell us how time and space are defined.

In film, this is done in master-scene format. First, a wide shot of the entire area in which the action takes place. This sets our expectation and understanding of space. If the action happens in an apartment, it’s typical to start with the characters talking while we’re being shown a shot of the entire building, followed by a medium shot that shows the characters in place in the apartment, followed by close-ups of each character in the scene. While this sequence can be shot over days or weeks, and out of order, it is presented to the viewer in a way that continually shows the boundaries of the perceived physical space while revealing new information that propels the story.

Good Web experiences work the same way using Information Architecture, Design, and content strategy. Through a number of devices, whether it be bread crumb navigation, chunking content, and ordering pages to be quickly scanned and clicked through, the placement of these elements for interaction should also always keep users aware of “where they are” and “where they’re going” in the perceived world of the Website, since it has no physical volume like tangible objects (think books) that are always subtly cluing us in on where we are in a real, physical space or object exploration.

By designing with these constructs in mind, we can ultimately create an experience that manipulates perceptions of time and space: to bring more immersion to the table. Getting “sucked in” to a film or a Website is a product of this effective manipulation, along with direction and editing techniques like matched action.

Experience Themes

With all this theory floating around, the natural next question is “How do you do it?” Luckily, Cindy has created a process called Experience Themes that draws from screenwriting to create a process that aligns the people working on a Website to  develop the main themes for visitors, and builds the experience around those central ideas. She also has a presentation solely dedicated to the topic that is also worth your thumbs-up on the SXSW panel picker.

In this panel, we’ll be showing the high-level approach to making experience themes specifically related to the ways screenwriters go through the process of creating the story, characters, and outline of their script. Here’s her Experience Theme presentation from the IA summit to give you a feeling of just how interesting and deep this goes:

Hopefully, this gives you a better idea of the topics we’ll be covering in our panel. You’ve gotten this far, now you should help us get to the dais by thumbing-up our SXSW panel on How Screenwriting and Film Theory Creates Enchanting Websites.

But let’s not limit this to this one panel presentation. Please contribute your ideas here in the comment section, or on Twitter @mleis and @cchasitain.

No related posts.