Welcome to the BIMTech Podcast. In this episode Adam sits down with PixelKicks lead designer, Luke Ratcliffe to talk about the importance of collaborative working in web design. Luke goes through the website design process and how working with BIMTech Media helped to streamline the design process and even improve it! This and more on Episode 3 of the BIMTech Podcast. Enjoy!
Welcome to the BIMTech Podcast. In this episode Adam sits down with PixelKicks lead designer, Luke Ratcliffe to talk about the importance of collaborative working in web design. Luke goes through the website design process and how working with BIMTech Media helped to streamline the design process and even improve it! This and more on Episode 3 of the BIMTech Podcast. Enjoy!
Okay. Welcome to episode three of the BIMTech podcast. Today we're going to be talking about, well we've talked about before. It's the website that we've been working with Pixel Kicks on for the last. We were just talking about this, it’s since September, isn't it? And today we've got Luke Ratcliffe on from Pixel Kicks and he's the lead designer and we've been working with him for that amount of time now. And we've just come pretty much to the end of design phase, haven't we? So we thought we'd get Luke on and just talk about what Pixel Kicks does, our experience with them and Luke's experience with us. I'm sure he's got a lot to say about working with us. But yeah, no cheers for coming on today Luke. No probs. Yeah. Yeah. So if you give us a bit of an idea of what Pixel Kicks does first and what your role in the company is, and we'll sort of go from there. Yeah. Okay. So Pixel Kicks is like a digital web agency, I guess you could call it. So we do websites, digital marketing, Branding, anything like that really. Yeah. Wide spectrum. I think it's been going for about 10, maybe 11 years. I know there's two people at the company that have been there for 11 and Chris maybe started it a little bit earlier than that. But I myself have been there for almost two years in April, so not that long really. And you’ve been working with us from September. Yeah. So you've had, well I imagine you've had quite a bit of experience working on quite a few websites for Pixelkicks so far. Yeah, I think I've done seven or eight now in total. Right. That have gone live and there's probably a few more that are coming as well. And that's quite a range of different industries then? Yeah, a whole wide spectrum. So, in terms of the different sectors that you've done and the websites that you’ve created, is there one that stands out to you before or... Obviously I’ll keep us out of it. But is there any before us that you've sort of thought, ah, this has gone... You know, this is probably one the best projects I've worked on? There's not really one that's been a favorite, although I will say the stuff that we did for you that has been by far some of the most... We didn't tell him to say that. You didn’t no, no. It's been by far some of the most explorative stuff we've done. Partly because of the way we worked I think. But we’ll probably come on to that in a bit. That's one of the reasons we're doing this podcast is because... Yeah....we think that the way that we worked with Luke it's probably one of the best ways to work within design, I think. Yeah. But I suppose another question for you then is, is this something you've always wanted to do, design and website design, or is this something that just sort of came about? So when I was in like early high school, my path was the Royal Air Force. That was... Oh right. That was what I wanted to do. I wanted to join the airforce, be a fighter pilot. But obviously vision let me down, you need 20-20 vision for being a pilot. So, well Air Force pilot. Yeah. So I’d always had an interest in design anyway. Originally I was kind of thinking about 3D character design. So like 3D studio Max at the time I was kind of getting into that in year 10, year 11. And then sort of just fell into doing graphic design from that. I had a great teacher in school and then when I went to college after that, that's when I kind of came into the focus of doing pure communicative design. Right? And then your path to Pixel Kicks was? Was there anything specific that you did before Pixelkicks that sort of led you to lead designer there or? Just working in the industry, because you learn kind of the approach to working at university, but you don't learn how to work. Yeah. If that makes sense. I get you, yeah. A lot of time spent making mistakes, a lot of time learning things and just absorbing everything you can from the people higher than you. Yeah. That obviously know a lot more than you do. Yeah. For you, what makes Pixel Kicks unique then in your experience of being there? Yeah. When we approached a project, like I said a couple of minutes ago, I tend to fully immerse myself in it. So... Yeah. Getting like a great understanding we're kind of given the ability to spend time with things and we're not swamped with five projects at the same time, that kind of thing. So when we actually come to do a project, we're thinking about a lot of things. We've done a lot of research into the industry and how best to position you and your new website to like cater to that. Yeah. So when we actually come to design it, we don't just design like the desktop or we don't just design a couple of pages and then we'll just take care of the rest kind of thing and you don't get to see it. That does work for some people. Not to say we can't do that, but in your case we kind of did every page and kind of approached every page differently. Yeah. So different sections needed to function differently across the site, but not only on desktop. We had to then think about how those things would work on tablet size and on mobile size as well. Yeah. We kind of always do that. So we always at least consider mobile designs for every desktop design that we do. Whether that's like the landing page, the services page, the about page, everything gets a responsive thought behind it and how it's going to scale. Yeah, I think that's what drew us to you in the first place, I think was when we came into the first meeting with Jamie. He took us through your processes and I think that was one of the big drawing points was how much detail goes into that process and the stages. So that was the thing about coming to you guys was we wanted something unique. We wanted something that had a process to it and gave us a really distinctive look. And I don't think you can get that without going to someone like a company like you and working with a designer like you. Yeah. And I think that's the drawing point really of a company like Pixel Kicks. I suppose that brings us onto the process really now, which is, I'll ask you first before we go into it, but on a typical process of a website design, I know we know like the stages, but... Yeah. When you're in contact with a client, what does it typically work like? Is there much pushback? Is there a typical way that sort of every project usually goes? Well, like you say, they all follow like the same milestones because that's how we kind of manage the project internally. Yeah. If we have our own internal processes and things like that, it helps us push it. I wouldn't say yours was that much different, really. There was, in the later stages and once we kind of got through the concept stage, there was a lot more collaboration, a lot more than what we would normally do. And especially we invited you and Ross into the file so that you could see in real time basically the work that was going on. That's not something we normally do, but... Right. And to be honest, I was quite apprehensive about doing it at first because I was like, they're going to be watching like every 5 minutes. They're going to be like, leaving comments.“Why isn't this done?” Yeah. But no, it was actually really good and really eye opening is the other thing I'd say because Right. on one of the last stages when we were doing, we were kind of focusing on that services page weren’t we? And I just spent like the afternoon just sprinting, put as many ideas as I could down of how that page could work and the different kind of processes we could use on it, different interactions. And then you and Ross just like jumped in and said,“Don't like this”, “This is amazing”, “Try this one”, “like this”,“working on this, so try that.” And it was great. Yeah. Really eye opening to how collaborative it could be. Yeah we talked about that. I think that there could have been a lot of back and forth couldn't there? Yeah. If we didn't know what was going on in the design file, you could of spent ages doing something and then we come back and we're like, actually... I don't like. I don't like. Yeah. So yeah, during those latter stages where you're trying to tweak and finalize things and really put some thought into them, to have us just like constantly there making sure that you're not doing too much in one direction and diverting you. I think you're right. I think that process works. Yeah, it did, yeah. Yeah. Well the testament is, it did. Yeah. So. Yeah. Well I know at the start of it all we also had like a couple of, like you said, meetings that the ideas got a bit like, I suppose. What's the word? A bit muddled. Yeah muddled. I guess we should talk about a little bit of the process shouldn’t we? Yeah. So when we start a project, we tend to sit down the key stakeholders. Get you all around a table kind of thing. Sometimes it's virtual and we just kind of run through like a digital whiteboard and so we have like loads questions. Normally Jamie goes through it like a couple of days before and drops everything that he spoke to you about in the sales process. Jamie was great at doing that. Yeah. He’s really good at handing over all his notes into stuff that I can actually work with rather than just like sales jumble. Yeah. So that's really good. So when we go into that meeting we’re then informed or I'm informed as the lead designer of what kind of things you've said at the outset that you're looking for in a new website. So in some cases it's like key interactions or like API integrations that we’ve got to think about, CRM integrations, things like that. And in other cases it's like, oh we really like this competitor website. We don't want to look like that or we do want to look like that. Yeah. So yeah, we kind of come into that meeting with all that in mind and then we go through like the process, what content you're thinking of putting on the website. Do you have like Google Analytics? Are you writing content or are you pulling old content across? What kind of design language like visual language do you like? What do you not like? You probably remember all this now, I was going through it and showing you like some old websites, new websites, websites that weren't in the construction industry at all. Yeah. Just to try and gauge what kind of direction you want to go in. So then after that meeting, I think I went away and then put some concepts together based on what we'd said. So I think we did get a bit muddled in that first meeting. Some of the websites we were looking at were very architectural, if you remember. Yeah. And there was like elements of those that you liked. So I was like, okay, so they like this, this and this. I'll try and mangle into some sort of BIMTech way of saying those things that you like. Yeah. So those first two concepts that we sent you. I still remember that meeting. Yeah. I feel like that meeting needed to happen really, for us to sort of start going in the right direction. And I think the direction it went after that meeting. Yeah. Was something we didn't even think the direction was going to go in. Yeah. Yeah, well, you came because of your design background. You came with your own designs didn’t you? To that meeting, so you were trying to steer us in more the direction that you had in mind. And then, like you said, I kind of took that and went off. Did our version of your version of things. Yeah. And then like you say that was totally not what you expected or further than what you were expecting... Yeah....it to look like. But yeah it did need to happen. Yeah, I think that sprint system as well worked really well, especially with like the navigation system. Yeah, we did a few didn’t we, so we did like the navigation system itself. We did a whole sprint around that. Yeah. And how that could work, and I kept sneaking the bars back in, if you remember. Oh yeah. We were speaking about hamburgers and, like, the normal way of doing a menu system and how we kind of did the whole sprint system around the navigation system and how it's totally different to like what most websites use. Yeah. So I'd be interested to see if you use something like Hotjar, like heat map software to track how people and visitors are using your website, whether the navigation system works for them, or whether you might come to see that they're struggling to actually use it. Yeah. With it being different to like the expected. There's a UX law, I can’t remember which one it is but it's like across the internet you see more and more of the same thing. So you expect the same thing when you come to a website. Right. So yeah, I’m interested to see. I think that’s it, I think we went a bit... We looked at different construction websites, similar ones towards when it comes to like BIM and CAD and stuff. And I think the one thing I think I struggle with is the idea of the projects pages being so large and scrollable where you’re just getting so much information and most of it is a bit useless as well to people who don't, you know, who are going there for a specific thing. Yeah. So I think when we first started designing it going in the right direction, we started looking at the project specific pages quite in detail didn’t we? And we came up with quite a cool looking projects page... Well... you did. No, we did it together. Collaborative working. Yeah well that’s it isn’t it, yeah. I think the projects page was one of the first pages we kind of looked at after that initial narrative home page. More so because you wanted to see how that page would work and like you say, reduce the amount of content on it. Yeah. So one of the ways of getting around that was letting you upload a PDF to that page so someone can, if they want like the full story or I don't know if your case studies are massive offline in PDF format, you could always upload one of them and if they want all that information, it's there, but on the website it doesn't need to be there, kind of thing. And then even at the end of the project, if you remember, I did a change to that project page which hid that text even more so then it kind of put that project imagery like front and center. And so it was constantly evolving, even bits that we thought we'd done. Yeah, I think that's one of the things we talked about as well is we were in the file weren't we? Yeah. And nearer the sort of well end of it. We were still quite active in the other file because you sort of like provide us with a figma file that we can look at progressively through the project. Yeah. But then nearer the end we were pretty much... In the file. Yeah. Deep in the file. Yeah. I guess we'll kind of touch on like the usual process with how we share work with clients. So normally we just share the prototype link. So it's not really like you're live in the file. You can't see the real time design behind the file, behind the wizard's curtain kind of thing. I was thinking of it in Oz. But with this project because I kind of knew that you had a design background, so I wasn't as apprehensive about sharing the access to the file. Yeah. I knew you wouldn't be kind of pushing for, like, feedback every couple of days or minutes or hours even. And I think having worked through it and seeing how powerful the collaboration side of it was, it's definitely something I'll consider in the future, whether we do that maybe a different way of not having people directly in my live file. Yeah. Just because it works both ways where quick feedback is good, but it can also be bad in terms of people just like instantly reacting to something. Yeah. And say well I like that. And then next week they might have changed their mind when they’ve thought about it a bit more or they see it again. When they've not looked at it for a week kind of thing. So I think there's like a 50/50 kind of approach where providing like stepped prototypes or sort of live files but not live files so that people can actually see different ideas in the file. And it's not just presented in like that nice MacBook screen or wherever. Yeah. But they're also not in the live where they can see all the scraps. That maybe I know that aren’t working, but I've left them at the site to kind of think about in the future. Yeah. Maybe that is something, maybe when you're dealing with someone who's not in design, it’s harder for them to visualize it without seeing it in that like computer screen type preview. Yeah. Whereas me and Ross kind of like seeing it in that sort of mess of stuff where you’re coming up with ideas and we can look at what's going on. But again, that's probably a benefit towards working with people who know the process of design rather than someone who just likes to see the finished, oooo god... look at this. The glossy shine. Yeah, yeah. So yeah, I think that's one of the benefits. I mean the process from start to finish is sort of we're in I know we came in and talked to Jamie first and he sort of provided us with information about the company, the processes and then that's when a couple of days later you sign off and we start contact with you and came in for that meeting that was first before that very memorable meeting that we talked about before. But then once that initial thing with that meeting and the sort of like understanding was met, that was when everything started to sort of start to move, wasn't it? Yeah. I think you were worried as well when you came to that meeting weren’t you? Oh yeah! That we were going to take it the wrong way. And kind of kick off. Like, “no, this is how you’re having it.” That's another thing with design. I think a proper person who understands design can take constructive criticism. Yeah. And then sort of you evolve the design together, don't you, and create something pretty special, but you're not shy of people who aren’t like that. Yeah. They'll take it a bit personally and it's like, we're not trying to offend you, we're trying to get the best out of, you know, the proposal and the contract we've signed and all the process. But you took it with your stride. Yeah. To your credit and you were like, yeah, you know, I'm glad you've said it. Yeah, you can't be a designer if you can't take criticism and you've got to I mean there's a saying in the industry that’s ‘kill your babies’. So... Ah right. A bit harsh, but it's like don't become too attached to something because really you should be always adaptable. You should always be thinking about how you could change it. Because even if you did, like, the greatest design ever, it's not going to be perfect. It's not going to do the exact thing that you originally set out for it to do. Yeah, I guess it links to what you were saying about your sort of like progression through the industry. You know, you made your mistakes. Yeah, yeah. You need to do that to get something good and great don’t you? You need that... that feedback and the little butt of heads and all that sort of stuff, you know, you don't get anywhere with a design if you're not pushing it like that. No. So I think that's why the design for BIMTech came out like it did. It was just something that evolved naturally I think in the end and really grew... I’ll say grew wings. Like it just did start to like. Yeah. It became its own beast really, didn’t it? Yeah. I suppose it was about trying to... I mean, our process was trying to involve as much interactivity as possible on the website, especially on the home page, because that's the thing that people see first, isn't it. So that was the inclusion of a model that you could move about. Yeah. We used SketchFab didn’t we? A scan, a 360 image of the office that you can sort of traverse. The virtual tours kind of thing. Yeah. The virtual tours kind of thing, you know, and then the idea of having it fixed scroll when you scroll so you can involve a little bit of added animated... Yeah... You know, movement through it. I guess that was it. Like you said, maybe the decisions were quite typical but the additions to things were like can you do this, can you do that. And you were going, yeah, yeah, we can do that. Yeah, we can give it a go. I never say no. No. I always try and even if it's like a really complicated idea maybe, I’d always try and make it work. Sometimes it won't. Just because maybe you're asking too much of that particular device, whatever you may call it to do. Yeah. But there's always a way of doing something. Yeah. I'd say. Yeah. Well that was one of the benefits to working with you I think. Just nothing was out of bounds for you. No, no. You just kept pushing the design. Like we said, I don't think it would have got to the point without you. So, you know. I don't think any other BIM or construction company is going to take this approach either, do you? I think that is a great point. I think that was what we wanted in the first place was something unique that no other company... I think that's what anyone wants. That is in sort of a design mind. I think that was our goal in the first place because I think what was one of the keywords we threw around in the first meeting was just like unique. It has to be like unique and you have to associate it with BIMTech. And it was also the idea of I know it's been seven years since we developed a new website, but it was with the idea in mind of another ten years of a website, but with the added thing of having it more active as well. Yeah. You know, actually. That's going to be a big thing, yeah, keeping on top of your news and all your podcasts are going to go on there as well aren’t they? So this will be on there, things like that, videos, news articles, case studies, just keeping it active. Yeah. Is the key. Yeah. So, with that design stuff in mind and the changes that you made to the process of making our website like the sprint thing happening instead and the inclusion of us in the file as you were working in it. Are those things that you’d use going forward or was that just something that it was with this project and the involvement with me and Ross with you? Well as Turhan always says, we're always open to change. So I think in terms of like future, the sprint side of things kind of spoke for itself really, didn't it? Yes. You were able to feedback a lot quicker. I was able to do, like revisions and different ideas quicker because you were giving me feedback quicker. So... Yeah. The whole thing kind of just went faster and better, not just faster and still the same quality. Yeah. I think that is probably something we're going to consider moving forwards. More sprint based work. Yeah, I think, I don't know if I asked you this or not, but for you, what is the best part of the website that you designed? Like, what’s the bit of it that you think oh yeah, this came out... I really like the project page. And the way it kind of overlays and the kind of blurry background stuff like that. That’s a really nice page. And some of the cards as well. Some of the cards have like really nice interactions when you hover over them. Oh yeah. Yeah. What's yours? Mine? Oh god. I think, yeah, it's either the projects page because I think that came out looking great and the sort of flow through. I think the flow of the website is one of the best parts of it. It just, it all works nicely. I think the other thing we haven't mentioned, I'll mention quickly, is just the idea that obviously we're media in the company and there’s engineering in the company. And the idea was to also add another element of that by switching to media to see the services that we provide. And I think we did that quite nicely as well because we're not a big company within it. We are, again, we're more of like a media consultancy within the business. So it's just highlighting that there is a different aspect to the company and here it is. But in this cool way where you ended up coming up with an idea of putting, tags underneath the menu system so that you could switch between the two brands, which I thought was a unique little feature to the website. I know that was another thing that took a bit of time to sort of get our heads around about how we were going to do that. But to me that's one of the most unique parts of it as well, is that ability to do that. The site switcher as we ended up calling it. Yeah. Site switcher, yeah, you can take that forward. Unless we patent it? But yeah, that was one of the best parts of it as well. But the home page itself, I think the home page speaks for itself. You scroll through it and it's just so nicely laid out and the interactions within it. I think you could get a whole grasp of the business just by scrolling through that one page. Yeah. And you’d have a whole overall view of it without having to traverse the site, which I think is important when it comes to a home page. The SketchFab thing in particular, I'm looking forward to seeing. Yeah, the ability to move the model. Yeah. In real time. Would you think about putting those on your project pages maybe in the future? Yeah, we did discuss that, didn't we? I think the only problem we have in our industry is we work in quite a private, you know, there's like prison jobs and stuff, so you can't really share the models on them. That’d be bad wouldn’t it? Yeah, yeah. Great escape. No, I think there's tons of aspects of it that are great. Yeah. You know, I think we're all happy with the way it's gone and working with you specifically has been great. Yeah. And excited for the build to start happening. Yeah. I think, I can’t remember if we mentioned earlier about how exciting it's going to be to actually see it like live in a web kind of format rather than figma, because Figma can only show so much. Yeah. I can only do so much prototyping and not break the file. Yeah. Or break your computer in the process. You're right. So it'd be great to see, like, all those interactions kind of happening in real time. Yeah. With you moving the mouse and stuff or pulling things and sliding things, and like you said earlier, the homepage with the navigation, the fixed kind of nav. So it tells us like the story of BIMTech, they'll be nice to see actually happen. Yeah. So, sort of rounding it all off I think a couple of questions to ask are, in your opinion is the process that you did with us the sort of like beneficial process? Is that your preferred and has it allowed you to create something that you wouldn't normally be able to create in other conditions? Yeah, I'd say, yeah, what came out was, well, you said it yourself, it was far beyond what you expected to see and I think it pushed me in a design sense, like pushed me to my limits of squeezing the rag or ringing the rag of creative juices. Yeah. Of what I could come up with. There was a lot of head scratching, a lot of headaches in trying to think how I could make something work. But at the end of the day, it looks so much better for it. Yeah. Well, that’s good. So I’d say yeah to that. Yeah. No, nice one. If it had gone the other way I’d have just cut that out. Yeah. No, cheers for coming in today. No problem. It’s been really good to chat to you. Good to relive it. For listeners, we lost half the podcast. So we had to go through a couple of things. But, yeah, it's still been great to chat you. Yeah. And, we've enjoyed working with you. I'm assuming you'll still be on the process a little bit. Yeah. So what normally happens is I kind of do like a handover with a dev. Explain how everything needs to work. Yeah. And then they kind of go away. So the actual dev side of it is a little less involved just because there's no changes, if that makes sense. So they just build what is agreed. Yeah. And then towards the end of that process we go through what we call snagging. So then that's when I come back into it and I go through it with like a fine tooth comb you could say. And say, this is wrong, this is wrong, this is wrong. Yeah. This this needs to work like this. This needs to work like this. I'm sure the devs hate when I get on it because I'm really quite in depth. Yeah. With my snagging but it has to be right. There's no point spending like three months, four months, would you say it's been of design? Yeah. Not counting Christmas. So there's no point spending that much time to then just let things slide at the end. So needs to be spot on. No, nice one. Everyone's leaving for lunch now. Yeah. No, cheers for coming on. No problem. It's been a pleasure. I'm still looking forward to having you in the process and stuff. Yeah. But yeah, seeing where it all goes and where it ultimately comes out as I think will be great to see. Yeah, I'll keep popping in the meetings and check how it's going. Nice one. I'll keep in touch. No, cheers for listening and I don't know what the next podcast will be on, so just tune in for the next one. Maybe how the website's gone all wrong.