- Видео 6
- Просмотров 25 357
redFigma
Добавлен 17 дек 2021
En redFigma, te enseñaremos a crear increíbles animaciones e interacciones, a travez de la plataforma digital líder en prototipado, Figma.
Crea una Dynamic Island en Figma
Diseña y anima la nueva Dynamic Island de apple completamente en Figma. ¡Comencemos!
Просмотров: 1 007
Видео
Curso de Animación en Figma: Capítulo 1
Просмотров 1,5 тыс.2 года назад
En este curso crearás un corto animado 100% en Figma. Aprenderás a ilustrar, a usar puntos de anclaje, a animar y a prototipar. ¡Comencemos! Las referencias y materiales de apoyo puedes encontrarlos en redfigma 00:00 Introducción 00:57 Ilustrando en figma 10:03 Puntos de anclaje 14:58 Animación 26:51 Escenario 32:45 Resultado y conclusión Ilustración original de Mario por deekaym...
Component Properties: Crea una Card modular y responsive
Просмотров 8052 года назад
En menos de 10 min. aprende a crear una Card con contenido modular y responsive utilizando los nuevos "component properties" de Figma. ¡Comencemos!
Aprende usar el nuevo Auto Layout de Figma
Просмотров 9 тыс.2 года назад
En este video aprenderás a utilizar las nuevas características del Auto Layout de Figma. ¡Comencemos!
Crea Cards Interactivas en Figma
Просмотров 12 тыс.2 года назад
En menos de 10 min. Te enseñaremos a crear Cards Interactivas y animadas utilizando Figma. ¡Comencemos!
Crea la Animación de Lluvia de Códigos de Matrix en Figma
Просмотров 6722 года назад
En 10 min. Te enseñaremos a crear la animación de lluvia de códigos de Matrix utilizando únicamente componentes interactivos en Figma. ¡Comencemos!
puedes crear una landing pages?
Chulada de tutorial 👍👍👍👍👍👍👍👍
AMO, muchas graciass!!
Me sorprende las pocas vistas. Apenas estoy empezando con Figma. Venía buscando cómo hacer un carrusel simple y me enamoré de todo lo que se puede hacer. Un verdadero "wow". Gracias por el tutorial. Me suscribo!
Seguí los pasos al pie de la letra pero me pasa algo que no sé como resolver: Al pasar el cursor por Bottom la imagen se acerca (porque coloqué la fotograía más grande con la finalidad de hacer un efecto de zoom). Pero cuando intento hacer lo mismo con la foto top hace como una transición donde se nota un efecto de "aparecer". Estoy usando la misma foto arriba y abajo, el mismo tiempo de transición, el mismo efecto, etc.
¿Cuánto tiempo le coloca al delay del mouse enter?
Alguien mas que se rompió la cabeza y no le sale??
bueno el video, queremos el capítulo 2 para seguir aprendiendo 🤓
El mejor tutorial, más sencillo y rápido de entender. gracias totales!
¡Felicidades, explicas bastante bien!
solo q en Movil designs no hay eventos de Mouse, plop
gracias!!!!Me gusta mucho encontrar animaciones diferentes a la que hacen la mayoria :)
Gran video! Pregunta, ¿porque no me da el efecto de rebote si seguí tal cual el tutorial?
me pasa lo mismo, nunca me salio la animacion
me pasa lo mismo, no me da el mismo efecto en una cartilla pero en la otra si 😢
como lo solucionarin ??@@estherhuarsaya3283
Gracias por tus videos, quisiera aprender como adaptarlos a un sitio web con wordPress seria de gran ayuda, mil gracias
Acabo de descubrir este canal y jamás hubiera pensado que esto se puede realizar en este hermoso programa, gracias profe, ahora la pregunta debido a mi ignorancia en Figma, ¿cómo hago que lo aprendido sea utilizable en algún archivo o cómo lo subo a mi página web? gracias profe 🙏🏻
Hola! Figma es solo una herramienta de prototipado por lo que por el momento no se puede exportar directamente en código, eso tiene que ser trabajado por un desarrollador. Por el momento solo puedes grabar un video de tu prototipo y mostrarlo en donde tu desees. También puedes compartir tu prototipo con la opción de Share!
@@redfigma9566 entiendo profe. Entonces eso ya sería hacerlo en código directamente con html css y Java? Muchas gracias profe 🙏🏻 no deje de grabar contenido.
@@miguelvazquezmx exacto, puedes convertir el diseño a código “fácilmente” utilizando plataformas como webflow.
@@davidyoutube2 Hola David, muchas gracias por tu respuesta. Desconozco de webflow pero ahorita mismo investigo sobre la plataforma. Mil gracias por tu apoyo.
Madre mía, acábo de descubrir este canal. Fan mega segura y estudiante en primera fila.
Muchas gracias! Actualmente vamos a lanzar un curso de Figma en vivo por si estas interesada, puedes ver más información en instagram @redfigma
Hola me ayudaste mucho soy aprendiz de diseño en una app nueva. Y la verdad el auto layaout me costo una buena parte del sueldo. Gracias a tu video voy a recuperar mi sueldo al 100% eres un genio tienes una nueva suscriptora bendiciones
que felicidad que te haya servido! Éxito en todos tus proyectos !
excelente!!!
como ubico el ipone en el cuadro en el minuto 00:50 maso menos
Solo debes arrastrarlo hacia el Frame, la otra opción es que utilizando la barra izquierda ubiques los elementos del iphone dentro de la capa del Frame. En caso de que este dentro y no se recorta la imagen, debes ir al panel de la derecha, con el frame contenedor seleccionado, y hacer click en Clip Content (debe quedar prendido)
como seleccionar ambos rectangulos?
Hola! Siempre con Shift apretado + click
@@redfigma9566 muchas gracias de verdad, grande redfigma
Que buenas animaciones, recién estoy usando Figma, que videos tuyos o listas me recomiendas para iniciar en la animación por figma. Saludos
Hola Christian! Nuestra filosofía es que siempre es mejor aprender haciendo algo entretenido, actualmente tenemos poquitos videos, te recomiendo ver sobre el nuevo autolayout, y como crear cards interactivas. Una vez ya te sientas más seguro lanzate con el curso de super mario! Saludos!
cómo se llama el ilustrador?
Hola! La ilustración original de Mario es basada en el diseño de DeekayMotion en la descripción siempre pondremos los recursos y artistas! Saludos
Wow eres un genio!!
Estás tarjetas de puede subir a Instagram ?
la única forma por el momento es grabando la pantalla con un software
Estás tarjetas de puede subir a Instagram ?
Muy muy rapido amicho! está bueno el tutorial, me gustaria saber mas en detalle de por qué se comporta de esa forma autolayot
Hola Martin, el objetivo principal de autolayout es organizar los elementos contenidos en un frame en base a parámetros customizables, lo que permite mantener la consistencia entre distancias y márgenes dentro de un mismo componente. Gracias a esto también se nos permite generar componentes que se ajusten según su contenido cambiando su tamaño, pero respetando las reglas que hemos definido, para ver un resultado de esto te invito a ver el video en el canal sobre cards modulares y responsive, saludos!
Hola! Excelente video! Hay manera de exportar la animación en video o en gif?
Hola Julieta, por el momento la única forma de exportar como video, es grabando la pantalla con algun software de captura. Lamentablemente esto aveces puede realentizar la animación como tal. Esperemos que Figma pronto libere una opción dedicada, saludos!
Bestial, de los mejores tutoriales que hay.
dejenme el archivo para saltarme todos los pasos jajaajajaj
Super buen tutorial, muchas gracias. Sigue sacando mas videos
muchas gracias amigo!
Dios men eres un dios, queria aprender full figma para UI pero los tutoriales son aburridos, es mejor aprender así con estos ejercicios
Es nuestro principal objetivo y pienso lo mismo, es muy aburrido aprender a usar un programa con una persona hablándote 30 min sobre cada una de las herramientas. Es mejor aprender haciendo, es más entretenido y puedes retener mucho más la información.
now i am in a good mood
Comparte el archivo please 🤗
Cuando saquemos la segunda parte subo el archivo a community con todo el proyecto, por que el original es puro caos jajaja
Justamente para hacer más responsivo el contenido, onda que se re acomoden los elementos desde tal ancho en adelante, por ejemplo, como los media queries en css, existe un plugin que se llama Breakpoints para Figma: ruclips.net/video/ChagtR5xshM/видео.html
Muchas gracias por compartir Jose!
hola.. excelente tutorial,, me encanto ... pero como puedo descargar esta card interactiva para publicarla en mis redes-????
Hola Sunny, por el momento, la única forma en figma es grabando la pantalla del prototipo.
Todo muy bien. Subid más videos así!!
Muchas gracias!!
👏🏼👏🏼👏🏼👏🏼👏🏼
hola! nuevamente gracias por el tan genial video y explicacion.. actualmente me encuentro viendo clases de como manejar figma por platzi.. en una de las tareas nos pusieron a crear una version de app con tematica a agencias de viaje.. quiero hacer unas cards..con informacion pero cuando las altero se rompen por asi decirlo pierden sus proporciones y me desespera un poco.. (en las cards tengo una foto, info del nombre del pais conjunto a dos icons.. por ejemplo a cuantos kilometros de lejania y cuanto estan a promedio los precios.. el punto es que no he visto videos ensenando algo que siento es un poco basico y a la vez algo complicado para alguien que esta empezando.. espero pueda tomar en cuenta y hacer algun ejemplo a futuro.. mientras espero poder seguir aprendiendo y siguiendo su contenido!
Hola! Perdón la demora! Por instagram siempre somos mucho más rápidos para contestar. Si an tienes dudas escribenos un DM e intentaremos ayudarte a solucionarlo!
enamorada y feliz de poder aprender algo nuevo y creativo! GRACIASS espero proximamente nuevo contenido!
Muchas gracias por todo el apoyo! Estamos pensando en hacer el próximo video sobre como crear cards con contenidos modulares y responsive con las nuevas propiedades de Figma! Saludos
Hola como pusiste el tema dark mode?
creo que tiene la version sin internet instalada ::
@@inolaangulo5813 gracias ya vi que se puede configurar en theme
@@gabinocortes3314 Hola! Perdón por la demora, el Dark mode se agregó junto con la nueva actualización! Y como bien has dicho se puede configurar desde Theme!
Secos!!!!
Excelente tutorial!!! Amo Matrix <3
Muy buenoo!