UXPA 2013 CARD: A Collaborative Tool for Rapid Task Analysis and Design

1,590 views

Published on

To create great design you need to understand how your users do their work. You can do that using CARD, a collaborative method that gets your team on the same page about your user's workflow. Apply it to desktop, web, or mobile apps. New to task analysis? Looking for new ways to collaborate with your developers? Or variations you can use with your work? This method is for you!

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,590
On SlideShare
0
From Embeds
0
Number of Embeds
79
Actions
Shares
0
Downloads
17
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • Do Intros of us and group here!! Write 3 questions on an easel!!Figuring out simple and complex Length of process doesn’t mean this takes a long timeLike many UX methods, you can apply it to a variety of platforms: desktop, web, or mobile. And in case some of you are wondering, it’s not just called CARD because it uses cardsIt’s an acronymThis training is by the 5 of us, but if there are any bad puns 4 of us want you to know they’re all by Len
  • [Emphasize hands on]Here’s our plan for how today will go – CARD –hands-onactivities throughout these sessionsCome back from lunch refreshed, not drowsy ;)And we’ll point you to resources, etc.Other than that we don’t have a specific time for questions, so you can ask questions as we goTime9:00 – 9:20 (20 min.)9:20 – 10:20 Break (10 min.)during current session10:30 – 11:30 (120 min)Lunch (1 hour) 12:30 – 2:30 (120 min)Break (10 min.)during future session2:40 – 3:40 (60 min)? PlanningBreak (5 min)3:45 – 4:15 (30 min) Success stories4:15– 4:35 (20 min) Resources~6 hrs. total
  • Ask first:Has anyone done CARD?Those of you’ve who’ve done it, what were the benefits?[Wait for answers.]We think CARD is useful, but don’t take our word for it. We ate our own dogfood, i.e. interviewed people in our UX group who’ve used CARD – affinitized the results, and these are benefits that they told us aboutThe strongest theme in the benefits people said was the shared understanding
  • Ask 1st: How many of you have done task analysis at one point or another …what techniques did you use?[Wait for answers.]Questionnaires, Contextual Inquiry, Field Analysis, Fault Tree Analysis, Critical Incident Analysis, Reality Mapping
  • Throughout today we’ll be covering why you might want to use CARD vs some of these other methods (as I mentioned earlier team consensus could be one reason, it’s visual rather than textual, multiuser workflows)For user profiles, could use personas, profiles, whatever works at your company, we use ‘roles & goals’Say we’re NOT covering optional CARD things, we can talk offline or at end if they’re interested??These activities/tools start with requirements and move into design. You iterate over these (requirements) based on the tool you chose. When we say “you”, we mean “your team”Note: explain difference between current flow & task analysis – one is flowchart, one is narrativeEmphasize that blue sky exists, is good can be very useful but at our co. we’ve found what works best is current & Be mindful of New feature development -- using prototyping as a tool to get started (you could do same with CARD-start off with future flow if new feature…) Mention somewhere here about different parts or types of CARD come from CARD method that was started with Tom Dayton at Bellcore.??
  • Thanks, Lissa. So we are going to learn about constructing a current workflow by doing one ourselves!
  • We’ve chosen an example that everyone can hopefully relate to.We are going to use Travelocity.com, a one-stop location for browsing and purchasing travel-related items—plane tix, car rentals, hotels, etc.Imagine that all of you work for Travelocity. Some recent web analytics research has revealed a substantial drop-off for customers trying to rent cars—they seem to click through most of the reservation process but do not book.Your job is to try and fix that!--Click to show diagram--To begin, we need to ask ourselves, does our team have a good understanding of its’ users and their goals? Let’s say we didn’t initially. So now imagine that a small group of you put together a Roles & Goals worksheet to formulate a quick, first pass at identifying users and their goals.--Click to show checkmark for R/G…---Further imagine that you have prioritized these roles and goals and have decided to focus on one role/goal combination to start.--Click to show R/G example--Take a moment now and look at the roles-n-goals worksheet handout, and in particular, spend a moment looking at the highest priority role and goal combination at the top.It covers an infrequent traveler who uses our site only occasionally to arrange their own travel, including rental cars.---Click to show diagram again---Now we need to ask ourselves, do we know how our users do the task today? Assume we don’t. As a result, we want to construct a current flow of our user renting a car.---Click to bring up ‘Current’---Now, ordinarily, you would involve SMEs in the construction of the current workflow. These may be customers or internal folks familiar with product usage.For our example, we’ve created a video of a user trying to accomplish a related goal. Based on our observation of the video and taking some notes, we are going to construct a current workflow.Let’s start off by examining the scenario….
  • Here is the scenario. It is based on the prioritized role/goal combination you have in front of you.Now let’s watch the ‘user’ doing this task…As you watch, feel free to take notes on what the user is doing as well as any pains they experience along the way. You will be able to refer to these notes shortly when you start building the current flow.
  • After the video…As a reminder, ordinarily, those building the flow will already have familiarity and knowledge of the tasks entering the activity, so they wouldn’t probably be ‘observing users’ right before building the flow. If anyone asks what happened after abandoning the Travelocity web site…I went to Enterprise web site and searched.  I did not see any type of discount, so I searched for ‘aaa.’  Turns out that Enterprise does not offer a AAA rate.  Who knew?!  So their price on their site was same as for Travelocity—about $500 total.I then went to AAA’s web site and searched.  Found a GREAT deal, $185 for full-size car. Total.  Compared to Avis’ $380 or so.  But there’s a catch.  Their best deals are for Hertz. And on Hertz’s descriptions of a full size car, the capacity is only 3 suitcases, not 4 like indicated on Travelocity’s web site (for Avis and Enterprise full-size car).  What do I do?  Assume full size will be big enough? Or look for larger car?  Next size up is Premium.  Still only 3 suitcases, even tho price jumps to $482 (or $380 if I pay in advance, which is unusual for renting a car).  Next size up from that is Luxury (yeah, baby…!), that holds 4 suitcases. Finally.  $595 or $474 if I pay in advance.I can alternatively explore Dollar and Thrifty on AAA’s web site (the only other two brands that offer a AAA discount), but I have to figure out, again, the smallest vehicle that holds 5 peeps and 4 suitcases by clicking on the vehicle and then searching by brand (like with Travelocity)….
  • Ok. So we’ve watched the ‘user’ and his experience at trying to compare rental cars using discounts. Before we begin to map out the flow, I’d like to explain the different components that make up a CARD flow: Goal(s), tasks, decisions, pains, and solutions. And time flows left to right as you would expect.You don’t need to use anything to connect the steps (the flow), but if you’d like, you can simply draw an arrow on a yellow stickie and insert it b/w two task steps.Note that we haven’t suggested that you write anything on the piece of paper itself. The benefit of using index cards and stickies is that you can move the task steps around as necessary, so that we don’t prematurely commit to something. We can easily ‘undo.’ Any questions?OK, let’s get started…I am going to bring back the scenario for us to have in front of us to guide the session. You can use your notes from watching the video to help you construct the task steps. We will facilitate your session, so don’t worry if you don’t remember everything. In fact, we will help you get started…
  • Where would you start?We suggest beginning with the goal…you can take it directly from the Roles &Goals worksheet or from your notes. Place it to the far right of the paper. This will mark the end of your flow. Use ayellow index card.[Add Goal to a Legend on the fly—can be whiteboard or piece of paper…]Now let’s return to the very first task step…what is it? How did our user get started? You can use a verb+noun construction if you’d like, for instance, Choose ‘Car Only’ option on the homepage. Keep your focus at the task level (i.e., you don’t care about user clicking buttons). Use the yellow index cards for these as well.OK, that’s it. Go ahead and try it out and we will help you!Activity timeframe:Intro to current workflow (10 min)Video (15 min)Initial setup (5 min)Map flow (60 min)Walk thru flow and make corrections (10 min)Debrief content (30 min)
  • @ Break : We have put up our own version of the current workflow around the room…feel free to take a look at ours on your way in/out of the room when taking your break.
  • Pick 1 person from your group to play the user and walk thru the flow. Does it make sense? Everything covered? Now is the time to fill in any holes, make any corrections, etc.Lastly, after you are done walking through the flow, see if you can identify any natural phases (like affinitization) that your tasks can be grouped into…and go ahead and label them using index cards or stickies and placing them above the tasks. Labeling the phases makes workflows easier to digest sometimes.Also, give your flow a title. You can go ahead and write this directly on the paper. 
  • Ask folks to report out – What did you learn from the activity? Get a couple of answers – 1 from each table
  • I’d like to review the anatomy of a current flow briefly. To begin, you have the primary components that we presented earlier. You are probably very familiar with these now. There are some additional components that you may or may not have used in constructing your own flows.Connections/jumps can be used to connect a task step to an earlier or later task step cleanly, w/o having to potentially draw a long line on the paper connecting disparate task steps. It allows you flexibility.There is the double box. This box-within-a-box conveys that there are multiple steps that are performed, but that can be performed in any order.There are the phases of work. These are nice as a way to view a set of task steps at a glance.And there is a title to bring it all together.If someone asks about triggers, explain that it is an advanced maneuver—you can use to help book-end or frame the workflow. It is not necessary, however.
  • There are a variety of supporting materials you can use to help you…here are a few….…very few are unique to CARD…… and knowing your team can help you decide which you want to use
  • Ask for audience participation: Why use CARD vs. task analysis or some other method? What are the advantages of using CARD?”task analyses are more narrative; workflows are visual by nature, which can be advantageous…CARD current workflows allow for the capture of solutions while not derailing the process of building the current flow.
  • There are a number of variations depending on time and resources, since we don’t live in an ideal world….These include...The bottom line: Just get out and do it!End with segue to lunch…please be back at 1:45p
  • Let’s “segway” from Current task flow to something we call a future taskflowWe just talked about the “as is” or current workflow now focus on “to be”Introduction 1:45 1:50 (5 min) Brainstorm future by self 1:50 1:55 (5 min)Create future with group 1:55 3:00 (65 min)Break 3:00 3:30 (30 min)Fut cont’d 3:30 3:45 (15 min)Verify future 3:45 3:55(10 min)Debrief 3:55 4:15 (20 min)
  • Introduction 1:45 1:50 (5 min) Here is our decision treeWe just did a current flow – with tasks, pains and solutionsMake sure talk about removing painsClick – checkmark appearsClick – Future appear ACTION ITEM: Reinforce message from Intro about options. What we’re going to focus on today for the sake of the workshop. Emphasize that the skills they’re learning are applicable, the key difference is the context around building the flow (i.e., blue sky is constraint-less)With CARD we have two strategies are going to emphasize future workflowClickNow let’s talk about creating a future flowDefine future workflow In a future workflow the user accomplishes his/her goals without all the pains from the current workflow This is NEW flow NOT a re-write of each task The focus is on steps NOT the UIDo you always have to create a current flow before getting here? -No according to the diagram if you already know current workflow and pains you start here
  • Introduction 1:45 1:50 (5 min) Brainstorm future by self 1:50 1:55 (5 min)Create future with group 1:55 3:00 (65 min)Q:Where would you start?A:did someone say, ‘Current Workflow .?!’What about user goals? Have they changed?Click Brainstorm by yourselves the steps in the new flow using index cards Click As a group construct a future workflow – coaches will be walking around – they may mix things up by throwing a few curve balls at youCoaches keep an eye on how “blue sky” they get and reel them in with more constraintsThis is not a simple re-ordering of the steps…95 min to construct flow, take 10 min break, and then verify with the team…
  • Break 3:00 3:30 (30 min)Fut cont’d 3:30 3:45 (15 min)Verify future 3:45 3:55(10 min)Debrief 3:55 4:15 (20 min)
  • Break 3:00 3:30 (30 min)Fut cont’d 3:30 3:45 (15 min)Verify future 3:45 3:55(10 min)Q:Where would you start?A:did someone say, ‘Current Workflow .?!’What about user goals? Have they changed?Click Brainstorm by yourselves the steps in the new flow using index cards Click As a group construct a future workflow – coaches will be walking around – they may mix things up by throwing a few curve ball at youClick When you are have someone walk thru the flow as a user some things to watch for Coaches keep an eye on how “blue sky” they get and reel them in with more constraintsThis is not a simple re-ordering of the steps…95 min to construct flow, take 10 min break, and then verify with the team…
  • Debrief 3:55 4:15 (20 min)You guys report out – what did you learn?First time mention something relevant transition to slide – get a couple of answers – 1 from each table
  • Just get comments from people and have that lead into things we want to talk aboutThe REAL in future– something you can actually build!!It is not a blue sky—you have real-world constraints on your flow/design. Can’t just use the ‘Easy’ button.2) Usually fewer steps with less pain… but may have some pains (because you have constraints) left over Strategy might be not to remove sticky but make them less painful by moving them to end or beginning- minimize pain impact 3) May have some solutions left over that you could not incorporate…that’s OK. Review them as part of verificationUnused solutions may be able to be turned into bugs, feature requests, or placed on a product roadmap or a story backlog (Agile) 4) Be mindful of the constraints in the current flow, since they may continue to exist in future flowTime, people, money Some facilitation differences a)Keeping it REAL but letting go of some constraintsb)People may lean toward UI solutions – we don’t suppress as with current we capture (but it’s not endgame)c)Getting people started can sometimes be a challenged) blowing up the old vs. tweaking it different tactics
  • Ask for audience participation: Why use CARD vs. task analysis or some other method? What are the advantages of using CARD?”task analyses are more narrative; workflows are visual by nature, which can be advantageous…CARD current workflows allow for the capture of solutions while not derailing the process of building the current flow.
  • We’ve completed 2 workflows yeah!!!!Click There are three B’s in here we have not covered Big Pic, Blue, BRIDGEClick If you want to know more about them they can follow up with us or give them the short story Talk about big picture is a task affinity Talk about blue sky is a future with few constraints and more brainstorming Talk about BRIDGE is a topic for ½ day symposiumHand out table document that Lissa did??
  • Use more dramatic image
  • We had a lot of questionsWhat were our customers doing?The nature of the product was that our customers built something and gave it to their customers. Their customers may even be buying this thing too, so our customers were looking bad.We didn’t know about the workflow beyond our customer.Understanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • We had a lot of support calls (or at least a lot for Mathworks)For this particular product we were getting about 100 month – probably more than any other MW product.We had problems trying to organize these calls into something meaningful. We’ll talk more about how we solved that in a little while.Understanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • But by far the most common call was that the bloated library file was just too big.Our customers had a point. If they were sharing an algorithm which was computationally simple, why did we need to ship a 150MB file with their piece that could be 100K? They had a pointUnderstanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • Whenever we would talk to customers during usability testing, or a phone interview, or almost any interaction, this is what they wanted. They wanted a small file, something that they could email their customers.Understanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • Pick a picture of current that highlights key pointsUnderstanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • Make text more concisePick a picture of current that highlights key pointsUnderstanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • Remove cropped graphicPick a picture of current that highlights key pointsUnderstanding the current stateWith the help of external customers, captured the current flowEveryone on the team observed (developers, QE, doc, etc.)Internal surrogates filled in when we had difficulty recruiting local customersPain/problem areas were immediately apparent (“go directly to jail – visual representation showed how the customers had to go back to the beginning”, puddles of pain)Outcomes:The team enjoyed hearing the customers’ perspective and was clamoring for more user involvement. – Ownership and clarityThe team got confirmation of their hypotheses about how different aspects of the process can be performed by different types of users, with different skills and domain expertise.The team generated a number of ideas for improving the products. So much so that they were motivated to immediately address some of the low hanging fruit. Although, this might not be such a good thing.
  • Point out where the ah-ha moment was on the next slide
  • Overwrite blue skyGrab the pictures from the cartoon.Use same product as for current, include image to show key points. Should we actually use this one because it is showing a loop at the end. Debbie and I talked about using a Builder product version.
  • Say moved pain for one user group to user group where it wasn’t a painGlobal: Make titles title case
  • Remember when we mentioned earlier that team spent time categorizing customer callsMapped calls to steps in the workflow to identify…Size didn’t matter, believe it or not…“Make it smaller!”
  • Mentioned before that about 1.2 my time was dealing with issues. This is the other half
  • Create a whyscapeAsking why a lotToyota exampleOil on the floorSmall and local to big and organizational
  • Quality folks know about this stuff, this is a quality processWhy are we struggling so much?You’re doing analysis while you binFocus on the evidence.Framework for that
  • Make this more visually visual.
  • How about a deloreanMaybe put in a slide about how we went from flow to the design.
  • 20 minutes?Intro – 5 minutesActivity – 10 minutesWrap-up – 5 minutes“Prior Planning Prevents Poor Performance”This is something my hs econ teacher used to say all the timeI’ve found it to be true in a number of situationsJust like with other user-centered designactivities, thinking about things in advance can help you be more prepared for your CARD session and not end up like this hamster, wishing you were somewhere else
  • AUDIENCE PARTICIPATION – just to get a sense of what methods/techniques they’re familiar withEarlier today we asked you what task analysis techniques you had used. I want to expand that and also hear about any other research and design techniques you may be familiar with.
  • Before we start talking about how to plan for a CARD activity, we were interested in hearing about how you plan for other usability activities like usability tests, or interviews or site visits.So, tell me, how do you plan for Usability Activities like the ones I just mentioned? AUDIENCE PARTICIPATION
  • Take 10 – 15 minutes to think about a project you might consider using CARD on.Fill out the template, take advantage of this time to ask the workshop facilitators about any questions you might have.If person doesn’t have a project, they can offer to help/listen in on someone else’s projectHand outs:Decision treeCurrent & future planning templates
  • Report out 5 minutes…then move into other content?Key learning points the template is intended to help you reason out…Just like on any project it’s important to understand the landscapeStrategic/business objectivesTime constraintsResource constraintsDynamics among people involvedJust like on any project, it’s important to understandThe purpose of the activityYour goals for the activity (i.e., what you hope to accomplish)Target users (for project and activity)Who should participateUse the right method/technique given the situation and your goalsStart with what you (and the team) already know – don’t retrace steps team has already takenDepending upon the landscape, you may need to manage people’s expectations aboutParticipation (who will and won’t participate)Focus/scopeOutcome of the activity and how results will be used (e.g., Current won’t drill in to details, future won’t yield a design)When deciding who should participate, considerDo participants have a history?Have they ever worked together before?Is there a hierarchical relationship that may impact participation?Knowledge base of participants (e.g., how well versed are they about topic?)Emotional engagement / level of ownership of participants (e.g., how open-minded are they?)
  • As we mentioned earlier, we interviewed 25 – 30 UX people in our group.When going through the interview data we had gathered from fellow MathWorkers, we gave considerable thought to trying to understand why people thought CARD was more difficult, and required more planning/effort than other usability activities.From our perspective it’s actually very similarThink about many of the same questionsHere are our observations about the few things that CAN be differentCapturing/designing a workflow – Didn’t really talk about this during activity but something we identified as potential difference.It’s a little more abstract – not just talking about the UI, but about the steps But in actuality, when leveraging other task analysis techniques …aren’t you capturing a workflow? Kim Goodwin has a book and teaches a course on context scenarios. As part of these high-level “future scenarios” you’re inherently designing a workflow. Only difference is how it gets captured (boxes & arrows instead of words/pictures)Facilitating multiple participantsFacilitating multiple participants can be challenging. If you haven’t facilitated activities with more than 2 participants, this could be a challenge for you.Many of us facilitate large groups all the timeConducting brainstorming activitiesFacilitating collaborative design sessionsRunning focus groupsIt can certainly be taxing mentally and physically, but it’s something many of us are already quite competent at.Steep learning curveIf you’re company is anything like MathWorks, you have a few “standard” tools that you use when it comes to UX. At MathWorks, usability testing and affinity diagramming are part of the culture. CARD is often new to most people. There are different ways to handle that…The Lissa method: Act like it’s nothing new and just have them get started. Unpack what they need to know as they go like we did during activityThe Debbie technique: Prep participants and help them understand what to expect that might be different from what they’ve done (e.g., short presentation on CARD, explained how it works)Do what you think makes sense for you, your team and your organizational culture.Considerable time investment – We talked about strategies you can leverage to make it less of a time investmentTime box the activityDo some legwork ahead of timeThere are a number of benefits you get from that, particularly:Buy-in from the participants (i.e., your team)Collect and analyze the data at the same timeWe believe you get a lot of bang for your buck with this techniqueOften difficult to focusdiscussion – People tend to want to think about all of the things that might come into playEdge cases with current flowIn our experience, this often happens during other activities too.Stakeholders can be active participantsWhen we conduct a test, developers are observersWhen we interview customers, developers may ask questions but we’re usually leading the interviewWhen we affinity diagram test observations, it’s typically a quiet activity where developers are silent participants in categorizing the data…very controlled.When running CARD sessions, particularly when it comes time to do the future workflow, stakeholders are often active participants in constructing the flow.This is one potential DIFFERENCEAs a result, emotional engagement of stakeholders is often very high – need to take that into accountOur conclusion was that CARD may be different than some of the other activities you’re used to facilitating, but you have the skills you need to be successful.Especially if you prepare beforehand by identifying potential challenges and devising strategies for dealing with them.Although we’ve taught you something new (CARD) – one potential mistake you could make is selling it as this shiny new thing. Sometimes people grab hold of new ideas as “silver bullets” so be careful about falling into that trap.You don’t even have to use the acronym CARD if you don’t want to. Generally, exercising facilitation muscles you already have. It’s just that you’re using multiple muscle groups at once.
  • We gave it a lot of thoughtIn many ways, it’s not differentThink about many of the same questionsOur conclusion was…it’s not really all that different.In the immortal words of Winston Zeddemore: “We have the tools, we have the talent”
  • UXPA 2013 Notes:Consider folding in Len’s “Lessons Learned” from years of experience with methodUXPA 2013 Notes: This should probably be replaced with a bibliography/references slide
  • UXPA 2013 Notes: This should probably be replaced with a bibliography/references slide
  • UXPA 2013 CARD: A Collaborative Tool for Rapid Task Analysis and Design

    1. 1. 1 Real-World CARD A Tool for Task Analysis & Design By Len Conte, Mark Ainscow, Debbie Cook, Stephen Reinach & Lissa Story Verify understanding of data from other packages in MATLAB T2 Gone outside boundary of current tool set T3 Has reached a pain threshold and needs to solve something T4 Developing an algorithm T6 Trying out MATLAB to see if it is satisfactory T7 Curious about some data T8 Triggers Boss has set a problem to solve T1 I do it in MATLAB because it‟s already open T21 Wing it! T15 Is the data in a local text file? Yes Other workflows not explored E.g. local binary, scanned from journal, live feed, etc. Also, problems specific to cell arrays not addressed START Open data in text editor Preprocess data (Optional) Copy from text editor, paste into MATLAB Google “MATLAB” and My File format Search DOC for correct read function Make fake (small) file with same format to test RESEARCH Choose proper import method for data format, content, size File -> Import Import wizard No Too Big? Yes Reduce size of file Out of memory error (graceful) Double-click on file in Current Directory Browser (MAT-file) T11 Appropriate “load” or “read” function TRY TO LOAD Use MATLAB tools for data-specific import process Can‟t right-click on file in Windows Explorer and get MATLAB-related functions Can‟t single-click import a file from the Editor Indications that load succeeded are easy to miss There is no indication that the load result is useful No “Load” fails (ok) but doesn‟t suggest alternatives (bad) Data loads? Header rows in text file which are not labels (metadata) Data type of imported data does not match type in file Yes *Search Doc for file suffixes *Tools directory for importers Go back to “Research” MATLAB doesn‟t crash – data is visible somewhere in MATLAB for checking Progress bar or spinning icon for confirmation Open imported arrays in array editor At some point you have to start and see what goes wrong Weak date support – no “date” data type WHOS, etc. in command window Inspect in Import Wizard, Array Editor, Workspace Browser CHECK DATA Correlate data in file with variables and strings in MATLAB Excel shows immediately and directly what was imported – MATLAB doesn‟t Checking imported data against file may require multiple tools *Hard to examine edges of large data sets (e.g. four corners of matrix) Data in MATLAB matches data in the file No Imported data correct(ed)? Yes Thumbnail views of data *Can‟t do simple visualization transforms in GUI – transpose, log, etc. *Tools for examining 3D data (sliders, slices) DATA (numbers) is properly loaded and plottable G3 Correct data “by hand” Go back to “Research” Metadata handled? Create and name variables in Array Editor METADATA Manage labels, notes, odd data types Name variables in Import Wizard, Workspace browser, Command line No provision for metadata (notes, etc) Use Scribe and labeling (later) Punt Metadata No Yes MAKE DATA PLOTTABLE Is the correctly imported data complete and plottable? Find NaNs and deal with them *Examine corners of data, look for gaps, same number of crows throughout, etc. Checking :>2D data a special problem Spreadsheet type editing of numerical data Metadata in MATLAB matches data in the file Metadata loaded and plottable G3 Two vectors are incommensurate >> plot(x,y) (command line) MAKE DATA “VISUAL” Create a new figure – launch plot tools Plot from Workspace Browser Go to Help on “plot” or “graph” Preconceived Idea or standard format T16, 17, 18, 19 Plot Picker(s) All data and labels plot? No way, dude Yes All necessary data and labels are in working figure Figure is ready for analysis G4 *Plot looks wrong, but it is right (distorted by outlier) Plotting labels on x axis is problematic *Hard to get data from a plot – no single point *Highlight single data item in plot and edit it Change scaling DOC and Help Demos and examples Numbers are right? Spreadsheet type editing of numerical data Processing with functions in command window Transform the data Remove outliers Review problem statement SHOW OFF THE DATA Do the numbers fit the plot? FIND AND TRY BETTER PLOT TYPES Reconsider data Yes No Plot picker(s) Change plot Plot adequately shows data? Try another Yes No All necessary data correctly represented in the plot *Transform data by reorganizing it instead of reducing or throwing data away G10 *Segregate noise G11 Data and labels are workable for analysis purposes Data is adequately visualized G7 So many plots, so little time Hard to find Plot Picker(s) *Switching families of displays is a short mental step, but a long process Frustrating number of iterations It‟s hard to know what the best is when you haven‟t seen it yet Replot from command line or picker SHOW THE SOLUTION Work with the data view to understand and explain the data Zoom and/or Pan Data tips Ginput Figure Property Editor Change View (Camera Toolbar) Get smaller subset or known data to work with Right View for understanding? No Yes Back to change the plot Really bad Review problem statement Is data within acceptable parameters? T10 Does Data match hypothesis? T9 Many modes for exploration Zoom and pan at the same time? How bad is it? Not so bad Plot Tools Command line Inspector Figure Toolbar LET ME COUNT THE WAYS TO WORK WITH THE PLOT Which tool should I use? Do they work together? Need to add explanations to data T19 Concerned with the appearance of the data T22 LEGEND AND COLORBAR Add legend and colorbar first so they don‟t mess up your plot later Add legend and/or colorbar Scribe ADDING WORDS Lay in the details of the message Add data to plot (commands to script) title, labels, dataticks, etc. Inserting annotation starts plot edit mode Start Plot Edit Mode Data Tips MOVING THINGS AROUND Organize for presentation Align figure and legend Align multiple figures Change View (Camera Toolbar) Commands expect HG proficiency Writing formatting code is HARD Text formatting is hard (subscript, superscript) *Log x-axis superscripts hard to read on MAC *Did not know about “Latek” It isn‟t obvious how to add Greek or scientific symbols to the text *Can‟t easily reset variables to colormap Plot Edit mode is hard to find It‟s still easier toi annotate in another application *No minimal, light grey (one pixel) gridlines *Polar plots!!! Equation editor like MS Word *Function to convert a colordef to line handles *Mouse down on line to convert color on it from list *No group legend (x legend entries with y lines each) *Not obvious you can edit legend text directly *Must do legends first because they dominate space Legends cannot be mxn *The manner in which we use handles within legends has changed in the last three releases *There are different modes of access to MATLAB figures, but only the first is obvious Message is clear? No Yes Communicate effectively to Boss G6 Tufte smiles G12 Looks professional G14 SAVE Next? AUTOMATION Unexplored Export or Print Needs to insert info into a document T5 Need data in an electronic format T20 Build something to do the same thing tomorrow G9 Generate M-code Edit/Save script until it works Code replicates the plot? Running a script? Not everything can be automated Lock Legend – Plot distance Don‟t know how big is too big until you fail Data is in MATLAB G1 No way to tie metadata to data Data plottable? Fig-file T12 Back to “research” Yes No Data is ready for presentation treatment Understand and accept the data G8 Camera Toolbar Unexplored workflow (Moving to another application) Unexplored Workflow (Exporting and Printing) Punt automation Automation doesn‟t offer the options I want Automated input code doesn‟t link up with automated figure code Unexplored workflow (Cut, copy, paste) Reconsider data Can‟t set defaults for new figures (e.g. “box off” Get Raw Data Into MATLAB Check Data Against File Bring In Labels, Names, Notes First Shot at a Plot Clean the Data Manipulate and Explore the Data Dress and Display the Data Get the Plot Out Yes Yes Yes No Automate Collaborative Analysis of Requirements for Design
    2. 2. 2 What Will We Do? Time Section 9:00 Introduction 9:20 Create a current workflow 10:30 Break 11:00 Create a current workflow (cont.) 12:30 Lunch 1:45 Create a future workflow 3:00 Break 3:30 Create a future workflow (cont.) 4:15 Share success story 4:45 Plan for CARD
    3. 3. 3 Why Care about CARD?  Get team on same page – consensus and shared understanding  Generate task analyses  Generate workflows  Clarify/generate requirements  Generate idea/vision of future projects  Prioritize features and requirements  Find issues that fall between the „cracks‟  Help get you to a design
    4. 4. 4 What Will You Learn? You‟ll learn to:  Use a task analysis tool called CARD  Apply best practices when using CARD  Identify when to use CARD and its variations
    5. 5. 5 What is „Task Analysis‟? An information gathering technique that helps us: • Understand how users perform work to accomplish goals • Move from requirements (the what) to design (the how)
    6. 6. 6 What are Some Task Analysis Methods?
    7. 7. 7 How to Choose? Low Effort Rich Data Builds Consensus Visual Generates New Workflow Questionnaire X Interview X Contextual Inquiry X X Reality Map X X CARD: Big Picture X X X CARD: Current X X X CARD: Future X X X X
    8. 8. 8  A tool for performing task analysis or design where users and stakeholders, guided by a facilitator, collaborate in construction of workflows. What is CARD? I think I’d rather manage a large software development project.
    9. 9. 9 Using CARD to Get to a Design Yes Yes Yes No No No Research users & their goals Your Method Your Task Analysis Method Future Design Scenario Current WorkFlow Big Picture (optional) Bluesky (optional) Future Workflow BRIDGE (optional) Your Method Do you understand users and their goals? Do you understand current workflow? Do you want to use CARD to get to a design? System Under Design Wireframes, click-thrus, paper prototypes, sketches, workflow designs, API’s
    10. 10. 10 Current Workflow
    11. 11. 11 Using CARD to Get to a Design Yes Yes No No Current WorkFlow Big Picture (optional) Do you understand users and their goals? Do you understand current workflow? Your MethodResearch users & their goals Your Task Analysis MethodCurrent Workflow
    12. 12. 12 Travelocity - Car Rental: Scenario  User: Stephen, an infrequent traveler who loves a good online deal.  Goal: Stephen will be traveling to Pasadena, CA, to attend the Tournament of Roses Parade Jan 1, 2014. He needs to rent a car while he is out there on vacation.  Task: Find the best rental car deal possible using discounts available to him. He has an Avis discount # and is also a AAA member.
    13. 13. 13 Travelocity - Car Rental: Video
    14. 14. 14 Anatomy of a Current Workflow Solution Task Pain Decision GoalDecisionTask SolutionPain Goal Time
    15. 15. 15 Travelocity - Car Rental: Constructing the Flow  User: Stephen, an infrequent traveler who loves a good online deal.  Goal: Stephen will be traveling to Pasadena, CA, to attend the Tournament of Roses Parade Jan 1, 2014. He needs to rent a car while he is out there on vacation.  Task: Find the best rental car deal possible using discounts available to him. He has an Avis discount # and is also a AAA member.
    16. 16. 16 Break
    17. 17. 17 Travelocity - Car Rental: Validate the flow  Pick someone to walk through the flow as „user‟ – Make sense? Everything covered?  Add phases and a title
    18. 18. 18 Travelocity - Car Rental: Debrief: Creating a Current Workflow  Doing – How‟d it go? – What did you find challenging? Easy? Puzzling?  Facilitation – What did you notice about our facilitating?
    19. 19. 19 Anatomy of a Current Workflow Title Phase/Activity Solution Task Pain Connection Decision Goal Double Box
    20. 20. 20 Supporting Materials (Optional)  Agenda  Ground rules  Description of target users  Scenario  Out of scope  Terminology  Legend  Parking Lot
    21. 21. 21 Who is Involved?  Participants – Real or surrogate users  Facilitator – Leads the activity  Sponsor (optional) – Champion  Observers (optional) – Role is similar to an observer at a usability session
    22. 22. 22 Why use CARD?  Provides visual model of the current work – Helps you see bottlenecks and other puddles of pain – Helps you see the length of the flow and its phases – Helps you see decision points  Collaborative  Creates buy-in  Scales to larger more complex workflows – Multi-user/swim lanes – Accommodates branching  Captures solutions
    23. 23. 23 Current Workflow: What Are Some Variations?  If you are familiar with the flow, you create it and validate it with the team.  Create current flows one on one with key participants. You do the consolidation.  Time box the activity (60 minutes)  Save time by having participants brainstorm tasks ahead of time.  Create the current flow on the whiteboard (no cards, no paper, no problem) Just do it!
    24. 24. 24 Lunch!
    25. 25. 25 Future Workflow
    26. 26. 26 No Research users and their goals Yes Yes Using CARD to Get to a Design Do you understand users and their goals? Yes No Your Method Use Cases Current WorkFlow Big Picture (optional)Current Workflow Could you use CARD to get to a design? Future Workflow Bluesky (optional)Future Workflow Do you understand current workflow?
    27. 27. 27 Travelocity - Car Rental: Create a Future Workflow 1. Individually brainstorm steps for a new future flow 2. At your tables as a group, construct a future workflow
    28. 28. 28 Break
    29. 29. 29 Travelocity - Car Rental: Create a Future Workflow (cont.) construct a future flow continued 3. Verify the new flow 4. Walk through the future flow (as the user) – Compare to your current flow  Did some (or all) of the pains go away?  Were any of the solutions incorporated into your workflow?
    30. 30. 30 Travelocity - Car Rental: Debrief: Creating a Future Workflow  How‟d it go? – What did you find challenging? Easy? Puzzling?  Facilitation – Was there anything different about our facilitation that you noticed?
    31. 31. 31 Travelocity - Car Rental: Debrief: Creating a Future Workflow  Future = Something you can build = „to be‟  Contrast with current workflow – Fewer pains – Shorter flow – Incorporates some solutions from current flow  You may still have solutions left over – Constraints may still exist  Facilitation Verify understanding of data from other packages in MATLAB T2 Gone outside boundary of current tool set T3 Has reached a pain threshold and needs to solve something T4 Developing an algorithm T6 Trying out MATLAB to see if it is satisfactory T7 Curious about some data T8 Triggers Boss has set a problem to solve T1 I do it in MATLAB because it‟s already open T21 Wing it! T15 Is the data in a local text file? Yes Other workflows not explored E.g. local binary, scanned from journal, live feed, etc. Also, problems specific to cell arrays not addressed START Open data in text editor Preprocess data (Optional) Copy from text editor, paste into MATLAB Google “MATLAB” and My File format Search DOC for correct read function Make fake (small) file with same format to test RESEARCH Choose proper import method for data format, content, size File -> Import Import wizard No Too Big? Yes Reduce size of file Out of memory error (graceful) Double-click on file in Current Directory Browser (MAT-file) T11 Appropriate “load” or “read” function TRY TO LOAD Use MATLAB tools for data-specific import process Can‟t right-click on file in Windows Explorer and get MATLAB-related functions Can‟t single-click import a file from the Editor Indications that load succeeded are easy to miss There is no indication that the load result is useful No “Load” fails (ok) but doesn‟t suggest alternatives (bad) Data loads? Header rows in text file which are not labels (metadata) Data type of imported data does not match type in file Yes *Search Doc for file suffixes *Tools directory for importers Go back to “Research” MATLAB doesn‟t crash – data is visible somewhere in MATLAB for checking Progress bar or spinning icon for confirmation Open imported arrays in array editor At some point you have to start and see what goes wrong Weak date support – no “date” data type WHOS, etc. in command window Inspect in Import Wizard, Array Editor, Workspace Browser CHECK DATA Correlate data in file with variables and strings in MATLAB Excel shows immediately and directly what was imported – MATLAB doesn‟t Checking imported data against file may require multiple tools *Hard to examine edges of large data sets (e.g. four corners of matrix) Data in MATLAB matches data in the file No Imported data correct(ed)? Yes Thumbnail views of data *Can‟t do simple visualization transforms in GUI – transpose, log, etc. *Tools for examining 3D data (sliders, slices) DATA (numbers) is properly loaded and plottable G3 Correct data “by hand” Go back to “Research” Metadata handled? Create and name variables in Array Editor METADATA Manage labels, notes, odd data types Name variables in Import Wizard, Workspace browser, Command line No provision for metadata (notes, etc) Use Scribe and labeling (later) Punt Metadata No Yes MAKE DATA PLOTTABLE Is the correctly imported data complete and plottable? Find NaNs and deal with them *Examine corners of data, look for gaps, same number of crows throughout, etc. Checking :>2D data a special problem Spreadsheet type editing of numerical data Metadata in MATLAB matches data in the file Metadata loaded and plottable G3 Two vectors are incommensurate >> plot(x,y) (command line) MAKE DATA “VISUAL” Create a new figure – launch plot tools Plot from Workspace Browser Go to Help on “plot” or “graph” Preconceived Idea or standard format T16, 17, 18, 19 Plot Picker(s) All data and labels plot? No way, dude Yes All necessary data and labels are in working figure Figure is ready for analysis G4 *Plot looks wrong, but it is right (distorted by outlier) Plotting labels on x axis is problematic *Hard to get data from a plot – no single point *Highlight single data item in plot and edit it Change scaling DOC and Help Demos and examples Numbers are right? Spreadsheet type editing of numerical data Processing with functions in command window Transform the data Remove outliers Review problem statement SHOW OFF THE DATA Do the numbers fit the plot? FIND AND TRY BETTER PLOT TYPES Reconsider data Yes No Plot picker(s) Change plot Plot adequately shows data? Try another Yes No All necessary data correctly represented in the plot *Transform data by reorganizing it instead of reducing or throwing data away G10 *Segregate noise G11 Data and labels are workable for analysis purposes Data is adequately visualized G7 So many plots, so little time Hard to find Plot Picker(s) *Switching families of displays is a short mental step, but a long process Frustrating number of iterations It‟s hard to know what the best is when you haven‟t seen it yet Replot from command line or picker SHOW THE SOLUTION Work with the data view to understand and explain the data Zoom and/or Pan Data tips Ginput Figure Property Editor Change View (Camera Toolbar) Get smaller subset or known data to work with Right View for understanding? No Yes Back to change the plot Really bad Review problem statement Is data within acceptable parameters? T10 Does Data match hypothesis? T9 Many modes for exploration Zoom and pan at the same time? How bad is it? Not so bad Plot Tools Command line Inspector Figure Toolbar LET ME COUNT THE WAYS TO WORK WITH THE PLOT Which tool should I use? Do they work together? Need to add explanations to data T19 Concerned with the appearance of the data T22 LEGEND AND COLORBAR Add legend and colorbar first so they don‟t mess up your plot later Add legend and/or colorbar Scribe ADDING WORDS Lay in the details of the message Add data to plot (commands to script) title, labels, dataticks, etc. Inserting annotation starts plot edit mode Start Plot Edit Mode Data Tips MOVING THINGS AROUND Organize for presentation Align figure and legend Align multiple figures Change View (Camera Toolbar) Commands expect HG proficiency Writing formatting code is HARD Text formatting is hard (subscript, superscript) *Log x-axis superscripts hard to read on MAC *Did not know about “Latek” It isn‟t obvious how to add Greek or scientific symbols to the text *Can‟t easily reset variables to colormap Plot Edit mode is hard to find It‟s still easier toi annotate in another application *No minimal, light grey (one pixel) gridlines *Polar plots!!! Equation editor like MS Word *Function to convert a colordef to line handles *Mouse down on line to convert color on it from list *No group legend (x legend entries with y lines each) *Not obvious you can edit legend text directly *Must do legends first because they dominate space Legends cannot be mxn *The manner in which we use handles within legends has changed in the last three releases *There are different modes of access to MATLAB figures, but only the first is obvious Message is clear? No Yes Communicate effectively to Boss G6 Tufte smiles G12 Looks professional G14 SAVE Next? AUTOMATION Unexplored Export or Print Needs to insert info into a document T5 Need data in an electronic format T20 Build something to do the same thing tomorrow G9 Generate M-code Edit/Save script until it works Code replicates the plot? Running a script? Not everything can be automated Lock Legend – Plot distance Don‟t know how big is too big until you fail Data is in MATLAB G1 No way to tie metadata to data Data plottable? Fig-file T12 Back to “research” Yes No Data is ready for presentation treatment Understand and accept the data G8 Camera Toolbar Unexplored workflow (Moving to another application) Unexplored Workflow (Exporting and Printing) Punt automation Automation doesn‟t offer the options I want Automated input code doesn‟t link up with automated figure code Unexplored workflow (Cut, copy, paste) Reconsider data Can‟t set defaults for new figures (e.g. “box off” Get Raw Data Into MATLAB Check Data Against File Bring In Labels, Names, Notes First Shot at a Plot Clean the Data Manipulate and Explore the Data Dress and Display the Data Get the Plot Out Yes Yes Yes No Automate Choose Data file from Current Directory Browser - Confirmation message - Progress bar - Better error handling Load preview to - Open in MATLAB - Make a guess on the file format and preview with suggested plot type Subsample large files for display and diagnostic purposes Data file Too Big? Will subsampled data do the job? Sheaf of solutions for oversize files Yes No Most recently used selected first for given data/file combinations (and plot)Smart Importing System tracks most frequently used, most recently used, and offer them preferentially Operations on paged (oversize) files in memory Data is in MATLAB G1 DATA (numbers) is properly loaded and plottable G3 Metadata loaded and plottable G3 Figure is ready for analysis G4 Augmented Import Tool Prioritize steps just taken for next use (mru, mfu with profile) Save a “profile” of he original file, and attach the importing steps Offer to save decisions made while importing a file Open variables created in workspace in Array Editor Offer to save imported data to a mat-file Offer to Save Everything Analysis routines elsewhere in MATLAB? Pass data to analysis module (Simulink, Stats tool, curve fitting, etc.) Use mru, mfu to suggest analysis modules Remember this path and this option Analyze Edit data in figure point-by point and by groups Replace original with transformed data and save both Yes No “Load” makes suggestions on failure *Data transformed by reorganizing it instead of reducing or throwing data away G10 *Noise segregated G11 Clean and Transform Data No Apply Simulink,Toolboxes, etc. Yes All data and metadata imported correctly and ready for analysis Check data in import wizard (all three views) Each file type requires a different “fixit” bag of tricks – lead user to them (e.g. allow importing data as smaller – non-double) type Flag and dump file names, column headers, case names, notes, etc. into metadata repository Allow user to collect catalog of (preferred) plots which are important to him Make a “date” data type Metadata repository Spreadsheet view – check numbers and labels Plot View – select best plot with plot picker view to scan and check data Text Editor – view for checking data against file Ability to collect lots of “profiles” from different users to selece/choose first load profiles Create Labels, etc., automatically from metadata Check all data and metadata Everything OK Data not importing correctly Plot not right for checking data Use mru, mfu to suggest import and plot preferences Data is “clean” - ready for observation and inference Live Plot Catalog Users add plots they have written, plots from MATLAB Central, etc. Winnows plot types by smarts about data, use history, and perhaps direct questions to user Thumbnails can be reasonable size if they are prioritized – less likely ones relegated to “More types” Click on one of a set of Thumbnail views to see preview of real data (like Excel) A hybrid figure window with choosing tools Users remove options they will never use – or designate favorites User chooses plot type and creates figure with plotted data and metadata Caveat: Thumbnails must be adequate size or they are useless. This puts a high priority on screening the large catalog so as to present a small group likely to contain the right plot well Supply relevant commands to command line Plot is suitable? No “Real” Thumbnails can be facilitated by a combination of background processing and immediately drawing users‟ (preliminary) selections Yes Live thumbnails can be confusing, inaccurate, error-prone, and confusing. Be careful Plot is for “telling a story” Plot is intended as part of a tool for downstream users e.g. building in the Slice-O-Matic (Unexplored) No Yes Zeigen und Reden (Show) Combine several Camera Toolbar modes into a scene view mode (Google Earth) Combine pan, zoom, rotate into a single explore mode Think about keeping modes as orthogonal as possible. If users want two modes at once, perhaps we need one mode with a property or a minor mode Camera toolbar is half about exploring and half about appearance One annotation mode that brings up a palette with arrow, double arrow, text, etc – these become sub-modes Data-space annotations Combine data cursors with other annotations Refactor text annotation More work needed on Legend – extra session for legend planned Metadata
    32. 32. 32 Who is Involved?  Participants – Real or surrogate users – Other team members  Facilitator – Leads the activity  Sponsor (optional)  Observers (optional) How Many Participants? • Optimal 3-5 - no more than 6
    33. 33. 33 Why Use CARD to Create a Future Workflow?  Provides a visual model of it – Helps you see newly arranged tasks – Helps you see the length of the new flow and its phases – Leverages solutions from current workflow  Collaborative  Creates buy-in  Validates that important pains have been solved  Helps generate requirements grounded in a “future vision”  Scales from small to large workflows
    34. 34. 34 Future Workflow: What are some Variations?  Focus on the “happy path”  Use a small group (1-3 participants)  Time box the activity (60 minutes)  Do it 1 on 1 with customer surrogates then validate with others
    35. 35. 35 Using CARD to Get to a Design Yes Yes Yes No No No Research users and their goals Future Design Scenarios Your Method Your Task Analysis Method Current Workflow Big Picture (optional) Bluesky (optional) Future Workflow BRIDGE (optional) Do you understand users, roles and goals? Do you understand current workflow? Big Picture (optional) Bluesky (optional) BRIDGE (optional) Could you use CARD to get to a design? Design Wireframes, click-thrus, paper prototypes, sketches, design cases, API’s
    36. 36. 36 CARD Case Study - EZDeploy
    37. 37. 37 Overview of the Builder Product JavaTM Application Wrapper MATLAB Code Bloated Library File
    38. 38. 38 Overview of the Builder Product Java TM Application Wrapper MATLAB Code Bloated Library File
    39. 39. 39 Overview of the Builder Product Enterprise Application Wrapper MATLAB Code Bloated Library File
    40. 40. 40
    41. 41. 41
    42. 42. 42
    43. 43. 43
    44. 44. 44
    45. 45. 45 The Plan Produce a current workflow…
    46. 46. 46 Who was Involved?  Participants – Selected customers who had called our technical support team (2) – Advanced support team (2)  Facilitator – UXer (1)  Sponsor – Development Lead (1)  Observers – Developers (~3) – Validation Team (~2) – Documentation Writer (1)
    47. 47. 47 Current workflow
    48. 48. 48 Immediate Results  Pain problem areas were identified as puddles of pink  The facilitators and internal surrogates worked with the customers to explore problem areas
    49. 49. 49 Immediate Results  The team (observers) enjoyed hearing the customers‟ perspective and were clamoring for more involvement  The team‟s beliefs were confirmed that the process involved the expertise of many types of users
    50. 50. 50 Immediate Results  Development team was able to identify quick fixes for areas of low hanging fruit
    51. 51. 51 What next?
    52. 52. 52
    53. 53. 53 The Next Phase - Construct the Future Workflow  Invited the same team as the current flow – But no customers (IP and Patent)  Developers participated in the design of the flow
    54. 54. 54 Future Workflow Builder Blue Sky Workflow – Configuration Segment Triggers Existing code base in C# or .NET Want to move something off my plate; give it to someone else Upgrade MATLAB Problem to solve - MATLAB by Design - MATLAB fastest route; high confidence Request to formalize or productize code. Specific examples include: -Move product from R&D to Manufacturing / commercialization - Request for prototype or proof of concept - Request for a solution or algorithm created in MATLAB Existing GUI that I want to turn into a Web application Add button to MATLAB IDE to evoke Deploytool. Show all the possible targets, then get the user to configure as necessary User pushes button on MATLAB IDE to start deploytool (user) Has deploytool already been configured (system) User selects which targets they would like to install (User) Check to see if Builder product is installed and bought Provide information with links in the doc etc to provide links Target may be a deployable CTF target. MathWorks Builder NE Acquisition process (User) Lots of manual steps, user needs to install the framework Does the user want to install the .NET framework? (User) Deploytool Guides User through installing .NET framework on their machine Let’s the user run preferences, and settings Probes system to give config options System will check configuration of machine to make sure all the components and files for .NET are installed User may not elect to install the framework. If the framework is not installed, the only deployable component will be the deployable CTF. Deploytool launches tests, system, runtime, verify, and config Did it pass the tests? Deploytool tells the user what is missing Go to A A Goals Machine configured with .NET framework Machine configured without .NET framework No No Yes Yes No User can create an “integration project” within the MATLAB IDE, or select an individual file to deploy (right mouse clicking or equivelent). User can select a target if in the integration project. Will only perform a bare syntax check during coding. Slightly different for different targets Selecting specific target will allow syntax check on M code if user wants to Triggers Existing code base in C# or .NET Want to move something off my plate; give it to someone else Upgrade MATLAB Problem to solve - MATLAB by Design - MATLAB fastest route; high confidence Request to formalize or productize code. Specific examples include: -Move product from R&D to Manufacturing / commercialization - Request for prototype or proof of concept - Request for a solution or algorithm created in MATLAB Existing GUI that I want to turn into a Web application User has written their code or has chosen the code they want to deploy. The code is arranged into an integration project. (User) User can create an “integration project” within the MATLAB IDE, or select an individual file to deploy (right mouse clicking or equivelent). Is the user creating a .NET assembly or generic CTF? (User) Create CTF (System) Assign M-Components to .NET classes (System) DepFun Licensing – Which M files deploy Which targets may wrap these M-Files Create the CTF? (System and user) Create CTF (System) DepFun Licensing – Which M files deploy Which targets may wrap these M-Files Under certain circumstances the CTF may not need to be created – e.g. If this is the second time around because a new target is specified. Create .NET Wrapper (System) Create Binary (System) .NET Assembly Yes No CTF Deployable .NET Assembly (and optional generic CTF component) CTF and Assembly packaged together Deployable generic CTF component Builder Blue Sky Workflow – MATLAB Programmer Segment The upper route will produce a generic CTF component only. It is thought that the person responsible for creating this will have no knowledge of .NET assemblies and will able to pass this component to the integrator. The integrator can then modify or edit the interface when they receive the component. No .NET framework needs to be installed and configured on the MATLAB programmer’s machine as the target is not specific. The only target available will be the generic CTF if no framework is installed. This route would be preferred by MATLAB programmers who have no experience with .NET The lower route will produce a .NET assembly and a generic CTF component if desired. It is thought that the person responsible for creating this will have a knowledge of the target language. Following this route is for the more expert programmer, and knows how to define the .NET interface within MATLAB. This would allow the user produce the .NET assembly that can be immediately incorporated into the enterprise model without modification. Deployable generic CTF component Deployable .NET Assembly (and optional generic CTF component) Does the integrator think that the interface is OK? Opens interface in GUI and makes changes as necessary GUI separate from MATLAB. Allows integrator to change interface as needed Create .NET Wrapper (System) Create Binary (System) No Yes The integrator can create any target, provided they have a MATLAB license for that target Integrate Assembly into enterprise system The lower route will produce a .NET assembly and a generic CTF component if desired. It is thought that the person responsible for creating this will have a knowledge of the target language. Following this route is for the more expert programmer, and knows how to define the .NET interface within MATLAB. This would allow the user produce the .NET assembly that can be immediately incorporated into the enterprise model without modification. The upper route will produce a generic CTF component only. It is thought that the person responsible for creating this will have no knowledge of .NET assemblies and will able to pass this component to the integrator. The integrator can then modify or edit the interface when they receive the component. No .NET framework needs to be installed and configured on the MATLAB programmer’s machine as the target is not specific. The only target available will be the generic CTF if no framework is installed. This route would be preferred by MATLAB programmers who have no experience with .NET Builder Blue Sky Workflow – Integrator Segment The integrator receives either Deployable CTF or .NET Assembly. It may be that in the case of the .NET Assembly, the Integrated assembly
    55. 55. 55 There was an Ah-Ha Moment  I have no idea what it was but the developers were really excited about it, and they were able to remove a chunk of the workflow which contained a lot of pink
    56. 56. 56 Customers tried to solve our problem for us… And the bloated library file? Size doesn‟t matter… We provided an automatic download in an installer for their customers… …believe it or not. “Make it smaller!” …and they were happy.
    57. 57. 57 Technical support set out on a project to understand and improve through root cause analysis (RCA) Before CARD… Our Previous Attempt at Dealing with Customer Support Calls
    58. 58. 58 Root Cause Analysis
    59. 59. 59  We had poorly defined categories  Our Root Cause Analysis method looked at one customer issue at a time  Which call were we supposed to pick? (~100/mo) Three Problems with Our Approach to Classifying Issues
    60. 60. 60 Our Categories Looked Like This… Flickr: jessicareeder
    61. 61. 61  “This was hard”  Lots of arguing about what was a category  Could something be in two categories?  Could the categories change?  “Why are we doing this?”  “I don‟t like you” Consequences of Our Process…
    62. 62. 62 Talked with the quality folks at MathWorks “Trouble organizing issues? Are you focusing on the evidence? Do you have a workflow?” Workflow? Did you say Workflow?? We Needed to Fix an Inefficient Process
    63. 63. 63 Why Categorize Against a Workflow? Workflows or other value stream maps provide a wonderful framework for categorizing evidence. Evidence tends to be less controversial.
    64. 64. 64 We Used CARD to Define Our Categories 1. Steps in the current flow became categories 2. Did it collaboratively with the development team to get buy in 3. Et voila! You have categories! Verify understanding of data from other packages in MATLAB T2 Gone outside boundary of current tool set T3 Has reached a pain threshold and needs to solve something T4 Developing an algorithm T6 Trying out MATLAB to see if it is satisfactory T7 Curious about some data T8 Triggers Boss has set a problem to solve T1 I do it in MATLAB because it‟s already open T21 Wing it! T15 Is the data in a local text file? Yes Other workflows not explored E.g. local binary, scanned from journal, live feed, etc. Also, problems specific to cell arrays not addressed START Open data in text editor Preprocess data (Optional) Copy from text editor, paste into MATLAB Google “MATLAB” and My File format Search DOC for correct read function Make fake (small) file with same format to test RESEARCH Choose proper import method for data format, content, size File -> Import Import wizard No Too Big? Yes Reduce size of file Out of memory error (graceful) Double-click on file in Current Directory Browser (MAT-file) T11 Appropriate “load” or “read” function TRY TO LOAD Use MATLAB tools for data-specific import process Can‟t right-click on file in Windows Explorer and get MATLAB-related functions Can‟t single-click import a file from the Editor Indications that load succeeded are easy to miss There is no indication that the load result is useful No “Load” fails (ok) but doesn‟t suggest alternatives (bad) Data loads? Header rows in text file which are not labels (metadata) Data type of imported data does not match type in file Yes *Search Doc for file suffixes *Tools directory for importers Go back to “Research” MATLAB doesn‟t crash – data is visible somewhere in MATLAB for checking Progress bar or spinning icon for confirmation Open imported arrays in array editor At some point you have to start and see what goes wrong Weak date support – no “date” data type WHOS, etc. in command window Inspect in Import Wizard, Array Editor, Workspace Browser CHECK DATA Correlate data in file with variables and strings in MATLAB Excel shows immediately and directly what was imported – MATLAB doesn‟t Checking imported data against file may require multiple tools *Hard to examine edges of large data sets (e.g. four corners of matrix) Data in MATLAB matches data in the file No Imported data correct(ed)? Yes Thumbnail views of data *Can‟t do simple visualization transforms in GUI – transpose, log, etc. *Tools for examining 3D data (sliders, slices) DATA (numbers) is properly loaded and plottable G3 Correct data “by hand” Go back to “Research” Metadata handled? Create and name variables in Array Editor METADATA Manage labels, notes, odd data types Name variables in Import Wizard, Workspace browser, Command line No provision for metadata (notes, etc) Use Scribe and labeling (later) Punt Metadata No Yes MAKE DATA PLOTTABLE Is the correctly imported data complete and plottable? Find NaNs and deal with them *Examine corners of data, look for gaps, same number of crows throughout, etc. Checking :>2D data a special problem Spreadsheet type editing of numerical data Metadata in MATLAB matches data in the file Metadata loaded and plottable G3 Two vectors are incommensurate >> plot(x,y) (command line) MAKE DATA “VISUAL” Create a new figure – launch plot tools Plot from Workspace Browser Go to Help on “plot” or “graph” Preconceived Idea or standard format T16, 17, 18, 19 Plot Picker(s) All data and labels plot? No way, dude Yes All necessary data and labels are in working figure Figure is ready for analysis G4 *Plot looks wrong, but it is right (distorted by outlier) Plotting labels on x axis is problematic *Hard to get data from a plot – no single point *Highlight single data item in plot and edit it Change scaling DOC and Help Demos and examples Numbers are right? Spreadsheet type editing of numerical data Processing with functions in command window Transform the data Remove outliers Review problem statement SHOW OFF THE DATA Do the numbers fit the plot? FIND AND TRY BETTER PLOT TYPES Reconsider data Yes No Plot picker(s) Change plot Plot adequately shows data? Try another Yes No All necessary data correctly represented in the plot *Transform data by reorganizing it instead of reducing or throwing data away G10 *Segregate noise G11 Data and labels are workable for analysis purposes Data is adequately visualized G7 So many plots, so little time Hard to find Plot Picker(s) *Switching families of displays is a short mental step, but a long process Frustrating number of iterations It‟s hard to know what the best is when you haven‟t seen it yet Replot from command line or picker SHOW THE SOLUTION Work with the data view to understand and explain the data Zoom and/or Pan Data tips Ginput Figure Property Editor Change View (Camera Toolbar) Get smaller subset or known data to work with Right View for understanding? No Yes Back to change the plot Really bad Review problem statement Is data within acceptable parameters? T10 Does Data match hypothesis? T9 Many modes for exploration Zoom and pan at the same time? How bad is it? Not so bad Plot Tools Command line Inspector Figure Toolbar LET ME COUNT THE WAYS TO WORK WITH THE PLOT Which tool should I use? Do they work together? Need to add explanations to data T19 Concerned with the appearance of the data T22 LEGEND AND COLORBAR Add legend and colorbar first so they don‟t mess up your plot later Add legend and/or colorbar Scribe ADDING WORDS Lay in the details of the message Add data to plot (commands to script) title, labels, dataticks, etc. Inserting annotation starts plot edit mode Start Plot Edit Mode Data Tips MOVING THINGS AROUND Organize for presentation Align figure and legend Align multiple figures Change View (Camera Toolbar) Commands expect HG proficiency Writing formatting code is HARD Text formatting is hard (subscript, superscript) *Log x-axis superscripts hard to read on MAC *Did not know about “Latek” It isn‟t obvious how to add Greek or scientific symbols to the text *Can‟t easily reset variables to colormap Plot Edit mode is hard to find It‟s still easier toi annotate in another application *No minimal, light grey (one pixel) gridlines *Polar plots!!! Equation editor like MS Word *Function to convert a colordef to line handles *Mouse down on line to convert color on it from list *No group legend (x legend entries with y lines each) *Not obvious you can edit legend text directly *Must do legends first because they dominate space Legends cannot be mxn *The manner in which we use handles within legends has changed in the last three releases *There are different modes of access to MATLAB figures, but only the first is obvious Message is clear? No Yes Communicate effectively to Boss G6 Tufte smiles G12 Looks professional G14 SAVE Next? AUTOMATION Unexplored Export or Print Needs to insert info into a document T5 Need data in an electronic format T20 Build something to do the same thing tomorrow G9 Generate M-code Edit/Save script until it works Code replicates the plot? Running a script? Not everything can be automated Lock Legend – Plot distance Don‟t know how big is too big until you fail Data is in MATLAB G1 No way to tie metadata to data Data plottable? Fig-file T12 Back to “research” Yes No Data is ready for presentation treatment Understand and accept the data G8 Camera Toolbar Unexplored workflow (Moving to another application) Unexplored Workflow (Exporting and Printing) Punt automation Automation doesn‟t offer the options I want Automated input code doesn‟t link up with automated figure code Unexplored workflow (Cut, copy, paste) Reconsider data Can‟t set defaults for new figures (e.g. “box off” Get Raw Data Into MATLAB Check Data Against File Bring In Labels, Names, Notes First Shot at a Plot Clean the Data Manipulate and Explore the Data Dress and Display the Data Get the Plot Out Yes Yes Yes No Automate
    65. 65. 65 How We Did it Looked at the first call Noted where in the workflow the user saw the issue Categorize it! Went to next call
    66. 66. 66 Resulting Graph
    67. 67. 67 Our Categorization Sessions…  Performed monthly  Lasted no longer than one hour  Categorized at a rate of 80-100 per hour
    68. 68. 68 Facilitation Challenges  Focus on the sole issue and where in the workflow, and nothing else  Facilitator had to watch the clock and come down on “discussion”  Development teams try to solve during the session. DON‟T LET THEM!
    69. 69. 69 How We‟ve Applied this Categorization Technique  Provided prioritization for enhancements – Have a good understanding of weak parts in the workflow  The enhancement effect – Visualize version specific graphs
    70. 70. 70 CARD‟s Impact on EZDeploy  EZDeploy goes live in six weeks  Provided us with a five year plan  The Deployment workflow was completely redesigned through CARD  Our future workflow from four years ago is very close to our current workflow  We will categorize against this workflow and measure the success/failure of any enhancements to the product over release cycles  Our workflows are robust and we‟ve proven it  Some teams don‟t want to do any product design and development without doing CARD first
    71. 71. 71
    72. 72. 72 Success Stories Q & A
    73. 73. 73 Planning
    74. 74. 74 Taking a Step Back: What UCD Activities Have You Conducted?  Focus groups  Contextual interviews  Brainstorming  Paper prototyping  Usability Testing  K-J Method (aka, Affinity Diagramming)
    75. 75. 75 How Do You Plan for Other Usability Activities?  Try to understand why you‟re doing the activity  Determine your goal(s)  Understand or think about users and their goals  Determine who to recruit  Decide which UCD method will be most effective  Create a plan for the activity, for example: – Test tasks – Interview questions  Figure out which stakeholder(s) to include
    76. 76. 76 Hands-on Activity: Planning a CARD Session Use the template provided to plan for your own CARD activity.  Think about a current or upcoming project where you might leverage CARD. Answer the following questions:  Why might CARD be a useful tool in this situation?  What questions did you ask to help decide?  Work individually to fill out the planning template we provided. – Capture any challenges this project might pose. – Identify specific strategies you plan to use to overcome these challenges.
    77. 77. 77 Hands-on Activity: Report out: Planning a CARD Session  What challenges did you identify?  What strategies did you come up with to deal with the challenges?  What was different about creating a CARD plan compared to a test or interview plan?
    78. 78. 78 What Makes CARD Different?  Capturing or designing a workflow  Facilitating multiple participants  Learning curve  Can be a considerable time investment  Often difficult to focus discussion  Stakeholders can be active participants, building the flow themselves Stakeholders‟ emotional engagement can be high!
    79. 79. 79 Lessons Learned Bottom line: CARD really is NOT all that different!  In the immortal words of Winston Zeddemore – “We have the tools, we have the talent”  Leverage the skills you already have!  Take into account higher levels of stakeholders‟ emotional engagement when planning. Just do it!
    80. 80. 80 Supporting Resources
    81. 81. 81 Supporting Resources Bridging User Needs to Object Oriented GUI Prototype via Task Object Design Chapter 2 User interface Design by Tom Dayton, Al McFarland, Joseph Kramer Workflow Modeling: Tools for Process Improvement and Application Development Chapter 8 Workflow Process Modeling by Alec Sharp and Patrick McDermott The Persona Lifecycle Chapter 10 Reality and Design Maps by Tamara Adlin and Holly Jamesen Carr Designing for the Digital Age by Kim Goodwin Chapter 16 Designing the Form Factor and Interaction Framework Mental Models by Indi Young Chapter 10 Create the Mental Model Layered Participatory Analysis: New Developments in the CARD Technique Michael J. Muller UPA 2005 The BRIDGE Len Conte, Eugenie Bertus, Scott Isensee
    82. 82. 82 CARD Tutorial Presenters  Len Conte – len.conte@mathworks.com  Mark Ainscow – mark.ainscow@mathworks.com  Debbie Cook – debbie.cook@mathworks.com  Stephen Reinach – stephen.reinach@mathworks.com  Lissa Story – lissa.story@mathworks.com

    ×