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: LastName_Design2.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 McCool_Design2_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... Or this... Design..Design..Design..Design use Design Design 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 and work through Steps 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 McCool_Design2_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

CREATING VISUALS TO SUPPORT TEXT TEAM REVIEW & ANALYSIS

DIRECTIONS Create a new team Google doc. Title it yourteamname_TCTch19_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 Copyright © 2012 Pearson Education, Inc. Where Can Graphics Support the Text? List the Four Guidelines for graphics

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

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

WHICH OF THE FOLLOWING SHOWS RELATIONSHIPS BETWEEN VARIABLES? Copyright © 2012 Pearson Education, Inc. A.Bar charts B.Line graphs C.Pie charts D.Tables

USING PICTURES, DRAWINGS, AND SCREEN SHOTS Copyright © 2012 Pearson Education, Inc. What is the purpose of Photographs, Illustrations, and Screen shots in document design?

WHAT IS THE “RULE OF THIRDS?” Copyright © 2012 Pearson Education, Inc. 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

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

USING VIDEO AND AUDIO Copyright © 2012 Pearson Education, Inc. 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.

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?

ANNUAL REPORT Fiscal Year 2005 Annual Report Quarter Ended 1 st Qtr. 2 nd Qtr. 3 rd Qtr.4 th Qtr.Total Fiscal year 2003 Revenue $7,74 6$8,541 $7,83 5$8,065$32,187 Gross profit6,4026,4046,5616,76126,128 Net income2,0411,8652,1421,4837,531 Basic earnings per share Diluted earnings per share Fiscal year 2004 Revenue $8,21 5 $10,15 3 $9,17 5$9,292$36,835 Gross profit6,7357,8097,7647,81130,119 Net income2,6141,5491,3152,6908,168 Basic earnings per share Diluted earnings per share Fiscal year 2005 Revenue $9,18 9 $10,81 8 $9,62 0 $10,16 1$39,788 Gross profit7,7208,8968,2218,75133,588 Net income2,5283,4632,5633,70012,254 Basic earnings per share Diluted earnings per share (1)Includes charges totaling $750 million (pre-tax) related to the Fabrikam 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. Market Risk Fiscal Year

MARKET SUMMARY ANALYSIS 1 st Year Sales Figures Market Distribution 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. 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. 56

BUSINESS SUMMARY Market Share by Division Product Division Electronics 10.3 %12.1%13.2%17.0% Consumer Goods 1.3%2.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% (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. Organizational Structure Contoso Product Development DesignManufacturingQuality Assurance Human Resources HeadquartersSubsidiaries Finance Business Process Model OperatingSupportingOptimizingChanging 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. 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

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 S1 (current situation) to S2 (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 DraftPropose

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

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

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

EVALUATION Measures of Team Performance Requirements DesignFinal Doc Instructor feedback Team Feedback 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 :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.