Jan is a product designer currently working on making the future be NO-CODE at Webflow, while traveling around the world. Best known products across the design community are currently Dashboard UI Kit 3.0 and Dashboard UI Kit (selling over 4000 sold copies!!). Ben and Jan sit down to chat in detail about building beautiful and functional design with no-code, diving into some specific project examples. This episode is about going into the details of a project so you learn and get inspired to build your own. You can check out some of Jans recent projects can be found on Dribbble and Behance or UI Kits online.

‍

Jan Losert - Stories Podcast-MP3 for Audio Podcasting

Sun, 4/26 5:44PM • 24:06

SUMMARY KEYWORDS

workflow, people, code, flow, building, project, tutorials, templates, web, sketch, learn, nice, create, recreating, dashboard, design, smaller, maker, buy, terms

SPEAKERS

Jan Losert, Ben Tossell

Ben Tossell  00:00

Jan Losert  00:24

So my name is mo Sir, you might know me from from my YouTube series from my twitter and from my from my products. I'm now quite with getting into all the webflow stuff I'm most likely famous for for the dashboard UI kits products, which we which we come up with with my friend Roman Gwynn. And that's about that I'm, I'm really working on on some client dashboards mostly and nobody's on buffalo buffalo websites. So that's it.

00:58

And also, maybe when Did you get into web flow? How long ago did you get into web flow?

01:03

So basically, that's it. That's a funny story. So I started with web flow in in December 2018, I think, yeah, no. 17 2017. And I basically started sharing the whole story on Instagram. I was like, Hey, I'm not learning a new tool a, I'll be I'll be sharing everything about that. I'll be sharing every every issues, which I have, and basically trying to show the community or basically the followers back then that, that I'm trying to learn something new. And it was sort of getting quite a good, good feedback that people were like, Oh, that's pretty cool. I'd never heard about that flow. And then some people were like, Hey, I tried this yesterday. And it's it's pretty cool. But for me, mostly, it was back then. I when I had these digital products, it was it was most likely that I was she was selling them on gumroad So I always had to do some marketing for myself as well, which was basically the, I don't know, 60% of the income, which I was generating from those products. And I always had to had some friends, usually or friends to build me a landing page for it. And it was usually just like a really quick, quick, quick websites done within like, I don't know, 10 hours. And then I was basically stuck with it, right? Because otherwise I would have to just like call him and be like, Hey, man, can you just help me again? I need to change one button. And he'll be like, Huh, not really. And it was just like, it was just getting annoying for him and for me as well. So basically, I always just like ended up with lending bridge for like a year. And then I was just like, hey, I need to create a new one. So this was this was more for me, like, Hey, I'm now able to own something. And if I'll be able to learn how to do that, this will be pretty cool, right? So I basically actually started with reading Mark Like, I don't know, three months before webflow? Yeah. Where I was where I did my symbols and symbols. And so yeah, the thing is I did the landing page there it was, it was pretty easy. Yeah, for me back then it was it was super easy. It was just like copy paste, since that's basically kind of us base. You're not really coding anything. But they had like, if you want to explore this stuff, it was just like, I don't know, $80 per month or something, which which seems ridiculous back then. And workflow was basically way cheaper than than this for really exporting stuff and not hosting it with them with the red Teamer. So I started with this and I started sharing all of that. I basically learned everything within the university without without really learning anything, anything outside so I can't really code anything. And then basically, Brian, the CEO, CTO of webflow contacted me and he was just like, Hey, man, this is cool. And we started chatting. And over the over the, I don't know, eight or nine months. He was basically just like randomly saying, Hey, what about what about being a being a designer on our team? And that's how I ended up in WebStorm. So yeah, that's how I basically sort of, it was like a really, really, it was it's like a really nice case study for demo as well for web flow that is basically just like a someone who was sitting at home struggling with the code, or like without the code. And then basically, within, I don't know, seven months, I was able to create my portfolio, all of the landing pages. Basically, everything then we released was coded by me, which is fascinating to me still, to this day that I am now able to even code something and it's real thing and I'm still not able to Got to write a single line which is, which is like a really weird thing. But it's I think that's what's magical about the no code thing.

Ben Tossell  05:07

Yeah, well, yeah, funnily enough, anyone who works at maker pad, they started off as a makeup member. So they started off like learning about no code. Some some of the team were very early in when it was a side project for me, and then yeah, I've just like progressed and got better and better and started being more curious about things. And then all of a sudden, they're all a team and they're doing like tutorials and everything else better than me. And it's like, your own community if you're going to hire from there that I think that's a really powerful thing to show and have that story. So what what else interests you about the no code movement that has any other products you're looking to do now because I think that primarily before it was like, design based files, icons and things like that, that you did and then now you Looking more, more like product things where you can link a few things together All

06:05

right, so in terms of tools, I've been recently looking only at members thing because I feel like that's the only thing which I can which I can easily get get around it. But in terms of like building on my own, I think I'll again focus on basically back back in 2018 I released a two products sort of I'm not sure if it's nice to call them products but sort of like a to showcase templates or like a projects which really took off which was really interesting for me as well in terms of like the affiliate program and everything. Yeah. So I think I will get gets really now back to back to doing this because I think I think that's where flow has really cool affiliate project program, which is which can be really which can generate some nice nice income for For people here in Europe, for example, it's probably not sustainable for people living in s NSF, though we probably a lot of templates. But here it's, it's quite good. And I think just like building this stuff and then sharing how I'm building it will be the next mission for me. So So yeah, yeah, I'm really thinking about signing up for the for the campus marketplace program. That will be tricky one because the templates has to be really top notch. But for the showcase, I think you can really basically create anything you want in terms of like, I don't know, like a simple block and then just like share it with the community and then just leave like the affiliate link somewhere there and just like get get some get some free money from from that as well. So that's kind of nice in terms of this. Yeah, I think you think something nobody's paying for Sorry, I'm interrupting. Nobody, nobody is basically paying you for basically nobody's paying you They don't know that you're getting any money from them because if they will sign up, you will get you will get the cut. So nobody is like knowingly giving you any money without. So I think that's the easiest and sort of not like a weird way how to make money in these days because usually you will have to be like on Instagram or something Hey, this is what Flo Yeah, you need to buy with with this code and save 15% and then I will get that in oh seven is just like, Hey, this is something which can really help you build your website. Yeah. It's for free. But if you will sign up, I will get I will get some money. So it's, it's like, it's also a proof that somebody is actually using it right for for me as well. Which I think is it's really it's really cool in terms of like them how it works. Keep asking.

Ben Tossell  08:57

I am so I've bought Few templates on web flow. I've got your dashboard UI kit. And the Yeah,

09:09

where do you like it isn't for web flow. That's pretty people people seem to seem to think that is we had like four people, four people who bought wi K, which is now let me point this out is only sketch Photoshop and it's the resource, mostly sketch and then there's like 15, React red screens, which you can then plug into your into your back end or something. But it's not the workflow but we had already like five people who just like, Hey, where are these workflow templates? And I'm always just like, hey, how did you ended up here with the purchase thinking this is workflow thing? So So yeah, my workflow thing is are only the cards 2.0 and a cards which are on the Showcase.

Ben Tossell  09:57

Okay, yeah. So I got cards in the suitcase. But I had dashboard UI kit for sketch earlier on. So yeah, maybe that's why I'm getting it mixed up. But yeah, I had both. Yeah. I mean, I, I buy templates on web flow, not because I want the template is because I want a component of that. Like, there's something on there, like the cards, you said, and the showcase workflow. A lot of it is about the smaller component. And I thought, it'd be really interesting, like the the guys who are doing tailwind UI, where they have, I mean, I pay for that. I'm not a designer or a developer. But it just like allows me to see, like, how I can change the like, the padding and the margins, to drop shadows, whatever, to mimic the design that they have, like in web flow. So I've always thought why not like, I wonder if there's going to be someone who just like, builds like tell, when do I look for web flow? So it's like you have all these components. Mm hmm. And you can just easily copy paste them across because I think that's why people buy Yeah, the templates and if you could just buy one, membership or whatever it was to one thing that had all these different types of stuff. And I mean, that's that's what people didn't sketch, right? And it's the same thing with web flow, you just end up having a live site rather than then having to translate it over yourself to code. So, yeah, if you decide to go down that route, let me know.

11:24

No, definitely does that. Yeah, I think I think cars are sort of made in a similar fashion that you're basically just building with components, though. And this might be might be might be, I think, I think there is there's different different audiences for these things. So basically, I think templates are, as you said, You're one of the audience. I think you're a smaller one because I think otherwise, it's more like, I don't know business owners. Yeah, who don't have the particular skill but they just find something would they like, just send it to some, some of their friends and they will just sort of put it, put it together. I think that's the biggest One bigger, bigger audience. But it definitely, definitely, there are people who just buy a template to just like find a way how to how to design something like that in Buffalo as well. So,

Ben Tossell  12:12

yeah, for sure. Is there anything else in so I have no clue space that you want to touch on? Is there anything you've seen to drown with or want to be doing with with no code specifically? Or is it more on the web flow design side that you're sort of staying on the moment?

12:28

I feel like I'm still staying on the on the workflow side. I actually bought a few books now about about JavaScript. So trying to now learn how to write something custom, because I had like a few things where I work on some sites where I just wanted I don't know after this was this was obviously CSS thing, but it was like after I don't know, third, third item I want to display like subscribe button or something like that. And then we had like one issue where we wanted to display a pop up after 15 seconds. The user is on the on the side, and then save it to cookies that he saw the pop up. So these things are something small and hopefully hopefully easy to learn. That's what we will find out in upcoming years. But yeah, this is something that I think can really enhance, enhance your sort of skill with workflow once you know, once you have your way around these little, little things, because I think we just like a few lines of code, you can really come up with something more way more creative than what what workflow allows you in terms of in terms of the main main suite. So in JavaScript, maybe but yeah, I'm actually actually I'm really excited finally, to have a time to to dive into these. These maker bread tutorials. I'm actually thinking about having, having fun with just like recording myself recreating these these tutorials and training to come up with something, something different.

Ben Tossell  14:02

Yeah. Well, you should. Yeah, we'll have to post those as well. So we'll do like a matter tutorial.

14:08

Actually, I was remixing, right? Hey, mixing. Cool. I know you're, no, you're

14:16

no, it's, um, one more thing. What I'm thinking about is basically, as you said, dashboard isn't for workflow but I'm thinking about having like, I don't know, one or two screens, thinking about just like creating them in web flow because some of them should be it should be fairly easy and then try to connect them for example to our table and try to get generate data from with appear and in an article in in workflow. And that will be the way for me hopefully to find a way how to learn this stuff on my own, because otherwise, I'm super lazy and without really having like a goal in my mind. Where I, where I want to where I want to end up? I'm always just like, Hmm, maybe no, but if this is something that I can like, I don't know, brep a video about or something that will be, it will be, I think something what I can achieve?

Ben Tossell  15:14

Yeah, for sure. Well, we've got our building projects Bootcamp, which is live, you can take some of those couple of those and actually like projects to do with air tables up your workflow, you'd be able to do that in a couple of hours easily. I think yet, people don't know what they don't know. And as soon as you almost get that aha moment, or know that you can connect these certain things, you're like, ah, I can see how I could do the same scenario for multiple different things. There could be all sorts of different little widgets or whatever you could build for it. So yeah, how are you finding education side of things. I know you do your own YouTube, like courses and stuff. Well, is there a plan there to do more? Is it something you like or sort of just fell into

16:02

No, this is definitely what I tried to what I tried to learn now and try to I don't know, find my wit and find my way to be comfortable with with speaking in front of camera and stuff as I'm trying to do now. But no, it's a it's a I feel like there is there is just a few people who are doing this right now and I think it will be nice for people as well instead of just like having, how the creative look how's it great days and they still have actually someone taking it from the designer perspective to basically just take something from scratch what I just designed and develop it in web flow or maybe even go further and just like have a blank canvas and sketch or figma and really take some projects, develop it that can be with with the dashboard for example, so I can have one, one episode about how to design nice dashboard in in sketch, and then take it from sketch to To webflow and then basically create like the whole course. Because I don't think there is there isn't that many things about about this particular thing on YouTube or anywhere else. So I feel like that's the the word which I hate the niche is still small or it's just like there is like a few few people doing this. So I think like, why not? I had one guy reaching out to me that was like a really awesome testimonial. He was saying that he will be showing these tutorials that the first course which I did basically was will be showing it to his two kids to help them to learn, learn about flow, and I was just like, Man, this is awesome. This is something this is something that makes me go and it's just like, it's not like really releasing anything is more like that. When people say this stuff that they learned about flow, thanks, thanks to me, or they just like, give up on webflow and then they sorted I'm doing stuff in it and they just like, we're like, hey, I need to try this as well. And then They've sent me like a website, which they created. That seems that seems awesome to me. And I think that's why as well building the building the community as well, because I feel like when you see that there are people passionate about something similar, is just like really nice, nice feeling of sort of helping people.

Ben Tossell  18:17

Yeah, I think it spurs people on to see other people in the same situation, who, like just push this project a little bit further, or they've just got into this. And they're new to it and how they start with card or workflow or whatever it is. But yes, it's really helpful to have that community of people around you who've either been there before or in the same same boat as you. So

18:41

yeah, so yeah, definitely, definitely. I'm actually I actually finished cutting the job board, which I was announcing two weeks ago. Finished, finished cutting it so I'm only missing the intro and outro screens. Hopefully that should be done tomorrow. And hopefully, let's say my Day, let's say monday through thursday now so let's say Monday it's hopefully is hopefully going to be out. Yeah, that one is that was super, super fun because it's also my girlfriend's project. So I'm not I didn't have to design anything from scratch. So she basically just request something, I design it, record everything. And it's just like, Hey, here's a new thing. But it's also sort of a real project. So it can, it can sort of help people see like a real life issue which, which is, again, quite unusual, because usually people just take, I don't know, trivial design and code it for example, as I speak, so geek or Nelson, they basically just skate they something was created and try to recreate it in web flow. But this is sort of again, something slightly different. And basically, they can something what's, what's real and what's what's was have to be created for some other purpose and basically taking people to a whole whole journey. Both how to how To create this, yeah, yeah, I'm learning a lot about how to how to be sort of energetic because I think that's, that's one of the hardest thing when you when you sort of coding stuff, and you have to be like, hey.

20:15

So that's, that's, that's what I suck

Ben Tossell  20:18

at, and you have to shout about it and be really excited. And yeah.

20:21

Like,

20:25

how can you do that for like three hours, right? So the so the job board is actually like, I was recording it at like 1am. So it was just like, it was like, after the whole days, I was just like, hey, click here. So that one is that one. It's a long one. But yeah, I need to really learn how to do this in terms of like, maybe maybe do smaller things and then just release it instead of like having like, five hours of something and then cut it that's also really you know that you have to cut the five hours So yes, like I'm postponing it for like, so, so long. So I need to do like a smaller, smaller stuff and smaller pieces and just like maybe release them one by one. During the time, I'll be actually recreating my portfolio now and redesigning it as well. And then creating it did not flow. And I think that will be one of the one of the part where I want to be like, Hey, this is why I did this. This is why I did this. And then I can do it about like, a few small parts and then develop it and

Ben Tossell  21:29

so yeah, I mean, the, like, recording and being on camera and doing things at the same time is gonna sound fun. It's, I mean, luckily, I've hired Tom and Amy who way better at it than I ever was. And yeah, we we try and do different formats of like, workshops and have it more of a guided project that is more informal and casual and you can see someone like fuckin up sometimes, you know, I got to fix this thing, which I think that's unhelpful. But other people want to have like, a really pristine, everything's very everything is perfect. So it's a hard balance, I think it's about, like, there's lots we will do in tutorials or no code. And it's awesome to see so many different people doing different things. I think it's like a media, like a media world where we need different personalities, we need different types of people doing different types of tutorials in their own style and things. So it's going to be interesting to see. It was a site called no code dot video, which launched yesterday, it was announced yesterday, I think. Okay, and I was talking with him before and he and that's, it looks like a twitch style

22:41

site and

Ben Tossell  22:43

all the different people who do different tutorials and different videos and things so you can see different like, different experiences and stuff there which is awesome.

22:53

Nice. That's looking really nice. But that's from YouTube, right that's pulling this maybe. Yeah,

Ben Tossell  22:59

I don't know whether it was my Whether it's more of a manual alteration on his side,

23:06

you see that? Yeah.

23:09

I'm going to check it out.

Ben Tossell  23:11

For sure. And also, well, if there's anything else you want to plug, we'll wrap it up here. And it's been great to chat with you.

23:18

No, I think I'm fine. And definitely I'm wishing luck to everyone who's new to this. And don't. Don't give up because it's really, for us designers. If I'm speaking as myself, for us designers, I think it's the step step for the future. And I think if I think in few years, once you won't be able to cover your own stuff, I think it will be. It will be sort of weird that you can do it because it's super easy.

23:47

Yeah, I agree.

23:49

Thanks so much, man.

Ben Tossell  23:50

Cool. Thank you so much. Well, thanks so much for listening. You can find us online at maker pad.co or on Twitter at maker that we'd love to hear Do you enjoy this episode? what we do next?