Unreal Engine 5 ArchViz Web App Template

This video showcases the use of Unreal Engine 5 and its dynamic rendering capabilities.
Learn more about our Unreal Engine based web platform:
realestate.vinode.io/
We're using the engine for:
- standalone and pixel-streamed apps
- animations and stills for the next generation of website templates for ArchViz.
Join the Discord Community:
/ discord
Video recorded in the engine with Lumen and Nanite enabled, works at 60 fps on RTX 3060 Ti!
The project was done with our partner architectural marketing agency FAMA.

[@sonovadob]

I don't want people to see this video until I figure out how to do it.

[@godofgods4854]

same trying but no luck

[@budpeetie6879]

Same here

[@wahababdou7707]

Loool same thoughts

[@MartinDlabaja]

learn unreal, make good lighting, learn BP. done :)

[@againstobs]

Too late son Im copying it

[@ptilu2195]

You're crazy! This is such an amazing job

[@GRXMSZILLA]

This looks amazing! well done!!

[@Climberfx]

Wow. This the best Arch sell app i ever see! Amazing work man!

[@Prographers]

Wow, thanks!

[@meh3128]

this blew my mind!!!!, cant wait to learn this stuff!

[@piticak206]

That is the coolest thing I have ever seen

[@Projeviz]

Thats awesome!!!

[@farzanfakourian443]

this project is amazing ! nice

[@HunterReynolds]

Wow! It would be amazingly helpful to the community for a tutorial on some basic UE5 to web integration like this. Especially for using nanite and lumen.

[@jeremiahMndy]

figured out how to do it, but its on my youtube channel, im thinking of doing a tutorial for architects.

[@thearchitecturegrind]

@@jeremiahMndy don't see it

[@jeanpoulquiroztorres6439]

@@jeremiahMndy para cuando el tutorial amigo?

[@Prographers]

Hi, it took quite a long time, but we're almost finished with a tutorial/document. One part will have aggregated tutorials and assets for scene creation. The other part will focus on preparing video clips and uploading them to our web player.

[@gelobenitez]

@@Prographers I look forward to the tutorial!

[@ek5233]

Wow! Nice, very cool and realistic!

[@Prographers]

Thank you! Cheers!

[@broduction8835]

Coolest digital for real estate i ever saw!

[@editsofedits1366]

this would be an stunning game

[@Angrybrd-cq8jb]

I respect your skills! :)

[@AryansinghT60]

This is damn impressive. One quick question - Does Lumen support standalone app package (.exe window app). I had made one car configurator in 4.27 and published an .exe package. But I wanted to revisit that with Lumen this time around as it more faster and dynamic. Thank you!

[@theory2500]

Would I be able to import a design of a house(not a apartment that I’ve made and cycle through each room ? or does that only have premade designs that you can cycle

[@SergiuszSwitalski]

amazing work!!!

[@Prographers]

Thanks a lot!

[@nintendians]

looks great.

[@MIROSLAVR86]

WOW! I want to learn how to do this too!

[@Dale_Hat]

This would be a sick program for like a kiosk allowing the kiosk to rent rooms to people as a landlord/motel/hotel management interface and it could print out the keycard for the payed for room after it accepts payment then with a security system like adt you can track movement within the building for example.

[@chilltime438]

OMG! This is soooo good.

[@olehmisko389]

Wow, just wow!

[@vii5ri]

Wow! It amazingly

[@nguyenkimanhkhoa1700]

Good video editing :)

[@iamhristachev]

WOW! Amazing

[@brofest7187]

Looks awesome i would like to see some tutorial about... cool!

[@mjx92]

This is AMAZING! How do I do this or from where should I start man this is such an amazing work

[@mikehattias5837]

amazing work

[@Prographers]

Thank you! Cheers!

[@chaitanyamate4026]

Make this kind of more videos It'll good for website templates...

[@FajarKurniawan10]

well done!

[@jr.palacio]

I am interested in the topic of VR with the meta quests, could this be integrated directly into a website?

[@buzz_is_here]

I've never clicked on a video this fast in my life

[@tanksfornothin]

This is as good as it gets. The only thing up from here is better graphics, damn.

[@myHDD]

great work!!!!!!! body

[@NMPrecedent]

Is it possible to essentially have a setup where interactive features can be explored in it as well?

[@estate0007]

This is a great interactive integration of web technologies and UE5! How are the loading times of the videos? Do you use a preloader for the whole site or do they load in the background?

[@AndronCollider]

this is realtime rendering. not video and not web.

[@Prographers]

We're preloading the videos, which have good enough performance, way faster than pixel streaming or native 3D web with shader compilation. We're researching a more performant way right now.

[@nikitaksenzov3992]

@@Prographers how is your research going? what technologies do you use for the web?

[@FPChris]

Is there a means for an end client to run an unreal project on an ipad web browser? local html would be ideal. Even if its a just basic project.

[@Supawich-mr5hp]

good job

[@juninhobueno4547]

This is crazyyy

[@toporacl9732]

nice bro

[@dineth_diaz]

so cool👍

[@harsimran1]

I remember seeing a live version of this. I just don't remember the website. Maybe it was a real estate company in Latvia if I remember correctly. This here is Poland.

[@janekwytrawek]

way to fasst animation, but concept - I'm lovin it!

[@Seagulltrash]

Sims 5 is going to be sooooo good 💕🤧

[@serkan-ertem]

Yok Artık 😲🧿 Harika birde yapım aşaması olsa öğrensek bişeyler 👌

[@serkan-ertem]

@@cyberunnner kesinlikle mimari için bulunmaz nimet ama eğitim için yeterli döküman olsa tadına doyulmaz

[@serkan-ertem]

@@cyberunnner onu bende inceledim ancak mimaride yeterli katkı oluşturmayacağı kanısına vardım içerikleri incelediğimde o yüzden almadım hatta indirim vardı ancak genede almadım mimari odaklı olması şart diğer türlü bluprint detayları var oyun odaklı eğitimlerde denk gelirseniz iyi bir eğitim setine banada dönüş yaparsınız sevinirim

[@fatihsahin6863]

@@serkan-ertem nasil yapiliyormus abi

[@ICTUSD]

Amazing

[@Vasiliy4D]

How to do it? I have a project in unreal engine 5.3. I know how to make such a presentation out of it. But how can I put it on the Internet? So that people can open it on their browsers without technical problems.

[@user-vw7es3pi1t]

Hello, Unreal Engine currently does not support web packaging. How can I render Unreal modeling on a web page?

[@tagrandmere0782]

wow amazing, i have a question , how did you made these transition between each angle ?

[@Prographers]

We've played with the animation curves quite a bit

[@gabrieldomingues6322]

how to do something like this? is there any tutorial for something similiar to this project? this is insanely good

[@hawkwu123]

The whole 3d models included plant import to Unreal by datasmith, or developing by Twinmotion and import to Unreal?

[@Prographers]

All done with simple asset import. Most of the materials and foliage from Megascans. No twinmotion or datasmith used

[@hawkwu123]

@Prographers how about apartment 3d model? even use 3ds Max or sketchup still datasmith or you use FBX format?

[@vaeya]

wowowowo!

[@balazsschmidt8636]

Can you tell me which graphics card is the better choice for such projects as realtime rendering, visualization, animation (i.e. not game development)? RTX 3060 with 12GB Ram or RTX 3060 Ti with 8GB Ram (but more CUDA) ?

[@Prographers]

More ram is better, as the high res textures and meshes eat lots of it

[@balazsschmidt8636]

@@Prographers Thank you for the quick reply. Did you do this with the UI widgets? Did you use the camera actor for rendering?

[@Prographers]

@@balazsschmidt8636 Unreal is only used for rendering, and we've used CineCamera actor. UI and logic is done with js scripts on the website

[@horyk13]

@@Prographers how would you host the app if you would actually make a website? Would you pixel stream it on a local server or use AWS or similar cloud solutions?

[@Prographers]

@@horyk13 It's not pixel streaming, but a prerecorded database of animations for every possible interaction that we've within the app

[@catamorea4711]

can you put in the template that you work on , video renders from different rendering engines, like d5 render?

[@albiceleste101]

Interesting, ig the initial loading time is bad but then you have so much more freedom once it's up

[@asticmilton]

Great job bro ... need some tutorial and breakdown

[@Prographers]

I'll try to do a breakdown blog post, but I'm sure I will not have time for a tutorial

[@chrisnguyen6385]

its too long to take time to make @@ its impressive project

[@juansebastiangranadoscasti8524]

recuerdo que hace un tiempo estaba disposible el descargar la app para interactuar uno mismo desde un ejecutable y no se si me equivoque pero tambien estaba los archivos editables, siempre considere esto un trabajo de 1000/10

[@th_studio3d]

I'm using Unreal for Archviz and some sort of tutorial to learn this interaction would be awesome.

[@sunilpanda3492]

Dm if you need help

[@Argon369]

Hey man how can Visualisation artists benefit from it like make the 3d content and upload it on template ?

[@cafer12098]

damn 🔥🔥🔥

[@ARmy2510]

I would like to see Cities Skylines 2 like this.

[@vekuhudesign7382]

Any UE tutorial for making this kind of Amazing Archviz?

[@kristianfisinski1042]

It is really nice! Is there a tutorial coming soon?

[@wayneroyrutherford]

Are you using Archviz Explorer?

[@ATVex-rt7rg]

what software you are using?

[@evolgenius1150]

Hmmm.... If I could use UE5 to go to WebGL instead of something like say ThreeJS... But how do I hm... I'm going to figure out how to do this with ThreeJS first, and then once I understand webGL and getting animations inside my document and how to timeline those to events, hopefully I can use UE5 instead to do this because its so much easier working with a visual engine and not just lines.

[@ubaid3603]

how you get the grass quality is realistic, in my case the grass is noisy when my camera far away and also fade

[@Prographers]

We've used grass from the Unreal Kite demo, which seems to work better for far away camera angles, then megascans assets

[@ubaid3603]

@@Prographers thanks, i will try it

[@bruno_madalozzo]

Try to change the LOD of the mesh.

[@ubaid3603]

@@Prographers i have tried grass from kite demo, but still fade when i move far away, in your video is not fading when camera far away. Any suggestion?

[@Prographers]

@@ubaid3603 Do you use nanite, lumen with raytracing enabled, and cinematic scalability?

[@officerjohns9554]

woah, this could be the future of buying houses ngl

[@MIROSLAVR86]

Is it in real time on the engine via the website? Or WEB video design?

[@Prographers]

It's a web video design. All prerendered in Unreal and than played in browser

[@kabargin]

increadible

[@michaelkukula5926]

Awesome! How much would you charge a client for something like this?

[@budpeetie6879]

How did you do the backgrounds? Doesnt look like a HDRI?

[@CoDroStyleHD]

Backgrounds are all modelled using 3D static meshs. Can be done pretty quickly in a game engine.

[@Prographers]

We've make the background with static meshes for builidngs and roads, landscape tool, foliage tool for tress and grass, sun, sky, cloud, atmosphere system for lighting and atmosphere

[@budpeetie6879]

@Prographers thanks for the reply. I understand the foliage and landscape, but not the buildings. You probably use a spline for roads, but do you use a procedural building generator for the buildings, or do you create each mesh individually. I am in the final stages of my own archviz project and am finished with the interior and exterior of the building and need to do the external "view" now. I can use a hdri, but it messes with the internal lighting of the building somehow...

[@Prographers]

@@budpeetie6879 Our buildings are just a couple of simple static meshes that are placed with different heights. Unfortunately, environment is very time consuming

[@xitao]

Just out of curiosity, how much does a project of this level cost in dollars? Just the 3D model with the architectural project already?

[@joaopauloaraujo9283]

Can I buy or acquire this template for my projects in Unreal?

[@ThaimachineFilms]

What is this ? Animate in unreal render out and make it click able video on the web or what is this v

[@NitroFox0o]

NGL... im more amazed that i see Polish currency used as an example somewhere

[@GuitarListen]

I'd imagine you'd need some of the best noise isolation out there for the rooftop garden, otherwise the people living on the last floor will be pissed every day because of the noise coming up from the people moving around.

[@g26c83]

How much memory does it take?

[@OmnispectiveHub]

this is amazing

[@masanorisaitou9682]

Is it better to create something like this in Unreal or Unity?

[@Prographers]

UE 5.1 seems to be the best option currently. You can use Lumen for dynamic lighting, and nanite for foliage which makes realistic scenes possible on mid/high end PCs

[@masanorisaitou9682]

@@Prographers Thank you for your valuable opinion.

[@Argon369]

How can an Archiviz artist benefit from it ? Can you explain that please

[@ziyovuddingafurov7718]

which programms did u use ?) unreal and ?

[@Prographers]

Unreal and React, but the final tool/template will use wordpress for easy managment and deployment. If you'd like to learn more you can join our wishlist: prographers.com/?p=v

[@jossabaco1859]

I'm sorry but I gotta know what font that is at 0:04 it's so pretty!

[@_raphaforte]

Do you sell this project scene?

[@dar780]

👌

[@clxudzYT]

ohh damnnn

[@kudjo24]

Gosh if they could just iron out the little tiny aliasing and reflection bugs UE5 would be the king.

[@Nuri_Archive]

It's what I want to make the most as a student. I wonder how to make it with Unreal 5. From S.Korea.

[@luqi4230]

your website have the start up and unreal engine but in the opposite position, just pointing it out :D

[@Prographers]

Thanks, for that bug report. We'll fix it with next website update

[@carloskarchviz]

hey folks! The discord invite is experied, is the server still one? I would like to join

[@Prographers]

Thanks for the heads-up! I have just updated the link in the description: discord.gg/HyEw32aC6r

[@DefenseIsLacking]

Since it’s unreal engine does that mean Twinmotion will integrate this capability? I use revit + Lumion but since Twinmotion is apart of Autodesk it’s looking more and more attractive to learn, especially if it adds this feature

[@mynameisgus7515]

Yes

[@northwind6199]

I don't think the Unreal Engine has anything to do with Twinmotion. Unreal is a game engine made by Epic, Twinmotion is a whole different thing

[@petritvejseli2369]

@@northwind6199 it is both owned by Epic and Twinmotion is based on an older Unreal Engine

[@fultonmendoza5591]

@@petritvejseli2369 Pero compraron a twinmotion no es creado desde 0 con unreal

[@iamrelient3011]

I would suggest learning twinmotion. Lumion falls behind after every release and are losing market share. Twinmotion and Unreal will future proof your work better

[@ZAKarchitects]

And how to do it??

[@judasthepious1499]

so this is html5 or .exe?

[@Simul4tion]

WE WANT A SIMCITY LIKE THIS!!!

[@akshitparmar2155]

Hello this is impressive, can I get in touch with someone for commissioning a similar project?

[@jendabekCZ]

What about VR and the performance?

[@Prographers]

We haven't prepared the scene to be used with VR, but with current performance it should work well on high end PC

[@jendabekCZ]

@@Prographers Thx for the reply :)

[@chadgtr34]

how about responsiveness ? mobile web site?

[@Prographers]

We'll showcase mobile version in the next release

[@omersoncruz1081]

WOWW

[@0verdead]

is this a game? id love to have some game to design buildings and apartments like that.

[@flohh]

How could this be hosted on the web? Isn't too heavy?

[@Prographers]

Our approach is to host only videos and photos from Unreal, while creating interactions and UI in native web solutions like React or Three.js

[@flohh]

@@Prographers Sounds very cool, would love to see a live demo!

[@Prographers]

@@flohh We'll have a live langind page in a couple of weeks. I'll upload the video of it here, with the link to the landing page

[@recoecodur1245]

Curso de ésto hacen?

[@ahmedhaitham5806]

Do you have course about how to do it ??

[@Prographers]

Not yet, we're working on how to make it usable for others. Do you have an archviz background?