Concurrent Design: Putting Design Plans into Development Action



In the WBID Model, design and development activities are completed concurrently. The design planning, which results in the WBI Strategy Worksheet, is the basis for developing the prototypes and online instruction. Additionally, message and visual design principles help guide the development, assembly, and organization of the instruction and LMS/website content. Initial development tasks include developing an interface prototype, creating flowcharts, and developing storyboards. Later development tasks include fully developing the digital elements that will be deployed in the LMS, converting prototypes into Web pages, and incorporating media. Formative evaluation procedures are included to ensure that resulting online instruction meets design specifications.

This chapter begins with a discussion on basic principles related to message and visual design within an LMS framework. Next, we present a brief description of an interface, including the use of visual metaphor and analogy, which culminates in sketching an interface and revising the initial prototype based on message design. We then introduce and discuss types of flowcharts and two types of storyboards that can be used to develop online instruction. A discussion on the technical issues associated with development follows. The chapter closes with an overview of final developmental tasks related to formative evaluation.


Flowcharts Storyboards Noise Message design Visual design Metaphors Interface Prototypes Style guide 


  1. Alexander, J. E., & Tate, M. A. (1999). Web wisdom. Mahwah, NJ: Lawrence Erlbaum Associates.Google Scholar
  2. Americans with Disabilities Act of 1990, Pub. L. No. 101-336, 104 Stat. 328 (1990).Google Scholar
  3. Articulate. (2014). Essential guide to visual design. Retrieved from
  4. Berry, L. H. (2000). Cognitive effects of Web page design. In B. Abbey (Ed.), Instructional and cognitive impacts of Web-based education (pp. 41–55). Hershey, PA: Idea Group.CrossRefGoogle Scholar
  5. Bishop, M. J. (2013). Instructional message design: Past, present and future relevance. In J. M. Spector, M. D. Merrill, J. Elen, & M. J. Bishop (Eds.), Handbook of research on educational communications and technology (4th ed., pp. 373–383). New York, NY: Springer.Google Scholar
  6. Cho, V., Cheng, T. C. E., & Lai, W. M. J. (2009). The role of perceived user-interface design in continued usage intention of self-paced e-learning tools. Computers & Education, 53(2), 216–227.CrossRefGoogle Scholar
  7. Clark, R. C., & Mayer, R. E. (2003). E-learning and the science of instruction: Proven guidelines for consumers and designers of multimedia learning. San Francisco, CA: Jossey-Bass/Pfeiffer.Google Scholar
  8. Colson, R. Scott, E. & Donaldson, R (2017). Supporting librarians in making the business case for OER. The Reference Librarian, 1–10. Scholar
  9. Creative Commons. (2016). Website. Retrieved from
  10. David, A., & Glore, P. (2010). The impact of design and aesthetics on usability, credibility, and learning in an online environment. Online Journal of Distance Learning Administration, 13(4). Retrieved from
  11. Davis, T. (2015). Visual design for online learning. San Francisco, CA: Jossey-Bass.Google Scholar
  12. Driscoll, M. P. (2005). Psychology of learning for instruction (3rd ed.). Boston, MA: Pearson.Google Scholar
  13. Elias, T. (2010). Universal instructional design principles for Moodle. International Review of Research in Open and Distance Learning, 11(2). Retrieved from
  14. Grabowski, B. L. (1995). Message design: Issues and trends. In G. J. Anglin (Ed.), Instructional technology: Past, present and future (2nd ed., pp. 222–232). Englewood, CO: Libraries Unlimited.Google Scholar
  15. Harding, D., & Ingraham, B. (2013). The art of design. In H. Beetham & R. Sharpe (Eds.), Rethinking pedagogy for a digital age: Designing for 21st century learning (2nd ed., pp. 177–187). New York, NY: Routledge.Google Scholar
  16. Hughes, M., & Burke, L. (2000). Usability testing of Web-based training. In B. H. Khan (Ed.), Web-based training (pp. 531–536). Englewood Cliffs, NJ: Educational Technology Publications.Google Scholar
  17. Jolliffe, A., Ritter, J., & Stevens, D. (2011). The online learning handbook: Developing and using web-based learning. New York, NY: Routledge.Google Scholar
  18. Jones, M. G., & Farquhar, J. D. (1997). User interface design for Web-based instruction. In B. H. Khan (Ed.), Web-based instruction (pp. 239–244). Englewood Cliffs, NJ: Educational Technology Publications.Google Scholar
  19. Kinder, H., & Articulate. (2015). How to use typography to improve your e-learning. Retrieved from
  20. Lohr, L. (2008). Creating graphics for learning and performance: Lessons in visual literacy (2nd ed.). Upper Saddle River, NJ: Pearson Education.Google Scholar
  21. Lynch, P. J., & Horton, S. (1999). Web style guide: Basic design principles for creating Web sites. New Haven, CT: Yale University Press.Google Scholar
  22. Maddux, C. D., & Cummings, R. C. (2000). Developing Web pages as supplements to traditional courses. In B. Abbey (Ed.), Instructional and cognitive impacts of Web-based instruction (pp. 147–155). Hershey, PA: Idea Group.CrossRefGoogle Scholar
  23. Mayer, R. E. (2008). Applying the science of learning: Evidence-based principles for the design of multimedia instruction. The American Psychologist, 63(8), 760–770.CrossRefGoogle Scholar
  24. Mayer, R. E. (2011). Instruction based on visualization. In R. E. Mayer & P. A. Alexander (Eds.), Handbook of Research on Learning and Instruction (pp. 426–445). New York, NY: Routledge.Google Scholar
  25. McClelland, D., Eisman, K., & Stone, T. (2000). Web design studio secrets. New York, NY: John Wiley & Sons.Google Scholar
  26. Nielson, J. (2000). Designing web usability. Indianapolis, IN: New Riders.Google Scholar
  27. Richey, R. C., Klein, J. D., & Tracey, M. W. (2011). The instructional design knowledge base: Theory, research, and practice. New York, NY: Routledge.Google Scholar
  28. Rudd, J., Stern, K. R., & lsensee, S. (1996). Low vs. high fidelity prototyping debate. Interactions, 76–85.Google Scholar
  29. Schneckenberg, D., Ehlers, U., & Adelsberger, H. (2011). Web 2.0 and competence-oriented design of learning-Potentials and implications for higher education. British Journal of Educational Technology, 42(5), 747–762. CrossRefGoogle Scholar
  30. Simonson, M., Smaldino, S., & Zvaek, S. (2015). Teaching and learning at a distance: Foundations of distance education (6th ed.). Charlotte, NC: Information Age Publishing.Google Scholar
  31. Slagter van Tryon, P., & Bishop, M. (2009). Theoretical foundations for enhancing social connectedness in online learning environments. Distance Education, 30(3), 291–315.CrossRefGoogle Scholar
  32. Smaldino, S. E., Lowther, D. L., Mims, C., & Russell, J. D. (2015). Instructional technology and media for learning (11th ed.). Boston, MA: Pearson Education.Google Scholar
  33. Stim, R. (n.d.). Fair use: The four factors courts consider in a copyright infringement case. Nolo. Retrieved from
  34. W3C (2017). Standards. Retrieved from
  35. Wang, M. M., & Shen, R. R. (2012). Message design for mobile learning: Learning theories, human cognition and design principles. British Journal of Educational Technology, 43(4), 561–575. CrossRefGoogle Scholar
  36. Wolfe, C. R. (2001). Plant a tree in cyberspace: Metaphor and analogy as design elements in Web-based learning environments. Cyberpsychology & Behavior, 4(1), 67–76.CrossRefGoogle Scholar
  37. Zobel, S. (1997). Legal implications of intellectual property and the World Wide Web. In B. H. Khan (Ed.), Web-based instruction (pp. 337–340). Englewood Cliffs, NJ: Educational Technology Publications.Google Scholar

Copyright information

©  Springer International Publishing AG 2018

Authors and Affiliations

  1. 1.Department of Counseling and Instructional ScienceUniversity of South AlabamaMobileUSA
  2. 2.Division of Research and Strategic InnovationUniversity of West FloridaPensacolaUSA
  3. 3.Department of Educational TechnologyBoise State UniversityBoiseUSA

Personalised recommendations