screensdesign

Brush controls: preview the next stroke

Ten recorded drawing tools show brush families, size, opacity and presets. Make tool selection and future stroke behavior understandable without altering earlier work.

A brush picker should help someone predict the next mark. A tool name and a circular size indicator are not enough when two brushes have different edges, textures or responses. Show the selected brush, its important settings and a preview that makes the effect understandable before the person draws over their work.

Keep the active tool separate from the strokes already on the canvas. Changing a pen’s size might affect future input, while selecting an existing vector stroke could edit earlier content. Those are different tasks. The interface needs to say which one it is doing rather than relying on the same slider for both without context.

The ten recorded tools below range from simple photo doodles to configurable sketching brushes. Their controls show available choices, not proof of stylus accuracy or drawing quality. Use the examples to define selection, parameter scope and persistence, then test actual strokes with the input methods and canvas model your product supports.

Keep brush identity visible beside its parameters

Pixomatic separates numbered brush presets from Brush Size, Opacity and Color tools. Concepts names Dynamic Pen and provides a stroke preview above size, opacity and smoothing controls. The second surface makes the relationship between a particular tool and its adjustable behavior especially explicit.

Retain the selected brush name or recognizable sample when opening a deeper settings panel. Otherwise someone can adjust a slider and forget whether it belongs to a pen, marker or eraser. If each tool remembers different values, reflect those values when switching tools rather than briefly showing a previous brush’s settings.

Do not pretend every parameter has identical meaning across brush families. A texture brush and a uniform line can respond differently to opacity and size. Show a relevant sample and use labels that match the actual rendering model. A product-specific smoothing control should not be described as a universal guarantee of cleaner drawing.

Pixomatic - AI Photo BG Eraser: Pixomatic separates brush presets from size, opacity and color adjustments.
Pixomatic - AI Photo BG EraserPixomatic separates brush presets from size, opacity and color adjustments.
Concepts: Concepts names the tool and previews its stroke above distinct size, opacity and smoothing controls.
ConceptsConcepts names the tool and previews its stroke above distinct size, opacity and smoothing controls.

Distinguish tool choice from a parameter’s current value

PhotoCut shows several brush tips in a floating panel with a selected variant. SNOW combines brush-style thumbnails, a numeric size and a separate color row. Selection belongs to the chosen brush; the number belongs to one property of that brush. The two states should not compete for the same ambiguous highlight.

Make a brush change understandable without forcing a test stroke onto the document. A temporary scratch area or representative sample can help when supported. If the product applies a style immediately to existing selected content, label that mode separately from choosing the tool for future drawing.

Keep numeric labels close to their controls. An unlabeled slider beside a stroke sample can mean size, opacity, hardness or another property. Do not ask users to infer the meaning solely by dragging and watching the canvas. Where the product only offers a simple intensity control, name that control honestly rather than inventing a more precise physical unit.

PhotoCut - AI Photo Editor: PhotoCut marks a selected brush tip within a compact floating tool panel.
PhotoCut - AI Photo EditorPhotoCut marks a selected brush tip within a compact floating tool panel.
SNOW - AI Profile: SNOW keeps brush-style selection, size feedback and color choices in distinct rows.
SNOW - AI ProfileSNOW keeps brush-style selection, size feedback and color choices in distinct rows.

Use stroke previews to make similar names useful

Creatic lists named brush variants with individual stroke samples, including hard and soft round families. Leto exposes a small thickness selector and a wider row of drawing implements around the composition. A large catalog and a compact quick-access set need different navigation, but both should preserve the active tool’s identity.

Give samples a consistent scale and background so they can be compared meaningfully. A pale brush on a pale preview can appear missing. A sample that changes both color and thickness for every preset makes it harder to identify the effect of the brush itself. Keep names available for accessibility and for returning to a known tool.

Separate browsing a family from choosing a brush when the catalog has several levels. Opening Basic Round should not necessarily replace the current tool until a concrete preset is chosen. If access or an asset download is required, explain it before pretending the brush is ready. Preserve the previous usable tool when loading fails.

Creatic: Graphic Design Editor: Creatic pairs descriptive brush-family names with visual stroke samples.
Creatic: Graphic Design EditorCreatic pairs descriptive brush-family names with visual stroke samples.
Leto: Font for Instagram Story: Leto combines a compact thickness control with several recognizable drawing implements.
Leto: Font for Instagram StoryLeto combines a compact thickness control with several recognizable drawing implements.

Choose simple sizes or precise values deliberately

Paper presents Small, Medium and Large with one choice selected. Graphic Design & Logo Creator shows several brush variations and a floating slider over a composition. Simple sizes can reduce setup work, while precise controls can support repeatable marks. Neither approach is automatically more professional or more usable.

Match precision to the drawing task and explain its frame of reference. A size can refer to canvas units, output pixels or a screen-relative preview. Zooming should not silently change the stored meaning of a selected tool unless that behavior is intentional and communicated. Test the same stroke before and after zooming to expose the difference.

Where exact reuse matters, provide a supported numerical or preset route rather than requiring a perfectly placed drag. Where only three sizes are offered, make the visible samples representative. Do not attach a number to a slider if that number is merely decorative and cannot be restored consistently after switching tools or reopening the project.

Paper: Sketch, Draw & Create: Paper uses three named sizes with a clear selected state instead of exposing a continuous numerical control.
Paper: Sketch, Draw & CreatePaper uses three named sizes with a clear selected state instead of exposing a continuous numerical control.
Graphic Design & Logo Creator.: Graphic Design & Logo Creator keeps brush variants and an adjustment slider close to the live composition.
Graphic Design & Logo Creator.Graphic Design & Logo Creator keeps brush variants and an adjustment slider close to the live composition.

Keep erasing and clearing distinct from changing the brush

LINE Camera exposes Brush, Size, Color, Erase and Clear All as different actions. Edit Up names Size and Opacity and retains a local Done action for its drawing tools. These controls need different consequences even when they share the same compact panel.

An eraser can use a brush-like shape without being a color choice. Keep its active state explicit and define whether it removes strokes, changes transparency or edits the underlying image. Clear All needs an even clearer scope: current stroke draft, drawing layer or the entire composition. Avoid making it discard unrelated photographs and text.

Changing a tool should not commit or erase an unfinished stroke unexpectedly. Define the boundary between finishing a gesture and applying local drawing edits. If Done commits a drawing layer, preserve undo or the editable source according to the project model. A person experimenting with a larger brush should not lose earlier work simply by closing the panel.

LINE Camera - Photo editor: LINE Camera names erasing and Clear All separately from brush size and color.
LINE Camera - Photo editorLINE Camera names erasing and Clear All separately from brush size and color.
Edit Up: AI Photo Video Editor: Edit Up labels Size and Opacity explicitly and provides a distinct drawing confirmation.
Edit Up: AI Photo Video EditorEdit Up labels Size and Opacity explicitly and provides a distinct drawing confirmation.

Separate tool preferences from document operations

Represent brush identity and effective parameters independently from the document’s recorded strokes. Store each stroke with the settings needed to reproduce it. A later preference change should not rewrite old marks accidentally. If the editor supports editable strokes, make that a separate selection operation rather than treating every tool adjustment as a document-wide transformation.

Define whether size, opacity and other properties are remembered globally, per brush or per project. Switching tools should resolve those rules predictably. Preserve stable preset identities even when a catalog is reordered. If a custom brush is unavailable on another device, identify the missing dependency instead of silently substituting a different mark under the old name.

Handle pointer input, cancellation and undo coherently. A stroke interrupted by a gesture or app transition should follow a defined preservation rule. Do not save half a gesture as many unrelated undo entries. Test supported finger and stylus behavior, including pressure or tilt only where the actual tool provides those capabilities, rather than inferring support from an attractive preview.

Compare the promised mark with a real stroke

Choose a brush, adjust its size, draw, switch to another tool and return. Ask the tester what the next stroke will look like before drawing it. Repeat on a contrasting background and after zooming. A successful picker supports prediction and recovery, not merely rapid movement through a catalog.

Check an empty drawing, an existing selected stroke and a mixed photo composition. Test Clear All and undo without putting valuable work at risk. Reopen the project and compare the marks with their saved source. Include a missing brush asset and a slow preview so stale information cannot make another tool appear selected.

Review large-text labels, accessible tool names and alternatives to precise slider dragging. Measure wrong-tool strokes, unexpected parameter resets and failed undo separately from brush changes. People may switch often because experimentation is the purpose of drawing. Do not claim that fewer changes or a smoother-looking line proves creative quality improved.

Review the tool that creates the next mark

Use these checks on a working build, not only on the polished reference state.

  • The active brush remains identifiable while settings are open.
  • Samples describe the selected tool rather than unrelated decoration.
  • Size, opacity and other controls have explicit meanings and scopes.
  • Zoom behavior and size units are consistent with the canvas model.
  • Per-tool or global remembered settings follow a predictable policy.
  • Eraser and Clear All cannot silently remove unrelated project content.
  • Saved strokes and undo remain stable after changing preferences.

Questions worth resolving before shipping

Should every brush remember its own size?

Either per-brush or global preferences can work. Choose a policy that serves the drawing task, show the resolved value when switching and keep it stable after reopening.

Is a stroke preview proof of stylus behavior?

No. Test real input on supported devices. Pressure, tilt and latency depend on the actual implementation and cannot be established from a preset thumbnail.

Should changing brush size alter old strokes?

Not unless the person is explicitly editing selected content under a supported model. Tool preferences normally describe future input; earlier document operations need their own identity and undo behavior.

2,805 apps in the top charts.Ask them anything.

Use ScreensDesign Pro to inspect real brush pickers and their canvas context before choosing how your drawing tool previews, remembers and applies its settings.