| Peer-Reviewed

Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation

Received: 29 December 2021     Accepted: 18 January 2022     Published: 25 January 2022
Views:       Downloads:
Abstract

Previsualization is a visual representation based on computer graphics and 3D animation. It has been a well-known tool in movie-making, used to present, explore, plan, and communicate creative ideas before final filming. The communication aspect of this video-based visualization is a less-explored area, especially in the design and development of programming-based animations. This research aims to understand Previsualization’s significance in envisioning script-based web animation. Mixed methodologies were used to gather programmers’ perspectives on Previsualization in the process of designing three.js web animation. The research used semi-structured interviews and Likert Scale based questionnaires as data collection tools. The interview data of twelve professional programmers provided their perspectives and thematic analysis provided key inferences. The Likert scale questionnaire obtained programmers’ perceptions on the functions of Previsualization and the usability in the context of three.js animation. The study also used quantification to check the central tendency and the collective attitude of programmers towards Previsualization. According to the programmers, Previsualization holds functions of a good visualization and is the best way to prototype animation ideas. It can present a substantial amount of information related to three.js web animation, and it is an effective tool for designers to communicate animation ideas to the programmer. The programmers have high-level acceptance and a positive attitude towards it. They perceived it as more effective than conventional visual representations, such as drawings to present most visual features and prototype script-based three.js animations.

Published in American Journal of Art and Design (Volume 7, Issue 1)
DOI 10.11648/j.ajad.20220701.11
Page(s) 1-10
Creative Commons

This is an Open Access article, distributed under the terms of the Creative Commons Attribution 4.0 International License (http://creativecommons.org/licenses/by/4.0/), which permits unrestricted use, distribution and reproduction in any medium or format, provided the original work is properly cited.

Copyright

Copyright © The Author(s), 2022. Published by Science Publishing Group

Keywords

Previsualization, Web Animation, Programming, Visualization, Design Process

References
[1] Burkhard, Remo Aslak. Knowledge visualization: The use of complementary visual representations for the transfer of knowledge. A model, a framework, and four new approaches. Diss. ETH Zurich, 2005.
[2] Chang, Bay-Wei, and David Ungar. “Animation: from cartoons to the user interface.” Proceedings of the 6th annual ACM symposium on User interface software and technology. 1993.
[3] Chen, Min, and Heike Jaenicke. “An information-theoretic framework for visualization.” IEEE Transactions on Visualization and Computer Graphics 16.6 (2010): 1206-1215.
[4] Council, Design. “Eleven lessons: Managing design in eleven global brands- A study of the design process.” Design Council (2007).
[5] Curtis, Scott, and Robert Lue. “Bridging Science, Art, and the History of Visualization: A Dialogue between Scott Curtis and Robert Lue.” Discourse 37.3 (2015): 193-206.
[6] D. Fallman. Design-oriented human-computer interaction. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, 2003.
[7] Eppler, Martin J., and Remo A. Burkhard. Knowledge visualization: towards a new discipline and its fields of application. Università della Svizzera italiana, 2004.
[8] Goldschmidt, G ‘On visual design thinking: the vis kids of architecture’ Design Studies Vol 15 No 2 (1994) pp 158–174.
[9] Hart, John, and John Hart. The Art of the Storyboard: A Filmmaker’s Introduction. Amsterdam: Elsevier/Focal, 2008. Print.
[10] Hartmann, S. Klemmer, and M. Bernstein. Reflective physical prototyping through integrated design, test, and analysis. In Proceedings of the ACM Symposium on User Interface Software and Technology, pages 299–308. ACM, 2006.
[11] Hassenzahl, Marc. “The interplay of beauty, goodness, and usability in interactive products.” Human-Computer Interaction 19, no. 4 (2005): 319-349.”
[12] Hassenzahl, Marc. “The thing and I: understanding the relationship between user and product.” Funology 2. Springer, Cham, 2018. 301-313.
[13] Holmlid, Stefan. “Interaction design and service design: Expanding a comparison of design disciplines.” Nordes 2 (2007).
[14] Houde, Stephanie, and Charles Hill. “What do prototypes prototype?” Handbook of human-computer interaction. North-Holland, 1997. 367-381.
[15] ISO CD 9241-11: Ergonomics of human-system interaction–Part 11: Usability: definitions and concepts (1998).
[16] Jagan Mohan Balakrishnan, Soumya Manjunath Chavan. Communication in the Design Process of Web Animation Based on Scripting Language: Programmers’ Perspectives. American Journal of Art and Design. Vol. 6, No. 2, 2021, pp. 38-46.
[17] Jenson, Lasse Skovgaard, Ali Gürcan Özkil, and Niels Henrik Mortensen. “Prototypes in engineering design: Definitions and strategies.” DS 84: Proceedings of the DESIGN 2016 14th International Design Conference. 2016.
[18] Lemon, Nicole. Pre-visualization in computer Animated Filmmaking. Ohio: The Ohio State University, 2016.
[19] Lwabona. AniTouch, Multitouch-based Collaborative Pre-visualisation for Computer Animation. 2015. Master’s thesis.
[20] Manovich, Lev. The Language of New Media. 1st ed. Cambridge, Mass: MIT Press, 2002. Print.
[21] Paton, Ray, and Irene Neilsen, eds. Visual representations and interpretations. Springer Science & Business Media, 1999.
[22] Price, Steven, and Chris Pallant. Storyboarding: A Critical History. Springer, 2015.
[23] Rieber, L. P. (1994). Computers, graphics, and learning. Madison, WI: Brown & Benchmark.
[24] Robbins, E Why architects draw MIT Press, Cambridge, MA (1994).
[25] Schrage, M. (1996). Cultures of Prototyping. In T. Winograd, Bringing Design to Software (pp. 191-205). New York: ACM Press.
[26] Shaw, Austin. Design for motion: Fundamentals and Techniques of motion design. Routledge, 2019. Page: 115.
[27] Stone, R. Brian, and Leah Wahlin, eds. The Theory and Practice of Motion Design: Critical Perspectives and Professional Practice. Routledge, 2018.
[28] Suwa, M and Tversky, B (1997) What do architects and students perceive in their design sketches? A protocol analysis Design Studies Vol 18 No 4 pp 385e403.
[29] Vosniadou, Stella, and Andrew Ortony, eds. Similarity and analogical reasoning. Cambridge University Press, 1989.
[30] Wang, Jinyi, Oskar Juhlin, and Eva-Carin Banka Johnson. “Pre-visualization with computer animation (Previs) communicating research to interaction design practice.” Proceedings of the 26th Australian Computer-Human Interaction Conference on Designing Futures: the Future of Design. 2014.
[31] Yang, Maria C. “A study of prototypes, design activity, and design outcome.” Design Studies 26.6 (2005): 649-669.
Cite This Article
  • APA Style

    Jagan Mohan Balakrishnan, Soumya Manjunath Chavan. (2022). Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation. American Journal of Art and Design, 7(1), 1-10. https://doi.org/10.11648/j.ajad.20220701.11

    Copy | Download

    ACS Style

    Jagan Mohan Balakrishnan; Soumya Manjunath Chavan. Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation. Am. J. Art Des. 2022, 7(1), 1-10. doi: 10.11648/j.ajad.20220701.11

    Copy | Download

    AMA Style

    Jagan Mohan Balakrishnan, Soumya Manjunath Chavan. Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation. Am J Art Des. 2022;7(1):1-10. doi: 10.11648/j.ajad.20220701.11

    Copy | Download

  • @article{10.11648/j.ajad.20220701.11,
      author = {Jagan Mohan Balakrishnan and Soumya Manjunath Chavan},
      title = {Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation},
      journal = {American Journal of Art and Design},
      volume = {7},
      number = {1},
      pages = {1-10},
      doi = {10.11648/j.ajad.20220701.11},
      url = {https://doi.org/10.11648/j.ajad.20220701.11},
      eprint = {https://article.sciencepublishinggroup.com/pdf/10.11648.j.ajad.20220701.11},
      abstract = {Previsualization is a visual representation based on computer graphics and 3D animation. It has been a well-known tool in movie-making, used to present, explore, plan, and communicate creative ideas before final filming. The communication aspect of this video-based visualization is a less-explored area, especially in the design and development of programming-based animations. This research aims to understand Previsualization’s significance in envisioning script-based web animation. Mixed methodologies were used to gather programmers’ perspectives on Previsualization in the process of designing three.js web animation. The research used semi-structured interviews and Likert Scale based questionnaires as data collection tools. The interview data of twelve professional programmers provided their perspectives and thematic analysis provided key inferences. The Likert scale questionnaire obtained programmers’ perceptions on the functions of Previsualization and the usability in the context of three.js animation. The study also used quantification to check the central tendency and the collective attitude of programmers towards Previsualization. According to the programmers, Previsualization holds functions of a good visualization and is the best way to prototype animation ideas. It can present a substantial amount of information related to three.js web animation, and it is an effective tool for designers to communicate animation ideas to the programmer. The programmers have high-level acceptance and a positive attitude towards it. They perceived it as more effective than conventional visual representations, such as drawings to present most visual features and prototype script-based three.js animations.},
     year = {2022}
    }
    

    Copy | Download

  • TY  - JOUR
    T1  - Programmers’ Perspectives on the Use of Previsualization in the Design Process of Three.js Web Animation
    AU  - Jagan Mohan Balakrishnan
    AU  - Soumya Manjunath Chavan
    Y1  - 2022/01/25
    PY  - 2022
    N1  - https://doi.org/10.11648/j.ajad.20220701.11
    DO  - 10.11648/j.ajad.20220701.11
    T2  - American Journal of Art and Design
    JF  - American Journal of Art and Design
    JO  - American Journal of Art and Design
    SP  - 1
    EP  - 10
    PB  - Science Publishing Group
    SN  - 2578-7802
    UR  - https://doi.org/10.11648/j.ajad.20220701.11
    AB  - Previsualization is a visual representation based on computer graphics and 3D animation. It has been a well-known tool in movie-making, used to present, explore, plan, and communicate creative ideas before final filming. The communication aspect of this video-based visualization is a less-explored area, especially in the design and development of programming-based animations. This research aims to understand Previsualization’s significance in envisioning script-based web animation. Mixed methodologies were used to gather programmers’ perspectives on Previsualization in the process of designing three.js web animation. The research used semi-structured interviews and Likert Scale based questionnaires as data collection tools. The interview data of twelve professional programmers provided their perspectives and thematic analysis provided key inferences. The Likert scale questionnaire obtained programmers’ perceptions on the functions of Previsualization and the usability in the context of three.js animation. The study also used quantification to check the central tendency and the collective attitude of programmers towards Previsualization. According to the programmers, Previsualization holds functions of a good visualization and is the best way to prototype animation ideas. It can present a substantial amount of information related to three.js web animation, and it is an effective tool for designers to communicate animation ideas to the programmer. The programmers have high-level acceptance and a positive attitude towards it. They perceived it as more effective than conventional visual representations, such as drawings to present most visual features and prototype script-based three.js animations.
    VL  - 7
    IS  - 1
    ER  - 

    Copy | Download

Author Information
  • Department of Humanities & Social Sciences, Visual Arts, Jain University, Bangalore, India

  • Division of Yoga and Humanities, S-VYASA University, Bangalore, India

  • Sections