Constrained stroke editing for digital content

Digital content creation systems support a variety of functionality to both casual users and creative professionals in support of creation and editing of digital content. An example of this functionality relates to creation and editing of strokes. A user interface of the digital content creation system, for instance, is configured to receive an input via a cursor control device, gesture, stylus, and so forth that specifies a stroke, e.g., as a drawn freeform line. A variety of attributes are specified as part of the stroke to define display characteristics, such as a width, rounding, smoothing, color, brush type, pattern, and so forth.

In this way, the stroke as drawn in the user interface is configurable to compose a variety of digital content configurations, such as freeform sketches, objects, and so forth in ways that mimic use of real-world implements, e.g., brushes, pencils, etc. However, conventional techniques used to implement stroke functionality rely on a user's ability to provide accurate inputs and limit techniques that are usable to provide these inputs. These limitations and challenges result in slower workflows thereby hindering user interaction and operation of devices that employ this functionality.

Constrained stroke editing techniques for digital content are described. In these examples, a stroke constraint system is employed as part of a digital content creation system to manage input, editing, and erasure (i.e., removal) of strokes via a user interface as part of editing digital content. To do so, locations and/or attributes of a displayed stroke are used to constrain locations and/or attributes of an input stroke.

This Summary introduces a selection of concepts in a simplified form that are further described below in the Detailed Description. As such, this Summary is not intended to identify essential features of the claimed subject matter, nor is it intended to be used as an aid in determining the scope of the claimed subject matter.

Strokes are an integral part of digital content creation. Strokes, for instance, are employed by a digital content creation system to mimic use of real-world implements, e.g., pencils, pens, highlighters, brushes, etc. This supports a user's ability to intuitively form digital content through readily understood use of this functionality. In one example, a user input is received using a cursor control device, gesture, stylus, and so on via a user interface to input strokes as having attributes that define a variety of different display characteristics, e.g., stroke width, color, pattern, and so forth.

In conventional implementations, however, flexibility permitted by digital content creation systems to create strokes limits an ability to subsequently edit these strokes, especially in instances in which the strokes are generated as raster objects, e.g., as bitmaps. For example, conventional techniques used to change, edit, add to, or erase strokes using conventional techniques once rendered as a bitmap are limited by a user's ability to manual recreate and follow the displayed stroke in order to overwrite the stroke to make changes. Rich functionality that is continually developed to increase realism and flexibility further complicates this ability. In one such example, a user input provided via a stylus that employs pressure and tilt along with location to input a stroke further complicates a user's ability to recreate this stroke to address each of these parameters and how the parameters are input. This hinders both user interaction and operation of underlying computing devices that implement these techniques.

Accordingly, constrained stroke editing techniques for digital content are described. In these examples, a stroke constraint system is employed as part of a digital content creation system to manage input, editing, and erasure (i.e., removal) of strokes via a user interface as part of editing digital content. As a result, the techniques described herein support stroke combinations, editing, and enhanced content creation workflows that are not possible using conventional techniques and improve operation of computing devices that implement these techniques through increased input accuracy.

In one such example, a stroke editing system of a digital content creation system receives inputs via a user interface to input strokes. The inputs, for instance, are specified via a cursor control device, detected using touchscreen functionality as a gesture, through use of a stylus, and so forth to draw the strokes as lines (e.g., freeform lines, paths) in a user interface. In response, the stroke editing system stores stroke points that define a continuous series of locations of the stroke (e.g., as an array) within the digital content and attributes that define display characteristics associated with those points. The attributes, for instance, are usable to specify stroke attributes such as color, weight, style (e.g., brush type), smoothing between points, roundness, and so forth. The attributes are also configurable to include stylus attributes, such as pressure and/or tilt of a stylus used to input the strokes that are used to control amounts of the stroke attributes, e.g., opacity, width, etc. The strokes in this example are then rendered as raster objects (e.g., bitmaps) in the user interface.

106 A selection input is then received selecting one of the displayed strokes in the user interface that is to be edited, e.g., to change attributes, erase all or a portion of the stroke, and so forth. The selection input, for example, is received by a “tap” or “click” via the user interface. In response, a stroke constraint system locates a displayed stroke that is to be used as a basis for editing the digital content, e.g., based on proximity of stroke points of the strokes to the selection input, temporal proximity (e.g., based on an input order of the strokes to select a “most recent” stroke), and so forth. This functionality is also performable between layers in the digital content, e.g., the displayed stroke is in a first layer and the input stroke is in a second layer that is different than the first layer.

Once selected, a point tracking module is employed to map input points used to define an input stroke to the stroke points of the selected stroke. This is usable, for instance, as part of a one-to-many mapping, many-to-one mapping, many-to-many mapping, and so forth to address disparities in a number of stroke points used to define a displayed stroke and a number of input points used to define the input stroke. For example, a number of points used by a stylus to define a stroke are typically five to ten times greater than a number of points used as part of a gesture to define a similar stroke. This functionality is also usable to address disparities caused by differences in input speed (e.g., how fast a stroke is drawn) and corresponding number of points resulting from those differences.

In an implementation, a mode selection input is also received to specify how attributes and stroke points of a displayed stroke are to be used to guide and constrain an input stroke. Options, for instance, are displayable in a user interface and are selectable to initiate stroke constrained editing (e.g., “constrain to stroke”) as well as how the constraints are to be implemented, e.g., “match stroke attributes,” “match stylus attributes,” and so forth. These options are usable to implement a variety of different functionality.

In a first example in which “constrain to stroke” is selected, solely, locations of input points of the input stroke are mapped to locations of stroke points of the displayed stroke. This is usable to add or remove points to form the input stroke as having locations (with respect to the digital content and/or the user interface) that coincide with locations of the displayed stroke. As a result, the input stroke is displayed as an overlay over the displayed stroke. The input stroke, however, has attributes used to define display characteristics based on the input stroke, e.g., color, thickness, opacity, style, and so forth. As a result, the input stroke acts as a clone of the displayed stroke to provide edits that follow locations the displayed stroke but provide different attributes.

In a second example, selection of “constrain to stroke” along with “match stroke attributes” causes the input stroke to both follow a location and selected attributes of the displayed stroke. In a third example, use of “match stylus attributes” adds to “constrain to stroke” (along with or separate from stroke attributes) use of stored inputs of pressure and/or tilt that are usable to control amounts of respective attributes, e.g., width, opacity, and so forth. This is usable, for instance, to harmonize different input types, such as to have a subsequent gesture leverage inputs of a previous stylus input. As such, use of stylus attributes is usable to support edits that are not possible in conventional techniques due to a user's inability to accurately recreate location, pressure, and/or tilt using a stylus in successive inputs.

Similar functionality is also usable to specify erase operations using the input stroke to erase corresponding portions of the displayed stroke. This is usable to map points as previously described as well as remove and/or change attributes at these mapped points, e.g., to follow locations, stroke attributes, and/or stylus attributes. The digital content editing system, in one example, includes a control to toggle between drawing of an input stroke as constrained by a displayed stroke or erasing corresponding portions and/or attributes of a displayed stroke based on the input stroke. In this way, the techniques described herein overcome conventional limitations caused by use of rasterized strokes in a user interface that are “destructive” and thus incapable of subsequent modification using conventional techniques. Further discussion of these and other examples is included in the following sections and shown in corresponding figures.

In the following discussion, an example environment is described that employs the techniques described herein. Example procedures are also described that are performable in the example environment as well as other environments. Consequently, performance of the example procedures is not limited to the example environment and the example environment is not limited to performance of the example procedures.

1 FIG. 100 100 102 is an illustration of a digital medium environmentin an example implementation that is operable to employ constrained stroke editing techniques for digital content. The illustrated environmentincludes a computing device, which is configurable in a variety of ways.

102 102 102 102 13 FIG. The computing device, for instance, is configurable as a desktop computer, a laptop computer, a mobile device (e.g., assuming a handheld configuration such as a tablet or mobile phone), and so forth. Thus, the computing deviceranges from full resource devices with substantial memory and processor resources (e.g., personal computers, game consoles) to a low-resource device with limited memory and/or processing resources (e.g., mobile devices). Additionally, although a single computing deviceis shown, the computing deviceis also representative of a plurality of different devices, such as multiple servers utilized by a business to perform operations “over the cloud” as described in.

102 104 104 102 106 108 102 106 106 106 110 112 106 102 104 114 The computing deviceis illustrated as including a digital content creation system. The digital content creation systemis implemented at least partially in hardware of the computing device(e.g., using a processing device and computer-readable storage medium) to process and transform digital content, which is illustrated as maintained in a storage deviceof the computing device. Such processing includes creation of the digital content, modification of the digital content, and rendering of the digital contentin a user interfacefor output, e.g., by a display device. Examples of digital contentinclude digital images, digital documents, digital video, digital media, and so forth. Although illustrated as implemented locally at the computing device, functionality of the digital content creation systemis also configurable as whole or part via functionality available via the network, such as part of a web service or “in the cloud.”

104 106 116 116 118 106 118 118 106 An example of functionality incorporated by the digital content creation systemto process the digital contentis illustrated as a stroke editing system. The stroke editing systemis configured to manage input, editing, and storage of a strokeas part of digital content. A strokeis configurable as a path (e.g., as a freeform line) defined using a plurality of points. The plurality of points specifies successive and sequential locations of the strokewithin the digital content. Attributes are also definable with respect to the points to define display characteristics of the stroke at those locations. Example of attributes include color, width (e.g., weight), patterns, arrowhead, scale, alignment, rounding, gradients, brushes, transparency modes, blending modes, meshes, and so forth.

118 106 118 In one example, the strokeis generated as a raster object, e.g., a bitmap. A raster object is configurable as a matrix of pixels that are rendered for inclusion as part of the digital content. However, conventional use of raster objects to form the strokeis “destructive” in that in conventional techniques data used as a basis to define and form the raster object is no longer available once rendered. Therefore, edits to these raster objects in conventional techniques are forced to manually mimic how the raster object was input, which is difficult if not impossible to be performed in complex scenarios, e.g., through use of a stylus to recreate tilt and pressure values along with accurate recreation of points defining locations of an edit.

116 120 118 110 122 124 110 120 110 Accordingly, the stroke editing systemincludes a stroke constraint systemthat is representative of functionality to aid strokeediting and erasure. In the illustrated user interface, for instance, a first strokeand a second strokeare drawn and displayed in the user interface. In order to support edits as part of the strokes, the stroke constraint systemsupports a variety of functionality to constrain subsequent input strokes based on strokes already displayed in the user interface.

126 120 122 128 122 130 124 132 124 120 9 FIG. A first subsequent stroke, for instance, is input through use of the stroke constraint systemover the first stroke, which changes both a color and width. A second subsequent stroke, on the other hand, matches width attributes of the first strokebut changes the color. A similar edit is viewable by a third subsequent strokeinput as overlaying the second strokethat matches a width and location but changes a color. A fourth subsequent strokehas a width that is less than the width of the second stroke. Similar techniques are also usable to erase portions of the displayed strokes, further discussion of which is described in relation to. In this way, the stroke constraint systemovercomes the challenges of conventional techniques to improve user interaction and operation of computing devices that implement these techniques, further discussion of which is included in the following sections and shown in corresponding figures.

In general, functionality, features, and concepts described in relation to the examples above and below are employed in the context of the example procedures described in this section. Further, functionality, features, and concepts described in relation to different figures and examples in this document are interchangeable among one another and are not limited to implementation in the context of a particular figure or procedure. Moreover, blocks associated with different representative procedures and corresponding figures herein are applicable together and/or combinable in different ways. Thus, individual functionality, features, and concepts described in relation to different example environments, devices, components, figures, and procedures herein are usable in any suitable combinations and are not limited to the particular combinations represented by the enumerated examples in this description.

Constrained Stroke Editing

1 11 FIGS.- 2 9 FIGS.- 10 11 FIGS.and 1000 1100 The following discussion describes techniques that are implementable utilizing the previously described systems and devices. Aspects of each of the procedures are implemented in hardware, firmware, software, or a combination thereof. The procedures are shown as a set of blocks that specify operations performed by one or more devices and are not necessarily limited to the orders shown for performing the operations by the respective blocks. In portions of the following discussion, reference will be made to. In the following discussion, reference is made in parallel between the systems and examples ofand flow diagrams of the procedures,of.

2 FIG. 1 FIG. 200 116 1002 202 110 112 112 depicts a systemin an example implementation showing operation of the stroke editing systemofin greater detail as employing a stroke input module to input a stroke rendered as a raster object and also store stroke data that is used as a basis to render the stroke. A stroke input is received via a user interface (block). A stroke input module, for instance, is configured to receive the stroke input as part of detecting interaction with a user interfacedisplayed by a display device. The stroke input is detectable in a variety of ways, examples of which include a cursor-control device (e.g., mouse, trackpad), gesture (e.g., detected using touchscreen functionality of the display device), stylus (e.g., active or passive), and so forth.

1004 1006 204 112 The stroke is rendered as a raster object (block) and displayed as part of a plurality of strokes in the user interface (block). A rendering engine, for instance, takes stroke data defining locations and attributes of the strokes and converts the stroke data into a raster object, e.g., as a bitmap. To do so, the stroke data, is rendered to a display buffer for display by the display device, e.g., as a bitmap. In conventional techniques, as previously described, rendering of the stroke is destructive.

106 118 A raster object, for instance, is configurable as a matrix of pixels that are rendered for inclusion as part of the digital content. Because of this, however, use of raster objects to form the strokeis “destructive,” in that, data used as a basis to form the raster object is no longer available once rendered in conventional techniques. Therefore, edits to these raster objects are forced to mimic input of the raster object as previously described, which is difficult if not impossible to be performed manually in complex scenarios.

202 1008 118 206 208 106 118 210 208 210 212 In the techniques described herein, however, the stroke input moduleis configured to store stroke data (block) that provides a definition and basis for “how” the stroke is rendered to create the raster object. The strokein the illustrated example is associated with a stroke ID, pointsthat define locations (e.g., coordinates) along the stroke within the digital contentand thus define a shape of the stroke, and attributesthat define display characteristics, e.g., at the locations defined by the points. A first example of the attributesinclude stroke attributesthat define display characteristics such as width (e.g., thickness), rounding, smoothing, color, brush type, pattern, gradient, opacity, and so forth.

210 214 In another example, the attributesalso include stylus attributeswhich define how an implement provided the stroke inputs. To support this functionality, the stylus is configurable using active or passive functionality through reliance on “outside” sensors (e.g., a touchscreen) and/or use of sensors internal to the stylus, respectively. A stylus, for instance, is configurable to support pressure inputs, e.g., to control opacity, thickness, and so forth of corresponding attributes. The stylus is also configurable to support tilt attributes, e.g., which define an angle in three-dimensional space, in relation to a surface, and so forth.

208 208 4 FIG. In these examples, the stroke data has a complexity corresponding to a number of pointsin the stroke, and thus improves data storage and processing efficiency as opposed to use of the raster object. Further, in an implementation the pointsare stored after processing (e.g., smoothing) instead of using the points directly from the point tracking module of. This supports improved display characteristics involving subsequent edits based on these points as further described below.

In an implementation, stroke rendering is performed in two stages. The first stage is performed in real time as a stroke input is received as an approximation of the stroke. Once completed (e.g., completion of the gesture, release of cursor control device button), a final rendering is performed, e.g., to incorporate smoothing, curvature, and other considerations.

In another example, undo and redo operations are supported by maintaining the input positions and attributes, e.g., as stored in an array. This data is usable by an undo/redo engine to remove or redo portions of the input stroke and further defined below.

3 FIG. 1 FIG. 5 9 FIGS.- 300 302 304 1102 304 110 306 308 depicts a systemin an example implementation showing operation of a stroke constraint module ofin greater detail. To begin in this example, a mode and selection input modulereceives a selection input(block). The selection inputis detectable as a tap, drag, and so forth using a cursor control device, gesture, stylus, etc. through interaction with the user interface. A mode inputis also receivable through selection of mode representationsthat represent types of modes to be used as part of constraining an input stroke, e.g., to match stroke attributes, match stylus attributes, toggle between draw and erase operations, and so forth as further described in relation to.

304 302 310 310 304 312 314 310 320 316 304 310 318 2 FIG. The selection inputis then provided by the mode and selection input moduleto a stroke identification module. The stroke identification moduleis configured to receive the selection inputalong with an input strokedefined using input points. Based on these inputs, the stroke identification moduleidentifies candidate strokesfrom a plurality of displayed strokesbased on the selection input. This is performed by the stroke identification moduleusing data stored in a storage devicethat defines those strokes for rendering as previously described in relation to.

316 322 324 316 304 1104 320 310 314 312 324 316 The displayed stroke, for instance, is associated with a stroke IDand is defined using stroke points. To identify which of the plurality of displayed strokesbased on the selection input(block) are candidate strokes, the stroke identification moduleexamines input pointsof the input stroke, e.g., in comparison with the stroke pointsof the displayed strokes.

4 FIG. 3 FIG. 400 310 320 304 310 402 404 404 324 316 1106 110 402 314 312 1108 depicts a systemin an example implementation showing operation of the stroke identification moduleofin greater detail as identifying candidates strokesbased on a selection input. The stroke identification moduleincludes a point tracking moduleand a stroke location module. The stroke location moduleobtains stroke pointsdefining a location of a displayed stroke(block) in the user interface. The point tracking modulereceives a plurality of input points, via the user interface, defining an input stroke(block).

304 316 320 314 312 404 320 406 408 The selection inputis used as a basis to initiate the determination of which of the displayed strokesqualify as candidate strokes. This is performable as a dedicated input (e.g., a tap, drag) or as one or more initial input pointsof the input stroke. A variety of considerations are usable by the stroke location moduleto select the candidate strokes, examples of which are illustrated as a distance determination moduleand a temporal determination module.

406 324 304 408 324 316 324 316 120 404 324 316 320 326 The distance determination moduleis configured to determine which stroke pointsare closest (e.g., based on Euclidean square distance) to the selection input. The temporal determination moduleis configured to select stroke pointsand corresponding displayed strokesbased on temporal considerations, e.g., based on an order of how recent the stroke pointsand corresponding displayed strokesare input into the stroke constraint system. These considerations are used by the stroke location moduleto weigh the stroke pointsand corresponding displayed strokesfor selection as candidate strokes, which are then output to a point mapping module.

326 1110 326 328 330 328 324 320 314 324 The point mapping moduleis configured to edit locations of the input points as constrained based on location of the stroke points of the displayed stroke (block). To do so, the point mapping moduleutilizes a direction finding moduleand one or more thresholds. The direction finding moduleis configured to determine a direction in an ordering of the stroke pointsof the candidate strokes(e.g., ordered in an array) and progress through the ordering as part of mapping input pointsto the stroke points.

332 328 314 304 106 332 106 324 304 406 102 324 332 k k A content size threshold, for instance, is used by the direction finding moduleand is based on a distance of the stroke pointsto the selection inputin relation to an overall display size of the digital content. In one example, the content size thresholdis calculated as a digital contentsize dependent threshold for square distance comparison as follows:Content_size_threshold=std::max(((int)self.imageview.contentsize.width/PixelDimension)*((int)self.imageView.contentSize.height/PixelDimension),1500)where “kPixelDimension=50” in one example is experimentally determined. Each stroke pointthat is associated with a distance (e.g., as a Euclidean square distance) from the selection inputgreater than this threshold is not further processed by the distance determination module, thereby conserving processing resources and improving computing deviceoperation. Otherwise, the stroke pointswithin this content size thresholddistance remain as candidates for further processing.

314 328 324 316 332 304 324 328 330 314 334 336 338 An initial set of the input pointsare used by the direction finding moduleto determine a direction in relation to an ordering of stroke pointsof corresponding displayed strokesto improve mapping accuracy. Continuing with the previous example, the content size thresholdis used to compare Euclidean square distances between the selection inputand the stroke points. In an implementation, a multiplication factor is used to address differences in an amounts of points based on whether an input source is a stylus or cursor control device versus a gesture. The direction finding modulethen employs one or more thresholdsto determine the direction based on the input points. In a first example, a threshold is set for a number of minimum iterationsused to determine the distance, e.g., “kMinIterations.” In a second example, a difference in a number of strokesis defined as “abs(diff in number of forward minus number of reverse strokes.” In a third example, a difference in number of pointsvia closeness is utilized.

328 324 320 322 320 320 1 To do so, the direction finding modulemaintains a first array which stores the stroke pointsof candidate strokesby stroke IDand defines start and end indices of corresponding candidate strokeswithin the array. Once a displayed stroke is selected from the candidate strokes, a start and end index are determined, which is referred to as “Pass” in this example.

328 324 314 314 314 334 334 336 338 328 312 328 1 314 324 In an implementation, the direction finding moduleselects stroke pointsthat are closest to the input pointsin both directions, e.g., that are within initial start and end positions. In other words, a current input pointis compared with corresponding end points, and one of the end points is updatable with an index move as input pointsare collected within the minimum iterations. If the minimum iterationshave been reached and neither of the difference in number of strokesor difference in number of pointsthreshold criteria are met, the direction finding modulecontinues, e.g., as the input strokeis likely stationary. Therefore, the direction finding moduleexecutes Passuntil enough input pointsare received to find a valid direction and determines a start and end of an order of the stroke pointsbased on that direction.

2 328 324 314 324 324 316 326 314 324 316 328 324 314 In a second pass (i.e., Pass), the direction finding modulethen determines closeness to respective stroke pointsand precedes in that order to map the input pointsto the stroke points. The stroke pointsfor a selected displayed strokes, for instance, are ordered sequentially within an array. Therefore, the point mapping modulethen maps the input pointssequentially to the stroke pointsof the selected displayed stroke, i.e., proceeds one-by-one or one-to-many based on closeness in a direction determined by the direction finding module. In an instance in which a next stroke pointin the array is not closest to a respective input points, that point is ignored and thus protects against visual artifacts and improves accuracy.

314 324 312 1112 340 342 314 324 344 204 312 1114 312 316 110 Once the input pointsare edited based on the stroke points, at least one attribute associated with the input strokeis mapped to the edited locations (block) by a point-to-attribute mapping module. This results in an output of edited pointshaving a change in location of the input pointsbased on the stroke pointsand attributes, which are then output for rendering by the rendering engineand displayed as the input stroke(block). In an implementation, this causes the input stroketo be displayed as overlapping the displayed strokein the user interface. This is usable to support a variety of functionality.

302 306 308 346 316 312 348 350 352 As previously described, the mode and selection input modulesupport a mode inputthrough selection of one or more mode representations. The mode selections are usable by a mode mapping moduleto specify how stroke data stored for the displayed strokesis used in conjunction with the input stroke. Illustrated examples of this functionality are represented as a stroke attribute module, stylus attribute module, and stroke erase module, operation of which are further described in the following discussion.

5 FIG. 500 500 312 502 504 506 508 510 312 110 depicts an example of a brush settings user interfaceoperable to receive user input to set attributes and select modes in support of constrained stroke editing. The brush setting user interfaceincludes representations that are selectable via a slider control to specify amounts of respective attributes to be used for an input stroke. Examples of this functionality include blend mode, roundness, angle, flow,, and smoothing. Other examples are also contemplated, including attributes described above for opacity, pattern, brush type, and so forth. In this way, user inputs are configured to specify display characteristics of the input stroketo be rendered and displayed in the user interface.

500 308 314 312 324 316 512 514 112 516 518 520 The brush settings user interfacealso includes mode representationsthat are selectable to select modes that control how input pointsof an input strokeare constrained based on stroke pointsand associated attributes of a displayed stroke. Examples of this include functionality to specify an input type (e.g., pressure) is used to control amounts of corresponding attributes, e.g., to “use pressure for size”and/or “use pressure for opacity”as detected using a stylus, touchscreen functionality of the display device, and so forth. Additional representations include functionality to initiate the “constrain to stroke”functionality. This functionality is usable in conjunction with functionality to “match stroke attributes”and “match stylus attributes”.

6 FIG. 600 516 600 602 604 depicts an example implementationof constrained stroke editing in which constrain to strokefunctionality is selected. This example implementationis illustrated using first and second stages,.

602 606 608 110 112 516 512 610 612 606 608 At the first stage, first and second displayed strokes,are rendered and displayed in a user interfaceby a display device. Inputs are received that select “constrain to stroke”as well as “use pressure for size”. Accordingly, first and second input strokes,are constrained to locations of the first and second displayed strokes,having sizes (i.e., thickness, width) based on an amount or pressure detected, e.g., from a stylus.

610 606 612 608 110 For the first input stroke, this causes a width that overwrites an underlying first displayed strokeso that it is no longer viewable. On the other hand, the second input strokehas a smaller width in comparison with the second displayed strokesuch that these strokes are viewable together in the user interface.

7 FIG. 6 FIG. 700 516 518 700 702 704 depicts an example implementationof constrained stroke editing in which constrain to strokefunctionality is selected along with match stoke attributesfunctionality. This example implementationis also illustrated using first and second stages,. This functionality operates as an extension to the previous example ofby supporting a user's ability to match stroke attributes (e.g., brush size, opacity, roundness, flow, etc.) while changing other attributes, such as brush type and color.

702 706 708 706 706 710 110 704 As shown at the first stage, a selection input is received to select a first displayed stroke. A user inputis then received (e.g., a threshold distance away from the selected stroke) which supports output of a menu to specify particular attributes of the first displayed stroke. The menu, for instance, includes values of attributes of the first displayed stroke, which are then changeable via a subsequent user input, e.g., to change a color. The input strokeis then rendered and displayed in the user interfacebased on these selections as shown at the second stage.

8 FIG. 800 516 520 800 802 804 520 214 118 depicts an example implementationof constrained stroke editing in which constrain to strokefunctionality is selected along with match stylus attributesfunctionality. This example implementationis likewise illustrated using first and second stages,. Match stylus attributesfunctionality is usable to constrain inputs to inputs that are stored as stylus attributesas part of stroke data of the stroke. This supports an ability to leverage previous input types supported by a particular type of implement, even if that functionality is not currently available.

802 806 520 808 804 810 At the first stage, a displayed strokeis rendered that is input using a stylus, and as such tilt and pressure parameters are used to specify amounts of respective attributes used to define the stroke. By selecting match stylus attributes, these amounts and corresponding attributes are made available for generating an input stroke. This is shown in the second stageusing a gesture, which as previously describe is typically implemented as having decreased accuracy in comparison with a stylus. In this way, functionality of the constrained stroke editing system is expanded and improves corresponding device operation to scenarios that are otherwise not supported by underlying functionality of the computing device.

9 FIG. 900 516 900 902 904 depicts an example implementationof constrained stroke editing in which constrain to strokefunctionality is selected to erase portions of a displayed stroke. This example implementationis illustrated using first and second stages,. Use of an erase operation expands functionality of the previous edit operations by support an ability to erase portions of displayed strokes and/or adjust attributes of those strokes.

910 In an implementation, eraser settingsare implemented as a type of brush functionality in that stroke and stylus attributes are used. But in this instance, erasure is used to replace pixels with “empty” pixels which are constrained based on the attributes of the constrained strokes. In this way, the techniques described herein are configured to leverage attributes of the constrained strokes, automatically and without user intervention. Further, these techniques are also usable as part of creating new art forms through individualized adjustment of these attributes, e.g., the attributes are individually user selectable to achieve desired results as part of replacing the pixels as part of an erase operation.

902 906 908 906 110 910 As shown at the first stage, a displayed strokeand an input strokethat is constrained by the displayed strokeis output in the user interface. Erase functionality is initiated (e.g., as a gestureas part of a keyboard-less modifier) as a transient tool to toggle between a constrained edit mode and a constrained erase mode.

904 912 110 518 520 As shown at the second stage, this causes output of an erase representation(e.g., as a thin vector) along a selected portion of the stroke to be erased. This provides feedback to indicate selection of corresponding portions of corresponding strokes in the user interface. When in the erase mode, the match stroke attributesand match stylus attributesfunctionality is leveraged to remove the corresponding attributes and respective amounts of those attributes. Other examples are also contemplated, such as to support edits through attribute and point removal.

Functionality used to support erase operations differs from the functionality used to support the brush edit operations above, e.g., attributes such as opacity and flow are not matched otherwise the erase operation cannot be performed. Accordingly, in one example constrained stroke editing techniques when used as part of an edit operation are usable to match each of the attributes of the displayed stroke in order to “set it back” to previous attributes after the constrained stroke is completely.

Another example is also implemented in which the erase operations are configured to change one or more attributes of the displayed stroke. As described above, a selection input (e.g., a first tap) on a displayed stroke causes selection of a displayed stroke. Another input (e.g., another tap) causes output of representations and values of each of the attributes of that stroke.

316 324 In an implementation example, a start and end index of each displayed strokealong with stroke pointsare stored in a stroke-start-indices stack, attribute information for respective stroke points is stored in another stack. Because constrained strokes are implemented as strokes over existing strokes, the stroke points and corresponding attribute information is not stored in one example to conserve data storage resources and protect against conflicts, although other examples involving storage are also contemplated.

120 In an example of an edit operation, when an input stroke is received as part of an erase operation, a start and end index pair are added to the above array. On “undo,” a top item is taken out from the stroke-start-indices stack and added to a stroke-start-indices-undone stack. On redo, a top of the stroke-start-indices-undone stack is taken out and pushed into a stroke-start-indices stack. However, to optimize, constrained stroke relation point data is not stored as described above. The stroke constraint systemmaintains undo/redo states to history data even for constrained strokes, e.g., both edits and erases. This is performed by adding a dummy value pair {−1, +1} of start and end indices into the stroke-start-indices stack when a constrained input stroke is added that is usable to define the stroke for rendering by a rendering engine.

106 106 120 In an implementation, support is also added beyond a current editing session to support leveraging of edits performed over a lifetime of the digital content. Accordingly, other events (e.g., points and attributes) are added to an undo/redo stack in a core of the digital contentby the stroke constraint systemfor use by an undo/redo engine, which are configurable to include a dummy value pair for these also. Therefore, each time an input stroke is received in this example, a stroke-start-indices-temp array is created. On a “do” (i.e., edit) operation, a check is made as to whether this is not empty and is added to stroke-start indices. If empty, dummy strokes are added. A variety of other examples are also contemplated.

12 FIG. 1200 1202 1204 1206 depicts a procedurein an example implementation of an erase operation. The erase operation is a type of edit operation in which pixels of a displayed stroke are removed or further edited while being constrained using the techniques previously described. Accordingly, a selection input is also received in this example as selecting a displayed stroke in a user interface (block). In response, stroke points defining locations of the displayed stroke in the user interface are obtained (block) and a plurality of input points are received via the user interface, the input points defining an input stroke (block).

1208 5 FIG. In this example, however, pixels are erased that are included as part of the displayed stroke in the user interface based on the plurality of input points as constrained based on locations defined by the stroke points of the displayed stroke (block). To do so, brush techniques similar to those above are used to display “empty” pixels that do not have display attributes, e.g., colors, gradients, and so forth, that are constrained based on the attributes of the displayed stroke. In this way, the techniques described herein overcome challenges involved in manual conventional techniques. Further, as described above, new art forms are support through display of an option in the user interface to specify which attributes of a displayed stroke are to be matched, an example of which is shown in.

Example System and Device

13 FIG. 1300 1302 130 1302 illustrates an example system generally atthat includes an example computing devicethat is representative of one or more computing systems and/or devices that implement the various techniques described herein. This is illustrated through inclusion of the stroke constraint system. The computing deviceis configurable, for example, as a server of a service provider, a device associated with a client (e.g., a client device), an on-chip system, and/or any other suitable computing device or computing system.

1302 1304 1306 1308 1302 The example computing deviceas illustrated includes a processing device, one or more computer-readable media, and one or more I/O interfacethat are communicatively coupled, one to another. Although not shown, the computing devicefurther includes a system bus or other data and command transfer system that couples the various components, one to another. A system bus can include any one or combination of different bus structures, such as a memory bus or memory controller, a peripheral bus, a universal serial bus, and/or a processor or local bus that utilizes any of a variety of bus architectures. A variety of other examples are also contemplated, such as control and data lines.

1304 1304 1310 1310 The processing deviceis representative of functionality to perform one or more operations using hardware. Accordingly, the processing deviceis illustrated as including hardware elementthat is configurable as processors, functional blocks, and so forth. This includes implementation in hardware as an application specific integrated circuit or other logic device formed using one or more semiconductors. The hardware elementsare not limited by the materials from which they are formed or the processing mechanisms employed therein. For example, processors are configurable as semiconductor(s) and/or transistors (e.g., electronic integrated circuits (ICs)). In such a context, processor-executable instructions are electronically-executable instructions.

1306 1312 1312 1312 1312 1306 The computer-readable storage mediais illustrated as including memory/storage. The memory/storagerepresents memory/storage capacity associated with one or more computer-readable media. The memory/storageincludes volatile media (such as random access memory (RAM)) and/or nonvolatile media (such as read only memory (ROM), Flash memory, optical disks, magnetic disks, and so forth). The memory/storageincludes fixed media (e.g., RAM, ROM, a fixed hard drive, and so on) as well as removable media (e.g., Flash memory, a removable hard drive, an optical disc, and so forth). The computer-readable mediais configurable in a variety of other ways as further described below.

1308 1302 1302 Input/output interface(s)are representative of functionality to allow a user to enter commands and information to computing device, and also allow information to be presented to the user and/or other components or devices using various input/output devices. Examples of input devices include a keyboard, a cursor control device (e.g., a mouse), a microphone, a scanner, touch functionality (e.g., capacitive or other sensors that are configured to detect physical touch), a camera (e.g., employing visible or non-visible wavelengths such as infrared frequencies to recognize movement as gestures that do not involve touch), and so forth. Examples of output devices include a display device (e.g., a monitor or projector), speakers, a printer, a network card, tactile-response device, and so forth. Thus, the computing deviceis configurable in a variety of ways as further described below to support user interaction.

Various techniques are described herein in the general context of software, hardware elements, or program modules. Generally, such modules include routines, programs, objects, elements, components, data structures, and so forth that perform particular tasks or implement particular abstract data types. The terms “module,” “functionality,” and “component” as used herein generally represent software, firmware, hardware, or a combination thereof. The features of the techniques described herein are platform-independent, meaning that the techniques are configurable on a variety of commercial computing platforms having a variety of processors.

1302 An implementation of the described modules and techniques is stored on or transmitted across some form of computer-readable media. The computer-readable media includes a variety of media that is accessed by the computing device. By way of example, and not limitation, computer-readable media includes “computer-readable storage media” and “computer-readable signal media.”

“Computer-readable storage media” refers to media and/or devices that enable persistent and/or non-transitory storage of information (e.g., instructions are stored thereon that are executable by a processing device) in contrast to mere signal transmission, carrier waves, or signals per se. Thus, computer-readable storage media refers to non-signal bearing media. The computer-readable storage media includes hardware such as volatile and non-volatile, removable and non-removable media and/or storage devices implemented in a method or technology suitable for storage of information such as computer readable instructions, data structures, program modules, logic elements/circuits, or other data. Examples of computer-readable storage media include but are not limited to RAM, ROM, EEPROM, flash memory or other memory technology, CD-ROM, digital versatile disks (DVD) or other optical storage, hard disks, magnetic cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices, or other storage device, tangible media, or article of manufacture suitable to store the desired information and are accessible by a computer.

1302 “Computer-readable signal media” refers to a signal-bearing medium that is configured to transmit instructions to the hardware of the computing device, such as via a network. Signal media typically embodies computer readable instructions, data structures, program modules, or other data in a modulated data signal, such as carrier waves, data signals, or other transport mechanism. Signal media also include any information delivery media. The term “modulated data signal” means a signal that has one or more of its characteristics set or changed in such a manner as to encode information in the signal. By way of example, and not limitation, communication media include wired media such as a wired network or direct-wired connection, and wireless media such as acoustic, RF, infrared, and other wireless media.

1310 1306 As previously described, hardware elementsand computer-readable mediaare representative of modules, programmable device logic and/or fixed device logic implemented in a hardware form that are employed in some embodiments to implement at least some aspects of the techniques described herein, such as to perform one or more instructions. Hardware includes components of an integrated circuit or on-chip system, an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA), a complex programmable logic device (CPLD), and other implementations in silicon or other hardware. In this context, hardware operates as a processing device that performs program tasks defined by instructions and/or logic embodied by the hardware as well as a hardware utilized to store instructions for execution, e.g., the computer-readable storage media described previously.

1310 1302 1302 1310 1304 1302 1304 Combinations of the foregoing are also be employed to implement various techniques described herein. Accordingly, software, hardware, or executable modules are implemented as one or more instructions and/or logic embodied on some form of computer-readable storage media and/or by one or more hardware elements. The computing deviceis configured to implement particular instructions and/or functions corresponding to the software and/or hardware modules. Accordingly, implementation of a module that is executable by the computing deviceas software is achieved at least partially in hardware, e.g., through use of computer-readable storage media and/or hardware elementsof the processing device. The instructions and/or functions are executable/operable by one or more articles of manufacture (for example, one or more computing devicesand/or processing devices) to implement techniques, modules, and examples described herein.

1302 1314 1316 The techniques described herein are supported by various configurations of the computing deviceand are not limited to the specific examples of the techniques described herein. This functionality is also implementable all or in part through use of a distributed system, such as over a “cloud”via a platformas described below.

1314 1316 1318 1316 1314 1318 1302 1318 The cloudincludes and/or is representative of a platformfor resources. The platformabstracts underlying functionality of hardware (e.g., servers) and software resources of the cloud. The resourcesinclude applications and/or data that can be utilized while computer processing is executed on servers that are remote from the computing device. Resourcescan also include services provided over the Internet and/or through a subscriber network, such as a cellular or Wi-Fi network.

1316 1302 1316 1318 1316 1300 1302 1316 1314 The platformabstracts resources and functions to connect the computing devicewith other computing devices. The platformalso serves to abstract scaling of resources to provide a corresponding level of scale to encountered demand for the resourcesthat are implemented via the platform. Accordingly, in an interconnected device embodiment, implementation of functionality described herein is distributable throughout the system. For example, the functionality is implementable in part on the computing deviceas well as via the platformthat abstracts the functionality of the cloud.

1316 In implementations, the platformemploys a “machine-learning model,” which refers to a computer representation that can be tuned (e.g., trained) based on inputs to approximate unknown functions. In particular, the term machine-learning model can include a model that utilizes algorithms to learn from, and make predictions on, known data by analyzing training data to learn to generate outputs that reflect patterns and attributes of the training data. Examples of machine-learning models include neural networks, convolutional neural networks (CNNs), long short-term memory (LSTM) neural networks, decision trees, and so forth.

Although the invention has been described in language specific to structural features and/or methodological acts, it is to be understood that the invention defined in the appended claims is not necessarily limited to the specific features or acts described. Rather, the specific features and acts are disclosed as example forms of implementing the claimed invention.