Arek Dvornechuck:
To people who don't really have a strong understanding of what style guide actually is. I assume that most of people who listen to this podcast at least have some kind of idea that style guide is a document that basically consists of all the rules, primary and secondary typography, primary and secondary color palette, how to use logo, how to don't use that logo, and different lockups of and versions of the logo, with taglines and without and also in color and black-and-white.
Rob Brailsford:
Yep! and it's different for.. and all different versions of the logo. You might have RGB for screens and CMYK for print yes black/white and reverse is just you know and every single brand is different.
Rob Blairsford:
I've collected a lot of stuff in my life. I've collected lots of records obviously and I used to read the letraset books just for fun when I was a kid. I've collected luggage tags, and I really liked Monopoly because they're all things that are the same but different, they're differentiated by color. It was the point at which I really loved kind of organizing things. Being able to organize a style guide with a couple of thousand different places in it into different chapters, which I can color-code just made me... It was like I could achieve something. It's nice to design stuff, but to be able to make something work not only to design something to make it beautiful, but design something to make it work, it's one of the most satisfying things I've ever done!
Arek Dvornechuck: Do you have any tips to design style guides?
Rob Blairsford: First of all, I'd say have as many of the assets that you're working on stock up on a wall. Because if you've got a web page and splash page from an app and fonts and colors all that kind of stuff stuck on the wall. If you do this enough, you will eventually got aye that doesn't fit! But I can fix that by doing this or that. So just get as much of the assets as you can and bring in people to look at it. If you're working with a team you get to see that stuff so often that you stop seeing it. So it's only when you bring someone who is not working on the project, then you go: point at something that works and point at something that doesn't work.
Arek Dvornechuck: How style guides save you time?
Rob Blairsford: So the thing that I learned most of all about design systems and brand guidelines is that it's not just colors and fonts and images it's also things like the page furniture. You know, the lines and the arrows and stuff like that and really crucial things like a build order. So being able to get the artwork of who's next along the line to be able to get from a blank page to a finish advert in like fifteen very short steps. When I was working on a guide there was something like twenty pages to build an advert and I just rebuilt the system by reverse engineering an advert and then I got it down to fifteen short sentences. Then I just said, alright this how we gonna do it, and did it with math so that you're able to build an advert fast!
Arek Dvornechuck: How long it takes to develop style guides?
Rob Blairsford: I was working for a supermarket chain called Tesco and I thought I was just gonna be doing some changes, some numbers, some art working. So I'm working and they said, “Can you rebuild the style guide?” and I said “Absolutely!”. It was not for the print design or the brand design, but it was actually for the store design. It was actually for their property design for how signage and typography is used in store. It took two years and we completely rebuilt it. So it took us two years, but I realized at the end of it that I've really enjoyed it because it was about creating order where there was just chaos before.
Arek Dvornechuck: How design systems work?
Rob Blairsford: Things like I really notice transport system stuff obviously. I think the London underground branding is amazing, I think that New York subway branding is amazing. Because we're around that stuff all the time, you get to see it from being on the subway all the train, oh that's how the signs work and that's how the little stickers near the door that say “don't stand in the door” work, and that's how the exit sign works. This is how the big signs outside that shows you where the station is work. So you know where the station is from 400 feet, or 400 meters. All those little things go towards being part of the design system.
Rob Blairsford: If you got your brand and suddenly you having to have.. If you are based in London and I need to get someone in China or Los Angeles to build something. If I don't have the guidelines being strong and flexible to rely to different territories, it just means that you design things in different ways. So you might have someone in Beijing doing apostrophe that doesn't have much white space because the Chinese design doesn't have much white space. And in America, it might be completely different. And then again, if you go to the Middle East the layouts gonna be on the other side of the page. So, all this stuff needs to have someone ideally to just say “look that's great but you need to change it, so it looks a bit more like that”.
Rob Brailsford:
Every designer has an ego. When putting two jobs and people say oh look
just look at this design. I'm gonna make it look like this because this looks great, I love it! And then someone will say “Yeah that's great, but it's not on brand”. And I'm unusually the person who says “Yeah that's great, but it's not on brand”
Arek Dvornechuck:
Yeah, it's your subjective opinion. Is what you like, the colors that you like, but it's not about the consistency as a whole.
Rob Brailsford:
Yeah absolutely. And it's often the case that you just see that wow that design has done a great job. I'm gonna see if i can accommodate what they've done in the system, or make it an option to use that color and just modify. And if something looks really good and it looks on brand you should be able to incorporate int into what you're doing.
Arek Dvornechuck:
I have a startup. Do you think I should develop style guides?
Rob Brailsford:
It's funny you mention that because I'm doing one tonight after we finish talking.
Yeah, and that's because at the moment that this job that I'm working at the moment I've just done the colors and the typography for an app but that's all there is at the moment.
But they'll be expanding, possibly exponentially in the next couple of months and they don't need that stuff.
Arek Dvornechuck:
Okay, so step by step right?
So you just leave the doors open and you define some of the things that are necessary at this point.
Things that makes sense for the applications that need to be designed as of now and then you leave the doors open to add more and more.
Rob Brailsford:
Yeah exactly! And that's why you might end up with five pages now and then in 10 months later you might end up with a hundred pages.
