Тёмный

AR.js with Unity: Project Setup Tutorial 

TechStuff AndSuch
Подписаться 415
Просмотров 17 тыс.
50% 1

One or two of you requested a video showing how to set-up the project, so here it is. I will potentially add a feature for lighting in the future.
Buy me a beer:
www.buymeacoffee.com/tsas
GitHub:
github.com/weldonla/ARjs_Unity
Website:
techstuffandsuch.com/projects/
Music: From the Hollow Knight OST: Bench Rest Theme, Composed by Christopher Larkin
• Hollow Knight OST - Sa...

Наука

Опубликовано:

 

20 май 2020

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 93   
@blueiicey
@blueiicey 3 года назад
I watched this one video and now I will WATCH THEM ALL!!! Love your videos!
@driscollentertainment9410
@driscollentertainment9410 3 года назад
Peace man. Praying that your year improves. Also, thank you for this tut! It shows a lot of character to be helpful when you're in pain. Remember, pain is temporary.
@woodypognon3961
@woodypognon3961 4 года назад
awesome glad you're back!
@AskeKnudsen
@AskeKnudsen 3 года назад
Thank you so much, I've been looking for a way to do WebAR with unity. So I greatly appreciate that you share. I'm sorry to hear about your personal misfortunes. Hope life is better for you now. And I like the background music :)
@edwardrobison3684
@edwardrobison3684 3 года назад
Thank you so much for this video!!! Gonna give it a go later.
@kerlybrackets
@kerlybrackets 3 года назад
Good stuff, you have yourself a new supporter
@abdulraheem_taha
@abdulraheem_taha 3 года назад
Awesome work bro
@aymankhan8455
@aymankhan8455 3 года назад
I rarely comment. Also, I still haven't mastered the art of consoling. I don’t feel any words can brought you solace. And I'm not sure which words to use and which to avoid. May you have the sanctity to bear your individual loss; the loss only you can measure. Also, thankyouuu so so so much for putting this tutorial. I almost died trying every other approach :”). May this keep you going.
@lenz9707
@lenz9707 3 года назад
Great vid!
@mrajith303
@mrajith303 4 года назад
hey thanks for the video.
@thomasgottschall8607
@thomasgottschall8607 3 года назад
Thank you very much for that tutorial. I followed your steps but all I see in the compiled application is a white sphere covering the entire marker. None of the other elements show up and the actual size and position of that one sphere is incorrect. All three elements show up in the index.html with size and position tags. But are simply not rendered. I tried installing 2018 Unity version, 2020 and 2021. Importing both folders works and I can setup image target, ar-objects. Compile is finishes without errors. Any idea?
@emilibroooo
@emilibroooo 3 года назад
Thanks for these videos! They're super helpful and it's great having an option for producing WebAR experiences in Unity. Your editing is also hilarious and these are as entertaining as they are helpful. Hope your year has been getting better also. I have a bigger picture question about setting this up on a website. I've created AR mobile applications in Unity for Android and iOS using Vuforia, ARCore, and ARKit, but I have limited web development experience. I see on your site, you have a QR Code that users scan to bring up the link with the ar camera on their phone. Could you explain how you set that up? I know this is more on the web development side, so even if you could point me in the right direction to figure it out, that would be really helpful.
@weldlu11
@weldlu11 3 года назад
Thanks man! And yeah, adding the qr code is pretty easy. After adding in the arjs to your website, grab the URL you'd be using and paste that url into a qr code generator. There are a lot of free ones on the internet. There are also paid versions that will give you analytics for people scanning your qr code. This one has a free option I think and you can also pay for those analytics as well.. www.qr-code-generator.com/
@hamzzashaffi
@hamzzashaffi 3 года назад
Thank you so much! :)
@josetteseitz
@josetteseitz 4 года назад
This was definitely needed! You are the BEST! Btw, what provider is hosting your site?
@weldlu11
@weldlu11 4 года назад
www.bluehost.com/
@mzakstudio4695
@mzakstudio4695 2 года назад
I really liked your video thank for your hard work. I just have few questions. Any way to add custom images, like a business card? not a black and white marker. or are you planning to add that feature?
@kaka554
@kaka554 3 года назад
Great work!But i wondering is it possible to get screenshot?
@AimeeKatherine
@AimeeKatherine 3 года назад
Thank you so much!!! I'm sorry about the tragedies you're dealing with. Please- is there a way to have the 3D object appear without the image tracker? Just get it to appear on open?
@weldlu11
@weldlu11 3 года назад
Not really. The image marker is necessary. Though there is also geolocation based that I haven't tried implementing yet.
@agneya
@agneya 2 года назад
I am getting an error while adding the image plane or any AR.js obj The Object you want to instantiate is null. Can anyone help ?
@rafaelkuhn
@rafaelkuhn 4 года назад
Great work! ps. also a fan of Hollow Knight haha
@0919armstrong
@0919armstrong 3 года назад
Thank you sosososososososososososo much!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
@GodLikeChannel.
@GodLikeChannel. 3 года назад
is it build particle and anything to website? thanks
@basilio8484
@basilio8484 4 года назад
Awesome work! is it possible to use .webm video format, so we can have a masked video, alpha chanel?
@weldlu11
@weldlu11 4 года назад
I'm not sure, I haven't tried alpha videos yet
@gunasekhar9029
@gunasekhar9029 2 года назад
@@weldlu11 Can you please try. That is why we mostly do it
@kevinjoel3822
@kevinjoel3822 3 года назад
ArgumentException: The Object you want to instantiate is null. UnityEngine.Object.CheckNullArgument (System.Object arg, System.String message This error occurs for me how to clear this error.... pls give me the solution to clear this error...
@josephseger6053
@josephseger6053 3 года назад
Chin up man.
@benrajsd2199
@benrajsd2199 2 года назад
Is plane detection is possible with web AR for Unity
@virtualcity365
@virtualcity365 3 года назад
WebRTC issue-! navigator.mediaDevices not present in your browser what mean?
@ChristianBilato
@ChristianBilato 3 года назад
same problem
@sbfhhhsbfhhh9986
@sbfhhhsbfhhh9986 2 года назад
same problem
@johnluksas1959
@johnluksas1959 4 года назад
would it be possible to use Glitch to host a Ar.js experience?
@weldlu11
@weldlu11 4 года назад
Yes, the only real requirement is making sure your site has an ssl. Web browsers won't let your site have access to your camera without an ssl certificate.
@SuperNikhil001
@SuperNikhil001 3 года назад
Hi Man, Really appreciate your efforts on this project. I am so sorry for your personal loss. Did you make this as an opensource? I plan on using the basic functionalities you've built for commercial purposes, would that be alright?
@weldlu11
@weldlu11 3 года назад
Yeah man, it's under open source licensing. So you're good as long as you're not like redistributing the code for money. But yeah, if you're using it to develope something and charge for your ar service or product, that's fine.
@SuperNikhil001
@SuperNikhil001 3 года назад
@@weldlu11 thanks a ton man .... if it turns out good ... ill be willing to support u somehow ... if u open up a patron or anything like that :)
@weldlu11
@weldlu11 3 года назад
@@SuperNikhil001 sweet man! That would be much appreciated. I hope all goes well. I will make a thing for people to donate at some point.. I've just kinda got something else that's taking up all my time at the moment.
@SuperNikhil001
@SuperNikhil001 3 года назад
@@weldlu11 All will go well :)
@ChrisRodriguez9694
@ChrisRodriguez9694 4 года назад
Sorry about your mom bro :( Thank you for sharing this project with us. Its an awesome project. Will it work if I use anything from Unity? I mean using canvas and canvas elements and adding my own scripts for shaders and animations and different kind of functionalities?
@weldlu11
@weldlu11 4 года назад
If you expand on the scripts I've written perhaps. But code needs written for every individual object you would want to add. And the ar.js project that my plugin uses doesn't support every object. For all of the objects that I use in the plugin, it converts it to html for ar.js to run it. So when you use my plugin to add an object, it has a tag on it to know what kind of ar.js object to make it and it will programatically write html to describe the objects and animation and colors and such. If you check out my other videos, you can see all of the current features that this tool supports.
@ChrisRodriguez9694
@ChrisRodriguez9694 4 года назад
I see, thank you!
@josephseger6053
@josephseger6053 3 года назад
How do you use this with a Material?
@gunasekhar9029
@gunasekhar9029 2 года назад
Did you figure it out? I need help with this
@gunasekhar9029
@gunasekhar9029 2 года назад
Good stuff, but the shaders and transparency don't seem to work in web. They work fine in Unity editor. Can you check that. I will buy you 2 beers :)
@xarmtech
@xarmtech 3 года назад
Hello! Can we use QR Code as a marker?
@weldlu11
@weldlu11 3 года назад
Not really. The image you use needs to be simple.
@HabibYo
@HabibYo 3 года назад
@@weldlu11 How is it possible to scan QR code from mobile native camera and then redirect to web browser and then show AR contents on top of a QR Code using AR.js sir?
@mrajith303
@mrajith303 3 года назад
Great video, however when I try to add a cube as a child and compile, I'm getting an error - Directory not found exception.
@weldlu11
@weldlu11 3 года назад
Double check that the folders you added to the project are named correctly.
@taowang1209
@taowang1209 3 года назад
@@weldlu11 Hi, I got the same error no matter how i tried, DirectoryNotFoundException: Could not find a part of the path "C:\Users\xxx\Desktop\xx\UnityTutorial\Ar.js_test\Ar_js_2019test\Assets\Animations\JsonExports\SampleScene\cube_0.txt".
@weldlu11
@weldlu11 3 года назад
When adding animations, I think the error is cause from not hitting the "export animation" button. Try doing that and let me know if it fixes the issue.
@taowang1209
@taowang1209 3 года назад
TechStuff AndSuch Hi, I actually did not add any animation and the error shows up.
@weldlu11
@weldlu11 3 года назад
Interesting. I will have to look into this further. Does the error show what line of code it's on?
@did3d523
@did3d523 Месяц назад
"WEB cam ERRor name: webrtc issue-! etc... on brother of pc or on iphone same issue ..... :-(
@TheDreamprovider
@TheDreamprovider 3 года назад
i don't get the html file after compiling..
@weldlu11
@weldlu11 3 года назад
Are you looking in the right folder? Whatever you named the scene, should be the name of the folder that it gets put in.
@simranrout9316
@simranrout9316 4 года назад
How can i integrate this a WEBRTC project
@weldlu11
@weldlu11 4 года назад
I'm not sure, I've never used webrtc before.
@simranrout9316
@simranrout9316 4 года назад
@@weldlu11 can i contact you somewhere else ...i have some issues with ar.js
@weldlu11
@weldlu11 4 года назад
@@simranrout9316 you can go to techstuffandsuch.com/contact/
@user-cq9ti5fh5s
@user-cq9ti5fh5s 4 года назад
here is some error : WebRTC Issue - Navigator.MediaDevice is not presented in your device. How can I fix it?
@weldlu11
@weldlu11 4 года назад
I'm pretty sure that's a certificate issue. Check if your website starts with and not
@JasonWiser
@JasonWiser 4 года назад
@@weldlu11 I am getting the same error, is there a workaround using http? I would like to use my private website which is indeed http not https
@weldlu11
@weldlu11 4 года назад
@@JasonWiser I'm sorry, but there is no work around. Modern web browsers won't let your website access the camera unless it's over a secure certificate.
@JasonWiser
@JasonWiser 4 года назад
@@weldlu11 Thank you for the speedy reply! This is so interesting. Do you know of a free place online to host projects like this, that offers an SSL certificate?
@weldlu11
@weldlu11 4 года назад
@@JasonWiser I don't think there are free places, but I use www.bluehost.com/ and I think I pay around $6 a month for it and like $12 a year for the domain name.
@saadanees7989
@saadanees7989 3 года назад
Hi. Very nice tutorial but its not working on mobile. I tried in iphone and android
@roqueiroz6
@roqueiroz6 2 года назад
Same problem Bro!!! did you solve it?
@did3d523
@did3d523 Месяц назад
dont work at the end dont understand waht have to copy on server? end of tuto is impossible to understand
@mrdxiong
@mrdxiong Год назад
Unity is too limiting. Can't change image marker or replace 3D models to the primitive mesh. I was however able to make it all work without Unity. Image tracking works and I'm able to replace 3D models as I please. The only problem I have now is that the entities shakes and trembles. Need to work on that.
@lesterjohneguaras3410
@lesterjohneguaras3410 Год назад
Hello, your website is down.
@weldlu11
@weldlu11 Год назад
Oh, it's been updated and I moved some stuff around so that link doesn't work anymore. Go to techstuffandsuch.com and then click on a specific project
@lesterjohneguaras3410
@lesterjohneguaras3410 Год назад
@@weldlu11 Thank you! more power !
@artistuniverse4522
@artistuniverse4522 4 года назад
sorry about ur mother... can u upload a video about changing marker and how make like a tutorial that has multiple markers?
@weldlu11
@weldlu11 4 года назад
Yeah, I can upload something showing how to change markers. I'm currently refactoring the code base. I went to add lighting options and realized my code was shit and hard to work with. Multiple markers isn't currently supported with this plugin. Perhaps some day I will add that functionality though.
@artistuniverse4522
@artistuniverse4522 4 года назад
TechStuff AndSuch please try to upload soon bud, I know u r having a hard time and everything hope u doing better ! U got a discord server ?
@weldlu11
@weldlu11 4 года назад
@@artistuniverse4522 I'll try and upload again soon. I was hoping to have a new feature to show on my next upload, but I suppose I could just make an upload of how to use a currently existing feature like changing marker images. I have discord, but I rarely use it. Mostly just to voice chat while playing smash with friends.
Далее
Maybe i need to add instructions @popflexactive
00:14
AR Over the Web Browser Using AR.js, A-Frame, & WebXR
49:32
Exporting to WebXR using VRTK in Unity3D
3:10
Просмотров 5 тыс.
9 Ways to Use WebAR in 2021
7:41
Просмотров 19 тыс.
Augmented Reality with A-Frame
9:37
Просмотров 43 тыс.
Where Did Arch Linux Come From?
16:21
Просмотров 12 тыс.