The Good The Bad & The Interesting

Transcript

Transcripts are necessary, but alas, they are not free. You can help by donating a (small) amount on this Patreon page.

Vasilis: You are listening to The Good, The Bad, and The Interesting, a podcast about quality. In this episode Vasilis van Gemert, that’s me, talks to Espen Brunborg, creative director at Primate, a digital design agency in Edinburgh. There’s a transcript of this podcast for those of you who don’t want to, or can’t listen to audio. If you like you can help me pay for the bills for these transcripts on patreon.com/vasilis. Thanks! In this episode we discuss the hilarious and brilliant talk that Espen gave at the Beyond Tellerrand conference in Düsseldorf in a bit more detail. And as always, we start with the question: what makes a thing good?

Espen: I don’t know. It is difficult to say. The first thing that I think about in explaining quality is this thing I have with music. So you know there is a whole bunch of music nowadays that’s super popular. You know you met Sophia she listens to Taylor Swift like a whole bunch of this stuff.

V: Yeah.

E: Which undoubtedly is really well produced so from one perspective […] and it sells. So from one perspective it must be high quality because it succeeds, it does what it is designed to do really well. And it is catchy and even I remember the lyrics now so you know. But then the music that I enjoy is music that only sounds good if it is played by people who know how to play instruments and people who can actually sing. By which I mean even simple melodies played well can be of high quality or it can be really good but there is also lots of popular music that I feel like isn’t […] it isn’t good simple because it is easy to do it. So it takes no real skill, it doesn’t move me to tears where as real it can be classical music or jazz or whatever but if I feel oh my God this person dedicated their life to this instrument or to this voice there is no replacing that.

V: Okay.

E: So I think you know maybe if you take that and you look at furniture or something that obviously is the same thing. Stuff that you can only manage to do if you have actually taken a long time to learn a craft. Ultimately for me it feels like a mark of quality.

V: Okay, yeah. All right. But you saw this box that I created for my audio gear?

E: Yes.

V: Which is actually cut my lasers there is no […]

E: Yes.

V: But I think it is much better than anything I could make with ten years of wood cutting experience.

E: Why because it is lightweight?

V: Light weight. R Easy to replace?

V: And perfect. It fits perfectly.

E: Okay the size obviously could do with the wood. It would be heavier, take you a lot longer to make you may be a bit more attached to it.

V: Well I good use Balsa wood?

E: Yeah I guess so. But the problem with your box is that the lid keeps falling of friend.

V: It is not a good box yet.

E: I made, I made […] Like this year I have done a few wood working projects. I made myself a table at home so I got, what are they called, scaffolding boards, like 20 pounds.

V: Okay, yeah yeah.

E: I had to like sand them and just get them in a condition where they were okay to have inside the house. And then I used a handsaw and I cut them to the length. And you know I measured everything and then when I was screwing everything together I realized oh I have cut this at an angle and that is not straight, that’s like an inch longer than this other thing. Because I was working with these big heavy planks and the look was rustic anyway it doesn’t really matter. Because it looks fine, it looks rustic. And it is sturdy like I can’t break that table. So to contradict my earlier statement it feels like good quality even if I have been learning wood working for you know one month at that point.

V: Yeah.

E: But then I thought all right I can do this so I build this little like cupboard doors for my cupboard I guess. In Edinburgh we have this thing called Edinburgh press. It is like doorways that are left over from the old days when they built them and then they turn into like shelves. So I build doors for that, using you know plywood and glue and whatever I painted it. Again it looks decent and it works but it is a bit […] it is off. By several millimetres in many cases.

V: We actually have a designer in the Netherlands who is famous for using leftover wood from houses that get torn down. So it is half painted. He uses that to make furniture. And that’s the most expensive furniture in the Netherlands.

E: Of course it is. The irony.

V: Piet Hein Eek. Yeah. I created actually I made my own it is a small side table in our living room where you can fit some books in because we didn’t have shelves room so we have three more book shelves and a table on wheels. I made that in Piet Hein Eek style as well. Yeah.

E: Oh okay.

V: It was much cheaper than ordering it […]

E: Yeah I am only working with cheap materials but the thing that I am finding that it is really difficult even with good intentions and even having failed at two projects it is really difficult to get it right because you know millimetres off and the whole things looks shabby.

V: Yeah. Or it can look shabby like we are sitting here and we are seeing, I don’t know how you call these […]

E: Pallets.

V: Pallets yeah.

E: Furniture made of pallets.

V: Yeah. This doesn’t have to be exact it should look inexact.

E: And I would say that this is obviously meant to be like this so in that sense it is good quality ‘cause it is not falling apart. I am not worried about ruining it when I am sitting on it.

V: Yeah and it is really cheap.

E: Yes.

V: Yeah it works. So if we translate this to the digital world. That is where we work. Or you work mostly I think in digital, in web especially. I teach web design, web development. So there I had some conversations with people and there is one guy he said a few weeks ago on this podcast in Dutch unfortunately so you can’t listen to it you have to assume that I translate this correctly. He likes mediocrity. So he says one of the good things about the web is that everybody can create something by gluing together pieces, frameworks, libraries, plug-ins and tadaa here is my website. And he thought that’s a fantastic thing. And I don’t really argue with that I think that’s fine of course. That’s fantastic even. But then I think there should be another level. If that’s all there is. I don’t think that’s good enough.

E: No I kind of agree. Because my background is print design and print design I think people strive for perfection because once you push the button and print that’s it. Like that’s 10.000 pound so you have to pay to the client if you fuck it up. So it is important that you have got the right balance between the colours, that the contrast is there so the textual is up like you can’t […] there is no reversing it after you printed it, right. So for me it was tough learning to embrace imperfection in web design because I feel like no matter how hard you try there will always be little glitches here and there. You know we have design systems and style guides to make sure that things are as consistent as they could be. But as you know it takes a lot of time to maintain and update, it is a big job. And then you have browser inconsistencies and things align5 slightly differently. I mean my old boss has showed me an example once from YouTube maybe. It was like a reputational website and the label in one particular button was off by what looked like two or three pixels and he was like this, this Espen this is were we need to be better. You know we can’t let stuff like that slip through the cracks. And part of me is like yeah I agree like we have the power to make it perfect so why not do it. But then it is your friend there it is like well does it have to be perfect for people to use it well. Is YouTube any worse because this particular label is slightly misaligned? Probably not. So when the web is so chaotic and kind of difficult to get it right any way I think we gotta accept that high quality is not perfection. It is lower than that. But on the other hand […]

V: I think it is different. It is not about […] I think when you talk about high quality and maybe about having a solid design. A design that doesn’t break. I think that’s not so much about that it looks visually perfect but there is more complex layers of for instance interaction on the web that you have to get right. People don’t only use a mouse, right, they use thick fingers as well and they use a keyboard as well and this is pretty complex to design for.

E: Yeah I know you are right. Like the other day we were looking for food options online. We needed it to be gluten free. We look at restaurants on chipper device or whatever then you have to kind of gage can you trust these people? They say they are gluten free but are they? That way we tried a few restaurants, their websites and most of them are you know parallax crazy things flying in and out on a mobile connection abroad it just seems really unnecessary. And then we hit on one where the whole menu was instantly accessible and every single item had symbols explaining what the allergens were. Of course we are going to that restaurant.

V: Fantastic. Yeah.

E: So yeah you are right. Quality isn’t necessarily about perfection in the visual site but also the function I guess of the website or how you get your thing across, how it caters for your audience.

V: So how does that […] so you actually choose the least musical website of all of them if I understand this correctly. This was exactly pretty boring it was just the menu and that’s it. And the morning you gave a brilliant talk here at Beyond Tellerrand Conference in Dusseldorf in which you said that’s not enough.

E: Yeah. That’s more or less it I think.

V: You have the basics. Of course the basics have to be good but then there is more. There are stories we have to tell.

E: I think in this particular case we like sushi. Right so this particular restaurant is a Japanese restaurant so we like sushi and we like ramen. We don’t really need the website to convince us that this food is gonna be good. The quality, interesting that I am using that word, of the website convinced us they know what they are doing so that’s enough in terms of getting us on board with the sale essentially. From then on out yeah it is pure usability which website actually solves our problem right now. Which isn’t to decide whether or not we like sushi. It is to decide whether or not we trust these guys to serve us gluten free food. So yeah.

V: So how was the restaurant?

E: It is amazing. We are going back today and we are going back probably tonight and tomorrow.

V: So it is really really good.

E: Yeah and it is you know well-prized, good services, good foods and our main concern right now is gluten free so and it just checks all the boxes. Why would we go somewhere else?

V: And it looks good as well? Because is the experience nice?

E: Oh yeah it is really nice. Yeah.

V: Yeah. I went yesterday to the first sushi restaurant I found which was really expensive, very slow on the service, they actually forgot me but it was really really good.

E: Oh really? We sat down, they got us a table within10 seconds they rushed to our table taking our order within a minute, our food arrived within I don’t know the shortest amount of time you could imagine considering that they are just making it fresh I am assuming. It wasn’t suspiciously fast but also it felt like wow there on it. So yeah it was really good.

V: Good. Can you tell a bit more about what you talked about this morning?

E: Right, okay. So I guess in a nutshell it is the idea that when we are creating digital products or websites we are telling some sort of story to people. And I don’t want to wade into debate on what’s a website and what’s a web app but generally maybe you can say that there’s two groups of digital products. One is where your literally telling a story, you are trying to sell something or convince people to join a course or get them bored with a campaign or something like that. And the other side is pure function so people need to be able to book a ticket or buy a product or perform an action.

V: Ok, yeah.

E: So what I am saying is that as a community I think we are getting better and better at the latter. We have rules and guidelines and patterns in place to make sure that usability is improving a lot. There’s still a mess out there but we are getting better at usability. What we are not getting better at I think is how to create emotional immersive experiences without fucking up performance or you know ruining the usability of your product.

V: Yeah, yeah.

E: So that’s what I am essentially talking about is that there is two sides of this coin. There is two ways of telling a story or two ways of building a product. And sometimes you wanna be more emotional and intricate and other times you wanna be more simple and user friendly so to speak.

V: Okay so I have seen some examples lately of […] they remind me of big flash intros of way back and it looks like this is coming back which I think is a bit shocking. You are not talking about this kind of immersive […]

E: No I don’t think so. I mean when I first started out I remember a flash site called some Japanese inspired thing. Impossible to navigate, there was sound, there was 3D visual; it was so cool but completely useless at the same time.

V: Yeah, yeah.

E: It did expire me to get into digital but obviously as a website neh it’s got one use case and that’s to wow designers like me.

V: Yeah, yeah.

E: And I think now stuff like that is coming back because we can suddenly when everything is available with CSS, maybe a tiny bit of JavaScript. It just explodes. It is like in the 90s I guess earlier 2000 when desktop publishing took off. You know things went from being a kind of labour intensive process and certain things were very difficult to achieve to suddenly you can just plunk a gradient and a shadow and merge images in Photoshop and all this stuff. And you can see from the design of that time, print design it is like the world just went a bit crazy for a while. And then it shimmers down and then you learn that that’s really tacky but this actually works.

V: Yeah, yeah.

E: And in a way I feel like that’s what happening with this whole flat design. I don’t want to call it a trend because I don’t really think it is a trend but people may be realizing okay we have done the effects now, we have done the baffles, the shiny stuff and the excessive shadows whatever. So now we are more in a mature space visually. However the toolbox is now going you can animate, you can make things pop up and down and whatever. So we are going regressing back to the flash stage of just using all this stuff.

V: Yeah, yeah.

E: But I think it will pass.

V: It could also be I think actually flat design it came into existence at the moment that we started creating responsive websites. And the things that we did before with the baffles and the gradients and the shadows that was actually really hard to do responsively. So I think that’s why flat design […]

E: Yeah I also read actually that you know Apple they were really skew morphic in their designs and you know now looking back at the original iPhone it looks really weird. But I read somewhere that […]

V: Weird but actually pretty good. I still have an old iPod touch […]

E: Oh yeah?

V: Which I use in the kitchen every now and then to have some music. It just works. There is no question marks above my head when I use that things.

E: And now maybe with a new UI you are a bit sort of […]

V: Every now and then I am not sure is this a button or a state?

E: Yeah.

V: Is this state active or inactive?

E: Yeah.

V: Which direction should I slide that was with the previous versions? Should I slide open?

E: Yeah yeah. Is this thing on or off now?

V: Yeah.

E: Yeah.

V: Which is it is really not as clear as the previous one. I actually like the previous OS better.

E: I heard that. The reason they went all out with like torn edges and a calendar and like faking leather looks and stuff.

V: Oh that was just […]

E: It was crazy.

V: That was too much.

E: But I think someone said that it was because the display is only […] like it’s lower res essentially. So you disguise the fact that it is lower res by having this kind of fake texture.

V: Okay.

E: Where as when you have a retina display and the typography is so crisp you can get away with cleaner services essentially. It doesn’t look as bad because you don’t have the pixelated edges. You don’t have to kind of compensate.

V: Okay. It was actually a show of their […] Yeah, yeah. But it was bad design actually.

E: Well the calendars and stuff.

V: Yeah but also the first flat iOS that was actually pretty bad.

E: Yeah there’s like the old button conundrum you know when clients ask for a button that looks more than a button. They’re not wrong if they can’t see it as a button well you know.

V: Okay so you are talking about […] right adding a layer of emotion maybe on top of the basic UX. And you talk about humour adding humour to the mix?

E: Yes, yes.

V: Adding things like random, which I am a huge fan of those things. I use random for everything.

E: Yeah. I gotta stress there’s a time and a place. Right so I used our own website as an example in the talk. So the goal of our website is to convince people who visit the website that we are a good agency to work with. So of course we want to show off our projects in some way which means we have a portfolio on there. We wanna show our size so we have some sort of indication of who we are, how many people we are et cetera. And then we want to show how we are different or what we are liked to work with so we talk about our process et cetera.

V: I guess that’s really important right who are you gonna work it.

E: Yeah it is, it is. I mean of course maybe the most important thing is like we have a contact page which I didn’t show in today’s talk but it is a literally a white page with Hey you can get in touch with us, here’s our phone number and here’s our email address. There is now fanciness; there is no stupid e-mail form. Anyways so what’s missing from that recipe if we just went okay here is pictures of our work, here is a list of staff members and here’s a one two three step of our process. What missing then is our personality like what are we like. We want people to kind of have a feeling of what we are gonna be like to work with before they even meet us in person. Because we think people buy stuff from other people they don’t buy a faceless corporation. They buy, you know I think when we win a job it is because they like us rather than they think we are that much better than someone else. You know there’s a chemistry there. So this layer of comedy in the design is just about allowing that personality to shine through and taking minor risks that set us aside for example on our clients page we are showing pictures, really beautiful portraits of our clients, the people rather than another UI or another website.

V: I thought that was really nice. It is showing their name and […]

E: Yes we are saying this is Alex. We helped Alex you know increase profits by 700% and then that should be enough to get them interested right rather than which company works for or you know what the website looks like. Really personal.

V: And colourful I love that. Really colourful.

E: Yeah so obviously you know once you have clicked […] we are having a little case study you see some examples but we are just trying to tell the story from our point of view which is that we are creating a […] it is about relationships … and the client. And we are not peppering our websites with jokes but it is the little monkey stuff so we write alternative bios for all our staff members as if they were a monkey. It is just if people accidentally come across that stuff and they like it, it is a really powerful thing. It is something they will mention to us when they see us and hey that was really funny that monkey bio bla bla bla. I could never do that on our website. Yes you could. Even if you are you know Scotland’s largest salmon producer or if you are an accountant or whatever you can still be funny or be a bit odd or show who you are.

V: I guess showing personality. And in your case humour is definitely part of it and probably of your agency as well. I can imagine some agencies that are not funny.

E: Oh yeah, yeah.

V: Or they don’t want to be funny but then still they have personality, right?

E: Yeah they can show that too. If your agency isn’t about being you know relaxed and funny maybe it is about extreme attention to detail then you can tell the story from that angle and you can use tools online be it animation or interaction or something just focus on that single message rather than here is your standard template.

V: Yeah.

E: Like you can have a template and design that’s super easy to use but ultimately it says nothing because your content and design isn’t emotional in any way. So it is not that parallax enhances or parallax itself adds emotion but the right pictures with the right text presented in the right way does.

V: Yeah, yeah.

E: That’s how I should have ended my talk.

V: No you ended it pretty well. It was really good. It was a real good talk. You should see it we’ll put the links in the show notes. It was a real good talk. What I really liked is that you started first with okay you told the sensible stuff right? So these are the things you have to add into a website. Like it has to be usable, it has to be universally.

E: Yeah, fast, universal.

V: Yeah. All these things. And then at first you put them against the more emotional things.

E: Yeah.

V: But what I really liked is that you said no you should do both of those.

E: Yeah. In my previous talk I was a bit sort of bold and I went at it and said fuck the rules we can do whatever we want. Don’t listen to the dogmatic preachers out there. And I gotta bit of flack because it sounded like, and I understand that it sounded like I was just going let’s just use carrousels, go parallax. But you know that is missing the point so I am trying in this talk to be a little bit more nuance and say look there’s just another perspective.

V: I don’t even think it is another perspective I think it is an extra layer that we shouldn’t forget. Because it is true. What I think right now, what I see is there is two trends. One is extremely boring so Wordpress Themes all the way for everything. So this is the brilliant, what’s it called, Design Machines, the article.

E: Oh yes I think I read it.

V: Yeah so in the middle there is a screen shot of like 20 websites that look exactly the same.

E: Yeah, yeah.

V: Really they can be exchanged. They are interchangeable and nothing changes. So that’s one thing. On the other hand what I see is these over the top parallax sites, which are not actually advertising sites. If it is advertising I don’t really care just do whatever you want but if it is for something that you need then […]

E: Yeah, it depends why you are on the website right?

V: Yeah, yeah.

E: So if you need the phone number give me the phone number. Don’t hide it or you know.

V: Exactly. If need you gluten free food.

E: Yeah exactly.

V: Yeah give me that.

E: I did part of this talk at a little event we did in Edinburgh and one of our clients was there, they are a lawyer firm and after my talk he was like so you know you talk about this comedy thing like being different and you know using content in a different way and not just doing these same old template and I used, it is a slightly different version that is still I showed a picture of your quintessential website with a big banner in it, your message over the top. And he said but Espen that’s the design you have given us. So it is a bit of a weird situation. And I didn’t want to tell him well you guys are a difficult client but equally I think the fact that you have a big background image with text on top isn’t the problem. You know we have magazine covers they’re all background images with text on top. It is what your text is and what your image is that matters. So it is not in the build or the template or the lay out as such there is broadly speaking a good way to do web lay out and a bad way to do it. Let’s just accept that and move on. It is content, the text, the humour, the personality, how you use animation to improve your message or even improve usability rather than just throwing it on the page because it looks funky.

V: Yeah. On the other hand of course there is the thing that we have all these new technologies and we are not really experimenting with it.

E: Yes.

V: So we are just copying what we see and that’s it instead of looking for oh wow we have blend modes now. Let’s use blend modes.

E: Yeah, do we? For real? Is it like […]

V: Yeah, yeah.

E: I am always like several months behind. I hear about stuff and I am okay I am gonna use that in a year’s time and then suddenly it is there.

V: All my websites are blend modes all the way.

E: That’s good.

V: Yeah.

E: Blend modes it is so […] it ’s amazing.

V: Yeah, it is. Yeah. And very useful as well in some cases. You can use it in a useful way as well.

E: Yeah, yeah.

V: It is not just visually over the top.

E: Yeah.

V: But random with blend modes that’s just incredible. Blend modes, we have CSS grid of course, CSS custom properties, they’re fantastic we need experimenting we need to start experimenting with those. But instead we are copying themes or we are copying so do you know any way to create a culture where experimenting is more common?

E: Yeah. I’d say that’s a really bold statement. No, but honestly all the stuff that we hate the parallaxes and the stuff that’s over the top for no real reason I think we need to embrace it and go all right […] because parallax at some point was an experiment. Someone figured out in JavaScript to go oh what if the background image moves at a slightly different speed and boom you got this real 3D effect which if we are honest could be used to great effect if it matches with what you are trying to do right?

V: Yeah. Looks fantastic.

E: So all these things. We need to create all the crappy stuff first because it is part of it. Like if you do a 100 experiments maybe 3 of them are gonna be keepers and the rest is just crap. So maybe we should be grateful for the clients who allow us to ruin their websites with kind of weird stuff that doesn’t actually work and we only learn that it doesn’t work over time.

V: Yeah, yeah. Ok. So clients should be okay with […]

E: Yeah, you know in many cases I actually think […] Right so here’s a good example for you because you saw Yuko’s talk last night. People listening won’t have seen it but you know Yuko Shimizu a great illustrator she was asked to illustrate this story about national disasters. And she thought they expected drawings of earth quakes or drawings of tsunamis or whatever and they are like no, no Yuko the reason we contacted you is because we want your crazy, surreal style. So she does this wave kind of tsunami thing but with like really surreal almost grotesque visuals that are somehow also really beautiful at the same time. And I think we need to convince our clients to embrace that weirdness. To say here’s an experiment I think it is right for you, it fits with your message, it’s very odd, it doesn’t look like your other lawyer firm’s website but this will make you stand out. Like this will people will remember this when they see it.

V: Yeah, yeah.

E: Memorability actually it has value. But we will fail a lot getting there.

V: Yeah, yeah, okay, yeah. I have the idea that many of the designers don’t really understand what the material of the web is made of.

E: Yeah, yeah. That’s another major issue.

V: So they can create all these incredible experiences but they’re 5 MB for a flash intro and they don’t even care or they don’t even know that that’s a problem.

E: Yeah. And you know what’s a real issue like I feel like we are a progressive digital agency in that we think digital first. We are not print designers forcing a lay out onto the web. However it’s with flex box and CSS grids and all this stuff becoming available the gap between what a designer knows is possible and what the developer has learned is wide. So if I am a designers who works in Photoshop or Illustrator or Sketch I know a little bit of html and CSS but I don’t actually produce the build myself. And grid becomes available how the fuck do I know to design to that technology or to exploit that fully if my stuff is static and actually grid is a fluid technology.

V: So we need more creative coders, more creative, how do you call those we need more of those.

E: Yeah totally I think you can’t really work in a print industry without knowing how your design translates to the printed page. You need to know the difference between newsprint and you know printing on plastic or printing on thick paper versus thin paper and you know that because it’s both a restriction and a liberate […] when you do it right you can use it to your advantage.

V: You can use it exactly yeah

E: And so as a designer if I don’t know how CSS grid works for example I am liable to produce a design where the developer has to really struggle to retrofit the design into this technology rather than starting with the technology going what can I do with this. And then you get a sort of native lay out rather than the other way around.

V: Yeah. Another thing that I see often that interaction is not really well understood. So interaction can play a part in the story telling process. You can use interaction. Game principles for instance you can use that to tell a story. We don’t have to create longreads all the times. Instead of longread you can make a game.

E: Yeah totally.

V: Yeah.

E: I mean I don’t wanna say it but I am anyway you can use carrousel technology to that effect. Like this Alan Trotter’s website you know sort of clickable text adventure game.

V: Yeah, yeah. That’s fantastic.

E: Like it is so simple.

V: And beautiful as well.

E: And super risky to hide content details like that but you know […]

V: No because it is not. It’s actually I think it is a good case of progressive enhancement. Everything is there is the three lines of text the first time you load the page. It is there. It’s enough. All you need to know.

E: Well except his email address yeah. A bit tough to find that. But it is there.

V: Yeah, yeah.

E: And it also is the use case. It is not an emergency line where you need his number straight away. You can take your time to engage. I think it is super brave and it shows that not only can you use interaction in this kind of engaging way but you don’t need navigation necessarily. You don’t need a hero image, you don’t even need colour, you can just express yourself in literally any way you want yet we don’t. We want the hero image and the text and then the three boxes underneath and a website.

V: Yeah, yeah. The three boxes. Three boxes are actually pretty hard when you start squeezing it and it starts becoming smaller. At one stage three boxes won’t fit next to each other. This is always […]

E: Yeah, yeah. Then what do you do?

V: The thing that designers forget to design. The breakpoint. When it goes from three to two boxes.

E: Yeah, yeah. And like your mobile is easy, it’s one column. Desktop is easy cause you have all the space you need. It is the awkward space between mobile and tablet or whatever we call it.

V: Yeah and that’s actually the space where most devices are. So most devices are not 320 and not 1000x24 or whatever. There is somewhere in between. And that’s a thing we don’t design often enough.

E: Yeah and that’s another thing with designers. If we don’t venture outside of Illustrator there’s no way we gonna produce ten designs per page. We are gonna stick to mobile and desktop or a couple of sizes at most because it is not feasible to do anything else. If you count in like amends or making changes throughout the process so unless we actually design and look at stretch and flow and you know see how it works well it’s not gonna be as good quality […]

V: I think you have to collaborate for that. If you don’t collaborate, you don’t work together it is just not gonna get good enough I think or not as good as possibly.

E: As it could be.

V: Yeah as it could be.

E: Yeah absolutely. And I think that’s hard cause I don’t know maybe in big cities or where there’s a huge talent pool it’s possible to find these designer-coder hybrids. In my experience you often find coders who are not a great designer or you find a designer who is not a great coder but someone who is really good at both is difficult to find, right?

V: Very, very hard.

E: So in the meantime we have to collaborate. We still do it. Like Chris will build the stuff that I design.

V: I don’t even think in the meantime I think this will not change. If I look at my students […]

E: You feel like there is a creative mindset and a technical coding mindset?

V: A visual […] Well they’re all good to a certain level but then there is the people who just really love solving code problems and people who love solving interactive problems, others who really like conceptual thinking. It is just people like different stuff.

E: Yeah you are not gonna get an army of people who are really good at everything.

V: No, no.

E: And you said conceptual thinking there too, which is a good big part of it. Like now we have art directors and visual designers and this kind of designer and UI designers and user experience designers. It isn’t just one mindset.

V: No.

E: Photoshop isn’t enough you know on their CV.

V: Yeah.

E: But I actually I think it will change to some degree I think I don’t know 50 years ago maybe maybe even less you had professional type setters whose only job was to take the designer’s vision or the art director’s vision and set all the type.

V: Yeah.

E: And so that’s very very crudely speaking that is kind of what front enders now […] You take a sum for division that’s usually visual and you translate it into html and CSS.

V: And it is actually a silly workflow. We invited Jaap Drupsteen internationally he is well known for the fact that he designed the last Dutch money before we switched to the Euro which was beautiful money. And the reason why it was that good was because he was asked to design the money and he didn’t know anything about designing money and most designers before him just started designing whatever came to their mind and make something beautiful and make it complex. He actually went to the printers; he went to the front end developers of money and asked them what’s possible. Do you have any tests you made yourself? So he looked at the material they created and he used that to create the most incredible money that has been created.

E: Yeah but the he relies on someone […] he needs to go to a good printer then, right? Because he needs that guy to be a creative printer so to speak. Not just go oh this is what I did last year.

V: Well they were actually […] they were just doing what the designers told them. That’s what they did but they also experimented with the material they know.

E: Yeah because they want to test this material see if it works in that way.

V: So they wouldn’t call themselves designers I mean they do what they were told but they also know what’s possible.

E: Yeah so then your worst possible combination in the digital world is a Photoshop reliant designer speaking to a front end developer who is super comfortable with Bootstrap or 960 grid or something like that. Do you know what I mean? It is very easy to get this mismatch where no one is really aware of the possibilities.

V: Yeah and that’s a real problem I think. And I think that’s the problem that the web is having right now that we don’t get past this tinkering stage. I see this tinkering.

E: Yeah but don’t you think at certain point technology will be way more accessible already now I know a guy who went freelance what two years ago maybe and he used to be a head of design with a development team attached. Now it is just him. So he has developers he draws on for bigger projects but for the smaller ones he uses I think, oh what’s it called now, is it called Reflow?

V: Okay, yeah, yeah.

E: It is one of these tools. And he told me it is great. And I think for him it is great if you let a nerdy front end developer look at the codes he probably be mortified but for Will it works because he can produce something on his own for a client and then in the process he learns about code. Because yes it is a visual tool but you still have to put in all the parameters and CSS. Once grid gets plugged into these things and it becomes more accessible and it is not just a wall of text. I think we will see a shift from you know designers and front end developers becoming more of a hybrid just like typesetters and designers did a few decades ago. You know with […] they are still publishing basically.

V: Yeah I think these new prototyping tools are excellent.

E: Yeah.

V: They make designs come to life because they […] you can design transitions so it makes you design focus states for instance so you think about those things instead of just dead flat design.

E: Yeah in the office now I sometimes use code kit which is […] I don’t even know what to call it I guess it is a little piece of software that runs a virtual server on my machine.

V: Okay yeah.

E: But it has all this stuff built in like sass and less and slim. So basically I can get like the easy version of CSS running within 10 seconds. I don’t have to do Gits I don’t have to like struggle and tear my hair out and go to Stack Overflow and figure out you know what I have done wrong. It just works and then I can experiment to my hearts content. It’s like having CodePen running locally. So […]

V: So the tools are going to help us. Yeah definitely. But there is the other thing that interaction is much more complex and we can do much more with it I think. So for instance there is this Dutch newspaper “De Volkskrant” they have a digital team they work on digital story telling and they are doing some very interesting experiments. So there was this journalist and she came up with the idea […] she found out that Donald Trump actually has had every opinion so he contradicts himself all the time. One year he says he is pro-abortion and then he is against abortion. He loves gays, he hates them. It is just any thing. And they wanted to tell this story. So the first idea of course was make a longread and explain this but then they said no we are going to make a game out of it. Or not really a game but it is more of a test you can take to see […]

E: Which is yeah, yeah sure.

V: So who do you agree with and the outcome would also be you agree with Donald Trump.

E: Donald Trump.

V: So in this way it was engaging, it was fun and the story was told.

E: Yeah and dare I say it it is very shareable.

V: Yeah exactly.

E: We had an idea quite a few years ago. This is just after the iPhone I think. It must have been 2011. So responsive design has happened already at this point but is not as popular. And we had this guy it was like one man consultant type person and we figured we try and tell his story from his perspective and from his client’s perspective. So this is what I offer, this is what you need; these are the people I am looking for. It’s basically […] there is two perspectives to this whole journey. So on a desktop it would be a split screen right so you go black on one side, white on the other. You just tell every paragraph of text, every illustration is mirrored. On a mobile the idea was you would flip the phone and the whole thing would […] you get the other perspective. Completely inaccessible and maybe luckily it never got off the ground. You know we had a lot of fun with the idea.

V: You flip the phone, yeah, yeah. Oh yeah we did so many of those things in those days. Experimenting with flipping. So one time we had this website, it was probably for KLM, where you moved your phone the clouds would move a little bit. Tiny detail but […]

E: It won’t be maybe even now you can do that without it effecting the performance and once it does why not. Like parallax is only really annoying when it doesn’t load probably, it doesn’t scroll the way you want […]

V: When it doesn’t scroll as you want it to scroll.

E: When it fucks up the experience then it is annoying but if it was just there then you can visually choose to ignore it or just you know.

V: Today I read this […] there is a new media query which some people get sick from these motion things so physically sick. So when they see parallax website they throw up

E: Yeah.

V: It really happens it really exists. And there’s this new media query you can tell your iPhone that you don’t like motion and […]

E: Ah that’s nice.

V: It has reduced motion for things. But this also works now for the web.

E: Brilliant.

V: That’s fantastic. So one thing I took away from your talk was that I focus now as a teacher I focus very much on the useful stuff. Teaching my students to understand these basics and get that to a high level. The problem I see is that if I look at the professional at the state of design in the Netherlands they don’t really get this basics that well as my students do. So I am afraid that when they go into […] start working that they lose these skills that I teach them maybe that could happen.

E: Maybe.

V: But then on the other hand I also what I took from your talk today was that I should start teaching them more about telling these stories. About creativity.

E: Yeah, I kinda feel like the best practice stuff we are talking about performance, usability, just general you know making stuff that works intuitively. All that stuff. It can be […] to a large degree it could be reduced to a set of principles or you know rulebook or something like that, right? I feel like we are almost there. Like obviously it is still gonna keep changing cause technology changes but we are getting really good at it.

V: Yeah.

E: So I feel like in the future even now students that graduate that stuff if they just know that they have to learn it they can. It is not like it’s impenetrable difficult knowledge.

V: I am certain that they can learn this and that it’s actually, what’s it called, it’s just normal. You do that. It is there.

E: Yes, yes that’s where it will get to I feel. Just like with print design when I was starting graphic design yeah some of our tutors would be like really like Nazi about the typography like don’t leave an orphan and you know make sure the line height is good or they didn’t call it line height back then in print but you know.

V: Leading.

E: Leading. So they kind of just slap your wrist until you will got the basics right. And that’s what we should do now with your students as well. But the whole focus of my graphic design course wasn’t about how you produce something well it was about coming up with ideas and like you know I screwed up this entire like motion graphics project because I spent like so much time trying to make this animation which in like retrospect it wasn’t even nice. It was just I found it [...] so look I can make this thing move and you know that’s really cool. And basically the whole project was me doing that and trying to convince my tutors that it was a good idea. But it wasn’t.

V: Yeah, yeah.

E: It was just that if I had any chance of producing this thing I just had to get on with it now and they were like dude just don’t worry about it we don’t need a nice animation at the end we need your good idea and a story board. So yeah I think it is harder to experiment to a point where you come up with creative ideas that actually work on either UX level or emotional level. It is harder to learn that stuff than it is to learn you know best practice button design. You know?

V: Yeah, yeah.

E: Even though me included we all fail at it all the time so maybe it isn’t that easy after all.

V: It isn’t that easy. Yeah, yeah. I know. It is actually pretty hard.

E: Yeah the principals are kind of easy to get but actually making sure that it’s solid all the way through could be […]

V: Well it is not that hard but it is just that people don’t know it. So for instance my third year students didn’t know you can control a complete website by tabbing so all the links everything can be focusable. They didn’t know that. They really didn’t know. And this means that 80% of professionals out there don’t know this either.

E: Yeah.

V: I found that pretty shocking. So these basics I want these to be yeah just the normal, everybody should know that and then we should start making beautiful engaging yeah.

E: Yeah but it takes a certain mindset to […] some people fall in love with accessibility and performance and they really […] like I have seen some talks like Jake Archibald or some people who are real fire brand preach and they go holy fuck this stuff is amazing and important. I didn’t understand what you just said but it is really good. And then you have people that are more like well I wanna let the pros handle that and I wanna do ideas. So I don’t know. Maybe we’ll never find that perfect single unicorn designer that can just do everything.

V: No, no, there’s too few of those.

E: Yeah.

V: Okay. Do you have anything to add to this conversation about quality? We talked about lots of stuff.

E: About quality. I think quality is difficult to define online. I think there is a quality to be sought in visual UI design just looking at consistency and you know the usability of an interface but I also think there is quality in your code base and the fact that it is easy to maintain it doesn’t break, it’s you know mobile first and it breaks down nicely or you know it is progressively enhanced. And then I think there is quality in the messages and the content that we put out there. And unless there is at least some base level of quality in all of those categories it is not really gonna be a success you know. But maybe the most important thing from my perspective is content. I don’t care if your website is usable if your articles are boring, you know. Equally I can’t read your articles if I can’t use the website.

V: Yeah, yeah. Yeah the content is very important. And that’s actually the only thing that you are certain of especially when you use html it is the only thing you are certain of that people will get.

E: Yeah.

V: Yeah.

E: So this is obviously a topic for another day but why do we allow our clients to just write their own crappy content?

V: Yeah, yeah.

E: You wouldn’t do that if someone was doing a magazine, right? Or if you wanted to make a movie you’d insist on a good scriptwriter writing the script.

V: I read that article by yours in Smashing Magazine where you talked about the editorial process of magazines where you work together with the author. The designer and the author work together to produce a beautiful thing. Yeah. And on the web that doesn’t happen.

E: No very very rarely.

V: Yeah.

E: I always encourage designers to write stuff.

V: And it is even possible with this CMS that you talked about this morning. With Wordpress you can actually add different themes for every article that you have.

E: Yeah.

V: Yeah. It is really possible.

E: Yeah.

V: But we don’t do that.

E: No we don’t.

V: No. We give our editors wysiwyg tools.

E: It is a people problem as always.

V: So and maybe it is also […] yeah it is probably a management problem that they don’t understand the importance of quality content.

E: Yeah, no absolutely. It is an education piece as well.

V: Yeah.

E: Because we have CMS now suddenly everybody should write their own content. That’s not a given.

V: And it is a low paid job often.

E: Yeah.

V: Yeah. It is just something that somebody oh you have some spare time write some content.

E: Yeah, yeah. It is the most common thing that people feel like they can do themselves.

V: Yeah, yeah

E: Because everybody can type into Word and then you have photography and now everybody has a camera so now everybody is kind of a photographer. Everybody has an opinion about colour so everybody is kind of a designer as well. The only thing that is still a bit protected is programming I think. Cause I have had no clients tell my programmers how to do their job.

V: Yeah, yeah.

E: They tell me how to do my job all the time and the copywriter and the photographer but not the programmers.

V: Yeah copy writing is actually pretty hard to sell these days. Yeah back then when I used to work, I worked at the agency I think we had 250 people working there, lots of management of course, many developers, many designers, one copywriter.

E: Really?

V: And he got fired because there was no work for him.

E: Wow.

V: That’s incredible isn’t it?

E: We sold copy writing to a client not so long ago. He wrote some stuff that I thought was good. They had some feedback. He wrote a second draft and out of nowhere this message came down from management that we love all his work but we just don’t think it is right for us right now. And we are gonna write all the content ourselves. And we […] well we still haven’t launched a website.

V: Was it any good what they had written or?

E: I haven’t actually seen it yet so we’ll see, we’ll see. It is probably not gonna be awful but I am convinced the copywriter would have done certainly an easier job of it.

V: Okay. You have anything else to say?

E: Plenty.

V: Plenty?

E: But maybe for another conversation, another day.

V: Okay whenever you’re in Amsterdam come by we’ll record a second podcast.

E: Yeah we’ll do that. That’ll be good.

V: Okay, thanks very much.

E: No worries thanks for talking to me.

V: This was episode number 30 of The Good, The Bad, and The Interesting with Espen Brunborg and me, Vasilis van Gemert. If for whatever reason you want to contact me about this episode you can send a tweet to @vasilis, or you can send an email to vasilis at vasilis.nl. I really like feedback. Something else I like are all the people who help me out with paying the bills for the transcripts of this podcast, like my employer CMD Amsterdam and Job, and all the other fantastic donors. If you want to, you can help me out as well. You can find the campaign on patreon.com/vasilis. I’m not entirely sure yet who I will talk to next time. I hope it will be my colleague Jan Jaap Rijksema. In that case the next episode will be in Dutch.