Jordan Hudgens: And so that's why we're going into it right away and it's because whenever I've tried to design anything whether it's a Web site or a logo or anything like that. One of the hardest steps I have is that first one which is I've no idea what to actually design and when I will speak with a number of other designers they kind of almost skip over that part a little bit. And to me without that, you really can't do anything else. And so I wanted to talk with you and get kind of what your personal system is for getting inspiration. So when I say I need feature X Y Z on devcamp how do you know that it should be this box with these kinds of rounded edges and where do you place all the components and just kind of talk to how you get those kinds of ideas for the projects you work on.

Jesse Cooke: Right. Absolutely, this is something that I find a lot of designers are kind of hesitant to talk about sometimes not with other designers but maybe in a situation like this because it's almost like you know you're giving away a little bit of the "secret sauce". The concept of looking at other works for inspiration is crucial. There's no reason why that's how we are getting better at our design than we're iterating and our design is changing, the way apps look today are different than they looked three years ago. And they're going to look different three years from now, and everyone is kind of, you know developing and we moved from let's go back in time six years everything was using what's called skew morphic design.

If you think of the original iPhone iOS. The notes had the kind of fake leather right over the top you know. Everything looked like it was a digital rendition of a physical item. And so the shading, drop shadow, everything was like really like pseudo-realistic right. And that's called skew morphism. All of a sudden that became really outdated. It was iOS 7 when all of a sudden it went totally flat. Like hardly any drop shadows. Everything was flat colors hardly any gradients and there was really jarring for a lot of people outside the design community because inside the design community we already been seeing that happen. We'd been seeing Websites doing that and so then IOS did it and the world was like I don't like this.

The reason why Steve Jobs wanted the scheme morphic designed first is that people were not used to working on a smartphone. So he wanted a lot of elements of the real world on it. So at least people would feel a little bit safer kind of making that jump into the digital realm. The reason I bring these things up is that the design is always changing and it's going to start communicating to the public in different ways. We didn't know how to scroll really well when Web sites first came out. Everyone is shoving all the content above the fold they were putting it in the first 900 pixels because that's how they did it with newspapers. Right. Newspapers you put all the big stories up on there. And so when we invented Web site it's like oh this is just kind of a newspaper on the computer. So that's what people try to do and if you go back in 1998 Website is just got all the things like up before you scroll.

JH: Absolutely.

JC: And then you know we've now hit 2010. People figured out that you can scroll and then you start seeing a lot more landing pages come up where you can tell a story you know section by section by section. Design continues to change, so you need to be able to go out see what apps are looking like see what Web sites are looking like. So the first thing that I do there's two really popular Web sites where designers publish their work. They publish it one day to kind of build a following and you know it's like Instagram but just for designs or others there's bēhance and there's dribbble.

They're both really great. I just bounce back and forth between both of them. You're not necessarily going there to say "I'm going to go and completely mimic another design". Odds are no one's really designed the exact application that you're doing. Maybe sometimes they have and there's nothing wrong with looking at those and be like oh that's interesting they put those settings in this way or they took this action in this way that's totally fine. Sometimes there's an objectively right answer or way to do something and I've hit things or I'm just like this is the only right way to do this. But then there's a lot of subjectivity in design and so you definitely can kind of pivot and be like I love most of what they did here but there are a few things that they could have done differently. From a strictly aesthetic perspective, you're going in and you're looking at you know what kind of color palette are these people using. You don't need to reinvent the wheel for a lot of these things so if I'm designing an application and the application has a list with profile photos on the left and some metadata on the right.

Do you know how many times that's been designed? Like just an index of objects.

So many times. So go and look and be like OK do I go a really strong and dark name like username and then like a light-colored thin font off to the right. Or do I make them both thin or do I make this blue so that I know that I can click it? So there's a lot of different decisions you can make. As opposed to saying this is the only way that you're going to do this going forward.

No, it's about the process. So the first thing you should do when you know the type of things that need design you've already gotten through the user experience a lot of times this helps in the user experience as well. Like forgot password. Can you immediately think of all the screens that need to exist for a Forgot Password? Do you click and then it says an e-mail link is on the way or does it say Hey we just texted you a code and here is this. What's that exact process? Go grab your phone, log out of Facebook, and then click forgot password and see how they do it. See how all these other apps are doing it. Because then you're getting a really good user experience right there. "Oh, that's a huge pain I had to open my mail on my phone or on my desktop. No, I like the text version better".

It's such a benefit don't ignore that, to be able to test things out and that'll just help you kind of get forward and you're not. I mean that's just the right way to do it.

JH: Absolutely, and with that when you know the application you're building and the feature set that's definitely one part of it. Do you find that when you are not actually going and you don't have a specific project in mind do you still just to continually learn and find new things? Are you still going to those websites just to look out of curiosity?

JC: Yeah it's like Instagram right.? It's like a social network, and even more so you know I have a bookmark folder, and whenever I'm on any website and I like something that they did I'll bookmark it. I'm like. "Oh man, I really like how they showed this testimonial". The next time I'm designing the Web site I'm going to come and look at this testimonial, right? So I'm always saving stuff that I like. I take pictures of patterns I like out in the real world just like oh this could be a cool background pattern. Definitely, when I see apps that I really like the design, a perfect example is Venmo versus the cash app, by Square. Two very different interfaces. And personally I just love the cash app and so I use it because that's the design I like. But you can compare that and you can be like OK you know Venmo is going for this and cash is going for this.

Why? They obviously maybe made a decision of why to do this type of design and why they did this type of design. You're just constantly adding to that mental portfolio especially because a big tool you have to solve problems both in user experience but also definitely in user interface is precedence. Whenever you hit a point it's so helpful if you have a problem like "How am I going to design that?" if you've just got something logged in your head. It's just like oh I know snap chat does something like this.

And you can go to that and you can look at the precedents and you can see if that worked well or worked poorly. It gives you just like such a foothold and you're not just like spinning your tires all the time.

JH: That's huge. That's one of the biggest points on why I wanted to include this guide in the entire course and to me, this is actually one of the most important things that everyone will take away from the course because I personally feel especially when I was younger and I was really struggling with coming up with design ideas because there would be so many times I'd be the only developer on a project which I did do everything, not just the web application but also the logo and the color scheme and everything.

I always had this mindset that I needed in order to build a good design it all needed to be done from scratch. It had to be one of a kind. I couldn't look at anything else. This had to be just something that came out of nothing.

JC: Yeah.

JH: And that never turned out well.

You know we haven't even talked about that. You know there are the apples of the world and those types of people. They have a lot of thought processes and they spent tens of millions of dollars in researching what makes a good user interface and to simply ignore that is irresponsible.

JC: it really is.

JH: learning from all of the work that's been done by people who've been doing this for a very long time. That's a very critical component of it. And if we skip past that we're constantly going to be running into the same problems over and over again where we just kind of get stuck and can't really build something that feels professional.

JC: Right, take for example Snapchat, and then all of a sudden Facebook comes out with a very similar feature on Instagram and then adds that live streaming to its Facebook platform or the live streaming on Facebook, compare that to Meerkat or periscope things like that. They look extremely similar. Why? Because there's a lot of objectively correct ways to do things in there. It's like they're going to look really similar because to make it look different would just make it worse. There's just certain things, think about whether we just have hearts come up underneath or do we have comments that also come up underneath.

If you look at Facebook live streaming and Periscope it's really close. Facebook has come over from the right and Periscope had them come up from underneath. It's so nuanced and close but it's like how else are you supposed to do it. There's nothing wrong with looking at how other people are doing it and then making a decision is that the right way. Is that the wrong way. Is there a subjectively different way that could be just as good? Yeah! But if you're not even looking at it because you're scared that you may be copying something then you're doing yourself a huge disservice.

JH: I think that is 100% accurate. Some homework for you as students going through this is before you even go on to the next guide. I definitely recommend for you to go to a few of those applications like dribbble and be hands-on with these so that you can start to see what's out there. When Jessie originally showed those to me because that was not really the part of the world I dove into. I was absolutely fascinated. It was like all of these different screens and concepts of the very talented designers are coming up with, those are things I could learn from and those are things that like you said you can develop that mental portfolio those things that whenever I start to think about a new feature or some new page that I need to create all of a sudden I'm not starting from scratch I'm able to leverage what I've learned from others especially others that have been doing that for a very long time.

Have fun looking at those sites and we'll see you in the next guide.