Editable AI: Mixed Human-AI Authoring of Code Patterns

TL;DR

This paper introduces a mixed human-AI approach for creating, editing, and enforcing HTML code patterns to improve developer efficiency and document consistency.

Contribution

It presents a novel technique that learns HTML patterns from documents, allowing developers to view, edit, and use these patterns for autocomplete and validation.

Findings

Developers edited and corrected HTML documents more quickly.

The technique helped developers create and maintain consistent patterns.

Participants found the tool useful for authoring HTML documents.

Abstract

Developers authoring HTML documents define elements following patterns which establish and reflect the visual structure of a document, such as making all images in a footer the same height by applying a class to each. To surface these patterns to developers and support developers in authoring consistent with these patterns, we propose a mixed human-AI technique for creating code patterns. Patterns are first learned from individual HTML documents through a decision tree, generating a representation which developers may view and edit. Code patterns are used to offer developers autocomplete suggestions, list examples, and flag violations. To evaluate our technique, we conducted a user study in which 24 participants wrote, edited, and corrected HTML documents. We found that our technique enabled developers to edit and correct documents more quickly and create, edit, and correct documents more successfully.