EFFECTIVE PROTOTYPING FOR SOFTWARE MAKERS

By F. JATIN

CHAPTER WHY PROTOTYPING? WHAT IS A PROTOTYPE? AN HISTORICAL PERSPECTIVE OF PROTOTYPING LEONARDO DA VINCI: THE THINKING MAN’S INVENTOR THOMAS ALVA EDISON: INVENTOR PROTOTYPER HENRY DREYFUSS: DESIGNER PROTOTYPER THE PURPOSE OF PROTOTYPING SOFTWARE WILL THE DESIGN WORK PROPERLY? CAN THE DESIGN BE PRODUCED ECONOMICALLY? HOW WILL USERS AND OTHER STAKEHOLDERS RESPOND TO THE DESIGN? WHICH APPROACH CAN BE TAKEN TO GET FROM CONCEPT TO PRODUCT? HOW CAN PROTOTYPING SUPPORT PRODUCT DESIGN SPECIFICATION? HOW CAN PROTOTYPING CONTRIBUTE TO BETTER PRODUCT SCHEDULING AND BUDGET PLANNING? SUMMARY REFERENCES THE EFFECTIVE PROTOTYPING PROCESS PHASE I: PLAN (CHAPTERS 3–5) STEP 1: VERIFY THE REQUIREMENTS (CHAPTER 3) STEP 2: CREATE A TASK/SCREEN FLOW (CHAPTER 4) STEP 3: SPECIFYING CONTENT AND FIDELITY (CHAPTER 5) CONTENTS PHASE II: SPECIFICATION (CHAPTERS 6–8) STEP 4: DETERMINE THE RIGHT PROTOTYPING CHARACTERISTICS (CHAPTER 6) STEP 5: CHOOSE A PROTOTYPING METHOD (CHAPTER 7) STEP 6: CHOOSE A PROTOTYPING TOOL (CHAPTER 8) PHASE III: DESIGN (CHAPTERS 9 AND 10) STEP 7: FORMULATE DESIGN CRITERIA (CHAPTER 9) STEP 8: CREATE THE PROTOTYPE (CHAPTER 10) PHASE IV: RESULTS (CHAPTERS 11–13) STEP 9: REVIEW THE PROTOTYPE (CHAPTER 11) STEP 10: VALIDATE THE DESIGN (CHAPTER 12) STEP 11: IMPLEMENT THE DESIGN (CHAPTER 13) PHASE I | PLAN YOUR PROTOTYPE VERIFY PROTOTYPE ASSUMPTIONS AND REQUIREMENTS PROTOTYPING REQUIREMENTS ARE NOT SOFTWARE REQUIREMENTS TRANSFORMATION OF ASSUMPTIONS TO REQUIREMENTS STEP 1: GATHER REQUIREMENTS STEP 2: INVENTORIZE THE REQUIREMENTS STEP 3: PRIORITIZE REQUIREMENTS AND ASSUMPTIONS REQUIREMENTS AND THE BIG PICTURE ITERATION 1: FROM IDEA TO FIRST VISUALIZATION ITERATION 2: FROM QUICK WIREFRAME TO WIREFRAME ITERATION 3: FROM WIREFRAME TO STORYBOARD ITERATION 4: FROM STORYBOARD TO PAPER PROTOTYPE ITERATION 5: FROM PAPER PROTOTYPE TO CODED PROTOTYPE ITERATION 6: FROM CODED PROTOTYPE TO SOFTWARE REQUIREMENTS DEVELOP TASK FLOWS AND SCENARIOS TASK FLOW TASK LAYER MAPS STEP 1: CREATE LIST OF TASKS STEP 2: IDENTIFY DEPENDENCIES STEP 3: LAYER TASK ITEMS STEP 4: REMOVE REDUNDANT DEPENDENCIES DEPENDENCY DIAGRAM STEP 1: PRIORITIZE REQUIREMENTS STEP 2: HIGHLIGHT KEY TASKS STEP 3: IDENTIFY NEEDS SWIM LANE DIAGRAMS STEP 1: IDENTIFY USER TASKS STEP 2: IDENTIFY USER ROLES STEP 3: LAYOUT USER ROLES AND TASK FLOWS STEP 4: IDENTIFY AND VISUALIZE INTERRELATIONSHIPS USAGE SCENARIOS STEP 1: SKETCH OUT PLOT STEP 2: CHOOSE CAST STEP 3: OUTLINE PLOT STEP 4: MARK POINTS IN OUTLINE DEFINE PROTOTYPE CONTENT AND FIDELITY PROTOTYPE FIDELITY LOW FIDELITY HIGH FIDELITY PROTOTYPE CONTENT INFORMATION DESIGN TECHNIQUES TO ADJUST THE FIDELITY OF INFORMATION DESIGN INTERACTION DESIGN AND NAVIGATION MODEL TECHNIQUES TO ADJUST THE FIDELITY OF INTERACTION DESIGN AND NAVIGATION MODEL VISUAL DESIGN TECHNIQUES TO ADJUST THE FIDELITY OF VISUAL DESIGN EDITORIAL CONTENT TECHNIQUES TO ADJUST THE FIDELITY OF THE EDITORIAL CONTENT BRAND EXPRESSION INCREASING BRAND FIDELITY DECREASING BRAND FIDELITY SYSTEM PERFORMANCE/BEHAVIOR TECHNIQUES TO ADJUST THE FIDELITY OF THE SYSTEM PERFORMANCE/BEHAVIOR HOW TO SELECT THE RIGHT PROTOTYPE CONTENT EXPRESSION STEP 1: DEFINE THE OBJECTIVE AND FOCUS STEP 2: DETERMINE EMPHASIS/DEEMPHASIS STEP 3: SELECT APPROPRIATE FIDELITY PHASE II | SPECIFICATION OF PROTOTYPING DETERMINE CHARACTERISTICS INTRODUCTION PROTOTYPE CHARACTERISTICS AUDIENCE: INTERNAL/EXTERNAL INTERNAL AUDIENCES DESIGN TEAM MEMBERS UPPER MANAGEMENT LEAD DESIGNERS PRODUCT MANAGERS MARKETING AND SALES MANAGERS DEVELOPERS TECHNICAL WRITERS DOMAIN SPECIALISTS/ANALYSTS QUALITY ASSURANCE ENGINEERS EXTERNAL AUDIENCES END USERS (CONSUMERS) CUSTOMERS (PURCHASERS, NOT END USERS) FINANCIAL STAKEHOLDERS DOMAIN SPECIALISTS AND ANALYSTS STAGE: EARLY/MIDTERM/LATE EARLY STAGE MIDTERM STAGE LATE STAGE SPEED: RAPID/DILIGENT RAPID SPEED DILIGENT SPEED LONGEVITY: SHORT/MEDIUM/LONG SHORT MEDIUM LONG EXPRESSION: CONCEPTUAL/EXPERIENTIAL CONCEPTUAL EXPRESSION EXPERIENTIAL EXPRESSION STYLE: NARRATIVE/INTERACTIVE NARRATIVE STYLE INTERACTIVE STYLE MEDIUM: PHYSICAL/DIGITAL PHYSICAL MEDIUM DIGITAL MEDIUM STEP-BY-STEP GUIDE TO SELECTING THE RIGHT CHARACTERISTICS STEP 1: SPECIFY BASIC REQUIREMENTS STEP 2: ANALYZE EXPRESSION STEP 3: DETERMINE STYLE AND MEDIUM CHOOSE A METHOD PROTOTYPING METHODS CARD SORTING WHAT IS CARD SORTING? HOW DOES CARD SORTING WORK? WIREFRAME PROTOTYPING WHAT IS WIREFRAME PROTOTYPING? HOW DO WIREFRAMES WORK? STORYBOARD PROTOTYPING WHAT IS STORYBOARD PROTOTYPING? HOW DO STORYBOARD PROTOTYPES WORK? PAPER PROTOTYPING WHAT IS PAPER PROTOTYPING? HOW DOES PAPER PROTOTYPING WORK? DIGITAL PROTOTYPING WHAT IS DIGITAL PROTOTYPING? HOW DOES A DIGITAL PROTOTYPE WORK? BLANK MODEL PROTOTYPING WHAT IS BLANK MODEL PROTOTYPING? HOW DOES A BLANK MODEL PROTOTYPE WORK? VIDEO PROTOTYPING WHAT IS VIDEO PROTOTYPING? HOW DOES A VIDEO PROTOTYPE WORK? WIZARD-OF-OZ PROTOTYPING WHAT IS WIZARD-OF-OZ PROTOTYPING? HOW DOES A WIZARD-OF-OZ PROTOTYPE WORK? CODED PROTOTYPING WHAT IS CODED PROTOTYPING? HOW DOES A CODED PROTOTYPE WORK? CHOOSING THE RIGHT PROTOTYPING METHOD FOR YOU CHOOSE A PROTOTYPING TOOL HOW TO CHOOSE THE PROTOTYPING TOOL STEP 1: SELECT METHOD STEP 2: MAP METHOD TO TOOLS STEP 3: LIST AVAILABLE TOOLS STEP 4: DETERMINE TIMING STEP 5: DETERMINE SUITABILITY STEP 6: SELECT TOOL NEXT STEP PHASE III | DESIGN YOUR PROTOTYPE ESTABLISH THE DESIGN CRITERIA VISUAL DESIGN GUIDELINES VISUAL DESIGN GUIDELINE 1: INFORMATION FLOW (DIRECTIONAL) VISUAL DESIGN GUIDELINE 2: GRID-BASED ORGANIZATION (ORGANIZATIONAL) VISUAL DESIGN GUIDELINE 3: RHYTHM AND PATTERN (DIRECTIONAL) VISUAL DESIGN GUIDELINE 4: UNITY AND VARIETY (ORGANIZATIONAL) VISUAL DESIGN GUIDELINE 5: TYPOGRAPHIC STRUCTURE (ORGANIZATIONAL) VISUAL DESIGN GUIDELINE 6: BALANCE (DIRECTIONAL) VISUAL DESIGN GUIDELINE 7: LOGICAL GROUPING (ORGANIZATIONAL) USER INTERFACE GUIDELINES USER INTERFACE GUIDELINE 1: PROGRESSIVE DISCLOSURE (DIRECTIONAL) USER INTERFACE GUIDELINE 2: EFFICIENCY (ORGANIZATIONAL) USER INTERFACE GUIDELINE 3: FITT’S LAW (DIRECTIONAL) USER INTERFACE GUIDELINE 4: LEARNABILITY (DIRECTIONAL) USER INTERFACE GUIDELINE 5: SPEAK THE AUDIENCE’S LANGUAGE (ORGANIZATIONAL) USER INTERFACE GUIDELINE 6: EXPLICITLY SHOW REQUIRED ACTIONS AND FIELDS (ORGANIZATIONAL) USER INTERFACE GUIDELINE 7: USER INTERFACES SHOULD REFLECT INTERNATIONAL SENSITIVITY (ORGANIZATIONAL) USER INTERFACE GUIDELINE 8: UNIVERSAL ACCESSIBILITY (ORGANIZATIONAL) USER INTERFACE GUIDELINE 9: USERS SHOULD FEEL IN CONTROL (ORGANIZATIONAL) USER INTERFACE GUIDELINE 10: MINIMIZE USER’S MEMORY LOAD (ORGANIZATIONAL) USER INTERFACE GUIDELINE 11: SATISFACTION (ORGANIZATIONAL) STEP-BY-STEP GUIDELINES STEP 1: REVIEW GUIDELINES STEP 2: FORMULATE CRITERIA STEP 3: FINISH CRITERIA CHAPTER 10 CREATE THE DESIGN DESIGN AND CONSTRUCT YOUR PROTOTYPE STEP 1: DETERMINE HIGHEST PRIORITY SCREENS STEP 2: BLOCKOUT MOST IMPORTANT REGIONS STEP 3: LAYOUT HIGHEST PRIORITY SCREEN STEP 4: LAYOUT REMAINING PRIORITY SCREENS STEP 5: SPECIFY DESIGN RATIONALE PHASE IV | RESULTS OF PROTOTYPING CHAPTER 11 REVIEW THE DESIGN: THE INTERNAL REVIEW STEP 1: REVIEW YOUR DEFINED AUDIENCE STEP 2: SET GOALS FOR EACH VERSION STEP 3: SET EXPECTATIONS FOR REVIEWERS COMMUNICATE WHAT YOU ARE DOING STEP 4: HOW YOU’LL PRESENT WHAT MAKES A GOOD FACILITATOR? SETTING AN AGENDA STEP 5: PLANNING THE NEXT STEPS CHAPTER 12 VALIDATE AND ITERATE THE PROTOTYPE THE STRATEGY OF VALIDATING AND ENSURING USABILITY VIA THE PROTOTYPE USABILITY TESTING: THE TACTICS OF VALIDATING AND ENSURING USABILITY VIA THE PROTOTYPE EVALUATING YOUR DESIGN ITERATING YOUR DESIGN CHAPTER 13 DEPLOY THE DESIGN YOUR PROTOTYPE IS READY FOR DEPLOYMENT STEP 1: SET EXPECTATIONS FOR HANDOFF STEP 2: PROTOTYPE DISTRIBUTION STRATEGIES WHAT ARE THE MOST APPROPRIATE WAYS TO HAND OFF YOUR PROTOTYPE? MANAGING ISSUES THAT ARISE AFTER HANDING OFF YOUR PROTOTYPE STEP 3: DOCUMENTING PROTOTYPING RESULTS THE PRODUCT DESIGN GUIDE CHAPTER 14 CARD SORTING PROTOTYPING DESCRIPTION CHARACTERISTICS AN OVERVIEW OF WHAT A CARD SORTING PROTOTYPE LOOKS LIKE TYPES OF CARD SORTING INFORMATION ARCHITECTURE NAVIGATION MODEL FOR WEBSITE OR APPLICATION MENU STRUCTURE TERMINOLOGY VALIDATION VALIDATION OF CONCEPTUAL AND MENTAL MODELS STEP-BY-STEP GUIDE TO CARD SORTING PROTOTYPES STEP 1: SETTING THE STARTING POINT STEP 2: DESIGNING THE SESSION STEP 3: PREPARING THE SESSION STEP 4: CONDUCTING THE SESSION STEP 5: SYNTHESIZING RESULTS STEP 6: PREPARING FOR REUSE EXAMPLE SPREADSHEETS NEXT ITERATION IF YOU WOULD LEAVE THIS PROTOTYPE AVAILABLE CARD SORTING SOFTWARE [COURAGE AND BAXTER 2004] CHAPTER 15 WIREFRAME PROTOTYPING DIFFERENT PERSPECTIVES OF A WIREFRAME AN OVERVIEW OF WHAT A WIREFRAME PROTOTYPE LOOKS LIKE DIFFERENT GOALS OF WIREFRAMES THE MEANING OF A REQUIREMENT A QUICK VISUALIZATION TO UNDERSTAND SCOPE, STRUCTURE, AND LAYOUT AN IDEA SANDBOX TO PLAY AROUND WITH DIFFERENT PRODUCT IDEAS/FUNCTIONS/REQUIREMENTS MAKE SURE ALL MEMBERS OF THE SOFTWARE-MAKING TEAM ARE ON THE SAME PAGE A MEDIUM TO BEGIN DOCUMENTING REQUIREMENTS OR ISSUES THAT HAVE TO DO WITH EARLY DESIGNS A QUICK VISUALIZATION OF TASK FLOW THROUGH AN IDEA INFORM MORE DILIGENT PROTOTYPING METHODS WHO PARTICIPATES IN THE WIREFRAME CREATION PROCESS STEP-BY-STEP GUIDE STEP 1: WHAT IS THE SOURCE OF THE WIREFRAME CONTENT? STEP 2: WHO ARE THE STAKEHOLDERS? STEP 3: WHAT TOOL DO I USE? STEP 4: HOW DO I DO IT? STEP 5: HOW DO I EVOLVE IT? LEAVING WIREFRAMES: THE NEXT ITERATION CHAPTER 16 STORYBOARD PROTOTYPING AN OVERVIEW OF WHAT A STORYBOARD PROTOTYPE LOOKS LIKE TYPES OF STORYBOARDS HIGH-PRIORITY TASK SCENARIOS A DAY IN THE LIFE OF A USER A DAY IN THE LIFE OF A WORK GROUP CRITICAL INCIDENTS OR CRITICAL TASK SITUATIONS SUNNY DAY WHO PARTICIPATES IN THE STORYBOARD CREATION PROCESS STEP 1: VISION STEP 2: IDEA BOARD STEP 3: CONTEXT STEP 4: BACKGROUND STEP 5: DEVELOPING THE SCENARIO STEP 6: INCLUDING DESIGN STEP 7: STORYBOARD SESSION HOW THE STORYBOARD SESSION WORKS BEST-PRACTICES STORYBOARD PLANNING HOW THE STORYBOARD IS ITERATED NEXT ITERATION GOING BEYOND THIS PROTOTYPE CHAPTER 17 PAPER PROTOTYPING WHAT DOES A PAPER PROTOTYPE GET YOU? OVERVIEW OF WHAT A PAPER PROTOTYPE LOOKS LIKE STEP-BY-STEP GUIDE TO CREATING PAPER PROTOTYPES STEP 1: CREATE SCENARIO STEP 2: INVENTORY UI ELEMENTS STEP 3: CREATE UI ELEMENTS STEP 4: RUN THROUGH SCENARIO STEP 5: INTERNAL REVIEW STEP-BY-STEP GUIDE TO TEST THE PROTOTYPE STEP 1: REVISE SCENARIO STEP 2: REVISE INVENTORY UI ELEMENTS STEP 4: PILOT RUN THROUGH SCENARIO STEP 6: PREPARE KIT STEP 7: THE PROTOTYPE SESSION STEP 8: REITERATE NEXT ITERATION AFTER A PAPER PROTOTYPE CHAPTER 18 DIGITAL INTERACTIVE PROTOTYPING WHAT DOES A DIGITAL PROTOTYPE GET YOU? POINTS IN COMMON WITH PAPER PROTOTYPING DIGITAL ADVANTAGES OVER PAPER PROTOTYPING DISADVANTAGES OVER PAPER PROTOTYPING OVERVIEW OF WHAT A DIGITAL PROTOTYPE LOOKS LIKE STEP-BY-STEP GUIDE TO CREATE A DIGITAL PROTOTYPE STEP 2: INVENTORY UI SCREENS AND TASKS STEP 3: CREATE TEMPLATE STEP 4: CREATE UI ELEMENTS STEP 5: LINK UP CREATED SCREENS STEP 6: INTERNAL REVIEW NEXT ITERATION AFTER A DIGITAL INTERACTIVE PROTOTYPE CHAPTER 19 BLANK MODEL PROTOTYPING OVERVIEW OF WHAT A BLANK MODEL PROTOTYPE LOOKS LIKE WHO PARTICIPATES IN THE BLANK MODEL CREATION PROCESS WHAT ARE THE BENEFITS OF A BLANK MODEL PROTOTYPE? STEP-BY-STEP GUIDE TO BLANK MODEL PROTOTYPE CREATION STEP 1: PLAN THE STUDY STEP 2: SCENARIOS STEP 3: SUPPLIES STEP 4: PREPARATION STEP 5: STUDY SESSIONS STEP 6: ANALYSIS STEP 7: REITERATE THE BLANK MODEL PROTOTYPE CREATION SESSION STEP 1: OPENING STEP 3: VERIFY STEP 4: CONSTRUCTION STEP 5: REVIEW STEP 6: POST-INTERVIEW STEP 7: CLOSURE NEXT ITERATION AFTER BLANK MODEL PROTOTYPING CHAPTER 20 VIDEO PROTOTYPING VISIONARY VIDEO PROTOTYPES HOLISTIC VIDEO PROTOTYPES WHAT IS A VIDEO PROTOTYPE? WHO MAKES USE OF VISIONARY VIDEO PROTOTYPING? WHAT ARE THE BENEFITS OF A VISIONARY VIDEO PROTOTYPE? HOLISTIC VIDEO PROTOTYPING WHAT A VIDEO PROTOTYPE LOOKS LIKE WHO PARTICIPATES IN THE VIDEO PROTOTYPE CREATION PROCESS? STEP 1: OBSERVATION OF USERS STEP 2: VIDEO BRAINSTORMING STEP 3: VIDEO PROTOTYPING STEP 4: SYSTEM EVALUATION HOW TO CREATE A VISIONARY VIDEO PROTOTYPE NEXT ITERATION AFTER VIDEO PROTOTYPING CHAPTER 21 WIZARD-OF-OZ PROTOTYPING WHAT IS A WIZARD-OF-OZ PROTOTYPE? OVERVIEW OF WHAT A WOO PROTOTYPE LOOKS LIKE WHO IS INVOLVED WITH WIZARD-OF-OZ PROTOTYPES WHAT ARE THE BENEFITS OF A WOO PROTOTYPE? PROCEDURE FOR A WOO PROTOTYPE FOR A SPOKEN NATURAL LANGUAGE OR AGENT-BASED INTERACTION STEP 1: PLAN STEP 2: STRATEGY STEP 3: CONSTRUCT STEP 4: RECRUIT STEP 5: PROTOTYPE SCRIPT STEP 6: PILOT STEP 7: USABILITY TESTING VARIATION 1: WOO FOR SIMULATING ADVANCED HANDHELD OR PORTABLE DEVICES VARIATION 2: WOO METHOD TO HELP TEST AN UNFINISHED DESIGN WHAT CONTENT ARE INCLUDED IN A WIZARD-OF-OZ PROTOTYPE? NEXT ITERATION AFTER WIZARD-OF-OZ PROTOTYPING CHAPTER 22 CODED PROTOTYPING WHAT IS A CODED PROTOTYPE? OVERVIEW OF WHAT A CODED PROTOTYPE LOOKS LIKE TYPES OF CODED PROTOTYPES WHO CREATES CODED PROTOTYPES? WHAT ARE THE BENEFITS OF A CODED PROTOTYPE? WHAT IS THE SOURCE FOR CODED PROTOTYPE CONTENT? WHAT IS THE CONTENT OF A CODED PROTOTYPE? STEP-BY-STEP PROCEDURE STEP-BY-STEP GUIDE TO CREATING SALES DEMOS STEP 1: SELECT SCENARIO STEP 3: DEVELOP UI ELEMENTS STEP 4: RUN THROUGH SCENARIO STEP-BY-STEP GUIDE TO CREATING HIGH-FIDELITY INTERACTIVE CODED PROTOTYPES STEP 1: SELECT SCENARIOS STEP 4: INTERNAL REVIEW STEP 5: USABILITY TESTING NEXT ITERATION AFTER CODED PROTOTYPING CHAPTER 23 PROTOTYPING WITH OFFICE SUITE APPLICATIONS WHY COVER THREE OFFICE APPLICATIONS IN ONE CHAPTER? SIMILARITIES AND DIFFERENCES SOPHISTICATED GRAPHICS: SOMETHING THEY’RE ALL MISSING WHO WOULD USE OFFICE SUITE APPLICATIONS FOR PROTOTYPING? MICROSOFT WORD ADVANTAGES DISADVANTAGES APPROPRIATE METHOD EXAMPLE: STEP-BY-STEP GUIDE TO BUILDING A WIREFRAME IN MS WORD STEP 1: PREPARE DOCUMENT STEP 2: BEGIN FRAMEWORK STEP 3: WIREFRAME DESIGN STEP 4: TEXT DOCUMENTATION USABILITY TESTING MICROSOFT POWERPOINT CREATING A STORYBOARD IN POWERPOINT SCENARIO STEP 1: SET CONTEXT STEP 2: ENTER SCENARIO STEP 3: ADD IMAGES STEP 4: ADD NOTES STEP 5: PERFORM RUN THROUGH MICROSOFT EXCEL CREATING A PROTOTYPE IN EXCEL STEP 1: GET READY STEP 2: CREATE CANVAS STEP 3: BUILDING A BOX WITH A HEADER STEP 4: ADD TEXT STEP 5: CREATE AN INPUT FIELD STEP 6: ADDING ART STEP 7: START ON SECOND PAGE TESTING MS OFFICE APPLICATIONS CHAPTER 24 PROTOTYPING WITH VISIO INTRODUCTION TO VISIO AS A PROTOTYPING TOOL OVERVIEW OF EFFECTIVE PROTOTYPING WITH VISIO IDEAL METHODS FOR USING VISIO TARGET AUDIENCE FOR VISIO USEFUL PROTOTYPING FEATURES IN VISIO REUSE ADVANTAGES AND DISADVANTAGES OF USING VISIO FOR PROTOTYPING DOCUMENTING A DESIGN IN VISIO BUSINESS SCENARIO USE CASE DESCRIPTION STEP-BY-STEP EXAMPLE STEP 1: GETTING STARTED (SET UP YOUR ENVIRONMENT AND STENCILS) STEP 2: CREATE THE MAIN WINDOW STEP 3: WINDOW FUNCTIONS (DESIGN TOP-LEVEL MENU AND TOOLBAR) STEP 4: DESIGN CONTENT AREA (MOCKUP AREAS TO DISPLAY FILES ON THE USER’S COMPUTER AND REMOTE FTP SERVER) STEP 5: REUSE STEP 6: MOCKUP INTERACTION STEP 7: DIFFERENT STATES STATE 1: BEFORE FILES ARE UPLOADED STATE 2: FILES ARE CURRENTLY BEING UPLOADED STATE 3: AFTER FILES ARE UPLOADED PRESENTING AND DISTRIBUTING A VISIO PROTOTYPE CHAPTER 25 PROTOTYPING WITH ACROBAT INTRODUCING ACROBAT OVERVIEW OF EFFECTIVE PROTOTYPING WITH ACROBAT PDF PORTABLE DOCUMENT FORMAT THE FLAVORS OF ACROBAT ACROBAT AND PROTOTYPING PROTOTYPE CONTENT AND METHODS BUILDING PDF PROTOTYPES STEP 2: PREPARE FOR CONVERSION STEP 3: CONVERT TO PDF STEP 4: ADD LINKS STEP 5: ADD FORMS ADDING RADIO BUTTONS ADDING BUTTONS ADDING LIST AND COMBO BOXES TIPS FOR ADDING FORMS STEP 6: ADD MEDIA STEP 7: SET GLOBAL PROPERTIES SAMPLE FILES PUTTING THE PROTOTYPE TO WORK TEAM REVIEW PDF PROTOTYPES IN USABILITY TESTING NEXT STEPS SOME CLOSING THOUGHTS