Verifyapp, FitVid, Privacy Policy Generator and Pocket

On this week’s podcast; quick and dirty user testing, and the challenges of responsive design. We also look at privacy policies and managing your reading list.

Play

This week on the show we cover:

Paul Boag:
So I had this new radical idea. I’ve –

Marcus Lillington:
Is it like previous radical ideas of not having the usual introduction?

Paul Boag:
What I – yes, I’m still avoiding that. I think really good idea; start the show by saying what you’re going to cover. Well instead of making people wait for 10 minutes, quarter of an hour before we actually talk about anything useful.

Marcus Lillington:
So people can’t call it utter drivel.

Paul Boag:
Ah, yeah. So we had a review on iTunes. We got a one star rating. “Utter drivel…

Marcus Lillington:
Yeah

Paul Boag:
… listened to it for eight minutes and they never go on to the subject of web design.”

Marcus Lillington:
Just two blokes chatting.

Paul Boag:
Just two blokes rambling.

Marcus Lillington:
You could see the hands on the hips.

Paul Boag:
Yes. He was beside himself with fury. But it was worthwhile because that got such a good response when I tweeted it that – that loads of people now have written lovely reviews so it got pushed off the bottom of the screen.

Marcus Lillington:
There is a lot of love out there.

Paul Boag:
There is a lot of love and we do appreciate it.

Marcus Lillington:
Well if you can remember when the first – when the podcast started to get traction I don’t know, five years ago, we had a lot of people saying this is utter drivel.

Paul Boag:
Yes. Well it is utter drivel.

Marcus Lillington:
Yes.

Paul Boag:
That is true. It was a perfectly valid comment. It’s just I didn’t agree with the one star rating.

Marcus Lillington:
It’s not all utter drivel, that’s the point.

Paul Boag:
It’s a mixture of informative and entertaining.

Marcus Lillington:
Well, that’s the plan, isn’t it? And if you just want stuff that’s really dry, it’s like, oh, how dull are you; we don’t want you anyway.

Paul Boag:
No. Well actually this is my new approach. Perhaps we ought to have a new, new…

Marcus Lillington:
Paul’s new mantra.

Paul Boag:
… a new, new approach …

Marcus Lillington:
Okay.

Paul Boag:
… is we put off people, we don’t want with pointless mantra to begin with so they give up before it gets the cool stuff.

Marcus Lillington:
Okay.

Paul Boag:
What do you think of that idea?

Marcus Lillington:
Well, I’d say that’s what we do anyway.

Paul Boag:
I know. It’s part of a strategy. My point…

Marcus Lillington:
Just maybe not – it’s not deliberately.

Paul Boag:
It’s a considered strategy.

Marcus Lillington:
Yeah, fair enough.

Paul Boag:
That if we just pointlessly waffle on for a bit…

Marcus Lillington:
No, go on say what we’re covering this week and then we’ll waffle on for a bit more after that.

Paul Boag:
That’s true. So we’re going to look at – for you designers out there, we’re going to look at VerifyApp, which you’re a fan of, aren’t you, Marcus?

Marcus Lillington:
Yes. Use that; I think it’s excellent.

Paul Boag:
VerifyApp, we’re going to look – for developers – for encoders really, we’ll look at FitVids.js another cool tool.

Marcus Lillington:
FitVids?

Paul Boag:
FitVids. Now where is your mind going there, Marcus?

Marcus Lillington:
Yes.

Paul Boag:
Then we’re going to look at, really exciting subject for website owners, privacy policies. You can’t get much more exciting than that. There is a reason to keep tuned into the show, if ever I heard one. And then finally, in our random mobile app we’re going to look at Pocket, which is a nice application. We’ve mentioned before on the show, but I want to go into a bit more detail about what it is, what it does.

Marcus Lillington:
Yeah.

Paul Boag:
So that is the plan. So, yes here we are again. I’m hyped up on sugar now. Because I was very sleepy.

Marcus Lillington:
Yes, because you really weren’t on previously, were you?

Paul Boag:
No, I wasn’t.

Marcus Lillington:
Hi, Paul. It’s like dealing with a teenager.

Paul Boag:
We were talking about that in the hip chat room. We have this little chat room were we all hang out together. And it really did become the kind of unhealthy geek club, didn’t it yesterday? Were you involved in that conversation?

Marcus Lillington:
I was and I was trying to tell you all to just snap out of it.

Paul Boag:
Well, you couldn’t – no you weren’t. You were as bad as the rest of us, saying how tired and lethargic you are.

Marcus Lillington:
Oh no, that’s just because I’ve had a bit of a bug. I’m all right again now.

Paul Boag:
It’s that time of year mind, isn’t it?

Marcus Lillington:
Yes, Paul thinks – Paul. Leigh thinks that it’s just, we’re all preparing for hibernation.

Paul Boag:
Yes. The French peasants used to pretty much do that back in the day.

Marcus Lillington:
Exactly, yes.

Paul Boag:
Not that I’m implying French people are peasants now, but in the past when there were peasants.

Marcus Lillington:
Yes.

Paul Boag:
[Whispered] They are. The French are all peasants.

Marcus Lillington:
Yes, they did. Well if you believe QI.

Paul Boag:
That’s where I got it from, of course. Well, QI is always right, except for what it’s wrong. It’s like me in that regard.

Marcus Lillington:
Have they ever been proved wrong on anything?

Paul Boag:
Yeah, they’ve had to apologize a couple of times.

Marcus Lillington:
Have they. I thought I’d seen every episode; obviously not.

Paul Boag:
Ah. I’m sure they’ve done that a couple of times.

Marcus Lillington:
At least they get – yeah, but basically you’ve been very poorly, haven’t you, Paul? Again.

Paul Boag:
Don’t say again and roll your eyes like that. It’s because I spend my whole life flying around the flipping globe …

Marcus Lillington:
Yeah, yeah.

Paul Boag:
… picking up bugs from every country on the planet. That’s my excuse, and I’m sticking to it. Now I am an – I’m just – I’m a sickly kid.

Marcus Lillington:
Yeah, you are the sickly child, yeah.

Paul Boag:
I’m the kind of – you know, if it had been the Victorian age, you know, I wouldn’t have made it, really.

Marcus Lillington:
Yeah, exactly. You wouldn’t have got past seven or eight.

Paul Boag:
No, no. Can I have some more gruel please?

Marcus Lillington:
No, because you would’ve been beaten out the way by fat boys like me.

Paul Boag:
Yeah, exactly. Yes. You evil, evil person. So, anyway yes. So – but no, you’ve been sick as well. It has not just been me.

Marcus Lillington:
Yes, and I blame you, or my wife, or Leigh; I’m not sure.

Paul Boag:
One of the above.

Marcus Lillington:
Yeah, but I didn’t get properly sick, I just got all kind of lethargic. So – but yes, there was a connection between that and the discussion. But I think what you and Dan were trying to imply is this is a permanent thing for you guys. Like, I can’t get out to bed in the morning.

Paul Boag:
No. Well, yeah that is. But that’s not about being ill. For me, I don’t know about Dan, that’s about I’m just a night owl, I’m just somebody that operates better later in the day.

Marcus Lillington:
I always thought I was but it’s not – I’m not, at all. It’s just to do – I used to stay up late basically because it was the only time of the day that I would have to myself, when my kids were little.

Paul Boag:
Yeah.

Marcus Lillington:
Now they’ve grown up and gone basically …

Paul Boag:
Yeah.

Marcus Lillington:
… one of them is gone. It’s not relevant. I’m in bed reading by half 10 most nights …

Paul Boag:
Yeah.

Marcus Lillington:
… and get out of bed by half six, seven, no problem at all.

Paul Boag:
See, that – I mean – but that’s what we were getting at really wasn’t it? It was whether we wanted to change our working hours so we work later, which is fine if you’re a freelancer.

Marcus Lillington:
Yeah, we can’t – we’re a team.

Paul Boag:
The whole 9 to 5 thing is from the factory days of production and that kind of thing.

Marcus Lillington:
Yeah, but that’s – I – 9 to 5 is quite reasonable, really or 10 to 6 maybe, I don’t know. But if you make at it any further apart than that then some people like – some people like starting work 5 in the morning, Leigh.

Paul Boag:
Yeah, well Leigh is a freak.

Marcus Lillington:
And others like starting work at lunchtime. You’ve got – if you’re in a team, you’ve got to kind of bring it together to a point that works for everyone.

Paul Boag:
Absolutely. Absolutely. But if I was a freelancer I’d…

Marcus Lillington:
Yeah.

Paul Boag:
Work whatever hours I felt like.

Marcus Lillington:
Solo performer you can do what you like. The only thing – I suppose the only –

Paul Boag:
So basically I’m handing in my resignation, is what I’m getting to.

Marcus Lillington:
Fine, okay. Cheers, Paul. But the problem is if you work for anyone else then you have to fit in with their expectations of a working day as well.

Paul Boag:
No, in my head, when I go freelance that means do what I want, when I want because that’s what it’s like as a freelancer, from what I’ve heard.

Marcus Lillington:
That’s exactly what it is – that’s what it is and just – the money rolls in.

Paul Boag:
It does. It just appears. People say, ‘hey you look a nice chap, here is a wodge of cash.’

Marcus Lillington:
Exactly.

Paul Boag:
So, shall we talk about a useful tool for freelancers then?

Marcus Lillington:
Yes. I would also argue that this is –

Paul Boag:
But I nearly managed to get it onto the show.

Marcus Lillington:
No, no, no, it’s about this.

Paul Boag:
Can I just say, Mr. Drivel, by the way, Mr. Drivel, it’s Marcus’s fault, really. Not that that Mr. Drivel is listening anymore.

Marcus Lillington:
No, of course, he’s gone.

Paul Boag:
Perhaps I ought to refer to you as Mr. Drivel from now on.

Marcus Lillington:
You feel free. This was actually a relevant…

Paul Boag:
Go on then, what was your point?

Marcus Lillington:
… comment to VerifyApp.

Paul Boag:
Okay.

Marcus Lillington:
I was going to say…

Paul Boag:
Well, we haven’t got on to it yet, we haven’t started the VerifyApp section.

Marcus Lillington:
But you were – you were about to?

Paul Boag:
Yeah, but we normally have a dingily bit of music just about here.

Verifyapp

Verifyapp.com

Paul Boag:
So now we’ve put the dingily bit of music in – do you like that, ‘dingily’?

Marcus Lillington:
Dingily?

Paul Boag:
I think that’s a good word.

Marcus Lillington:
That’s my daughter, when she was little…

Paul Boag:
Your daughter is dingily?

Marcus Lillington:
It’s her saying Boagworld.

Paul Boag:
Oh, yes. Do we still use that then?

Marcus Lillington:
Yeah, when she was little, and now she is big and she’s got a little dog. Shall we go down that road?

Paul Boag:
No. I’m not interested in your little dog.

Marcus Lillington:
It’s not mine. It’s hers.

Paul Boag:
Who is it, somebody bought a cat as well recently. Oh that was …

Marcus Lillington:
Really?

Paul Boag:
Well, that might have been a personal friend, nothing to do with anything.

Marcus Lillington:
Okay. Well, that wouldn’t stop us talking about it normally, but yeah …

Paul Boag:
No, it wouldn’t. I hate cats.

Marcus Lillington:
Hate – how can you hate cats?

Paul Boag:
Because they shit everywhere.

Marcus Lillington:
No, they don’t. Well, human beings shit everywhere.

Paul Boag:
No, we don’t, we shit in provided repositories.

Marcus Lillington:
That ends up going into somewhere.

Paul Boag:
Well, yeah. I accept that every – actually I would …

Marcus Lillington:
We really have gone off on a tangent again here.

Paul Boag:
… I was going to say – no, what I was going to say is, I accept that every animal needs to produce excrement, but I never realized how much poo spiders produce, right? Seriously I’m not kidding you.

Marcus Lillington:
Well, they are meat eaters, aren’t they?

Paul Boag:
We’ve got this – we’ve got – in my office there is the window ledge and then blinds that come down …

Marcus Lillington:
Yeah, yeah.

Paul Boag:
…. and this spider has made its home up above the blind. Up and behind – but for ages I was getting these little black dots all over the window ledge. I kept brushing them off and I thought, what’s that? And it’s the spider pooing. It produces so – I had to kill it; it was just too much poo.

Marcus Lillington:
You can’t kill spiders?

Paul Boag:
I did. I was – it was …

Marcus Lillington:
That’s really bad.

Paul Boag:
I know because I get all of those little thunderflies everywhere and I’ll get more now.

Marcus Lillington:
That’s why you mustn’t kill them, they do a great job.

Paul Boag:
But the poo was even more annoying than the thunderflies.

Marcus Lillington:
It’s just poo, you can just move it somewhere else. Move it into your garage or something.

Paul Boag:
But that’s my problem with…

Marcus Lillington:
Son’s bedroom, there you go.

Paul Boag:
That’s my problem with –

Marcus Lillington:
Wife’s handbag, perfect.

Paul Boag:
Can I do that with cat poo as well?

Marcus Lillington:
I was talking about the spider, not the poo.

Paul Boag:
Oh, right. Oh, okay. I thought you were – no Cat’s not in the slightest bit worried about spiders.

Marcus Lillington:
No, neither is my wife.

Paul Boag:
She is tougher than mine – than me, really.

Marcus Lillington:
Yeah. Oh well.

Paul Boag:
I’m a much more of a big girl than she is.

Marcus Lillington:
Please, please even I want to move on now.

Paul Boag:
But you were making – you were going to make a point about VerifyApp?

Marcus Lillington:
I was. Which was, I think that this is a – as valid a tool for designers, freelancers as it is for website owners.

Paul Boag:
Oh, yeah. Absolutely everybody should be using tools like VerifyApp. It is a very, very cool tool. So what is it? Well VerifyApp is basically a tool for doing remote unsupervised usability testing.

Marcus Lillington:
You can do it for – you can use it do supervised as well.

Paul Boag:
Can you?

Marcus Lillington:
Yes.

Paul Boag:
I suppose you could.

Marcus Lillington:
Yeah.

Paul Boag:
No reason why you couldn’t. But it’s kind of …

Marcus Lillington:
We have.

Paul Boag:
Oh, have we? All right, well that’s interesting. I haven’t personally.

Marcus Lillington:
No I haven’t personally, but I know that Headscape has used VerifyApp, basically sharing the screen with somebody remotely.

Paul Boag:
Yeah, of course. No reason why not. So essentially what Verify is, it’s you go along to verifyapp.com and it’s a fast way of collecting and analyzing kind of user feedback. And what you do is, you can set up one of a number of different tests and basically those tests go instantly online then you get a URL, you can invite people to go along, complete a test and it kind of collects all of the information for you and Bob’s your uncle basically; as simple as that.

The tests are really easy to create and really simple to share and they’ve got eight different tests that they have. They have a preference test; basically you produce say two options of a screen, you show both the screen shots to the user and you let them pick; very straightforward, nothing very clever about that.

Then there is a kind of yes-no test. Do – and which is basically do uses click where you need them to click. So you kind of define areas of your design where you want people – where people – you want people to click and then you ask them a question where would you click for – to sign up or whatever. Then they can click anywhere they want them on the screen, you’ll be shown where they click, but also you’ll be shown did they click on the right area or not? So a yes-no basic answer. Then there’s a broader click test – in the yes-no one, sorry I got it slightly wrong on the yes-no one, you’re basically told yes they’ve clicked where you wanted them to or no they haven’t. There’s a full clicktest where it records where people click all over the screen.

Marcus Lillington:
My favorite.

Paul Boag:
Yeah, that’s the one that we use the most I would have thought. So you can have a question like where would you click to create a bitly link for example.

Marcus Lillington:
But what I’ve used on that one, is – some of the – sometimes you think ‘uh, I can’t – it doesn’t do what I want to do.’ So we’ve done things like say if you want to ask people to describe what they see or pick out a bunch of words …

Paul Boag:
Yeah.

Marcus Lillington:
… this design is sexy or conservative or whatever. You can basically create a screenshot that has the question on it and then people click on the word.

Paul Boag:
Ah, that’s nice.

Marcus Lillington:
So you get like a big blob of them round the word you want them to hopefully.

Paul Boag:
Yeah.

Marcus Lillington:
And it’s a very quick way of doing that kind of test.

Paul Boag:
That’s a brilliant idea because that – I was about to say – I was going to complain when I’d gone through the list of tests that the one I would like to be able to do is they’ve got this mood test, which is great: does your screenshot – how does it make you feel? But it’s a set …

Marcus Lillington:
Of smiles and stuff.

Paul Boag:
… of happy, frustrated, and angry …

Marcus Lillington:
Useless.

Paul Boag:
… that’s it.

Marcus Lillington:
Useless.

Paul Boag:
Useless test, yeah.

Marcus Lillington:
Never use that, no, so yeah.

Paul Boag:
But if they have one way you can say …

Marcus Lillington:
Not just a pretty face.

Paul Boag:
You’re not. You’re not even.

Marcus Lillington:
Not even a pretty face.

Paul Boag:
Not even a pretty face, yeah exactly. But if the – that one they really ought to allow you to put in your own words on that, but yours is a good workaround but you just basically put underneath the screenshot the list of words and you could say – oh yeah, I like that idea!

Marcus Lillington:
Exactly.

Paul Boag:
There’s also multi-click tests where the user clicks on the screen shot based on the instruction and you can link several screenshots together.

Marcus Lillington:
Yeah.

Paul Boag:
So that’s quite good. There’s a memory test, this one we use quite a lot. So you show somebody a design for five seconds or whatever and there are – they have to recall what they’ve seen, so you could an idea of whether you’re, it’s got the right kind of feel and the right kind of visual hierarchy, so that’s a good one. There is an annotation test, which allows the user to basically create annotations on the screen and make comments on different elements. Mood one, we’ve mentioned. And then finally there’s a label test. Concern – if you’re concerned about users understanding certain elements you can ask users to label elements you selected with this test.

So eight tests basically that you can do, very easy to set up, very easy to them share. I mean, typically what we do is, with the test, is either if it’s a kind of ad hoc test, I’ll just send it out to my twitter followers and we’ll get a load people doing it that way. If you want to be a bit more targeted, you just create a little banner on your website that asks users to go and complete the test, if they’re willing to do so. Very straightforward. It’s great for that kind of informal, quick, we’re disagreeing over a particular approach kind of test, where you say it should be green, I say it should be red, let’s put it up online and let a load of users decide. So it’s great for that kind of stuff.

Marcus Lillington:
Yeah, I mean we – I think it’s even better than that, I kind of thought that it was a bit kind of secondary…

Paul Boag:
Right.

Marcus Lillington:
… to one to one testing and I’m not so sure now because we’ve done – I’ve done with for two clients recently and we’ve had I think 300 responses on the first one and 500 responses on the second one, which is obviously – that’s considerably more input than five or six or seven interviews over a day. Because I do worry sometimes that three of those might be useless.

Paul Boag:
Yeah. I think they’re completely different things. I don’t think it’s one inferior or superior to the other.

Marcus Lillington:
Well, but that’s what – guess what I’m trying to say is I think that the testing we’ve done recently is I think it’s been better.

Paul Boag:
It’s been more useful has it?

Marcus Lillington:
Yeah. I think that –

Paul Boag:
Has it really been more useful in the sense of improving the design or has it being more useful in getting the client to agree to something?

Marcus Lillington:
Yeah, I think more of the latter. I think it’s …

Paul Boag:
Yeah.

Marcus Lillington:
… proven we’ve got it right.

Paul Boag:
Yeah.

Marcus Lillington:
So if we hadn’t, it might not have worked so well, I don’t know.

Paul Boag:
Because I – personally I find usability testing with a real user in the room good for actually helping my design thinking …

Marcus Lillington:
Yeah.

Paul Boag:
… and kind of forming my design while things like VerifyApp it’s more about getting the client onboard.

Marcus Lillington:
Its making sure that all the stuff that you – yeah, your – you’ve agreed a load of stuff with the client, the design should be this, it should be that, then everyone’s happy. But then some of them points might be ‘well, we’re not sure about that …

Paul Boag:
Yeah.

Marcus Lillington:
… so we’re checking that out with users.’

Paul Boag:
I think for that kind of thing it’s better.

Marcus Lillington:
And it’s worked really well.

Paul Boag:
Yeah. It is better because – you’re right. Checking the five or six users, it could still become personal opinion.

Marcus Lillington:
Exactly.

Paul Boag:
But usability testing I think is superior for finding, well, user flaws – so for usability flaws in the interface, you know that – because this can – you know, you’re not testing a full prototype here.

Marcus Lillington:
I guess – yeah. That’s the other thing to say here. All – these two recent tests we’ve done have been design testing, they’ve

Paul Boag:
Yes.

Marcus Lillington:
… been looking at look and feel –

Paul Boag:
Yeah, they exactly. That’s a different thing.

Marcus Lillington:
Not ‘can you do this task?’ …

Paul Boag:
Absolutely.

Marcus Lillington:
… which is a different thing.

Paul Boag:
I think if you’re talking about testing a prototype you’re doing usability testing. If you’re talking about testing a design then something like VerifyApp is absolutely spot on …

Marcus Lillington:
Yeah.

Paul Boag:
… and works really well. They’ve got a 30 day free trial, so you can try it out for yourself. It literally takes five minutes to do a test.

Marcus Lillington:
Word of warning there.

Paul Boag:
Yeah.

Marcus Lillington:
It does take a small amount of time to do a test, but make sure you get one of your colleagues or friends to do the test before you make it public. Because you’ll just make assumptions on the way ‘people will know what I’m talking about.’

Paul Boag:
Yes, that’s very true. Because I’ve done tests that don’t make sense.

Marcus Lillington:
Exactly. You think ‘well you’re stupid, it’s obvious’ and then you think ‘ah maybe that’s because I know X and Y and they don’t.’ So yeah make sure someone you know does the test first.

Paul Boag:
I had an example of that yesterday right where I got stuck on a CSS – a JQuery problem. And I posted to stack overflow what my problem is and then asked my twitter followers whether they could help me with it. And I was so careful with trying to explain it clearly, but people didn’t get it. It’s really funny how you think you’ve been clear and you’re really not.

Marcus Lillington:
Exactly.

Paul Boag:
Which is exactly what you need to – that doesn’t just apply to creating questions and stuff like that, it also applies to your actual design which is why you need to test it …

Marcus Lillington:
Exactly.

Paul Boag:
So that’s kind of, yeah. So they’ve got a 30-day free trial, check that out. There are three levels to this. There’s the basic package for $19 per month: unlimited tests you can see all your results, you can link tests together, you can do all kinds of things. There’s a $49 one per month, which has also got things like demographic reports, in other words, you can ask people about who they are.

Marcus Lillington:
Yeah, the reporting on the free version is a bit rubbish.

Paul Boag:
It is a bit basic.

Marcus Lillington:
That’s – basically with those like 400 responses. I could either have a PDF with all 400 responses separate.

Paul Boag:
Yeah.

Marcus Lillington:
Or all of them on one, which it kind of worked okay.

Paul Boag:
Yeah.

Marcus Lillington:
But, I guess, if you wanted something a little bit more defined.

Paul Boag:
The $49 also does – lets you customize the logo and do a few other bits and pieces and then there’s a $99 a month which has got multivariance testing. I don’t know what that’s like, I’ve never tried it.

Marcus Lillington:
Me neither. use something else.

Paul Boag:
Yes. I would have thought there are probably better tools for that kind of thing.

Marcus Lillington:
Yeah.

Paul Boag:
But yes, absolutely check it out, very, very good, highly recommend it. Great designer tool and as you say a great tool for website owners as well because it really is a kind of tool that can be used by anybody: no technical skills required.

Marcus Lillington:
Correct.

Paul Boag:
Talking about technical skills, let’s talk about some developy stuff.

Fitvids

Paul Boag:
Okay, so we’re going to talk about something called FitVids.js. But before we kind of get – stop it, Marcus! Giggling like a small child. It’s embarrassing.

Marcus Lillington:
It does sound a bit naughty.

Paul Boag:
It does a little bit. But it’s got – it was did by Chris Coyier and he is – if you knew him, then it probably was meant to sound a little bit naughty to be honest.

Marcus Lillington:
Exactly, I’ve met Chris Coyier. He’s –

Paul Boag:
Have we met Chris Coyier?

Marcus Lillington:
Chris is Media Temple, right?

Paul Boag:
CSS-Tricks. No, not that Chris. Chris Coyier is CSS-Tricks Chris Coyier. By the way if you never checked out CSS-Tricks, do so. Flipping valuable resource for anybody …

Marcus Lillington:
Who am I thinking of then?

Paul Boag:
You were thinking of second name, I’ve forgotten, but yes –

Marcus Lillington:
He’s a Chris, isn’t he?

Paul Boag:
Yes, he is a Chris, but not the one you were thinking of.

Marcus Lillington:
Right.

Paul Boag:
So, yes FitVids.js solves a problem to do with video, but let’s kind of step back just a minute and kind of talk about responsive design. Responsive design is a tricky beast, okay. Because we’re selling it, and by we I mean the web community is large, as a kind of this fixable tool for solving the mobile problem of how to make your content available on mobile devices.

Marcus Lillington:
That’s exactly what it is.

Paul Boag:
I thought you’d probably say that…being the ignorant fool you are. But actually it’s all a bit more complicated than that. One of the ways that we sell it is it’s cheap and simple to do, but it’s not. I was – I’ve recently written about this in on Smashing Magazine so check that out there. And I kind of get into the whole issue of we’re saying ‘oh, native developers, it’s really expensive, very complicated to do’. Yeah it is.

Marcus Lillington:
I was going to say, yeah, it’s cheaper than possible other alternatives?

Paul Boag:
Sometimes, but not always.

Marcus Lillington:
Right.

Paul Boag:
It depends on what you’re trying to do. I mean with responsive design, on its surface, to implement responsive design is very straightforward, right. But there are a lot of kind of hidden costs associated to it, right. In reality things just get a bit more complicated. We all claim that responsive design is the slip – the cheap solution, but it does depend on how far you take it. So at the most basic level, yes, responsive design just involves changing some CSS. However in practice that’s not always the case. Making an existing website responsive can be time consuming for a start, because you can’t mess with the code particularly, because you’re dealing with legacy HTML. But it’s not just that. There are also loads of elements that need special attention, for example navigation is the obvious one, you can’t just scale it down. But also there are things like maps, videos, slideshows, graphics, tables, all need kind of special attention. And that the cost of faffing around with these things to get them working really becomes very time consuming.

Marcus Lillington:
Just turn them off.

Paul Boag:
Oh, if only Jeremy Keith was here, what would he say? Yeah, I mean that is certainly is an option, but often cases it’s not something you’re doing. Now it’s interesting because this is something I’ve been struggling with, believe it or not, I’m redesigning the Boagworld site yet again at the moment. It’s kind of my place where I play and try out new stuff. And as part of that process I’m coming up, carrying loads of things that aren’t straightforward to do and one of those things is video.

Marcus Lillington:
Yep.

Paul Boag:
And if you’ve got a blog post that says ‘hey check out my talk at this conference’ you can’t just turn the video off, otherwise the whole blog post becomes pointless. So, no, that doesn’t work. But there is this thing called FitVids.js that comes to the rescue here. And essentially what it is, it’s a jQuery plugin which makes your video fluid and allows it to scale with the browser. Now this is essentially a jQuery plugin that applies a CSS technique. So you could do the whole thing without jQuery, you can just put it into your CSS file when and do it that way, which is what I’ve done with Boagworld, but it’s also a very easy plugin to install. So all you do is you download it, you install it, it does everything else that you want it to. And there you go, your video’s are suddenly fluid because most videos have got fixed widths associated with them. It’s pretty good, although not infallible. It’ll work with most iFrame based content, but of course it depends on what the individual video supplier has done within the iFrame. So it doesn’t always work in all cases. There’s a PDF reader that I use on Boagworld called Issuu that displays PDFs in a really attractive way.

Marcus Lillington:
I call it ‘issue’.

Paul Boag:
Is it ‘issue’? Well, I don’t know, but anyway …

Marcus Lillington:
It sounds better.

Marcus Lillington:
Yeah.

Paul Boag:
… then you can judge for yourself. But it is – it doesn’t work with that very well and there are some problems with it, but it’s by far the best solution ready for getting video to be responsive. He also provides some other ones for making text more responsive and that kind of stuff. Also on that note, there is a great resource from Brad Frost, which has got loads of different responsive help for things like images, video, text, all of that kind of stuff. If you want a definitive source of resources and advice relating to responsive design, then check out Brad Frost’s responsive resources.

So, yeah, really I guess what I’m saying in all of this is responsive design is a lot harder than it looks and you do need these kind of workarounds to deal with some of these more peculiar things. It’s like, what do you with a table, a table of data when it scales down? That becomes a big problem. And that’s not mentioning like third-party widgets that you have on your site that on designs to be responsive.

Marcus Lillington:
Let it hang off the edge of the screen.

Paul Boag:
Is that how you deal with it?

Marcus Lillington:
Yeah, yeah.

Paul Boag:
It’s a good plan. Or just put ‘overflow hidden’. hide it away. Yeah, I mean –

Marcus Lillington:
I’m not being very helpful, am I?

Paul Boag:
You would not be very helpful, but that’s not your job, but that’s not why you’re on the show. If you were on the show to be helpful you would have fired by now, let’s face it.

Marcus Lillington:
Sometimes I can be – yeah, true.

Paul Boag:
Right. So that is my development tool for the day, not really a lot else to say about that. Responsive design is harder than that it looks. You need to worry about these complicated things, hard luck, but Brad provides some help and so does Chris Coyier.

Privacy Policy Generator

Privacy policy generator app - selecting from a list of services used on your site.

Paul Boag:
Right, so our website owners tool of the day. Although they’ve …

Marcus Lillington:
Oh yeah what was this?

Paul Boag:
This was privacy policy time. It’s really interesting actually. It’s kind of –

Marcus Lillington:
“It’s really interesting”?

Paul Boag:
No, that’s a huge exaggeration. It’s not really interesting at all. It’s a boring subject, but it’s something that we do all need to have, a privacy policy on our website. Especially when you’re kind of, you’re a proper organization rather than me, if that makes – so a personal website. And yes you could just copy and paste your privacy policy off somebody else’s site, but it’s not very good because it depends on how you – what you’re doing on your site should influence your privacy policy. So for example, if you’ve got eCommerce on your site, your privacy policy is going to be different to if you don’t. Or if you have a sign up process on your website that’s going to affect your privacy policy. So you need something a bit more tailored.

So there is this great tool out there which is a privacy policy generator. And essentially what it does, if you kind of – you go in to it, you enter your URL, let’s actually give this a go, I’m going to do this live, very exciting.

Marcus Lillington:
I’m doing it as well. Except I can’t spell generator. Gen-a-ray-tor.

Paul Boag:
Oh have you not got the tab open already with it in?

Marcus Lillington:
No, you don’t send me anything.

Paul Boag:
I did, I sent it to you, an email.

Marcus Lillington:
No, you didn’t.

Paul Boag:
I did.

Marcus Lillington:
It wasn’t there. You sent it to someone else.

Paul Boag:
You liar. You’re a liar, liar, pants on fire.

Marcus Lillington:
Not, not, not, not.

Paul Boag:
So it will ask you to register or log in –

Marcus Lillington:
And anyway, Paul, different machine.

Paul Boag:
Well, that’s your fault.

Marcus Lillington:
Well I suppose I could log in to Google.

Paul Boag:
So, have you got it?

Marcus Lillington:
Yeah.

Paul Boag:
You’re sure you got the same one? Are you –

Marcus Lillington:
Generateprivacypolicy.com.

Paul Boag:
Oh, I don’t know. generateprivacypolicy.com. That might be a different one to the one I’ve got. This is very exciting. We might have found two of what is possibly the most exciting application ever.

Marcus Lillington:
Can you tell it to do it in pirate talk as well?

Paul Boag:
That’s – no it’s a different one. That’s not the one I’ve got.

Marcus Lillington:
Well what’s the one you’ve got? Give me the URL.

Paul Boag:
I swear this URL is iubenda, right. Iubenda …

Marcus Lillington:
Oh, ‘a’.

Paul Boag:
… .com. I wonder whether you can get it –

Marcus Lillington:
So exciting for everyone listening.

Paul Boag:
Yeah, and then that goes to privacy policy generator.

Marcus Lillington:
Iubenda.

Paul Boag:
Right.

Marcus Lillington:
Oh, I got the curve of the earth. Interesting.

Paul Boag:
Yeah, it’s lovely. So what you do is you enter your URL, so boagworld.com, I think –

Marcus Lillington:
Where?

Paul Boag:
Like in the big box that says enter your … now it will ask you to log in to Facebook and that’s really just to – in order to get a load of – to pre-fill the data for you, you can click cancel to that and carry on if you want to. And then basically you add each of the services that you have on your website. So if you click add to service you’ve got things like advertising, analytics, all the different kinds of things that you’re doing on your website. So for example let’s say I’ve got analytics on my website and I use Google AdSense. I can go in and add that, although as it happens you can’t add that because that’s part of the pro-account and I don’t have the pro-account at the moment. I use campaign monitor, there we go. Because I can add that.

Marcus Lillington:
I can’t be bothered to do this. I’m bored of this already.

Paul Boag:
So you go through and all of the different services that you’re using and you hit save and close and then it’s kind of putting all of that information in. You follow – basically you go through, step-by-step through the process and eventually you end up with a lovely privacy policy at the end of it, which is a great way of kind of creating a custom privacy policy for your organization. Simple to read, it uses plain text, it’s not loads of legalese. They offer it in multiple languages, which is great and its custom build around what you do on your website. And it takes only a few minutes to set up and get it running.

Marcus Lillington:
Are they not complete gibberish?

Paul Boag:
What do you mean gibberish?

Marcus Lillington:
I don’t know. Everyone like us – ‘and there’s your privacy policy’ and everyone goes ‘oh, great’ and doesn’t read it. Is it gibberish?

Paul Boag:
Yeah, nobody ever reads – oh, I see. They could just put anything in and – apparently not. So there’s a free version and there’s a pro-version. The free versions –

Marcus Lillington:
The free version’s a bit rubbish.

Paul Boag:
Well, the free version only allows you to talk about four of the services you offer, so – which obviously limits it. There is no custom additions; you can’t add your own extra stuff to that, and they will show their logo on it. But then the other version is pretty good too, its $27 a year which isn’t a lot money, is it, really, for an organization to generate a privacy policy that they can use. And it’s a hell of a lot cheaper than going to a lawyer and getting somebody to write it up.

Marcus Lillington:
They show their logo on what?

Paul Boag:
On the privacy policy.

Marcus Lillington:
Can you not just copy the words on to your site?

Paul Boag:
I don’t know. I haven’t used this. Don’t ask questions I haven’t got the answers to.

Marcus Lillington:
But you know, that’s – surely that’s the easy way to get around the not-showing-the-logo a bit.

Paul Boag:
Yes, but I mean, to be honest that’s not the real killer. The real killer, as you saw I try to add Google Analytics, but you needed a pro-account. So it’s the service – limitations on the services. I think the idea is that you limit – that you link to their site with a privacy policy because then they automatically update it every time one of those services change.

Marcus Lillington:
Oh I see, right.

Paul Boag:
So that kind of means that you don’t – you’re not having to constantly recreate it. So, yes that is privacy policy generator. I can’t think of anything more interesting to say about it. I’m really am at an end without one.

Right, we come finally to our random mobile application.

Pocket

Marcus Lillington:
What’s this one, Paul?

Paul Boag:
This one is called Pocket, which we mentioned in last week’s show.

Marcus Lillington:
Yes.

Paul Boag:
I’m sure you remember.

Marcus Lillington:
I do remember you mentioning Pocket.

Paul Boag:
Right. Well, essentially we were talking – if you remember, we were talking about SoundGecko, that program that allows you to listen to articles?

Marcus Lillington:
Yeah.

Paul Boag:
And I mentioned that I used a program called Pocket to – the RS feed – RSS feed out of that I had coming into SoundGecko. So essentially Pocket is a bit similar to Instagram. No? Not Instagram. Instapaper.

Marcus Lillington:
Right.

Paul Boag:
Right. So it’s a place where you can collect articles. So you can have a bookmarklet where in your browser or browser extension where if you go to a website you go ‘oh I like the look of that article I’m going to add it to Pocket’ and off it goes and its added to Pocket. Equally you can email stuff to Pocket, they’ve got on iPhone app and on iPad app, et cetera. But also – sorry you were going to say something?

Marcus Lillington:
I was thinking I should do something like this.

Paul Boag:
You really should, this is perfect – a perfect app for you. Because the great thing about these kinds of apps is that you can see an article, you could go ‘I really ought to read that’ you can add it to Pocket, feel like you’ve done something then never look at it again.

Marcus Lillington:
So perfect for me that is.

Paul Boag:
So it’s a great procrastination tool.

Marcus Lillington:
Yeah.

Paul Boag:
So I’ve got like 60 –

Marcus Lillington:
Grows into this massive thing.

Paul Boag:
Yeah, I’ve got 65 unread articles at the moment and that’s me doing well, right.

Marcus Lillington:
Yeah.

Paul Boag:
So – but it is a useful thing…

Marcus Lillington:
People write articles that are just too long in my opinion.

Paul Boag:
They do.

Marcus Lillington:
It’s kind of like, I can do 5 or 6 –

Paul Boag:
Like this podcast.

Marcus Lillington:
Yeah but this you can just turn off if you’re listening in the car. But if you start right reading an article and think ‘this is really good, it’s really – oh, yeah I’m interested in this’ and seven paragraphs later I’m thinking ‘wrap it up, wrap it up’.

Paul Boag:
Yeah.

Marcus Lillington:
Then you look down the page, and there’s another 25 paragraphs to go and it’s like ‘uhhh…’ Yeah. It puts me off.

Paul Boag:
I skim read that stuff. More – increasingly the stuff that I’m writing for my own site is getting shorter and shorter. And that’s part of the reason why, is because I just don’t read long form stuff. Get to the point, get it done. But, you know. So anyway Pocket is really good, it’s obviously – it’s integrated also into a huge range of applications. If you go to getpocket.com/apps you can see all of the very many apps that they have. I think there’s something like 292 applications across a huge number of platforms that allows you to send stuff to Pocket. So if you’re using Flipboard or Zite or Twitter even, it’s built in, you can send it to Pocket, which is absolutely wonderful and great.

One of the things that – so why do I use Pocket over Instapaper? Well, there’s another one called Readability. I prefer it to Instapaper because it’s a visually nicer reading experience to Instapaper. So of course another thing about these, just to – if in case you’ve come across this kind of application before, it strips out all – it strips all out all the article – sorry all the advertising, all the other stuff and just gives you the article in a nicely formatted way. I think it’s visually more pleasant to read than Instapaper. Not as nice as Readability, I really like Readability’s visual interface. It’s very heavily integrated with a huge number of apps much more so than Readability. And the killer feature for me with Pocket is it also supports video.

Marcus Lillington:
Ah.

Paul Boag:
So if you see a video you like, you can add it to pocket. And that is very interesting. So I’ve – so you know there’s loads of talks from various conferences and stuff that I want to watch and you can add those as well. I’d love it if you could add audio content as well, but it doesn’t support that, which is really weird. You think it would be harder to integrate video than audio.

Marcus Lillington:
Yeah.

Paul Boag:
But it doesn’t at the moment. Hopefully one day he’ll fix it. In the meantime if you are a big audio listen and you want to bookmark stuff in a kind of Instapaper, Pocket manner then check out huffduffer.com so it’s a Jeremy Keith app that does that really, really well. But it would be great to have it all in one application. But yes it’s a really good application, use it all the time, it’s got an iPhone app, an iPad app, an Android app, a Windows mobile – a Windows phone app, it’s everywhere you could possibly wanted to be. The only thing that it doesn’t have which Instapaper has that I miss is Instapaper provides the ability to add it directly to the Kindle, which it doesn’t offer. So that’s something –

Marcus Lillington:
I was going to say that’s probably the most useful thing you could possibly have.

Paul Boag:
Well, it depends on whether you’re a biggie book reader or not. I don’t tend to read articles on my Kindle, but that’s just me.

Marcus Lillington:
But it would be good if you could …

Paul Boag:
Oh, absolutely yes. It’s a missing service. Now there might be third-party applications that can do that. I’ve just come across looking through their list of apps something called Crofflr. See these names are getting more and more ridiculous. Crofflr that is called a Kindle delivery service, but when I clicked on it to go through to the site, it didn’t work. So that could be just a rubbish internet in the barn.

Marcus Lillington:
Getpocket.com – oh no … Cr …

Paul Boag:
So anyway that might do it, but I don’t know.

Marcus Lillington:
Crofflr charges are one-time sign up fee of $5 for new members. I don’t have an iPad see.

Paul Boag:
Ah, but you have an iPhone.

Marcus Lillington:
Yeah, but it would be – if you did actually – if I ever did actually save all this stuff and go back and read it, I wouldn’t want to do that on my iPhone, probably not. But on the Kindle.

Paul Boag:
Yeah. Well you would need to get an iPad mini that’s coming out soon. In fact by the time the – no it won’t be out by the time the show goes out, but that’s the answer. You have to buy more technology. Always the answer. That’s the answer to everything in my life, if I’ve got a problem, buy more technology.

Marcus Lillington:
I’m not sure – you’ve got an iPhone 5, haven’t you?

Paul Boag:
I have an iPhone 5.

Marcus Lillington:
Is it better than the 4S?

Paul Boag:
Yes. It’s a nicer reading experience.

Marcus Lillington:
A bit bigger, isn’t it?

Paul Boag:
Yeah.

Marcus Lillington:
Yeah. That’s the only thing I can see about it that’s any different.

Paul Boag:
I’m not – but I was happing reading on the iPhone 4S. Because the other thing with Pocket, you see, is you can adjust not only the brightness, but the typography. You can also make it go white text on a black ground or CPC. You can change the reading experience so it’s not quite so straining on the eye.

Marcus Lillington:
Cool.

Paul Boag:
But if Kindle is a big thing for you, then get Instapaper. Instapaper’s a great app as well; I’m not knocking Instapaper in any way.

Marcus Lillington:
I just think – I think the Kindle is a magical thing.

Paul Boag:
I should put – link in the show notes for Instapaper. The Kindle isn’t magic, no, it’s called technology.

Marcus Lillington:
It feels like magic.

Paul Boag:
That’s what obviously Arthur C. Clarke said, wasn’t it? ‘Any sufficiently advanced piece of technology feels like magic.’

Marcus Lillington:
Exactly.

Paul Boag:
So there you go, that is our four apps for the week. I think that about covers everything. Have we got – yes, of course we’ve got a joke, because Marcus is still recycling jokes from the app.

Marcus Lillington:
I’ve got endless jokes, but I’m reading them and I can’t remember any of them, and I actually said these jokes, so it’s – I don’t know, I’m trying to make excuses. If you want to send me new jokes, [email protected]

Paul Boag:
Talking of that, while we’re asking users to do stuff or listeners to do stuff. Two other things, really really, would appreciate if you write a nice review about us on iTunes.

Marcus Lillington:
Or a really rude one.

Paul Boag:
No. If you hate the show, lie, right. I don’t want – I’m not into honesty. So that’s one thing and the other thing I want to ask people to do is go to boagworld.com/apps and please, please suggest some new apps.

Marcus Lillington:
Yeah.

Paul Boag:
Because we don’t want to get to the stage where we’re scrapping the bottom of the barrel or perish the thought I have to do some research for the show and some work.

Marcus Lillington:
Yeah, you want everyone else to do that for you.

Paul Boag:
I want people to do that for me.

Marcus Lillington:
Fair enough, really.

Paul Boag:
Absolutely. Go on then tell this terrible joke and let’s get the show over with.

Marcus Lillington:
This was one from Ian Lasky, years and years ago.

Paul Boag:
Good old Ian. I wonder if Ian still listens? Ian if you’re still listening, send us an email.

Marcus Lillington:
Yes do. One night –

Paul Boag:
Preferably with some jokes.

Marcus Lillington:
Yes more jokes, please, please. One night at the dinner table my wife commented – bit of a sexist joke, this one but …

Paul Boag:
Oh, good we like a bit sexism.

Marcus Lillington:
So it could be – I could switch this round. I do as much…

Paul Boag:
Turn it round because everybody will know that really…

Marcus Lillington:
But ‘my husband commented’, me saying it would be a bit weird.

Paul Boag:
I don’t know, you might be gay.

Marcus Lillington:
I’m not though. I’ve been married for 23 years.

Paul Boag:
Oh that’s true. Wow.

Marcus Lillington:
Long, long time.

Paul Boag:
Okay.

Marcus Lillington:
It’s nearly my silver wedding, how old’s that?

Paul Boag:
That’s really funny. Like, silver wedding anniversary, that’s a like proper old thing.

Marcus Lillington:
That happens to old people.

Paul Boag:
It does. Well you are getting to be old.

Marcus Lillington:
Yeah, I know. I’m not as old as Chris downstairs, shh.

Paul Boag:
I know, he’s about to turn 50.

Marcus Lillington:
Tomorrow.

Paul Boag:
Tomorrow? ‘Happy birthday to you…’

Marcus Lillington:
Stop singing.

Paul Boag:
We should bring him on the show. He would love nothing more than for his 50th birthday to come on the podcast.

Marcus Lillington:
Course he would. Alright I’m going to read this joke now. So this is the sexist version, but could be the other way round.

One night at the dinner table my wife commented, “when we were first married you took the small piece of stake and gave me the larger. Now you take the large one and leave me the smaller. You don’t love me anymore.”

“Nonsense darling,” replied the husband. “You just cook better now.”

Paul Boag:
Yeah that’s sexist. Definitely sexist. Yeah, so there we go. That wraps up the show. I think we’re done for the week and we should be back again next week with new and exciting apps. The reason I’m no more specific than that is because I don’t know what they are.

Marcus Lillington:
Because you don’t know what they are, yeah.

Paul Boag:
So prepared. All right. Then speak to you again next week, guys. Bye.

Marcus Lillington:
Bye.

  • http://twitter.com/josnow Jo Lankester

    Another really useful podcast here, thanks guys!

    You mentioned responsive tables, which struck a chord with me as I’ve recently had to tackle this issue in a website I’ve been developing which contains hundreds of tables of data.

    After trying out several very cool ways of making the tables responsive, fixing columns, scrolling within tables etc etc, I decided to stick with a pretty simple approach, which reformatted the table so each row of data becomes a kind of ‘mini-table’. This seemed like it was more user-friendly that other approaches for the data we were working with, although I’m sure that wouldn’t be the case for every scenario!

    I’d be really interested to know how other people have dealt with this issue, as I did find it a tough one to get working well.

    Here’s an example of responsive tables in the site I’ve been working on: http://www.worldcitiesculturereport.com/cities/s%C3%A3o-paulo

    And here are some great links which I found really useful from Chris Coyier http://css-tricks.com/responsive-data-tables/ and also Zurb: http://www.zurb.com/playground/responsive-tables

    Jo

  • http://twitter.com/MisterSheep Baronne Mouton

    Hi guys, ok… so maybe there’s a little bit of drivvel … but offset against a wealth of useful info… you’re forgiven.

    I’ve installed Pocket today as I’ve heard you (Paul) go on about it a few times now. It kind of reminds me of Diigo’s Read Later tool which is also very good – perhaps something you could look into for review on your show? where’s the place where we can suggest/recommend apps for the show?

  • http://s12g.com calilifestyle

    great show, first time listening and i have to say you guys are funny and entertaining and great insight. One problem about reviewing on iTunes would be that i need iTunes on my pc. Well i’m not having it, can’t stand iTunes.

  • Jeff

    I hate cats too!
    Also clients who “poo” everywhere, I don’t like either ;)

    Thanks for your Podcast — so good!

Headscape

Boagworld