Effizienter Websites bauen

[Music]

Thomas: Hey, and welcome to our second episode of Greyd Conversations. Today we want to talk about
how to speed up the building process in WordPress, not only from a designer’s perspective as we try to focus on an agency perspective as well. With me is Mark. Mark, hi again. We know each other from the speed build with Jamie. How are you doing?

Mark: Great. Thomas, thank you so much for having me. This is awesome.

Thomas: Perfect. So, actually, we’ve had another speed build today with my team colleague Jessica against Matt Mullenweg. Did you watch it?

Mark: I did, I was quite the show.

Thomas: Yeah, definitely. As we already talked about these speed build challenges. I mean, they’re for fun. When we’re talking about, life and actual projects – I guess you’re on the same page as me – we, would do it differently. But, actually, what have you felt back then when you first saw the website in the speed build and Jamie presented this website to us?

Mark: Yeah, that was a a time, that was an experience. I think – if I’m remembering correctly – the first thing that I remember seeing was a vertical navigation menu. And I think to this day it’s still the only website with a vertical navigation menu that Jamie threw at somebody on the show. So, that was fun. Layout wasn’t too crazy. I was using Bricks, ACSS and Frames. So I did definitely kind of utilize some pre-built sections and like, you know, especially that horizontal or vertical navigation there. It was definitely an interesting layout. I mean, I’m not sure if I would build a website like that, but I’m always interested to see how you build, like, more creative and interesting layouts. Because when you are a web designer for a long time and you’re scouring across the web, it does get kind of repetitive and it’s nice to see something different once in a while and try to try to build it.

Thomas: Yeah. Talking about web design and doing this kind of stuff a lot, or a lot of the time. How did you come into the whole web design game? What was your basic idea behind? Why did you start building websites?

Mark: Yes, I was, I’m 28 now, and I was like, I graduated college. I was 22, came out of college, was working for a real estate firm in the technology and marketing department. That’s where I was literally sitting next to guys that are probably more like you and your team rather than me. Because I didn’t have a programing background specifically. I learned some things in college . That was where I first learned HTML and CSS. But I’m building stuff with whatever they were called before, almost like tables as websites. It’s crazy. So, I learned a little bit of bootstrap towards the end of my college career there. And then I was in marketing and like I said, I was sitting next to guys that were building with like ASP.net in, you know, Visual Studio or whatever at the time. So that was really intriguing. I played around with that for about five minutes, and then I was like, nah, I need something a little bit more visual. And at this time, you know, where it’s like maybe 2016, 2017. They told me about WordPress. My colleagues did, and I was like, well, let me try that out. And I was about to quit WordPress
right away, because I was looking at the themes and I’m like, I thought this was going to be more like a put things anywhere you want, so to speak. And then I found the big pagebuilders, like specifically Elementor. I was like, oh, okay. So I can kind of like not be a graphic designer, but I could be more of like a visual web designer, so to speak. And that was kind of my, you know, my trajectory into it. And then ever since then, I’d used Elementor for years. I switched to Bricks recently, and I’m just exploring all the different tools. Quite interesting, because I think we have some kind of similar approach to that.

Thomas: Yeah, I myself, studied communications design back then at a time where design and development were two completely different things, especially when it comes to the university. And I always wanted to go more into development. But the thing was that I always was more like, as well a visual designer. So I needed some visual interface to actually build something. And I started actually with WP Bakery.

Mark: Okay.

Thomas: Yeah. It is one of the oldest pagebuilders and it was still more focused on the backend. You could work in a really structured way, if you had a robust theme and a robust version of your tech stack. So, frontend-wise, you already knew, okay, so if I do this in the frontend, it will look like that. But, yeah, at some point,
I changed as well to a complete visual editor. And for me it was the biggest change ever. It was the switch from WP Bakery to the Block Editor. At a time when the Block Editor was really at the beginning. So, when we’re talking about building websites. How do you approach projects? So, not only from a designer’s perspective
but as well from an agency’s or freelancer’s perspective. How do you approach the process?

Mark: Yeah. So, I mean, to go back again, I was like 2017, 2018, I started building. I still had like a, you know, 9 to 5 job. I started the agency, so to speak. I’ve always pretty much been like a solo agency to, maybe like a couple freelancers, I’ve never built out a big team or anything like that. It’s just not something that I’ve tried, yet. But, yeah, during that time, every single time, I would approach a project and I will tell you, probably like most people, my approach has varied widely over the years. It’s gotten way better over time, and I’m still by no means perfect. But the first project I ever did was like, all right, just give me 500 bucks and I’ll figure out how to do this. It was a nightmare. I wasn’t using any proper dynamic data. I always tell the story. I was like, throwing stuff into the posts and trying to categorize it. But there are all different types of content. It was a nightmare. So, but I was initially drawn to that, and maybe it was because of the first thing that I ever did was very dynamic in nature. Even though I’m not like a programmer by trade, and I don’t write software often, by any means. I still like the idea of I’m also not a designer. So I’m kind of like somewhere in the middle. So I try to use the tools to create something that’s, you know, in that layer of abstraction where I’m creating cool stuff, but I’m not actually writing this stuff. So from each project perspective, over the course of the time, especially as an agency, I’ve always really had that idea of wanting to create projects that were more complex. There’s the concept of just,
you know, pumping out $1,000, $2,000 simple brochure sites. It’s definitely a viable business model that I’ve given a lot more thought to over the years, because it is straightforward and it definitely serves a purpose. But it was never the thing that came to me and was my passion. I always wanted to build E-commerce. I was always enamored by, you know, somebody comes to me and says, hey, we want a platform, a group membership platform for our members to have, you know, videos on there and documents they can download and all sorts of chat and other things. I was like, I know that there’s tools out there that I can integrate together and configure to make this work. And I can make a really cool experience. That were always the things that stuck out to me. And those projects are way different than, you know, a simple brochure site. They should cost more. They take more time and everything like that. But those were the projects that I was trying to approach. And we could get into, you know, how, so to speak. But that was kind of where I was at. As far as, like, just naturally.

Thomas: Yeah. I mean, it’s often the way that you start, like with smaller projects. And when we’re talking about pagebuilders or websites that were built with a pagebuilder. As a normal designer, you start building everything visually in the pagebuilder. But when you talk about projects like these. We were talking earlier about dynamic data. We were talking earlier about structure in the backend as well. So you need to make sure that
everything is not only visually appealing in the frontend, but you have to get the structure in the backend right. And yeah, that’s basically one of the first things I’ll always have in mind, when it comes down to it. I want to reuse these assets as well in another project. Because when you build such a structure, once you know how much time and effort you have to put in and doing this all and over again in each new project. Could be a big time problem. And if you structure it right, and you build the whole frame out and you can reuse it on every project, I mean, for you, it’s like a huge time saver. Because you can just simply put it in and start building and then maybe, finishing the frontend design only. So, what is your current tech stack? I think it was Bricks and ACSS?

Mark: Yeah. Bricks, ACSS, Frames, WS Forms for forms and things like that. There’s probably a ton of other things in there, but those are the main building tools, I would say.

Thomas: And how do you approach these structured data with these tools? Is there a specific workflow you follow?

Mark: Yeah. So I guess I left one out and that’s a big one. Normally I’ve been… I’ll tell you a quick story in relation to this. When I was using Elementor, before I moved to Bricks two years ago, at this point I was really getting into dynamic data and obviously Advanced Custom Fields, Advanced Custom Field, Pro and everything. They are like kind of the gold standard, but there’s a ton of really good options out there. When I was in the Elementor days, and this is the other thing, that every time I have a conversation like this, the landscape changes so much, so fast as you know. You almost have to bucket and well, I was doing this then, but, you know, maybe it’s a different time now. When I was building in Elementor, there weren’t the tools that there are now in Elementor. You couldn’t do custom loops, you can do custom cards. You had to bolt on different plugins
and add ons and things. And the one that I came up with – or I didn’t come up with it, but the one that I found actually from referral was Croco Block Jet Engine. And I have, you know, I’ve had an unlimited license or LTD from them for, I don’t know, a few years. And it was a game changer at the time. I still use it, and I love what they’re able to do, because I have that dynamic data centric kind of mind to me. And their query builders is
like kind of second to none, seemingly in the tools that I’ve used heavily. And then you couple that with
like a Bricks or really, you know, Bricks, Elementor, Gutenberg. Even at this point, there’s a lot of options there. And that’s, to talk specifically to the data structures, is normally how I create my custom post types, taxonomies. There’s even like components built into that now. The thing that you have, I feel like you run into a little bit with the stack like this, is when you’re in the page building world, there’s a lot of products that are around different ecosystems. So you’re constantly trying to think, well, is this the right one? Maybe there’s competing ones, so to speak, whether it’s frameworks or just add ons in general. So that’s something you have to weigh depending on what you want. Maybe some things, ACF as an example, integrates better with versus Jet Engine versus a meta box or what have you. But for the most part, that’s been the way that I’ve personally handled it. Bricks, Jet Engine for all the dynamic data set up and everything like that, integrates pretty much seamlessly for the most part, whether you’re doing, you know, facet searching or anything like that. And, it’s a pretty good one to punch there, specifically for, you know, the actual structure of the website and then the data structures on the backend. So it’s been working.

Thomas: Yeah, nice. When we’re talking here about data structure and using and leveraging the possibility of using dynamic data within post types, custom fields and stuff like that. For me personally, I have a similar approach, especially when I have to decide in a project. How much flexibility does a client has to have? Because at the end of the day, we always have different sorts of clients in our projects. We have content creators with
no experience at all inside of WordPress. They have no, like, visual feeling for how to build content and how to build and structure a site. And with leveraging dynamic data and building a very strict layout in a page, we can achieve to make sure that our design actually stays intact. So, how do you, for example, decide when to use dynamic data and when not?

Mark: So, there’s a lot of different schools of thought on this. A lot of different people doing different stuff.
I think that there’s arguments created kind of on all sides. And I think that the way that I was, I would initially think about this, because the question comes up a lot, is like, you really have to be honest with yourself as an agency owner or a freelancer, like who you’re building websites for. This is a whole topic, and I think there’s a lot of people that would really get a lot of good value out of hearing about how you can actually build websites
for clients and depending on what level of website you’re building out for, what type of client. Like the size and the scope of literally their business. It’s going to matter. And you, I know you have a lot of experience with this, because you’ve built sites for all different, like large companies and things like that. And I think, if I could go like the most common route people are probably building for, like mom and pop shops, you know, like just, you know, local service businesses, things like that. If we stay in that camp for a second, I’m kind of of the mindset
that for most of those situations, I don’t want to speak in too much of a generality, but in most of those situations, those clients should probably be working on their business, not necessarily in the website to an extent. And then also there’s buckets in there. It’s like, are we talking about the dynamic data, just the specific content that you would classify as like CMS data, let’s say? Versus literally going into, like the Greyd design system and everything like that, or the Bricks design system or the layout of the pages and everything. Those are definitely two different things. And there’s ways and tools obviously to make those things easier. But I think, if we’re talking about a business conversation, setting expectations, which is the most important thing that I’ve ever realized in all of agency world, if we’re talking from that, I always think you should be a leader in the project. You should be an expert, and you should manage those expectations from the top. They could be whatever you want, but you got to stick to them. And ultimately, if you’re thinking about it, your clients probably aren’t paying you to ask them what you should do, so to speak. So there’s a lot there and we could dive into it further. I say all that to say that when I’m building a website for just a regular size business, I’m not trying to give them the whole keys to the castle. Don’t misunderstand that. They own the website and they can do whatever they want. If they ask me, if they beat down my door, say, hey Mark, I really want to click the „Edit
with Bricks“ button, I’m going to let them do that. But I’m gonna also tell them, hey, this is a professional tool. You might screw something up and we’re going to have to obviously charge you to fix those types of things. For the flexibility specifically though, the middle ground is to use like, okay, let’s create a team member CPT. Let’s make this extremely easy for you where you can only go into the website, click team members and then put in the name the position, upload a headshot maybe, you know, and hopefully auto-optimize that or something like that, and then put it in, you know, paste in a description and then click a magic button as they would think, and it goes automatically on to the website. That has worked really well for me in the scenarios where they want some level of control, but they realize, and we’ve set the expectations like we’re doing our job by not
letting you go mess around with this and you’re doing your job by obviously doing whatever you have to do. Because sometimes they do have to manage the content. I’m not stark one way or the other on that. This is not a a blanket statement. But from my experience, that’s kind of what it’s been. And then as you go up the chain though, and you deal with bigger and bigger clients, immediately what’s going to happen is, they’re going to have a marketing team or they’re going to have somebody that they want to put on the website, so to speak, to work on it and do different things. That starts to get a little more murky. And that’s where there are tools within Bricks. But even huge kudos to what you can do with the Block Editor and Gutenberg. As you know, you can curate a better experience where it’s a little more simple in certain ways. You have a lot more control of how you actually refine that tool to actually do what you want. And to put it exactly how you need it for your client. So unfortunately, there’s no simple answer to that. Hopefully I kind of answered this flexibility question, but it just
depends really. And you got to be honest with yourself with who you’re dealing with.

Thomas: Yeah. I mean it’s the same as what I’ve experienced. Because at the end of the day, whether it’s a small client or a big client, you always have to have in mind how complex the structure is. Maybe, where the client has
to put the content, actually. And you mentioned team members. Perfect example. I did this myself for years and years. This is the perfect example where you have to have a post type structure. Because at the end of the day, if you want to change a team member, you obviously just want to go into your backend of the website, click on „new team member“ or maybe a team member has left the company. You simply have to delete them. But there are implications then, because this team member might be as well a contact person on a specific page. So if you work here on the page, build that layer, you have to manually go in, delete it there, change it there. Always. And then you get like the human error perspective here all the time. You might forget something, because in your daily business you have a couple of minutes to do that. You don’t want to mess around with okay, I need to integrate a padding here, I need to change something there. So that’s the perspective from the content creator
and the designer as well. But, the nice part is, if you, for example, build such a team post type or a contact post type properly, you can reuse it in every project. So, I have prepared a little example. Thanks for the perfect transition here. I can share something with the audience here, because actually this thing with the team member, I already prepared. So, let’s go here into my blueprint installation, which I normally use when I start a project. And in this case, on my homepage, there is directly down here a blueprint for team members, for example. So we have different images, title position, phone number, email address, nothing too fancy. I can enhance it in every project, but the entire structure is already built. And if I start a new project, I just use this as my blueprint, as my starting point, and start working. So, when I jump into the backend, let’s go quickly inside the dashboard. So here is my team member. And for the content creator it’s really easy, because at the end of the day he creates a new member. Like for example Ethan here. We have Ethan’s name, we have position, email, phone, quote, we have his image. So, nothing to break here. And we can use this data in different circumstances. For example, if I create a page and Ethan is currently used here in this example topic page. But as you see, I already have an entire structure here running. And it’s automated because what I did is, I used – it’s a Greyd specific part – it’s a Dynamic Template. And this Dynamic Template is set that it automatically takes the post title of the page, because we’re talking here about support teams. And it automatically takes a taxonomy.
I set up a taxonomy as a relationship, because I don’t only want to use this template in that specific sample page here. I want to use it, for example, in my software support page which has here under „contacts“ the taxonomy software support as well. And in the frontend I have here my team members for software contacts. So if a new member shall be in the software support team, I just go in, and go into team > all members. Let’s see. Okay. And now you’re in the software support as well. Sorry, guy. So perfect. Software support. Update. Going into the page. So jumping in here, software support. Yeah, there’s Jackson Lee. If he wants or not. He is now in the software support team. And that’s, from a content creator perspective, from the user perspective, really easy. Because they just need to set a taxonomy. For me as the person who builds the websites, it’s as well really easy,
because I can use this specific example in the next project as well, because it’s just another taxonomy. It’s the other team members. And maybe I use different data here. And that’s the power you have when working with dynamic data.

Mark: Yeah. All I can do is give you kudos there, Thomas. Because one, that’s a beautiful example. But two, that’s genuinely my favorite part of building. As soon as I discovered dynamic data, I was like, this is powerful. There’s a lot of things I can do with that. I mean, whether it’s, KPIs, taxonomies, relationships, you know, anything like that. Those are the things that I feel. Again, I never came from the designer background. So all my websites probably look kind of bland and, you know, just like chill, but that’s where I need the help with the dynamic data stuff. It’s come so naturally. I just see the power, so I just try to keep telling people how powerful that is. Because I want them to implement that in their own work.

Thomas: And, you know, if we’re talking earlier about all the websites and web projects leveraging dynamic data and building a proper structure, that’s the most important part of a website. Because a design can change and a design obviously changes all the time over the years. There are some iterations. We have changes in corporate designs all the time, but the structure at the end of the day, which is the very foundation of a website, just stays the same. And if you have change there over time, that’s the most expensive part at the end of the day. So yeah, I mean, I’m the same here. I try always to work structure first. Always. Because you have to have your client in mind. You have to have your team in mind. Because with this structure, the entire team can work on. And that’s the interesting part. Because then you as well get a standard inside your agency, because everyone uses the structure. Everyone knows, okay, if something goes wrong in this specific structure, okay, you know where to put something and then you can roll it out to clients as well. But, talking a bit about design tools. I know you said you’re not a designer. But when you do a web project, so, you obviously get a design from the client,
or you have a different team member, or you team up with someone who who does the design. In Figma or in XD? Or do you work right away in WordPress?

Mark: Yeah, I would say, it definitely depends, too. I mean, there’s no hard and fast answers, I think. With a lot of what we do, obviously. But like I would say, kind of going back to the last question, it’s similar for me from my experience. So, I would say if it’s a low cost project, if it’s if it’s something… You know, we all want to do bigger projects, more expensive, bigger clients, but it doesn’t always happen. If it’s a lower cost project, I think there should always be a design phase. You probably shouldn’t like completely just jump in there. But at the same time, if we’re being honest with ourselves as business owners, we can’t. I don’t like to charge per time
necessarily. It’s a different discussion, but if you are spending more time or less time, it’s something to be considered, so to speak, in your whole business model. So if you have a website, if somebody needs a website, obviously most of the time for me, my client has never really brought me designs. That obviously exists, that has happened. So it’s where I’m really left with two options. Most of the time it’s either I need to try to design it myself, or I can team up with somebody. Most of the time I end up do designing it myself, because from my experience, the types of websites I’ve built, are relatively similar. And they’ll come to me with like, oh, we like that website. I’m like, okay, I can get you something that’s similar to that. So then it’ll normally end up being,
if it’s a really robust, like lots of different, you know, pages, custom post types, like we’re doing a lot of real designing, templating, wire framing. Probably best to start in something like a Figma. If you can even one up that, something that kind of integrates with WordPress. For instance, ACSS and Frames: There’s a Frames for Figma that was just released again. And you can build in Figma. It’s all very similar. You can build in Figma and then kind of bring it into your environment, in Bricks using Frame. So if you can find something like that, that’ll even speed it up more. But I would say, the more the larger the website, the more I would move towards
a design tool. If it’s a less involved website, less things going on, smaller budget probably. I’m not gonna lie, a lot of times I’ve just gone into WordPress and I’ve used a templating library – whether it’s Frames or something else – and I’ve just created the wireframes essentially in WordPress. Now, there are some disadvantages to that. Sometimes it’s objectively kind of harder. If you took a designer and a web developer, it’s harder to go into WordPress, drop everything in, and then maybe you have to move things or change things. It’s easy… We’ll say it like this: It’s easy to get distracted with all the things that you could do. You know what I mean? In your WordPress environment versus just being in a still, a sophisticated platform like Figma, but you’re not worrying about any of the functionality. Most of the time you’re just worrying about complete design. So to me there are tools now that enable us. And temporary template libraries and things to jump in and go that route. Not saying I recommend it 100% of the time, but I would say that a lot of the projects that I’ve done, it’s just like, you know kind of what you want. I can make that for you. With just starting out from that type of wireframing, and then you can kind of tweak it from there, because you’re going to have to make it your own anyway. If you have a design background, I would definitely do that. I would charge for that. Because, you know, it’s a very valuable thing and it can help way more before you go in there, because now you’re getting into the realm of… One last point on this: When I said design phase, you though it’s on the website, you have to distinguish what the design phase is. Because you don’t want to get into a situation where the revisions just flow into the development portion. You have to manage those expectations and your project, your process has to be good. Even if you’re doing it in WordPress and not a design tool, would be my main thing if somebody was trying to take away from that part.

Thomas: Yeah, I always try to have at least a small design phase before starting a project. Because first of all, I want to create obviously the design system. Especially, since we’re working with Full Site Editing now, where we have some kind of design system. With Greyd, we enhanced this quite a bit. So we have a proper scalable, responsive design system across all screens. But especially for that, I will pinpoint down like, okay, what is my spacing, grid, font sizing, color space, all of these parts. And then I start building again with these wireframes like you have in Frames, for example. Starting to build out the structure of the website. But that’s only my approach. Would be interesting what do you think about that. I try to get the client in the project as soon as possible. So we can already feel like okay, this is actually a website. If I, open it on a tablet or on a smartphone or on a desktop. Okay, so that’s kind of the user experience. And so over time, we then adapt, or we build out the frontend design, so we refine it more and more. Because, as I mentioned before with the post type part, we need to make sure that structure and the whole outer wireframe of the website is finished. And then we can talk about specifics. Maybe increasing the gap, sizing a bit or padding and margin, refining fonts and stuff like that. So that’s basically my idea, how I build this. So, talking about when to bring the client into the projects.

Mark: Yeah, that’s another good one. I mean, I think I’m pretty much with you in the sense of, as soon as possible. I think there’s maybe a little bit of a window there, obviously, you know, technical setup and things like that you’re going to obviously do. Once you have something to maybe show them, specifically on the web side of it, you know, once you get into the website and can show them something there, that makes total sense. If they’re in the, you know, in the design phase and everything, obviously. I think the most success that I’ve had is when we do go through the design phase, generally projects take maybe like 6 to 8 weeks, like for a standard one, we’re having like a weekly meeting just to kind of keep up and everything like that. I mean, we didn’t even talk about getting the content from them. That’s like a whole other thing. If they’re doing the content, if they’re giving you any content at all, which is always potentially a nightmare, right? So you have to make that decision. And I think the sooner you can get that, the better. Because when you’re laying out your designs and things, it’s way easier to have the content fit that into a design that you’re molding, rather than putting a design together and then being like, no, I need these types of images or this type of text, this length of text. There’s a lot to be considered there. So I do like the idea of getting them involved as soon as possible. The thing that I would echo
just again, from personal experience is consistently, from the get go, manage expectations of what you’re doing, like the actual scope of work. Because whatever your proposal said that you need to do, you can adjust that. But the deliverables adjust with the price. So just make sure that that’s always a thing in your mind as an agency owner or a freelancer. That’s the biggest thing that’s happened to me and so many other people that I talk about, is they just want to provide value. And they’re not like, you’re going through this process, you’re getting people involved, you’re having these weekly meetings with your clients, and they’re like, hey, can we add this, this, this? And you’re just like, well, I guess because we haven’t actually broken ground maybe yet on the WordPress development or whatever. It’s not like that. I mean, it’s tough to be, you know, kind of strict like that sometimes. But you just got to continue to do that. And I mean, again, getting them involved I think really does help that because the more you talk to them, the more you can still understand. And maybe, even later in the project, you can be like, hey, I know we said we were going to do X, Y, and Z in this proposal. Why don’t we do A, B, and C as well? You know, obviously it’s going to have some budget implications. But if you’re actually on their team and you know what they want, then you can make those recommendations and it’s going to feel better, because you know that you’re actually providing value and you’re going to make more money because of it. They’re going to be happier. They’re going to feel like you actually care about their project. And they’re going to see you more as what I was saying earlier, like an expert and a leader on that project. I think all the stuff is a little abstract if we’re just talking about at a high level. But I think when you’re in it and you’ve done it a few times, you start to realize like, okay, this is actually what they want. You know, they might not want to pay more money, but if they’re getting more value, they do. They do want that. So, a long winded answer there to say that I like to get them as involved as possible. And I think that ultimately ends up being better, you know, throughout the project and beyond. Really.

Thomas: Yeah. I mean, at the end of the day, it’s onboarding the client. You have to get the client on board,
that speeds up at the end of the day your process, because the client does not ask any strange questions,
because he knows he’s in the process. He sees how the actual website or the project is built. Yeah, in my, past experience, it was often in a way that the client at the start of the project, they even didn’t know what they need in their website. So this is as well the process. And yeah, first of all, you can speed up the building process of the website. And you have a better understanding of the client, you involve with the client, you get involved with the client so you can make sure, okay, the next project they make with us as well at the end of today, because you’ll get professional and you help the client to achieve his goals at the end of the day.

Mark: Yeah, that’s it.

Thomas: All right. A little switch off the topic, because we definitely need to talk about that. Because it involves us. And I’ve seen it today again from Matt. And I also I thought, okay, what is he doing now? So, what do you think about new technology? We always are at the brink of all the things, with Bricks, with the Block Editor,
with Full Site Editing and so on. We always try to integrate new technology. So. Okay, I say it. It’s the best, buzzword. Sorry for that. What about AI and the whole building process with AI? When it comes down to websites, how did you implement AI already in your process?

Mark: Yeah, that’s a big one. So, high level. And then I’ll get into that. I would say, high level, I’m trying to embrace it as much as I can, as much as I can stomach embracing it to a sense. There’s so many avenues. I’ve thought of so many ways that AI can help me. We’re at this point right now, in late 2024, where there is an abundance of tools. But they’re all very, you know, absolutely they’re very new, right? Like relative to when ChatGPT first became the big one as a consumer, right? It’s been going on behind the scenes, but now they’re very consumer-accessible. I think that if you, if any of us in our industry or beyond, think that AI is not going to change the way that we’re working and used to work, you’re probably not on the internet. You’re not looking
at these types of things, because it obviously is. I mean, people are coding with it. I’ve coded. One of the ways I’ve worked with it is Ion my personal website I wanted to show when I was live on YouTube. I don’t know how to do that. So I asked Claude, how do I create a WordPress plugin that pings the YouTube API every so many hours or whatever and says, hey, I want to just display a dynamic condition in Bricks and a dynamic tag and everything
like that in there and utilize that. So just poking into the Bricks API, poking into the YouTube API, something like that. Not difficult for somebody that knows what they’re doing. But for me, I didn’t know what I was doing, and Claude was able to just walk me through that process. Takes a little finagling, but coding, even for a noob, is like very, very accessible. Now, I’m not recommending it on a large scale necessarily. So I know what you’re doing. But the fact that we can even do it now is very different. So that’s definitely affecting my workflow. I’m not gonna lie. It’s heavily affecting my workflow in, just standard speed up tasks, like if I’m doing a YouTube video or if I’m doing anything where I need to summarize. I did this the other day. Summarize a meeting. You just take the transcript from wherever it is, you throw it in Claude and you’re like, hey, was I supposed to do a couple things? I think this person told me they wanted a couple things done. It tells you in a second, the highlights of that. You don’t have to rewatch the meeting anymore, relisten to the meeting or anything like that, or reread it. And then the other big one would be speeding up. I guess it’s kind of just that. Speeding up the workflow
specifically with all that. But I just think that AI is coming. If you’re scared of it, it’s understandable. But I think you kind of need to get over that fear. What I would say, though, is, I don’t think it could be a bad prediction. I don’t know, I don’t think it’s gonna take over us and jobs and things like that. I just think it’s going to make our jobs easier if you embrace it. And we’re always going to have to continue to adapt and things like that. And, you know, I’m on the younger side. I know that I have a lot of time that I have to deal with this. I might as well kind of like at least try to play the game a little bit and understand and see and utilize as much as possible. But I mean, we’re seeing it all the time. Like, I’m not saying Claude writes fantastic copy, but it can write copy, especially if you treat it like a copywriter. That’s the other thing, too with AI. AI is only as good as you are a prompter to it right now. And if you’re a good prompter, then you can get some good stuff. But you know,
some other people will be like, oh, this is crap, because I’m not getting anything out of it. Because I’m not
kind of utilizing it right. It’s a tool, just like anything else. And those are some of the ways that I’ve tried to embrace it into the workflow. There’s probably countless others that I haven’t looked at just yet. That’s kind of where we’re at so far.

Thomas: Yeah, it was for me as well back then, as Chat GPT came out. Okay, okay. New tool, new, something to play around with. Meanwhile, I mean, I use it on a daily basis. Definitely. Because if you need some placeholder text or placeholder structure. Also, while I’m building a website, I let Chat GPT do its work. Okay, just copy & paste in the material and then I’m basically done. So for these little tasks which tend to use too much time, but are not specifically to the process of building the page, for example, or building a structure or templates or anything else. I could, give this to Chat GPT, for example. It does the work and I just copy and paste it in. I mean, we saw it heute, today. Sorry for switching to German. Matt, like with the post structure at the end. Yeah. So, if you manage to set up the AI agent, which is the new thing now, so the specific chat, okay, please react like this
and you train it, you can really use it as your second workforce.

Mark: Yeah.

Thomas: It will not replace the designer or the web designer, but it will make us better and way more efficient at the end of the day.

Mark: Yeah, definitely can’t agree more.

Thomas: All right. I think, when we’re talking about all of these topics. So, web design and page building,
there are a lot of different tools out there in the market. I mean, you’re on Bricks. But I, I think I read it yesterday. There is a new tool, GutenBricks. Have you already used it?

Mark: Yeah. GutenBricks. Yeah, I did a live stream, a couple months ago with the developer, Ryan Long. Ryan? Definitely. Ryan. I think it’s right. Ryan Lee. Sorry, Ryan. Sorry about it. Ryan. Great developer, a great developer of GutenBricks. He developed, you know, a tool for Bricks and Gutenberg and it basically kind of sits in the middle, so to speak. Because the concept is that the the Block Editor is more of like for everyone, an easier experience. Right? And some people obviously debate over that. But more or less it is more ubiquitous. There’s a lot there. There’s a lot of really good redeeming qualities about the concept of everything behind that. Obviously, you guys know that at Greyd. You are leveraging it highly. And the concept is though, that Bricks being a new upcoming pagebuilder that’s kind of outside that realm of Core. People want that similar experience, because like we were talking about earlier, it’s not very easy for me to give anybody access
to anything in Bricks. Bricks doesn’t have components as of, you know, us recording this right now, it’s still coming. There’s a lot of different, things kind of there. And again, just throwing somebody into the Bricks environment is a little bit like throwing them behind the cockpit of an airplane. So there’s a lot going on there. But what GutenBricks does effectively is just kind of compartmentalize and componentize a lot of Bricks designs. So you can kind of build things in Bricks and then basically come over into the Block Editor and Gutenberg experience, and you and the client would only have certain access to certain fields or button texts and things like that. So not like a new concept necessarily, but something that’s gaining a lot of traction and different builders and stuff like that. But for that integration, it’s been pretty great for a lot of Bricks users. And really just people that want to enhance, curate that experience for their clients. So, yeah, Ryan’s doing a lot of great work. And I think people are following suit, too, you know? I mean, the component idea. I mean, you see it
even Core now with, I think partially synced patterns, like all those different pieces. It is a need that agency
owners have, anybody building sites for anybody else, or even if you’re building your own sites and you just want a quicker interface to change different things and have, you know, component ties, things, that’s really important.

Thomas: Yeah. I mean, the basic idea behind components, we have it in Figma, obviously as a design tool. So you want to do or change your designs globally. We have it in, okay, Adobe XD is now discontinued. So even I have to learn Figma now. Because I was an old Adobe XD guy. Yeah, we have it as you mentioned in in the Block
Editor coming slowly. We have it in the Suite, for example, with the Dynamic Templates. Because, you don’t want to reinvent the wheel all the time. You want to reuse your assets. You want to manage these assets centrally. Really interesting. So I have to, try out GutenBricks myself. Maybe you can teach me a bit.

Mark: We could try. We get Ryan to this.

Thomas: Oh, definitely. Perfect. So, let’s talk a bit about what we discussed today. So, from your perspective,
what’s most important thing when we’re talking to designers, when we’re talking to web agencies? In your opinion, what has the most impact that you can speed up your process? What are your ideas on that?

Mark: Yeah, there’s definitely a few things. And I think the first thing that I want to make is just a distinction.
Because I was thinking about this earlier. The concept of speed in web design and more so specifically to probably the broader audience of people that are building websites for other people. I think of speed as definitely kind of like a buzz word, definitely entertaining with the speed builds and everything like that. But I think in the context of an agency, it does have a place. I just think sometimes it’s miscommunicated, so to speak, which is no fault of anybody, but I don’t think of it as speed. I think of it as efficiency. And when you, in order to get efficiency, you don’t just get efficiency, you can’t even really get efficiency by doing more. Right. If you’re just like better at doing something, maybe you’re faster, maybe you’re speedier. But in my mind it’s really two things. It’s history. And, you know, flexing that muscle and doing those things. The other thing that really sets businesses apart and agencies, developers is their process. And I mean, you could throw in tools as well into that mix. Maybe it’s a three prong approach. But the process is really the next, level of that. So we’ve talked about this, we’ve talked about it kind of abstractly. Right. Like making sure you’re not, you know, recreating the wheel every single time. You’re using your templates and things like that. So I would say that if we’re talking specifically about, oh, somebody comes up to and says, how do I make websites faster? How do I physically build them faster? You got to just think about like, what? Look at your last couple of projects. Where did you waste the most amount of time and how could you improve your process on each one of those? And you’re going to find 5 or 10 things automatically. Just like, well, maybe I could have a blueprint site, maybe I can have some more templates, maybe I could reuse those things. Maybe I could have my data structures that
I always use in place every single time. And those are kind of the main things. I know there’s a lot there, but I would say focus on the efficiency aspect of it rather than just the result of being speedy. And that comes from literally what you do every single time in your process. And the last point is a little more businessy, but you got to think about what you’re actually doing from project to project. Meaning, we were talking about it earlier, what kinds of websites are you creating? When I say that I like the complex websites, those are not easy to produce in fast quantities. They’re harder than the smaller more straightforward websites because there’s more things going on. We’re talking about planning your data structures and all that sort of stuff. There’s a lot more time and energy that goes into that. Hopefully you make more money for those builds, but if you’re focused on a specific process and repeatability and everything like that, you may also want to consider doing things that are more repeatable just by their nature, which tend to be more basic or just simpler in general. And you can always scale from there would be my recommendation on just how to make things faster, and improve your process overall.

Thomas: Sometimes, you have to go a step back. Give the whole project or the whole process a big picture and think, okay, what are the tasks I do over and over again? How to make them more efficient, how to leverage stuff like dynamic data, how to build it out properly, how to build maybe your own templates, your own presets, your own
blueprints in a way that it’s later on really easy to alter, to change specific parts. So, if you change the colors, if you change the padding, margin behavior, animations, I mean, you can always build the proper structure before, just with the input data. But when I talk about Gutenberg, the right blocks in the right place and then afterwards you just refine. And you have to reuse that all the time. And over time you always see, okay, maybe I need another custom field, maybe I need this. And then you can update your process over time. And so, over time you get more and more efficient. So, basically some day you’ll have own theme, your own basic theme,
maybe per branch, per type of projects. And you have always a proper starting point, where you can push out your project.

Mark: Exactly. It.

Thomas: All right. So, we wrapped everything up together. We talked about how to actually be more
efficient as a designer, as an agency. And, last thing I want to talk about now is, I want to invite all of our guests. So, first of all, if you liked the session, please subscribe to our channel and definitely subscribe to Mark’s channel, because he is not only a YouTuber, he is a Bricks enthusiast, he is a WordPress nerd and a really fun guy to watch, definitely. And if you want to watch the next episode, it’s with Jakob, Jessica and Sandra, and they’ll talk about Websites as a Service and how to build this in WordPress. So, see you next time.

[Music]