skip to main content
10.1145/3025453.3025927acmconferencesArticle/Chapter ViewAbstractPublication PageschiConference Proceedingsconference-collections
research-article

Supporting Expressive Procedural Art Creation through Direct Manipulation

Published: 02 May 2017 Publication History

Abstract

Computation is a powerful artistic medium. Artists with experience in programming have demonstrated the unique creative opportunities of using code to make art. Currently, manual artists interested in using procedural techniques must undergo the difficult process of learning to program, and must adopt tools and practices far removed from those to which they are accustomed. We hypothesize that, through the right direct manipulation interface, we can enable accessible and expressive procedural art creation. To explore this, we developed Para, a digital illustration tool that supports the creation of declarative constraints in vector artwork. Para's constraints enable procedural relationships while facilitating live manual control and non-linear editing. Constraints can be combined with duplication behaviors and ordered collections of artwork to produce complex, dynamic compositions. We use the results of two open-ended studies with professional artists and designers to provide guidelines for accessible tools that integrate manual and procedural expression.

Supplementary Material

ZIP File (pn3702-file4.zip)
suppl.mov (pn3702-file3.mp4)
Supplemental video
suppl.mov (pn3702p.mp4)
Supplemental video

References

[1]
Cycling '74. 2016. Max. http://cycling74.com/products/max
[2]
Robert Aish. 2012. DesignScript: origins, explanation, illustration. In Computational Design Modelling. Springer, 1--8.
[3]
Arduino. 2017. Arduino Introduction. http://www.arduino.cc/en/Guide/Introduction
[4]
J. Ashkenas and DocumentCloud. 2010. Backbone.js. http://backbonejs.org
[5]
Alan F. Blackwell. 2014. Palimpsest: A layered language for exploratory image processing. Journal of Visual Languages Computing 25, 5 (2014), 545 -- 571.
[6]
Ravi Chugh, Jacob Albers, and Mitchell Spradlin. 2015. Program Synthesis for Direct Manipulation Interfaces. CoRR abs/1507.02988 (2015). http://arxiv.org/abs/1507.02988
[7]
Scott Davidson. 2007. Grasshopper. http://www.grasshopper3d.com.
[8]
Experimental Media Research Group. 2004. NodeBox. http://www.nodebox.net
[9]
Björn Hartmann, Loren Yu, Abel Allison, Yeonsoo Yang, and Scott R. Klemmer. 2008. Design As Exploration: Creating Interface Alternatives Through Parallel Authoring and Runtime Tuning. In Proceedings of the 21st Annual ACM Symposium on User Interface Software and Technology (UIST '08). ACM, NY, NY, USA, 91--100.
[10]
B. Harvey. 1991. Symbolic Programming vs. the A.P. Curriculum. The Computing Teacher 56 (February 1991), 27--29.
[11]
Brian Hempel and Ravi Chugh. 2016. Semi-Automated SVG Programming via Direct Manipulation. In Proceedings of the 29th Annual Symposium on User Interface Software and Technology (UIST '16). ACM, NY, NY, USA, 379--390.
[12]
Raphaël Hoarau and Stéphane Conversy. 2012. Augmenting the Scope of Interactions with Implicit and Explicit Graphical Structures. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '12). ACM, NY, NY, USA, 1937--1946.
[13]
MakerBot Industries. 2015. Thingiverse Customizer. http://www.thingiverse.com/apps/customizer
[14]
Jennifer Jacobs and Leah Buechley. 2013. Codeable Objects: Computational Design and Digital Fabrication for Novice Programmers. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '13). ACM, NY, NY, USA, 1589--1598.
[15]
Jennifer Jacobs, Mitchel Resnick, and Leah Buechley. 2014. Dresscode: supporting youth in computational design and making. In Constructionism. Vienna, Austria.
[16]
Alan C. Kay. 1990. User Interface: A Personal View. Addison-Wesley. 191--207 pages.
[17]
Rubaiat Habib Kazi, Fanny Chevalier, Tovi Grossman, and George Fitzmaurice. 2014. Kitty: Sketching Dynamic and Interactive Illustrations. In Proceedings of the 27th Annual ACM Symposium on User Interface Software and Technology (UIST '14). ACM, NY, NY, USA, 11.
[18]
Rubaiat Habib Kazi, Tovi Grossman, Nobuyuki Umetani, and George Fitzmaurice. 2016. SKUID: Sketching Dynamic Drawings Using the Principles of 2D Animation. In ACM SIGGRAPH 2016 Talks (SIGGRAPH '16). ACM, NY, NY, USA, Article 84, 1 pages.
[19]
Scott R. Klemmer, Björn Hartmann, and Leila Takayama. 2006. How Bodies Matter: Five Themes for Interaction Design. In Proceedings of the 6th Conference on Designing Interactive Systems (DIS '06). ACM, NY, NY, USA.
[20]
Andrew J. Ko, Brad A. Myers, and Htet Htet Aung. 2004. Six Learning Barriers in End-User Programming Systems. In Proceedings of the 2004 IEEE Symposium on Visual Languages - Human Centric Computing (VLHCC '04). IEEE Computer Society, Washington, DC, USA, 199--206.
[21]
J. Lehni and J. Puckey. 2011. Paper.js. http://paperjs.org/
[22]
Golan Levin. 2003. Essay for Creative Code. http:// www.flong.com/texts/essays/essay_creative_code
[23]
Z. Lieberman, T. Watson, and A. Castro. 2015. openFrameworks. http://openframeworks.cc/about
[24]
Maryam M. Maleki, Robert F. Woodbury, and Carman Neustaedter. 2014. Liveness, Localization and Lookahead: Interaction Elements for Parametric Design. In Proceedings of the 2014 Conference on Designing Interactive Systems (DIS '14). ACM, NY, NY, USA.
[25]
John H. Maloney and Randall B. Smith. 1995. Directness and liveness in the morphic user interface construction environment. In Proceedings of the 8th annual ACM symposium on User interface and software technology. ACM.
[26]
M. McCullough. 1996. Abstracting Craft: The Practiced Digital Hand. The MIT Press, Cambridge, Massachusetts.
[27]
W.J. Mitchell. 1990. The Logic of Architecture: Design, Computation, and Cognition. MIT Press, Cambridge, MA, USA.
[28]
Brad Myers, Scott E Hudson, and Randy Pausch. 2000. Past, present, and future of user interface software tools. ACM Transactions on Computer-Human Interaction (TOCHI) 7, 1 (2000), 3--28.
[29]
Brad A Myers. 1990. Taxonomies of visual programming and program visualization. Journal of Visual Languages & Computing 1, 1 (1990), 97--123.
[30]
Lora Oehlberg, Wesley Willett, and Wendy E. Mackay. 2015. Patterns of Physical Design Remixing in Online Maker Communities. In Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems (CHI '15). ACM, NY, NY, USA.
[31]
Stephen Oney, Brad Myers, and Joel Brandt. 2012. ConstraintJS: Programming Interactive Behaviors for the Web by Integrating Constraints and States. In Proceedings of the 25th Annual ACM Symposium on User Interface Software and Technology (UIST '12). ACM, NY, NY, USA.
[32]
Stephen Oney, Brad Myers, and Joel Brandt. 2014. InterState: A Language and Environment for Expressing Interface Behavior. In Proceedings of the 27th Annual ACM Symposium on User Interface Software and Technology (UIST '14). ACM, NY, NY, USA.
[33]
Fatih Kursat Ozenc, Miso Kim, John Zimmerman, Stephen Oney, and Brad Myers. 2010. How to Support Designers in Getting Hold of the Immaterial Material of Software. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '10). ACM, NY, NY, USA.
[34]
S. Papert. 1980. Mindstorms: children, computers, and powerful ideas. Basic Books.
[35]
C. Reas and B. Fry. 2004. Processing. http://processing.org
[36]
C. Reas and B. Fry. 2007. The Processing Handbook. MIT Press, Cambridge, Massachusetts, USA.
[37]
C. Reas and B. Fry. 2016. Processing Overview. http://processing.org/overview
[38]
C. Reas, C. McWilliams, and LUST. 2010. Form and Code. Princeton Architectural Press, NY, NY, USA.
[39]
Mitchel Resnick, John Maloney, Andrés Monroy-Hernández, Natalie Rusk, Evelyn Eastmond, Karen Brennan, Amon Millner, Eric Rosenbaum, Jay Silver, Brian Silverman, and Yasmin Kafai. 2009. Scratch: Programming for All. Commun. ACM 52, 11 (Nov. 2009).
[40]
Mitchel Resnick and Brian Silverman. 2005. Some Reflections on Designing Construction Kits for Kids. In Proceedings of the 2005 Conference on Interaction Design and Children (IDC '05). ACM, NY, NY, USA.
[41]
David Roedl, Shaowen Bardzell, and Jeffrey Bardzell. 2015. Sustainable Making? Balancing Optimism and Criticism in HCI Discourse. ACM Trans. Comput.-Hum. Interact. 22, 3 (June 2015).
[42]
J. Rosenkrantz and J. Louis-Rosenberg. 2015. Nervous System Tools. http://n-e-r-v-o-u-s.com/tools
[43]
Toby Schachman. 2012. Alternative Programming Interfaces for Alternative Programmers. In Proceedings of the ACM International Symposium on New Ideas, New Paradigms, and Reflections on Programming and Software (Onward! 2012). ACM, NY, NY, USA.
[44]
Toby Schachman. 2015. Apparatus: a hybrid graphics editor / programming environment for creating interactive diagrams. In Strange Loop.
[45]
Donald Schön and John Bennett. 1996. Bringing Design to Software. ACM, NY, NY, USA, Chapter Reflective Conversation with Materials.
[46]
Ben Shneiderman. 1984. The Future of Interactive Systems and the Emergence of Direct Manipulation. In Proc. Of the NYU Symposium on User Interfaces on Human Factors and Interactive Computer Systems. Ablex Publishing Corp., Norwood, NJ, USA, 1--28. http://dl.acm.org/citation.cfm?id=2092.2093
[47]
Ivan E. Sutherland. 1998. Seminal Graphics. ACM, NY, NY, USA, Chapter Sketchpad: a Man-machine Graphical Communication System, 391--408.
[48]
Cesar Torres and Eric Paulos. 2015. MetaMorphe: Designing Expressive 3D Models for Digital Fabrication. In Proceedings of the 2015 ACM SIGCHI Conference on Creativity and Cognition (C&C '15). ACM, NY, NY, USA.
[49]
S. Turkle and S. Papert. 1992. Epistemological Pluralism and the Revaluation of the Concrete. Journal of Mathematical Behavior 11, 1 (March 1992).
[50]
B. Victor. 2011. Dynamic Pictures. http: //worrydream.com/DynamicPicturesMotivation.
[51]
B. Victor. 2012. Learnable Programming: Designing a programming system for understanding programs. http://worrydream.com/LearnableProgramming.
[52]
B. Victor. 2013a. Drawing Dynamic Data Visualizations Addendum. http://worrydream.com/ DrawingDynamicVisualizationsTalkAddendum.
[53]
B. Victor. 2013b. Drawing Dynamic Data Visualizations (Talk). http://vimeo.com/66085662.
[54]
Haijun Xia, Bruno Araujo, Tovi Grossman, and Daniel Wigdor. 2016. Object-Oriented Drawing. In Proceedings of the 2016 CHI Conference on Human Factors in Computing Systems (CHI '16). ACM, NY, NY, USA, 4610--4621.

Cited By

View all
  • (2024)What Counts as ‘Creative’ Work? Articulating Four Epistemic Positions in Creativity-Oriented HCI ResearchProceedings of the 2024 CHI Conference on Human Factors in Computing Systems10.1145/3613904.3642854(1-15)Online publication date: 11-May-2024
  • (2024)ConnectVR: A Trigger-Action Interface for Creating Agent-based Interactive VR Stories2024 IEEE Conference Virtual Reality and 3D User Interfaces (VR)10.1109/VR58804.2024.00051(286-297)Online publication date: 16-Mar-2024
  • (2024)‘Rhetoric’ in the design process: The role of prop-based virtual reality storytelling in user-centred product conceptual designThe Design Journal10.1080/14606925.2024.236030327:6(1142-1164)Online publication date: 4-Jun-2024
  • Show More Cited By

Index Terms

  1. Supporting Expressive Procedural Art Creation through Direct Manipulation

    Recommendations

    Comments

    Information & Contributors

    Information

    Published In

    cover image ACM Conferences
    CHI '17: Proceedings of the 2017 CHI Conference on Human Factors in Computing Systems
    May 2017
    7138 pages
    ISBN:9781450346559
    DOI:10.1145/3025453
    Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than the author(s) must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected].

    Sponsors

    Publisher

    Association for Computing Machinery

    New York, NY, United States

    Publication History

    Published: 02 May 2017

    Permissions

    Request permissions for this article.

    Check for updates

    Badges

    • Best Paper

    Author Tags

    1. generative art
    2. procedural art
    3. programming

    Qualifiers

    • Research-article

    Conference

    CHI '17
    Sponsor:

    Acceptance Rates

    CHI '17 Paper Acceptance Rate 600 of 2,400 submissions, 25%;
    Overall Acceptance Rate 6,199 of 26,314 submissions, 24%

    Upcoming Conference

    CHI 2025
    ACM CHI Conference on Human Factors in Computing Systems
    April 26 - May 1, 2025
    Yokohama , Japan

    Contributors

    Other Metrics

    Bibliometrics & Citations

    Bibliometrics

    Article Metrics

    • Downloads (Last 12 months)93
    • Downloads (Last 6 weeks)7
    Reflects downloads up to 13 Feb 2025

    Other Metrics

    Citations

    Cited By

    View all
    • (2024)What Counts as ‘Creative’ Work? Articulating Four Epistemic Positions in Creativity-Oriented HCI ResearchProceedings of the 2024 CHI Conference on Human Factors in Computing Systems10.1145/3613904.3642854(1-15)Online publication date: 11-May-2024
    • (2024)ConnectVR: A Trigger-Action Interface for Creating Agent-based Interactive VR Stories2024 IEEE Conference Virtual Reality and 3D User Interfaces (VR)10.1109/VR58804.2024.00051(286-297)Online publication date: 16-Mar-2024
    • (2024)‘Rhetoric’ in the design process: The role of prop-based virtual reality storytelling in user-centred product conceptual designThe Design Journal10.1080/14606925.2024.236030327:6(1142-1164)Online publication date: 4-Jun-2024
    • (2023)How HCI concepts are used in articles featuring interactive digital arts: a literature review.Proceedings of the XXII Brazilian Symposium on Human Factors in Computing Systems10.1145/3638067.3638116(1-12)Online publication date: 16-Oct-2023
    • (2023)PotScript: a visual grammar for sculpting with functionsProceedings of the 8th ACM Symposium on Computational Fabrication10.1145/3623263.3623357(1-9)Online publication date: 8-Oct-2023
    • (2023)Nothing Like Compilation: How Professional Digital Fabrication Workflows Go Beyond Extruding, Milling, and MachinesACM Transactions on Computer-Human Interaction10.1145/360932831:1(1-45)Online publication date: 29-Nov-2023
    • (2023)A Study of Creative Development with an IoT-based Audiovisual System: Creative Strategies and Impacts for System DesignProceedings of the 15th Conference on Creativity and Cognition10.1145/3591196.3593057(139-149)Online publication date: 19-Jun-2023
    • (2023)Interactive Flexible Style Transfer for Vector GraphicsProceedings of the 36th Annual ACM Symposium on User Interface Software and Technology10.1145/3586183.3606751(1-14)Online publication date: 29-Oct-2023
    • (2023)Spellburst: A Node-based Interface for Exploratory Creative Coding with Natural Language PromptsProceedings of the 36th Annual ACM Symposium on User Interface Software and Technology10.1145/3586183.3606719(1-22)Online publication date: 29-Oct-2023
    • (2023)Special Interest Group on Creativity and Cultures in ComputingExtended Abstracts of the 2023 CHI Conference on Human Factors in Computing Systems10.1145/3544549.3583175(1-4)Online publication date: 19-Apr-2023
    • Show More Cited By

    View Options

    Login options

    View options

    PDF

    View or Download as a PDF file.

    PDF

    eReader

    View online with eReader.

    eReader

    Figures

    Tables

    Media

    Share

    Share

    Share this Publication link

    Share on social media