Laboratorio de efectos
11 experimentos de animación para elegir cuáles llevar al sitio. Ninguno depende de las imágenes: funcionan igual con las fotos reales. Las imágenes son ilustraciones de muestra.
Nuevo · Experimento a pantalla completaObra real: el edificio del modelo Revit se construye →Como el hero de la propuesta libre, pero con un proyecto real. Loop o scroll, 3 coreografías y 3 estilos (tuerca arriba a la derecha), y un ascensor para elegir piso y cortar la planta.- 01El lema como ventanaMáscara SVG + scroll
- 02El edificio se dibuja y se construyeSVG que se dibuja (DrawSVG)
- 03Edificio 3D generado por código3D (React Three Fiber)
- 04Manifiesto palabra a palabraTipografía (SplitText)
- 05Títulos que se armanTipografía por letras
- 06Galería en perspectivaGrilla 3D con scroll
- 07Pila de tarjetas en espiralTarjetas 3D con scroll
- 08Carrusel 3D de áreas comunesCilindro 3D con scroll
- 09Recorrido por los distritosMapa SVG con cámara
- 10Fachada interactivaSVG interactivo
- 11MicrointeraccionesContadores, botón magnético, subrayados
El lema como ventana
Máscara SVG + scroll · Para: Hero de inicio
Edificios boutique en Arequipa
El edificio se dibuja y se construye
SVG que se dibuja (DrawSVG) · Para: Sección «La confianza se construye»Magistral Elite · 9 pisos
Piso
09La confianza
se construye.
Edificio 3D generado por código
3D (React Three Fiber) · Para: Ficha de proyecto / cotizadorMagistral Elite
Haz scroll para levantarlo. Pasa el mouse sobre un piso y haz clic.
Manifiesto palabra a palabra
Tipografía (SplitText) · Para: Manifiesto MagistralBasado en Codrops · ScrollTextMotion (MIT)Lo vemos. Donde otros ven un terreno, nosotros vemos una familia sentándose a la mesa. Creemos en lo que todavía no existe. Nos ponemos el casco. Porque un hogar no se promete: se levanta, piso a piso, con las manos, con rigor y con la palabra empeñada.
Títulos que se arman
Tipografía por letras · Para: Títulos de sección y distritosBasado en Codrops · OnScrollTypographyAnimations (MIT)Efecto «caer»
Cayma
Efecto «dispersar»
Yanahuara
Efecto «girar»
Bustamante
Galería en perspectiva
Grilla 3D con scroll · Para: Galería de un proyectoBasado en Codrops · Scroll3DGrid (MIT)
Pila de tarjetas en espiral
Tarjetas 3D con scroll · Para: Transición entre seccionesBasado en Codrops · 3DStackMotion (MIT)Nuestros activos
Magistral Deluxe
Cayma
Magistral Elite
Yanahuara
Magistral Select
J. L. Bustamante y Rivero
Magistral Deluxe
Cayma
Magistral Elite
Yanahuara
Magistral Select
J. L. Bustamante y Rivero
Magistral Deluxe
Cayma
Magistral Elite
Yanahuara
Magistral Select
J. L. Bustamante y Rivero
Magistral Deluxe
Cayma
Magistral Elite
Yanahuara
Magistral Select
J. L. Bustamante y Rivero
Carrusel 3D de áreas comunes
Cilindro 3D con scroll · Para: Áreas comunesBasado en Codrops · 3DCarousel (MIT)Áreas comunes
Recorrido por los distritos
Mapa SVG con cámara · Para: Nuestros activosCayma
Magistral Deluxe
Yanahuara
Magistral Elite
J. L. Bustamante y Rivero
Magistral Select
Fachada interactiva
SVG interactivo · Para: Cotizador (elegir piso)Elige tu piso
Piso 5
Depto. 501 · 2 dorm. · 65 m²
disponible
S/ 410,000
Depto. 502 · 3 dorm. · 72 m²
disponible
S/ 460,000
Microinteracciones
Contadores, botón magnético, subrayados · Para: Todo el sitioBasado en Codrops · MagneticButtons (MIT)17
departamentos en Deluxe
30%
de avance de obra
9
pisos en Elite
3
distritos
Acerca el mouse al botón naranja · pasa el mouse sobre los links (subrayado con la barra del logo)