VISUAL DESIGN BRINGING TEXT TO LIFE AGENDA Questions

VISUAL DESIGN BRINGING TEXT TO LIFE

AGENDA • • Questions about Visual Design exercises Finish Discussion of Conceptual Design Peer Review conceptual designs Team activities w/Ch 19 content Midterm project explanation Unit 3 forum post explanation Next time. . . • Bring visual design files to the lab on Thursday. Part of the class will be devoted to completing this project • Research project pitch ideas and bring them to class. Part of the class will be spent on team discussion of project pitch ideas.

CONCEPTUAL DESIGN AIMS TO. . . • • Identify the goals and expectations of how each audience type interacts with the design under different circumstances of use • Consider how will the new design transform the targeted activity • Account for what business needs are behind product development Conceptual design answers the question: What does this product/technical document do?

CONCEPTUAL DESIGN & PERSUASION • This type of document makes use of an implied persuasion and should argue that. . . • Your design’s basic features match the needs of the client and the end-users. • Your team is technically competent, thorough, and careful to keep the clients’ interests (practical, financial, ethical, etc. ) at the forefront. • Your design is innovative, truly capable of transforming the social practice you target.

USING CONCEPTUAL DESIGN APPROACH FOR VISUAL DESIGN EXERCISE PART 2 • Apply Conceptual Design to your web-page re-design assignment. • As you map out the changes you want to make on paper, be sure to incorporate design principles from TCT Ch. 18, the Gestalt videos, the article: ”An Exploration of Website Redesigns: Tips & Examples, ” and additional readings from this unit. • Use one of the suggested tools listed in the assignment description to transform your design concept into the re-design of the home page of a poorly organized web page. • Your final document should be 3 -4 well-designed PDF pages that would be representative of how the new web page should look. • Use this naming convention: Last. Name_Design 2. pdf

TEAMWORK: PUTTING CD INTO PRACTICE • STEP 1: Make screen shots of the home page of the website that you will redesign. • Save as PDFs. • Print or Display them. • STEP 2: Discuss the website’s design with your team • Ask team members how they would interact with this site. • Identify problematic design choices. • Brainstorm ideas for change. • STEP 3: Using Conceptual Design approach, map out on paper the proposed changes you want to make.

PUTTING CD INTO PRACTICE CONT. 2 • STEP 4: Examine content and create a document shell by outlining the document. (This outline may be modified or reorganized in step 5 below. ) • STEP 5: Find the natural divisions of information and create headings to group information together. • STEP 6: Establish a process for drafting that includes version control. (For example Mc. Cool_Design 2_2. 0)

PUTTING CD INTO PRACTICE CONT. 3 • STEP 7: Analyze the amount of information that must be changed • STEP 8: Determine how the document is used by this particular information ecology. • STEP 9: Incorporate design principles from TCT Ch. 18, the Gestalt videos, the article: ”An Exploration of Website Redesigns: Tips & Examples, ” and additional readings from this unit.

PUTTING CD INTO PRACTICE CONT. 4 • STEP 10: Analyze information gleaned so far. What else do you need to know? Find out by. . . • Making a list of basic functionality & features for the current system in place – where are the obvious gaps between your user/client needs and this list? • Going over the list carefully to add detail from your CD work, then go over it again to separate out implementation specific details • STEP 11: Create a Prototype • (We won’t actually do this part of the process b/c this is a simulated activity. However, if it were real, you would want a prototype. )

PROTOTYPES THE NEXT STEP IN ITERATIVE DESIGN APPROACH

WHAT IS A PROTOTYPE? • A prototype is a physical representation of a design idea that the team wants user feedback on. • Users should be able to do work with the prototype so that the design idea it represents can be tested.

A PROTOTYPE IS NOT… • A model, diagram, or other conceptual artifact. • These are not very useful for getting real user feedback because they are static and not functional.

A PROTOTYPE IS ALSO NOT… A DEMO. . . • With a demo (short for demonstration), the designer does all the work, either by automating a sequence that gets played back…or by guiding users through a work sequence.

SO…WHY PROTOTYPE? • Prototypes allow the user to be the final arbiter of the design. Consider the difference between the two approaches. . . • This. . . Design use • Or this. . . Design use use

PROTOTYPING ALLOWS YOU TO… • Examine your design ideas to see what will work for your users • Explore how work practice will be supported (or not!) in the design • Discover emergent work practices • Observe what the overall experience of the new work environment will offer • Find out if work processes (e. g. a known sequence) are coherent in the new system • Involve users in the design process…

USING THE EVIDENCE • There are three main ways you’ll use the information from prototyping. . . 1. To continually improve the design 2. To justify design decisions 3. To clarify issues for the implementation team • The final step in a project cycle is moving from prototype to finished product and the implementation of the new design.

ASSIGNMENT: VISUAL EXERCISE PT. 2 • After you have finished reading this slide deck, go back to slides 12 -16 and work through Steps 1 -10. • Then, for Step 11—the prototype, modify this so that your PDF redesigns of the web homepage will represent what you would done if you were actually redesigning a website for an employer.

TEAMWORK: PUTTING CD INTO PRACTICE • STEP 1: Make screen shots of the home page of the website that you will redesign. • Save as PDFs. • Print or Display them. • STEP 2: Discuss the website’s design with your team • Ask team members how they would interact with this site. • Identify problematic design choices. • Brainstorm ideas for change. • STEP 3: Using Conceptual Design approach, map out on paper the proposed changes you want to make.

PUTTING CD INTO PRACTICE CONT. 2 • STEP 4: Examine content and create a document shell by outlining the document. (This outline may be modified or reorganized in step 5 below. ) • STEP 5: Find the natural divisions of information and create headings to group information together. • STEP 6: Establish a process for drafting that includes version control. (For example Mc. Cool_Design 2_2. 0)

PUTTING CD INTO PRACTICE CONT. 3 • STEP 7: Analyze the amount of information that must be changed • STEP 8: Determine how the document is used by this particular information ecology. • STEP 9: Incorporate design principles from TCT Ch. 18, the Gestalt videos, the article: ”An Exploration of Website Redesigns: Tips & Examples, ” and additional readings from this unit.

PEER REVIEW OF CONCEPTUAL DESIGNS • In your team, review each other’s conceptual designs. • Provide feedback in a shared Google doc or on a piece of paper using the principles and language of design from the videos, weblinks & Ch. 18, TCT. • Each person should have comments from every team member. • When finished, title the Googledoc with yourname_Cdpeerreview. • Share it with me at lbmccool@iastate. edu

CREATING VISUALS TO SUPPORT TEXT TEAM REVIEW & ANALYSIS

DIRECTIONS • Create a new team Google doc. • Title it yourteamname_TCTch 19_activities • Work collaboratively to complete activities. • Assign roles (writing, research, editing, etc. . . ) • PM should ensure that all team members are actively engaged

GUIDELINES FOR USING GRAPHICS • Where Can Graphics Support the Text? • List the

WHICH OF THE FOLLOWING IS TRUE OF USING GRAPHICS? A. B. C. D. You should never edit photographs Graphics can take the place of text It can be helpful to hide information in graphics None of the above Copyright © 2012 Pearson Education, Inc.

CHOOSE A GRAPHIC THAT FITS THE STORY YOU WANT TO TELL. Define each by its story and how data are displayed. • • • Line graphs Bar charts Tables Pie charts Flowcharts Gantt charts Copyright © 2012 Pearson Education, Inc.

WHICH OF THE FOLLOWING SHOWS RELATIONSHIPS BETWEEN VARIABLES? A. B. C. D. Bar charts

USING PICTURES, DRAWINGS, AND SCREEN SHOTS • What is the purpose of Photographs, Illustrations,

WHAT IS THE “RULE OF THIRDS? ” A. Photographs should be grouped in threes to maintain consistency B. No more than three graphics should be displayed on a page C. Place the focal point of the picture where the top third of the picture begins D. None of the above Copyright © 2012 Pearson Education, Inc.

USING CROSS-CULTURAL SYMBOLS Symbols Can Convey Information Across Cultures, but They May Be Misinterpreted What are the Guidelines one should follow for creating symbols? Copyright © 2012 Pearson Education, Inc.

USING VIDEO AND AUDIO How can a technical communicator effectively use Video in a document/webpage? Explain why Audio, Podcasting, and Music can be useful in document/web design. Copyright © 2012 Pearson Education, Inc.

SAMPLE GRAPHICS • Analyze the following charts/graphs using terms from Chapter 19 to support your analysis. 1. Define the different types of charts and graphs by the story it tells and how data are displayed. 2. Identify the type of each chart or graph shown and the story it tells 3. Answer the question: How well does each of the charts tell its story? 4. Do the charts/graphs provide any explanatory text? If so, how does it contribute to the message?

1 • 4 • Market Risk 2004 2005 Average Fiscal Year 2005 Annual Report Quarter Ended 1 st Qtr. 2 nd Qtr. 3 rd Qtr. 4 th Qtr. Total $32, 187 Fiscal year 2003 150 Revenue $7, 74 $7, 83 6 $8, 541 5 $8, 065 100 Gross profit 6, 402 6, 404 6, 561 6, 761 26, 128 Net income 2, 041 1, 865 2, 142 1, 483 7, 531 Basic earnings per share 0. 19 0. 17 0. 2 0. 14 0. 7 Diluted earnings per share 0. 19 0. 17 0. 2 0. 14 0. 69 Revenue $8, 21 $10, 15 $9, 17 5 3 5 $9, 292 $36, 835 Gross profit 6, 735 7, 809 7, 764 7, 811 30, 119 Net income 50 0 2 • Interest rates Currency rates Equity prices Commodity prices Fiscal Year 2004 Fiscal year 2004 25% 1 st Qtr 2 nd Qtr 3 rd Qtr 4 th Qtr 22% 28% 2, 614 1, 549 1, 315 2, 690 8, 168 Basic earnings per share 0. 24 0. 12 0. 25 0. 76 Diluted earnings per share 0. 24 0. 12 0. 25 0. 75 Revenue $9, 18 $10, 81 $9, 62 $10, 16 9 8 0 1 $39, 788 Gross profit 7, 720 8, 896 8, 221 8, 751 33, 588 Net income 2, 528 3, 463 2, 563 3, 700 12, 254 Basic earnings per share 0. 23 0. 32 0. 24 0. 34 1. 13 Diluted earnings per share 0. 23 0. 32 0. 23 0. 34 1. 12 Fiscal year 2005 3 Gross Profit Net Revenue 10000 5000 (1) Includes charges totaling $750 million (pre-tax) related to the Fabrikam 0 1 st Qtr 2 nd Qtr 3 rd Qtr 4 th Qtr settlement and $1. 15 billion in impairments of investments. (2) Includes stock-based compensation charges totaling $2. 2 billion for the employee stock option transfer program. (3) Includes charges totaling $756 million (pre-tax) related to Contoso subsidiaries and other matters. ANNUAL REPORT 200

6 • 1 st Year Sales Figures East West Market Distribution North East 180 West North 100 80 160 60 140 40 20 120 0 1 st Qtr 100 • 2 nd Qtr 3 rd Qtr 4 th Qtr Financial Summary • Our perennial 3 rd Quarter boost was larger than expected contributing to an exceptionally strong year. Distribution of sales across the geographic markets looks fairly steady. 80 60 40 • Our new product line, released this year, is early in its adoption phase. We expect to see substantial revenue contribution from these products over the next two years. 20 0 1 st Qtr 2 nd Qtr 3 rd Qtr 4 th Qtr MARKET SUMMARY ANALYSIS 5 •

7 • 9 • Market Share by Division Product Division 2003 2004 2005 10. 3 % 12. 1% 13. 2% 17. 0% 1. 3% 2. 2% 2. 7% Services 12. 0% 11. 0% 8. 9% 9. 2% Widget Sales 78. 0% 82. 3% 82. 5% 84. 0% Installations 5. 3% 7. 9% 12. 2% 15. 1% Electronics Consumer Goods Operating Changing Supporting (1) Percentages based on domestic comparison to competitors in directly related industries. (2) Percentages based on standing at the end of each fiscal year. (3) Values provided by a third party agency. 8 • • Organizational Structure Design Manufacturing Quality Assurance Human Resources Headquarters Subsidiaries Summary • This has been a pivotal year for the company in growth, but also development of our infrastructure and business processes. We’ll continue to focus on our internal systems over the next year. Contoso Product Development Optimizing Finance • Specific growth areas include Electronics where Contoso has seen as 6. 7% increase in market share over the last three years. An area to monitor closely is the Services division where market share has dropped slightly. BUSINESS SUMMARY 2002 Business Process Model

THE MIDTERM PROJECT INDIVIDUAL & TEAM WORK

FORUM POST: GENERATING IDEAS FOR THE MIDTERM PROJECT • Using Activity Theory, let’s consider ideas for the Midterm Proposal Project in terms of an activity and a problem. • For example, • An activity: Creating & submitting run reports to support emergency 911 calls • A problem: How can EMTs more easily, accurately record patient information on emergency runs?

IDENTIFY SOLUTION(S) & AUDIENCE • Solution: Create a phone app for EMTs that tracks, records, and submits emergency run & patient information to the reporting agency. • Audience: EMTs on emergency runs (and possibly other health related workers)

ASK QUESTIONS CONCERNING ACTION & ACTIVITY • What would participants be doing when/if your proposal were accepted & implemented? • EMTs are busy going on EMT calls, taking patient history, administering care, documenting services • Why would participants be taking these actions? • These actions are part of their job description. It is what they do. • How does patient info, documentation, etc. help them to provide care & transport for patients? • Accurate patient information helps EMTs, doctors, nurses and other health professionals make wise decisions about patient care.

CREATE A SCENARIO • Identify participants, actions and activity that your team will target with your grant proposal. • Aim to transform a real social practice. • Use team collaboration to change the world…for the better! • Fit project within the time constraints of this course.

PRIOR PROJECTS ►Eyes for Iowa: Organization to help children with CED ►Fresh Food Pantry: Community garden program ►HELP: Work program for Ethiopian refugees in Iowa. All of these projects involve issues of. . . ►resources ►agency ►access ►Skill ►ASK: Who benefits from the transformations your proposal recommends? How?

THE PROJECT PITCH THE BASIC PROBLEM YOUR PROPOSAL ADDRESSES

THREE ELEMENTS OF THE PITCH • Problem, Objective(s), Benefit(s) • Overriding Problem: The key problem your project intends to address or solve. • Objectives: What you plan to do to move from S 1 (current situation) to S 2 (proposed situation or desired results). • Benefits: Those good things that will accrue to stakeholders while the project objective(s) are in the process of being achieved (i. e. , as deliverables are completed) or after the project objective(s) have been achieved.

UNIT 3 FORUM POST • For your post in unit 3, each team member should prepare an idea for the team with all three elements (Problem, Objective(s), and Benefit(s). • Post your project pitch in the designated forum space for your team. • For example, a RED team member would post his/her idea in the RED team forum space. • Next, discuss and choose one idea from the suggested project pitches found on your Team’s forum space.

MIDTERM PROJECT COMPLETION A Three-Phase Approach

THE PHASES Building block of the project Ideas Draft Propose

METHODS Key concepts and techniques Ideas Activity Analysis Draft Contextual Design Propose Final Product

DELIVERABLES Key Outcomes from each phase Ideas scenarios; buy-in Draft Baseline logic; themes; buy-in Propose approval

FACILITATION Activities to insure success Ideas Share w/ peers Consultations Draft Share w/ peers Consultations Propose Share w/peers Review panel

EVALUATION Measures of Team Performance Requirements Instructor feedback Design Team Feedback Final Doc Instructor Feedback

WHAT NOW? • Brainstorm to find project ideas. • Create a project pitch. • By Sunday 11: 55 p. m. , each individual should put the project pitch idea on the his/her team’s forum. • As soon as all team members have posted a project pitch to the forum, teams should begin discussing ideas to decide which one will fit this assignment. • Arrange a time to meet in person or virtually to discuss the project • Choose one of the ideas (group consensus) by the beginning of Unit 4.

ASSIGNMENT DUE DATES • By Sunday, Sept. 29 11: 55 p. m. complete the following: • Unit 3 Quiz • Visual Design Exercise Parts 1 & 2 • Project Pitch posted to your team’s forum space. • For example: the RED team posts to the RED team forum space on MOODLE • For Thursday’s class bring your files/laptops etc. for a workshop day to complete Visual design exercises 1 & 2 • I will be available for help & to answer questions • I will also be discussing the rubric I will use to grade these exercises.