DeepAI AI Chat
Log In Sign Up

Semi-Automated SVG Programming via Direct Manipulation

by   Brian Hempel, et al.

Direct manipulation interfaces provide intuitive and interactive features to a broad range of users, but they often exhibit two limitations: the built-in features cannot possibly cover all use cases, and the internal representation of the content is not readily exposed. We believe that if direct manipulation interfaces were to (a) use general-purpose programs as the representation format, and (b) expose those programs to the user, then experts could customize these systems in powerful new ways and non-experts could enjoy some of the benefits of programmable systems. In recent work, we presented a prototype SVG editor called Sketch-n-Sketch that offered a step towards this vision. In that system, the user wrote a program in a general-purpose lambda-calculus to generate a graphic design and could then directly manipulate the output to indirectly change design parameters (i.e. constant literals) in the program in real-time during the manipulation. Unfortunately, the burden of programming the desired relationships rested entirely on the user. In this paper, we design and implement new features for Sketch-n-Sketch that assist in the programming process itself. Like typical direct manipulation systems, our extended Sketch-n-Sketch now provides GUI-based tools for drawing shapes, relating shapes to each other, and grouping shapes together. Unlike typical systems, however, each tool carries out the user's intention by transforming their general-purpose program. This novel, semi-automated programming workflow allows the user to rapidly create high-level, reusable abstractions in the program while at the same time retaining direct manipulation capabilities. In future work, our approach may be extended with more graphic design features or realized for other application domains.


Sketch-n-Sketch: Output-Directed Programming for SVG

For creative tasks, programmers face a choice: Use a GUI and sacrifice f...

Bidirectional Evaluation with Direct Manipulation

We present an evaluation update (or simply, update) algorithm for a full...

Maniposynth: Bimodal Tangible Functional Programming

Traditionally, writing code is a non-graphical, abstract, and linear pro...

Tabby: Explorable Design for 3D Printing Textures

This paper presents Tabby, an interactive and explorable design tool for...

SketchLattice: Latticed Representation for Sketch Manipulation

The key challenge in designing a sketch representation lies with handlin...

Synthesizing Queries via Interactive Sketching

We propose a novel approach to program synthesis, focusing on synthesizi...

GarmentCode: Programming Parametric Sewing Patterns

Garment modeling is an essential task of the global apparel industry and...