Open Channels FM
Open Channels FM
From Visual Experiences to Performance Gains in WooCommerce
Loading
/

Robbie, Robert and BobWP have a fantastic conversation with Krissie VandeNoord where she tells us about integrating 3D visual customization into clients WooCommerce sites, and Chris Mospaw, who talks about one of our favorite topics here, WooCommerce performance.

Show Transcript

Robert: Great to be here at our favorite WooSesh. it’s great to have Chris and Krissie. I didn’t get to catch a ton of Krissie, and my first question, is A, how did you like putting it together? It was great.

Krissie: Putting the talk together? I loved it. I totally took advantage of — I don’t know if people listening know, but Brian offered the opportunity for us to meet with a speaking coach, and I totally took advantage of that opportunity. And I feel like it really helped me to solidify things and make it more, like, I don’t know relatable, personable. Yeah. It was fun. And it was fun because this was a project that launched in February, but we’ve been kind of rolling pieces of it out over time. And so, like the actual eCommerce part of it just launched in August. And so, to then be at this point where I was like, trying to recap all of — the project. It was just like a nice little — it was a nice point in the project to kind of think back over things and try to put it into words.

Robert: There are actual secrets to making these WooSeshes, and Krissie ruined it for all speakers in the future.

Krissie: If you’re ever a speaker, take advantage of the speaking coach.

Robert: Absolutely. I loved hearing about the project from all its, you know, aspects. That is a huge project. I mean, obviously, like you just mentioned, it’s been done in phases and whatnot. What do you think made it a great topic for WooSesh?

Krissie: Um, you know, I think there’s a few things that made it a great topic for WooSesh. And I think one, obviously, like a lot of people are rethinking eCommerce right now, you know, because eCommerce is so prevalent. And so there is definitely this how do I stand out? Between all of the other potential eCommerce sites? And, you know, also, I think that the — we’re moving so much with technology towards virtual reality and augmented reality and this 3D environment, and so, the idea of marrying like eCommerce with this 3D world, which by the way, Shape Diver does have the ability to do some augmented reality stuff.

I haven’t dived down that route too far, but it’s intriguing and I’m kind of like, what can I do? I need to find a project that will let me explore that. But then, also, just the complexity of thinking about the client as a user and just their specific business model. I think is potentially a little BITD different than what maybe a standard WooCommerce store is. And so, just presenting all of the different options. I think —

Robert: Very cool. I appreciate so many weird aspects of it. I love the ERP stuff, dealing with the internationalization. These are great topics that, you know, can be done and I guess, you know, not super insanely. Everyone can kind of dive into that. I know Chris dove into performance, which everyone needs to kind of, you know, take advantage of. I’m going to hit you up with the same question, you know, what made this, you know, everyone talks about requirements that every single Woo or anything web conference, what do you think made it a standout presentation?

Chris: Well, I think it’s an important thing to consider for any website. Even if you’re just starting out and maybe, you know, plan to have a couple of dozen visitors a day, or at least that’s how it grows and moves on and on and on. But it’s a consideration that really needs to be the forefront of everybody’s plans as they get a site going. So that’s probably why it appears at most of the talks and conferences because it is truly that important. And you know, as great as WordPress is, as great as WooCommerce is, like I said, they’re just not optimized for that performance out of the box. I was hoping not to just solve performance issues for anybody in a 25-minute talk because it’s truly impossible. But to give them an idea. Here’s a couple of seeds, let’s plant them. Let’s move you forward or get the ideas going. So, you know, the quick win.

OK, here’s something you can do that will actually have tangible benefit right away. But then, let’s move on to more technical stuff you might need to get help with it, hire an expert, get some coders in place. It really boils down to user experience, and I think a lot of sites and a lot of website owners forget about that user experience, you know, performance is fantastic. But what you get out of the performance is truly what’s important. You get happy users. You get people that want to come back to your site. You get people that want to purchase the items that you have for sale. So it’s one of those things that it’s important, people talk about it. But it really should almost be invisible. It’s like the utilities you have, you know, you flip on that light switch, you expect it to work. You don’t want a 4-second delay when you flip the light switch on and the lights come on. Or worse, you flip the light switch and it doesn’t come on. Even though 99.9% of the time they’re working fantastic, the light doesn’t come on, you’re cursing them out for generations in the past.

You don’t want to pay the bill. It’s a horrible thing. So really, it all boils into that user experience. You know, does your store when somebody flips the light switch, does it give you something right away and give them what they’re looking for? Because if it doesn’t, then you really do need to dig in and figure out how to move that forward. Hopefully, you know, like pushing the rock up the hill. I pushed it up and, you know, can move things forward and one day, that rock’s going to go over the other side even though it never happened for him.

Robbie: And they curse and go leave a bad review somewhere.

Chris: Yeah, if you make a user angry enough, not only has that user experience, but it could chase away others. That’s a disaster.

Robbie: Yes, it is. I’ve got, now, a question for each of you, but Krissie, I’m going to start with you. And yours has to deal with the project you covered in there, which was fascinating. But my question from you is, I believe that was first time your team had done that 3D modeling in the WooCommerce cart. But how long of a period did it take you guys to develop this project? And if you had to repeat it, do you think you could do it faster? Because I know some of this was a learning curve. Right?

Krissie: Yeah, for sure. It was actually not the first time I’d implemented this 3D with the cart. And so, that was — the company I bought my table from, I redid their website and they have this, as well. And so, there was, obviously, not as much learning curve this time around, but it was kind of like a — how could I do it better this time? And so, even though maybe there wasn’t the learning curve this time around, there was definitely that I want to make sure that I’m like optimizing this. Now that I’m not learning, I want to make sure I’m doing it in the way that I can take it to kind of the next level. And you said — oh, how long of a project? So someone asked me this on Slack in a direct message. And I think that’s a great question.

So ultimately, we started that project — I’m trying to think. August of 2021. And we were going to launch like January 1ish. But we delayed because the person that was doing the 3D modeling just the amount of models that were needed to be created. And the how many they wanted to have done it launch. And also coupled with them just kind of navigating some of their own like business and dealer management stuff. Like, we ended up launching in February because they were like, we just want to make sure we’re in a — everybody’s happy right now. We don’t want to — we want to make sure we cover all of the basis so when we launch this, it doesn’t create a disruption to just like that kind of pace and happiness they were — the dealers had.

Yeah. So we’d been working on it for a year at this point. And like we said, we launched in February. I always encourage my clients to launch at the point in time where their site meets or exceeds what they had before. And then, to continue to iterate. And so that’s what we did here.

Robbie: I always encourage clients to do that, too. It’s just as good, in my opinion, flip over. So yeah, great. And so it’s interesting that you did mention that modeling is something that you will have to take into consideration in your timeline for projects like that. Interesting.

Krissie: Yeah.

Robbie: That was a very fast from start to launch, that’s a pretty quick timeframe in my opinion, for a site like that. Kudos on that.

Chris, so one, we all love, we were talking about this before, in the green room, we all love that you gave everybody the here’s a plugin, plug this plugin in and it’s going to take care of all of your AJAX cart debris as it were. So we love that you did that. But what I was really interested in is you dug into and talked about transience. I know in that short of a talk, you can’t really dig in on that, I understand. But where would you recommend someone to start if they want to really tap into transience and WordPress and utilize it to speed up their site?

Chris: The first thing is understand that transience are exactly that. They are transient data. They are temporary. But once you get into that concept and absorb, hey, this is what a transient truly means. The WordPress codex is excellent. Certainly, it is for coders, so as a casual user, you’re probably not going to understand how to do that. But if you’re at the point where you’re diving into a plugin or writing your own plugin or theme and interacting with the WordPress code itself, just getting to the transience codex and reading through it and playing around.

Set up a local WordPress instance and play around with it. Look at what happens in the database if you have that depth of knowledge to see how the transients are stored. More importantly, look at the example I gave a little bit contrived with grabbing the temperature and takes a full second to get it. But it was deliberate in that, hey, you know, this second is a very big delay. But do some testing along with the transient. See what that gives you. You know, use my temperature example if you want. It’s easy enough to get temperature from various places, I’m sure there’s plugins, actually, that will get it for you, as well. But then, dive deeper into what — what do you need to find? What do — what information do you need to store in the transience? And what’s the lifetime of that information being useful?

The temperature may be minutes, if it’s 84 and it goes up to 85, I don’t think anybody’s going to notice. So that temperature’s got a very long life on it. You know, if you’re doing something and again, totally contrived example, but a minute. So if you’re tracking minutes of something, you know the life of that is 60 seconds. Figure out, what do you want to store in transience? WordPress handles the whole system really well. You can give them a life as far as how long it needs to. And it takes care of garbage collection so you don’t have to worry about a lot of stuff accumulating in your database.

Robbie: Excellent, excellent information there for people. Whether a coder, or not, Chris, we had a project and we were pulling in information from a client’s manufacturing facility. And we needed to show that on a regular basis. But inside of their manufacturing, they only updated this every 6 minutes anyway. So we set ours up to be a heartbeat after the 6 minutes on a 6 minute — we were keeping up with it. But we didn’t have to do it, like you said, every minute or every 2 minutes. We could look at the data and understand where that data needed to come in. But I think people whether they’re a coder or not, understanding the capability exists lets them talk to their coders more logically about this project.

Chris: When caching data, understand as you ask for that new value, you may not get something. And that’s one thing I didn’t touch on really didn’t have enough time to get into it. But, you know, for the temperature, that service might be down for a few minutes, a few hours, a few days. It’s obviously going to cause your data to get stale. But make sure you get a good value back before erasing the one that you have cached if you’re replacing it. And always make sure that something can live beyond its useful life in case that external source isn’t available for however much time. There’s tricks to that. Get that information first and then replace it.

Krissie: I troubledshot an issue for a client where all of a sudden the — there were certain shipping destinations that were being charged nothing. And it’s because the shipping API had delivered a random freakout something didn’t work right. And it had returned zero. And then, it was — saved in a transient. And so anytime somebody in that ZIP Code was purchasing something, it was giving them shipping for no cost. And it took some digging to figure out what was going on there and get it cleared out. But to illustrate your point, make sure you have a legitimate value before you get rid of your old one.

Robbie: It could cost you money there. Huh.

Robert: Especially if you’re shipping couches.

Krissie: Thankfully, this was not a client shipping couches. It was international shipping, so it was a small package but it was going far. So it still mattered.

Robert: I mean, this brings up a whole great point about I love APIs and all of their wonderful worlds, but it’s like belt and suspenders for everything. You mentioned don’t clear out the cache, I remember add/dropping classes in college years ago. Don’t drop until you have another class. But also, you know, how do you manage default or nonexistent values? Do you have defaults? A default could be as simple as, hey, this isn’t working right now or we wish it was 70 degrees or, you know —

Chris: Well, I think in the shipping, probably calculate, OK, this is a baseline cost we’re going to have and have that as a relatively sane default. But yeah, always KPCHT you’re going to get bad data or no data. And that could be a web form and that’s a whole other conversation for hours and hours. Never trust input. But also, don’t trust that the API is going to deliver what you ask for.

Thanks to our Pod Friends PeachPay and GoDaddy Pro

Bob: I have a question for everyone, actually, and I’d be curious about this. I went to the side, of course, Krissie during your talk and I had to get in there. And what was amazing — as I was rolling the bed around different views, I thought, oh, this is what my cat sees because I could see, actually, underneath the bed. And that was kind of fascinating to me. I’ve never really — I usually don’t crawl under our bed. But for each of you, what I’d like to ask is, what aside from furniture, what would you really want to see in 3D as far as a product you might buy online? I’m going to start with Robert.

Robert: Oh, thanks. Well, so, my big hobby is cooking. And sometimes there are specialty foods, you know, like maybe you want a specialty meat from a certain place or whatnot. It would be kind of cool to be like, oh, this is what it’s going to look like. I can tell the thickness. I can tell the weight. A lot of products like, OK, everyone was maybe doing that early access prime madness recently. How many of these products don’t actually have weights? I think having that information would be helpful and then being able to spin it around so I can actually tell what a 5-pound tenderloin looks like. And maybe just for educational burns when I go to the butcher I don’t feel as foolish and confused like, that’s, I guess, pork or that’s lamb and I couldn’t tell the difference.

Bob: I would have never expected a hunk of raw meat. That threw me off, but that’s great, yeah. I appreciate that. Krissie, is there something for you?

Krissie: I actually have two answers here. And one of them is glasses. Like, eyeglasses. Because I’ve been — they have the virtual experience, and you can see — try it on and stuff. But what you don’t get to experience, like, with how it’s set up now is — I have a really thin bridge to my nose. And so that measurement is like the most important measurement to me. And so, being able to customize your glasses to those kinds of measurements, I feel like that’s what I want right now.

Bob: Mm-hmm. And the other one?

Robert: Maybe the 3D question is, what do we need 3D’ d at home to inject it into our web? Like Krissie face.

Krissie: Well, so — because Shape Diver, you could create something that you could customize like that and download the file to use in your 3D printer and actually print something out that you customize. That technology exists with this platform. And so kind of along those lines, I follow the ceramicist who does these molds, creates these mugs and things, pieces of art in 3D and creates these molds that he pours a porcelain, you know, slip into and creates this — so that to me, oh, I want to see that in 3D on his site and be able to make some customizations to it and — he’s already working in 3D.

Bob: So the list so far, raw meat, glasses and ceramics. This is getting good. Chris, what can you add to the list?

Chris: It’s going to get far worse.

You know what I’d like modeled in 3D in the actual sizen O the internet is me and anybody to have their body. Clothing is difficult to purchase online. You know. I’ve got some 4X shirts, I’m a big guy that are tight on me. And I’m not that big. And I’ve got some 2X shirts I’m swimming in. So I don’t know what size to buy. But having my body scanned in 3D P ask then going to a particular vendor and saying, you know, I like that shirt, what size do I need? Or if they need to customize it, you know, how is it going to look with this customization or that customization?

I think that would be revolutionary. It would cause me to buy a lot more clothes online. And I know a lot of sites, OK, you can take 4 or 5 measurements. But everybody’s a little bit different. You know, I might have a lump somewhere that nobody else does or whatever it ends up being. But it’s — having that. And then, that kind of goes into the tactile. I also want to know, how is this shirt going to fit? How is it going to drape on me and all of that? You know, certainly a burlap shirt is going to be far less comfortable than a nice silk shirt or whatever it ends up being. I want myself digitized and out on the internet.

Bob: We add Chris’s body to the list. And we’ve got to hear Robbie, what’s going to be the topper here?

Robbie: I was going to say, I don’t think I’m topping any of theirs. Personally — I want anything that has plugins or ports or things like that on it. I want to be able to spin it around in 3D and be able to see where they are, how they’re positioned all that kind of stuff. Nothing’s worse than when they just don’t even — maybe they have images, maybe it’s a traditional shopping cart and they’ve got lots of photos of the device you’re going to buy. They have a close up and showing you, well, they’ve got all of these ports, that’s great, that’s going to work and you get it and the ports are positioned where you have to go behind a piece of plastic and this doesn’t work for my setup.

So to me, I want all electronics done that way so I can see them and then I also, though, I want that next step, I want them in AR, be able to pull it out and look at it in my room, where I want it, things like that. But I have some good news for Chris and that is I’ve been to — I used to go to a lot of AR/VR conferences and they do have body scanners and went through a booth where they scanned you and then when you walked in front of these mirrors, you can say, I want to try on these clothes and literally put the clothes on you in the mirror. It was amazing. Now that technology is super expensive, right? It’s not something happening in your browser yet, but since it can be done. We know that it can be done. Just like when we started with the showing the furniture, IKEA came out with an app and you can show the furniture sitting in the room.

It was brilliant, you had to have an app and camera that can handle the AR all of that stuff. Now we can do that inside of a shopping cart. I the go into Amazon and say, hey, let me see this chair in my living room. We can do that in the browser. What they’ve been working on all of these years on bigger and more expensive pieces of electronics, they will whittle it down and we’ll be able to pull it in and use it in websites, which is cool, I think.

Bob: I always thought it would be breasting to actually have a 3D site with nothing but round balls and solid colors. And that would totally confuse anybody of why they would have the option of a 3D view. That’s just what I’m thinking. So the next time, you know, I have nothing to do and I’m tired of watching the grass grow, I could get on that site and basically rotate balls for no apparent reason at all with no goal in sight. That would be my site.

Robert: I think you have a whole new audience for Do the Woo, now, Bob. Everyone’s wanting to know what goes on, on a weekly basis.

Robbie: We just go in there and spin little spheres in space. That’s what we do. Yes.

Bob: So to close out as we — do you have one more thing you want to do here, Robert?

Robert: Yeah. Before I got totally sidelined by the Bob and ball show. The — there was — I decided to merge two ideas one from Chris and one from Krissie, Chris was talking about APIs, Chris you had a great section about integrating with email and how you’re getting information back and forth to the customers and that sort of communication fly wheel almost, I have not heard anyone say anything about communicating with the developers when things go right, wrong or whatnot. These API examples can’t we just have something in there that says hey developers?

Krissie: So, I’ve actually — done something like that for a client site. I integrated an API and I was working with a third party vendor that wrote the API specifically for this client. There won’t be a widely distributed. I’m the person that’s testing it for them. I just built in a little thing that when I get an unexpected result back, it sends me an email. And nobody else knows that happens. But I can then be, oh, that’s a problem we need to solve.

Chris: I think all APIs should have really good documentation. And unfortunately, it’s the last thing that happens. But at the very least, you know, what’s the default value? Or, you know, here’s the stuff that’s going to go wrong. We’ll assume that we’re going to get good information back. And we know what that is, but when things come back and they’re not what you expect, here’s at least the format you’re going to be given. And hopefully, that prompts the developers to think through, well, gee, yeah, maybe this isn’t going to come through and plan for that. I think developers are optimistic in a bad way, sometimes, because they’re just going to assume everything’s going to go right until it doesn’t. And then, they have to scramble and fix it.

Robert: Or they’re rushed.

Chris: I’ve never seen that happen, but yeah, I guess it could.

Robert: What you’re saying is there’s got to be automatic way to handle bounds catching. Sorry, I was just curious there.

Robbie: And Krissie, we sometimes do what you do, too, we call putting the bell on the cat. If it jingles, then we hear it.

Robert: Love it.

Leave a Reply

Logo of 'BackTalk' featuring stylized text with a blue and black color scheme, accompanied by sound wave graphics.

Get our newsletter, BackTalk, the sharpest ideas, honest moments, and quotable insights pulled straight from our conversations across OpenChannels.fm.delivered to your inbox every Wednesday.

Discover more from Open Channels FM

Subscribe now to keep reading and get access to the full archive.

Continue reading