Categories
Design Random

HD1 M2

I’ve had these Sennheiser headphones for about 3 years, and I just learned that the volume toggle is also a button. Its definitely a clever interface, but it’s not at all obvious. I also imagine its more costly and likely to fail than just having a separate button.

Categories
Life Photos Random

Loki, God of Mischief

Categories
Photos Random

My yard is covered in this stuff

I could use a snow shovel to clear it. What is this stuff and why is it everywhere?!

Categories
Design Random

Please enter your phone number…

The phone number input field has an incremental increase/decrease control.

This is the web’s equivalent of those old rotary telephones.

Categories
Life

Someone’s celebrating today…

There will be pizza and ice cream cake.

Slide the thing side-to-side to see Mason goofing around with his birthday balloon.

Categories
Design Random

The first 5,000 users on Dribbble.com

I’m user #572 on Dribbble, with my account created on Jan 19, 2010. Thats kind of cool. Scrolling through this list is like a who’s who of 2010 web design.

Categories
Design WordPress Work

Publishing a Block Pattern on WordPress.org

Here’s a design I made that walks people through filling out the necessary information to submit their block pattern to the WordPress.org directory.

Categories
Gutenberg WordPress Work

Testing Full Site Editing for WordPress 5.8

WordPress 5.8 is scheduled to release at the end of July, and one of the most anticipated features is what’s been affectionately referred to as “Full Site Editing.” In reality Full Site Editing (or, FSE) is really a collection of numerous features that together enable someone to edit their entire website using blocks.

This is a big deal.

But, in traditional WordPress fashion its not all happening at once. Bits and pieces of FSE will be appearing in WordPress over time, spread out across various releases. In WordPress 5.8 the first big and exciting piece of FSE is going to ship; Its called Template Editing and its really powerful, but also very nuanced and subtle. Don’t expect it to change everything over night, but do expect it to be a crucial step towards the future of WordPress theming.


In anticipation of all the “newness” that is coming to WordPress, Anne McCarthy has been managing an outreach program looking to increase participation of testing (and giving feedback) for new features. Its been really amazing to see videos of people using the FSE features to build some really amazing things.

The latest installment in this outreach program is a sixth “call for testing.” This post documents my experience running through the test along with any thoughts and feedback I have as I go.

Buckle up, this is likely to be a long, “stream of consciousness” post full of technical jargon and confusion.


Before I jumped into the test, I asked Anne if there was one particular area that I should focus on; Her response was that I should focus on the “customizing the template experience specifically,” so that’s what I’m going to do.

Like any good test taker, the first thing I do is read all of the instructions — just incase the final instruction is to ignore all previous instructions and sit at my desk quietly.

The “call for testing” post is thorough and detailed. I love that Anne covers “known issues” right up front, which helps me avoid that feeling of “wasting my time” reporting the same duplicate issue for the 8th time.


The first thing I noticed after activating Gutenberg 10.6 and the TT1 Blocks theme is this ever present reminder that I’m in an experiment. It’s probably a good reminder, but I do wish there was a way to get rid of it. Does it need to be so repetitive (experimental full site editing, full site editing experimental) and full of jargon (API!?)?


The test asks that I create three pages, “About,” “Contact,” and “Code of Conduct.” This is all fine, but it makes me long for a simple way to create pages in bulk.


In step #9 in the instructions, I’m told to use the Settings sidebar and look under the Page tab for the Template section. I found it, but it displays an obscure object message…

Opening the accordion doesn’t give me any more indication of what’s happening…


For step #10, the template name UI displays a list of suggestions for the input field; This should likely be disabled as its irrelevant to creating a new template.


Welcome, to Jurassic Park the template editor.

It was a little jarring entering into the template editor. The “snackbar” notification that appears for a few seconds appeared below the welcome tour, which was a little strange.

Templates express the layout of the site. Customize all aspects of your posts and pages using the tools of blocks and patterns.

I think the welcome tour’s copy could probably be improved. I’m not sure what it means to “express the layout of the site.” Additionally, that generic WordPress page “illustration” leaves a lot to be desired. I’d expect something more relevant to blocks and templates.

I also think the “Get started” button should be a primary button — white text on a blue shape. As-is, its not obvious what I need to touch to move ahead.


The “Template” tab in the sidebar is mostly useless. I’m sure there’s more we could do here to educate and relevant functionality we could expose.


When I’m in “Template Editing Mode” there’s a this large black space around the canvas area of the editor. I think this is supposed to help me understand that I’m not editing a single document, but rather that I’m editing something more.

There’s something unsettling about the dark spacing and the border radius; I’m not sure what it is, but this feels strange.


In step #12, the instructions tell me to remove a few blocks from the top of my page template. My instinct is to hold down the cmd key while I use my mouse to select multiple blocks — my past experience with software makes me think this is a common way to select multiple things, but its doesn’t really work in the template editor…

To be fair, I don’t think this is specific to the template editor — selecting multiple blocks using Safari in the block editor has always been problematic; I don’t like the way the text is highlighted, since I know I’m not selecting text but selecting blocks. There is a difference.

You can also see yet-another-example of the in-between inserter getting in the way; That blue [+] and line? That’s the “in-between inserter” and its always trying way too hard.


Step #15 instructs me to drag-and-drop the Title block into the newly created Cover block. I know how to do this, but likely only because I use WordPress everyday; I’ve often thought the drag handle was far-less-than-obvious.

I was able to drag the Title block into the Cover block, but I expected that it would replace the empty Paragraph block — not add itself below the empty Paragraph.


Step #17 request that I use the new duotone feature to stylize my Cover block. Ok, cool. I’ve heard about duotone, but unfortunately the UI is a little chaotic…

When I first set a duotone filter, the popover goes away. But, after that I find it very difficult to hide the popover; It only goes away if I click outside of the toolbar.


In step #19 I’m instructed to add a new Columns block. And I’m able to do this (mostly ’cause I’m a Gutenberg pro…), but its really hard to tell what I’m looking at with an empty Columns block inside a Cover block.


It was at this point I realized I had spent over 2 hours on this test. So, for now, we’ll call this a day. I might pick this back up tomorrow.

Categories
Design Work

Automattic is Hiring

Design by Pablo, Animation by Ballio

In a few weeks, I’ll have worked at Automattic for 10 years. That is just about a third of my life, and the majority of my career as a designer. And here’s the thing, I could see myself doing this for another 10 years.

Looking for a job? automattic.com/work-with-us

Categories
Design WordPress Work wp-admin

A Welcomed Detour

Took a little detour today and tried to help with some improvements to the media uploader in WordPress, specifically a new button that will let you quickly copy the URL for a file that you just uploaded.

This is related to the following WordPress Core issue: Add a copy-link button at the media upload page