Style Tiles and Designing at Twitter - Samantha Warren10:27 with Dan Gorgone
Twitter's Samantha Warren sits down with Treehouse's Dan Gorgone to discuss how she got started as a designer, the value of Style Tiles, and her work as a designer with Twitter.
[? music ?] 0:00 [Treehouse Friends] 0:03 [? music ?] 0:06 Hey, everyone, this is Dan Gorgone with Treehouse. 0:14 We're here in Orlando at the In Control conference, 0:16 and our guest right now is Samantha Warren, from Twitter. 0:20 Hi, Samantha. >>Hi! >>Thanks for joining us. >>Thanks for having me today. 0:23 >>I wanted to ask, for the benefit of those who aren't familiar with you, 0:25 can you tell us a little bit about yourself? 0:31 >>I'm currently a designer at Twitter. 0:33 I've been in the industry, I guess, for about, oh, I don't know, 9 years now. 0:35 I went to school for print design, and 0:40 shortly after doing print design, I happened into a very unique situation 0:42 where someone actually offered to teach me HTML and CSS, 0:47 and so I got into the web industry. 0:52 And I worked at all sorts of different agencies and in-house ever since. 0:54 >>Working at these different agencies, you've had a bunch of different experiences 0:58 with different kinds of clients, internal clients, external— 1:04 >>Yeah. >>Can you tell us maybe some of the main ideas, 1:07 some of the tips that I think all of us need to know 1:11 when we want to try to gain the trust of clients and prospectives? 1:15 >>It's about expectations. Every time you walk into a new project 1:18 with a client or stakeholder, they're going to have different expectations 1:23 about what they're going to get, what they're paying for, 1:27 what the final result will be, their level of involvement 1:30 in the project, and it's about having a process that— 1:33 we talk a lot about responsive design and the idea that 1:36 the screen width responds to whatever device you're on or 1:39 whatever screen width you're on, but it's also a little bit about how 1:43 our design process responds to the situation that it's in, 1:46 the types of clients that you're working with, what they're expecting, but also 1:51 the type of team you're on, who's helping out, 1:54 what kind of timeline, what kind of budget you have, 1:58 because all of these things are always different. 2:00 I've never had 2 projects that are exactly the same. 2:02 So how do you create a tool, a toolbox, and a set of— 2:05 an infrastructure to always know where to begin 2:09 and how to be flexible throughout the entire process. 2:13 >>One of those things in the toolbox, so to speak, 2:16 would be the style tiles. >>Yes. 2:19 >>Can you tell us about style tiles 2:21 and what kind of—I suppose it's client interaction, 2:25 probably drove you to creating this? 2:28 >>Well, over a period of time, I began to have many 2:30 projects that had some similarities, 2:33 one being that there were clients that already had a 2:35 brand or a logo, maybe a color palette. 2:39 They already had some expectations as far as 2:42 what sort of design they were going to get in the end, 2:45 and so this—and many of the clients also, 2:48 to some degree, would have limited budgets. 2:50 And so I needed a way to be able to 2:52 still give them options from the very get-go 2:55 without necessarily spending all the time 2:59 of making full mock-ups—different options of full mock-ups 3:02 for them—and still get them the product in time. 3:06 So developing a process where I asked a lot of questions, 3:09 and then made what at first I called actual simple comps, 3:13 just like a piece of a comp, to give them some options 3:16 and have them be part of the process, 3:19 really listening to what they're saying 3:21 and showing them the correlation between what they said and 3:24 how that actually translated in the process. 3:26 Yeah, so I started out with making simple comps, 3:29 which were sort of smaller versions of a comp, 3:31 and that sort of morphed into what I call the style tiles. 3:34 And even just calling them style tiles with cascading style sheets, a client 3:37 understood that that was a direct reference to CSS and that that was for the web. 3:44 Because a lot of branding agencies or logo agencies 3:48 will sometimes do mood boards, for example, with their clients. 3:52 So a style tile is actually a lot like a mood board, but more specific to the web. 3:54 And by doing that, clients feel more involved in the process. 3:58 >>And I think that's part of gaining their trust, too, 4:02 is that when clients sort of give everything to you 4:05 and they're kind of waiting for—hopefully, they'll get things right, 4:10 hopefully, they'll understand my vision as the client, 4:15 because there are plenty of clients out there who fancy themselves 4:18 as designers, and they're really not. 4:21 But I could see that this is a nice happy medium 4:23 where they can get their hands on some kinds of designs, 4:27 and you've already sort of set the limits there. 4:32 >>Well, it's a tough situation, because at the end of the day, 4:36 the client is paying for the website they're getting, so they have to be happy with it. 4:39 They have to feel as though that was something that they helped create. 4:43 So by really listening to what your clients are saying 4:46 and showing them—this is what you're saying, and this is how 4:50 I'm going to actually take that into account and apply that to 4:54 goals and objectives that your users have— 4:57 It doesn't necessarily mean doing exactly what your clients are asking, 5:00 but it's more taking them down the path and showing them 5:03 the journey that you're going through in order to get 5:07 the final product that would be the best solution. 5:09 >>So you've done this, and you've created this, not just for clients, but for everyone. 5:11 You've opened this up, it's creative commons, it's accessible to everyone. 5:16 So, devil's advocate, you know, why would I get— 5:21 why would I release my secrets, and this great process 5:25 to potential other designers out there who might steal my business? 5:29 Why give that away? 5:34 >>I've been really fortunate to be surrounded by some very smart people 5:36 who are active in the open source community, and 5:39 specifically in the development community. 5:41 I've seen a lot of what they've done, as far as how that's helped progress 5:44 where the web is currently. 5:48 And so for me, I see that development has made such great 5:50 strides by opening up and making their secrets transparent 5:54 to the world and sharing, so I really feel very passionately about 5:59 having that same kind of community feel within the design area. 6:03 It has been for so long—this idea of like keep it secret, 6:07 like this is my secret sauce, and this is what you're paying for. 6:10 But at the end of the day, we all want great-looking websites. 6:13 How many times do you go to a website, and you're like, "Oh, this is terrible!" 6:17 I mean it would be wonderful if the web was all beautiful, like— 6:20 so let's help each other to share what works for you. 6:24 I'm not saying style tiles works for everyone at all. 6:28 I just happen to have a situation that happened over and over and over, 6:30 and I thought to myself, there has to be a way that I can 6:34 do this better, and maybe I can save time for other people 6:36 to help them get farther faster. 6:39 >>So you mentioned secrets. So let's talk Twitter. 6:41 All the Twitter secrets. 6:43 Tell us about—what is it like working at Twitter, 6:46 and particularly as a designer, what is like working there? 6:48 >>Well, the design team at Twitter is currently around 40, 40 designers. 6:51 It's a really passionate, talented group of people who all come from 6:54 different walks of life, all over the country, 6:59 and we get together to solve big problems. 7:02 And it's definitely very different than working in client services 7:04 or an agency, but being surrounded by really smart people 7:08 is wonderfully refreshing, and it's like a fountain. 7:13 You take in so much from all these different designers, 7:18 which allows there to be so much creativity to get back. 7:20 >>So 40 designers for 140 characters. 7:24 A lot of people have to be wondering what are all these people 7:28 doing, and I know you can't reveal all the secrets, of course. 7:32 But, so we're talking about different ways of maybe bringing Twitter 7:34 to different parts of the world, different devices, different sorts of interfaces? 7:39 >>Well, when I first applied, that was the first thing I thought. 7:44 I was like, well what would I do at Twitter, it's only 140 characters. 7:46 But when you start to really think about all the things 7:49 that Twitter does, I mean Twitter is so many different things to so many different people 7:52 all over the world, on different devices, and in so many different ways. 7:56 You know, you have people in the Middle East who are using it 8:02 to communicate and start revolutions. 8:04 I know people just down the street probably Twittering their lunch right now. 8:06 I mean it could be anything to anyone, and so really trying to put together 8:10 a team of smart people who can solve lots of different kinds of problems. 8:14 I'm sure you could come up with a list right now of things that 8:17 you thought—Why don't they do this, or how come this is this way? 8:20 And I can assure you all those things are on a list for us, too. 8:23 And it takes a lot of people to try and accomplish all those things. 8:26 >>So parting thoughts: Advice for designers. 8:30 Now designers that are out there, if they're watching this interview, 8:34 they already heard you talk about some of the ways you can gain 8:37 the trust of clients, and kind of this philosophy of 8:39 sharing and collaborating and working together. 8:43 What other keys are there out there 8:45 for people who want to get into the design game? 8:49 >>Well, there's quite a few things. 8:52 I think, for one, I've seen a lot of designers who get right out school lately 8:54 and think that their design career is a sprint. 8:59 Like, let's get to the end right away, let's do these crazy big projects, 9:03 and I would—my first piece of advice would be to 9:06 see it as a marathon, like take on some of those harder projects. 9:11 Do some things that may not feel comfortable or right. 9:14 Try making a responsive website for yourself. 9:18 And then try making it again. And then do it again. 9:21 And do some things that may not necessarily seem like short-term gains, 9:24 but really do them to make yourself feel uncomfortable, 9:27 and do the hard work to learn things for the long term. 9:32 So that would be my first piece of advice. 9:35 Another thing would be to just have fun. 9:37 Like really don't take your work too seriously. 9:39 Have fun and learn from the people around you. 9:42 It is—We're doing really important things, but at the end of the day, 9:46 we all become designers because we love this stuff. 9:51 This industry is full of passionate people. 9:54 Don't lose your passion, don't become jaded, 9:57 and really, really look at the bright side of things. 9:59 >>Nice. Awesome. So how can we follow you from here out? Twitter? 10:02 >>Yeah, on Twitter, I'm @samanthatoy. 10:06 Toy is my middle name, so that would be probably 10:09 the best way to find me online. 10:11 >>Okay, awesome. Well thank you for your time. Really appreciate it. 10:13 Samantha Warren from Twitter. Thanks for joining us here on Treehouse Friends. 10:16 See you next time. 10:20 [Treehouse Friends] 10:22 [? music ?] 10:25
You need to sign up for Treehouse in order to download course files.Sign up