Vi cuando escribiste mal featured y estaba esperando al momento que no vieras reflejados los resultados jajaja, pusiste cara nerviosa! Excelente tu vídeo. Me gusto mucho tu forma de explicar
Excelente video Francisco! Es muy sorprendente el nivel de detalle que manejas tanto para el video, como para trabajar. Te mando un gran abrazo y gracias por compartir tu conocimiento.
Te seré sincero, por lo general chequeaba tu canal por mejorar mis habilidades en Photoshop y así y era entretenido oírte, pero después de toparme con esta joyita, te has ganado mi suscripción, ¡PEDAZO DE VIDEO! espero seguir aprendiendo mucho más gracias a tu canal, éxitos!
Tio, eres MUUUYYYYY GRANDEEEEEEEE, en serio, desde Catalunya (españa), felicidades i gracias por tus video. Tenia la duda entre Figma o XD i ya me has resuelto la duda, GRANDEEEE!!!, MUY GRANDEEEEE
@@FranciscoAMK A ti, una vez más! Fran, si alguna vez podrías hacer un vídeo del proceso de aprendizaje de un frontend completo sería increíble, estudiantes como yo que vamos iniciando en esto es complicado saber por qué tecnologías o lenguajes de programación / enmaquetación comenzar, puesto que he estudiado HTML, CSS y estoy por iniciar JS pero quisiera profesionalizarme más en diseño de interfaces, complementarlo con HTML, CSS y JS y pasarle el trabajo siguiente al backend. Y una última cosita más Fran y disculpa, vi tu video de desarrollando un portafolio en Behance y me estoy animando a hacerlo como lo contaste pero me gustaría saber qué opinas algún día sobre él, ¿A dónde podría enviártelo?
Tambien me parece una herramienta genial, estudio para ser desarrollador web y te digo... esto acelera el diseño en gran medida!!! y como digiste, es perfecto que no invada el criterio del layout, gracias por enseñar esto, se que es un canal de diseño, pero todo desarrollador web debe saber algo de diseño.. buen video :D
Muy útil Fran, voy a explorar el AdobeXD. Me pareció muy bien explicado y como siempre, con tranquilidad y coherencia metodológica. Saludos desde Bogotá, Colombia!
Comparto totalmente tu opinión. Creo que XD (y otros) deberían ayudar a mantener lo más fiel posible a la página real, pero hasta ahí. Una belleza esta nueva característica.
Es un buen avance que permite por supuesto ahorrar tiempo y experimentar para futuras implementaciones, sobre todo cuando son elementos básicos como fuentes, textos, etc, sin embargo para elementos de mayor complejidad, le veo alto riesgo de incurrir en errores.
Soy estudiante nuevo de UX/UI, y tengo dudas de como se debe entregar mi trabajo al siguiente paso... Esto que enseñas aquí, es responsabilidad del diseñador UX/UI en el día a día de un sujeto trabajando en una empresa?
hola Francisco, enhorabuena, buen video. una pregunta soy nuevo usuario de adobe xd y quiero realizar un proyecto multimedia desde el cual pueda ejecutar un archivo ejecutable de un instalador de un programa, no se si seria posible desde adobe xd o con software lo podría realizar. gracias por tus aportes.
@@FranciscoAMK Aprovechando que contesto jeje si no es mucha molestia podría darme su opinión acerca de der fullstack o especializarme en backend que es lo que más me gusta
Hola Francisco, excelente video! Me preguntaba si es posible hacer lo que sería lo opuesto. Es decir: Tengo componentes creados con Bootstrap, como por ejemplo, un botón personalizado, del cual tengo una plantilla HTML con sus respectivas clases CSS. Es posible importar ese botón a Adobe XD para incluirlo en los diseños de las páginas? Gracias!
Hola Francisco! Sabes si lo mismo que estas haciendo con los codigos html y css se pueden hacer en dreamweaver? O sea, si puedes pasar los diseños de XD al lector de código de DW?
Primero que nada excelente video, en cuestiona a la pregunta que nos haces, si creo que las apps de diseño tengan esa capacidad de exportar pero como mencionas solo CSS, por que al menos el diseñador se preocupa por el User Flow y el UI del sitio web, de cierta manera la lógica de si un elemento es Grid o Flex, recae en la responsabilidad del developer, ahora bien muchas veces somos la misma persona, en ese caso seria genial que funcionaran a la perfección pero eso tendría que suceder en el momento de que estemos diseñando nos permita aplicarle ese tipo de especificaciones pero ya existe algo como eso y lo conocemos como Webflow.
hola muy bueno el video!! Una pregunta en el trabajo armo el diseño en XD y se los paso a los programadores que lo arman en react y nunca es igual al XD, veo que en la web les queda grande y diferente a lo que les armo en el xd.
Parece que es momento de comenzar a crear un sistema de diseño, si es que se trata de un mismo producto siempre. th-cam.com/video/He2nDD-WdsI/w-d-xo.html
Hola Francisco: me presento: soy Walter de 47 años y en este tiempo tengo las ganas de aprender lo que es desarrolla o hacer una pagina web; desde ya te digo mi profesión actual no tiene nada que ver con el diseño de web; soy Lic de Enf. jeje pero tengo conocimiento de algunos programas de adobe como after efect; premiere; photoshop; me gusta la edición de videos y fotos; ahora estoy comenzando un curso de programador ... creo entender que adobe xd esta más diseñado para los diseñadores de web que programadores... y para lo que estoy empezando como buen novato la pregunta: a cual me vuelco para adobe xd o adobe dw? si tenes algun curso o consejo será bien recibido. saludos desde Barranqueras Chaco Argentina.
Me ha gustado tu contenido aunque solo he visto poco de ti, pues apenas conozco tu canal, sin embargo me ha intrigado bastante lo que es el aprender sobre Adobe Xd y el como usarlo. Pero tengo varias dudas que te agradeceria que respondieras. Adobe Xd diciendolo de una manera muy sencilla y lo poco que he entendido de tus videos, facilita la creacion de sitios web sin importar a que tipo de dispositivo va dirigido, realizacion de muckups webs, e incluso plantillas, pero supongamos que como diseñador, estoy trabajando en conjunto con un programador, utilizaria este programa para diseñar todo un sio web, paginas, la direccion de cada parte del menu hacia alguna de estas paginas, formulario, etc. Y en general toda la funcionalidad e informacion de este sitio web, pero ¿como hago para pasarle toda esta informacion a un programador para que este haga su trabajo? es decir ¿en que formato guardo o exporto un sitio web ya hecho en Adobe Xd? (Ejemplo: como cuando guardas un arcivo en Illustrator ya sea AI o PDF) ¿ese formato es el que se le debe pasar a un programador para que el haga su parte del trabajo? ¿como funciona en realidad Adobe Xd a la hora de crear, diseñar, exportar o guardar en algun formato de archivo un sitio web?
Muchas gracias por tu contenido!!! Ahora, tengo una duda, el front me dice que al descargar el svg, el código que le muestra no tiene el "transform" incrustado para conocer la posición exacta. ¿Qué podría hacer en este caso?
No soy muy conocedor del tema, pero en mi poco conocimiento me duele que Adobe dejara de lado el Adobe Muse, para remplazarlo por XD, en MUSE podía diseñar una web y exportarla directamente en HTML para poder subirla a un dominio, aca solo te permite hacer una plantilla para compartirla y nada mas (según yo)
@@FranciscoAMK Adobe Muse en anuncio oficial dijo que dejaría de ser soportado para dar paso a Adobe XD y te sugieren que se use adobe XD en remplazo de Adobe Muse :(
la diferencia es que te ofrece posibilidades más apropiadas para administrar un diseño, por ejemplo el uso de componentes reutiizables, colores, estilos de texto, etc.
en si el programa para qué sirve?porque estuve haciendo diseños de paginas al azar(por hobbie, sin ninguna marca detrás) y he creado buenos diseños y quería poner esto que yo se en venta,pero ahora veo que es algo mas,y por eso quería preguntar ¿si lo puedo hacer si en realidad estoy vendiendo una pagina web o tambien tendria que aprender sobre html,CSS,C++ y Phyton para vender ya el producto terminado?
Lo que hace XD es un prototipo, podríamos decir que es el simil a los planos de un edificio. Si quieres tener una web más o menos funcional, debes aprender a menos html y css.
Hola Francisco, me ha gustado el vídeo felicidades por ello. Sin embargo no sé si este tipo de facilidades sean realmente útiles a la hora de exportar o de pasar un diseño de Adobe xD a html y css desde mi punto de vista, pienso que debes tener bastante cuidado a la hora de copiar el código que se ha exportado a el archivo css, por que tocas algunas propiedades bastante especificas. Si iniciaras desde 0 el código css y la estructura html no tendrías un poco más de control de lo que esta sucediendo? Una vez más gracias por conocimiento compartido. Saludos.
Sin duda, yo pienso que el codigo siempre da más libertad al crearse desde cero. Pero el hecho de que la aplicación te entregue especificaciones para elementos específicos, puede ahorrar un poco de tiempo, pero siempre dentro del contexto de que es para entregarselo a un desarrollador, quien sabrá cómo utilizarlo, no para reemplazar el trabajo de éste.
Hola Francisco, excelente como todo tu material. Has utilizado zeplin.io? si lo usaste comentanos por favor cuales serian las comparaciones (buenas o malas) según tu criterio y opinión. Gracias y abrazo grande.
Hola amigo. A mi no me parece la funcionalidad del codigo, tengo la version de 2019, con mi versión se puede toavía? ¿Que tengo que hacer para llevar mi diseño de XD a un hosting?
Necesitas la versión de (creo) junio de 2020. Para llevar tu diseño a un hosting, necesitas desarrollar el diseño, si no sabes código, puedes hacer equipo con una persona que se dedique a eso.
gracias por el video es interesante saber otra funcionalidad de la herramienta pero veo que se corrigen muchas cosas por la forma en que XD escribe el css y no me parece practico sobre todo cuando photoshop ya te da el css y hay otras herramientas web como webflow
Roger González claro, al final siempre recae en uno elegir la app que mejor se acomode a su forma de trabajo. En mi caso, necesito tanta libertad como sea posible para probar opciones de estilo y layouts súper rápido y eso ni photoshop ni webflow me lo entregan como sí XD.
Yo aprendi CSS, y ahora me encuentro con que hay un software que te da el codigo CSS asi tal cual. Me siento un poco frustrado (en el aspecto de que no tuve ciertas facilidades). Pero al menos yo veo esa herramienta como una facilidad y no como algo a lo que depender, y lo digo por que ya veo a los que todavia no saben nada, escogiendo esta herramienta por pura facilidad antes de entender el codigo, y asi generando una dependencia hacia "Adobe XD". Recomiendo estudiar el CSS, HTML y JavaScript(Y otros lenguajes) antes de empezar a usar estas herramientas, ya que si no tienen un conocimiento real y bueno en estos lenguajes, puede ser mas perjudicial de lo que creen el usar esta maravillosa herramienta. No evadan las dificultades que son necesarias para estos caminos que van de la mano con el codigo. Se los digo enserio, no es recomendable.
Una dosis de todo buen punto. Estas funcionalidades no buscan reemplazar el trabajo del dev. front end, sino darle facilidades para cuando el diseñador le entregue el diseño. En todo caso, se viene en un par de semanas mi masterclass “html y css desde cero” así que vamos a ayudar a los que no conozcan de este código a entrarle a este mundo.
Ya he visto varios cursos de Adobe y molesta que digan "si no sabes que es esto puedes ver el vídeo tal" osea como llevar un orden si no lo pueden explicar en este y ya :v
Minuto 9:20 alguien sabe que plugin usa para arrastrar la imagen directo a editor y que se convierta en una etiqueta de html? O si es un editor de código específico gracias!! 😁
Todo esto lo que esta haciendo Francisco. el plugin para XD. FIGMA y Sketch el cual se llama ANIMA se puede hacer en menos tiempo y sin andar quebrandoce la cabeza en ambos campos.. www.animaapp.com/ Finalmente nos ayuda a tranformar el diseño de estos programs UX en codigos y asi puedes usarlo en donde quieras.. finalemnte diseñadores y desarrolladores podran trabajan mas rapido y eficas con este plugin..
lo negativo de este software, como tbn de otros, es que han establecido un límite en cuanto al hardware y el sistema operativo que pueden soportar XD. Hay personas que no pueden probar y/o usar el programa si no tienen estos requisitos "minimos"
Bro has probado esta nueva app llamada Anima App que es compatible con figma, sketh y Xd? No consigo tutoriales o comentarios en español pero parece ser una aplicación que ayuda con esto del HTML. Seria genial que le puedas echar un ojo y publicar algo al respecto. Saludos
Si usted (lector o visitante a este video) no lee y no sabe la razon de XD que es hacer PROTOTIPOS, NO aplicaciones finales funcionales es porque usted, repito NO LEE o no hace investigación al comprar un software u app como este. Soy diseñador y soñaria con crear un app en XD y que se exportara en un app final pero eso es una fantasia porque sé que hay que programar todo finalmente. Este app mayormente se usa para crear prototipos para compañías que pagarán por el mismo. El prototipo sirve para VENDER LA IDEA a gerentes o cualquier persona envuelta en el proyecto y para que los programadores tengan una idea completa sobre lo que deben crear en CONJUNTO CON LOS diseñadores. Si usted quiere crear websites entonces XD NO ES SU solucion! Espero esta explicación ayude a entender a los que siguen preguntando para que perder el tiempo diseñando si no se puede usar finalmente como un app o website! XD es un app para diseñadores de INTERFACES en un ambiente de desarrollo de apps o webs corporativos.💪🏼🤦🏻♂️
3:11
"Además tenemos la foto de un gatito porque siempre hay que incluir un gatito en todo lo que hacemos"
Nmms Like y suscripción bien merecidos
Nunca puede faltar un gatito :)
Genial! ya se como entregar los archivos finales al desarrollador!
✌
no entiendo como no tienes mas subs , en mi opinión explicas muy bien.
Gracias, siempre se agradece un compartir con los colegas para llegar a más gente
MUCHAS MUCHAS GRACIAS APRENDI MAS CON ESTE VIDEO QUE EN TODO MI SEMESTRE DE PAGINAS WEB
Esto es excelente, seguí haciendo lo que hacés que venís por un re buen camino, aprendí mucho y no fue para nada pesado
Vi cuando escribiste mal featured y estaba esperando al momento que no vieras reflejados los resultados jajaja, pusiste cara nerviosa! Excelente tu vídeo. Me gusto mucho tu forma de explicar
Jajaja, me suele pasar
Yo igual! xD
Estoy plenamente de acuerdo con lo que planteas en el vídeo muchos saludos desde Santa Cruz aquí en Chile 🇨🇱
Genial. Un abrazo 🤘
Muy bacán tu forma de explicar con una simpleza y humildad que se agradece.
Deberías subir el Curso Html y Css.
Estoy armando el listado de temas para subir un curso de intro a html y css
@@FranciscoAMK Bacán!, Saludos!.
Yo estoy enseñando html en mi canal
Un genio, un ídolo y un ejemplo Francisco, desde argentina un gran abrazo
jajaja no da para tanto, cuando mucho, buen profe, pero gracias ;)
Cuando vi el tiempo me dije..."wei es largooo"; y lo ví sin problemas jajajaja tienes una voz muy agradable y explicas de maravilla :)
Muchas gracias tocaya
Excelente explicación y video! Un abrazo de un brasileño y muchas gracias.
Me estoy enamorando de todo UI Y UX por ti. Gracias!
🥰
Excelente video Francisco! Es muy sorprendente el nivel de detalle que manejas tanto para el video, como para trabajar. Te mando un gran abrazo y gracias por compartir tu conocimiento.
Excelente video, súper bien explicado, muy claro todo y bastante educativo.
Gracias.
Gracias Fernando :)
Te seré sincero, por lo general chequeaba tu canal por mejorar mis habilidades en Photoshop y así y era entretenido oírte, pero después de toparme con esta joyita, te has ganado mi suscripción, ¡PEDAZO DE VIDEO! espero seguir aprendiendo mucho más gracias a tu canal, éxitos!
Gracias :)
Tio, eres MUUUYYYYY GRANDEEEEEEEE, en serio, desde Catalunya (españa), felicidades i gracias por tus video. Tenia la duda entre Figma o XD i ya me has resuelto la duda, GRANDEEEE!!!, MUY GRANDEEEEE
Gracias :)
Gracias a ti he aprendido mucho. Gracias por todo el tiempo que inviertes con nosotros
TheLemon BOY excelente :)
Buen trabajo FranciscoAMK!
gracias por tu tiempo
Gracias Dante :)
Gracias, Francisco. Me encantó que lo explicaste todo bastante bien y en cuestión de minutos. Felicidades y sigue así.
Edgar Vargas gracias :)
Gracias por tanto conocimiento, valoramos inmensamente tu trabajo, Francisco, sigue así!!
Muchas gracias :)
@@FranciscoAMK A ti, una vez más!
Fran, si alguna vez podrías hacer un vídeo del proceso de aprendizaje de un frontend completo sería increíble, estudiantes como yo que vamos iniciando en esto es complicado saber por qué tecnologías o lenguajes de programación / enmaquetación comenzar, puesto que he estudiado HTML, CSS y estoy por iniciar JS pero quisiera profesionalizarme más en diseño de interfaces, complementarlo con HTML, CSS y JS y pasarle el trabajo siguiente al backend. Y una última cosita más Fran y disculpa, vi tu video de desarrollando un portafolio en Behance y me estoy animando a hacerlo como lo contaste pero me gustaría saber qué opinas algún día sobre él, ¿A dónde podría enviártelo?
@@angelnava8951 puedes escribirme en franciscoamk.com/contacto
@@FranciscoAMK Muy amable de tu parte Fran, feliz día.
Tambien me parece una herramienta genial, estudio para ser desarrollador web y te digo...
esto acelera el diseño en gran medida!!!
y como digiste, es perfecto que no invada el criterio del layout, gracias por enseñar esto, se que es un canal de diseño, pero todo desarrollador web debe saber algo de diseño.. buen video :D
Gracias por comentar Gabriel :)
Muy útil Fran, voy a explorar el AdobeXD. Me pareció muy bien explicado y como siempre, con tranquilidad y coherencia metodológica. Saludos desde Bogotá, Colombia!
Gracias :)
Donde estuviste toda mi vida? Suelo pasar de largo en videos como este pero uff 10/10
Te estuve esperando, pacientemente.
Excelente vídeo Frank. Creo que es una muy interesante funcionalidad y lo mejor es que aún tienen mucho margen de mejora. Saludos
Sip, tiene espacio a mejoras, por ejemplo me gustaría ver estilos de objeto o márgenes y paddings agregados
Si, mejorar los font-weight tambièn
Gracias Francisco. Fenomenal video. Muy didáctico. Saludos.
Muy buen tutorial y totalmente de acuerdo con las conclusiones
Wow lo entendí todo, gracs bro, calidad 💯
Que genio .... no pares de subir estos materiales!!!!!
😎
Comparto totalmente tu opinión. Creo que XD (y otros) deberían ayudar a mantener lo más fiel posible a la página real, pero hasta ahí. Una belleza esta nueva característica.
A mi me encantó, aunque las personas que esperen que sea un copiar, pegar y listo, se van a decepcionar.
Estoy en ello. Muchas gracias
🤘
Muito obrigado, excelente 👌, e ainda aprendi um pouco de espanhol
Gracias :)
Gracias por compartir tu conocimiento. Muy útil. Saludos
Excelente, gracias
Estoy enseñando html en mi canal
Justo estoy aprendiendo HTML y XD buena info! Suscrito
Excelente :)
Hola, sinceramente entiendo muy poco, pero quiero aprender lo más que pueda!
Te recomiendo ver esta intro a HTML y CSS
th-cam.com/video/6-GNq78nSuA/w-d-xo.html
joder. me tope con este video.. y ya me suscribi... saludos!!.
Excelente
Excelente Fran tus videos!! Gracias
Gracias
genial, muy agradecido y bien explicado.
:)
Muy buen video muchas gracias, talvez sabes como hacer en el caso de apps, talvez con flutter?
Hola, no me he metido al mundo de crear la app en sí misma aún. Me mantengo en el mudo de las interfaces por el momento.
@@FranciscoAMK Muchas gracias por responder, y muchos éxitos en tu canal
Excelente video! Muchas gracias por compartir tu conocimiento! Saludos!
Gracias Ramiro :)
Excelente video! Muchas gracias, tocayo.
Para eso estamos 😉
¡Excelente vídeo estimado Francisco!
😎
Gracias!
Es un buen avance que permite por supuesto ahorrar tiempo y experimentar para futuras implementaciones, sobre todo cuando son elementos básicos como fuentes, textos, etc, sin embargo para elementos de mayor complejidad, le veo alto riesgo de incurrir en errores.
Es un buen punto.
Soy estudiante nuevo de UX/UI, y tengo dudas de como se debe entregar mi trabajo al siguiente paso... Esto que enseñas aquí, es responsabilidad del diseñador UX/UI en el día a día de un sujeto trabajando en una empresa?
hola Francisco, enhorabuena, buen video.
una pregunta soy nuevo usuario de adobe xd y quiero realizar un proyecto multimedia desde el cual pueda ejecutar un archivo ejecutable de un instalador de un programa, no se si seria posible desde adobe xd o con software lo podría realizar.
gracias por tus aportes.
Nop. Adobe XD es una aplicación de diseño, que sirve para proyectar cómo serán las pantallas antes de entrar a desarrollo.
Gracias por responder Francisco.
1saludo desde España.
Muy buen video nuevamente. Gracias!
Para eso estamos :)
De mucha ayuda gracias!
😎
@@FranciscoAMK Aprovechando que contesto jeje si no es mucha molestia podría darme su opinión acerca de der fullstack o especializarme en backend que es lo que más me gusta
@@carlitosgalvankamey3191 no lo sé, deberías preguntarle a un desarrollador. Desde mi vereda, que es el diseño, no estoy capacitado para responder.
@@FranciscoAMK Oh lo siento crei que era desarrollador igual muchas gracias ya me subscribi!
Top! Agradecido. Um canal maravilhoso
✌
3:12 solo por eso, nuevo sub jejejehehe
gracias muy útil
😎
si hay gatitos, tienes mi likeee y mi suscripción!!
Siempre 👏 Hay 👏 Gatitos 👏
Hola Francisco, excelente video! Me preguntaba si es posible hacer lo que sería lo opuesto. Es decir: Tengo componentes creados con Bootstrap, como por ejemplo, un botón personalizado, del cual tengo una plantilla HTML con sus respectivas clases CSS. Es posible importar ese botón a Adobe XD para incluirlo en los diseños de las páginas? Gracias!
No que yo sepa
Hola Francisco! Sabes si lo mismo que estas haciendo con los codigos html y css se pueden hacer en dreamweaver? O sea, si puedes pasar los diseños de XD al lector de código de DW?
El código se puede usar en cualquier aplicación de código, Dreamweaver siendo uno de ellos.
Primero que nada excelente video, en cuestiona a la pregunta que nos haces, si creo que las apps de diseño tengan esa capacidad de exportar pero como mencionas solo CSS, por que al menos el diseñador se preocupa por el User Flow y el UI del sitio web, de cierta manera la lógica de si un elemento es Grid o Flex, recae en la responsabilidad del developer, ahora bien muchas veces somos la misma persona, en ese caso seria genial que funcionaran a la perfección pero eso tendría que suceder en el momento de que estemos diseñando nos permita aplicarle ese tipo de especificaciones pero ya existe algo como eso y lo conocemos como Webflow.
Cristian Cuevas 👍 muy de acuerdo
genio de los genios
Me sonrojo...
hola muy bueno el video!! Una pregunta en el trabajo armo el diseño en XD y se los paso a los programadores que lo arman en react y nunca es igual al XD, veo que en la web les queda grande y diferente a lo que les armo en el xd.
Parece que es momento de comenzar a crear un sistema de diseño, si es que se trata de un mismo producto siempre. th-cam.com/video/He2nDD-WdsI/w-d-xo.html
Hola Francisco: me presento: soy Walter de 47 años y en este tiempo tengo las ganas de aprender lo que es desarrolla o hacer una pagina web; desde ya te digo mi profesión actual no tiene nada que ver con el diseño de web; soy Lic de Enf. jeje pero tengo conocimiento de algunos programas de adobe como after efect; premiere; photoshop; me gusta la edición de videos y fotos; ahora estoy comenzando un curso de programador ... creo entender que adobe xd esta más diseñado para los diseñadores de web que programadores... y para lo que estoy empezando como buen novato la pregunta: a cual me vuelco para adobe xd o adobe dw? si tenes algun curso o consejo será bien recibido. saludos desde Barranqueras Chaco Argentina.
Me ha gustado tu contenido aunque solo he visto poco de ti, pues apenas conozco tu canal, sin embargo me ha intrigado bastante lo que es el aprender sobre Adobe Xd y el como usarlo. Pero tengo varias dudas que te agradeceria que respondieras. Adobe Xd diciendolo de una manera muy sencilla y lo poco que he entendido de tus videos, facilita la creacion de sitios web sin importar a que tipo de dispositivo va dirigido, realizacion de muckups webs, e incluso plantillas, pero supongamos que como diseñador, estoy trabajando en conjunto con un programador, utilizaria este programa para diseñar todo un sio web, paginas, la direccion de cada parte del menu hacia alguna de estas paginas, formulario, etc. Y en general toda la funcionalidad e informacion de este sitio web, pero ¿como hago para pasarle toda esta informacion a un programador para que este haga su trabajo? es decir ¿en que formato guardo o exporto un sitio web ya hecho en Adobe Xd? (Ejemplo: como cuando guardas un arcivo en Illustrator ya sea AI o PDF) ¿ese formato es el que se le debe pasar a un programador para que el haga su parte del trabajo? ¿como funciona en realidad Adobe Xd a la hora de crear, diseñar, exportar o guardar en algun formato de archivo un sitio web?
En esta clase se dispersan esas dudas: th-cam.com/video/lqHhx7HSZbA/w-d-xo.html&ab_channel=FranciscoAguileraG.
@@FranciscoAMK Muchisimas gracias. Te deseo lo mejor para tu vida y para tu canal.
te recomiendo q pruebes el OBS para grabar, podrias hacer los efectos en directo mientras grabas para reducir la post-produccion.
Uso el OBS para las transmisiones en vivo solamente.
jajaja eres genial, me gusto mucho andaba equivocada pensando q podria exportar de una a html, pero sabes de algun software q lo haga?
Ninguno que lo haga bien
que buen aporte sigue asi
Gracias :)
Genial Bro
Muchas gracias por tu contenido!!! Ahora, tengo una duda, el front me dice que al descargar el svg, el código que le muestra no tiene el "transform" incrustado para conocer la posición exacta. ¿Qué podría hacer en este caso?
Eso es muy específico y habría que ver el caso. No te puedo ayudar :(
No soy muy conocedor del tema, pero en mi poco conocimiento me duele que Adobe dejara de lado el Adobe Muse, para remplazarlo por XD, en MUSE podía diseñar una web y exportarla directamente en HTML para poder subirla a un dominio, aca solo te permite hacer una plantilla para compartirla y nada mas (según yo)
Adobe XD no es reemplazo a Muse, pues cumplen propósitos diferentes. XD apunta a un proceso profesional de diseño y desarrollo.
@@FranciscoAMK Adobe Muse en anuncio oficial dijo que dejaría de ser soportado para dar paso a Adobe XD y te sugieren que se use adobe XD en remplazo de Adobe Muse :(
donde puedo descargar adobe xd? o ya no es gratuito?
Entonses en que diferencia Xd con photoshop si igual tengo que saber programar para poder hacer una web ?
la diferencia es que te ofrece posibilidades más apropiadas para administrar un diseño, por ejemplo el uso de componentes reutiizables, colores, estilos de texto, etc.
y si esto se desarrolla en dreamweaver?, obviamente hay que saber código, por lo menos lo básico. Muy bueno el tutorial, explicas claro todo.
Muchas gracias
en si el programa para qué sirve?porque estuve haciendo diseños de paginas al azar(por hobbie, sin ninguna marca detrás) y he creado buenos diseños y quería poner esto que yo se en venta,pero ahora veo que es algo mas,y por eso quería preguntar ¿si lo puedo hacer si en realidad estoy vendiendo una pagina web o tambien tendria que aprender sobre html,CSS,C++ y Phyton para vender ya el producto terminado?
Lo que hace XD es un prototipo, podríamos decir que es el simil a los planos de un edificio. Si quieres tener una web más o menos funcional, debes aprender a menos html y css.
Adobe XD solo es para hacer prototipo nada mas ? o se puede hacer hacer lanzamiento de aplicacion ? gracias.
Solo prototipo
Me caes bien
👍
Hola Francisco, me ha gustado el vídeo felicidades por ello. Sin embargo no sé si este tipo de facilidades sean realmente útiles a la hora de exportar o de pasar un diseño de Adobe xD a html y css desde mi punto de vista, pienso que debes tener bastante cuidado a la hora de copiar el código que se ha exportado a el archivo css, por que tocas algunas propiedades bastante especificas.
Si iniciaras desde 0 el código css y la estructura html no tendrías un poco más de control de lo que esta sucediendo?
Una vez más gracias por conocimiento compartido.
Saludos.
Sin duda, yo pienso que el codigo siempre da más libertad al crearse desde cero. Pero el hecho de que la aplicación te entregue especificaciones para elementos específicos, puede ahorrar un poco de tiempo, pero siempre dentro del contexto de que es para entregarselo a un desarrollador, quien sabrá cómo utilizarlo, no para reemplazar el trabajo de éste.
Bien ahí eh!!; ya van 3 o 4 videos con ese mismo nombre!, buena growth!
🤘
Hola Francisco, excelente como todo tu material. Has utilizado zeplin.io? si lo usaste comentanos por favor cuales serian las comparaciones (buenas o malas) según tu criterio y opinión. Gracias y abrazo grande.
No lo he utilizado. realmente nunca he tenido la necesidad.
Hola amigo. A mi no me parece la funcionalidad del codigo, tengo la version de 2019, con mi versión se puede toavía? ¿Que tengo que hacer para llevar mi diseño de XD a un hosting?
Necesitas la versión de (creo) junio de 2020.
Para llevar tu diseño a un hosting, necesitas desarrollar el diseño, si no sabes código, puedes hacer equipo con una persona que se dedique a eso.
gracias por el video es interesante saber otra funcionalidad de la herramienta pero veo que se corrigen muchas cosas por la forma en que XD escribe el css y no me parece practico sobre todo cuando photoshop ya te da el css y hay otras herramientas web como webflow
Roger González claro, al final siempre recae en uno elegir la app que mejor se acomode a su forma de trabajo. En mi caso, necesito tanta libertad como sea posible para probar opciones de estilo y layouts súper rápido y eso ni photoshop ni webflow me lo entregan como sí XD.
@@FranciscoAMK estoy de acuerdo contigo
Esta perfecto , pero quizás se me complicaría al momento de hacerlo responsivo
se puede exporta a un proyecto offline? o solo a la nube?
Sip se puede, Archivo > Guardar localmente
@@FranciscoAMK Buenisimo gracias!
Estos pasos de exportación funcionarían si el diseño es un app. Lo digo para exportar hacia android studio.
No tengo experiencia con Android Studio, pero si los estilos se basan en CSS debería funcionar
G R A C I A S !
Hola, gracias pro el video, cual seria la diferencia de hacerlo con adobe xd y usar dreamweaver?
Dreamweaver es una app de desarrollo, adobe xd es una app de diseño.
25:10 hubo un fallo ahí, por eso es que no se achicó la img cuando reduciste la imagen, falto el "%" width : 90%;
Sip
@@FranciscoAMK buen video, yo se algo de css pero de diseño casi no xd así encontré tu canal
COMO AGREGO ICONOS ?
al momento de compartir no me aparece el apartador de design tokens...
Quizás no tienes la última versión de XD
Holas
Me pasa que en Adobe XD los colores me apareces muy desaturados, a pesar de usar los valores correctos de una marca me aparecen como lavados.
Uy, no sé por qué puede ser. Quizás tu diseño original tiene otro perfil de color.
Yo aprendi CSS, y ahora me encuentro con que hay un software que te da el codigo CSS asi tal cual. Me siento un poco frustrado (en el aspecto de que no tuve ciertas facilidades). Pero al menos yo veo esa herramienta como una facilidad y no como algo a lo que depender, y lo digo por que ya veo a los que todavia no saben nada, escogiendo esta herramienta por pura facilidad antes de entender el codigo, y asi generando una dependencia hacia "Adobe XD".
Recomiendo estudiar el CSS, HTML y JavaScript(Y otros lenguajes) antes de empezar a usar estas herramientas, ya que si no tienen un conocimiento real y bueno en estos lenguajes, puede ser mas perjudicial de lo que creen el usar esta maravillosa herramienta.
No evadan las dificultades que son necesarias para estos caminos que van de la mano con el codigo. Se los digo enserio, no es recomendable.
Una dosis de todo buen punto. Estas funcionalidades no buscan reemplazar el trabajo del dev. front end, sino darle facilidades para cuando el diseñador le entregue el diseño. En todo caso, se viene en un par de semanas mi masterclass “html y css desde cero” así que vamos a ayudar a los que no conozcan de este código a entrarle a este mundo.
Ya he visto varios cursos de Adobe y molesta que digan "si no sabes que es esto puedes ver el vídeo tal" osea como llevar un orden si no lo pueden explicar en este y ya :v
Lo siento, te he fallado 😢
a mi solo me muestra el css de los colores
Minuto 9:20 alguien sabe que plugin usa para arrastrar la imagen directo a editor y que se convierta en una etiqueta de html? O si es un editor de código específico gracias!! 😁
Ningún plugin, eso ya viene integrado en coda.
no sea flojo y escribe
No consegui descargar los archivos. Pincho en el enlace y no pasa nada...
Click derecho, descargar archivo enlazado
No se porque pero no me aparecen los design tokens.
Verifica que tengas la última versión de XD
@@FranciscoAMK Era eso! Gracias!
@@FranciscoAMK tenes el archivo de normalize.css?
Todo esto lo que esta haciendo Francisco. el plugin para XD. FIGMA y Sketch el cual se llama ANIMA se puede hacer en menos tiempo y sin andar quebrandoce la cabeza en ambos campos..
www.animaapp.com/
Finalmente nos ayuda a tranformar el diseño de estos programs UX en codigos y asi puedes usarlo en donde quieras..
finalemnte diseñadores y desarrolladores podran trabajan mas rapido y eficas con este plugin..
No realmente, probé anima y, si bien tiene sus aciertos, el código no es de calidad para producción. No está muy lejos delo que ofrece web export.
lo negativo de este software, como tbn de otros, es que han establecido un límite en cuanto al hardware y el sistema operativo que pueden soportar XD. Hay personas que no pueden probar y/o usar el programa si no tienen estos requisitos "minimos"
Ese es un dilemaen el desarrollo de software: Privilegiamos la innovación o privilegiamos la compatibilidad en reversa.
@@FranciscoAMK parece que la solución es FIGMA, la hice funcionar sobre win 7, en un elitebook i7, que ya tiene casi 10 años de antiguedad
Bro has probado esta nueva app llamada Anima App que es compatible con figma, sketh y Xd? No consigo tutoriales o comentarios en español pero parece ser una aplicación que ayuda con esto del HTML. Seria genial que le puedas echar un ojo y publicar algo al respecto. Saludos
La verdad es que cuando la probé no me gustó nada :(
Te ahorras todo esto con los complementos ......
No necesariamente, no he encontrado ningún complemente que ofrezca código de la misma calidad que si estuviese escrito por un desarrollador.
ADOBE MUSE... Q.E.P.D. cuando todo iba bien, no lo quitan.
💀
En mi canal de TH-cam estoy empezando a enseñar html
Buena
@@FranciscoAMK si TAMBIEN ENSEÑARE JAVA, JAVASCRIPT, PYTHON, .NET PHP ENTRE OTROS . apoyame! eso me haría muy feliz y tu suscripción también. gracias
XD
Si usted (lector o visitante a este video) no lee y no sabe la razon
de XD que es hacer PROTOTIPOS, NO aplicaciones finales funcionales es porque usted, repito NO LEE o no hace investigación al comprar un software u app como este. Soy diseñador y soñaria con crear un app en XD y que se exportara en un app final pero eso es una fantasia porque sé que hay que programar todo finalmente. Este app mayormente se usa para crear prototipos para compañías que pagarán por el mismo. El prototipo sirve para VENDER LA IDEA a gerentes o cualquier persona envuelta en el proyecto y para que los programadores tengan una idea completa sobre lo que deben crear en CONJUNTO CON LOS diseñadores. Si usted quiere crear websites entonces XD NO ES SU solucion! Espero esta explicación ayude a entender a los que siguen preguntando para que perder el tiempo diseñando si no se puede usar finalmente como un app o website! XD es un app para diseñadores de INTERFACES en un ambiente de desarrollo de apps o webs corporativos.💪🏼🤦🏻♂️
xD