وردپرس

WordPress as a Design Tool—Empowering Users to Create


Welcome to Press This, a podcast that delivers valuable insights and actionable tips for navigating the ever-evolving world of WordPress. 

In this episode, host Brian Gardner and Automattic Product Lead Rich Tabor, unpack WordPress’s design potential, highlighting its evolving features and the power it offers website builders.

Powered by RedCircle

Brian Gardner: Hey everybody, welcome back to the Press This podcast. I’m your host, Brian Gardner, and I am here delightfully today with one of my good friends in WordPress, design enthusiast and fellow admirer of the WordPress block and site editor, Rich Tabor. Rich, thanks for being on the show.

Rich Tabor: Hey Brian, thanks for having me today. I’m happy to start talking about WordPress.

Brian Gardner: I’m going to ask you a question. We’re going to have a little fun here with the show. I’m going to ask you a question. It will be one through 10 questions, and then we will return to that question after we do a little intro on you. As it stands, so WordPress 6.6, not including Gutenberg and all of that, on a scale of one to 10, how do you rate WordPress as a design tool?

Rich Tabor: That’s tricky; I’m supposed to answer with an integer value, right?

Brian Gardner: Yeah, just on a scale of 1 to 10. Ten is like Figma, the creme de la creme, and one is worthless.

Rich Tabor: Like a six or a seven.

Brian Gardner: Let me follow that up quickly and say five years ago, right? Right around WordPress 5.0 or whatever. What would you have given it then?

Rich Tabor: It was a very different tool. The design was mainly in the hands of whoever built the site and was about it. So I would still say, maybe, if we’re talking about the empowerment of the site user, like whoever’s building the site and using it, then it was much smaller, maybe like a two or three, but if it’s, the capabilities of WordPress are still on par where they were five or six years ago, I would say.

Brian Gardner: Okay, that’s fair. And we’ll come back to that here in a second. And so, Rich, you are in charge of or as part of the leadership team that works on products at Automattic, which focuses on the WordPress project. Please give us a little synopsis of who you are, how you came to WordPress, and what you do currently at Automattic. From there, we’ll weave ourselves into the design conversation.

Rich Tabor: Yeah, sure. I started doing web work back in the days of front page and whatnot, just exploring and seeing what was there—MySpace profiles, et cetera. I eventually got into WordPress, mainly around the theming front. I was curious about the design and website ideas and tried to define the intersection of the two that best suited my desire. I learned a little bit from an agency, doing some marketing work and building and designing; I’m primarily designing, at that point, a bunch of websites and landing pages and whatnot. From there, I built and sold my own themes for several years. And when Gutenberg was turning the first corner, it was time to jump on block development. So, I dove into React and JavaScript, trying to find my footing there and figure out how I could best impact the future of WordPress.

And you know, we’re here today, in this future where it is block-based, and there is an avenue of WordPress that is very different from what it used to look like five years ago, even when Gutenberg first came in. But yeah, so I build products, and I enjoy it. It’s just really what I do.

Brian Gardner: Many folks here are very familiar with Mike McAllister. He’s got a product called Oli. I grew people like you and him into the same category. Correct me if I’m wrong. We are usually more designers than we are developers. Capable of building for sure. But the three of us have, and you guys are leagues ahead of me regarding design capabilities. I love everything you guys do.Is that an accurate statement that you’re more of a designer than you are a developer?

Rich Tabor: You know, I think of my blog. Say, like, you know, the fancy multi-disciplinary, you know, the intersection of product design and engineering. I am at the middle point of both, with the product being the center, the experience. So, if you count the experience as design, then I lean that way. But if you count experience as engineering, then I mean that way. But for me, it’s an intersection where all those three pieces are interconnected. You can have more than one or two even. Otherwise, you’ll be in a rough spot.

Brian Gardner: Yeah, so there’s that sort of the adage or running joke in conversation in the tech space for people like us in a room full of developers. I am a designer, and I am a developer in a room full of designers. And that’s generally true for me, for you as well. Okay, so that’s right. And people like us are dangerous, both good and bad.

Rich Tabor: Yeah, yeah, that couldn’t be more accurate.

Brian Gardner: I like the ability to have both skills, but it also means that the sea is more wide open—like the capabilities and the creative brain can go in different directions. My development abilities could be improved when I want to design and vice versa. I can develop this quickly, but I can also make it look good, which sometimes makes shutting the computer at the end of the day or even at the end of the workday more challenging. You know what I’m saying here because you and I are slacking sometimes at 11 or midnight.

Rich Tabor: Yeah, you know, like the part I try to lean on, which I’ve been doing since I was at GoDaddy for a couple of years, and then now I’m at Automattic. Something I’ve been pursuing is scale. How do you scale across design and engineering and help move progress across teams? Something I’m trying not to get too caught up on is the small details that I need to record and share, but how do I get more of that out of team members and inspire them in that sense? So that’s been something I’ve been challenging myself with personally.

Brian Gardner: It’s a pretty good segue here because I asked you to come on the show to talk about WordPress as a design tool—not necessarily a design replacement for other programs, but just given where it’s at and all of that. I feel like where WordPress is now is what you described, sort of the intersection of design and development, way more than it ever used to be in enabling the user to do things.

Previously, WordPress was more HTML, PHP, and CSS-based, and themes were built that way. Custom sites were built that way. And you had more of a user or a customer and then a developer or builder, but now, and this is where WordPress is and is continuing to go, you have a tool that resembles more of the Wix and Squarespace and Webflow and Framer, that kind of a thing, where the software is enabling the user to do design things. Over the last several versions, we’ve seen those capabilities improve and strengthen. Where do you feel right now we are along that journey? Do you feel good about it? Do you feel great about it? Is it okay, but there is still much room for improvement? Then, we’ll break down and get a little more granular and talk about what the actual design capabilities of WordPress are like right now.

Rich Tabor: those who work with me daily probably know I’m one of WordPress’s biggest critics. I’m close to the product; I see and work on it daily. And one of the things I keep pressing on is leaning in on simplicity and intuitiveness. We have a lot of controls; we have a lot of quote-unquote features that we’ve added over the last five years. Some of these propel WordPress ahead, and some are just catching up.

But in all that, the one thing that I want to push from a product perspective is to create that sense of intuitiveness, to create those moments where you use WordPress, you try to do something, you drop in a block, and then you’re like, yeah, that helped me do something that years ago would have been difficult to do, or very challenging. So, leaning in on intuitiveness is where the most significant opportunity is design-wise. We have a lot of controls and stuff. Over time, they’re stacked on each other, and now I see this refinement phase coming up.

Brian Gardner: What is WordPress’s biggest empowerment today and its most significant limitation? It’s a big open-ended question, but let’s get into the nuts and bolts of it all.

Rich Tabor: I think the whole concept of a block theme and having everything editable at the block level so you can go into your header, change your logo to the right or the center, edit your footer, move things around, change your entire templates all from a UI. It’s one of the biggest advantages, and with that comes global styles, such as skinning a theme and having those same JSON styles applied to another website or even another theme and shared between the two. Those are the most significant wins.

The most challenging part is that you can select all the blocks in your header and move them around, or you can accidentally delete your content or your footer. There’s this experience layer on top of the tools that we need to refine and push further a little bit more to where it is still as empowering as the original vision of, you know, being able to edit your entire site with blocks, but then also not restrictions, but almost guardrails to keep you in the right lane. Unless you want to go out and do your own thing, then sure, like WordPress is extendable, and it is, you can delete your entire template and start fresh. And that’s cool. But that initial experience and that intuitiveness are things that we need to push in on.

Brian Gardner: I have researched and played with the Create Block Theme plugin. This plugin allows you to install a theme, make changes, and export it. It does several more things than that, and this is where I’m going here, including the ability to start with a blank canvas. And so, when you use that option in the Create Block Theme plugin. It’s mind-blowing because what it does is it just sets up a basic WordPress theme with an index file with no styles. Then it’s just a start-from-scratch thing, which, for, we’ll say that the hobbyist user, somebody trying to get an online presence site up, might be a little overwhelming. But for those like me, I want a blank canvas to design my theme or website. WordPress and the Create Block Theme plugin also allow us to do that. Do you see any future wear capabilities? You can export a theme now, but the full capabilities of that plugin will end up in WordPress Core.

Rich Tabor: There will likely be some overlap; eventually, some of that functionality will move into Core. There is potentially a toolkit for the advanced creators and folks building these themes. That doesn’t suit Core. One of the great things about WordPress is that it can morph into what you need it to be. As you said, Create Block Theme is an exciting project, and Automattic has some of the best theme designers, apart from you, Mike, and a few others. But they’ve been leveraging it, helping to build it, and pushing forward the changes that need to happen. Automattic is pushing a theme or two a week and leaning forward. But yeah, there’s something to bringing some of that to Core.

Brian Gardner: One of the things I love about WordPress now, and it took us some time to get there, because several versions ago, we had the basics in place, but the refinement and the parity of what settings and style controls are in theme.json and marrying them up with an actual user interface inside of the site editor via global styles. In other words, if theme .json could register a color palette, it would be nice for the user in the dashboard to be able to edit those recent changes. One that’s coming to WordPress 6.7 would be the font size.

Theme.json has had that capability for quite some time, where you can register the font sizes for the theme, but you need to get into the code and change that to do that inside the dashboard. These things I’ve discussed in the last couple of episodes excite me from a design perspective. Not myself, because I’m capable, as we discussed earlier, of going into the code and writing it all out through theme.json. However, it allows us to teach people how to design a site using WordPress as a leader. These controls and settings are now available as user interface pieces, which is extremely helpful. And there’s a lot of ongoing work relative to refinement, user interface, and user experience. Do you want to? You’ve been part of that project, which is to go through and click all the buttons and see where there might be opportunities to make even minimal improvements, but ones nonetheless make WordPress better.

Rich Tabor: The font size preset control is exciting. There’s something to be said for Global Styles to be able to configure every piece of a theme. We could be at 80 or 90% of what’s possible in the JSON file. And when I look at Global Styles, all I see is the UI for theme.json. And I think if we make that UI just a little bit simpler and a little bit more intuitive, it’ll be easier for people to use and also potentially export their themes or share themes across sites or be able to make changes on sites instead of having to dive into the code and push changes and try to validate the code on the server versus the code that’s local. There are many workflow things we need to iron out regarding all this. Some of that work is the phase three collaboration and workflow effort. But as a design tool, it’s evolved quite a bit. And there are always things that we can improve. But at the same time, we’re theme-wise, theme creation-wise, and at a pretty good spot.

Brian Gardner: WordPress is not out to feature parity Figma. And I know that Figma has become the de facto design tool, replacing Adobe Photoshop, Sketch, and everything else. And many people have, in various conversations, said, I wish WordPress were more like Figma, which is ridiculous when you think about it because they’re two different things. However, one thing I have appreciated, and this is a little bit less of a design piece, is the ability to rename groups and blocks inside of ListView, which, as you create layers and components in Figma, is a little more like peri there. But the user interface we’re talking about excites me, and I can make the case that, unless it was a sophisticated project, there’s almost no need to use Figma at a light level. Do you agree?

Rich Tabor: The best part of Figma is that there are two significant parts. One is speed. If you’re familiar with this thing, you can use it fast, iterate, and develop many quick ideas. You ideate a lot. So it’s great for that. It’s also great for prototyping, building applications, and trying to flesh out some ideas. It’s a beautiful tool on both of those fronts. And, as a design tool, it’s, like you said, the de facto tool right now.

But when I think about WordPress’s future, I think you can leverage WordPress as a design tool without necessarily having to use Figma. Some folks want to come up with 20 or 30 different ideas fast and fill out what works well, and that’s fine. But it’d be awesome if WordPress was that intuitive to use as a professional tool. Figma is a professional tool. Someone brand new to Figma would be just as I’m familiar with Figma as someone brand new to WordPress. As you do, we have a lot of learning that goes on to develop these tools and get used to how they work. But Figma is still a much easier-to-use tool than WordPress. And it’s a very different animal regarding publishing and whatnot. There’s validity in having a WordPress first design process.

Brian Gardner: I use Figma now more for things that I used to use like Adobe Photoshop for and less for like website design and more like, you know, ideating on like logos and branding and stuff like that, in which case it’s a beautiful tool, more accessible than Photoshop or Adobe Illustrator. Indeed, there is nothing I expect WordPress ever to come close to being able to emulate. But you know, you and I have been friends for a long time. As I know you are, I’m an advocate because I know you’re responsible for some of the wireframe patterns on WordPress.com.

I’m a proponent of wireframe patterns. I have a theme called Frost and a theme called Powder, which embraced that, and in my mind, it was like I had a matching Figma file. Still, it’s gotten to a point where I’m like, I don’t know that I would recommend going to Figma to do the work and then having to go back to WordPress to do the same job, some of which is even easier in WordPress and is figma so there’s just a duplication of effort there. I know there’s been, but I would like to see if you’re familiar with any work here. Still, at one point, there was a hope that you could design in Figma, click a magic button, and have it turn into a theme using tokens. Do you have any insights into that?

Rich Tabor: Yeah, I’m sure some attractive solutions exist. I’ve seen a few that do that. It takes variables and puts them into JSON format, the theme.json format. I’m sure that that’s viable for workflows, for agency workflows, for folks who potentially are designing, you know, like a style guide first, you if you’re trying to figure out the brand colors and the text colors and trying to figure out like what’s the fonts and how are these going to work. And then, Figma is an excellent place for that. We do have a style book in the WordPress experience. It needs more rethinking, but it is like a pleasant experience to see all your headings, paragraphs, buttons, and whatnot and configure from there. So, I do see some validity in the ideation part.

But yeah, I think it’s not; I don’t think it’s a future workflow to be designing these sections of a site, these patterns as individual components in Figma, but more or less having the vibe, having the style, and in WordPress, you’re creating more of these patterns. You’re making what you need now instead of going through a design process flow and approval and then coming back into WordPress and creating it.

Brian Gardner: Let’s talk about the current state of WordPress as a design tool in the sense of, and we can work our way towards your 720 design configuration theme that you’re the brainchild of. And more about that is about the capabilities of WordPress, you know, with typography presets and color presets. What are we calling them these days?

Rich Tabor: Well, they’re all style variations. They’re either theme-style variations or block-style variations. The color ones are color variations or typographies, like typography variations. Just keep the terminology as lean as possible. Yeah.

Brian Gardner: Yep, a problem we’ve had with WordPress for some time is slinging words around and saying, oops, that’s not the best word. So we’ll call it something else. Let’s break down your seven and a hundred, called the Assembler theme. It’s available. I believe on .com. Tell me about what it showcases in WordPress’s current feature set.

Rich Tabor: As simple as an exciting project I worked on, the idea is to have one theme with a lot of variability. You can compose 720 or so unique theme styles. That combines colors and typography settings individually to create those different unique styles. And so I wrote a post, it’s rich .blog slash 720 -themes. And I’m just showcasing that this is possible with minimal effort, like with 45 JSON files for colors and 15 or so for typography. And then, in that combination, the idea that you can maintain something that’s composable in such a simple manner, like the JSON file, is exciting, especially for processes and applications where scalability is essential. For a host trying to build out WordPress theme styles and themes for users to pick from, or even from theme shops, or even for agencies who are like, well, I can maintain all the vibes we use across different agency work. We can put it into this theme and have one file that controls everything.

When you take this idea of this JSON style format, it’s much easier to see a future where you can potentially manipulate it with AI and create more of these from a prompt instead of having to style it yourself. For example, if you said you wanted your website yellow, could it find the elements that need to be yellow and change them to yellow? And if you wish to make it less yellow, it finds different elements to make it less yellow. That’s all feasible with the system that we built today.

Brian Gardner: AI is probably a separate conversation and a separate episode. Being a designer or at least a person with a design mindset, I still struggle in the same way copywriters do when you use, you know, things like chatGPTto generate copy. They’re like that, but it’s not the real thing. It’s not the human thought, you know, emotionally driven choice. In this case, most people don’t care because it’s all about speed, at least for them. But for people like me, people who are pure creatives, I’m like, I don’t love the idea of a prompt that says, create me a church website using black and orange as colors with a serif font and just having AI do its thing. Cause I don’t know, not nine times out of 10, but I don’t know that I would necessarily trust it. Many people don’t care or aren’t as particular as I am about that.

Rich Tabor: The prompt example you just said is close to the future. And it’s not like, and maybe the first stage of like a well-designed system is, you know, inputs that are more like a similar or some other theme like Frost where you do have like your definitions of color and it evolves from there rather than, you know, picking random colors. It’s all about the inputs.

Brian Gardner: I’m going off-topic for a moment. Do you have any thoughts on Tailwind CSS and the whole movement, just in terms of color theory?

Rich Tabor: I think it’s okay. I’ve used Tailwind on several projects over time. If you’re very familiar with Tailwind and theme .json, you can draw some similarities in the sense of having JavaScript or JSON-driven style declarations. There’s a lot of parity there, so I think it’s okay. The most significant difference is we have a little bit more prescriptive block styling. So it’s per block versus coming up with something a bit wider. But if you use presets, even exclusively, I would say most sites that you’re doing for production, like if you’re doing something for a client or whatnot, I would lean heavily on these presets, which are almost the same as setting them up in Tailwind, in my opinion.

Brian Gardner: I love one of the parts of my job is I assume it’s yours as well as when you talk to people who are like at the agency level, small business, more than just one person or even, you know, a sophisticated design development shop. That’s one or two people who can easily use the Create Block Theme plugin or just literally locally, just like cloning a theme and then making it your own. I talk to people a lot about this because I have Frost and Powder, and we’ve talked about the conversations around parent-child themes and whether they’re necessary or not.

I like talking to agencies and encouraging them to create their theme or framework per se where they know WebDevStudios is a good example. They forked one of my themes and made it their base theme for something like WDS or something like that. This is the power of where WordPress is now with templates and patterns, JSON files, and these variations, where you can have an internal library like the agency where you could pick and choose which things you want to plug into a particular site for a client. One thing that excites me most about WordPress outside of the hobbyist controls is the ability on the other side of it to understand how WordPress is built, how block themes are built, and how easy it is. I use the phrase copy and pasteability, but I can grab this file and stick it in this theme. Right? How do you feel about that?

Rich Tabor: No, certainly on the way that WordPress has been moving, you know, the idea that a theme is entirely composed of parts, you know, its templates, its template parts, its patterns, its colors, its fonts now, you know, with this typography styles. But then, like the next big thing, and you know, we’re kind of at this point with most parts of the theme, but the idea is that you can reuse these parts across themes. For example, a section or pattern style applied to one theme can now be used on another. Even parts of patterns, know, that’s why we have these pattern libraries like at wordpress.com. There’s a pattern library. WordPress.org has many patterns, and I know Frost and Ollie and everyone’s building patterns now. And the idea that they are limited to one theme is kind of, in my opinion.

A bit shorter-sighted, like the long term, the long tail is that I could drop a pattern on any WordPress site, the theme inherits the styles, and everything looks fine. I can have a newsletter pattern from you, a gallery pattern from me, and a cult action from Mike’s Oli theme, and I can put them all together because that’s how I want to compose my page. And we’re almost to that point. We need to open up templates a bit more so that when you see a beautiful blog template, you can grab it and use it on your blog instead, making it more accessible. Today, you have to copy and paste and build out something you know in a sense that isn’t quite as ideal.

Brian Gardner: Yeah, I was trying to remember how far back it goes. It’s the same software, but it’s so different. Since 2006, there’s still all the code there. And I joke that WordPress is backward and compatible with a fault. There are probably moments where I’m like, at 5.0, when Gutenberg came out, it should have been forked of itself and called WordPress Pro. That’s a different conversation, which would have introduced another round of confusion.

But in the end, I love where it’s at. I love where it’s going. I mean, you and I have been around WordPress for 40 years, probably. We’ve seen it run its whole gambit of things. So, if you have any last parting words about WordPress design or anything that you think might be coming or that might get people excited, let us have it.

Rich Tabor: Yeah, you on the design front, I’ve been curious about how we can still have the flexibility and the design controls that we have today but then also better support either folks that are newer to WordPress or clientele that don’t necessarily need the full, you know, foundational elements of the editing experience. So, I’m leaning in on some ideas there. Think that there are some concepts around section styles and being able to theme whole parts of your site all at once. So it is exciting to me. I suggest that everyone try a block theme. I recently released a new theme called Kanso, and its simple theme is just a blog, just like my blog at rich.blog. Just try a theme like that, like find out how to change the colors, how to change the typography, and then dig into it if you’re curious like I look into the JSON and see how this thing is configured because it is eye-opening when you see how composable these pieces are and how they come together to create a beautiful end product. Still, then you can also take that end product and morph it into whatever you need. And I think that that’s like the beauty of where WordPress has been headed and where we’re seeing the apex of where we’re seeing that vision through.

Brian Gardner: This morning, I downloaded themes from dot org. Many of us were from Automattic this morning to see how people are doing things. That’s probably one of WordPress’s biggest and sometimes most frustrating features. It can be built with and used in several different ways, and they’re perfect. It’s a weird statement, but it’s almost like there’s no wrong way to WordPress. There are many ways to use WordPress. You and I’ve had several conversations around. Should we do it this way or that way? The Scarecrow and the Wizard of Oz people go both ways, right? It can work both ways depending on how you need to use it, even from a design tool perspective. I love

You can use the controls, build with theme.json, and do all sorts of things with it. And the future is bright. At one point, Matt said several years ago, the road ahead of WordPress is a lot longer than the road behind it. And that’s a pretty bold statement, but as far as I know, you and I are still here for it, right?

Rich Tabor: That’s right.

Brian Gardner: All right, everybody. Rich Tabor, who works on products at Automattic, a thought leader in the space, a brilliant designer, and somebody I am thankful for, is part of the project because it allows it to move forward in a way I hope it goes. And so again, thank you for being on the show. Rich, give us a couple of places where people can find you.

Rich Tabor: Yeah, I blog at rich.blog, which feels like the coolest domain. I tweet, or whatever we’re calling it, post on X slash Twitter at richard_tabor.

Brian Gardner: That’s a wrap for today. We’ll cut it short, but we provided much information here, so continue listening to the Press This podcast. We go into the community, both from a product perspective from a business building perspective, and we talk about the ever-evolving world and landscape of WordPress, where it’s been, where it’s going, and how people like you can use it to make money, to build websites, and everything in between. Thanks again for listening, and we’ll talk to you soon.



این خبر را در ایران وب سازان مرجع وب و فناوری دنبال کنید

مشاهده پاسخ های این مطلب
———————————————
این مطلب از سایت انجمن وردپرس گردآوری شده است و کلیه حقوق مطلق به انجمن وردپرس می باشد در صورت مغایرت و یا بروز مشکل اطلاع دهید تا حذف گردد

منبع: انجمن وردپرس

دکمه بازگشت به بالا