Applying Document Design to Online Help Systems to Increase Usability
Total Page:16
File Type:pdf, Size:1020Kb
BearWorks MSU Graduate Theses Spring 2017 Merging Mediums: Applying Document Design to Online Help Systems to Increase Usability Meghan M. Smith Missouri State University, [email protected] As with any intellectual project, the content and views expressed in this thesis may be considered objectionable by some readers. However, this student-scholar’s work has been judged to have academic value by the student’s thesis committee members trained in the discipline. The content and views expressed in this thesis are those of the student-scholar and are not endorsed by Missouri State University, its Graduate College, or its employees. Follow this and additional works at: https://bearworks.missouristate.edu/theses Part of the Technical and Professional Writing Commons Recommended Citation Smith, Meghan M., "Merging Mediums: Applying Document Design to Online Help Systems to Increase Usability" (2017). MSU Graduate Theses. 3064. https://bearworks.missouristate.edu/theses/3064 This article or document was made available through BearWorks, the institutional repository of Missouri State University. The work contained in it may be protected by copyright and require permission of the copyright holder for reuse or redistribution. For more information, please contact [email protected]. MERGING MEDIUMS: APPLYING DOCUMENT DESIGN TO ONLINE HELP SYSTEMS TO INCREASE USABILITY A Master’s Thesis Presented to The Graduate College of Missouri State University TEMPLATE In Partial Fulfillment Of the Requirements for the Degree Master of Arts, Writing By Meghan M. Smith May 2017 Copyright 2017 by Meghan Marie Smith ii MERGING MEDIUMS: APPLYING DOCUMENT DESIGN TO ONLINE HELP SYSTEMS TO INCREASE USABILITY English Missouri State University, May 2017 Master of Arts Meghan M. Smith ABSTRACT Document design is an essential part of print, and more recently, web documents, but recent application to the usability of document design in the current iteration of online help systems has been lacking. As an attempt to fill this gap, I conducted a study testing three document design principles—color, navigation structures (headings/hyperlinks), and visuals—to determine how they should be applied in online help systems to increase usability. I constructed an online help system for the online infographic creator Piktochart, and used these three principles according to theories and practices from prior research on print and web documents. Participants used the constructed help system to complete a task-based scenario using Piktochart. The results show that participants’ main criteria for successful usability is that the help system aids them in understanding the program and completing tasks efficiently with minimal frustration. Participants preferred a cohesive and consistent design that allowed them to find what they needed quickly, and to be oriented to the task they were trying to complete. If the three principles helped in these regards, they were deemed effective by the participants. Technical communicators should understand how to best apply document design principles to the growing medium of online help systems. KEYWORDS: online help systems, usability, color, headings, hyperlinks, visuals, document design, technical communication This abstract is approved as to form and content _______________________________ Rhonda Stanton, PhD Chairperson, Advisory Committee Missouri State University iii MERGING MEDIUMS: APPLYING DOCUMENT DESIGN TO ONLINE HELP SYSTEMS TO INCREASE USABILITY By Meghan M. Smith A Master’s Thesis Submitted to the Graduate College Of Missouri State University In Partial Fulfillment of the Requirements For the Degree of Master of Arts, Writing May 2017 Approved: _______________________________________ Rhonda Stanton, PhD _______________________________________ Michael Stowe _______________________________________ Lyn Gattis, PhD _______________________________________ Julie Masterson, PhD: Dean, Graduate College iv ACKNOWLEDGEMENTS I would like to thank the following people for their support during the course of my graduate studies: my parents, for their support in all my endeavors, academic and otherwise; my sister, Emily, for letting me call her and vent my frustration over the 18 months it took me to finish this research; Dr. Rhonda Stanton, for her help and encouragement as I toiled away on this expansive research project (I’m glad I got to be your guinea pig); and to the rest of my thesis committee for their invaluable comments and advice during the planning, writing, and revision process. I dedicate this thesis to my husband, Scott. You are my foundation, and without you I would not have completed this thesis, much less my Master’s degree. v TABLE OF CONTENTS Introduction ..........................................................................................................................1 Literature Review.................................................................................................................3 How to Use Color in Print and Web Documents .....................................................3 How to Use Navigation in Print and Web Documents ..........................................10 How to Use Visuals in Print and Web Documents ................................................18 The Relationship between Document Design and Online Help Systems ..............26 Methods..............................................................................................................................28 Description of Study Preparation ...........................................................................28 Description of Study Materials ..............................................................................34 Results ...............................................................................................................................50 Pre-Help System Survey Results ..........................................................................50 Post-Help System Survey Results ..........................................................................53 Textual Data from Pre-Help and Post-Help System Surveys ................................58 Discussion ..........................................................................................................................65 How Color Affects Online Help System Usability ................................................65 How Navigation Affects Online Help System Usability .......................................68 How Visuals Affect Online Help System Usability ..............................................71 Putting it All Together: The Three Document Design Principles ..........................73 Limitations of the Study.........................................................................................74 Closing Thoughts and Directions for Further Study ..............................................76 References ..........................................................................................................................79 Appendices ........................................................................................................................83 Appendix A. Study Test Plan.................................................................................83 Appendix B. Human Subject IRB Approval..........................................................85 Appendix C. Study Script for Blackboard Posting ................................................86 Appendix D. Consent Form for Study ...................................................................87 Appendix E. Study Scenario Materials ..................................................................89 Appendix F. Pre-Help System Survey ...................................................................92 Appendix G. Post-Help System Survey .................................................................94 vi LIST OF TABLES Table 1. Pre-Help System Survey Response Data for Likert Scale Questions ..................51 Table 2. Post-Help System Survey Response Data for Likert Scale Questions ................54 vii LIST OF FIGURES Figure 1. Colors used for heading, notes, and hyperlinks in the Piktochart online help system. ...............................................................................................................................36 Figure 2. Example of hyperlinks for topics within a section in the Piktochart online help system. ...............................................................................................................................37 Figure 3. Example of heading structure and frequency in the Piktochart online help system. ...............................................................................................................................38 Figure 4. Example of semantic hyperlinks and section landing page for the Piktochart online help system..............................................................................................................40 Figure 5. Example of the use of screenshots and icons in the Piktochart online help system. ...............................................................................................................................41 Figure 6. Design layout and color scheme of the webpage built for the study and related materials. ............................................................................................................................48 viii INTRODUCTION Document design principles are important for technical communicators to know and understand.