Happy with the initial envmap+light sequencing. 3 more experiments left to try from the original design, then onto 2D UI stuff. Refactored everything with the discovery of three-custom-shader-material.

Gotta revisit the homepage with new learnings soon.

#threejs #buildinpublic

While I probably won't use a full glass enclosure for the final overlay design, the MeshTransmissionMaterial that @0xca0a / @N8Programs brought to drei is so much fun to play with!

#threejs #drei #ref #buildinpublic

Inspired by @AlexFisla
Beautiful fluid gallery. I tried to recreate it, the result still nowhere near the original, struggling with drei scrollControls.

Credit to @bruno_simon for giving me step by step approach 😎🙌

#threejs #webgl #reactjs #buildinpublic

I was very pleased to see that 48 people had liked my previous post..
So I wondered what it could look like at human scale 😉
(I'll do another one the day I surpass 100 haha.) 🚀
#threejs #blender #buildinpublic #webgl
#Webデザイン

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

My Mac struggles so much with the summer heat 🥵

Now introducing ! Moving obstacles, so it gets even more dangerous and tricky !

You will need Jedi reflexes to make it in one piece !

#buildinpublic #threejs #webgl

I'm building a 3D Web-Based Game Framework that optimizes learning and simplifies energy-investing.
@webpov
Website: webpov.vercel.app

First game: bytc.vercel.app | @wbytecity

#screenshotsunday #webgl #threejs #bytecity #web3 #indiedev #opensource #buildinpublic

✨ STAR WARS DEATH STAR TRENCH RUN ✨

Just got back into the project after 2 day taking a break from it, and boy it felt good!

Just found a fix to 3 bugs, and performance are now optimal !

I myself am in the final run for the project.

#buildinpublic #threejs #webgl

I'm currently working on a #Threejs customizer for product #showcase, reminiscent of one of my 1st freelance gig.
Back then, I had to manually handle hundreds of JPG. It's amazing how far we've come, turning the dream of #3D in browsers into reality!
#Metaverse #buildinpublic

#wip restarting my home, that place where I can do what I want

Imagine being a vector in the simulation.

Go grab your drone controller to fly 42loops.com

#indiedev #threejs #buildinpublic

Happy with the pre-overlay transition, just need to fix up the lighting, DoF and Bloom sequencing.

#threejs #r3f #buildinpublic

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

so today i'm working on performance improvement before finishing the level !

I reworked the way projectiles work and it's blazingly fast now i mean, look at how smooth it runs on my shitty macbook

#buildinpublic #threejs #webgl

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

I finally fixed the bug that caused the physic world to desynchronize with the visual world.

here's a game mechanic : 'smooth zoom', let's say you have trouble aiming, slow down, aim and shoot !

#buildinpublic #webgl #threejs

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

We're in the final round, sadly not a lot of progress, stuck on a game breaking bug..

Anyway, here's the 20 first second of intended gameplay !

How do you feel about this ? Tell me everything!

#threejs #webgl #buildinpublic

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

2 weeks of hardcore coding, All wings report in!

Landing page Standing by!

Particles Standing by!

HUD Standing by!

Enemies standing by!

Game logic standing by!

Excited to run the trench ?

#buildinpublic #webgl #threejs

Not much time today, but the current focus is getting UI overlays mapped onto my screen mesh. I use a simple reveal shader here

Not happy. I'd rather use SVG+CSS animations for sharpness. But not sure how to use them as a live map for a material.

#threejs #r3f #buildinpublic

Game UI is hard ! What do we think of this glass morphic health bar ?

#buildinpublic #threejs #webgl

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN! ✨

As you know i'm making a star wars game with #threejs and #webgl!

today lots of progress were made! Optimised particle system, it shows where we shoot, HUD basic, death game state, explosion and more..

#buildinpublic

Day 3 of 30: Adding web3 to @wbytecity w/@LearnWeb3DAO

✅ - Built a smart-contract, learnt about gas
Next: 3D Web3 MiniGame
Testing building mechanics, next; web3 integration, more details soon...

#bytecity #threejs #web3 #buildinpublic #indiedev #opensource #3dweb3

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN! ✨

🟥 LANDING PAGE ! 🟥

TODAY is a big day, the landing page is almost done, need to optimize a few thing there and there but there it is! ✅

@Andersonmancini How about that hyperspace jump ?

#buildinpublic #threejs

Tips for people who need to watch live var state in #JS.
Browser often provide the ability to set up watch expressions. You can specify var or expressions to monitor, and the tools will update their values as your code run. (chrome example)
#threejs #webgl #buildinpublic

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

No progress made on the game, but I am cooking something quite interesting for the landing page.

This render runs natively inside the Browser in 4k using three.js

#threejs #buildinpublic

Day 2 of 30: Adding web3 to @wByteCity with @LearnWeb3DAO

✅ - NFT Minting from 3D Web + DAO Contracts deployed
Next step: Add a simple web3 game to the 3d interface

#bytecity #threejs #web3 #buildinpublic #opensource

How to not add a simple (move / scale / rotate) fidget to your #threejs project on 3 tweets of code ! ⏬
#webgl #gamedevs #buildinpublic

Day 1 of 30: Adding web3 to @wbytecity

✅ - Wallet connection with wagmi

#bytecity #web3 #threejs #buildinpublic

Learned one hell of a lot about shaders this weekend, long overdue.

This should enable me to move most of my ideas out of static PNGs and into the shader world, which is crucial for the UI part of my site experience

#threejs #buildinpublic #react #r3f

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

We're seeing the end of it ! I need to add obstacles/AI for enemy, here it works with a basic raycast, collision works !

✅ added : more sounds, more optimisation, enemies can shoot at you

#buildinpublic #100DaysOfCode #threejs

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

You want immersion? Here's some immersion, now INCLUDING Apple fucking Spatial audio technologies

✅ ADDED : Lighting change, DESTRUCTIBLE ENEMIES, MORE SOUND, Several optimization, opening scene!

#buildinpublic #threejs #webgl

I will convert xd to html css bootstrap5 responsive figma, zeplin, pdf to html website fiverr.com/s/WBy7gR

#buildinpublic #threejs #webgl #DevOps #BigData #Analytics #DataScience #IoT #IIoT #Python #RStats #TensorFlow #Java #JavaScript #ReactJS #CloudComputing #Serverless

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

✅ Added : Lots of thing, 3D opening crawling scene, game logic, death physics, smoother movements, music (though you can't hear here) sound FX, really satisfied with the progression made !

#buildinpublic #threejs #webgl

Hello les devs, ça y est je suis de retour après mes jours de maladie 💪

Parlons dark mode, j’ai pas eu l’occasion d’en dev beaucoup, mais il y en a un dont je suis fier c’est celui là.

Ça se teste ici pour les curieux warehouse-generator.vercel.app

#buildinpublic #threejs

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

Star wars opening scene with #threejs and @greensock , the two goes so well together haha this is so good !!
(no sound lol)

any fix for the text outline overflowing on the starwars Text ? this is 2DText from Drei

#buildinpublic

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

Wow, this is getting really good, controls are smooth, I need to figure out explosion particles!

✅ Added : physical keyboard and mouse controls, particle system, shader shockwave for shoots !

#buildinpublic #threejs #javascript

✨ PROJECT : Star Wars Death Star Trench Run ✨

Controls is the most difficult part, tell me what's better :
Mouse or Keyboard controls ? ⌨️🖱️

🟢 added : non physical (yet) controls, physical environment and trench !
#buildinpublic #threejs #webdev #webgl #javascript

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

Added : more realistic render, accurate turbine color, heat distortion effect (it's subtle)

For reasons I couldn't add a point light to the lasers, it would have a crazy effect 👀 might move to SSR Render

#threejs #buildinpublic

✨ PROJECT : STAR WARS DEATH STAR TRENCH RUN ✨

Added : Lasers, with sound effects !

#threejs #buildinpublic

✨ Project : Star Wars Death Star Trench Run ✨

Added model animations, boosting state and attack mode.

Added Sound effects for engine Idle, opening and closing the wheels

#threejs #buildinpublic #webGL #web

Spent last few days exploring custom shaders in Three.js for slantit.app. It's a crazy world! 🧑‍🔬

#buildinpublic #threejs #product

Don't give up on your 3D model – Add some amazing effects and keep trying! 💪

Live site: interafun-18.prerelease.dora.run

#threejs #3D #nocode #madeindora #website #buildinpublic #flutter #animation

I've Been MIA for 2 weeks. What was I up to? 🫣

• Designing Dora Expo events
• Creating a new product feature: 3D Post-processing.

Want the juicy details?
Keep reading 👇

#3D #MadeInDora #threejs #3D #webgl #nocode #website #buildinpublic #flutter

Top: bought in a 3D models store.
Bottom: done manually.
Moral of the story: buying assets is great for the first version, when you are going for optimal performance, you have to do these things yourself.

#dev #r3f #threejs #blender #react #javascript #buildinpublic

Last year I created a 3D editor to learn #threejs -> It lets you custom a #freestyles #scooter !

👉 You can test it here : scooter-editor.app

I thought I can rent posters positions in background to shop or brand but didn't have so many visitors !

#buildinpublic

learning to optimize webgpu app workflow (for machine learning) was quite fun

since I had to play with shaders anyway, decided to ship one straight into img-cut ui 🧙
#buildinpublic #webgpu #threejs

🔥MVP is Ready for some closed Beta Testing Fun!

I have some seats left. Just drop a comment and I send you the link.

#threejs #webgl #saas #buildinpublic

Who's watching #GoogleIO with me? I'm stoked about all the Flutter updates!

And I made a webpage in just 30 mins - a @FlutterDev 's Dash. It's amazing. 😎

Take a look 💿 flutter-dash.dora.run

@googledevs #NoCode #animation #threejs #madeindora #Website #buildinpublic… twitter.com/i/web/status/1…

New Tutorial: ✂️ Split text in half with scroll effect.

Live site + Remix: interafun-14.dora.run

Inspired by: @LocomotiveMTL

#NoCode #animation #threejs #3D #madeindora #Website #buildinpublic #flutter #design

New Tutorial: ✂️ Scroll to Split Text Transition

Live site + Remix: interafun-14.dora.run

Inspired by: @LocomotiveMTL

#nocod #animation #threejs #3D #madeindora #Website #buildinpublic #flutter #design

Que serait starfox sans son légendaire BARREL ROLL

Sur un autre ton, c'est dingue ce que c'est compliqué, comment un rien prend un temps fou, je comprends pourquoi dev un jeu prends autant de temps, tout le travail que ça représente c'est fou
#buildinpublic #threejs #gamedev

PROJECT : CORNERIA.

TARGET : ACQUIRED.

CONTROLS : OK.

ARWING : OK.

RELEASING RESULT :

#buildinpublic #threejs #starfox #webgl

📹 Did you know that @DoraTool can create camera moves like this? Simply add keyframes, as in After Effects.🔥

The live site and clone it: moving-camera.dora.run

#threejs #3D #webgl #nocode #madeindora #website #buildinpublic #flutter

My new website is live!🔥 Hit play and turn the volume up!

A sketch-style 3D model by @Lironhero that creates a relaxed, effortless vibe.

Check it out at 🦆🦆🦆 danceduck.dora.run

#threejs #3D #webgl #nocode #madeindora #website #buildinpublic #flutter

My new website is live! Hit play and turn the volume up! 🦆

A sketch-style 3D model by @Lironhero that creates a relaxed, effortless vibe.

Check it out at 🔗 danceduck.dora.run

#threejs #3D #webgl #nocode #madeindora #website #buildinpublic #flutter #flutterdev

Dora's latest release is a total game-changer, especially when it comes to 3D performance.

Compare it to the previous version! Live site↓
8poolball.dora.run/?__dora_render…

#nocode #threejs #website #animation #design #uiux #3d #webgl #madeindora #webdesign #buildinpublic twitter.com/Fayezheng_/sta…

New week, new project launch! 😎 🚀

Check out the 3D model with scrolling animation of the 🎱 8 balls. It's pretty cool - what do you think?

See it live: 8poolball.dora.run

#nocode #threejs #website #animation #design #uiux #3d #webgl #madeindora #webdesign #buildinpublic

We are one month behind schedule but we finally solved the main issues.

We had use new models for #threejs
Let’s hope @daniel_21134 will finalize it soon.

#webgl #buildinpublic #fashiontech

Ainda nao cheguei lá, mas tá muito perto de eu finalizar essa landing page. Faltando um botao legal, talvez umas tags.

#buildinpublic #portfolio #ui #ux #frontend #threejs

Day 67 of #100DaysOfCode

Here’s what i did ✨
- Solved Daily LeetCode challenge
- Learned how to render 3D models in a website using three.js

#DSA #javascript #React #leetcode #buildinpublic #threejs

Working on an ISS module for The Globe 🌏 #threejs is amazing! Thank you @NASASolarSystem for the incredibly detailed 3D model! 💜 #buildinpublic

Un aperçu un peu différent cette fois-ci, on jette un oeil au color picker et à la manipulation de palettes.

Go tester ça ici -> warehouse-generator.vercel.app/?location=2C311

#threejs #buildinpublic

Aller c’est parti pour partager la dernière version en ligne de mon entrepôt 3D.

Vous pouvez tester ça ici -> warehouse-generator.vercel.app/?location=2C311

#threejs #buildinpublic

Voici un petit aperçu en accéléré de la V2 de mon projet d'entrepôt 3D.

Tous les éléments sont devenus tangibles. Et maintenant ... On peut piloter le chariot élévateur 🔥

Allez tester ça ici -> warehouse-generator.vercel.app/?location=1I1

#threejs #buildinpublic

A simple personal homepage made using @Framer
Please see 👉 halo.byewind.com

#webdesign #linktree #homepage #threejs #webdesigner #uidesigner #buildinpublic #webdesigner #designers #developers #javascript #css #html #uxdesign #uxdesigner #UIUXDesigner #webdesign

TikTok' Loading Animation / How to Add Link in TikTok Bio youtu.be/Bi9ormlsAWg via @YouTube
#javascript #ReactJS #threejs #webdevelopment #buildinpublic #programming #coding

A simple personal homepage made using @Framer
Please see 👉 cloud.byewind.com

#webdesign #linktree #homepage #threejs #webdesigner #uidesigner #buildinpublic #webdesigner #designers #developers #javascript #css #html #uxdesign #uxdesigner #UIUXDesigner #webdesign

Link Page - a simple link page, used to replace #linktree
Please see 👉 byewind.com

#webdesign #linktree #homepage #dynamicdesign #motiongraphics #jsdynamic #threejs #webdesigner #uidesigner #buildinpublic #webdesigner #designers #developers

Pretty much done with my portfolio (it's more of a proof-of-concept, really) -- the source code has also been made public.

Check it out on
portfolio-sand-pi.vercel.app

#threejs #programming #javascript #reactjs #buildinpublic #programming #coding #developer #html #webdev #typescript

Loads of commits this year! How much did you guys do?

PS: We don't use GitHub PR's and issues in my company. Hence the lack of it lol.

#javascript #ReactJS #threejs #webdevelopment #buildinpublic #programming #coding

Improved the UI and managed to (after much fine-tuning) render the content on screen.

Rendering the Content page (lorem ipsum) is very difficult. Position depends on plane scale + html scale.

#javascript #ReactJS #threejs #webdevelopment #buildinpublic #programming #coding

I'm building a portifólio for myself with three.js, react and framer-motion.

#javascript #ReactJS #threejs #webdevelopment #buildinpublic #programming #coding

Can our simulated car stop to avoid crashing?

Using #threejs raycaster as virtual ultrasonic/distance sensor. #Python with @pyodide to control the car in the browser!

@BehindEng #buildinpublic #electronics #hardware #engineering #r3f #javascript #React #webgl @pyodide #physics

🚗 Car + 👀 Raycast/Virtual Ultrasonic Sensor = 😌 Object Avoidance

Using #threejs raycaster as virtual ultrasonic/distance sensor. #Python / @pyodide to control car!

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl #physics

🚗 Car + 👀 Raycast/Virtual Ultrasonic Sensor = 😌 Object Avoidance

Using #threejs raycaster as virtual ultrasonic/distance sensor. #Python / @pyodide to control car!

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl #physics

How to build our Mecanum car in the browser using @BehindEng's Sandbox

#buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl

Day #17: Lessons Learned

Building the Huddle 3D environment was a pain!

Below are some useful resources I found for a React based app with #threejs

1) Better code examples than google
2) Different Mindset/Watch Youtube Videos
3) A very tiny bit of Unity

#Saas #BuildInPublic

Mecanum Car Crash 💥 in the web browser simulator

🤔... I think we need 👀 sensors.

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl @pyodide #Python #physics

Mecanum Car + #physics + #Python to drive it along a box-shaped path, all within the browser

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl @pyodide

Mecanum car controlled by #Python driving in #physics simulator within the browser!

Want to learn or build, too?
👉 Join the waitlist: bit.ly/3EbAGBP

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl @pyodide

Spot-like robot doing the worm
🐕+🤖=🐛

Testing #physics simulations with joints/constraints in the browser.

#buildinpublic #engineering #threejs #r3f #javascript #React #webgl #robotics #robots Cannon-ES

Rebuilt our Mecanum car in the browser!

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl

Wiring up a programmable & battery powered motor circuit

Want to learn how?
👉 Join the waitlist: bit.ly/3EbAGBP

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl

Hello. Bon j'ai pas abandonné mon projet ThreeJs, ma branche en cours prend (beaucoup) plus de temps que prévu 😱☄️

Mais je reposte une avancée prochainement 🚀

#buildinpublic #threejs

Quickly wire up LED #electronics circuit #simulation on #web

@BehindEng #buildinpublic #hardware #engineering #threejs #r3f #javascript #React #webgl

Controlling virtual LED #hardware with an #electronics circuit #simulation on #web

@BehindEng #buildinpublic #engineering #threejs #r3f #javascript #React #webgl

Controlling RGB LED virtual #hardware with #Python & an #electronics circuit #simulation on web

@BehindEng #buildinpublic #engineering #threejs #r3f #javascript #React #webgl @pyodide

Part 2: Controlling RGB LED #hardware with #Python & an #electronics circuit #simulation on web

Demonstrating a Python loop changing the colour over time.

@BehindEng #buildinpublic #engineering #threejs #r3f #javascript #React #webgl @pyodide

Learn electrical #engineering & software development online
1️⃣ Select & connect #hardware parts
2️⃣ Program with #Python
3️⃣ Simulate #electronic circuits & #physics
👉 Join the waitlist: bit.ly/3EbAGBP
@BehindEng #buildinpublic #threejs #r3f #javascript #React

Speedrun: Wiring up a virtual programmable LED circuit in 60 seconds 🚀

Want to learn how?
👉 Join the waitlist: bit.ly/3EbAGBP

@BehindEng #buildinpublic #electronics #hardware #engineering #threejs #r3f #javascript #React #webgl

Après les étoiles, on passe aux galaxies aléatoires.
Je randomise le nombre de branches, leur rotation, nombre d'étoiles, répartition des étoiles, les couleurs, la position des galaxies et leur taille.

✨Très fun à faire ✨

#threejs #buildinpublic

I got a request to make a coffee mug configurator, so today I start experimenting with it.

#tweet100 #threejs #buildinpublic #buildinginpublic #100daysofcode

Salut a vous. Bon j'y retourne. Je commence à vous présenter mon projet perso du moment : L'espace 🚀

Pour commencer, une toile vide, une petite couleur de fond et des étoiles 🌟

#threejs #javascript #buildinpublic

Finally nailed down a decent algorithm for navigating to the nearest hotspot in @TreasuredTeam's web player!

Here's how it works 🧵

#threejs #r3f #buildinpublic

Working on this broken car 🛠🚙 ramp-up.vercel.app

#threejs #webgl #Blender3d #gamedev #buildinpublic #javascript #Website

Sometimes i have to test stuff on the gameserver just to make sure it works using a remote server. So I randomly meet players. And they follow me while i'm debugging shit.

Building in fucking public lmao !

#nft #nftcommunity #metaverse #web3 #threejs #devdiary #buildinpublic

Tuning the shader to show the right elevation depending on the zoom level of the rendered tile. #buildinpublic #threejs

The fluid #uidesign for the Slate site using @threejs⚡️

Check it out here
slate.madebyayan.com

#threejs #webdesign #webdev #html5 #CSS3 #uiux #3Danimation #WebsiteDesign #moderndesign #buildinpublic #design #style #3DCG #SEO #UX #javascript #programming #coding

The dynamic 3D site for the Slate #Multitasking app is now live!✨

You can check it out here:
slate.madebyayan.com

What do you think?

#threejs #buildinpublic #indiedev #Webdesigner #uidesign #3D #DEVCommunity #landingpage

The site for Multitasking With Slate is now live!✨

You can check it out here:
slate.madebyayan.com

What do you think?

#threejs #buildinpublic #indiedev #Webdesigner #uidesign

Here's a sneak peak of the site built for Slate using @threejs

More of the site coming soon!

#threejs #programmer #uidesign #Webdesigner #buildinpublic #indiedev #gamedev #3DCG #Multitasking

🧑‍💻DAY LOG #24

🧊Finalizing the overall #uidesign of the website using #threejs

🎨@GravitDesigner is amazing for creating media kits for projects

Share your #daylog!

#buildinpublic #coding #webdev #programming #webdesign #uiux #Software #graphicdesign #code #indiedev #vector

🧑‍💻DAY LOG #23

🧊Finalizing the overall #uidesign of the website using #threejs

🎨@GravitDesigner is amazing for creating media kits for projects

Share your #daylog!

#buildinpublic #coding #webdev #programming #webdesign #uiux #Software #graphicdesign #code #indiedev #vector

This entire segment is just custom function calls to handle scrolling throughout the entire webpage

It provides a responsive feel and takes care of all the #threejs and #css animations and when they should occur

#webdesign #webdev #buildinpublic #coding #programming #javascript