Bruno Simon: So that's the famous portfolio that I built just to showcase to my students. And it ended up, uh, like boosting my career in crazy ways. Anyway, it's a portfolio with physics. I used to play a lot of Micro Machine. It's a, it's a very old game where we control some, uh, some small car on various environment. And, um, and it looks a lot like this. I was really inspired. And it's just to showcase what I do in life. You can find some info over there, you can follow me on links, you need to go on the area and then press enter. I was testing, like, performance when going through a wall. It works so well that I just kept it. You can play, like, oh, bowling like this, and you can reset it.
And by the way, there's a trick. As you can see, there is shadows, there are lights, etc. But it's just, like, a full trick. There is actually no light in those. It's called matcaps. But if you want to learn about matcaps, you're gonna have to take Three.js Journey, obviously.
Dave Kiss: Three.js Journey? That's Bruno's online course designed to teach people how to use Three.js and WebGL effectively to build impressive 3D web applications. And who's Bruno? He's a creative developer from France who specializes in crafting unique and interactive web experiences like the one you just saw. His work has gained him viral popularity, numerous web development awards, and the admiration of a lot of us here at Mux, who were super psyched when he became a customer.
In this chat, I asked Bruno about his inspirations, his thoughts on 3D in the grand scope, and new technologies he wants to learn and is excited to see. He also explained how he chose to use Mux for the video on his site. And why it was the only solution that worked for him. It's a fun one. Let's get into it.
You mentioned Three.js Journey. I just want you to give your pitch, your shout-out for what Three.js Journey is and who it's for and everything that you recommend about enrolling for, as a creative developer.
Bruno Simon: Yeah, sure. If you want to add 3D to website to make like a video games or just to, to showcase a product or to create some crazy interactions, some depth to your project, you need to, uh, create it. You have different solution and the best solution currently is Three.js. It's a library. Well, it makes, uh, like creating 3D for the web much, much easier. Yet, it's huge because creating 3D is like crazy. You can add, uh, textures, geometries, create your own geometries, make things move around, animate stuff, click on stuff, et cetera. So Three.js makes it simple, but it's still huge. And that's the solution. Uh, I mean, that's the problem I'm, I'm resolving with Three.js Journey.
It's a huge course. So it's, uh, I think today is 72 hours of video. You don't need to do the whole course in order to get good at Three.js. It's just that I am trying to cover as much as possible. And after just a few chapters, you will be able to create your own 3D website. You will be able to create a games in the browser. Uh, your friends will be just able to just click on the link you send and they will be able to, to enjoy the experiences you've built. And, uh, so it's a 72 hours of video available in in videos, in text, there is a Discord server. I personally check the discord server every day, multiple times, huge community. We have challenge. We have some selections. There is currently more than 30, I think, 34, 000 students. So they all enjoy it a lot. And I'm adding more content to it. I'm currently at these days working on, uh, 12 new lessons. So I have no idea how long it's going to be, maybe 20 hours video or something like that. And, uh, yeah, best way to learn how to create a 3D website.
Dave Kiss: So cool. So you, you could, and maybe you do for some of your like free lessons and just for discovery, but you could upload all of your video content to something like YouTube. And I'm curious to dig into. What specifically for Mux on your platform, uh, has brought value or why you chose Mux in the first place to be able to share the video content that you're producing?
Bruno Simon: Yeah, you said I could, but I can't, I really need a solution like, uh, like Mux. The idea is that, um, if you put it on YouTube or Vimeo or whatever solution, uh, there is always an issue, like something that is broken. I mean, I tried, like I look for the best solution and first it's because I need those videos to be only accessible to users. That's paid for the course. I could create a custom solution like Amazon, you know, S3, et cetera. So AWS, um, to host them, it was extremely complex and extremely expensive. And then someone said, but there is Mux and I checked it's exactly what I needed. But. Like much cheaper than, uh, than using AWS uh, Amazon AWS. So that's why I actually have no choice. It was the best solution.
And also because Mux provide other features that I discovered along the way. First, uh, this one was a great surprise I can have from Mux. Uh, thumbnails. This one was really good because I was just like, uh, searching on the API and I discover thumbnails. What are those? And initially I wasn't supposed to have in my player, but when I discovered that it took me like maybe five minutes to implement then the quality, because if I was using a custom solution to, uh, to host the videos, I needed to find a way to. Convert the videos in the various quality and then provide those videos automatically according to the user bandwidth, et cetera. So complex. Well, Mux does it.
Then it was being able to deliver it around the world because I have clients everywhere in the world. That's absolutely crazy. Uh, I don't have like a main countries that are everywhere in the world. So I needed to put like a CDN. Too complex. Mux does it. Okay. And yeah, and it was, uh, my only issue was that it was a bit difficult to upload videos because I needed to use the API sending like an absolute link, a public link to upload them. So that was kind of a bummer. And then Mux updated and we can upload them from the panel. So the Mux panel directly. So it made the process much easier. So yeah, that's why those are the, like the, the, the, the cool solution I had using uh Mux.
Dave Kiss: Going back, how did you get into this stuff in the first place? What really got you motivated and interested in learning more about web development or 3D? Bruno Simon: Well, it started quite a long time ago with Flash. I don't know if you, uh, if you guys remember Flash, uh, we used to create very interactive website, thanks to that. Unfortunately, Flash died for reasons, but, um, in Flash, we. Could already create some, uh, some 3D in there. And what I like most personally is 3D. I'm a creative developer, but I'm very like oriented toward 3D. I just like to build something that looks like video games and video games are most of the time, 3D. When I discovered that we could add 3D to website, I was like, so hyped, it felt so great. So it was a long time ago. And when Flash died, we had something else, which was called a WebGL, which arrived, I think, around the same period of time, but yeah, we got access to WebGL and we could create 3D experiences in the web. I was like, okay, I need to learn that.
So that's why I started doing like really creative and 3D coding for the web. It was extremely hard at the beginning, but there was some libraries and I just like dived into it. Uh, struggled a little and at some point people started to, to really enjoy what I was building. So I, I started to find clients that I wanted me to do the same thing, but being paid and it goes on and on like that. And at some point, uh, uh, it was just my thing, just like that.
Dave Kiss: Cool. I want, I want to go back even further as something you said in there was, uh, you liked the 3D because it was kind of like video games. Were you a big gamer when you were a kid?
Bruno Simon: Oh yeah, I've always played video games. Uh, I just, I remember like it started with, uh, some very old console. My, the first one I really enjoyed was the PlayStation 1. And I remember I didn't have money for games, but I had, you know, the, the demos, like, uh, you know, the, the, the shorter version of, of game with just one or two first levels, and I was just like. playing in loop those, uh, those, uh, first levels. And it was like amazing. Uh, and, uh, I continued playing for me.
Video game is the best media. And, um, I really, uh, thought it, thought this through because I'm reading books. I'm watching movie. I love music, but video games, it's a mix of everything and we are the actor in this, and we can, and also enjoy some of those video games with friends. Like, I don't go out go a lot, but I play a lot with friends. So it's my way of, uh, of doing social while I experiences, uh, experiencing like a scenario, uh, some, uh, some, um, some story, et cetera. So, uh, for me, video games is my favorite, uh, media.
Dave Kiss: I remember PlayStation 1, I remember Parappa the Rapper was one of my favorites.
Bruno Simon: I had this one, but I never could play it because, I don't know, my controller was not working with that game. And I tried like maybe a hundred of times, and it's the paper guy, right? And you need to dance. Yep, exactly. Yeah, I could not play this game, but it looked amazing.
Dave Kiss: It's like the predecessor to DDR. They were just a couple years too early. Uh, alright, cool. Well, in terms of the creative web development, um, is there anything about that specifically that you really enjoy or that you feel that, um, there's a good reason why other developers out there should incorporate creative web development into the projects that they build?
Bruno Simon: It's a matter of what people enjoy doing, because for me, I'm doing creative coding, not because I need to do it for a project. It's just because I like to do that. And it started like that. When, when I did my first, um, like a creative, uh, experiences for the web, it was just for myself. Because, uh, I thought, uh, maybe I saw something on the TV or some effect, like in nature or something like that. And I was like, Oh, can I try, can I do this in a, in WebGL or whatever solution I'm using native canvas or SVG or whatever? And, uh, it was just about patience I just enjoy doing it. So it's not really about, uh, why should we add it? It's just about doing what people enjoy doing.
But what's for sure is that people should at least try. The problem with that is, uh, it's quite difficult. Like if you want to, to, uh, to dive into WebGL, you need to, to, to learn a lot of things if you want, if you want. Create a creative coding with some complex animation. You need to learn how to animate those and structure your code to animate this kind of thing. So it's quite hard. So it's what I always say to my students. If it's hard to learn, it's a valuable knowledge. So if it's hard, it means that not everybody can do it. So you will enjoy doing something which is hard to do. So you will have less, um, uh, competitors. So that's perfect. But you need to struggle just long enough so that you see if you really enjoy it. Oh, enjoy it or not.
Dave Kiss: So Dar, one of our developers had a question, is the webthe right platform for 3D, which is, I don't know, maybe a spicy,
Bruno Simon: That's a great question. It's, uh, it's actually, he's right. I think that, um, currently it's a matter mostly of performance. If you take a video games with millions of polygons, a crazy post processing effect, you can't have that in the web. We have maybe like a quarter of the, the, the power, uh, they have in native and even worst, it's about how users use their, their devices. When you go on a webpage. You want that web page to work, you're not like, okay, my device is not very good. I'm not going to try that website. No, it's a website. You want to go on this website, regardless of the device you are using for like video games, you know, if your computer is not ready to handle that video games and you, you, you will buy a better computer. I don't know for Christmas or whatever. Um, but for the way it's. It needs to work. So it's even worse and even even worse.
So the third reason why it's it's kind of a hack is that you need to load all the data. Fortunately, today we have quite good bandwidth using like fiber, but it's not the case in every countries. And it's not the case when you are, you know, in the subway, you don't have such a good bandwidth. So there are multiple reasons that are like pulling down the web, but it's getting better everyday. So we have, we have also some advantages like you can just click on the link and you get there. You can't have this with a video game, native video games. You need to be on a PC, a good PC to download steam, download the game, uh, to have a good GPU, et cetera. And then you can enjoy it for the web. You just click on the link and you enjoy that experience. So there are good stuff too. And it's changing every day. We have better bandwidth. Uh, we have web GPU that is coming. Computer are getting better. So, it's just moving. Like we are kind of catching up and it's less of a hack these days.
Dave Kiss: You do a lot of teaching and a lot of students learning from you, but where do you go to learn? Where do you go to get your leveling up and your inspiration from?
Bruno Simon: Today, it's just awesome how easy it is to, uh, to learn. I remember when I started, um, uh, let's say, uh, one of the hardest things I learned, so it was WebGL and Three.js. When I started, we had just like, uh, maybe. Five or six main references to learn that and it was so hard and in the end what you needed to do was dive into the code and just try to reproduce and struggle. Today it's so much easier. So personally, uh, I like video tutorials. I just, uh, I just thought like, uh, I do a search on Google. Usually I end up on the, on YouTube or whatever. And, um, and yeah, for me, it's videos. Like I really enjoy your learning or using, uh, using videos.
Dave Kiss: Is there, is there a reason why you prefer video over reading or, or even the, in the courses that you create, it's a lot of video output as well. Um,
Bruno Simon: yeah, that's a good question. It's, um, it's a funny thing, but, uh, for me, uh, users on the web don't like to read. It's not true, but it's like, uh, most people don't like to read. By that I mean that when they see a big text, they won't spend a lot of time on it. They will like immediately scroll and, uh, and move on to something else. It's not absolutely true because there are some users that love to read, but most people don't like to read and it needs to go fast or it needs to be like a, a discussion between a two person, just like in videos. It's why my, the, the videos I'm creating, and it's also why, uh, I like videos.
It's because it's become personal. You create a, a bound, a binding, a bond, I'm not sure the word, uh, between you and the, and the students. And, uh, it's, it becomes personal and you are just like listening to a teacher that is in front of you. And in that, uh, like, uh, idea, I also like, um, I did support to my, uh, the course I've created so that, um, people can just join the Discord server and talk with me. So there is really like a live interaction between them. They, uh, watch the videos, I'm in front of them in the videos, and then we can talk on Discord and I think it's a lot more personal, which. Suits to most users.
And for me, the best courses around are those that provide both where you get the, the, the exact same content in text and in videos. And it's also why I created a link between those because the text is right below the video on the course I've created, and you can easily jump from the video to the text with the links. So that's uh, someone prefer one or the other, they can easily jump from video to text, etc.
Dave Kiss: So it's kind of like a multimedia sort of approach to provide different options available for folks, depending on what they, their learning style looks like.
Bruno Simon: Yeah, maybe at some point we can put some electrodes on the head and we inject the knowledge directly or some VR or whatever.
Dave Kiss: Or it'd be scary, I don't know. Yeah. There's a little bit of the being human there. Um, what, is there anything lately that's catching your eye, what you're trying to get good at or what you're trying to master, learn now?
Bruno Simon: Yeah, that's actually something difficult because, um, since I need to build a lot of context, uh, uh, content, sorry, for the course I'm building, it's really hard to find, uh, time to, uh, to learn stuff, yet it's very important. So, currently, I'm working on WebGPU. I don't know if you guys know about WebGPU. Currently, to do 3D for the web, there is almost only one solution. It's, WebGL ,but WebGL is a bit old. Uh, it's not very optimized and there is a solution which is completely different, which is WebGPU. But unfortunately it's not supported by, uh, Apple. So, uh, on, uh, uh, Safari, iOS, et cetera, but still it should come at some point. I really hope Apple will support it as a, at some point. And, uh, so when. WebGPU is a live and, uh, most of, um, people can use it. So hopefully, uh, I don't know, in a few months or maybe a year, uh, I need to be ready because there will be a lot of changes on the Three.js journey.
So there is WebGPU that I'm learning these days. And also something that I really enjoy it's, uh, uh, 3D modeling and especially, you know, the stylized painiting, you know, it's those games that, uh, looks, um, it's hard to say like, like, like the, um, TV show, Arcane.. Arcane is a good example of stylized play, uh, painting, you know, when you can see like the brushes on the face, on the, the, the, um, the fabric, et cetera. I really like this style. Uh, I love games using that because I'm focusing on what I'm teaching.
It's really hard to find the time to learn. In the end, I have some tricks to get better at those. First of all, uh, I keep doing client projects because it's been like three years. I'm always saying no more client projects and I'm doing maybe two or three client projects a year, although I said I won't because it's a way for me to challenge myself and to be forced to just like comply to whatever ideas the client has. So, so I need to, to, um, to keep on learning stuff in order to, to, to, to, to create that project. I also like to put it's a, it's funny because I talk about this one, like the, um, the bookmark folder of shame, you know, it's that bookmark folder where you put all the articles and the videos you want to watch and it's full of hundreds of links and you'll never watch it. Well when you schedule time to learn you just open that bookmark folder And you just choose something that interests you and you learn it and then you remove it from from the bookmark folder
Dave Kiss: I know everybody's got that Bookmarks folder of shame. I've never had a name for it, but it's like that box of wires that's in your closet that you just can't seem to get rid of and just put, keep putting it back and pretend it's not there. Oh, hits deep. If you could leave behind one common industry practice or belief in the web development world, what would it be? And what would you suggest that you do instead?
Bruno Simon: Yeah, today is the, um, I don't know if it's a real world, the overcomplication, everything is overcomplicated. I've been teaching in, uh, in school, in real life school, so it's not, uh, in digital. I've been teaching web development and basic web development. So, I have always this point of view when I see what it is to start in web. And when I'm teaching those, I'm like, Oh, if you guys know everything you're going to need to learn in the upcoming years, it's so complex because the stack for traditional website has become so complex. We are closing doors for beginners.
Why it should be easier. And it's actually what all those solution, you know, we have frameworks, libraries, new APIs, et cetera. They all pretend to make things easier, but behind you need to learn it and it makes all the things harder. So I'm not going to drop some names about those libraries and framework, because I'm also using those because I learned those, but I'm always thinking about the beginners starting their journey in web. Well, a few years ago, we had no resources to learn, but it was quite simple. Today, we have like, 100 times more resources to learn, but it's 1000 times more complex. So what happened? So hopefully in the upcoming years, it's going to, uh, to get more simple, but I don't think so because, uh, they all come up with those simple solution that makes things actually harder. So, so that's the thing I would leave behind, uh, if possible.
Dave Kiss: Yeah. That's what engineers are good at, over complicating things. Bruno Simon: Yeah, uh, there's something that, uh, for some reasons we haven't talked about this, even though it's the, the, the world everybody's, uh, he's, uh, using these days, it's AIs. And AIs are used, like, um, everywhere. In 3D, because we have been talking about 3D. AIs are not that simple. We can create texture, but more that are still a bit difficult. I hope in a few months we get there, but for videos, I don't know if you guys have seen those, but we can now create videos using AIs. It's not perfect, but just like images were not perfect a few months ago. So I'm sure in, uh, like it's a matter of weeks- maximum month before we get like, uh, full movies made by AIs.. Uh, and I'm super interested by that.
And I'm not scared at all. I get some messages from people like, uh, why should I learn coding if there are AIs. Why should I learn to create 3d models? AIs are coming fast . For me, AIs are just tools to be more, uh, efficient, to be more like, um, when I want to create a texture, I ask an AI. When I want to create an environment map, I ask an AI. Soon, when I will want to create a video, hopefully I can just ask an AI. So for me, it's just tools. Like you want to, too, um, to put a nail, uh, on a plank, you, you don't use your thumb, you use a tool, you use a hammer. For me, it's the same thing. So I'm not scared about it. And, uh, yeah, uh, I'm seeing some crazy, uh, videos, uh, using AI. That's quite interesting.
Dave Kiss: But even more interesting, when can the people expect a new update portfolio from Bruno Simon?
Bruno Simon: I want to do one so much, but I'm, you know, it has been, I have like a, um, what's the word, a roadmap for the upcoming month. And a new version of my portfolio has always been there. I'm always postponing this one because I want to do it and I'm afraid I can't do better, but I have so many ideas and I learned so many new tricks that I want to, to show. Uh, so hopefully 2024, uh, I really want to work on it just because I want to, I want to create a new version.
Dave Kiss: That's great. All right. Uh, last question I have is just a personal shout out for yourself. Where can people find you on the internet?
Bruno Simon: Oh you just type Bruno Simon and I should be at the top of whatever search engine you're using. But I really enjoy Twitter. If you guys want to see the posts I do, I'm posting, you know, some projects, some inspiration, etc. So Twitter, and yeah, you can find me there.
Dave Kiss: Bruno, thanks so much for your time chatting with us today. It was awesome to learn more about your creative approach to web development.
Bruno Simon: Thank you for having me.
