Russell:
No, that’s not going to work. I think another sort of helpful thing about wireframes is that, up until that stage, you will have discussed, like what, the kind of site map you might be looking at? What kind of concept the site is going to have? One of the nice early test that wireframe does, we’ll take our best guess in the sort of best educated guess at what we think your content is going to look like and what’s the most important thing about it. Immediately, when you put that in front of a client or actually a user if you’re testing with it. You’ll find out whether that’s actually meeting the mark. You might’ve taken up a lot of space with something that’s very tech savvy or it might be very image lead. Not literally image lead since there won’t be real images in it. Immediately that can tell a client “Oh right. That’s what you were rushing me about. Our content, well, we’re not going to have that. We’re not going to be able to deal with that or it’s not what we’re looking for.”
Tom:
That’s a really important thing because you want a design around content where possible because the content, in most cases, certainly a lot of sites that we work on really does lead the way. It’s all about what you’re saying rather than necessarily. You want to provide a good design for the content rather than do it the other way around because that’s a failure. The wireframe, again, is a very quick way of getting words on a page. Say you’re doing a case study of something like you get the text of that case study or at lease 70% of what you think it’s going to be. Doesn’t have to be perfect, but then you know where you got to.. where you’re missing content potentially. Which is also really important or you know that you’re not going to have that big image because images are hard to get, for instance.
It makes you think about everything on the page from a content perspective. Which, at this stage in the project, is really important because it can outline risks from the client’s side. They might be like, “Oh my God. We’ve done this and now we realise that we need another month because you got it write this or we’ve got to source this or we got to check with our suppliers if we can have this thing.” So many questions can come from that. It’s really good to write early on because, I mean, this will be one of the first things you’re doing in the project anyway. Then that becomes all those risks. Kind of like non-negated then, but at least they brought it to the front so that you can start working on that immediately.
Russell:
Possibly and you hope by the end of the wireframing stage that all of those questions that have been brought up are solved instead of, “Oh, we actually can’t get these reviews” or whatever. It’s what we’ve put into the wireframe that we had to take out. Then you’re kind of left with, “Oh, we now have a concrete idea of what you can provide.”
Tom:
Yeah, totally. That’s cool. What are your favorite tools that you’ve used for this stuff?
Russell:
Since been working at Lighthouse is when I started using UX Pin. Yeah UX Pin isn’t strictly wireframe. It’s a wireframe prototype.
Tom:
Yeah because I think the marketer is a wireframing prototype tool. Which, is fair enough.
Russell:
Yeah UX Pin is a good tool for quickly drawing out like shapes and text on a page and simple elements on a page. Obviously one of the things they do is you can link between different pages within a wireframe.
Tom:
Well you can do quite a lot of little Javascripting style animations and it does a lot. I think we probably don’t use it as much as some people do. If you’re using it for a prototype, you might use those features a bit more. I think in some cases it might do too much and we fall into that trap like we were saying before of over designing. It’s got icon sets, it’s got.. you can do loads of colours. You can add images and all that kind of thing.
Russell:
Some of the interactions you can find yourself doing and it will take a long time. For example, if you had lost the things you wanted to show and hide don’t click on one page. You’ll find at some point you’re like, “I’ve done a lot of work here in the interface of UX Pin, maybe I would’ve done..”
Tom:
You might have found it easier to do that in Bootstrap or something just for the HTML file. Yeah, we did, a while back, a startup client came along and just wanted to kind of prototype an user flow. The journey through this potential applet didn’t exist, but I just want to invest in having something to show potential clients to see this might be how it works and yeah UX Pin was really good for that because it meant you could do this sort of fake Javascript work and show relatively quickly on screen how that works. It was very handy.
Russell:
So yeah UX Pin is a good one that’s kind of helpful for you. Can put whoever sitemap of wireframes who can kick around them and get use to how it feel to move around the content website, that’s a good one as well. Anything else that you’ve used?
Tom:
We looked at Macaw right, that was something that we experimented with briefly.