La Cortadura: A 3D Masterpiece of Realism

gabi

·

Aug 13, 2023

·

la cortadura Melilla

la cortadura Melilla

Melilla La vieja - La cortadura

Melilla La vieja – La cortadura

From Opossum, we are thrilled to present our latest project: “La Cortadura,” a 3D recreation that pushes the boundaries of what is possible in virtual environment simulation. This project, undertaken in 2022 as a personal initiative, utilizes the most advanced technologies available to take virtual reality to an entirely new level.

Utilizing Unreal Engine 5

Choosing Unreal Engine 5 as the video game engine for this project was no coincidence. With its ability to provide real-time lighting and its cutting-edge NANITE technology, we’ve created an unparalleled visual experience. The attention to detail and graphic quality achieved stand as a landmark in 3D simulation.

Pioneering Data Capture

The realism of “La Cortadura” would not have been possible without our meticulous data capture. Through terrestrial photogrammetry and LiDAR scanning using Leica technology, we managed to collect precise and detailed data of the environment we wanted to recreate.

These data capture methods, usually reserved for scientific and topographical applications, have allowed for virtual reproduction with unprecedented accuracy.

A Glimpse into the Future

“La Cortadura” is more than a personal project; it is a vision of the future of 3D technology and virtual reality. The fusion of cutting-edge techniques with the passion and skill of our team at Opossum has resulted in a work that sets a new standard in the industry.

We invite everyone to explore this astonishing virtual world, to feel life in every texture, and to lose oneself in the lighting and shadows that have only been made possible through applied technical innovations.

“La Cortadura” is not just a project; it is a testament to what is possible when technology, art, and dedication meet. Discover more about this exciting 3D world by visiting our projects page and immerse yourself in an experience that redefines virtual reality.

Our Workflow:

UE5 melilla

LEICA melilla

gabi

// Opossum Follower Script document.addEventListener('DOMContentLoaded', function() { // Create the opossum character const opossum = document.createElement('div'); opossum.id = 'following-opossum'; // More detailed character (SVG for better quality) opossum.innerHTML = ` `; // Set styles for the character opossum.style.position = 'fixed'; opossum.style.zIndex = '9999'; opossum.style.width = '40px'; opossum.style.height = '40px'; opossum.style.pointerEvents = 'none'; // So it doesn't interfere with clicking opossum.style.transition = 'transform 0.2s ease'; // Add to the page document.body.appendChild(opossum); // Variables for tracking movement let mouseX = 0, mouseY = 0; let opossumX = window.innerWidth / 2; let opossumY = window.innerHeight / 2; // Character states let isScanning = false; let scanTarget = null; let isIdle = true; let idleTimer = null; let lastMouseX = 0; let lastMouseY = 0; // Track mouse movement document.addEventListener('mousemove', function(e) { mouseX = e.clientX; mouseY = e.clientY; // Reset idle timer when mouse moves isIdle = false; clearTimeout(idleTimer); idleTimer = setTimeout(() => { isIdle = true; }, 3000); // Determine if moving left or right const movingRight = mouseX > lastMouseX; // Flip the opossum based on movement direction if (Math.abs(mouseX - lastMouseX) > 5) { // Only flip if significant movement opossum.style.transform = movingRight ? 'scaleX(1)' : 'scaleX(-1)'; } lastMouseX = mouseX; lastMouseY = mouseY; }); // Handle clicks - add a small animation document.addEventListener('click', function(e) { // Scan animation isScanning = true; scanTarget = { x: e.clientX, y: e.clientY }; // Reset scanning after a delay setTimeout(() => { isScanning = false; scanTarget = null; }, 500); // Create a visual "ray" effect for the scan const ray = document.createElement('div'); ray.style.position = 'fixed'; ray.style.backgroundColor = '#000000'; ray.style.height = '1px'; ray.style.transformOrigin = '0 0'; ray.style.zIndex = '9998'; ray.style.opacity = '0.7'; ray.style.pointerEvents = 'none'; document.body.appendChild(ray); // Calculate length and angle of ray const opossumCenterX = opossumX + 20; // half of opossum width const opossumCenterY = opossumY + 20; // half of opossum height const length = Math.sqrt(Math.pow(e.clientX - opossumCenterX, 2) + Math.pow(e.clientY - opossumCenterY, 2)); const angle = Math.atan2(e.clientY - opossumCenterY, e.clientX - opossumCenterX) * 180 / Math.PI; // Set ray properties ray.style.width = `${length}px`; ray.style.left = `${opossumCenterX}px`; ray.style.top = `${opossumCenterY}px`; ray.style.transform = `rotate(${angle}deg)`; // Animate ray ray.animate([ { opacity: 0.7 }, { opacity: 0 } ], { duration: 300, easing: 'ease-out' }); // Remove ray after animation setTimeout(() => ray.remove(), 300); }); // Idle animations function doIdleAnimation() { if (isIdle) { // Simple wiggle animation opossum.animate([ { transform: 'translateY(0px)' }, { transform: 'translateY(-5px)' }, { transform: 'translateY(0px)' } ], { duration: 1000, easing: 'ease-in-out' }); // Randomize next idle animation setTimeout(doIdleAnimation, Math.random() * 3000 + 2000); } else { // Check again in a second setTimeout(doIdleAnimation, 1000); } } // Start idle animation check setTimeout(doIdleAnimation, 3000); // Update position with a bit of delay for natural movement function updatePosition() { // If scanning, move more directly toward target if (isScanning && scanTarget) { opossumX += (scanTarget.x - opossumX - 20) * 0.3; opossumY += (scanTarget.y - opossumY - 20) * 0.3; } else { // Normal following behavior // Calculate distance to move (easing function) opossumX += (mouseX - opossumX - 30) * 0.1; // 30px offset so it follows behind cursor opossumY += (mouseY - opossumY - 30) * 0.1; } // Apply position opossum.style.left = opossumX + 'px'; opossum.style.top = opossumY + 'px'; requestAnimationFrame(updatePosition); } // Adjust for different screen sizes window.addEventListener('resize', function() { // Keep opossum in viewport when window resizes if (opossumX > window.innerWidth) { opossumX = window.innerWidth - 50; } if (opossumY > window.innerHeight) { opossumY = window.innerHeight - 50; } }); // Start the animation loop updatePosition(); // Add a style for the opossum to bounce when it appears opossum.animate([ { transform: 'scale(0)', opacity: 0 }, { transform: 'scale(1.2)', opacity: 1 }, { transform: 'scale(1)', opacity: 1 } ], { duration: 500, easing: 'ease-out' }); });