It’s not so complicated: UX and UI design for startups

Haley Stracher: Hey, everyone. My name is Haley. I’m a UI/UX designer, as well as an agency owner and I work with everything from small businesses to big businesses to startups to Fortune 500 helping businesses grow through awesome user experiences.

Spyros Tsoukalas: Welcome to the Growth Mentor Podcast. I’m excited to dive into the world of UX/UI. It’s the first episode ever we have on the topic. So, let’s hit it. Haley, would you tell us something we don’t know about UX and UI?

Haley Stracher: Yeah, something that a lot of people don’t know about UX and UI, is that you have to use two different sides of your brain. The UI user interface has all of the graphics, and that’s kind of the artsy side of things. The UX is all of the logical sides of things like what happens when someone clicks a button. What happens, in this scenario, if this user is forging a different path, or selects something differently? And so, it’s kind of interesting because you’re constantly switching your mind from an artsy perspective to a logical perspective, which is like two sides of your brain.

Spyros Tsoukalas: First time I hear that. So could we define what UX is and then what UI is so that people can follow this conversation? So that everyone will be on the same page.

Haley Stracher: Yeah, that’s a great question. So, sometimes you have designers because they require two totally different sides of your brain, and sometimes you have just UI designers. And sometimes you have just UX designers, but they work really hand in hand. So, UI stands for User Interface. And that’s a little more tangible, you can see it. It’s somebody’s branding, the colors of the buttons, and the graphics if they have some fun animations. When you look at an application, whether on desktop or mobile, how it makes you feel, you feel calm, if it has neutral tones, or if it has really saturated, bright neon tones. Maybe it’s like fun and vibrant. So, that’s sort of the UI, you can think of it as kind of graphics. And then the UX is more of the back side of that. It’s the foundation on which the UI is built. So, what kind of experience do we want to have? How do people get it? Um, you know, back to the homepage, does it feel like a good easy flow? And the easiest example of this is if you’ve ever had to set up anything in your home, like if you’ve ever set up your Alexa device, or you got a new phone, and you had to enter in all of the information if it’s really a lot, and you’re frustrated, and you can’t get back and enter the wrong thing, and you don’t know where to go. You know, that’s what makes a good or bad UX user experience.

Spyros Tsoukalas: Obviously, they’re very frequently heard. So would you elaborate a little more on their relationship? Like, what brings them together? What separates them? Because it’s obvious what each of those terms is? But like, could you elaborate on their relationship?

Haley Stracher: Yeah, I love this question. Because I think I harp on it all of the time. To have good software, you need a great foundation of both, you need great UX and great UI. I’ll do a scenario where you have amazing branding, and all the graphics are really cool. But somebody can’t enter their password, or maybe they forgot their password, and they can’t sign in, and your UX isn’t there. So like, you know, it can be really cool visually. But if you don’t have the foundation of a good user experience, people will get frustrated, and they might abandon your software. And the same goes the other way. If you have great user experience and great flows, but your graphics and your branding don’t feel modern or up to date, someone might like enjoy using your software. But they say this is kind of outdated, I don’t know if they’re really with the times, because that’s how your branding is perceived. I know a lot of when you’re a startup and you’re doing pitch decks, and you’re talking to investors, branding and graphics really plays a big role in giving your company that credibility to say, hey, yeah, I’m a mature company that is branded and has professional graphics done can be a really big deal, too. So they both are just so important in their own ways. And you need both of them together to have like, you know, a really successful platform.

Spyros Tsoukalas: So, now we know what they are and how they relate. Would you like to dive into why it’s UX and UI? They are important. Are they important for startups as well? We are a platform full of startups. So, is there a special role for them in growing a startup?

Haley Stracher: Yeah, definitely. I love these questions because this is one what I also talk about constantly. Like, if you have an idea, right? And you’re like, Oh, this is and you validated your idea, and they’re like, people need this idea, I need the solution in my life. A lot of people say, Okay, now I need to develop my idea. So what do they do? They go to developers. And a lot of times, developers will ask you, okay, what’s the user flow? What is the interface look like? What is your field? We’ll ask you all the questions that you really need a UI/UX designer to help you solve. When people talk to me who have come to me before they’ve gone to development, they have a much better experience in development, because all of the screens are laid out. They know what the platform does. And they can actually shop around different developers and get a really competitive, good price. Because they have the knowledge of what their platform is. So UI UX designers really can be like the bedrock after you validate your idea. And after you do that research, can go to a designer get like a quick prototype working, get your branding, going, put it in your pitch decks, and then go to development and then talk with investors. A lot of people have development agencies develop it. And it’s missing something. Either it’s missing some of the UX or some of the UI, and they’re not super happy with it. And then they bring a designer in to improve it. Because like a lot of the time I see it more often than not.

Spyros Tsoukalas: So, when things go south with UX and UI, what’s the problem in the startup?

Haley Stracher: I guess with UI in startups it’s hard because you only have a certain amount of maybe seed funding, or you’ve done one round of funding, and you’re just starting, right? So the problem is, if your branding or your app isn’t looking professional, it just gets harder to get the investors you want to get. So, by doing the UI, upfront, it helps you look more professional, you’ll get more investors and funding, it helps convey your message a little better. So people are like, mentally on board with what you’re doing. And so I’ve seen apps that have great ideas, and amazing experiences, but they don’t have that branding. And they can’t like to get to that next level, you know, they can’t make that next step. And I’ve seen the opposite, where people focus a lot on branding. And they can get to that next step. But they don’t focus on the user experience. So they have a bunch of polls and missing stuff. And it’s when you have holes in missing stuff. And then you have to have development, fix it, it can become very costly. It’s called a common phrase I’ve heard used is like tech debt, when you move too quickly, and you haven’t considered all of the scenarios and like a user UX flow. And then you have all of this just random stuff in your app that people don’t know how to use and aren’t like, seamless or doesn’t feel consistent with everything. And it’s causing a lot of frustration, your customer support is like death because they have a million phone calls about people not being able to use stuff. And it can become a really big problem if you acquire a lot of tech debt. And you don’t have someone doing UI/UX at the very beginning of your idea.

Spyros Tsoukalas: Thanks for sharing all this. I have made all the mistakes you mentioned when I was having my own startup in the past. So, this is an honest question on my side. I have never had a UX designer in my team. So what do they do?

Haley Stracher: A UX designer is somebody who worked in the knot, they’re actually a really good bridge between you and your development team. They can kind of speak a little bit of the development language and speak a little of your language. So like if a developer comes to you, and they’re like – I’ll just use Forgot Password – hey, the Forgot Password flow is broken. You know, we need email or phone number or this or that a UX person can say, hey, based on the target audience, most people are going to use the phone number, we’re going to put phone numbers, the first user flow and email is the second user flow to make the easiest, most seamless experience when someone forgets their password. And then they outline exactly what happens when you click it. And all of the screens follow. So development is absolutely clear on what is supposed to happen. So they’re like the interpreters, right? Between your mind the CEO or sales or that type of thing and the developing mind which is like the logic of it.

Spyros Tsoukalas: And how would a UI designer add to this equation?

Haley Stracher: Yes, we UI designers, the one who says these are the colors of buttons, primary button should be this color, a secondary button should be this color, a field should look like this. And things like that they fill in like the colors, the typography, the fonts, things like that. And oftentimes, if a UI designer has a style guide for your platform, developers can work off of that. So if they need to make a new screen, you don’t always need to your UI designer to make the new screen, let’s take the Forgot Password example. If they know what color the buttons are consistently through the app, they can say, okay, according to the UI designer style guide, this is the color button. So I know that this button on the page should be like this. And that’s kind of how a UI designer and why a style guide is actually really important. Not part of your question, but a style guide is an important part of your platform, too.

Spyros Tsoukalas: Why do I have this impression, and the style guide is a great example of that. At small teams, the same person takes care of both, let’s say UX and UI, in a way in collaboration with other team members, of course, but their hats, at least would be UX and UI.

Haley Stracher: Yeah, it’s often the case because, I guess, if we’re taking that same example of Forgot Password, I’m the person who says, Hey, development team, we want screens, A, B, and C. They can write it out, like in a wireframe form. And I really like low fidelity, just like rectangle, and this is what’s supposed to be on the screen. But if they’re also a UI designer, they can take it to the next step, and actually, design the screen and say, Hey, not only is this the user experience flow, but these are screens, A, B, and C, and this is exactly how I want it to look. So instead of communicating that between two people, the same person can make both of those things happen, and then give it to the development team. So that’s why it’s for small companies and even med size companies, they have that person in the same role, because it reduces the friction of having two people communicate, when one person if they have both of those skills, they can do both of them. So, I love when it’s a joint UI/UX designer. For that reason, it just makes things easier.

Spyros Tsoukalas: Thanks for explaining it with so many details. So let’s say that we are a startup and there is a person that’s joining us and we will be dealing with UX. And it’s either an in-house full team member or a consultant or an external partner. Where should we start doing stuff around UX like we’re what’s the point A that they would they should start analyzing or dealing with?

Haley Stracher: So, in this example, the startup has just started, you have a UX person, and you’re building the foundation. The first thing you want to do is come up with a product roadmap. I like to use one that’s super, super simple, and you organise every feature into four categories, must-have, nice to have, delightful, and can happen later. And every feature requirement goes into one of these buckets. For your MVP or your Minimum Viable Product, you want to focus on the must-haves first. So, after your product roadmap, when you organize every feature into these four buckets, you figure out which feature in the must-have column, you’re going to pick up first. And then you have your UX designer. Start building out user flows, which is the user clicks here, then they click here, then they click here. And wireframes, which is like sketches, and very like low fidelity versions of the screen. So you can start to visualize what the flow of that one feature would be. For a very new first-starting startup, I would definitely begin with a home screen, a dashboard, or something that’s central to their application, and then work backward. So, once you’re done with like the inside of the application, then do bits of the outside like onboarding or registration and stuff like that.

Spyros Tsoukalas: Okay, how about the UI team member that is joining, what should they be paying attention to?

Haley Stracher: Yeah, so if you already have something that you DIY, that you did it yourself, you’re like, I’m not super thrilled with it. But please help me UI designer, you want the UI designer to make sample screens. So take like a set of three or four screens and come up with consistent branding and give this is my vision for how you can make your brand consistent. These are the improvements to the colors I want to make. And then once you guys are on the same page with a couple of screens, that’s when you want them to make the thing we were talking about before the style guide so that you have this guide that informs the entire application, these buttons should be this color, the headline should all be this, size, font. We should be using this type of illustration, this type of photography so that when they do all of the screens, it feels consistent and cohesive.

Spyros Tsoukalas: So, let’s help a founder. I am a founder who deals with the following decision. How early should they start investing in taking care of UX and UI? You partially answered earlier when you said that it’s better to start with UX and UI in a way. But like, let’s say that they have already started. How early should they start paying attention to them?

Haley Stracher: As early as you can, because the second that your designs go into development, it is so much more time and money that you have to like redo it. So, if you could do it before development, right after idea validation, some people use the UI designs to validate the idea, like they’ll take their customers through a prototype or something. So you can even do it before idea validation to put it in your pitch deck to show the prototype during your user interviews. You could do that too. But I’m definitely before to develop.

Spyros Tsoukalas: So immediately. The answer is immediate.

Haley Stracher: Yeah.

Spyros Tsoukalas: Isn’t it easier nowadays that in the early stages, not all startups do hard code. Their applications, like so-called the no-code trend, help people prototype and iterate around their prototypes when the UX/UI person ends up joining. I mean, it’s not that complicated, because there’s not the whole investment in developing stuff is not going to the garbage because it wasn’t that painful through no code.

Haley Stracher: Yeah, I’ve heard mixed reviews about no-code and low code platforms. I think the biggest problem that people do have with it currently, is kind of like what you said, like, it’s really easy from a development perspective, but it’s hard to make it pretty. It’s hard to really come in with that graphics mindset. And, those platforms don’t really guide you in that way. So, if you do low code or no code, or you do some of those, I know there’s like proto die, oh, and a couple of other ones that you can use to make a very simple one. And then you have someone come in and improve it. I think that’s okay, too. You know, it’s definitely a path that you can go down just to validate what you have getting really, you know. A quick and dirty MVP out into the world and then have someone come in and really make it professional and clean it up.

Spyros Tsoukalas: And given your activities, professional activities, what would you say is like the spectrum, of course, that startup, like could invest in UX UI? Like what’s the cost that could be correlated with such activities?

Haley Stracher: Yeah, that’s a great question. Because development can range like quite a bit, too, depending on how complex it is. So, it’s similar with the design. I think that from a design perspective, you can spend anywhere from like 5,000 to 20,000 on the actual, like design of your application. And I wouldn’t suggest people spend more than 20,000 if it’s their MVP, because you want it to be kind of like sleek and lean, and just get it out there.

Spyros Tsoukalas: Okay, that’s a decent amount. So, in order to give them motivation to two days of UX and UI as early as possible, what does successful UX and UI look like? Like, what problems do they do? Does this activity solve my startup?

Haley Stracher: Yeah, well, it’s a decent size investment. Do you think about what you spend after that, I mean, development is 20,000 enough easy. So, if you’re able to save 5, 10, and 20,000 by doing the design first, from the development, or from like the redo it, it saves you in the long run. So, a successful UI/UX feels easy, and it looks great. Your customer comes to your platform, and they feel and they know, like it’s for them. Like, I came to this platform, and it feels like Oh, wow. Not only is this easy to use, but you know, it’s vibrant or fun, or whatever your brand message, you know, is they get that feeling. And then they want to come back and keep using it. And that’s what a really awesome platform looks and feels like. And you know, we always have those apps that we love to use, some of them not so pretty. Some of them are beautiful, right? And so you keep coming back to them because they’re helping you accomplish the problem that you’re solving, which is number one, that’s the UX and it’s easy to use to accomplish the problem. And the UI is it makes you feel good. You know you came out of that platform, feeling like you saw something awesome. And it felt good. I don’t know how else to explain it.

Spyros Tsoukalas: I really don’t like the word that was used earlier because given the investment you might experience later, it’s decent is not enough to describe how impactful or meaningful investing early in UX and UI could be for later stages. So, last question for the day, and thanks for sharing all those insights. Do you have any tools that you think people should know about when dealing with UX and UI, given that you might be, we might be talking to a founder now who doesn’t know anything about the domain, so any tools you recommend?

Haley Stracher: Yeah, I’ll go from like, the easiest ones to a little bit more complicated. I think one of my favorite ones for founders who are just starting out is Lucid Chart. I have found that just sketching things out or putting boxes around is really awesome. And when you do that, and then you bring in UI/UX designer, and you bring in, you know, the people who you need, they have a vision of they can see what you’re talking about. It’s a great way to visually map out all of your things. So, I love Lucid Chart. Miro has something really similar. There’s a bunch of types of those types of platforms. And then FigJam is another one. I would say Lucid Chart is probably one of the easier ones to use. Miro was middle and FigJam is maybe a little bit more complex, because they have like sticky notes and a bunch of other features that you can do on them. But it’s basically like a whiteboard. And that’s where I would really start and recommend founders to start as like any tip of the virtual whiteboard. And if you have trouble with any technologies, like Lucid Chart, whatever, if you have Microsoft Paint, and you map it out, that’s okay, too. Like whatever you can do to get your ideas out on paper, I think is the most important kind of takeaway that I would say for founders.

Spyros Tsoukalas: Haley, thank you very much for joining us today and sharing all those experiences that you have acquired along your career around UX and UI. And I think this will be really helpful for people that have been at least in my shoes in the past. Being founders who don’t know, how to deal with those aspects of their products.

Haley Stracher: Yeah, well, thank you so much for having me. I had a lot of fun.