Scrollytelling con ScrollTrigger y GSAP paso a paso

āđāļŠāļĢāđŒ
āļāļąāļ‡
  • āđ€āļœāļĒāđāļžāļĢāđˆāđ€āļĄāļ·āđˆāļ­ 12 āļ.āļĒ. 2024
  • 👉 Conoce nuestras vacantes actuales de tecnología en bit.ly/talento...
    En este vídeo te introducimos al scrollytelling con SVG
    Aquí tienes el enlace del cÃģdigo:
    Landing page en codepen: codepen.io/car...
    Proyecto en codesandbox: codesandbox.io...
    Landing page: 2z9nyr.csb.app/
    Figma file: www.figma.com/...
    Este vídeos fue impartido por Carmen Ansio - UX Engineer. Le puedes encontrar en su perfil de LinkedIn:
    / carmenansio
    Y en twitter: / carmenansio
    Si quieres estar al tanto de todo lo que hacemos, puedes inscribirte aquí 👇
    garajedeideas....
    ----------
    Garaje de Ideas es un estudio de DiseÃąo, Tecnología y Data. En este canal encontrarÃĄs tutoriales, cursos y ejemplos prÃĄcticos paso a paso de desarrollo web y programaciÃģn.
    PodrÃĄs encontrar desde cursos de JavaScript, Node.js, D3.js, Vue3, Typescript, HTML, CSS, React... hasta cÃģmo optimizar tu proceso de trabajo.

āļ„āļ§āļēāļĄāļ„āļīāļ”āđ€āļŦāđ‡āļ™ • 14

  • @Garajedeideas
    @Garajedeideas  āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +1

    👉 ÂĄEn Garaje seguimos creciendo! Únete al equipo: bit.ly/talento-tech-GDI

  • @a.sestarlich9859
    @a.sestarlich9859 6 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

    Yo me he perdido cuando has dicho Scrollytelling 😂, excelente garcias por todo 😊

  • @scorpiondev
    @scorpiondev āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +3

    Muchas gracias! Interesante contenido!

    • @CarmenAnsio
      @CarmenAnsio 11 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™

      ☚

  • @TICdoc_
    @TICdoc_ āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +2

    Lo que comentas de no borrar nodos de la línea, diría que es porque las curvas bezier emplean cuatro puntos para su definiciÃģn (hay otros tipos de curvas bezier que emplean mÃĄs o menos puntos, segÚn se definan a partir de un punto previo, o tengan otra representaciÃģn). Si eliminas puntos, es posible que el programa de diseÃąo no reconstruya bien la definiciÃģn de la curva bezier y se líe en cuanto a las posiciones.

    • @CarmenAnsio
      @CarmenAnsio āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +2

      Exacto! Es justamente lo que sucede, cuando intenta reconstruir el path Figma no es capaz de redefinir los nodos y la informaciÃģn que guarda en las coordenadas del SVG es incorrecta, con lo que al hacer el pintado con Greensock el resultado no es el esperado :(

  • @dinael
    @dinael āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +4

    ðŸĪŊ

    • @CarmenAnsio
      @CarmenAnsio āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +1

      ðŸĪĐ

  • @TICdoc_
    @TICdoc_ āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +3

    Triggear ... me lo apunto.

    • @CarmenAnsio
      @CarmenAnsio āļ›āļĩāļ—āļĩāđˆāđāļĨāđ‰āļ§ +1

      Ese y Gradiente son mis favoritos XD

  • @Alberto_APC91
    @Alberto_APC91 11 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +2

    Carmen me gustaría aprender Css🙏🙏

    • @CarmenAnsio
      @CarmenAnsio 11 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

      ÂĄÂĄHola!! ÂŋTienes alguna base sobre CSS o partes de 0?

    • @Alberto_APC91
      @Alberto_APC91 11 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

      ​@@CarmenAnsio Tengo una base, pero me gustaria poder crear aplicaciones web mÃĄs atractivas y con css mas optimizado. tienes cursos en alguna plataforma?

    • @CarmenAnsio
      @CarmenAnsio 10 āļŦāļĨāļēāļĒāđ€āļ”āļ·āļ­āļ™āļāđˆāļ­āļ™ +1

      @@Alberto_APC91 Voy a liderar un bootcamp sobre CSS en cÃģdigo facilito 😊