Foundations of Design for Developers with Kathryn Grayson Nanz

hi I'm Scott Hanselman it's another hi I'm Scott Hanselman it's another episode of Hansel minutes today I'm episode of Hansel minutes today I'm episode of Hansel minutes today I'm chatting with Katherine Grayson n she's chatting with Katherine Grayson n she's chatting with Katherine Grayson n she's a senior developer Advocate AT progress a senior developer Advocate AT progress a senior developer Advocate AT progress how are you I'm well thanks how are you how are you I'm well thanks how are you how are you I'm well thanks how are you I am very well it is snowing over here I am very well it is snowing over here I am very well it is snowing over here at the uh Hanselman podcast studio uh at the uh Hanselman podcast studio uh at the uh Hanselman podcast studio uh which caused a little bit of Internet which caused a little bit of Internet which caused a little bit of Internet trouble before but I am living the dream trouble before but I am living the dream trouble before but I am living the dream now so listen you're working on your now so listen you're working on your now so listen you're working on your Masters of Science and human computer Masters of Science and human computer Masters of Science and human computer interaction you're going to get that interaction you're going to get that interaction you're going to get that probably what later this year is that probably what later this year is that probably what later this year is that right probably next year but yes next right probably next year but yes next right probably next year but yes next year you think so you're in the thick of year you think so you're in the thick of year you think so you're in the thick of it but I'm curious as someone who's got it but I'm curious as someone who's got it but I'm curious as someone who's got a foot in Tech but also a BFA A Fine a foot in Tech but also a BFA A Fine a foot in Tech but also a BFA A Fine Arts degree and now you're bridging it Arts degree and now you're bridging it Arts degree and now you're bridging it into a human computer interaction degree into a human computer interaction degree into a human computer interaction degree like do you find that to be a natural like do you find that to be a natural like do you find that to be a natural thing is that a comfortable thing to be thing is that a comfortable thing to be thing is that a comfortable thing to be both techy and I don't know empathetic both techy and I don't know empathetic both techy and I don't know empathetic and artistic because that seems like a and artistic because that seems like a and artistic because that seems like a different half of the brain I have found different half of the brain I have found different half of the brain I have found it to be natural for me I always try to it to be natural for me I always try to it to be natural for me I always try to resist being like Oh all designers resist being like Oh all designers resist being like Oh all designers should code or you know because that I should code or you know because that I should code or you know because that I feel like that gets brought up you know feel like that gets brought up you know feel like that gets brought up you know that's whatever the tab spaces debate is that's whatever the tab spaces debate is that's whatever the tab spaces debate is kind of thing you hear that make the kind of thing you hear that make the kind of thing you hear that make the rounds you know oh should designers code rounds you know oh should designers code rounds you know oh should designers code I don't ever want to be like yes you I don't ever want to be like yes you I don't ever want to be like yes you know that's natural everyone should do know that's natural everyone should do know that's natural everyone should do that for me it seemed to make a a lot of that for me it seemed to make a a lot of that for me it seemed to make a a lot of sense because I was really interested in sense because I was really interested in sense because I was really interested in seeing problems all the way through seeing problems all the way through seeing problems all the way through right so you kind of have an idea and right so you kind of have an idea and right so you kind of have an idea and you get to build this design you're you get to build this design you're you get to build this design you're doing all this research and you get doing all this research and you get doing all this research and you get really invested and then I had such a really invested and then I had such a really invested and then I had such a hard time handing that to somebody else hard time handing that to somebody else hard time handing that to somebody else to finish and I was like no oh that's

to finish and I was like no oh that's to finish and I was like no oh that's mine I'm not ready to let go yet and I mine I'm not ready to let go yet and I mine I'm not ready to let go yet and I discovered that by learning how to code discovered that by learning how to code discovered that by learning how to code I I didn't have to let it go I got to I I didn't have to let it go I got to I I didn't have to let it go I got to keep working on it and follow through keep working on it and follow through keep working on it and follow through and kind of complete that whole cycle so and kind of complete that whole cycle so and kind of complete that whole cycle so yeah for me it felt right you've been to yeah for me it felt right you've been to yeah for me it felt right you've been to Dev though for 10 plus years but you Dev though for 10 plus years but you Dev though for 10 plus years but you went design first and then said well I went design first and then said well I went design first and then said well I want to own my own code and my own want to own my own code and my own want to own my own code and my own design and I'm going to like you know be design and I'm going to like you know be design and I'm going to like you know be a front-end developer some people become a front-end developer some people become a front-end developer some people become developers and then they go wow my code developers and then they go wow my code developers and then they go wow my code is fine but my designs are ugly so I is fine but my designs are ugly so I is fine but my designs are ugly so I started out as a Dev and I started to started out as a Dev and I started to started out as a Dev and I started to think about design do you think you think about design do you think you think about design do you think you started as a designer started to think started as a designer started to think started as a designer started to think about code does it matter which about code does it matter which about code does it matter which direction one comes from I don't think direction one comes from I don't think direction one comes from I don't think it matters I was one of those kids that it matters I was one of those kids that it matters I was one of those kids that did a little bit of coding growing up did a little bit of coding growing up did a little bit of coding growing up cuz that was just I was the right age cuz that was just I was the right age cuz that was just I was the right age for that right when like Myspace was a for that right when like Myspace was a for that right when like Myspace was a thing and GE cities was a thing and to thing and GE cities was a thing and to thing and GE cities was a thing and to be on the internet at all required a be on the internet at all required a be on the internet at all required a certain level of like HTML CSS right and certain level of like HTML CSS right and certain level of like HTML CSS right and and enough JavaScript to be dangerous and enough JavaScript to be dangerous and enough JavaScript to be dangerous sometimes so it didn't feel like a big sometimes so it didn't feel like a big sometimes so it didn't feel like a big leap to me it felt like the same stuff leap to me it felt like the same stuff leap to me it felt like the same stuff I'd been playing with and messing with I'd been playing with and messing with I'd been playing with and messing with forever you know and I had dabble I took forever you know and I had dabble I took forever you know and I had dabble I took a Java class in high school it was never a Java class in high school it was never a Java class in high school it was never something that I thought of as a career something that I thought of as a career something that I thought of as a career at the time that was just fun I was just at the time that was just fun I was just at the time that was just fun I was just uh on the computer playing around didn't uh on the computer playing around didn't uh on the computer playing around didn't everyone do that right for whatever everyone do that right for whatever everyone do that right for whatever reason that hadn't connected to me as reason that hadn't connected to me as reason that hadn't connected to me as like a thing I don't know that I had like a thing I don't know that I had like a thing I don't know that I had anyone else that I knew of that was anyone else that I knew of that was anyone else that I knew of that was coding as a career I didn't put those coding as a career I didn't put those coding as a career I didn't put those pieces together yeah you really nailed pieces together yeah you really nailed pieces together yeah you really nailed it though we grew up at a time that was it though we grew up at a time that was it though we grew up at a time that was so perfect that hey you want a MySpace

so perfect that hey you want a MySpace so perfect that hey you want a MySpace let's view source and look at someone let's view source and look at someone let's view source and look at someone else's Myspace and see how they did it I else's Myspace and see how they did it I else's Myspace and see how they did it I I feel like the joy of that part of the I feel like the joy of that part of the I feel like the joy of that part of the internet The View Source aspect of the internet The View Source aspect of the internet The View Source aspect of the internet is kind of gone internet is kind of gone internet is kind of gone and that makes me sad because you view and that makes me sad because you view and that makes me sad because you view Source now and you see a bunch of you Source now and you see a bunch of you Source now and you see a bunch of you know autogenerated JavaScript crap you know autogenerated JavaScript crap you know autogenerated JavaScript crap you know like the first time I view Source know like the first time I view Source know like the first time I view Source on Gmail and I'm like yeah there's on Gmail and I'm like yeah there's on Gmail and I'm like yeah there's nothing here for me to see you know it's nothing here for me to see you know it's nothing here for me to see you know it's garbage oh it's terrifying yeah garbage oh it's terrifying yeah garbage oh it's terrifying yeah yeah I wonder if we could ever get back yeah I wonder if we could ever get back yeah I wonder if we could ever get back there though because I feel like we have there though because I feel like we have there though because I feel like we have another generation now and you're another generation now and you're another generation now and you're probably not part of this generation probably not part of this generation probably not part of this generation you're seeing that generation come up you're seeing that generation come up you're seeing that generation come up which is the figma designers where they which is the figma designers where they which is the figma designers where they were born in a world where figma was the were born in a world where figma was the were born in a world where figma was the thing cuz I felt like we had we had thing cuz I felt like we had we had thing cuz I felt like we had we had macromedia Dream Weaver and we had all macromedia Dream Weaver and we had all macromedia Dream Weaver and we had all the tool you know there was 50 different the tool you know there was 50 different the tool you know there was 50 different ways to make a vector and then get it ways to make a vector and then get it ways to make a vector and then get it into SVG or get it into PNG or getting into SVG or get it into PNG or getting into SVG or get it into PNG or getting into jpeg is that a bad thing is it is into jpeg is that a bad thing is it is into jpeg is that a bad thing is it is there a design tools mono culture that there a design tools mono culture that there a design tools mono culture that we're in right now H that's a good we're in right now H that's a good we're in right now H that's a good question I don't think so I think when question I don't think so I think when question I don't think so I think when Weir developers looking in right you Weir developers looking in right you Weir developers looking in right you only see the really big stuff right if only see the really big stuff right if only see the really big stuff right if you ask to designer to name development you ask to designer to name development you ask to designer to name development stuff yeah maybe they'd be able to name stuff yeah maybe they'd be able to name stuff yeah maybe they'd be able to name like vs code or something you know cuz like vs code or something you know cuz like vs code or something you know cuz it's a is the stuff that gets big enough it's a is the stuff that gets big enough it's a is the stuff that gets big enough but there is a lot of design software but there is a lot of design software but there is a lot of design software that's out there there's lots of that's out there there's lots of that's out there there's lots of prototyping tools and lots of design prototyping tools and lots of design prototyping tools and lots of design tools that aren't figma that are doing tools that aren't figma that are doing tools that aren't figma that are doing just fine figma certainly is doing just fine figma certainly is doing just fine figma certainly is doing amazing work I think in the realm of web amazing work I think in the realm of web amazing work I think in the realm of web design and it was one of the first ones design and it was one of the first ones design and it was one of the first ones that really focused on user interface

that really focused on user interface that really focused on user interface design specifically and it set them design specifically and it set them design specifically and it set them apart and they've continued to do that I apart and they've continued to do that I apart and they've continued to do that I think with like Dev mode and stuff I'm think with like Dev mode and stuff I'm think with like Dev mode and stuff I'm just a big fan they should be paying me just a big fan they should be paying me just a big fan they should be paying me to say this right but I'm so interested to say this right but I'm so interested to say this right but I'm so interested in what they're doing but I don't know in what they're doing but I don't know in what they're doing but I don't know that it's a monoculture any more than we that it's a monoculture any more than we that it's a monoculture any more than we see over on the dev side right I mean if see over on the dev side right I mean if see over on the dev side right I mean if you're working in react then you're working in react then you're working in react then everything's leaning in the direction of everything's leaning in the direction of everything's leaning in the direction of like un forel and next a right now but like un forel and next a right now but like un forel and next a right now but there's other stuff people are using there's other stuff people are using there's other stuff people are using them that that's a fair point that's them that that's a fair point that's them that that's a fair point that's fair point because there may be a monoc fair point because there may be a monoc fair point because there may be a monoc culture but it's more like we're just culture but it's more like we're just culture but it's more like we're just seeing a new shiny object and running seeing a new shiny object and running seeing a new shiny object and running towards it yeah yeah but in the context towards it yeah yeah but in the context towards it yeah yeah but in the context of figma people have found something of figma people have found something of figma people have found something that like really works and people are that like really works and people are that like really works and people are starting to use it I think I'm of the starting to use it I think I'm of the starting to use it I think I'm of the generation where I'm always changing generation where I'm always changing generation where I'm always changing from different file formats so for me from different file formats so for me from different file formats so for me it's like okay I started as a PNG I'm it's like okay I started as a PNG I'm it's like okay I started as a PNG I'm going to trace this and turn it into an going to trace this and turn it into an going to trace this and turn it into an SVG like literally yesterday I found a SVG like literally yesterday I found a SVG like literally yesterday I found a bit map I wanted and I brought it into bit map I wanted and I brought it into bit map I wanted and I brought it into inkscape which is like an open source inkscape which is like an open source inkscape which is like an open source you know tool and then traced it because you know tool and then traced it because you know tool and then traced it because I don't know how to use Adobe I don't know how to use Adobe I don't know how to use Adobe Illustrator and then turned that into an Illustrator and then turned that into an Illustrator and then turned that into an SVG and then manually edited the SVG and SVG and then manually edited the SVG and SVG and then manually edited the SVG and I showed that to someone they were like I showed that to someone they were like I showed that to someone they were like you should have just recreated it in you should have just recreated it in you should have just recreated it in figma I'm like I don't know how so I'm figma I'm like I don't know how so I'm figma I'm like I don't know how so I'm trying to figure out like what's the trying to figure out like what's the trying to figure out like what's the right thing for me to learn the right thing for me to learn the right thing for me to learn the foundations of design when I'm a Dev I foundations of design when I'm a Dev I foundations of design when I'm a Dev I always feel like the best tool is the always feel like the best tool is the always feel like the best tool is the one you know that's a copout answer one you know that's a copout answer one you know that's a copout answer right I I get that there are benefits right I I get that there are benefits right I I get that there are benefits for sure to learning the tool that for sure to learning the tool that for sure to learning the tool that everyone is using but I feel like everyone is using but I feel like everyone is using but I feel like especially when I talk to other especially when I talk to other especially when I talk to other developers who are interested in kind of developers who are interested in kind of developers who are interested in kind of stepping into design dipping their toes stepping into design dipping their toes stepping into design dipping their toes in getting a little bit more comfortable in getting a little bit more comfortable in getting a little bit more comfortable a lot of them feel very intimidated by

a lot of them feel very intimidated by a lot of them feel very intimidated by the thought of having to like learn a the thought of having to like learn a the thought of having to like learn a whole new tool and I don't know that you whole new tool and I don't know that you whole new tool and I don't know that you have to if that's something you want to have to if that's something you want to have to if that's something you want to do if you're thinking about like making do if you're thinking about like making do if you're thinking about like making a full career transition sure but a lot a full career transition sure but a lot a full career transition sure but a lot of times I'm talking to people that just of times I'm talking to people that just of times I'm talking to people that just want to get enough design kind of under want to get enough design kind of under want to get enough design kind of under their belt to make something that their belt to make something that their belt to make something that doesn't look like crap uh they just want doesn't look like crap uh they just want doesn't look like crap uh they just want to make a user interface that's not to make a user interface that's not to make a user interface that's not actively bad to use and I think that's a actively bad to use and I think that's a actively bad to use and I think that's a pretty reasonable and good goal in that pretty reasonable and good goal in that pretty reasonable and good goal in that case I don't think you need to jump case I don't think you need to jump case I don't think you need to jump through the Hoops of learning something through the Hoops of learning something through the Hoops of learning something new I think leaning on the skill set new I think leaning on the skill set new I think leaning on the skill set that you already have and just that you already have and just that you already have and just stretching it a little bit further to stretching it a little bit further to stretching it a little bit further to kind of think about these design kind of think about these design kind of think about these design considerations I mean you can design considerations I mean you can design considerations I mean you can design with pen and paper you can design with with pen and paper you can design with with pen and paper you can design with whatever process you already know you whatever process you already know you whatever process you already know you can open up your code editor and start can open up your code editor and start can open up your code editor and start writing CSS and do your designing live writing CSS and do your designing live writing CSS and do your designing live in the browser rather than setting in the browser rather than setting in the browser rather than setting another hurdle I like to encourage another hurdle I like to encourage another hurdle I like to encourage people to work with what they've got and people to work with what they've got and people to work with what they've got and to play from their strengths I guess to play from their strengths I guess to play from their strengths I guess it's hard enough to take on something it's hard enough to take on something it's hard enough to take on something new I will say though I respect that new I will say though I respect that new I will say though I respect that your bar for like I'm taking this as your bar for like I'm taking this as your bar for like I'm taking this as like a personal attack but also a good like a personal attack but also a good like a personal attack but also a good thing your bar for me entering design is thing your bar for me entering design is thing your bar for me entering design is to actively not suck because you're like to actively not suck because you're like to actively not suck because you're like just lower the bar just make sure that just lower the bar just make sure that just lower the bar just make sure that it's not awful and that is actually a it's not awful and that is actually a it's not awful and that is actually a reasonable place for me to be as a Dev reasonable place for me to be as a Dev reasonable place for me to be as a Dev trying to make something pretty well I trying to make something pretty well I trying to make something pretty well I think that is actually where we're most think that is actually where we're most think that is actually where we're most successful right because I we kind of successful right because I we kind of successful right because I we kind of talked a little bit about the like oh talked a little bit about the like oh talked a little bit about the like oh you know should designers code thing you know should designers code thing you know should designers code thing yeah I think it's nice I think it's a yeah I think it's nice I think it's a yeah I think it's nice I think it's a nice perk I don't think designers need

nice perk I don't think designers need nice perk I don't think designers need to be able to code like a full stack to be able to code like a full stack to be able to code like a full stack developer but I think when they know developer but I think when they know developer but I think when they know their way around CSS properties when their way around CSS properties when their way around CSS properties when they understand the concept of semantic they understand the concept of semantic they understand the concept of semantic HTML that stuff makes them much stronger HTML that stuff makes them much stronger HTML that stuff makes them much stronger designers because then they can start to designers because then they can start to designers because then they can start to think about how their design is going to think about how their design is going to think about how their design is going to be adapted and they can kind of work two be adapted and they can kind of work two be adapted and they can kind of work two steps ahead they understand better the steps ahead they understand better the steps ahead they understand better the limitations of the system and they can limitations of the system and they can limitations of the system and they can think more about like oh well when this think more about like oh well when this think more about like oh well when this is responsive I can visualize how this is responsive I can visualize how this is responsive I can visualize how this is going to stack because I know this is is going to stack because I know this is is going to stack because I know this is going to be like a flexbox thing and I going to be like a flexbox thing and I going to be like a flexbox thing and I know how Flex box works right I think know how Flex box works right I think know how Flex box works right I think the bar is and should be low doing one the bar is and should be low doing one the bar is and should be low doing one job is hard enough we don't need job is hard enough we don't need job is hard enough we don't need everyone to do three jobs everyone to do three jobs everyone to do three jobs my big thing is always right we hear a my big thing is always right we hear a my big thing is always right we hear a lot of should designers code we don't lot of should designers code we don't lot of should designers code we don't hear very much should developers design hear very much should developers design hear very much should developers design the street never seems to go fully two the street never seems to go fully two the street never seems to go fully two ways so I like to encourage it again at ways so I like to encourage it again at ways so I like to encourage it again at that level that I hopefully doesn't feel that level that I hopefully doesn't feel that level that I hopefully doesn't feel intimidating are like I need you to read intimidating are like I need you to read intimidating are like I need you to read these 20 books and write me a full these 20 books and write me a full these 20 books and write me a full report and you know learn three new report and you know learn three new report and you know learn three new programs and and and and right just programs and and and and right just programs and and and and right just learn enough to be able to communicate learn enough to be able to communicate learn enough to be able to communicate learn enough to get the gist of what learn enough to get the gist of what learn enough to get the gist of what they're talking about and what a they're talking about and what a they're talking about and what a designer is prioritizing and when designer is prioritizing and when designer is prioritizing and when they're talking about a figma variable they're talking about a figma variable they're talking about a figma variable like what does that mean just that's like what does that mean just that's like what does that mean just that's different than a JavaScript variable different than a JavaScript variable different than a JavaScript variable like you really you're just trying to do like you really you're just trying to do like you really you're just trying to do enough to bridge the gap and if both enough to bridge the gap and if both enough to bridge the gap and if both parties do that then you meet somewhere parties do that then you meet somewhere parties do that then you meet somewhere in the middle where you can start to in the middle where you can start to in the middle where you can start to make some really make some really make some really awesome I love this because finding that awesome I love this because finding that awesome I love this because finding that design language and I'm using that as a

design language and I'm using that as a design language and I'm using that as a double anandra there which is like both double anandra there which is like both double anandra there which is like both the design language itself but the the design language itself but the the design language itself but the language for the designer to talk to the language for the designer to talk to the language for the designer to talk to the developer is super important and you developer is super important and you developer is super important and you actually have a book a free PDF and actually have a book a free PDF and actually have a book a free PDF and we'll put a link in the show notes that we'll put a link in the show notes that we'll put a link in the show notes that folks who are listening to the show can folks who are listening to the show can folks who are listening to the show can just go and sign up and then they'll get just go and sign up and then they'll get just go and sign up and then they'll get this like almost 200 Page book called this like almost 200 Page book called this like almost 200 Page book called Foundation of designs for developers and Foundation of designs for developers and Foundation of designs for developers and I was impressed when you say foundations I was impressed when you say foundations I was impressed when you say foundations like you're not joking like chapter one like you're not joking like chapter one like you're not joking like chapter one color and like really I I I thought it color and like really I I I thought it color and like really I I I thought it was going to be chapter one rounded was going to be chapter one rounded was going to be chapter one rounded buttons no there's no rounded buttons buttons no there's no rounded buttons buttons no there's no rounded buttons for like a while you're literally like for like a while you're literally like for like a while you're literally like common color common color common color mistakes and that's really fundamental mistakes and that's really fundamental mistakes and that's really fundamental but at the same time though you just but at the same time though you just but at the same time though you just said what is the designer valuing what said what is the designer valuing what said what is the designer valuing what is the designer's like thought process is the designer's like thought process is the designer's like thought process this is what you're trying to teach us this is what you're trying to teach us this is what you're trying to teach us and it's specifically a design book for and it's specifically a design book for and it's specifically a design book for devs it's really good you should be very devs it's really good you should be very devs it's really good you should be very proud of this thank you it's very kind proud of this thank you it's very kind proud of this thank you it's very kind it was something that I was really it was something that I was really it was something that I was really excited to do because it was something excited to do because it was something excited to do because it was something right you mentioned briefly that I have right you mentioned briefly that I have right you mentioned briefly that I have a fine arts degree that was what I went a fine arts degree that was what I went a fine arts degree that was what I went to school for and when you start a fine to school for and when you start a fine to school for and when you start a fine arts degree that's what your classes are arts degree that's what your classes are arts degree that's what your classes are like you know and it's very much like like you know and it's very much like like you know and it's very much like all right yeah you probably think you all right yeah you probably think you all right yeah you probably think you know how to draw you've probably been know how to draw you've probably been know how to draw you've probably been drawing for a long time especially you drawing for a long time especially you drawing for a long time especially you know you come out of high school and you know you come out of high school and you know you come out of high school and you you have to have a portfolio to get into you have to have a portfolio to get into you have to have a portfolio to get into these programs you know and so you you these programs you know and so you you these programs you know and so you you kind of come in thinking you've got some kind of come in thinking you've got some kind of come in thinking you've got some level of knowing what's going on and level of knowing what's going on and level of knowing what's going on and they're like okay step it back we're they're like okay step it back we're they're like okay step it back we're going to talk about perspective we're going to talk about perspective we're going to talk about perspective we're going to talk about color we're going to going to talk about color we're going to going to talk about color we're going to talk about value we're going to like

talk about value we're going to like talk about value we're going to like really start you over and when you do really start you over and when you do really start you over and when you do that you realize kind of how fundamental that you realize kind of how fundamental that you realize kind of how fundamental that is and a lot of that stuff is stuff that is and a lot of that stuff is stuff that is and a lot of that stuff is stuff that most of us pick up naturally right that most of us pick up naturally right that most of us pick up naturally right just moving through the world you kind just moving through the world you kind just moving through the world you kind of have this understanding of how color of have this understanding of how color of have this understanding of how color works because most of us can see a full works because most of us can see a full works because most of us can see a full spectrum of color you have an spectrum of color you have an spectrum of color you have an understanding Loosely of how typography understanding Loosely of how typography understanding Loosely of how typography works because we read constantly but you works because we read constantly but you works because we read constantly but you don't necessarily know why being able to don't necessarily know why being able to don't necessarily know why being able to really articulate the why is crucial I really articulate the why is crucial I really articulate the why is crucial I think especially when we're talking think especially when we're talking think especially when we're talking about UI design and development because about UI design and development because about UI design and development because that's what helps us catch things that that's what helps us catch things that that's what helps us catch things that don't look right I feel like most of the don't look right I feel like most of the don't look right I feel like most of the time people come and they're like I time people come and they're like I time people come and they're like I can't get this to look professional or can't get this to look professional or can't get this to look professional or like something's off and I can't name it like something's off and I can't name it like something's off and I can't name it I can't put words to it and we can't do I can't put words to it and we can't do I can't put words to it and we can't do that unfortunately when we've like that unfortunately when we've like that unfortunately when we've like jumped ahead and we're already we're jumped ahead and we're already we're jumped ahead and we're already we're already thinking in like rounded button already thinking in like rounded button already thinking in like rounded button land right we got to like scale it back land right we got to like scale it back land right we got to like scale it back and be thinking in color and balance and and be thinking in color and balance and and be thinking in color and balance and visual hierarchy land to catch most of visual hierarchy land to catch most of visual hierarchy land to catch most of that stuff and once we get those that stuff and once we get those that stuff and once we get those foundations then we can go like that's foundations then we can go like that's foundations then we can go like that's why that rounded button looked so why that rounded button looked so why that rounded button looked so weird I love that this is really helpful weird I love that this is really helpful weird I love that this is really helpful actually let me ask you this I have to actually let me ask you this I have to actually let me ask you this I have to engage with our design team a lot and I engage with our design team a lot and I engage with our design team a lot and I feel like often times people lead people feel like often times people lead people feel like often times people lead people who are not designers so I'm pointing at who are not designers so I'm pointing at who are not designers so I'm pointing at myself here lead with the solution and myself here lead with the solution and myself here lead with the solution and we'll say something like oh well this we'll say something like oh well this we'll say something like oh well this should be this color or I should this should be this color or I should this should be this color or I should this should be rounded or whatever I'm trying should be rounded or whatever I'm trying should be rounded or whatever I'm trying and this is something I've done maybe and this is something I've done maybe and this is something I've done maybe for the last 10 years to use feeling

for the last 10 years to use feeling for the last 10 years to use feeling words that Express that the design words that Express that the design words that Express that the design doesn't make me feel the way I want to doesn't make me feel the way I want to doesn't make me feel the way I want to feel and I to feel this way on purpose feel and I to feel this way on purpose feel and I to feel this way on purpose so that I don't try to tell them about so that I don't try to tell them about so that I don't try to tell them about color or rounded buttons or you know so color or rounded buttons or you know so color or rounded buttons or you know so I'll say something like this isn't I'll say something like this isn't I'll say something like this isn't energizing or I want to feel this should energizing or I want to feel this should energizing or I want to feel this should be more relaxing and I want to be more be more relaxing and I want to be more be more relaxing and I want to be more subdued and then I leave the solution up subdued and then I leave the solution up subdued and then I leave the solution up to them is that an appropriate way to to them is that an appropriate way to to them is that an appropriate way to interact with the designer because interact with the designer because interact with the designer because otherwise I'd be leading with there's otherwise I'd be leading with there's otherwise I'd be leading with there's too much blue here and that feels like too much blue here and that feels like too much blue here and that feels like it's an it's a subjective opinion as it's an it's a subjective opinion as it's an it's a subjective opinion as opposed to the The Vibes are opposed to the The Vibes are opposed to the The Vibes are wrong I don't want to step on their toes wrong I don't want to step on their toes wrong I don't want to step on their toes no I think that does make sense a lot of no I think that does make sense a lot of no I think that does make sense a lot of design I think and here here's the part design I think and here here's the part design I think and here here's the part where I'm going to sound really annoying where I'm going to sound really annoying where I'm going to sound really annoying I'm going to sound like an annoying art I'm going to sound like an annoying art I'm going to sound like an annoying art person design is about figuring out the person design is about figuring out the person design is about figuring out the problem so before you can even get into problem so before you can even get into problem so before you can even get into the color and the type and all that the color and the type and all that the color and the type and all that stuff all the foundations are ways that stuff all the foundations are ways that stuff all the foundations are ways that we can create a solution but before we we can create a solution but before we we can create a solution but before we can get into that we need to make sure can get into that we need to make sure can get into that we need to make sure that the problem we're solving is the that the problem we're solving is the that the problem we're solving is the one that we want to otherwise we're just one that we want to otherwise we're just one that we want to otherwise we're just gonna kind of dance around it and we're gonna kind of dance around it and we're gonna kind of dance around it and we're gonna keep putting colors on it and gonna keep putting colors on it and gonna keep putting colors on it and we're gonna keep trying new things and we're gonna keep trying new things and we're gonna keep trying new things and it's never going to work 100% right it's never going to work 100% right it's never going to work 100% right because we haven't figured out exactly because we haven't figured out exactly because we haven't figured out exactly the thing that we want to solve so when the thing that we want to solve so when the thing that we want to solve so when you telling me that what I'm hearing bra you telling me that what I'm hearing bra you telling me that what I'm hearing bra is this feeling of like this isn't is this feeling of like this isn't is this feeling of like this isn't communicating the thing that I wanted to communicating the thing that I wanted to communicating the thing that I wanted to communicate right this isn't solving the communicate right this isn't solving the communicate right this isn't solving the problem that I set out to solve with problem that I set out to solve with problem that I set out to solve with this design a lot of times I like to try this design a lot of times I like to try this design a lot of times I like to try and scale it back and try to articulate and scale it back and try to articulate and scale it back and try to articulate the solve what's the need what's the the solve what's the need what's the the solve what's the need what's the goal what's the problem and from there

goal what's the problem and from there goal what's the problem and from there then we have this whole like tool belt then we have this whole like tool belt then we have this whole like tool belt of things that we can reach for that's of things that we can reach for that's of things that we can reach for that's the design part right is the what are the design part right is the what are the design part right is the what are the colors that we're using to the colors that we're using to the colors that we're using to communicate this particular emotion but communicate this particular emotion but communicate this particular emotion but when we don't know the emotion that when we don't know the emotion that when we don't know the emotion that we're trying to capture then we can't we're trying to capture then we can't we're trying to capture then we can't choose colors intentionally so again I choose colors intentionally so again I choose colors intentionally so again I get that that feels a little pretentious get that that feels a little pretentious get that that feels a little pretentious it's like designers are problem solvers it's like designers are problem solvers it's like designers are problem solvers but I don't think it's pretentious but I don't think it's pretentious but I don't think it's pretentious because if I'm talking about an because if I'm talking about an because if I'm talking about an algorithm and you know we're using a algorithm and you know we're using a algorithm and you know we're using a bubble sort or this sort or that sort we bubble sort or this sort or that sort we bubble sort or this sort or that sort we have to always remind ourselves in have to always remind ourselves in have to always remind ourselves in ground ourselves in the business problem ground ourselves in the business problem ground ourselves in the business problem like why are we what is the goal here like why are we what is the goal here like why are we what is the goal here well the goal is for a fast and snappy well the goal is for a fast and snappy well the goal is for a fast and snappy you know UI so okay let's make decisions you know UI so okay let's make decisions you know UI so okay let's make decisions that lean towards the business goal that lean towards the business goal that lean towards the business goal which is a great experience as they go which is a great experience as they go which is a great experience as they go through the shopping cart and then like through the shopping cart and then like through the shopping cart and then like in the book here you have a whole in the book here you have a whole in the book here you have a whole section on color and emotion is the section on color and emotion is the section on color and emotion is the design language for the company is the design language for the company is the design language for the company is the way we write our copy our Pros the way way we write our copy our Pros the way way we write our copy our Pros the way the company presents itself and these the company presents itself and these the company presents itself and these are getting like farther and farther are getting like farther and farther are getting like farther and farther away from the developer writing a for away from the developer writing a for away from the developer writing a for Loop are we an energizing passionate Loop are we an energizing passionate Loop are we an energizing passionate excited company or are we a relaxing and excited company or are we a relaxing and excited company or are we a relaxing and trustworthy and subdued company those trustworthy and subdued company those trustworthy and subdued company those are going to inform colors emotions are going to inform colors emotions are going to inform colors emotions buttons Styles depth skew morphism all buttons Styles depth skew morphism all buttons Styles depth skew morphism all of those things I will throw in there of those things I will throw in there of those things I will throw in there real quick developers write more copy real quick developers write more copy real quick developers write more copy than we think we do I I know that that than we think we do I I know that that than we think we do I I know that that was not the point of what you were was not the point of what you were was not the point of what you were saying but I think about that all the saying but I think about that all the saying but I think about that all the time right is that when we're writing time right is that when we're writing time right is that when we're writing error messages or button names or tool error messages or button names or tool error messages or button names or tool tips that come up when you hover so tips that come up when you hover so tips that come up when you hover so often that ends up being a developer's

often that ends up being a developer's often that ends up being a developer's problem all those little pieces of micro problem all those little pieces of micro problem all those little pieces of micro copy and we don't think about ourselves copy and we don't think about ourselves copy and we don't think about ourselves writing copy because we're not writing writing copy because we're not writing writing copy because we're not writing you know marketing landing page top of you know marketing landing page top of you know marketing landing page top of the funnel kind of stuff but we write so the funnel kind of stuff but we write so the funnel kind of stuff but we write so much and a lot of that makes it into the much and a lot of that makes it into the much and a lot of that makes it into the final product and even just having one final product and even just having one final product and even just having one eye on like yeah we're trying to sound eye on like yeah we're trying to sound eye on like yeah we're trying to sound friendly or we're trying to sound friendly or we're trying to sound friendly or we're trying to sound professional or you know we're trying to professional or you know we're trying to professional or you know we're trying to sound whatever you know that might be sound whatever you know that might be sound whatever you know that might be the difference between a button saying the difference between a button saying the difference between a button saying let's go and a button saying let's go and a button saying let's go and a button saying next and we probably that that is a next and we probably that that is a next and we probably that that is a great point that is a great point and great point that is a great point and great point that is a great point and and a developer might be like it doesn't and a developer might be like it doesn't and a developer might be like it doesn't matter like next or whatever or an arrow matter like next or whatever or an arrow matter like next or whatever or an arrow like but you you'll see this in Windows like but you you'll see this in Windows like but you you'll see this in Windows right like I work at Microsoft in my day right like I work at Microsoft in my day right like I work at Microsoft in my day job and then somewhere in Windows on in job and then somewhere in Windows on in job and then somewhere in Windows on in in 2024 in Windows 11 in the latest in 2024 in Windows 11 in the latest in 2024 in Windows 11 in the latest version of the operating system you see version of the operating system you see version of the operating system you see some weird janky error message that some weird janky error message that some weird janky error message that someone wrote In 1995 you know it may someone wrote In 1995 you know it may someone wrote In 1995 you know it may not be fluent English it may be poorly not be fluent English it may be poorly not be fluent English it may be poorly phrase it may be ambiguous and it's phrase it may be ambiguous and it's phrase it may be ambiguous and it's probably some dude or dudets like error probably some dude or dudets like error probably some dude or dudets like error message that they just wrote on a random message that they just wrote on a random message that they just wrote on a random Tuesday yep and no one ever looked at it Tuesday yep and no one ever looked at it Tuesday yep and no one ever looked at it and that's copy and then you're like ah and that's copy and then you're like ah and that's copy and then you're like ah Windows you suck and you're like you're Windows you suck and you're like you're Windows you suck and you're like you're picking on this one human and the picking on this one human and the picking on this one human and the billion of us now have to like deal with billion of us now have to like deal with billion of us now have to like deal with that those little things matter and that those little things matter and that those little things matter and that's part of design right yeah well in that's part of design right yeah well in that's part of design right yeah well in a lot of times I think the error message a lot of times I think the error message a lot of times I think the error message is a great one right A lot of times when is a great one right A lot of times when is a great one right A lot of times when you see the stuff that a developer has you see the stuff that a developer has you see the stuff that a developer has had to write it means that you as a user had to write it means that you as a user had to write it means that you as a user have like fallen through their cracks have like fallen through their cracks have like fallen through their cracks somewhere something's gone wrong and so somewhere something's gone wrong and so somewhere something's gone wrong and so not only are you now seeing the copy

not only are you now seeing the copy not only are you now seeing the copy that the developer wrote you're seeing that the developer wrote you're seeing that the developer wrote you're seeing at a time when you probably need a at a time when you probably need a at a time when you probably need a little extra explaining or a little little extra explaining or a little little extra explaining or a little extra user friendliness to get you back extra user friendliness to get you back extra user friendliness to get you back on track those tend to be the kind of on track those tend to be the kind of on track those tend to be the kind of gaps where things get rough in the book gaps where things get rough in the book gaps where things get rough in the book you go through a lot of examples you you go through a lot of examples you you go through a lot of examples you have lots of screenshots of like sites have lots of screenshots of like sites have lots of screenshots of like sites that work and sites that don't I do feel that work and sites that don't I do feel that work and sites that don't I do feel a little bit like right now and this is a little bit like right now and this is a little bit like right now and this is as someone who's been on the internet as someone who's been on the internet as someone who's been on the internet you know since it's Inception I feel you know since it's Inception I feel you know since it's Inception I feel like we're heading towards a somewhat like we're heading towards a somewhat like we're heading towards a somewhat homogeneous internet we've all found our homogeneous internet we've all found our homogeneous internet we've all found our colors we've all found our rounded colors we've all found our rounded colors we've all found our rounded buttons most websites have like big hero buttons most websites have like big hero buttons most websites have like big hero image big call to action button eight image big call to action button eight image big call to action button eight boxes you know and then uh pictures of boxes you know and then uh pictures of boxes you know and then uh pictures of people who've got quotes is that a lack people who've got quotes is that a lack people who've got quotes is that a lack of creativity on the part of design or of creativity on the part of design or of creativity on the part of design or is that just that we've literally got it is that just that we've literally got it is that just that we've literally got it so finely honed to what works that every so finely honed to what works that every so finely honed to what works that every website looks the same I think a lot of website looks the same I think a lot of website looks the same I think a lot of that is actually the fact that you don't that is actually the fact that you don't that is actually the fact that you don't necessarily need a designer on your necessarily need a designer on your necessarily need a designer on your staff anymore to make a website that staff anymore to make a website that staff anymore to make a website that doesn't look terrible I think a lot of doesn't look terrible I think a lot of doesn't look terrible I think a lot of times when we're seeing those sites that times when we're seeing those sites that times when we're seeing those sites that look like every other site what we're look like every other site what we're look like every other site what we're actually seeing is like a Squarespace or actually seeing is like a Squarespace or actually seeing is like a Squarespace or you know a template of some sort right you know a template of some sort right you know a template of some sort right those to me feel like WordPress pages those to me feel like WordPress pages those to me feel like WordPress pages and that's not bad I want to be super and that's not bad I want to be super and that's not bad I want to be super clear that I'm not dunking on clear that I'm not dunking on clear that I'm not dunking on Squarespace or WordPress or whatever Squarespace or WordPress or whatever Squarespace or WordPress or whatever because I think the coolest thing about because I think the coolest thing about because I think the coolest thing about the web is the ability for anyone to go the web is the ability for anyone to go the web is the ability for anyone to go on and put their content on there I want on and put their content on there I want on and put their content on there I want to make a Blog about whatever I can do to make a Blog about whatever I can do to make a Blog about whatever I can do that I don't have to be a designer I that I don't have to be a designer I that I don't have to be a designer I don't have to be AEL veler that

don't have to be AEL veler that don't have to be AEL veler that rules like that's awesome genuinely but rules like that's awesome genuinely but rules like that's awesome genuinely but everyone's choosing from a template or everyone's choosing from a template or everyone's choosing from a template or from a list of things that's pre-created from a list of things that's pre-created from a list of things that's pre-created and looks good and they just tweak the and looks good and they just tweak the and looks good and they just tweak the colors on it you know that does tend to colors on it you know that does tend to colors on it you know that does tend to make everything look kind of the same make everything look kind of the same make everything look kind of the same and then I think when we see lots of and then I think when we see lots of and then I think when we see lots of those right if we are a developer who those right if we are a developer who those right if we are a developer who doesn't necessarily feel super doesn't necessarily feel super doesn't necessarily feel super comfortable designing we replicate A comfortable designing we replicate A comfortable designing we replicate A system that we know Works which again system that we know Works which again system that we know Works which again not inherently bad you're hitting a kind not inherently bad you're hitting a kind not inherently bad you're hitting a kind of Middle Ground here where things are of Middle Ground here where things are of Middle Ground here where things are feeling more usable you're replicating feeling more usable you're replicating feeling more usable you're replicating something that works and you don't something that works and you don't something that works and you don't necessarily know why it works but you necessarily know why it works but you necessarily know why it works but you end up with something that's not bad end up with something that's not bad end up with something that's not bad right and that that feels easy to kind right and that that feels easy to kind right and that that feels easy to kind of fall into this trap yeah it's a mixed of fall into this trap yeah it's a mixed of fall into this trap yeah it's a mixed bag right it could be worse you could bag right it could be worse you could bag right it could be worse you could have a site that functions poorly and have a site that functions poorly and have a site that functions poorly and doesn't work and doesn't make any sense doesn't work and doesn't make any sense doesn't work and doesn't make any sense you know with those three pictures at you know with those three pictures at you know with those three pictures at least you know right like well there's least you know right like well there's least you know right like well there's three things here that's three places three things here that's three places three things here that's three places for me to highlight different aspects of for me to highlight different aspects of for me to highlight different aspects of this program I'm selling and there's a this program I'm selling and there's a this program I'm selling and there's a big header and there's a big picture and big header and there's a big picture and big header and there's a big picture and like that tells me that's where my eyes like that tells me that's where my eyes like that tells me that's where my eyes areed supposed to start when I scan the areed supposed to start when I scan the areed supposed to start when I scan the page these things aren't creative they page these things aren't creative they page these things aren't creative they are functional so that means that you're are functional so that means that you're are functional so that means that you're we're at a place now on the internet we're at a place now on the internet we're at a place now on the internet where we can get a bootstrap template where we can get a bootstrap template where we can get a bootstrap template you know and again no disrespect to you know and again no disrespect to you know and again no disrespect to bootstrap no disrespect to WordPress but bootstrap no disrespect to WordPress but bootstrap no disrespect to WordPress but the defaults are good enough but that the defaults are good enough but that the defaults are good enough but that means that we have a bunch of sites that means that we have a bunch of sites that means that we have a bunch of sites that are 80% fine which is kind of like the are 80% fine which is kind of like the are 80% fine which is kind of like the whole chat GPT thing where it can whole chat GPT thing where it can whole chat GPT thing where it can autogenerate a B minus exactly site you autogenerate a B minus exactly site you autogenerate a B minus exactly site you know like we've seen large companies and know like we've seen large companies and know like we've seen large companies and sites make like AIS they can say like sites make like AIS they can say like sites make like AIS they can say like make me a nice shopping page and it'll make me a nice shopping page and it'll make me a nice shopping page and it'll autog genen one and it's like it's fine

autog genen one and it's like it's fine autog genen one and it's like it's fine but it's important I think to know that but it's important I think to know that but it's important I think to know that websites can be amazing right they could websites can be amazing right they could websites can be amazing right they could go Way Beyond and it's like a bummer go Way Beyond and it's like a bummer go Way Beyond and it's like a bummer that we don't do that and it seems like that we don't do that and it seems like that we don't do that and it seems like you're advocating that we should like you're advocating that we should like you're advocating that we should like try harder and go from 80% to 95% try harder and go from 80% to 95% try harder and go from 80% to 95% awesome yeah I mean ideally yes awesome yeah I mean ideally yes awesome yeah I mean ideally yes absolutely that's part of the process absolutely that's part of the process absolutely that's part of the process you start at you know whatever is 60% you start at you know whatever is 60% you start at you know whatever is 60% and then you go what small improvements and then you go what small improvements and then you go what small improvements can I make and that gets you up to 70% can I make and that gets you up to 70% can I make and that gets you up to 70% and well what if I do this you know I and well what if I do this you know I and well what if I do this you know I think that's also a thing that freaks think that's also a thing that freaks think that's also a thing that freaks people out is this feeling that like people out is this feeling that like people out is this feeling that like well I'm not good enough to get to 90% well I'm not good enough to get to 90% well I'm not good enough to get to 90% so I'm going to take this 60% template so I'm going to take this 60% template so I'm going to take this 60% template and I'm GNA say done good enough right and I'm GNA say done good enough right and I'm GNA say done good enough right but we don't think about code that way but we don't think about code that way but we don't think about code that way at least most of the other developers at least most of the other developers at least most of the other developers I've met don't right they write I've met don't right they write I've met don't right they write something to the best of their ability something to the best of their ability something to the best of their ability and then when we know a little more or and then when we know a little more or and then when we know a little more or the best of Standards have changed then the best of Standards have changed then the best of Standards have changed then we usually go back and refactor and it's we usually go back and refactor and it's we usually go back and refactor and it's like oh I learned this new thing I know like oh I learned this new thing I know like oh I learned this new thing I know how to speed this up now or we've been how to speed this up now or we've been how to speed this up now or we've been having this issue and now I get to having this issue and now I get to having this issue and now I get to reopen this and and I can rework it in a reopen this and and I can rework it in a reopen this and and I can rework it in a way that's going to be faster better way that's going to be faster better way that's going to be faster better more efficient whatever designs the same more efficient whatever designs the same more efficient whatever designs the same way it's iterative right what we design way it's iterative right what we design way it's iterative right what we design is not carved into stone we get to go is not carved into stone we get to go is not carved into stone we get to go back and and keep working on it a little back and and keep working on it a little back and and keep working on it a little bit at a time so yeah I think anything bit at a time so yeah I think anything bit at a time so yeah I think anything we can do to keep pushing the boundaries we can do to keep pushing the boundaries we can do to keep pushing the boundaries because I think you're right when you because I think you're right when you because I think you're right when you see a website that feels like it's not see a website that feels like it's not see a website that feels like it's not the same as everything else it sticks the same as everything else it sticks the same as everything else it sticks out to you you remember it yeah um well out to you you remember it yeah um well out to you you remember it yeah um well actually in the world of social media actually in the world of social media actually in the world of social media right now people are talking about like right now people are talking about like right now people are talking about like can we get back to the weird web because can we get back to the weird web because can we get back to the weird web because it's like Facebook and Linkedin it's all it's like Facebook and Linkedin it's all it's like Facebook and Linkedin it's all the same right like we we've just

the same right like we we've just the same right like we we've just circled the drain to the point where circled the drain to the point where circled the drain to the point where everything looks the same like in my everything looks the same like in my everything looks the same like in my taskbar right now I have Mastadon taskbar right now I have Mastadon taskbar right now I have Mastadon threads Twitter and blue sky all pinned threads Twitter and blue sky all pinned threads Twitter and blue sky all pinned as PW and they're all the same because as PW and they're all the same because as PW and they're all the same because we've just got to the same place and I I we've just got to the same place and I I we've just got to the same place and I I feel like I'd like to go back to the feel like I'd like to go back to the feel like I'd like to go back to the bizarrely goofy web it's just like geoc bizarrely goofy web it's just like geoc bizarrely goofy web it's just like geoc cities and like personal blogs that that cities and like personal blogs that that cities and like personal blogs that that look even medium like medium ruined look even medium like medium ruined look even medium like medium ruined blogs for me because everything looks blogs for me because everything looks blogs for me because everything looks like a medium blog now because it's so like a medium blog now because it's so like a medium blog now because it's so minimalist but um you you talk about minimalist but um you you talk about minimalist but um you you talk about this concept in the book I want to dig this concept in the book I want to dig this concept in the book I want to dig into a little bit called Gestalt into a little bit called Gestalt into a little bit called Gestalt principles or gestaltism I'm wondering principles or gestaltism I'm wondering principles or gestaltism I'm wondering if that's a psychology of how we if that's a psychology of how we if that's a psychology of how we perceive things and I'm wondering if perceive things and I'm wondering if perceive things and I'm wondering if that's what's driving us towards this that's what's driving us towards this that's what's driving us towards this monoculture of design Styles sometimes I monoculture of design Styles sometimes I monoculture of design Styles sometimes I hesitate to say like yes that's the hesitate to say like yes that's the hesitate to say like yes that's the thing right because every every design thing right because every every design thing right because every every design thing is just a tool right that's like thing is just a tool right that's like thing is just a tool right that's like oh like we see the color blue in Tech a oh like we see the color blue in Tech a oh like we see the color blue in Tech a lot is blue causing the decline of tech lot is blue causing the decline of tech lot is blue causing the decline of tech creativity no Blue's just a color right creativity no Blue's just a color right creativity no Blue's just a color right okay that's valid that's that's right okay that's valid that's that's right okay that's valid that's that's right right but when we find a shorthand right but when we find a shorthand right but when we find a shorthand that's effective it doesn't make sense that's effective it doesn't make sense that's effective it doesn't make sense for people to lead into it that's what for people to lead into it that's what for people to lead into it that's what those gestal principles are it's like oh those gestal principles are it's like oh those gestal principles are it's like oh we figured out that when we group items we figured out that when we group items we figured out that when we group items in certain ways we can build connections in certain ways we can build connections in certain ways we can build connections between them you know or we can between them you know or we can between them you know or we can intentionally separate them we figured intentionally separate them we figured intentionally separate them we figured out how our brain tries to parse the out how our brain tries to parse the out how our brain tries to parse the information that's available to us information that's available to us information that's available to us visually and so we can kind of lean into visually and so we can kind of lean into visually and so we can kind of lean into things be like oh when there are two things be like oh when there are two things be like oh when there are two items really close to each other we're items really close to each other we're items really close to each other we're going to create a connection between going to create a connection between going to create a connection between them mentally when they're placed far

them mentally when they're placed far them mentally when they're placed far apart we're going to separate them so apart we're going to separate them so apart we're going to separate them so yes when we find things like cards are a yes when we find things like cards are a yes when we find things like cards are a common component that you know you have common component that you know you have common component that you know you have a little box that's got whatever a little box that's got whatever a little box that's got whatever probably a picture and a header and some probably a picture and a header and some probably a picture and a header and some text and maybe a button cards are text and maybe a button cards are text and maybe a button cards are everywhere right Pinterest every Twitter everywhere right Pinterest every Twitter everywhere right Pinterest every Twitter feed or Facebook feed or anything is feed or Facebook feed or anything is feed or Facebook feed or anything is going to be just a list of cards now going to be just a list of cards now going to be just a list of cards now because that works really well it because that works really well it because that works really well it contains all the information a way that contains all the information a way that contains all the information a way that makes sense it creates a boundary they makes sense it creates a boundary they makes sense it creates a boundary they stack well they rearrange well for the stack well they rearrange well for the stack well they rearrange well for the responsive web sometimes things that responsive web sometimes things that responsive web sometimes things that work work right to me it's more about work work right to me it's more about work work right to me it's more about how are we using those right because if how are we using those right because if how are we using those right because if we're creating something that's just a we're creating something that's just a we're creating something that's just a clone of something we've already seen I clone of something we've already seen I clone of something we've already seen I remember when Pinterest first happened remember when Pinterest first happened remember when Pinterest first happened everything was just that mosaic tile everything was just that mosaic tile everything was just that mosaic tile layout it was it was rough that was all layout it was it was rough that was all layout it was it was rough that was all we saw for months I feel like now that's we saw for months I feel like now that's we saw for months I feel like now that's kind of faded out these things move in kind of faded out these things move in kind of faded out these things move in Trends as well I guess is maybe the Trends as well I guess is maybe the Trends as well I guess is maybe the other the point that I should have been other the point that I should have been other the point that I should have been making more making more making more articulately right no no I think you're articulately right no no I think you're articulately right no no I think you're right I think they do move in Trends but right I think they do move in Trends but right I think they do move in Trends but at the same time this gastal theory that at the same time this gastal theory that at the same time this gastal theory that you talk about in the book is you talk about in the book is you talk about in the book is identifying that these are things humans identifying that these are things humans identifying that these are things humans do like these are Universal things this do like these are Universal things this do like these are Universal things this isn't Western culture it's not you know isn't Western culture it's not you know isn't Western culture it's not you know just Northern Hemisphere it's people just Northern Hemisphere it's people just Northern Hemisphere it's people humans like proximity and proximity humans like proximity and proximity humans like proximity and proximity means these things are near each other means these things are near each other means these things are near each other they are related in some way or at least they are related in some way or at least they are related in some way or at least you want me to think they're related and you want me to think they're related and you want me to think they're related and how you can basically manipulate the how you can basically manipulate the how you can basically manipulate the psychology of someone by putting these psychology of someone by putting these psychology of someone by putting these buttons together or things are similar buttons together or things are similar buttons together or things are similar or like you said you close something up or like you said you close something up or like you said you close something up by putting it in a box even in books you

by putting it in a box even in books you by putting it in a box even in books you you're reading a book and then there's you're reading a book and then there's you're reading a book and then there's like that little box in the corner that like that little box in the corner that like that little box in the corner that says hey here's a little as side we says hey here's a little as side we says hey here's a little as side we accept that little aside as being accept that little aside as being accept that little aside as being peripheral but important and that's just peripheral but important and that's just peripheral but important and that's just human psychology that we can use to get human psychology that we can use to get human psychology that we can use to get people to interact with our designs and people to interact with our designs and people to interact with our designs and our apps the way we want them to web our apps the way we want them to web our apps the way we want them to web design is especially interesting I think design is especially interesting I think design is especially interesting I think because we're kind of working with with because we're kind of working with with because we're kind of working with with know as a user's mental model right know as a user's mental model right know as a user's mental model right which is the way that that's all the which is the way that that's all the which is the way that that's all the experience they've gained from experience they've gained from experience they've gained from navigating the web in different ways so navigating the web in different ways so navigating the web in different ways so like when you open a website and there's like when you open a website and there's like when you open a website and there's a logo in the you know top left you a logo in the you know top left you a logo in the you know top left you expect to see that there and you expect expect to see that there and you expect expect to see that there and you expect that when you click on it it takes you that when you click on it it takes you that when you click on it it takes you to the homepage right those are patterns to the homepage right those are patterns to the homepage right those are patterns that we've built up from years of that we've built up from years of that we've built up from years of experience doing this now and we want to experience doing this now and we want to experience doing this now and we want to kind of thread this like needle of being kind of thread this like needle of being kind of thread this like needle of being interesting enough that we don't look interesting enough that we don't look interesting enough that we don't look like everyone else but also not breaking like everyone else but also not breaking like everyone else but also not breaking patterns that people are expecting patterns that people are expecting patterns that people are expecting because then our sites become because then our sites become because then our sites become challenging to use and we start working challenging to use and we start working challenging to use and we start working against the mental model that people against the mental model that people against the mental model that people have created and then they have to stop have created and then they have to stop have created and then they have to stop and think like ah that didn't work the and think like ah that didn't work the and think like ah that didn't work the way that I thought it was going to work way that I thought it was going to work way that I thought it was going to work you know or now I have to remember that you know or now I have to remember that you know or now I have to remember that this site when I right click it does this site when I right click it does this site when I right click it does something different you know or you know something different you know or you know something different you know or you know the the command us to save that I the the command us to save that I the the command us to save that I thought was going to work here it does thought was going to work here it does thought was going to work here it does another thing on this page and that that another thing on this page and that that another thing on this page and that that drives me bonkers you know drives me bonkers you know drives me bonkers you know so I was helping my my 18-year-old fill so I was helping my my 18-year-old fill so I was helping my my 18-year-old fill out his very first taxes we're filling out his very first taxes we're filling out his very first taxes we're filling out the form and you know how you type out the form and you know how you type out the form and you know how you type your address you hit tab you type your your address you hit tab you type your your address you hit tab you type your city you hit Tab and then usually like I city you hit Tab and then usually like I city you hit Tab and then usually like I live in Oregon and I know that you go to live in Oregon and I know that you go to live in Oregon and I know that you go to the drop down for the state of Oregon

the drop down for the state of Oregon the drop down for the state of Oregon and you go oh oh oh because you have to and you go oh oh oh because you have to and you go oh oh oh because you have to go past Ohio and like in Oregon's like go past Ohio and like in Oregon's like go past Ohio and like in Oregon's like three O's right but for some reason on three O's right but for some reason on three O's right but for some reason on this site the dropdown didn't accept this site the dropdown didn't accept this site the dropdown didn't accept text input it required you to click on text input it required you to click on text input it required you to click on it was an what they call an owner draw it was an what they call an owner draw it was an what they call an owner draw component so they had drawn component so they had drawn component so they had drawn custom with some library that they custom with some library that they custom with some library that they gotten this ridiculous drop down and I gotten this ridiculous drop down and I gotten this ridiculous drop down and I it's s like we're going going going it's s like we're going going going it's s like we're going going going going going it's not responding to input going going it's not responding to input going going it's not responding to input well because we were using the keyboard well because we were using the keyboard well because we were using the keyboard so then you got to scroll scroll scroll so then you got to scroll scroll scroll so then you got to scroll scroll scroll and instead of just going o tab it and instead of just going o tab it and instead of just going o tab it didn't work and it's just like wow like didn't work and it's just like wow like didn't work and it's just like wow like it's 2024 we've solved these problems it's 2024 we've solved these problems it's 2024 we've solved these problems like sites like stripe that like want like sites like stripe that like want like sites like stripe that like want your money you can just put a zip code your money you can just put a zip code your money you can just put a zip code and it'll put in the N the county and and it'll put in the N the county and and it'll put in the N the county and the the city it was such a mental speed the the city it was such a mental speed the the city it was such a mental speed bump it was exactly what you're saying bump it was exactly what you're saying bump it was exactly what you're saying like this is supposed to work and why like this is supposed to work and why like this is supposed to work and why doesn't it work it slowed us down doesn't it work it slowed us down doesn't it work it slowed us down significantly and it was so irritating significantly and it was so irritating significantly and it was so irritating and there's someone out there who worked and there's someone out there who worked and there's someone out there who worked on that tax site who wrote that form was on that tax site who wrote that form was on that tax site who wrote that form was it a failure of design failure of it a failure of design failure of it a failure of design failure of component selection failure of testing component selection failure of testing component selection failure of testing you know it was a Cascade it's not I'm you know it was a Cascade it's not I'm you know it was a Cascade it's not I'm not blaming that individual but I'm just not blaming that individual but I'm just not blaming that individual but I'm just saying there's a cascading failure that saying there's a cascading failure that saying there's a cascading failure that the model for filling out forms and the model for filling out forms and the model for filling out forms and entering in a drop down failed that day entering in a drop down failed that day entering in a drop down failed that day and will never be the same and will never be the same and will never be the same no but you remember it right like it no but you remember it right like it no but you remember it right like it stood out to you and you were like that stood out to you and you were like that stood out to you and you were like that was really annoying and that's that's was really annoying and that's that's was really annoying and that's that's rarely the emotion that we want when rarely the emotion that we want when rarely the emotion that we want when people are on the websites that we make people are on the websites that we make people are on the websites that we make yeah you talk about Delight in the book

yeah you talk about Delight in the book yeah you talk about Delight in the book because that's what you want to do like because that's what you want to do like because that's what you want to do like if if it's not delightful whether it be if if it's not delightful whether it be if if it's not delightful whether it be the font or the colors or the components the font or the colors or the components the font or the colors or the components or the widgets or whatever you picked or the widgets or whatever you picked or the widgets or whatever you picked the point is that they go yeah this was the point is that they go yeah this was the point is that they go yeah this was that was a a fun experience or at the that was a a fun experience or at the that was a a fun experience or at the very very least not a bad experience very very least not a bad experience very very least not a bad experience yeah I think there's also some room for yeah I think there's also some room for yeah I think there's also some room for realism here right that sometimes we're realism here right that sometimes we're realism here right that sometimes we're building things that are not going to be building things that are not going to be building things that are not going to be fun and delightful sometimes what we're fun and delightful sometimes what we're fun and delightful sometimes what we're going for is ease or speed like you going for is ease or speed like you going for is ease or speed like you probably never going to have a probably never going to have a probably never going to have a delightful experience doing your taxes I delightful experience doing your taxes I delightful experience doing your taxes I think about that every year when I do my think about that every year when I do my think about that every year when I do my taxes and they do silly little taxes and they do silly little taxes and they do silly little animations and I'm like I'm I'm glad animations and I'm like I'm I'm glad animations and I'm like I'm I'm glad you're having a good time I'm not having you're having a good time I'm not having you're having a good time I'm not having a good time right now one of us should a good time right now one of us should a good time right now one of us should be having a good time I guess I feel be having a good time I guess I feel be having a good time I guess I feel like that with the DU lingo the freaking like that with the DU lingo the freaking like that with the DU lingo the freaking owl on du lingo just like doing its owl on du lingo just like doing its owl on du lingo just like doing its little dance or whatever like just no little dance or whatever like just no little dance or whatever like just no that wasn't I didn't need an animation that wasn't I didn't need an animation that wasn't I didn't need an animation there right I just whiffed that whole there right I just whiffed that whole there right I just whiffed that whole lesson I don't want to watch you dance lesson I don't want to watch you dance lesson I don't want to watch you dance right right now I feel right right now I feel right right now I feel bad exactly oh yeah and everyone talks bad exactly oh yeah and everyone talks bad exactly oh yeah and everyone talks about the dualingo guilt like you know about the dualingo guilt like you know about the dualingo guilt like you know the guilt notifications where it's like the guilt notifications where it's like the guilt notifications where it's like haven't seen you in three days I'm haven't seen you in three days I'm haven't seen you in three days I'm feeling lonely come learn Korean yeah my feeling lonely come learn Korean yeah my feeling lonely come learn Korean yeah my goodness well thank you so much for goodness well thank you so much for goodness well thank you so much for hanging out with me today I want to hanging out with me today I want to hanging out with me today I want to point out to our audience that the ebook point out to our audience that the ebook point out to our audience that the ebook foundations of design for developers is foundations of design for developers is foundations of design for developers is free it's like 200 pages of great advice free it's like 200 pages of great advice free it's like 200 pages of great advice it's very practical knowledge for devs it's very practical knowledge for devs it's very practical knowledge for devs to kind of get involved in the design to kind of get involved in the design to kind of get involved in the design process and you can check that out in process and you can check that out in process and you can check that out in the show notes it's just uh you log in the show notes it's just uh you log in the show notes it's just uh you log in give your email and uh they'll send you give your email and uh they'll send you give your email and uh they'll send you the PDF it's fantastic I've got it on my the PDF it's fantastic I've got it on my the PDF it's fantastic I've got it on my iPad uh and I want to thank you for iPad uh and I want to thank you for iPad uh and I want to thank you for working on it Katherine Grayson nans working on it Katherine Grayson nans working on it Katherine Grayson nans from progress thank you so much for

from progress thank you so much for from progress thank you so much for having me this has been another episode having me this has been another episode having me this has been another episode of Hansel minutes and we'll see you of Hansel minutes and we'll see you of Hansel minutes and we'll see you again next week again next week again next week [Music]