Automattic released a new plugin titled Sketch Block earlier today. It is a one-off block that allows end-users to draw directly in the editor. The plugin is marked as a beta release and requires Gutenberg to be activated to use. It is a part of the company’s Block Experiments project.
To be perfectly honest, I spent an excessive amount of time playing around with this block plugin today. And, if I am going overboard with that honesty, most of that time was just trying to write out my name. It was hard not to. Drawing things directly in the editor is just kind of fun.
Attempts to write my name with Sketch Block.
I am unsure how many practical uses the plugin actually has at its current stage, but not everything needs a purpose outside of pure entertainment. Like an embedded Block-a-saurus game and ghost-written headings, sometimes we just need reminders about the wild and whacky side of the web. We also need to experiment with new ideas from time to time, which can lead to unexpected discoveries, creating the foundation of future technological advancements.
Sometimes we just need to relieve some stress and sketch out our names in a new tool.
I tested the block using my laptop’s trackpad — not an ideal method for freehand drawing. Unfortunately, I did not have access to a larger touchscreen device for a more thorough test.
The block offers a limited number of controls as of version 1.0.7. Users can select between three different stroke widths and choose from their theme’s color palette. The block’s height can be resized, but there seems to be a minimum of 200px.
I did manage to break it a few times, running into the “This block has encountered an error and cannot be previewed” error. There also seemed to be an unknown minimum width, which could not be adjusted. My goal was to create a columnized team page with each member’s signature beneath their profile photo. However, the Sketch block kept breaking outside of my columns. In the end, I created a single-member bio section:
Creating a profile card with Sketch Block
The plugin is built on top of the Perfect Freehand JavaScript library. When comparing Automattic’s block implementation to the library’s demo, the plugin falls short of offering the same experience in block form.
Perfect Freehand’s demo felt smoother. I was able to consistently draw with more accuracy using my laptop’s trackpad. I do not know if just the size of the drawing area made a difference or if the editor interfered with the feeling.
Drawing in the Perfect Freehand demo.
The JavaScript library has a ton of extra options too. Users can transform even the worst drawing into something a bit cleaner with the thinning, smoothing, streamline, and other controls. I would love to see the Sketch Block plugin integrate the full suite of tools available through Perfect Freehand.
Despite a few bumps, the plugin is a solid first release for a beta project. I am eagerly waiting for what future versions have in store. I also wonder what applications it might have outside of piddling around for fun, such as notetaking or animations.