UI/UX de aplicación web de Adobe XD: diseña un sitio web de carteras desde cero

1. Introducción: Bienvenido a este curso. Mi nombre es ayer, Chelsea, y seré el instructor en este curso. En este curso, vas a aprender a diseñar una completa cartera web app UI UX, utilizando Adobe XD. Diseñarás esta cartera web app UI UX. Tú, vamos a aprender todas las características de Adobe XD. Por ejemplo, aprenderás a hacer color de estilo de personaje de componente de grupo. Dice prototipado, animar complementos mostrados y muchas cosas más. Al final, vas a aprender a exportar tu diseño y diferente rendimiento. Int de este curso, tendrás un proyecto completo del mundo real que podrás agregar a tu portafolio y te ayudará a conseguir el trabajo de tus sueños. Esta es una aplicación de cartera completa que vas a diseñar en este curso. Se puede ver que tenemos una bonita barra de cojín tal vez con alguna cabecera y una foto aquí. Y escribe que tenemos nuestros objetos portadores donde estoy mostrando los correos electrónicos del parson y Dan aparecen objetos. Algún ícono aquí también diez justo arriba en eso tenemos nuestra sección de educación. Y se puede ver este bonito diseño y compartido con las opciones de degradado y caja-sombra y caja de lata aquí. Y luego tenemos estas secciones de proyectos. En la sección de proyecto, tenemos ahora mismo cuencos con chip. Y ahora si hago click en estos pocos detestos y se moverá al espacio de detalle donde tenemos nuestras diferentes cervezas por mostrar nuestros detalles post información aquí tenemos miedo, nuestra barra de navegación, y luego se pueden ver los correos electrónicos y luego tenemos esta inflamación. Y en la parte inferior también tenemos estos más proyectos sección. Aquí puedes ver un par de proyectos más en diferentes diseños. Y en la parte inferior tenemos nuestro pie de página. Y ahora si quería volver a la página de inicio, solo necesito hacer click en la página de inicio. Significa que hasta con la tubería en nuestra aplicación. Entonces aquí tienes. Se puede ver que ahora estamos informados ritmo. Y después de este proyecto seis mostrado, tenemos otra sección para habilidades de Kathy. Y aquí puedes ver diferentes tipos de diseño aquí vas a aprender, dio al estilo color. Dice gradiente de color cuando diseñarás lo sexual, entonces tenemos otra sección que va a ser la sección de herramientas. Y después de eso, tenemos esta sección de comentarios en nuestra cartera donde podemos ver alguna información, algunos comentarios en una tarjeta hasta Sean. Y luego tenemos este scroll opcional, tan dulce. Entonces puedes simplemente desplazarlo de manera horizontal. También querrás aprender a hacer un desplazable y cómo realizar diferentes tipos de scroll. Aquí se puede ver que tenemos totalmente dulzura ambos. Y luego tenemos nuestras opciones de formulario de contacto aquí. Aquí tenemos un bonito formulario de contacto o contacto con una persona. Y luego tenemos este fondo, que es nuestro pie de página en aplicación web. Entonces esta es la app completa y que vas a diseñar en este curso. Y después de terminar este curso, tendrás un proyecto completo del mundo real. Por ello, os animaré altamente a que disfruten de este curso. Nos vemos en el curso. 2. Crea un tablero de arte y diseño de navegación: Bienvenido a esta conferencia. En esta parte, vamos a empezar a trabajar en nuestro proyecto Adobe XD. Por lo que he abierto mi software Adobe XD. Así que cuando abras tu software de Adobe, lo más probable es que puedas ver este tipo de interfaz de usuario. Y por aquí tenemos opción para iPhone, que va a ser para el diseño de la interfaz de usuario de aplicaciones móviles. Entonces tenemos historia de Instagram ola y el tamaño personalizado. Para mí, voy a usar este látigo 19201880 pixel. Alternativamente, también puedes agregar este hidrógeno en blanco aquí, una parte superior seleccionando este tamaño personalizado. Voy a hacer click en este ancho, 1920 y N1 y dos pixel. Y nos va a dar una mesa de trabajo. Este es nuestro tablero de arte para un diseño de app web. Muy bien, entonces tendremos que diseñar nuestra aplicación por aquí. En la barra lateral izquierda, en la esquina lateral izquierda tenemos, déjame aumentarla. En la esquina lateral izquierda tenemos todas las herramientas. Esta es nuestra herramienta de deslizamiento, nuestra herramienta de rectángulo, nuestra herramienta Elipse, herramienta de línea de herramienta de polígono, herramienta de toma de pluma, y este es nuestro tablero de arte. Y por aquí tenemos dos ícono más. Uno es para nuestro tablero de arte y otro es por nuestro activo. Entonces si podemos crear nuestro color, ¿son componentes característicos y tantas cosas? Y el de abajo es para nuestro Nuestro plug-in. Si ya has instalado. Si aún no tienes enchufar, te voy a decir que usaré este ícono para el plugin de diseño. Y no nos dieron un par de íconos que podríamos necesitar usar. Simplemente puedes instalarlo. Entonces, ¿cómo puedes hacerlo? Si no lo sabes, entonces simplemente puedes hacer clic en plugin y luego puedes hacer clic en Discover plugin te va a dar interfaz de usuario aquí. Y desde aquí puedes hacer click en este navegar y luego simplemente puedes buscar icono para el diseño. Así que déjame mostrarte si empecé aquí ícono. Para que podamos buscar su ícono para el diseño. Entonces lo más probable es que puedas ver esto. Nuestro plug-in. Nada hecho en esta parte no es lo suficientemente rápido. Hay estudios al respecto no está mostrando ninguna forma de mostrar aquí. Te lo mostraré. Desde aquí puedes instalar tu plug-in n en la barra lateral derecha, tenemos otra dependencia de la propiedad. Entonces cuando seleccionamos alguna de las herramientas, podemos personalizarla a la esquina lateral derecha. Algo que disfrutamos. Muy bien, esto es oscuro, te lo mostraré. Debería aparecer aquí. Creo que por la intensidad la velocidad no se está mostrando. Necesitas instalar iconos para el diseño. Te lo mostraré más tarde. Déjame decirte primero. Entonces tenemos por aquí tenemos nuestra herramienta decente, luego nuestra herramienta prototipo. Esta es nuestra parte para ahora mismo, vamos a empezar a trabajar en nuestro proyecto de cartera. Por lo que en esta parte comenzaremos a diseñar agregando la barra de navegación. Encima de una replicación, tendremos nuestra barra de navegación. Entonces para agregar una barra de navegación, simplemente podemos tomar la mitad de esta herramienta de rectángulo y voy a arrastrar, voy a dejarla caer. Voy demasiado rápido. Necesitas deslizar la herramienta rectángulo. Entonces puedes arrastrar esta cosa de esta manera. Y en la esquina lateral derecha se puede ver la altura y el blanco que está mostrando por aquí y voy a ajustarlo a éste. Aquí tenemos el blanco, que es 1920, y la altura es de 75. A partir de aquí también se puede aumentar la altura. Digamos que voy a seleccionar AT, entonces va a aumentar la altura. Teary ir. Ahora podemos añadir nuestro color de fondo para nuestras barras de navegación. Entonces para agregar un color de fondo, aquí hay una paleta de colores. Se puede ver el campo por defecto es blanco. Y si hace clic aquí, entonces podremos ver una paleta de colores. A partir de aquí, podemos seleccionar nuestro color, sea cual sea el color que queramos. Alternativamente, también puedes usar tus códigos de color, por lo que simplemente puedes copiar tu código de color desde cualquier lugar y luego simplemente puedes pegarlo allí. Así es como va a funcionar aquí, pero para mí, solo voy a seleccionar cualquier color desde aquí. Tal vez. Este color. Perfecto. Este es nuestro color de navegación. En la navegación, vamos a tener un par de cosas. Tendremos nuestra barra de navegación, elemento de navegación. Aquí. Tendremos algunos textos, tal vez cartera, tal vez local. Podemos decir que solo puedes dar un nombre. Entonces para agregar un texto aquí, necesito tomar ayuda de esta herramienta de texto. Voy a hacer click en esta herramienta de texto y puedo decir M blanco. Y solo por ejemplo, una vez que escribas tu texto, tendrás que modificarlo desde aquí. Puedes ver aquí esto es 20 años el tamaño de fuente de nuestro texto. Rápido, déjame cambiar el color. Nuevamente. Tenemos que deslizar el texto y podemos cambiar el color desde aquí. Vamos a seleccionar a blanco. Y a partir de aquí podemos aumentar ese tamaño de granja contra tardía. Aquí tienes, se ha incrementado. Y aquí también puedes tomar un par de opciones. Entonces esta d, d significa mayúscula, y este d, d significa más pequeño que menor y menor. Puedes ajustarlo de esta manera. Así que voy a tomar éste y no necesitamos agregar éste. Significa que va a crear un poco de un tamaño más pequeño. Y puedes cambiar esa familia de fuentes de texto aquí. Podemos decir cualquier color, cualquier apellido divertido aquí. Voy a elegir éste. Ahora aquí vamos a tener un par de garrapatas. Entonces voy a sumar D aquí. Y digamos aquí. Podemos tener aquí. Podemos tener nuestro dx, podemos decir a casa. Y necesitaremos tener un par de artículos más aquí. Para que podamos hacerlo, simplemente puedo repetir. Puedo tomar ayuda de esta rejilla de repetición. Este estúpido agarre nos da opción de duplicar nuestro elemento de datos. Alternativamente, puede simplemente seleccionar el elemento y presionar Comando D, y simplemente puedo agregar elementos aquí. Y si necesito tener un poco de espacio entre estos ítems, entonces simplemente puedo aumentarlo, y luego también puedo disminuir este ítem aquí. Ahora déjame desagrupar este. Y aquí, después de esta casa, es posible que necesitemos tener una opción para éste podemos decir entonces se puede decir riego. Entonces puedo quitar uno por uno. Solo quería mostrarles que cómo funciona esta rejilla de repetición. Y luego otra forma es que solo hay que seleccionar el elemento y presionar Comando G si estás usando un Mac y creo que es Control D para duplicarlo. Así que se deslizó el elemento rápido y luego presione Comando D, y luego va a duplicar su elemento y luego puede arrastrarlo. Y se puede ver que a partir de aquí también se puede ajustar la distancia entre estos dos ítems. puede ver que es de 46 por 46. Para ambos están volteados y aquí podemos tener proyecto de oro. Tenemos otra opción. Déjame duplicarlo. Proyecto entonces tendremos proyecto, entonces tendremos habilidades. Se puede decir, en lugar de las llaves orientales, voy a agregar habilidades. Entonces tendremos, voy a duplicar éste. Y entonces puedo sumar habilidades y luego tendremos opción de herramientas aquí. Y después de eso necesitaremos tener anhedonia condición terminó el ítem nav, digamos por contacto entre cada ítem tenemos 46. Y entonces puedo decir que el nombre se llama contacto. Aquí va. Por lo que hemos diseñado nuestro artículo nav. Lo haremos un poco de cambios aquí. Por ejemplo, necesitamos tener nuestro subrayado de en la parte inferior de este ítem. Significa seleccionar elemento, seleccionar éste. Entonces vamos a mostrar esta cosa aquí. Entonces voy a sumar debajo de esta línea aquí cuya ahí podrá subrayar. Y después de seleccionar éste desde aquí, este tamaño de línea es importante. Por lo que esta más alta al aumentar el tamaño. Por lo que se puede aumentar la altura de la frontera obvia uno. Y luego para cambiar el color, simplemente puedo hacer click en esta paleta de colores. Y aquí vamos. Podemos ver, y si quieres tener algunas otras opciones como dash y gap, pero no necesitamos tener esta. Ahora, déjame correr este. Y aquí tienes. Podemos ver nuestro proyecto, nuestros colegas de navegación se veían así, pero vamos a hacer un poco de cambios. Haremos un poco de cambios, pero lo que pasa es que necesitamos, podemos cambiar podemos cambiar el tamaño de fuente de éste, creo que todos los textos. Así que voy a seleccionar excepto este N, Y, que es nuestro logo. Agregaremos un logotipo o el nombre de la empresa o la UNM completa volteada cualquier cosa. ¿ Resto del texto? Voy a cambiarlo. Voy a cambiar el tamaño. Voy a seleccionar el control, luego seleccionaré todos estos ítems. Después de seleccionar todo este ítem, podemos cambiar el objetivo a 25 quizá. Nuevamente, ahora se ve bien o puedes usar 25. Hay todo por esta parte y seguiremos desde la próxima conferencia. Nos vemos en la próxima conferencia. Adiós. 3. Diseño de secciones de encabezados: Bienvenido de nuevo una vez más. En esta parte, vamos a hacer un poco de cambios de nuestra barra de navegación y agregaremos algunas cosas extra. Entonces, ¿cómo podemos hacer con ahora esta es nuestra barra de navegación y hemos definido la altura de nuestro AT. Por lo que ahora voy a aumentar éste porque vamos a tener la misma barra de navegación y la sección de calefactores aquí. Por lo que va a ser 500. Permítanme correr este para que podamos ver exactamente cómo debe dividirse es, no puede tomar, así que podemos añadir un poco más aquí. Puedes tomar un poquito de más, un poco más de espacio aquí. Aquí vamos. Ahora creo que es suficiente tener y para aumentar el tamaño de la mesa de trabajo, simplemente puedo seleccionar la mesa de trabajo Doble clic y luego desde aquí puedes aumentarla. Después de esta cantidad de trama, esta línea, tendremos una opción para desplazarse. Se va a agregar automáticamente una opción de desplazamiento. Así que déjame mostrarte esta es nuestra pantalla de inicio, y ahora entonces podemos ver la opción scroll aquí. No hay problema en absoluto. Ahora tenemos esta opción. Puedo ver que tenemos poco de opciones aquí. Por lo que nota éste estaba pensando en beber, para seleccionar éste sólo después de seleccionar éste. Ahora puedes tener, tendrás esto. Se puede ver este punto aquí, anotar y hacer doble clic aquí. Una vez que quisieras hacer doble clic aquí, tendrás una opción para agregar esto, este punto, que es una especie de herramienta de ruta. Así que voy a seleccionar en él. Entonces si vuelves a hacer doble clic después de seleccionar, entonces tendrás otros dos puntos donde puedas. Avísame. Si haces doble clic en él. No viene. Permítanme volver a seleccionarlo. Esta es nuestra olla y si hacemos doble clic aquí, entonces tendremos este tipo de opciones a Jackie para hacer, para hacer cambios. Podemos hacer esto. Podemos agregar este tipo de opción de diseño aquí porque la voy a deshacer. Y luego voy a seleccionar éste de nuevo. Y a partir de aquí podemos sumar este tipo de tema de diseño. Se puede ver simplemente podemos arrastrar éste y podemos tener esta opción aquí. Pero no necesitamos tener estos dos, pero al mismo tiempo solo necesitamos tener una opción aquí. Por lo tanto, voy a desseleccionar todo. Y entonces esta es la fresca. Y haga doble clic y haga clic en éste, haga doble clic aquí. Y luego a partir de aquí simplemente puedo añadir este tipo de diseño. Se puede ver que esto es lo que quería tener. Es necesario seleccionar una vez y luego hacer doble clic en el punto, luego van a aparecer estos dos puntos . Entonces puedes simplemente arrastrarlo y puedes hacer cambios de la misma, ya sea de este lado o de este lado. Tienes muchas opciones para hacerlo. Es su elección seleccionarlo. Creo que es perfecto. O podemos añadir un poco de esto. Perfecto. Ahora, lo ejecuto, ahora se ve bastante bien. Podemos sumar un poco más de cambios aquí. Entonces voy a sumar aquí un gradiente. Los colores para volver a seleccionar el color, ya tenemos este color aquí. Y entonces una cosa que puedes hacer aquí, si necesitas usar el mismo color una y otra vez, entonces hay dos formas en que simplemente puedes hacer clic en él, y este color va a aparecer aquí. O alternativamente, puedes hacer nuestros componentes de color. Entonces, ¿cómo hacer un componente de color? Por lo que haga clic en esto ahora está seleccionado. Ahora si hago clic derecho, entonces tendremos esta opción que se puede ver en color a activo. Entonces vamos a añadir este color a nuestra carpeta de activos. Y aquí tienes, este es nuestro color. Y tenemos estas dos opciones porque tenemos este defecto. La frontera que está sucediendo. Voy a desseleccionar éste de éste, no hay más que ahora que hay una razón por la que fue seleccionado, pero aquí no es un gran tema. Entonces de esta manera simplemente puedes hacerlo. Ahora, voy a añadir, voy a tener nuestro ciclo aquí donde agregaremos una foto de perfil. Tal vez si eres desarrollador, te encantaría agregar tu foto de perfil aquí. Para ello, simplemente podemos añadir el círculo aquí. Da click en esta herramienta elipse y hazla ciclos. ¿ Cómo hacerlo circular? ¿ Cómo puedes asegurarte si no es Sokoloff? La forma más fácil es que necesitas definir la misma altura y blanca. Se puede ver por qué los dos W4 y más duros 337, significa que no es correctamente círculo. Lo voy a cambiar a TI W4. Ahora tiene el mismo tamaño, altura, y blanco ahora. Está en un círculo. Ahora, simplemente puedo añadir los correos electrónicos aquí. Por lo que he descargado un par de imágenes aquí para que puedas añadir cualquier imagen. Por lo que acabo de descargar nuestro EMS. Voy a añadir estas imágenes aquí. Erica, tenemos en estas imágenes aquí. Si lo desea, simplemente puede, simplemente puede agregar un borde aquí. Ya tenemos agua si no es necesario, podemos quitarla. Y luego si me deslizo este borde y luego puedes cambiar la altura, cambiar el tamaño del borde, y luego cambiar el color. Éste, cambia el color de este borde a blanco para que podamos ver, ahora se ve bastante bien y puedo aumentar un poco más de tamaño. Se puede decir tal vez cinco, tal vez más que eso. Siete. Se ve bien. Ahora si lo ejecuto, podemos ver estas cosas aquí. Podemos ver estas cosas aquí. Perfecto. Sólo estoy agregando una imagen. Sólo por un ejemplo, si lo desea, puede cambiar cualquier correo electrónico. Déjame comprobar si tengo alguna otra imagen. No, no tengo ninguna otra imagen hasta ahora. Voy a mantener esto aquí por ahora. Y lo cambiaremos más adelante si se requiere. Creo que está bien. No hay problema en absoluto. Y ahora por aquí, tendremos que añadir el nombre. Podemos añadir el nombre y poquito de una descripción. Por lo que voy a hacer click en esta herramienta Texto y puedo añadir, podemos decir que el nombre es, puedo agregar. ¿ Qué puedo añadir? Puedo añadir cualquier nombre. Puedo decir John Doe, sólo por un ejemplo. Aquí, puedo definir de nuevo. Primero, permítanme cambiar el tamaño de la garrapata de este texto. Entonces esto es en vez de 25, voy a seleccionar partido cinco. Más que eso, tal vez 45. Y aquí podemos sumar un poquito de defensa del tamaño de la granja aquí. Déjame probar algo. Por lo que hay muchos tamaño de los datos, varios tipos de letra, apellido, puedes elegir cualquiera de estos. Podemos sumar. Podemos añadir éste, y después de eso, necesitaremos tener otro texto. Aquí. Podemos aumentar éste, y aquí podemos sumar. Y por aquí, podemos agregar nuestro poquito de información, tal vez el parson, tal vez el parson, consiguiendo este sitio web de portafolio sobre su profesional, se puede decir UI, diseñadores de UX. Entonces quizá tenga más de una profesión. Entonces podemos decir, lo siento, necesitamos agregar capital menos acciones. Estado. Para este tamaño de fuente, puedo añadir un tamaño más pequeño, tal vez 35. Ahora déjame ejecutarlo. John Doe, UX, diseñador de UX y menos stock. Podemos simplemente, necesitamos seleccionar este 1 primero. Podemos ajustarlo aquí un poco más cerca de John Doe, el nombre. Y en lugar de este Cat5, creo que puedo hacerlo 25, entonces se verá más mejor. De esta manera. Aquí vamos. Por aquí, podemos tener otra vez, un poco de diseño aquí. ¿ Y cómo podemos agregar un poco de diseño aquí? Por lo que voy a hacer click sobre esto. Voy a agregar, me voy a llevar la mitad de estas herramientas Elipse. Haga clic en estas herramientas de elipse, entonces simplemente puedo dibujar algunos circuitos. Digamos 15 por 15 altura e y es de 1515. Y cómo se ve, se ve bien. Ahora puedo cambiar el color, cambiar el color a esto. Aquí vamos. Tenemos esta opción. Entonces podemos simplemente minimizar el espacio entre estos dos y hacer duplicado. Podemos hacer este equipo. Ahora si hago clic afuera, entonces tenemos este 12. De acuerdo, entonces ahora podemos hacer una cosa más aquí. En primer lugar, necesitamos desagrupar éste. Entonces voy a presionar el Comando D para que se agrupe. Para que crezca. Acabamos de hacer sólo vincular todo cosa y luego se puede presionar Comando G. Ahora debe estar aquí podemos ver este es el grupo y en su lugar este grupo, tenemos el salón y podemos cambiar el nombre. Podemos decir elipse de diseño. Dentro de esto tenemos esto. Tenemos todas estas elipse. Se puede ver que tenemos esta cantidad, este número de uno. Y si quieres discapacitar uno, puedes hacerlo haciendo click. Se puede ver que puede bloquear éste haciendo clic en este botón de registro. Entonces no va a quitar a ningún lado. Se va a quedar por aquí. Lo siento, no tiene éste. Necesito presionar el Comando Z porque el anónimo, está bien. Si lo bloqueas, entonces no va a bajar. No podrás quitarlo. No podrás moverlo desde aquí. Voy a desbloquearlo aquí. Y luego si quisieras usarlo un poco más simple, puedes hacer clic en éste. Y este ítem está deshabilitado null. Por lo que no podemos deshacer, puedes agregarlo éste, entonces tienes éste aquí. Voy a hacerlo de esta manera. Y entonces puedo trotarla aquí. O tal vez aquí. Tenemos esta opción aquí. Muy bien, ahora tenemos este diseño. Ahora si lo ejecuto, creo que se ve bastante bien. No hay problema en absoluto. Aquí todo está bien. Y permítanme añadir un poco de sombra. Entonces si hago click en esta elipse y aquí tenemos una opción para agregar, para agregar esta sombra porque ella, para ésta no está agregando. Lo siento, necesitamos seleccionar, sólo tenemos que seleccionar esta elipse. Aquí. Podemos sumar, lo siento, por esto. Por cada elemento podemos añadir una sombra aquí. Creo que no hay ningún requerido para agregar sombra aquí porque no querían visible aquí porque el tamaño es muy pequeño y hemos agregado tanta herramienta de elipse. Voy a quitarlo aquí. Entonces, lo que sea que tengamos, está bien. Y esto es por esta parte. Y en la siguiente parte vamos a empezar a trabajar para nuestra próxima parte que va a aparecer aquí. Entonces nos vemos en la próxima conferencia. Adiós. 4. Diseño de objetos para la carrera: Bienvenido de nuevo una vez más. En esta parte comenzaremos a sumar nuestra sección de objetos de carrera en nuestro proyecto. Pero antes de eso, solo quería hacerlo un poco de cambios. Por lo que quiero cambiar la EM Así que en lugar del semestre, voy a añadir aquí unas imágenes directamente diferentes. Simplemente puedes quitar el anterior y luego añadir éste o simplemente puedes arrastrarlo aquí. Es sólo un emús normal. Nada de noticias. Sólo quería arriesgarla. Ahora se ve esto esto es el EMS. Aquí todo está bien. Por lo que espero que no sea difícil para ti. Lo que hice, simplemente arrastro una nueva señorita en este círculo. Alternativamente, simplemente puedes eliminar todo el asunto, toda esta imagen. Entonces puedes agregarlo. Se va a sustituir de esta manera. Y tenemos la altura y vemos lo mismo exactamente lo mismo. Ahora si miramos este color de fondo de mesa de trabajo, se ve muy blanco. Por lo que quería tener un color un poco diferente. Voy a cambiar esto a color tipo grado. Tal vez en este color. Puedes agregar tu propio color de rejilla. Y ahora si lo ejecutamos, entonces puedo ver este color. Ahora se ve bastante bien, no hay problema en absoluto. Ahora otra cosa es que necesito seleccionar este tablero de arte rápido, y luego tenemos esta opción de layout aquí. Tenemos que hacer click en él. Si hacemos click en él, entonces podremos ver este tipo de su mundo es que tenemos esta columna y tenemos aquí este sistema RO. Se puede ver que este sistema de diseño de discos nos va a ayudar a sumar nuestro artículo para que podamos tener la misma altura y ancho desde ambos lados. Se puede ver tenemos la columna número 12. Si lo desea, simplemente puede cambiarlo a 15. Es tu elección. También puedes hacer el blanco y esconderte en la canaleta y columna de ancho, altura de columna y tantas cosas que puedes simplemente usarla. Fueron 12, lo voy a quedar con 12. Y ahora a partir de aquí podemos simplemente ajustar éste para que hagamos nuestra aplicación de ésta a ésta. Sea cual sea el artículo que vamos a crear, vamos a empezar de aquí a aquí, que podemos tener la misma distancia de esta izquierda en el lado izquierdo y desde el lado derecho. También nos ayudará a diseñar nuestro artículo. Permítanme mostrarles ahora necesitamos agregar nuestro objeto de carrera a adecuadamente u objetar. Podemos ayunar. Voy a añadir una imagen aquí para hacerlo, voy a seleccionar esta cosa desde aquí, y tal vez desde aquí desde estas cuatro columnas, y luego hacer esta cantidad. Ahora, puedo añadir estas imágenes aquí. Estos son los semimitos que tenemos aquí. Por aquí, llegaremos a un poco de espacio, y luego desde aquí agregaremos nuestra sección de objetos portadores. Así que me voy a llevar otra vez la mitad de esta herramienta de rectángulo. Y desde aquí se puede ver nos va a dar muchas opciones para agregar de aquí a esta columna, a este tamaño. Voy a llegar a éste. De esta manera podemos definir el cuero sin hogar y blanco. Estamos viviendo desde ambos lados, desde el lado izquierdo y de gran tamaño. Entonces esta es la mejor manera de hacerlo, y tenemos esta opción aquí. Ahora voy a azar, vale, Así que ahora lo que pasa es que ahora si necesitamos tener un poco de radio fronterizo aquí, así que puedo hacerlo agregando éste aquí de esta manera, un poquito de éste. Y luego podemos sumar estas sombras. Voy a hacer click sobre esta sombra y tal vez pueda agregar Hardy por 30. Aquí vamos. Tenemos esta sombra, así que la arreglaremos. Déjame ejecutarlo. Cómo se ve ahora. Podemos ver que se ve así. Otra cosa es que se puede ver desde el lado derecho tenemos el mismo espacio. Desde este lado teníamos el mismo espacio si no usamos el diseño y nos será muy difícil entender. falta de vivienda básicamente se van de las personas sin hogar del lado izquierdo, viviendo desde el lado derecho. Hay una razón por la que estamos usando estos, seleccionando este diseño y luego podemos hacerlo. No necesitamos tener esta vitalidad tardía dentro de 20 por 20 es suficiente. Ahora no necesitamos hacerlo. Ahora podemos pasar a la opción anterior. Por lo que voy a hacer click en él. Voy a hacer click en él. Y luego voy a desseleccionar esta capa. Ahora tenemos esta opción. Cuando lo necesitemos de nuevo, lo haremos. Y ahora aquí tenemos que agregar, necesitamos agregar nuestro texto. Entonces aquí rápido, no es necesario escribir objeto portador. Voy a hacer click en él. Puedo añadir aquí. Puedo decir lo que pasa es que es mirada, podemos ver porque aquí el color es blanco. Entonces tenemos que escribirlo a negro. Y entonces creo que podemos dejarme escribir algo aquí. Entonces puedo cambiar el color a negro. Necesidad de cambiar el color a negro. Ahora podemos ver, ahora aquí tenemos que escribir. En algún lugar aquí cuando se puede escribir. Objeto Gettier. Por lo que aquí tendremos estas opciones de objeto portador. Y creo que puedo cambiar el tamaño de la fuente a 30. Y podemos añadir un poquito de diferente familia de fuentes. A lo mejor estas opciones o tal vez la mejor. No sé exactamente lo que uno es mejor, pero podemos zumo. Se puede seleccionar tal vez éste, no un gran tema. Y otra cosa es que he quitado la frontera. No, aún no he quitado el agua. Entonces voy a que necesites agregar la herramienta de deslizamiento. Entonces selecciona este objeto portador y desde aquí quita el borde. No necesitamos tener ninguna junta aquí. Muy bien, ahora después de esto, podemos añadir un poquito de texto para editar texto. Aquí solo podemos agregar Laura de texto completo, algún texto ficticio de Loren Ipsum. Puedes usar cualquier texto, lo que quieras. Pero para mí solo voy a usar algún texto ficticio. Voy a copiar este texto y lo voy a pegar aquí. Cuando lo hagas, lo primero es que necesitas seleccionar la herramienta Texto y luego debes seleccionar el área de texto. ¿ Cuál es el texto? Lo siento, tenemos que seleccionar esto. El caso es que necesitamos mirar esta área aquí. Podemos seleccionar esta pequeña, de esta manera. Podemos deslizar que esta área de texto en este tamaño. En cambio esto, tendremos que pegar ese texto para que aparezca sólo dentro de esta área de texto. Y ahora definitivamente cambiaremos el tamaño de la fuente a 20. De acuerdo, lo haremos ahora. Creo que es mejor. arreglaremos de todos modos, no hay problema en absoluto. Ahora déjame mostrar. De acuerdo, entonces tenemos estos objetos de consulta, por lo que podemos volver a tomar ayuda de este diseño para ajustar este tema. Podemos dar click sobre éste y tenemos esta opción. Se puede ver que ahora podemos hacer una cosa. Sí, tenemos éste. Perfecto. Y en el mismo tamaño de esta línea, podemos agregar nuestro objeto portador aquí exactamente de esta manera. Ahora si yo y podemos simplemente esta cosa aquí. Y si yo, Ryan como, deberíamos poder ver nuestro cuidado. Se puede ver que ahora tenemos que toma el estudio del mismo tamaño, desde el frente, el mismo espacio. Tenemos éste aquí. Aquí vamos. Y ahora tenemos esta nota aquí. Agregaremos un par de cosas más. Ahora no necesitamos tener esta opción de diseño. Voy a resbalar esta cosa. Nuevamente. Voy a quitar este diseño prohibido de aquí. Agregaremos un par de chequera aquí. Tendremos un ícono aquí, entonces tendremos un ícono de texto y texto, significa que qué tipo de objeto de cuidado es usar tu cabello. Entonces él va a escribir un poco de descripción entonces alguna marca puntual aquí. Por lo que lo haremos en el próximo lugar. Y voy a detener este video aquí mismo. Parecen la próxima conferencia. Adiós. 5. Diseño de objetos y usos del complemento: Bienvenido de nuevo una vez más. En esta parte, completaremos nuestra sección de objetos portadores. Para ello, tenemos que sumar aquí nuestro círculo. Entonces agregaremos texto, círculo y textos. ¿ Cómo puedes hacerlo por eso? Tenemos que tener. Podemos agregar fast-twitch Ditech medios objetos, herramientas Elipse. Se puede ver esta línea aquí desde aquí creo que podemos empezar. Entonces puedo añadir aquí un círculo. Asegúrate de que el ciclo no hubiera enviado ya tal vez 5150. Yo no lo hice Blanco. Es más grande escribir déjame ejecutarlo. Es bastante más grande. Puedo al 40 por 40. Entonces oportunidad de endurecido blanco 40 por 40 aquí. Y entonces tendremos, tendremos que cambiar estilo, color de fondo de éste. Podemos cambiar algo como esta. Obviamente no necesitamos tener ninguna frontera aquí. Rojo. Ahora, podemos agregar nuestro ícono aquí. Entonces como te dije que he instalado este ícono para plugin, puedes simplemente instalar esta cosa desde esta opción plug-in aquí podemos decir en este desapercibida enchufando indígena Galileo por el aro inicial esta vez podremos verlo. Solo tienes que hacer click en esta opción de plug-in y luego puedes simplemente navegar aquí podrás buscar tantos plug-in. Aquí tienes la opción de administrar tu plugin. Se puede ver que he instalado un par de plug-ins para que pueda reenviar. Simplemente puedes instalarlo aquí. Y también tendrás otras opciones aquí. Ahora voy a buscar. Por lo que se puede decir tal vez el nombre del icono está hecho. Se puede ver si hago clic hecho, entonces puedo ver este ícono hacia abajo. Esto está seleccionado. Y si hago clic aquí, y debería estar aquí arriba en algún lugar para desplazar y voy a lo siento, no debería estar ahí. De acuerdo, por lo que necesitamos agregar este ícono aquí y podemos seleccionar este poco difícil cortar cuando seleccionamos un ícono desde aquí. Porque estoy seleccionando este ícono, lo voy a poner aquí. Ahora si lo ejecutamos, veamos qué podemos decir. Podemos ver que esto se ve bien, no está mal. ¿ De acuerdo? Entonces ahora tenemos éste. Podemos simplemente ¿qué podemos hacer? Podemos hacer que sea componentes para que podamos usarlo una y otra vez cada vez que sea para dejar de fumar. Para ello, tenemos este ícono y tenemos esta elipse. Esta elipse para este ícono. Y la ilustración es elites discontinuidad C-loops. Por lo que podemos tener estos demasiado rápido. Podemos hacerles un grupo. Podemos, podemos nombrarlo. Podemos nombrarlo se hacen icono icónico, íntimo y abajo. Simplemente ponga un ejemplo y luego es grupo ahora. Y hagámoslo componente. Si necesitábamos una carta, podemos reutilizarla. Así que haga clic derecho y haga clic en Make Component. Y debe aparecer. Debería aparecer aquí se puede ver que este es el componente. Si quiero, simplemente puedo añadir éste aquí. Entonces esta es la belleza de los componentes. Entonces no necesitamos arrastrarlo desde ahí. Por lo que ahora tenemos que agregar, necesitamos agregar un texto aquí para que podamos editar el texto aquí. Podemos decir qué tipo de objeto tenemos. Podemos decir que simplemente podemos copiar algún texto aquí de este Loren ipsum igual que algún texto ficticio. Porque no tienen ni idea de lo que aquí mismo. Así que obviamente cuando diseñes tu propio proyecto del mundo real, escribirás tu real nuestro objeto y necesitamos ajustarlo en esta talla, 5959. Se ve perfecto. Ahora déjame decirte contenedor y abajo icono. Y ahora podemos seleccionar esto ambos. Entonces conviértelos un grupo. Y podemos tomar ayuda de este repetido crear. Y luego podemos duplicarlo un par de veces más. K, Perfecto. Aquí vamos. Ahora déjame ver cómo se ve. Se ve bastante bien, pero podemos agregar un texto diferente de tipo diferente aquí. Para hacerlo. Podemos copiar diferentes textos de aquí, este texto, y luego podemos añadir algunos otros textos más. Desde aquí. Podemos añadir este texto aquí. He copiado el mismo texto, creo, porque ya usamos este. Déjame revisar la diferente. Tenemos esta opción aquí. Entonces en el resto de la parte podemos salir de esta manera. Sólo hay que seleccionar éste y podemos pegarlo en una cosa completamente aquí. Y tenemos esta cosa. Tenemos que cambiar unos cuantos más porque se verá bien si tenemos en nuestro texto diferente aquí. Esta cosa y otros dos, simplemente podemos añadir esta cosa desde aquí. Era popular. Podemos seleccionar éste. Tiene algunos textos más. Voy a quitar esta cosa aquí. Ahora se ve bastante bien. Todo está bien hasta aquí. Entonces tenemos esta opción por aquí, y estos son nuestros objetos portadores. Hemos ejecutado la misma altura y anchura desde ambos lados. Y en la siguiente parte comenzaremos a trabajar en nuestra sección de educación. Muy bien, ahora voy a detener este video aquí mismo. Continuaremos con desde la próxima conferencia. Nos vemos en la próxima conferencia. Adiós. 6. Sección de educación del diseño: Bienvenido de nuevo una vez más. En nuestra parte anterior, hemos terminado nuestra carrera objeto seis que se muestra en esta parte, vamos a empezar a trabajar para sumar una sección más, que va a ser nuestra sección de riego. Para ello, ante todo, voy a habilitar la vista de diseño. Por lo que voy a seleccionar éste y luego haga clic en este layout para que podamos ver estas vista de diseño. De este lado a este lado. Voy a añadir otra mesa de trabajo, otro rectángulo aquí. Entonces da clic en esta herramienta de rectángulo. Y por aquí, creo que aquí puedo dibujar nuestro nuevo rectángulo, éste. ¿ De acuerdo? Entonces esta columna a esta columna, en realidad necesitamos tener un tamaño un poco más grande. Voy a hacer click en la herramienta Seleccionar para que pueda aumentar esto, esta altura de esta mesa de trabajo principal. Voy a aumentar la altura de esta mesa de trabajo media. Aquí vamos. Creo que puedo aumentarlo un poco más aquí. Muy bien, entonces tenemos esta opción aquí. Y podemos, ahora también podemos usar a la vista normal. Y vamos a ver por ahora, podemos mover esta vista de diseño. Ahora tenemos estos por aquí. Tenemos que añadir frontera aquí, digamos añadir mortero 20. Entonces voy a quitar esta agua. No necesitamos tener esta frontera. Entonces hemos añadido 20 ideas de agua, pero no necesitamos tener ninguna frontera. Si hago clic aquí, se puede ver el tablero de ideas que utilizamos para este ítem es de 26. Así que voy a sumar uno a seis para éste también. Ahora tenemos que tener una sombra aquí. Entonces voy a revisar qué tipo de almohada de sombra hemos dado para esta. Y hay 20 por 20. Entonces voy a añadirlo, 2020. Eso es todo para que luzca sim por toda la parte. Muy bien, hasta ahora se ve bien y aún está, voy a añadir poquito de altura y luego voy a hacer click doble clic para que pueda llevar, pueda hacer click, doble clic en este punto para que podamos agregar un poco de razón aquí. Simplemente puedo hacer esto hecho de esta manera, o de esta manera. Voy a tomarlo de esta manera. Cuando haces doble clic en él, puedes conseguir este tipo de chef. Solo necesitas hacer doble clic. Entonces estas dos cosas van a aparecer aquí y luego solo sostenga una y luego simplemente arrástrela. Y de acuerdo a tu deseo, puedes hacerlo. Y aquí también se puede ver que ese es el hallux va a cambiar aquí por aquí. El x cuadrado cuando y valora, también se puede bucear, pero aquí es mucho más fácil usarlo. Aquí tenemos que añadir un título aquí. Por lo que el título va a ser educación. Entonces voy a volver a ver la vista de diseño. Y entonces puedo añadir el texto, un texto aquí. Puedo iniciarlo desde aquí. Simplemente puedo iniciarlo desde aquí. Creo que va a ser el centro por aquí. Y puedo decir aquí puedo sumar educación. Y obviamente necesitamos cambiar el tamaño de éste para poder cambiarlo a 50. Necesitamos un tamaño más grande aquí, y puedo hacerlo aquí. Creo que un poco. De acuerdo, déjame ejecutarlo para que pueda ver cómo se ve exactamente. Este es nuestro basado en la web y creo que está bien, se ve bien, pero aún así, podemos hacer un poco de cambio de nuestra familia de fuentes en una familia de fuentes diferente. No en éste. elegir éste y voy a sumar una línea bajo esta asignación. Así que voy a dibujar una línea aquí y aquí. Y entonces tenemos que cambiar el tamaño de la frontera porque la línea es un borde. Así que lo voy a cambiar a tres. Creo que sólo va a ser bueno si sumo aquí cinco. Y está bien Ahora el centro. Y ahora voy a cambiar el color de este borde. Esto es lo que puedo elegir. Entonces está bien, y ahora voy a cambiar esta vista de diseño. Éste. Aquí tienes. Tenemos esta educación y podemos ver esto subrayado aquí. Aquí todo está bien. Ahora aquí tenemos que sumar dos cosas. Uno es nuestro tal vez título universitario y otro es nuestro título universitario. Podemos sumar aquí. Para ello, voy a añadir aquí de inmediato necesitamos sumar una línea. Entonces para eso, podemos volver a tomar ayuda de este trazado para que podamos ver el medio. Entonces tenemos esto. Cuatro, y aquí tenemos 12, tenemos cuatro, luego 4810. Por lo que podemos tomarlo de estos cuatro y este dos y esta fuerza. Para que podamos dar nuestra línea en el medio. Tenemos cinco por cinco. Entonces en la medial podemos sumar esta línea. se pueda ver desde aquí, en el medio, se puede ver este es el medio de éste. Podemos dibujar una línea aquí en el medio. De acuerdo, así que ahora puedo ajustar éste. Ahora creo que está en medio. Ahora voy a cambiar el tamaño de esta agua a dos. Y aquí se puede ver esta opción de guión dejección significa que nos va a dar un borde de escritorio. Se puede ver que tenemos este tablero desconocido. Y entonces voy a cambiar el color de éste. Puedo cambiar cualquier color. Digamos que este color. momento podemos sumar un título de este dos ítem aquí en la educación. En el lado izquierdo, vamos a tener nuestro título universitario. Y podemos decir aquí, llama a esto nuestra titulación escolar. Entonces voy a seleccionar aquí esta herramienta de texto, y la voy a escribir aquí. Podemos decir título universitario. Una cosa se nota aquí es que si no cambias el lado de la forma, siempre va a tomar el tamaño de los ataques anteriores, anteriores. Por lo que hemos utilizado 50 para esta educación. Tomar su sitio, es, sigue tomando el mismo tamaño, por lo que tenemos que arriesgarlo. Entonces en lugar de 50, voy a decir 3030. Y aquí en el centro, creo que aquí puedo sumar esta licenciatura universitaria y voy a hacer un duplicado. Entonces presiona el Comando D y voy a llegar aquí. También. Se puede ver doscientos quinientos, ciento cinco es el espacio igual que estamos tomando de ambos lados. Y voy a decir que aquí está genial y llamaré a esta escuela. Y ahora después de eso, simplemente podemos sumar líneas. Entonces, lo que voy a hacer, simplemente voy a duplicar éste porque ya tenemos éste aquí. Y entonces lo voy a poner aquí, luego hacer otra copia. Entonces Comando D, y obviamente si lo deseas, simplemente puedes elegir uno diferente. Y si lo sostienes de esta manera, entonces puedes ver que la línea viene en la misma línea. Ahora se ve bien, no hay problema en absoluto. Todo está bien. Y aquí tendremos que escribir el nombre universitario y en nombre de la adversidad y el tema y el año tal vez para hacerlo, ¿qué puedo hacer aquí? Puedes recordar que nos encontramos con un componente de este ícono, íconos de abajo. Voy a arrastrar éste aquí. Usaremos éste. Entonces voy a arrastrarlo aquí. Aquí tenemos, simplemente podemos escribir uno. Podemos simplemente escribir, o simplemente podemos escribir en un texto, o simplemente podemos dibujar rectángulos. Así que voy a dibujar un rectángulo aquí, y luego lo voy a escribir aquí de esta manera. ¿Está bien? Voy a arrastrar éste por aquí en medio de esta caja. Y aquí escribiremos el nombre de la universidad, nombre de la universidad y la asignatura y el año. Voy a escribir algún ejemplo aquí. Y digamos, voy a decir aquí. Puedo decir aquí, Universidad de Oxford. Sólo por un ejemplo. El tema es BSC en ingeniería de software. Y entonces el año que pasa, tal vez aquí va a ser 2015 a 2018. Esto es lo que estoy pensando añadir aquí. Ahora, se puede ver que está en el mismo formato, así que sigue si queremos, creo que podemos simplemente, simplemente pueden minimizar éste un poco. Nuevamente. Disminuir la fuente del tamaño del texto. Ahora si lo ejecuto, déjame tomar cómo se ve. Se ve bastante bien aquí. Todo está bien. Te lo explicaré. BS Universitario en ingeniería de software año 2015 a 2018 está bien. No hay problema en absoluto. Y ahora tenemos tal vez una licenciatura, entonces tenemos tal vez maestría. Entonces voy a hacer que sea un duplicado. Entonces, en lugar de hacer un duplicado, ¿qué podemos hacer? Simplemente podemos hacer de ellos un grupo aquí. Entonces este es el texto. Y tenemos esta opción. Entonces tenemos esta opción. Podemos seleccionar estos alterados. Una cosa es que he añadido aquí un texto único. Por lo que si lo desea, puede hacer clic en Tick tres veces y luego puede hacerlo. Entonces voy a seleccionarlo todas estas cosas y hacerlo agrupar. Y puedo cambiar el nombre del grupo. Podemos decir que título de Educación. Puede dar cualquier nombre de su grupo. Y ahora voy a hacer click en esta rejilla de repetición y simplemente puedo hacer que la duplique. Perfecto. Y ahora voy a desagruparlo. Y aquí podemos decir MAC, simplemente cambia el texto a MSC en ingeniería de software. Entonces quizá aquí esté 2019202120192021. Y va lo mismo para estos mismos cuatro. Lo mismo para la licenciatura universitaria también. Así que voy a usar, voy a, voy a copiar este grupo. Y entonces puedo usar este aquí. Este es el grupo que estamos teniendo, así que necesitamos el mismo tipo de cosas. Y entonces simplemente puedo hacerles un grupo. Por lo que puedo decir comando G y grupo dos. Y voy a pegarlo aquí. Simplemente puedo duplicar. Yo puedo hacerlo. De acuerdo, así que simplemente puedo hacerlo desde aquí. Voy a hacer que el mando D porque es grupo aquí se puede ver que se está convirtiendo en un grupo. Ahora, simplemente puedo añadir este tema justo por aquí. Y luego puedo agregar Repetir Grid de nuevo aquí para éste. Y entonces puedo hacer que se duplique. Ahora, se ve igual y tenemos en el mismo tamaño. Es como en dos perfectamente. Y podemos decir eso. Permítanme cambiar el texto aquí. Entonces en lugar de ciudad inversa, podemos decir conseguir eruditos. Entonces se puede decir que el tema es tal vez ciencia. Se puede decir que el año es tal vez 12, 2014. Y para éste, voy a cambiar el nombre es que te voy a dar la escuela sin nombre. El tiempo tal vez, y la subred es quizás también señales. Ahí están los antecedentes, así que voy a jugar a la escuela. Puedes agregar cualquier cosa relativa a tu nombre. Se puede decir ciencia y el año va a ser de 2 mil a 2012. Eso es todo. Ahora si lo ejecuto, debería poder ver. Hice un error aquí. ¿ Qué pasó aquí? No, no, lo es. Ok. Pensé que tal vez he quitado este. Ahora si lo ejecuto, puedo ver que aquí todo está bien. Y esta es la educación aquí. Y tenemos esta opción. Se ve bien, Perfecto hasta ahora, estoy contento con eso, pero aquí tenemos algunos temas. Tenemos que resolverlo. Ahora si descubro, entonces se puede ver que en el hogar tenemos éste es más grande que el texto. No lo noté antes. Por lo que simplemente podemos resolver éste. Y esta es la línea. Simplemente podemos minimizar éste. De propiedad, ¿verdad? Simplemente podemos minimizar éste. El blanco es en lugar de 86, podemos decir 75, tal vez 55. Entonces podemos simplemente arrastrar y simplemente agregar solo éste. Podemos simplemente la oportunidad de saber para que simplemente podamos ajustar éste. Creo que ahora está bien. Está bien ahora, perfecto. Voy a detener este video aquí mismo y seguiremos con desde la próxima conferencia. Entonces espero que hayas entendido cómo trabajar, cómo diseñar este tipo de cosas usando Adobe XD. Y en la siguiente parte añadiremos aquí experiencia laboral y otras cosas. Entonces nos vemos en la próxima conferencia. Adiós. 7. Diseño de una sección de proyectos: Bienvenido de nuevo una vez más. En esta parte, diseñaremos nuestra sección de proyectos. Entonces vamos a sumar nuestra sección de proyectos donde podremos exhibir nuestro proyecto. Para ello, hay que sumar, ante todo, voy a aumentar la altura de esta mesa de trabajo principal. Voy a aumentar más el poco de altura. Quizás esto, porque tendremos que añadir algunas cosas más aquí. Y aquí vamos. Ahora, voy a seleccionar este 1 primero, luego haga clic en este layout para que podamos ver esta vista de layout que nos ayude a sumar nuestra mesa de trabajo y diseño. Entonces, ante todo, tendremos que sumar aquí nuestro título, que va a ser nuestro proyecto, proyecto y después subrayar. Entonces, lo que voy a hacer, voy a hacer clic en éste y éste. Esto y esto. Vale, entonces esta línea dos y esta educación, les voy a hacer un grupo y les voy a decir título. Esto ahora es un grupo y voy a presionar el Comando D para que podamos hacerlo duplicado y arrastrarlo aquí y ahora ajustar la línea. puede ver que se estudia desde este lado para la educación y va lo mismo para éste. Puedo tomar un poco de espacio aquí. Perfecto, Ahora voy a cambiar el nombre. Entonces en lugar de Educación en esta cosa va a ser proyectos aquí. Y aquí tendremos que ajustar el subrayado aquí porque el texto es poco. Nadie es pocos. Entonces integración. Ahora se ve bien, Perfecto. Ahora tenemos que tomar ayuda de esta herramienta rectángulo aquí. Podemos añadir esta cosa aquí. Podemos arrastrar éste de aquí a aquí porque vamos a sumar un par de proyectos. Por lo que trataré de tomar un poco más de espacio para éste. Por lo que se inicia de esta columna a esta columna. Y ahora podemos ajustarlo desde el proyecto. Ok, entonces otra cosa es que, para que podamos sumar el diseño similar como éste. Así que voy a hacer doble clic en él y luego aquí puede hacer doble clic. Una vez que haga doble clic, debería poder ver esta línea. Y luego puedes simplemente dibujar o ajustar éste. Simplemente podemos agregar solo este de esta manera. Aquí. Otra cosa es que también necesitamos agregar estas ideas modernas para esta. Tan rápido, creo que hemos terminado con este tejido de diseño. Ya no necesitamos ver maquetación aquí por ahora. Pero tendremos que subir un archivo, entonces lo volveremos a hacer. Por lo que voy a quitar éste, voy a hacer click sobre él, después eliminar éste. Y ahora tenemos estos proyectos, estos proyectos aquí necesitamos sumar frontera. Voy a quitar esta frontera aquí. Y creo que necesitamos sumar la sombra rápidamente. Por lo que agrega sombra 20 por 20. Aquí vamos. Tenemos este 20 por 20. Ahora no tenemos, déjame hacerlas. Hacerlo deshacer rápido. Ahora, haga clic en él. Si hago click en este texto aquí, se debe mover desde aquí. Voy a desmarcar este 1 primero. Y luego si hago clic en él, entonces voy a dibujarlo de nuevo. No sé por qué esta frontera de Sean no se muestra aquí. Debería mostrarse aquí. Entonces, ¿dónde está esto? De acuerdo, entonces ha contado en el acto. No hay razón por la que no se muestre. Voy a quitar de este 1 primero y ajustar esta cuadrícula de longitud aquí. Creo que en lugar de hacer directamente éste, he añadido este 1 primero. Así que intentémoslo de nuevo. Ahora. Creo que puedo ver aquí esta opción fronteriza. Y al mismo tiempo podemos simplemente tener esta opción. Voy a seleccionar éste, luego voy a añadir justo este 1 primero. Y luego aquí puedes cambiar el borde a 26, y luego hacer clic en esto, luego haz doble clic aquí, Stuart, y luego hacerlo. Un poco de diseñar cosas aquí. Perfecto. Ahora podemos simplemente mover este diseño. Tenemos que tener estos se desprenden que se muestran aquí. Podemos sumar esta sombra. Sombra es 20 para 2020 desde x y desde y sitio. Bien, tan perfecto ahora es todavía podemos ver esta frontera, pero no necesitamos tener esta frontera aquí. Por lo que voy a quitar esta frontera de aquí. Perfecto, Ahora se ve bastante bien. Ahora tenemos que sumar nuestro aquí, necesitamos sumar de nuevo nuestra frontera. Voy a llevar aquí esta herramienta rectángulo. Así que aquí vamos, vamos a sumar nuestro proyecto. Entonces tendremos un título, la descripción, y luego dos botones. Para éste voy a añadir sólo a este sitio aquí. De aquí a aquí. Voy a tener otro, vamos a tener otro rectángulo aquí. Y este rectángulo será para los e-mails. Y tenemos que ajustar éste con el tamaño. Y en este rectángulo, agregaremos nuestros correos electrónicos. Y aquí tendremos nuestro título y la descripción, y tendremos dos botones. Para hacerlo. Ya he descargado un par de imágenes. Entonces voy a usar esas imágenes primero. Entonces voy a arrastrar esta imagen directamente a aquí. Se puede ver que se va a ajustar automáticamente según el rectángulo. Hay estudios cuando me crearon este rectángulo encima de este rectángulo, y simplemente puedo aumentarlo o disminuirlo aquí. Esto conduce a está bien. Y ahora podemos sumar nuestro título y descripción. Para hacerlo. Podemos, necesitamos tomar salud para, para esta herramienta de texto aquí. Permítanme hacer doble clic aquí y añadir el layout para que podamos ver desde donde podemos sumar nuestro título. Podemos añadir este título desde aquí, o podemos ajustar este poquito aquí. Podemos añadirlo desde aquí, y agregaremos nuestro texto desde aquí. Podemos añadir un texto aquí, el centro. Y este va a ser el título de nuestro texto. Podemos copiar algún texto de nuestra Loren Ipsum. Puedo decir que puedes añadir éste. Se puede añadir este aquí. Podemos sumar algunos en contra de él para copiar esta línea desde aquí, se puede conseguir en cualquier texto, solo pongo un ejemplo, estoy usando éste. Y tú, alternativamente, también puedes usar algún tipo de plug-in para el texto. Primera razón por la que no se muestra aquí. Permítanme creo que aún no funcionó. Necesito copiarlo primero. Entonces puedo añadir este aquí. Por lo que esta es nuestra herramienta de texto está seleccionada. Aquí puedo. Esto no lo sabía. Aquí tienes. El caso es que 12 estándar para instalar el tamaño de fuente porque es 50, por lo que debe ser 20, un poco más grande. Creo que 25 estaría bien. Aquí vamos. Para que podamos agregar nuestro texto aquí. Y alternativamente podemos, déjame revisarlo, cómo se ve, cómo va a verse el tamaño. Por éste. Se ve bien, está bien. Metal no polar. Esto va a poder titular y necesitamos sumar nuestra descripción para agregar una descripción aquí, ¿qué podemos hacer aquí? O podemos hacer click en esto, el siguiente, y después podemos dibujarlo. Significa que si lo voy a dibujar de esta manera, entonces va a ajustar el texto dentro de este cuadro. Dentro de esta caja no se puede añadir. Ahora voy a perderme el tamaño. Voy a, lo siento, ¿qué pasó? Doy clic en este 1 primero y más rápido, necesito agregar el texto aquí. Por lo que voy a dibujarlo de este sitio a aquí. Entonces dentro tenemos que pegar en el texto. Entonces voy a copiar algunos textos de aquí. Voy a copiarlo y luego puedo pegarlo aquí. Aquí vamos. Ahora tenemos esta opción aquí. Ahora podemos simplemente, simplemente ajustar este de esta manera. Entonces también pueden ajustarlo con eso, con este detalle, así sucesivamente. Para la descripción, debe ser 20. No sólo necesitamos agregar la misma altura y peso, mismo tamaño de granja para título y descripción. Se ve bastante bien, no hay problema en absoluto. Ahora, podemos, una cosa que podemos hacer aquí, podemos disminuirlos. Es una cosa aquí tenemos que quitar esta. Podemos tener justicia ON porque no necesitamos más espacio para el detalle. Y otra cosa es que necesitamos ajustar el EMS así como éste porque no necesitamos tener mucho más espacio para éste. Entonces de esta manera podemos ajustarlo. Y aquí vamos a sumar dos botones. Por lo que no necesitamos tener este combustible de diseño ahora. Podemos sumar dos abajo aquí. Una es para pruebas de belleza y otra es mala vista de la vida. Para agregar un botón, voy a tomar ayuda en esta herramienta de rectángulo. Voy a hacer click en esto. Voy a hacer un diseño aquí. Aquí. Entonces puedo añadir un poco de radio fronterizo para éste. Y dentro de éste se puede añadir nuestro texto para que puedas decir detalles de Bu, ver detalles y podemos hacerlo central. Creo que también podemos aumentar el tamaño de la fuente a 30, y luego puedo ajustarlo en el centro. Y déjame cambiar estilo, estilo de fuente. Podemos sumar nuestro diferente al estándar para éste. Tal vez no éste, tal vez algún otro. No éste también. Podemos elegir. Este se ve bien. Creo que buscando eligió éste. Ahora si lo ejecutamos, ojalá podamos verlo. Entonces aquí vamos. Podemos ver que esta cosa se está mostrando aquí. Voy a detener este video aquí mismo y seguiremos con él desde la próxima conferencia. Nos vemos en la próxima mezcla aquí. 8. Diseño completo de la sección del proyecto: Bienvenido de nuevo una vez más. En esta parte, terminaremos nuestra sección de proyectos. Hemos descendido IS o botón en nuestra parte anterior y este e-mail envía esta cosa. Pero lo que pasa es que creo que el tamaño inferior es un poco de sierra de precipitados o simplemente podemos minimizar el tamaño de la forma así como el tamaño inferior. En lugar de tardy, podemos atarlo con 25. Entonces también podemos probar un poco diferente en la familia de fuentes diferente. Y denotar éste. Una más pequeña, no ésta. Esto se va a ajustar con éste. Podemos elegir estos diferentes. ¿ Podemos tener esta vista, podemos ver detalles, pero tiene la oportunidad de compartir adecuadamente su detalle. Pero definitivamente puedes probar el otro. Y podemos tener éste perfecto. Sierra. Me gustó esto, la familia de fuentes. Y entonces podemos ver, se ve bastante bien, pero podemos ajustar el syscall inferior. No necesitamos tener uno más grande. Puedo ajustarlo según el texto que creo. Entonces podemos ajustarlo al centro. Apenas centro tranquilo. Se puede ver que Hardy by Tarde y ordenado para la biotita cincel está bien, aquí hay una especie de centro. Ahora. Necesitamos convertirlo en un grupo para que podamos duplicarlo. Entonces construye detalles y este solvente rectángulo, te deslizarás las garrapatas y el rectángulo. Podrás ver el punto culminante de la misma aquí. Para que puedas ver si hago click en Ver Detalles, entonces va a resaltar algunos detalles. Y si hago clic en este rectángulo, entonces va a ser ángulo correcto. Para. Otra cosa es que cuando votas creas algún nuevo componente en el botón Nuevo y un texto nuevo, siempre va a aparecer en la parte superior. Entonces va a ser muy fácil para ti identificar cuál es necesitas hacer grupo, vale, así que voy a seleccionar éste aquí. Se puede ver Junta ha sido seleccionada. Ahora puedo presionar Comando Z. estoy puedo decir hacerlo, puedo renombrarlo. Puedo decir botón. Aquí vamos. Ahora, haga clic en esta cuadrícula de repetición. Esta es la forma más fácil de hacer duplicación n. Aquí llamamos Ver Detalles. Y entonces voy a desagruparlo n en lugar de esta vista detalles. Por lo que podemos simplemente, podemos decirlo vista en vivo. Tal vez si un usuario los quiere directamente. Y predeciblemente toma la visión en vivo de este proyecto. Podemos decir la vida bu. Creo que tenemos que volver a ajustarnos en este porque hemos cambiado tanto que se puede ver tardy por Tarde. Desde arriba. Se ha tomado espacio tardanza y luego desde abajo interesante y Tarde y de ambos lados 484988 está bien aquí igual. Y ahora si lo ejecuto, deberíamos poder ver nuestro diseño. Está bien, se ve perfecto. Y lo hicimos y podemos de nuevo, simplemente podemos minimizar éste. Y otra cosa que podemos, si quieres, también puedes agregar poquito de radios de borde o agua o puedes cambiar el color de ésta, pero podemos cambiar el color del botón. Esto es lo que podemos hacer. Ahora. Así que casualidad el color de fondo de este patrón. ¿ Qué ha pasado? He seleccionado uno diferente. De acuerdo, déjame ver esta. Nos va a mostrar aquí. La vista en vivo. Tenemos que añadir el cofre está bien, por lo que necesitamos seleccionar el rectángulo. No va a hacer esto aquí. Podemos ayunar se definen un color de fondo de este botón. Y entonces te voy a mostrar lo que está pasando exactamente aquí. Por lo que simplemente podemos hacerlo de esta manera. Podemos hacer, podemos limpiar el estante aquí. Y se puede ver que ahora lo siguiente es razonable. Entonces, ¿qué hacemos? Simplemente podemos decir que ahora llevar al frente. Entonces simplemente podemos avanzar el color del texto. Simplemente podemos cambiar el color del texto sigue siendo, todavía podemos texto no es visible aquí. Tenemos esta opción. Permítanme ahora si por casualidad se dos veces, podemos ver que el color es blanco ahora, por lo que es visible ahora. Ahora si lo ejecuto, entonces deberíamos poder ver esta cosa. De acuerdo, entonces se ve bastante bien ahora. Viven pocos. Y luego para este botón podemos quedarnos con éste. Alcohol, fondo blanco. No hay problema en absoluto. Ahora, siempre todavía tenemos un espacio muy grande, por lo que simplemente podemos disminuir el espacio. Y además, para éste, se puede ver la frontera está seleccionada aquí. Entonces, ¿qué puedo hacer? Simplemente puedo desmarcar este botón para que no veamos ningún borde para estos correos electrónicos. Y entonces si voy a bajar la velocidad, ya puedo mover el tamaño de esta imagen. Hemos finalizado nuestra sección de proyectos, y ahora podemos duplicar este proyecto. Para hacer un duplicado. ¿ Qué puedo hacer? Aquí tenemos otro tema. El subrayado ha ido de este proyecto. No sé cuál es la razón. En realidad está aquí. Pero no podemos, no podemos ver esto. Pero no podemos ver o no está ahí. Déjame ver. Permítanme ver texto del proyecto donde es positivo. Considerando que esta línea, tenemos que seleccionar este seleccionar este color porque fue eliminado a desafortunadamente, todos modos, ahora se está mostrando aquí. Por lo que ahora tenemos estas pocas cosas para que sea un duplicado. Entonces, ¿cómo podemos hacerlo? un título y descripción sobre esta cosa. Y esto es tantas cosas que tenemos rápido. Tenemos este rectángulo, tres, luego tenemos este texto, entonces tenemos éste. O simplemente podemos descuidar, podemos hacer simplemente podemos copiar todo esto, pero a veces crea un tema aquí. Entonces, ¿cuál es el nombre del principal? Tenemos que hacerles un grupo es demasiado largo, entonces es demasiado largo. Estos dos, tenemos estas coletas, luego tenemos el rectángulo. Tenemos este rectángulo también aquí. Entonces tenemos en éste. Y para esta vista detalles, tenemos este botón por aquí. Voy a seleccionar este botón y este botón, esto toma esta opción, y este equipo y éste también. Creo que he seleccionado todos estos ahora puedo hacer que sea un duplicado. Así que olvidé esclavizar a éste. También necesitamos seleccionar esta vista detalles. Ahora puedo hacerles un grupo. Entonces presiona Comando Z y hasta que vuelva a renombrarlo. Podemos decir, podemos decir proyectos. Ahora, hagamos click en la rejilla de repetición para que podamos hacerla duplicar fácilmente. Aquí vamos, podemos ver que tenemos todas estas cosas y ahora podemos duplicar esta. Está bien, y si quieres, también puedes hacer cambios entre este espacio, pero creo que eso básicamente tiene que está bien. Ahora voy a desagrupar éste. Y ahora la cosa es que simplemente podemos cambiar los correos electrónicos desde aquí. Entonces, en lugar de estos correos electrónicos, ¿qué puedo hacer? Puedo pensar que puedo quitar esta imagen de aquí. Y luego en lugar de eliminar esto, simplemente podemos reemplazar esta imagen aquí. Volvemos a tener nuestras diferentes unidades. Tenemos éste. Voy a añadir este aquí. Ramus ha sido reemplazado. Y a partir de aquí, podemos agregar, se puede agregar otro. Yo sólo tengo éste. Creo que puedo hacer esto aquí. Y no tengo ninguna otra imagen aquí hasta ahora. No tengo ninguna otra. Está bien. Ahora si lo ejecuto, simplemente puedo ver estas cosas. Por lo que hemos solucionado este problema, tenemos éste también. Y está bien, entonces tenemos objeto de carrera. También es perfecto. Se puede ver que todos los lados son partidos, por lo que no hay problema en absoluto. Por lo que tenemos sección de educación, que también es buena. Tenemos sección protic donde tenemos esta vista en vivo y la vista detalles y View Details live view. Para que puedas ver lo que pasa es que puedes ver el tamaño, altura de ancho, y las distancias en el tamaño perfecto. No hay ningún problema con eso. Y tenemos estas opciones por aquí también. Lo hemos hecho ahora en la siguiente parte, lo haremos, agregaremos sección demo. Y otra cosa es que tendremos que agregar prototipos. Por lo que cuando lo uses, haremos click en este Ver Detalles. Los enviaremos a un lugar diferente donde agregaremos un par de detalles del proyecto pueden ser noticias para agregar éste, tal vez esté publicando éste en este proyecto. Por lo que hay que añadir un poco de descripción en el proyecto. Lo haremos. Pero ahora voy a detener este video justo aquí y seguiremos con la próxima conferencia. Nos vemos en la próxima conferencia. 9. Diseño de habilidades tecnológicas: Bienvenido de nuevo una vez más. En esta parte, agregaremos una sección más en nuestro proyecto de cartera, que va a ser una habilidad tecnológica. que puedas, para que el usuario pueda mostrar sus habilidades tecnológicas y las herramientas, qué tipo de habilidad de ticket está trabajando. Entonces esta cartera de estudios basados en nuestro desarrollador o un parson que tiene trabajando en, que está trabajando en desarrollo web, baja potencia, o cualquier tipo de ingeniería de software. Hay una razón por la que estoy agregando estas habilidades tecnológicas o sección de herramientas. Pero si estás apuntando a dos tipos diferentes de audiencias y puedes sumar diferentes tipos de sexuales de acuerdo a su profesión. La otra parte principal publica a T-cell usted. Esto es cómo diseñar este tipo de cosas y cómo puedes usar todas las herramientas de Adobe XD? Espero que estuvieras aprendiendo. En primer lugar, necesitamos aumentar la altura de esta mesa de trabajo principal. Entonces haz doble clic y luego aumenta la altura. Voy a añadir un poco más. Va a ser una aplicación de una sola página. Hay una razón por la que vamos a aumentarlo. Ahora voy a hacer doble clic en él para que pueda ver el layout. Entonces, cuando haces doble clic en la mesa de trabajo principal, deberías poder ver estas opciones de diseño. Por lo que da clic en esta capa. Ahora tenemos esta visión. Ahora tenemos el, así que previamente conocimos grupo de esta educación creo que voy a hacer de ella un duplicado. Entonces pega el Comando D, y luego simplemente podemos arrastrarlo. Simplemente puedo arrastrarlo hasta el fondo de este proyecto y podemos ajustarlo. Aquí. Son del mismo tamaño. Se puede ver en la misma posición. Proyectos y éste va a estar tomando habilidades. Simplemente no puedo cambiar ese texto. Por lo que puedo decir que se necesita habilidades de habilidad. Aquí vamos. Creo que no necesitamos arriesgar el subrayado. Y ahora voy a añadir este rectángulo aquí. Aquí vamos. A partir de aquí necesitamos dibujar un rectángulo en esta columna. Y aquí vamos, tenemos esta opción. Podemos añadir un poco más de espacio aquí, y si no lo necesitamos, podemos cambiarlo. Voy a sumar border-radio 26. Después haga un doble clic, y luego haga clic en él. Entonces simplemente podemos hacerlo. Simplemente podemos agregar un poco de este tema de diseño. Ahora, ya no necesitamos tener éste. Se ve bien. Y ahora podemos quitar esta frontera. No necesitamos tener esta frontera en absoluto. Aquí. Tenemos que sumar nuestras sombras. Sombra va a ser 20 por 20. Aquí, voy a añadir otro rectángulo donde vamos a mostrar nuestro círculo. Creo que podemos tomar ayuda de estas maquetaciones. Así que haga doble clic y haga clic en este diseño. Y está empezando desde aquí, para que podamos iniciarlo desde este lado, desde esta columna. De acuerdo, así que voy a, voy a tomar este de aquí, estos dos. ¿ Y necesitamos agregar otro círculo encima de éste? El circuito va a estar entre estas columna y esta columna. Podemos ajustarlo de esto a esto. Y para hacerlo circular, tenemos que asegurarnos de que estamos dando la altura y el blanco es exactamente lo mismo, 150 por 150. Se puede ver que el círculo se establece a partir de esto, desde el final de esta columna y terminó desde el final de esta columna. En medio de éste. Estamos dando este circuito aquí y aquí vamos. Perfecto. De esta manera. Podemos hacerlo y creo que está bien, y podemos ajustarlo de esta manera también. Ahora ya no necesitamos tener este diseño, así que lo voy a quitar. Y ahora se ve esto, tenemos esto, el mismo espacio de este lado a este lado. Ahora aquí podemos sumar nuestras garrapatas y podemos editar texto aquí. Entonces el texto va a ser, podemos decir, el niño más grande va a ser en lugar de la mayor habilidad, puede decir tal vez JavaScript. Javascript va a ser eso. Y aquí voy a cambiar eso no toma éste. Qué textos hemos utilizado para este, hemos usado coco. Voy a usar el mismo texto de la misma familia de fuentes va a ser co corner y éste, perfecto. Ahora podemos ajustar éste para que no necesitemos tener este espacio más grande aquí. Simplemente podemos minimizar éste. También podemos ajustar el texto y debe estar en el centro. Se puede ver. Se puede ver fácilmente, podemos hacerlo centro. Lo puedes ver el por 8076 D6 específico. Esto es lo mejor posible que podemos hacer aquí y ahora podemos ajustar esta para que no necesitamos tener, creo que no necesitamos tener la frontera aquí, pero podemos añadir esta sombra aquí. Así borde de sombra, sombra 20 por 20. Ahora se va a quedar bien al escribir. También puedo añadir la frontera para que pueda fácilmente factible. Déjame correr y cómo se ve. Slower take skill va a ser como este proyecto. Toma una escala, y esto se llama JavaScript. De acuerdo, entonces se va a quedar bien y podemos En, hacer, podemos mantener éste o simplemente podemos minimizar éste un poco más, entonces simplemente podemos tener éste. Perfecto n aquí. Podemos simplemente estilo Jen. Parece que puedes cambiar el color de fondo de éste. Podemos añadir color diferente para el diferente. Y podemos agregar gradiente lineal. Y entonces podemos simplemente ajustar este tema de aquí a aquí. Entonces simplemente podemos agregar solo este de esta manera. No necesitamos tener esta frontera desde aquí. Ahora. Tiene la misma altura y blanca. Se ve bastante bien. Podemos mantener la frontera para JavaScript. No necesitamos tener otras cosas aquí. Puedo decir tomar su castillo alternativamente, ¿qué puedes hacer? Podemos simplemente, simplemente puede agregar un logotipo o cualquier otra imagen puede ser puesta a cabo en producto para el logotipo de JavaScript. Pero para mí sólo voy a añadir el color. Va a estar bien con eso. No hay problema en absoluto. Entonces ahora la cosa es que tenemos que hacer, tenemos, necesitamos hacerlos un grupo. Entonces tenemos JavaScript, tenemos este rectángulo. Tenemos éste, entonces es el camino. Tenemos esta parte, por lo que se ha convertido en parte. No necesitamos hacer esto. Entonces estas son las tres cosas que necesitamos para hacer un grupo. Por lo que voy a presionar Comando D o Control y JavaScript. Y este rectángulo en este árbol ha sido seleccionado, entonces voy a hacer de ellos un grupo. Así que presiona Comando G en tu teclado o alternativamente, puedes presionar el botón derecho del ratón y luego puedes decir Desagrupar. O si estuvieras en Windows, entonces puedes simplemente presionar Control Z, creo que para el Mac es Comando C. Voy a presionar Comando G, y ahora tiene un grupo y voy a cambiar el grupo nombre2. Podemos decir habilidades tecnológicas. Vamos a decir tomar una habilidad. Ahora, podemos hacerlos duplicar fácilmente. Aquí vamos. Simplemente podemos hacerlos duplicar. Entonces si queremos sumar solo una G, entonces lo siento. Entonces tendremos que reorganizarlo. Éste. Podemos tomarlo un poco en este lado, y luego podemos cumplir con éste. También podemos sumar sólo ocho de ambos lados. Y entonces podemos tener esto encendido, creo que creo que está bien, pero para obtener más confirmación, simplemente podemos hacer click en este layout. Entonces podemos ajustarlo ahora. Primero déjame desagruparme. Está viniendo desde el medio de éste y no viene de lo medial y éste debería serlo. Ahí. Lo es. Vale, creo que está en el centro. Perfecto. Ahora en el fondo, también podemos hacer otro grupo. Creo que dos grupo es suficiente dependiendo de que la persona esté cerrada set. Podemos, simplemente podemos hacer esto. Podemos hacer un poco más grande espacio. Podemos crear un espacio entre ellos. Entonces podemos ver que tenemos este espacio desde el costado y la suma de esos espacios desde el costado. Entonces está bien, completamente perfecto. Y ahora si lo desagrupo, ahora haga doble clic en este tablero de arte principal y elimino esta vista de diseño. Y aquí vamos. Tenemos esta opción aquí. Entonces simplemente podemos cambiar eso toma dos. Entonces en lugar de JavaScript, podemos salvar este término. Podemos decir Adobe XD. Puedo decir Adobe XD. Entonces podemos cambiar eso toma dos. Podemos cambiar que tome dos golpes. Gs, digamos que no hay oxígenos, solo estoy agregando algo de tecnología de programación. Diseño Ux. Entonces entonces puedo decir Figma por éste. Por éste. En lugar de JavaScript, voy a decir un React js. Voy a reaccionar JS. Y por éste voy a decir salvar pueblos o muescas. Perfecto. Así que cada vez que estás diseñando algo en lugar de mostrar las mismas etiquetas, siempre se quedó para agregar un texto diferente. Se ve bastante bien cuando vas a dar cualquier tipo de presentaciones. Se va a quedar realmente bien. Ahora podemos simplemente cambiar el color de fondo de este, de todos y cada elemento porque necesitamos mostrar los diferentes para que se vea bien. Y en lugar de esto, está mostrando el gradiente lineal. Vamos a tomar primero el sindicato, así que lo voy a cambiar a un color diferente primero para que podamos hacerlo. Podemos simplemente este gradiente lineal aquí. Simplemente podemos agregar esta cosa. De acuerdo, así que para éste puedo elegir r, Otro color diferente. Entonces si tienes algún otro código de color, entonces ¿qué puedes hacer? Simplemente puedes pegarlo aquí y luego puedes usarlo. Tan rápido, voy a hacer que sea un degradado de color sólido. Entonces voy a hacer éste, guarde este color. Para éste, voy a elegir uno diferente. Entonces quita esta cosa. Y luego puedo añadir una lineal obscureciendo un poco oscura. Para éste voy a elegir el otro que ya tenemos. Y para éste, hagámoslo un poco más ligero o de esta manera. De acuerdo, así que ahora si lo ejecuto, entonces deberíamos poder ver nuestro color, nuestras habilidades tecnológicas. Y aquí vamos. Tenemos estas habilidades tecnológicas. Perfecto. Se ve bastante bien, no hay problema en absoluto. En la siguiente parte vamos a sumar nuestras herramientas. Va a ser el diseño similar, pero lo veremos como hacerlo. Voy a detener este video aquí mismo y seguiremos con desde la próxima conferencia. Nos vemos en la próxima conferencia. Adiós. 10. Diseño de la sección de herramientas para aplicaciones: Bienvenido de nuevo una vez más. En esta parte, diseñaremos nuestra otra sección que va a ser nuestra sección de herramientas a sección de esta similar a nuestra sección transversal techies. Por lo que vamos a añadir estas imágenes de fondo y luego agregaremos las herramientas, tal vez cualquier otra herramienta que tenga un desarrollador. Así que para eso, voy, primero, voy a la vista de diseño de datos de intervalo rápido para que podamos simplemente ver la columna. Entonces esta es nuestra vista de diseño ahora. Y luego voy a, tenemos meta Grupo de esta educación. Voy a hacer que sea un grupo de nuevo. Voy a presionar el Comando D y luego puedo arrastrar éste al fondo después de esto hacia arriba en la sección más pegajosa para que podamos agregar aquí una sección más. Podríamos hacerlo componente en lugar de arrastrarlo una y otra vez, pero está bien. También podemos hacerlo de esta manera. Y aquí podemos organizarlo de esta manera. Entonces esta va a ser nuestras herramientas, para que podamos dejarlo aquí. Y voy a cambiar el texto rápido. El texto va a ser sólo herramientas. El texto va a ser herramientas. Y aquí tienes. Podemos, necesitamos añadirlo aquí. Y entonces tenemos que reorganizar éste. Tenemos que disminuir el blanco de esta frontera en esta línea. Perfecto. Tenemos esta opción aquí ahora, las puertas están bien. Ahora necesitamos aumentar un poco más nuestra altura de este tablero principal de arte. Y entonces podemos tomar ayuda Bob esta herramienta rectángulo, y desde esta columna podemos ajustar nuestro rectángulo. ¿ Verdad? Por lo que esta vez voy a hacer cualquier herramienta de doblez. Entonces voy a usar cualquier herramienta de bolígrafo. Así que directamente voy a usar el radio fronterizo a efectivamente un seis. Entonces voy a quitar este tamaño de borde de aquí. Entonces tenemos que añadir aquí una sombra para hacer click sobre la sombra y añadir 20 por 20. Perfecto. Por lo que tenemos estas opciones aquí. Ahora, creo que podemos ajustarlo aquí. Y negación, voy a eliminar estos Layout View. De acuerdo, así que ahora podemos hacer una cosa. Simplemente podemos convertirlos en un grupo. Creo que ya es un grupo que va a estar tomando habilidades. Voy a seleccionar éste o iconos. Voy a seleccionar éste y presionar Comando D. Y luego puedo duplicar éste y arrastrarlo aquí para pegarlo encima de éste. Lo que voy a tener que hacer, tendré que ver con Bring to Front. Y lo podemos ver ahora aquí. Aquí están iguales ajustar, comer. Con éste, podemos volver a habilitar la vista de diseño para que podamos ver lo que está pasando. Y a partir de aquí podemos sumar éste para que simplemente podamos simplemente ajustarlo con disciplina, creo. Sí, esto es lo que podemos ver aquí? Para éste? También hace 14, está bien, perfecto. X2, 397299. Para que podamos cambiarlo a 307. Ahora, desde aquí también puedes hacerlo mínimamente. Por lo que si hago clic en éste, se pueden ver los huevos y no es del lado izquierdo. Se ha expresado desde un espacio de t 07 x posición. Y por eso he añadido expedición de tres a siete para esto para que pueda alinearse al mismo. Muy bien, ahora puedo llevarlo un poco abajo aquí. En cambio. Tiene oportunidad contra lo que voy a añadirlo al 07. Ahora tenemos estas opciones aquí, por lo que ahora podemos movernos, podemos eliminar esta vista de diseño ahora. Y después ha sucedido. Por lo que se ha tomado el tamaño de éste. Déjame revisarlo de nuevo o simplemente puedes arrastrarlo. Esto es lo que debería ser. Ahora podemos ver que 307. Pero aquí pensamos, creo que hicimos un poco de error. Déjame revisarlo una vez más si es de la talla, así que no, no está en el tamaño perfecto. Por lo que debería ser que debería iniciarse desde aquí. Entonces no lo noté hasta ese momento. Esa fue la razón. Aquí. Ya se puede ver que se ve igual. Y si elimino este diseño de aquí, entonces se puede ver ahora se ve igual. Muy bien, así que en lugar de Figma, cambiaremos ese texto más adelante. Pero antes de eso, permítanme usar esta herramienta Repetir Cuadrícula para que podamos agregar algunas herramientas más aquí. Tal vez. Perfecto. Tenemos tres. Aquí vamos. Creo que tres son suficientes para éste. Entonces voy a desagrupar esta rejilla. Y entonces lo voy a hacer, simplemente puedo disminuir éste. Entonces aquí podemos, podemos cambiar el texto. Por lo que voy a añadir, se puede decir herramientas. Voy a agregar GitHub o conseguir por éste. Así que voy a decir dy dt y yo nos ajustamos en el centro porque el más pequeño. Por lo que ahora creo que podemos ajustarlo de esta manera. Por lo que un 163 por ciento sesenta y tres y setenta cinco por ciento a seis. Entonces está en el centro. Ahora podemos cambiar el color de éste para que podamos seleccionar un color diferente. Creo que éste es perfecto. Y ahora para éste, podemos sumar más oscuro. Podemos sumar aquí más oscuro. Nuevamente. Tenemos que ajustarnos en esto y más oscuro. El centro. Aquí hay un 124 por 23, lo que está en el centro. Ahora estilo Jen color de fondo de éste. Podemos elegir este color aquí. Perfecto. Y para éste, creo que podemos elegir. Podemos elegir, podemos decir látigo pick. Puedes elegir cualquier nombre, lo que quieras relacionado con tu requerimiento. Entonces aquí tenemos que ajustarlo en el centro. Por lo que un 123 no está en el centro. Perfecto Webpack n Aquí tenemos esta opción. Podemos cambiar el color de fondo en éste. De acuerdo, así que ahora si ejecuto esta, debería poder ver aquí estas herramientas sección. Tenemos este pew proyecto, tenemos estas habilidades pegajosas, y luego tenemos estas herramientas sección, por lo que se ve bastante bien, no hay problema en absoluto. Una cosa que no todo está bien aquí. Y arriba en la herramienta sexual, agregaremos nuestra sección de comentarios para que podamos compartir la nuestra propia, para que podamos compartir opinión de otra persona sobre nuestro desarrollador. Lo haremos en la próxima conferencia y voy a detener este video aquí mismo. Nos vemos en la próxima conferencia. Adiós adiós. 11. Diseño de tarjetas de comentarios para aplicaciones: Bienvenido de nuevo una vez más. En esta parte, comenzaremos a trabajar en nuestra sección de comentarios, donde agregaremos algunos comentarios y luego agregaremos a nuestra vista de desplazamiento horizontal. Entonces para hacerlo ante todo, voy a aumentar el tamaño de la mesa de trabajo de dominio para que podamos sumar aquí nuestra sección. Ahora, ¿qué puedo hacer aquí? Voy a maquillarlo componente rápido porque lo estamos, necesitamos copiar éste varias veces. Entonces hagámoslo un componente. Voy a agregar componente mike. Entonces éste se ha convertido en un componente y se puede ver que el ícono ha sido cambiado, y debería estar aquí. Ahora, podemos usar este aquí tan rápido. Tenemos que agregar esta cosa aquí. Permítanme incapacidades vista de diseño. Y desde aquí, ahora puedo arrastrar éste. Aquí. Se puede ver éste aquí. Aquí otra vez. Aquí puedo cambiarlo, educación a retroalimentación. Feedback y luego necesitamos ajustar éste un poco. Creo que en el medio. Lo es. Ok. Ahora déjame revisar. Esta educación sólo está ahí, vale, está bien. No hay problema en absoluto. Ahora aquí vamos a mostrar nuestros comentarios. Para hacerlo. Ahora en esta parte no vamos a añadir ninguna, no vamos a necesitar agregar. Por lo que quería añadir a nuestra pantalla completa mostrando los comentarios. Pero para esto se podría poner la retroalimentación. Para retroalimentación, voy a desplazar la vista vamos a hacer con desde esta columna lo que quiero decir con eso. Por lo que agregaré un color de fondo, y encima de este color de fondo, agregaremos la retroalimentación. Déjame dibujar nuestros rectángulos. Da click en este rectángulo y dibuja aquí un rectángulo. Tal vez esta cantidad. Bien, perfecto. Entonces, ante todo, lo que voy a hacer, voy a quitar esta frontera de aquí. No necesitamos tener ninguna frontera. Y ahora necesitamos obtener color de fondo stop. Podemos añadir, puedes agregar un color personalizado. O si queremos, también podemos sumar aquí el gradiente. Ahora podemos simplemente intro, simplemente podemos cambiar el gradiente. Ahora si lo ejecuto, deberíamos poder ver descenso. Entonces este es nuestro país, la aplicación que estamos diseñando, nuestra Hasta tenemos estas herramientas y luego retroalimentación, y luego tenemos esta opción aquí. Aquí. Agregaremos nuestros comentarios. Creo que no necesitamos tener tanta altura. Simplemente podemos quitar esto, esconderlo un poco más. Esta cantidad. arreglaremos, no hay problema en absoluto. Y ahora qué puedo hacer desde aquí? Trataré de agregar este feedback. Para eso voy a sumar o puedo añadir esta cantidad. Y luego otro es de aquí. Podemos sumar estos dos de aquí a aquí. Puedo dibujar éste. No puedo de este set, puedo tomar éste porque necesitamos tenerlo un poco más grande tamaño. Podemos llevarla aquí, y estamos tomando nuestra columna cinco aquí, 12345, y aquí vamos a tomar cinco, ¿de acuerdo? Entonces vamos a tomar de tres a cinco, vale, así que podemos tomar lo hizo aquí. Por lo que tomamos en G6. Tomaremos un poco en medio de éste, y otro está en medio de éste. Entonces podemos cavar el hoyo desde este lado derecho. De acuerdo, entonces ahora podemos ajustar éste para que ahora podamos tomar la altura y un peso. Por lo que la altura es 401 y la altura es 381, por lo que debe ser 401401. Y el corazón, por qué estos siete doble tiro y 51755. Por lo que debe ser siete W5. Debería estar aquí. Perfecto. Ahora, ¿qué vamos a hacer aquí? Tenemos que hacerlo un poco. Podemos sumar primero la frontera. Por lo que primero añada border-radio 20, y lo mismo va para éste también. Por lo que agrega radio fronterizo 20. Aquí. Primero editaremos texto en la parte inferior, agregaremos, agregaremos nuestros correos electrónicos, se agregará una foto de perfil, después el nombre de la persona que ha dado la retroalimentación. En primer lugar, estoy comiendo, no necesito tener este diseño en este momento, así que voy a quitar éste. ¿ Qué puedo hacer ahora? Ahora puedo hacer click en la herramienta Texto y ahora puedo dibujar opción de texto para que podamos agregar texto aquí. Podemos pegar algún texto aquí. Y voy a copiar algún post forum a Loren Ipsum. Algún puesto ficticio. El Simón lo siento. Puedo copiar éste. No lo sé. Y ahora está funcionando, así que voy a copiar éste, hacer clic derecho copia aquí. Y entonces simplemente puedo pegarlo aquí. Y vamos a ver. De acuerdo, así que eso es el tamaño de la granja es de 50. Esa es la razón. Entonces lo voy a hacer de nuevo. Ahora. Deberían ser 20 aquí y no 20 exactamente. Tal vez 25. A lo mejor 25 es bueno. Y puedo agregarlo de esta manera, en el centro o en el lado izquierdo? O es simplemente quitar el espacio como mirar éste, esto va a apuntar esto y esta va a ser el área del texto, texto sin formato y área toma esta cosa. Podemos mantenerlo en el medio. Se puede ver text-align centro. Y podemos cambiar cosas en distal a ésta que usamos para nuestra en ésta, podemos usar esta aquí. Y después de eso por aquí, tendremos que agregar esta cosa. Lo que vamos a tener que hacer esto por aquí, quiero agregar nuestra foto de perfil y luego el nombre para eso. Podemos tomar ayuda de esta herramienta elipse. Entonces voy a dibujar aquí esta elipse herramientas para arrastrarla aquí y necesitamos arreglar el blanco endurecido, tal vez 95 por 95. No sabía lo que debería ser igual para que podamos ver si círculo. Y de nuevo es bastante pico 9895. Por lo que podemos revisar por 85 por 8575 por 7575, por 7575 por 75. Y aquí, justo arriba en eso, voy a quitar esta frontera rápidamente aquí. No debería quitar la frontera de nosotros porque no tenemos nada en ella. Entonces, ¿qué puedo hacer? Simplemente puedo agregar una foto de perfil aquí, así que tengo alguna foto ficticia. Simplemente puedo dejarlo aquí. Ahora se ha ajustado. Ahora no quito la frontera más bien quiero sumar aquí nuestro tamaño de agua, tal vez cinco. Y entonces voy a cambiar el color del borde para que pueda verlo de esta manera. O creo que se verá bien en un color blanco que podamos tomar y luego podemos agregar nuestro texto aquí, y el texto va a estar aquí. Y podemos guardar el nombre de la parcela, tal vez sólo por un ejemplo, John Doe. ¿ Necesitamos ajustar este texto aquí? Podemos aumentar el tamaño del texto a 35 para que pueda ser visible fácilmente. Y déjame revisarlo como se ve. Ahora, tenemos esta opción aquí, proyecto degli, habilidades y herramientas. Y esta es la retroalimentación que estamos mostrando aquí. Y se ve bien. Pero aquí quería agregar nuestro ícono aquí. Para ello, podemos agregar, podemos tomar salud de nuestra, de nuestro plugin de iconos que tenemos instalado. Lo tenemos, ya lo tengo. Puedo decir ese ícono hacia adelante. Veamos qué puedo ver? Se puede ver todo si empate hacia adelante, entonces puedo ver este tipo de ícono que se está mostrando aquí. Ahora voy a seleccionar éste. Omega, tiene API aquí. No lo sé. No sé por qué. Tenemos que hacer seleccionar este 1 primero. Así que déjame volver otra vez. Entonces estamos trabajando aquí. Entonces primero, permítanme seleccionar esto primero. Y luego voy a seleccionar éste. Ahora tiene un periodo aquí, aún, aún mejor que el anterior. Ahora podemos seleccionar, no podemos sostener éste. Ok. Entonces tenemos que sostener éste. Entonces no es lo siento, déjame quitar éste rápido. Después seleccione el texto para que pueda aparecer aquí, y luego haga clic en éste. Esta vez viene aquí. No lo sé. A veces sucedió aquí con ese plugin de íconos, por lo que necesitamos arreglarlo. Voy a hacer clic en éste y luego voy a arrastrarlo aquí. No, no podemos arrastrarlo aquí. Tenemos que tomarlo aquí de lo siento, no está funcionando. Y de esta manera tal vez otro ícono. Podemos seleccionar el icono de flecha de carne. De acuerdo, por lo que tiene un periodo aquí. Permítanme arrastrar éste. De acuerdo, así que ahora puedo sostener éste y dejarme sea componente primero para que podamos usarlo desde ahí. Vale, eso es lindo. Ahora, no necesitamos tener podemos pensar que podemos. No podemos quitar éste, pero sí podemos. A partir de aquí, puedo quitar éste. Pero está dentro de nuestros componentes, por lo que simplemente podemos usar éste. Ahora, aquí puedo arrastrar estos componentes y luego puedo pegarlo aquí. Entonces este es nuestro componente y aquí puedo pegarlo. Aquí vamos. Entonces tenemos este ícono aquí. Y aquí vamos. Para el ícono, puedo volver a aumentar el blanco en 4545, puedo sumar 35. Entonces si voy a aumentar la enfermedad y se va a quedar muy mal, vale, Ahora se ve bastante bien. Creo que no necesitamos tener en éste de esta manera porque vamos a sumar un par de artículos más aquí para que podamos tener nuestra horizontal se llama Ver. Así que voy a quitar este de aquí. Y en la siguiente parte vamos a añadir más ítems aquí y luego agregaremos el horizontal es cómputo. Por lo que voy a detener este video aquí mismo y seguiremos con la próxima conferencia. Nos vemos en la próxima conferencia. Adiós. 12. Tarjeta de comentarios y vista horizontales: Bienvenido de nuevo una vez más. En esta parte, terminaremos nuestra sección de comentarios. Entonces, ante todo, necesitamos duplicar éste para que podamos sumar un par de más. Y luego podemos sumar nuestros scroll horizontales pocos. Para ello, ante todo, tenemos que hacer, convertirlo en un grupo. Por lo que tenemos esta opción aquí, por lo que necesitamos hacer click en esta de esta ONG primero. Entonces aquí tenemos este rectángulo ocho, y luego tenemos este texto. Entonces tenemos estas células grandes. Entonces tenemos a John Doe en este ícono. Significa que de aquí al rectángulo ocho, todos estos en nuestro carrito. Así que voy a presionar Control y luego voy a seleccionar todos estos. Y aquí vamos. Ahora puedo hacer que sea un grupo. Entonces Comando Z y yo podemos cambiar el nombre del grupo sólo para entender. Por lo que podemos decir, podemos decir, voy a retroceder carro y ahora pegue Enter. Ahora puedo hacer click en esta rejilla de repetición. Por lo que da click en esta rejilla de repetición. Ahora podemos hacer que sea un duplicado. Se puede ver que podemos hacer que se duplique. Lo primero y más importante, quería tener un poco de espacio entre estas dos cosas o podemos agarrar. De acuerdo, así que primero simplemente no quiero que lo haga. Entonces la cosa se detiene en sin un desplazamiento. Simplemente no quiero que se muestre para ganar es que no lo llamo. Les mostraremos dónde parar el auto. Entonces tal vez tengamos para retroalimentación, ahora podemos llamarlo, ahora podemos duplicarlo al inicio de la mesa de trabajo de dominio. Se puede ver éste. Tenemos éste aquí, así que tenemos 1234. Ahora. Aquí puedes ver estos son los dos iconos. Uno es para la vista de desplazamiento horizontal, uno es para la vista de desplazamiento vertical. Entonces para esto, necesitamos tener un pergamino horizontal. Horizontalmente scopy significa en la forma horizontal. Ahora si hago clic en éste, se va a ajustar con el tamaño de la mesa de trabajo del dominio. Y ahora podremos ver este ícono tiene API. Entonces este es el ícono que es, eso es por lo que lo hemos seleccionado para vista de desplazamiento horizontal y un NTD mostrando que de esto a esto, se va a quedar aquí. Y después de eso, se va a mostrar desplazamiento. Así que permítanme correr este. Ahora. Si lo ejecuto, ahora si me desplazo hacia abajo, deberíamos poder ver nuestros comentarios aquí. Por lo que tenemos esta sección de comentarios por aquí y ahora, así que aquí está. Aún es, se puede ver un poquito de ella. Ahora, ¿qué puedo hacer? Simplemente puedo desplazarlo de esta manera. No hay problema en absoluto. Y otra cosa es que necesitamos arreglarlo aquí. Entonces si estamos en la página de inicio, entonces tenemos esta opción aquí. Se puede ver éste, tenemos que quitar esto y podemos ver que sigue siendo un poquito de cada plata podemos hacer simplemente podemos quitarla. Creo que estos o podemos quitarlo. O simplemente podemos aumentar el déjame ver si se ha resuelto ahora. Aún es, podemos ver éste. De acuerdo, entonces primero necesito desseleccionar esta vista de desplazamiento porque es para este espacio, no para la escolaridad. Por lo que necesitamos agregar un poco más de espacio. Y luego podemos seleccionar esta vista de desplazamiento. Ahora si lo ejecuto, deberíamos poder ver éste por aquí. Podemos ver ahora lo podemos ver desde este lado. Por lo que otra cosa se nota aquí. A lo mejor para esto, ahora podemos desplazarlo para que se vea bastante bien. Y ahora podemos sumar más cosa aquí. Déjame comprobar si hemos comprado un no, no tenemos motor aquí. Por aquí. Necesitamos agregar un icono para que el usuario pueda entender eso. Y del lado derecho tenemos pocas cosas más que hacer. Entonces, ¿qué puedo hacer? Simplemente puedo llevarme a casa salud de estas herramientas de elipse. Y en el medio, simplemente puedo añadir un círculo aquí. Y debe ser del mismo tamaño para que 55 por 55. Aquí va. Y ahora en éste tenemos este ícono. Puedes hacer clic en este ícono de iOS. Entonces podemos simplemente ponerlo en el centro. Puedo ponerlo en el centro. este momento, se ve bastante bien, pero podemos hacerles un grupo para que podamos hacerlo duplicar y hacerlo de nuevo, hacerlo de nuevo en esta elipse y esta flecha. Voy a presionar Control y luego podemos hacerles un grupo primero y después podemos duplicarlo comando D. Y aquí tienes. No podemos, pero necesitamos tener un ícono diferente para éste, pero podemos mantener el pero déjame ajustar la pierna de altura en la misma línea. De acuerdo, Así que ahora está en la misma luz, está en la misma línea. Está en la misma línea, creo. Perfecto, pero vamos a cambiar el ícono de éste, por lo que no necesitamos tener este ícono aquí para eso. ¿ Qué podemos hacer? Podemos quitar este ícono desde aquí. Vamos a eliminar este ícono desde aquí. Pero no está funcionando. Lo siento, necesitamos sólo tenemos que quitar el ícono. Ahora se ha eliminado. Así que selecciona el ícono y presiona Eliminar. Entonces tenemos que agregar a otro ícono para el lado izquierdo de nuevo. Entonces, en lugar de avanzar, podemos sumar, podemos empezar ahí hacia atrás. Podemos decir que B es buscar hacia atrás, y tenemos este par de íconos aquí. Pero deberíamos tomar el mismo ícono que cogimos. Por suerte tenemos este aquí. Puedo seleccionar éste aquí, y luego puedo dejarlo ahí. Y luego otra vez, de nuevo, el mismo problema. Entonces este es el ícono. Déjame quitarlo rápido y luego seleccionar éste. Y de nuevo agrega este aquí. Voy a hacer que sea un componente para que podamos acceder fácilmente a éste. Ahora puedo arrastrar este ícono por aquí. No necesitamos tener éste desde ahí, pero simplemente podemos arrastrar este ícono aquí. Y no está en el centro. Entonces primero permítanme quitar éste. Voy a quitar este ícono primero y luego podemos simplemente arrastrar éste en el centro. Perfecto, ahora déjame ejecutarlo, cómo se ve. Deberíamos poder ver este pequeño ícono. Ahora, si me desplaza hacia abajo, entonces simplemente podemos ver esta retroalimentación y así es como se ve. Y tiene esta opción ahora podemos simplemente desplazarla de esta manera. Entonces todo está bien aquí, no hay problema en absoluto. Y luego a la siguiente parte vamos a sumar nuestra, lo que voy a añadir. Por lo que ahora vamos a añadir, simplemente agregaremos aquí un formulario de contacto. Voy a detener este video aquí mismo, y seguiremos con el siguiente video. Y antes de eso, creo que no está en el centro. Está en el centro editar ajustado con éste. El caso es que todavía podemos, está bien, así que podemos añadir éste aquí y luego podemos simplemente, simplemente podemos arrastrar éste al centro. Dice que muestra que es interés dentro del centro, pero todavía podemos, este ícono no es un no puede simplemente seleccionar este ícono. Ahora. Ahora parece que está en el centro, pero tiene que ser movido de esta manera. Podemos mantenerlo de esta manera, pero lo que pasa es que podemos añadir nuestra caja. Podemos añadir una sombra aquí. Podemos añadir una sombra para éste. Podemos tal vez podamos sumar diez por diez para éste. Y para éste también podemos sumar, sí selecciona automáticamente la sombra porque nosotros, de nuevo, todo no está aquí, lo que podemos sumar diez por diez. A las diez por diez. Aquí vamos. Muy bien, tan perfecto. Cómo voy a detener este video aquí mismo y seguiremos con desde la próxima conferencia. 13. Campo de entrada y botón: Bienvenido de nuevo una vez más. En esta parte, diseñaremos nuestro formulario de contacto. Para hacerlo rápido, necesitamos aumentar el tamaño, aumentar los optimistas de altura del tablero de arte principal, y luego así sucesivamente. Que para el formulario de contacto, no quiero agregar ningún color de fondo. Usaremos este tipo de color de fondo tan rápido. Tenemos que dejarme oportunidad. Ellos diseñarán pocos primero y luego podemos tomar el, podemos tomar el componente de texto que teníamos antes aquí. Se puede ver que esta es la ventaja de hacer componente de salida si vas a duplicar lo mismo una y otra vez. Entonces en lugar de Educación, ahora, voy a escribir aquí contacto. Ahora tenemos que ajustarnos en esta línea aquí. Ahora conducta y herramientas feedback Deck execute, todo está bien. Y ahora después de eso necesitamos agregar aquí un rectángulo. El caso es que puedo añadir éste desde aquí, de esto a esto. Creo que hemos añadido lo mismo. Creo que lo hemos añadido lo mismo para todos estos. Porque tenemos dos columnas, una columna de izquierda y una columna del lado derecho. Ahora primero voy a sumar nuestro moderno radio 26, y podemos añadir una sombra aquí. Entonces agrega sombra por 30, por 30, y podemos quitar el tamaño del borde. No necesitamos tener el tamaño de la frontera aquí. Y ahora por aquí, tendremos que agregar tres campos de entrada. Es para nombre, uno es para correo electrónico, y uno es para cuadro de mensaje. Para que podamos empezar desde aquí. Voy a dibujar este rectángulo primero. Voy a dibujarlo aquí. Aquí. No necesitamos tener esta cantidad de espacio para este cuadro de texto. Podemos agregarlo de esta manera. Entonces podemos sumar solo éste desde aquí, creo, desde el final de éste a esta columna. De acuerdo, entonces ahora tenemos que añadir un poco de radio de agua aquí. Entonces en D, y luego dentro de éste podemos editar texto. Podemos decir, podemos decir nombre, entonces podemos agregar doble punto. Pero el tamaño de la granja no debe ser así. Deberían ser 20, un poco más grande, tal vez 25. Entonces podemos cambiar la fuente, familia de fuentes. Podemos añadir cualquier otro lo que queramos tener. Tal vez esto o esto. Déjame ver cómo se ve. Entonces podemos añadirlo aquí. Feedback. Después de esta retroalimentación, tenemos este contrato, vale, Así que los tamaños poco demasiado vaso de precipitados, me refiero al tamaño del campo de entrada. Para que podamos, podemos cambiar, podemos cambiar la altura de éste. Tenemos que hacer click primero en la herramienta Seleccionar para que podamos seleccionarla. Y entonces podemos simplemente minimizar la altura, tal vez 70. Entonces necesitamos ajustar el texto en el centro. Está en el centro. Ahora podemos hacer que sea un grupo y luego podemos duplicarlo primero. Entonces la cosa es que necesitamos hacer click aquí y luego necesitamos hacer click en el nombre y el rectángulo que tenemos aquí. Entonces este nombre y este rectángulo y luego lo convierten en un grupo. Entonces presiona Comando D y voy a cambiar el nombre del grupo2. Podemos decir campo de entrada. Y entonces puedo tomar ayuda de lo estúpido, genial, y simplemente puedo duplicarlo silicio agregar un T1 es por correo electrónico, uno es para el número de teléfono. Y puedo tomar algo de espacio entre éste. Y luego voy a hacer click en esta rejilla de desagrupación. Entonces podemos cambiar el nombre. Entonces el segundo va a ser correo electrónico. Podemos añadir correo electrónico aquí, añadir t dot. Y luego para el último podemos sumar número de teléfono. Se puede añadir por número. Ahora. Entonces de aquí a aquí, necesitamos tener un adulto o caja de entrada para nuestra opción de mensaje. Podemos volver a tomar ayuda de este rectángulo y de aquí o tal vez desde lo medial. Lo ajustaremos más adelante. No hay problema. Entonces primero voy a dibujar éste de esta manera. Creo que desde aquí podemos tomarlo o podemos, creo que esta cantidad está bien. Y ahora podemos simplemente añadir un radio fronterizo a 20. Déjame ver cómo se ve, pero podemos verlo de esta manera, pero es la altura y el peso no se ajusta. Creo que lo es. Ok. Lo es. Ok. Está bien, perfecto. Ahora tenemos que agregar nuestro texto aquí. Permítanme alrededor de éste para que podamos verlo. Aquí tienes. Por lo que tenemos este formulario de contacto aquí. Pero lo que pasa es que tenemos un espacio muy grande de aquí a aquí para que podamos arreglarlo. Otra cosa es que aquí escribiremos texto y luego aquí podremos añadir un botón. Para hacerlo. Podemos tener. Entonces primero permítanme añadir aquí el texto. Voy a añadir el texto en el centro, y voy a decir tus mensajes. Podemos añadir este aquí y asegurarnos de que sean incentivos. Entonces, ¿cómo lo vas a definir en centro, puedes ver que nos va a dar nuestra línea. Podemos simplemente está en el centro, pero debe estar en el lado izquierdo. Perfecto. No, no está aquí en esto. Ahora después de eso, podemos tener esta opción de rectángulo inferior. Da click en este rectángulo y luego podemos simplemente, ¿qué podemos hacer? Podemos irnos, podemos tomar estas cuatro columnas para crear nuestro fondo. Me refiero a estas cuatro columnas y luego medial. Y después podemos salir para, podemos salir para formar lado izquierdo y dos de lado derecho. Podemos sumar un poco de esta n Para éste, creo que podemos sumar nuestro diseño único para éste. Veamos. Podemos agregar un tipo diferente de diferentes tipos de frontera para diferentes rincones. Entonces digamos la Parte D para éste, luego por éste, y luego 64 éste, y luego 55 por éste. De acuerdo, así que si hago clic aquí, creo que deberíamos ver a nuestras masas aquí. Puedo ver radio de esquina superior izquierda. radio de la esquina superior izquierda es tardy. Hagámoslo 60. Hagámoslo 80. Éste lo hace 2520. Ahora, éste hace 80 porque cada celda, esquina inferior derecha escribiendo, creo que es de abajo a la derecha. Déjame tomarlo. No se muestra ahora. Debe mostrarnos. Se puede ver el radio de esquina inferior derecha. Eso significa que éste, debe ser del mismo tamaño. Ahora podemos ajustar éste. Lucky solucionador, digamos nuevo diseño, sólo para mostrarte cómo puedes usar un tipo diferente de esquina si necesitas usar? Y creo que ahora no necesitamos tener estas vistas en capas. Podemos eliminar esta vista de diseño ahora. Entonces podemos agregar solo el color. Creo que podemos usar este color, me gusta este color, así que voy a hacer clic en este color y luego podemos simplemente añadir este color aquí para que podamos usarlo. Ahora haga clic en este botón, y luego haga clic aquí y luego haga clic en este color. Aquí vamos. Tenemos este color. Aquí. Todavía, podemos añadir un poco de gradiente más lineal. Simplemente podemos ajustar éste de esta manera. Podemos añadir un texto y un icono aquí para agregar un texto aquí voy a hacer click sobre él. Podemos decir centavo, y luego aquí llamaríamos, y luego podemos añadir un ícono. Y tienes estos íconos aquí. Tenemos que sumar. Podemos añadir nuestro icono aquí, podemos decir icono de Sant. Entonces podemos conseguir éste aquí. Donde tenemos de nuevo, lo tenemos en la parte superior para que podamos arrastrarlo aquí. Y luego voy a hacer componentes de TI para que podamos usarlo fácilmente, hacer un componente. Y luego lo voy a mover de aquí. Y entonces podemos usarlo desde aquí. Voy a desplazarse hacia abajo. Y por aquí tenemos éste aquí. Podemos tener éste. Para que pueda arrastrar éste. Aquí vamos. Podemos sumar justo en éste aquí. De acuerdo, entonces ahora se ve bastante bien, pero lo que pasa es que no se está mostrando en el centro, no en el fondo. Deberíamos ajustar esto, éste. Creo que podemos hacerlo ahora. Se ve bien. Ahora está bien. Por lo que ahora si lo ejecuto, deberíamos poder ver nuestro formulario de contacto. Ahora. Podemos desplazarse hasta aquí y aquí vamos. Este es nuestro formulario de contacto, así que tenemos el aroma, pero necesitamos cambiar ésta o fuentes, familia de fuentes, no me gusta este para el fondo. Y podemos decir, este es mucho mejor ahora, oh, ¿qué podemos hacer? Podemos simplemente, lo que pasa es que va a cambiar. Todo el asunto va a la oportunidad. Por éste. Voy a presionar deshacer. Entonces voy a, vale, Así que también ha cambiado, así que podemos sumar de nuevo aquí. Entonces la cosa es que aunque tenemos esta opción aquí, así que este es el botón rectángulo. Entonces tenemos estos, todos estos campo de entrada. Podemos copiar todos estos. Haga clic y copie todos estos y luego conviértelos un grupo. Una vez. Si el grupo, entonces podemos verlo por completo. Y sólo éste. Y acabo de hacer contrato que hemos usado del mismo tamaño aquí. Por lo que voy a mostrar, voy a añadir la integral de vista de esta vista de diseño. Ahora podemos ver que es perfecto. Es sólo eso con esta columna y esta también. Ahora, déjame ejecutarlo de nuevo para que podamos ver la salida final de ésta. Y aquí son iguales. Tenemos este ícono de envío, y este es nuestro formulario de contacto, tan perfecto. Y tenemos este origen a la vista de desplazamiento aquí. Así que voy a detener este video aquí mismo. Y en nuestra próxima parte comenzaremos a trabajar para nuestro auto. Simplemente agregaremos un poco de diseño en el pie de página. Por lo que seguiremos con desde la próxima conferencia. Nos vemos en la próxima conferencia. Adiós. 14. Diseño completo de la sección pie de página: Bienvenido de nuevo una vez más. En esta parte, diseñaremos nuestra sección de pie de página. Entonces para agregar una sección de pie de página, tendremos que dibujarla en el pie de página y la última parte, pero tenemos cada talla más grande, por lo que voy a quitar este tamaño de la mesa de trabajo principal. Creo que esta cantidad de espacio está bien para el pie de página. Ahora voy a dibujar nuestro rectángulo aquí. Simplemente agregaremos un pie de página básico. Antes de eso, creo que podemos. Ahora podemos simplemente dibujar nuestra sección de pie de página aquí. Simplemente agregaremos algún ícono aquí porque no necesitamos tener masa más cosas en nuestro proyecto de cartera. Ahora, ¿qué podemos hacer? Podemos dar click sobre éste, y aquí podemos añadir color de fondo. Podemos sumar nuestro color de fondo, creo que esta luz uno y luego otro , el naranja. Y luego podemos hacer click sobre este gradiente lineal. Podemos redondear este. Muy bien, este de aquí. Entonces aquí solo quería agregar algunos íconos, tal vez pocos ícono de redes sociales, Facebook, instagram o Twitter. Por lo que voy a hacer click en este 1 primero. Antes de eso, permítanme comprobar si tenemos un espacio muy grande en el medio. El residuo va a ser difícil cambiarlo después de eso, el formulario de contacto y éste, está bien. Por lo que vamos a añadir algunos iconos por aquí. Todavía podemos, podemos, simplemente podemos cambiar éste. Podemos ajustar éste. Y además voy a quitar la altura un poco más para ajustarnos con ésta y no necesitamos una cantidad decente de espacio. También puedes disminuir este espacio. Y ahora por agregar un ícono aquí, vale, Así que lo único que podemos hacer es que podamos habilitar la sección de layout para que podamos ver desde donde podemos sumar nuestro alelo. Entonces tenemos éste. A partir de aquí. Estamos trabajando. Podemos hacer una cosa, entonces 34, y luego podemos levantar Aquaphor, y luego tenemos otros cuatro. Entonces a partir de este tercio, podemos dejar caer y de este lado podemos salir para, entonces podemos trabajar en estos dos lados, en estas dos columnas, o tal vez desde una industria columnas, etcétera. Entonces podemos hacer esto. Aquí no es un gran tema. Podemos tomar t y luego podemos tomar tres, y luego tendremos estos cuatro. Desde aquí podemos, en lugar de trabajar, podemos agregar esta opción por aquí. Podemos hacerlo para que podamos movernos rápido. Permítanme mover este alelo o dos. No es necesario tener este diseño aquí. Aquí tenemos que sumar tener el mismo tamaño. Haydn blanco va a ser 80 por 80. Aquí tenemos que agregar el ícono. Para agregar el icono. Voy a agregarlo aquí para agregar un ícono. ¿Qué puedo hacer? Puedo tomar salud de esta herramienta de íconos podemos guardar primer libro. Se puede ver que hay tantos ícono de Facebook. Por lo que podemos hacer clic en uno para éste. Y luego voy, voy a hacer que sea componente. Y entonces voy a quitar éste porque lo copiaremos del componente. Y luego voy a sumar nuestro Instagram. A continuación, haga clic en un icono de Instagram. Voy a hacer que sea componente. Entonces voy a quitarlo de aquí. Y luego tendremos un artículo más. Tendremos un artículo más, tal vez Twitter. Agreguemos de nuevo el ícono de Twitter aquí. Así que voy a hacer que sea componente. Después selecciona éste y quita éste. Tenemos icono C para esta sección de pie de página. Por lo que ahora podemos editar. Ahora voy a abrir este componente aquí, así que tenemos este libro uno, para que pueda soltar este aquí. Puedo ajustarlo en el centro. Está bien, perfecto. Ahora podemos sumar, así que déjame ver. Se ve bastante bien. Hasta que podamos hacerlo, podemos. Sólo para éste, puedo hacer un duplicado Oregon tomar ayuda de esta rejilla de repetición. Obviamente este daño no va a duplicar el ícono de Facebook porque no lo hicimos un grupo, así que solo duplicamos el ciclo. De acuerdo, Así que también puedes aprender de aquí. Y luego voy a desagrupar éste. Entonces puedo añadir estas opciones de Twitter aquí. Entonces puedo ajustarlo en el centro. Este es el centro para éste, creo. Está bien, perfecto. Está en el centro y luego tenemos esta opción de Instagram. Por lo que voy a copiar estos Instagram aquí. Entonces puedo ponerlo. Lo siento. Tenemos que arrastrarlo. Tenemos que arrastrar éste aquí. De acuerdo, entonces la cosa es que me deja dibujarlo de nuevo aquí. Tenemos que hacerlo central. Creo que está en el centro. Aquí todo está bien. Y ahora voy a ejecutar éste y ojalá podamos ver nuestro pie de página correctamente y nuestros comentarios, esta es nuestra sección de contactos y esta es nuestra sección de pie de página, por lo que se ve bastante bueno. Otra cosa es pensar o voy a hacer, lo haré un componente, ese pie de página entero. Voy a hacer que sea un componente porque en nuestra próxima base que vamos a diseñar para nuestra, para nuestra base de detalles de esta sección de proyecto. También necesitaremos este pie de página para que sea mejor sea nuestros componentes para que podamos reutilizarlo. Y T son iguales. Tenemos esto, tenemos este bot. Es, está contando como parte y luego tenemos esto todos los distritos. Entonces tenemos éste y los hacemos nuestro grupo. Entonces podemos hacer componente de TI. puede ver que ahora es un componente. Ahora si voy por aquí, entonces si lo arrastro aquí, entonces se puede ver que tenemos todo esto, todo este equipo. Entonces podemos reutilizarlo en nuestro espacio detallado. Esta es la belleza de convertirlo en un componente. Entonces, ¿qué necesitas hacer? Solo necesitas hacer un grupo, todo lo que quieres hacer un componente, luego simplemente escribe creep, haz clic derecho, y luego puedes convertirlo en un componente. Entonces como ya es un componente, entonces ya puedes decir que estoy viendo ese componente desagrupado porque ya he emitido componente. Una cosa es que una vez que lo hagas componente, podrás ver aquí predeterminado es que los esteadies van a ser tu componente de búho y el icono ha sido cambiado. Se puede ver que esta es la belleza de ésta. Entonces no necesito tener éste aquí porque ya lo tenemos aquí y podemos copiarlo tan inteligente como queramos. Tanto tiempo como queramos copiar. Aquí todo está bien. Voy a detener este video aquí mismo, y continuaremos desde la próxima conferencia. 15. Detalles diseño de la navegación: Bienvenido de nuevo una vez más. En esta parte, comenzaremos a trabajar en nuestra sección de detalles del proyecto. Por lo que cuando o bien haga doble clic en estos detalles de BU, los enviaremos a una nueva mesa de trabajo donde mostraremos los detalles del proyecto. Para hacerlo ante todo, necesitamos crear, necesitamos crear una nueva mesa de trabajo. Por lo que voy a hacer click en este icono del tablero de arte aquí. Ahora en deriva esa esquina, deberíamos poder verlos a todos abajo mesa de trabajo que está disponible dentro de Adobe XD. Alternativamente, también puedes dividir el tablero de clientes donde puedes definir tu propia piel y blanca. Pero para, para mí, voy a esperar este ancho 1920 porque es la web 1920. Voy a hacer click en él. Aquí vamos. Y llamamos a estos nuevos tableros de arte. Así que primero voy a cambiar el nombre de éste. Simplemente puedo decir, ¿Qué puedo decir? Simplemente puedo decir detalles espacio. Para éste puedo seleccionar. Puedo decir, puedo decir pieza principal, puedo decir, o podemos decir homepage. Muy bien, así que ahora por aquí, si miras aquí que podemos ver que tenemos este tipo de calor por aquí con esto Todos estos son Opción de Navegación aquí, pero aquí vamos a sumar nuestros diferente tipo de cosa. Para eso, voy a definir aquí una nueva barra de navegación. Así que simplemente puedo definir una nueva barra de navegación aquí. Aquí tienes. Entonces voy a quitar esta frontera. No necesitamos tener ninguna frontera. ¿ Qué tenemos que hacer? Tenemos que tomar el mismo color que tenemos aquí. Entonces voy a hacerlo, creo que ya tenemos este color. Entonces creo que este es el color que todos tenemos que ya tienes. De acuerdo, entonces este es del mismo color. Ahora, voy a seleccionar estas nueva barra de navegación y dar click en esta paleta de colores. Y entonces voy a seleccionar éste que consigamos el mismo color. Aquí tenemos un texto que va a ser cualquiera. Aquí voy a escribir éste. Podemos decir que forman tal deben ser 50, sólo 11, por lo que necesitamos sumar 50. Permítanme comprobar qué tamaños de fuente hemos utilizado para nuestra Estos son para esta barra de navegación. Creo que no son 50 es quizá tardy o algo empezó. Entonces lo voy a dar todo tardy aquí y luego podemos ponerlo en el centro. Para esto, por todo este, hemos usado 25. De acuerdo, entonces necesitaremos todos estos. ¿ Qué puedo hacer? Voy a añadir, voy a morir algunos nombres más aquí. Por lo que simplemente podemos decir toma de nivel y luego podemos sumar. Vamos a empezar de nuevo aquí. Podemos decir, necesitamos cambiar el tamaño de la fuente a 25. Aquí vamos. Entonces podemos simplemente podemos, este es el centro. Se puede ver que Veintisiete, Veintisiete. Y luego podemos hacer click en esta rejilla de repetición. Y aquí podemos sumar. Tenemos este par de opciones aquí. No hago mucho más. Sólo tenemos pocos. Sólo tenemos dos a seis, por lo que sólo tenemos seis opciones aquí. ¿ Qué puedo hacer aquí? Podemos hacer un poco de espacio aquí. Entonces podemos quitar pocos de estos. Necesitamos tener tres, tal vez t Entonces voy a hacer click en el Desagrupar. Y entonces el segundo va a ser la educación. Podemos decir educación. Y entonces podemos decir, entonces tenemos este proyecto offshore y podemos decir proyecto. Y luego para éste podemos decir habilidades. Vamos a decir las habilidades, habilidades de Debbie y luego tenemos herramientas y luego realizamos herramientas. Y después tenemos contacto. Necesitamos agregar contacto. Estos son los elementos de navegación que tenemos, pero necesitamos tenerlo en el mismo espacio. Para que podamos tomar espacio de esta manera, podemos, ahora podemos arrastrarlo y luego podemos tomarlo de esta manera. Podemos, tenemos 59, tenemos este 59. Se puede ver el primero y el segundo se supone 59, y luego éste va a sumar, podemos arrastrarlo a 59. Para éste todavía podemos sumar 59. Y luego para éste todavía podemos sumar 59. Y está en la misma línea. Y tendremos que añadir aquí un platillo más. Otra cosa es que tendremos dos genes de ese color, pero lo haremos pero antes de eso. De acuerdo, así que ahora si voy aquí y luego simplemente puedo seleccionar todos los artículos que hemos creado. Así que selecciona todo el artículo, selecciona todo el artículo aquí. Y entonces simplemente puedo cambiar el color a blanco. Se puede ver que el color se ha cambiado a blanco, pero no debería ser este color blanco. Perfecto. Ahora, solo tenemos que agregar un subrayado aquí y hacer clic en esto en la herramienta Mezcla, la herramienta de línea aquí. Y luego podemos cambiar el tamaño de la herramienta de línea. Tal vez. Tenemos que ajustarlo en el centro. Tenemos que ajustarlo en el centro, el centro de este texto. Y luego podemos aumentar el tamaño de éste y simplemente cambiar el color del borde para agregar aquí un color diferente. Está bien, perfecto. Por lo que hemos diseñado nuestro nuevo espacio digital y barra de riego. Y ahora cuando haga clic en este espacio de detalle donde los enviará aquí. Pero lo que pasa es que nosotros en nuestros detalles pares, lo que tenemos en nuestros detalles pares que tenemos, déjame ver lo que tenemos. Por lo que tenemos emus y tenemos descripción detallada y vamos a añadir algunas cosas más. Entonces los correos que vamos a mostrar encima de éste, así que te pierdes, voy a sumar las unidades para toda esta área. Entonces voy a arrastrar a un emus de ahí. Puedo decir esta MS aquí. Dónde está DC Ms. Okay, Así que no está aquí. Haz una cosa que podamos simplemente, pues, podemos simplemente hacer nuestro rectángulo y este rectángulo, simplemente podemos poner estos correos electrónicos y esta es la mejor manera para que los e-mails puedan ajustar automáticamente y simplemente podemos arrastrarlo aquí. Se puede ver la imagen se ha ajustado con ésta. Y simplemente podemos ajustar con éste. Creo que podemos tener un poco de espacio. Voy a quitar este borde de esta imagen. No necesitamos tener ninguna frontera. Ahora si selecciono esta pieza y si la ejecuto, entonces sólo podremos ver este espacio. Si lo ejecuto, entonces deberíamos ver nuestro espacio detallado aquí. Podemos ver que esta es nuestra imagen, por lo que esta es nuestra propia barra de navegación. Todo se ve bien. Ahora, ¿qué podemos hacer? ¿ Aquí? Habrá que sumar el título y las características y la descripción y el futuro de éste. Resuelve para eso. Ante todo, ¿qué puedo hacer? Puedo habilitar la vista de diseño para que podamos, lo que podemos ver la columna, número de columna. Voy a hacer doble clic en él y luego haga clic en este diseño. Ahora tenemos desorción. Entonces a partir de aquí, me encantaría agregar una nueva mesa de trabajo con la vista de la tarjeta para que podamos agregar nuestro título y una descripción. Entonces tendremos nuestra característica y la tecnología utilizada. Voy a hacer click en este tablero de arte, en este no tablero de arte en esta herramienta de rectángulo. Y a partir de aquí, desde aquí puedo añadir, podemos dibujar nuestro nuevo rectángulo. Podemos dibujar nuestro rectángulo aquí. Y por aquí. Primero voy a añadir un poco de ideas de agua para que no necesitamos tener ningún OK, OK. Podemos añadir una sombra primero para agregar sombra 20 por 20. Ahora quita la frontera. Aquí podemos añadir nuestro título y luego podemos añadir nuestra descripción para editar título. Simplemente podemos empezar a agregar título desde aquí. Entonces podemos. Pero tenemos que cambiarlo para bloquear el texto. Considerando que el texto. En primer lugar, permítanme seleccionar éste antes. Creo que no necesitamos tener esta vista de diseño ahora, simplemente podemos quitar esta y luego podemos agregarla. Entonces la cosa es que el fondo es blanco y hay una razón por la que no podemos ver esta forma aquí. Entonces aquí en nuestra página de inicio, utilizamos dos antecedentes diferentes para este diseño. Entonces el color está en este color, así que voy a lograrlo, voy a decir aquí este color, y luego voy a venir aquí por éste, por la esfera digital. Entonces voy a seleccionar éste. Ahora podemos ver, podemos ver, podemos ver éste aquí. Por lo que aquí vamos a sumar nuestro título. Entonces quizá desde aquí podamos agregar un título y una descripción de esto. Entonces primero déjame cambiar el color a negro. Entonces tenemos que cambiarlo a negro. Haga clic en esta paleta de colores. No seleccionado. Ahora, podemos cambiar el color a negro. De acuerdo, para que podamos agregar nuestro título aquí. Voy a hacer MOOC éste y voy a copiar algunas garrapatas fictitas de Loren Ipsum. Simplemente podemos copiar pocos textos desde aquí. Voy a copiar de aquí a aquí. Voy a copiar éste. Y voy a abrir este Adobe XD. Y estas son las herramientas de texto. Y voy a pegarlo aquí. Entonces podemos, podemos añadir el tamaño de fuente de este ordenado poco más grande. Necesidad más rápida de seleccionar el formado para el texto y agregó ese tamaño del formulario. Y luego voy a quitar pocos textos porque no necesitamos tener mucho texto aquí. Puedo hacer mover algunos textos aquí. Está bien, perfecto. Por lo que ahora esto va a poder titularlo, y luego podemos añadir font-style para este título. Podemos decir, podemos usar este color, podemos usar este. Y ahora vamos a tener nuestra breve descripción de este proyecto. Para ello, voy a volver a click en esta herramienta de texto y luego necesitamos dibujar área para mostrar nuestros detalles post aquí. Para que puedan ver que simplemente podemos hacerlo de aquí a aquí. Aquí vamos. Perfecto. Ahora aquí vamos a utilizar nuestra, añadiríamos nuestra descripción. Agregaremos nuestra descripción. Entonces podemos simplemente pegarlo aquí. Voy a cambiar el tamaño del formulario aquí. No necesitamos tener 35 y podemos cambiarlo a 25. Hay ocho, y este es nuestro título y descripción n Ahora podemos ajustar éste haciendo clic aquí. Está tan ajustado ahora por lo que simplemente podemos disminuir el tamaño de éste. Ahora si ejecuto éste y podemos tener estos detalles descripción y en la siguiente parte vamos a añadir un par de características más como tick use tecnología. Podemos usar característica y tecnología usada y luego más publicaciones por aquí. Pero lo haremos en la siguiente parte. Y voy a detener este video aquí mismo. Seguiremos leyendo de la próxima conferencia. 16. Detalles diseño de caracteres de la página: Bienvenido de nuevo una vez más. En esta parte, seguiremos trabajando en nuestro espacio detallado. Por lo que este ya está disperso tablero de arte, por lo que hemos editado nuestro título y descripción y ahora aquí podemos sumar nuestro nuevo campo para nuestra característica de este proyecto. Entonces por agregar esta característica, lo que voy a hacer primero, voy a habilitar esta vista de diseño para que podamos ver la columna de aquí a aquí, vamos a agregar otro, otro rectángulo donde sumará todas las características. Así que vamos a entrar aquí un nuevo rectángulo y va a ser un poco más grande porque vamos a añadir un par de opciones más aquí. Para la sección feto. Aquí vas, podemos añadir el radio de agua 20 y luego sumar nuestra sombra. Sombra va a ser 20 2020 y otros 20 de aquí. Ahora, podemos hacer, ahora podemos quitar esto. Podemos quitar esta vista desde aquí. Podemos quitar esta vista de diseño, y tampoco necesitamos tener este motor aquí. Se ve perfecto. Ahora podemos agregar un título aquí primero, así que da click en las apuestas. Y se puede ver que exactamente en la misma posición podemos escribir. Aquí se necesita, podemos decir característica, característica de este proyecto. A lo mejor podemos cambiar el tamaño de la fuente a 45. Aquí vamos, perfecto. Ahora podemos sumar nuestro menos. Podemos sumar al menos aquí. Podemos simplemente dibujar nuestro círculo aquí de este cereal desde la misma línea. O un pequeño círculo va a ser un punto. Y podemos sumar 15 por 15, tal vez 15 por 15. Y entonces podemos, puedes arrastrarlo aquí. Y luego podemos cambiar el color a negro para este punto. Este es el punto de bala. Y aquí vamos a sumar el título. Voy a hacer click en la herramienta palos y voy a añadir texto aquí. A lo mejor voy a copiar éste. Voy a presionar Comando, Control C. Veamos si podemos copiarlo desde aquí. Y luego podemos pegarlo aquí. Aquí vamos. Podemos copiar éste, pero necesitamos cambiar de estilo. Tenemos que azar estilo, tamaño de fuente porque está despegando 45. Pero éste es, creo que 25 o 35 es 35. Creo que no son apenas cinco. Son 35. De acuerdo, pero agreguemos 25. Podemos sumar 25 y tenemos esta opción aquí. No sé mucho más sobre este elemento de datos en particular. En ese caso, podemos ver creo que hemos copiado la descripción, no el título uno. Esa es la razón por la que está mostrando toda la zona. Así que sólo voy a copiar este. Mejor. Puedo hacer que sea componente para que pueda que pueda oírlo es que este texto y haga clic derecho sobre él. Y entonces podemos hacerla sabia componente. El botón no está funcionando. Ahora podemos convertirlo en un componente, y se ha convertido en componente e icono se ha cambiado. Ahora puedo hacer click en éste y luego simplemente puedo arrastrar este componente aquí. Ya puedes ver que puedo ajustar éste de aquí a aquí. Está bien, perfecto. Ahora, ¿qué puedo hacer? Simplemente puedo hacer un grupo o este punto y estos son componentes para que podamos duplicarlo. Entonces esta elipse y este componente va a ser un grupo. Podemos decir comando G, presionar Comando D, y luego podemos nombrar al grupo. Podemos decir, ¿podemos ahorrar, podemos decir característica. Se puede decir características. Ahí está bien. Ahora da click en este botón de rejilla lipídica, y aquí vamos. Tenemos este par de opciones. Podemos hacerlo, podemos duplicarlo unos tipos más y luego podemos sumar cofre y éste. Ahora si lo ejecuto, deberíamos poder ver nuestras características. Y aquí vamos. Tenemos esta opción de característica, por lo que hemos acabado con éxito esta característica de SHA-1. Y este es nuestro título y descripción, y esta es nuestra opción de característica. Estamos mostrando nuestra imagen aquí. ¿ Y qué puedo hacer? Creo que podemos sumar, podemos añadir nuestro título aquí y la descripción aquí para conseguir más ideas. Entonces voy a añadir un título y descripción encima de éste. Por lo que voy a hacer click en esta herramienta de texto y luego agregarle un título aquí. Podemos decir título. Se puede decir título. Muy bien, ahora voy a añadir sólo éste un poquito aquí. Y entonces éste un poco hecho. Ahora, necesitamos agregar otro texto para la descripción. Podemos decir una descripción. Lo siento. Entonces podemos añadir bajo script mostrado en aquí igual. Tenemos esta opción de descripción también. Está bien, perfecto. Para que podamos cambiar el tamaño de fuente de este título y descripción al igual que la opción de función que usamos. Así que voy a seleccionar este 1245. De acuerdo, entonces tenemos que ajustar éste porque está tomando mucho espacio. Entonces voy a arrastrarlo hacia abajo y luego arrastrarlo hacia abajo y apuntar hacia abajo, cargar el título uno. Tenemos que arrastrarlo un poco y podemos ajustarlo ahora. Para la descripción, de nuevo, va a ser 45. Y aquí vamos. Ahora tenemos esta descripción y título, descripción y el futuro no si corro éste, deberíamos poder ver nuestro título o descripción y nuestras características. Y me encantaría añadir algunas cosas más en nuestro espacio detallado. Por ejemplo, definitivamente lo haré, tendremos que añadir un pie que ya tenemos en nuestro componente. Pero además de eso, voy a sumar nuestros otros proyectos en otro proyecto portuario una manera diferente para que cuando veas que cuando alguien lo va a aumentar el espacio de datos, tendría acceso a otros posts, entonces puede dar click sobre esto. X no es proyectos para adultos. Lo haremos en el próximo lugar. Voy a detener este video aquí mismo. Nos vemos en la próxima conferencia. Adiós. 17. Detalles diseño de tarjetas: Bienvenido de nuevo una vez más. En el spot donde agregarás algunas opciones más en nuestro espacio detallado. Para ello, ¿qué podemos hacer? En primer lugar, necesitamos aumentar la altura de nuestros detalles pero mesa de trabajo, por lo que voy a aumentarla un poco más. Y aquí vamos a sumar tres proyectos más opción aquí para que podamos tomar un poco más. Muy bien, así que primero voy a añadir, voy a habilitar esta vista de diseño. Por lo que haga clic en estos puede no aburrirse. Y haga clic en esta opción de diseño. Podemos ver esta vista de diseño ahora desde aquí. Primero voy a añadir nuestro texto aquí, por aquí. Entonces primero voy a sumar nuestro texto. Podemos decir que el texto va a ser desde aquí. Porque todo viene de un lado. Voy a añadir aquí un texto y aquí se puede decir, voy a hacer click, puedo decir más proyectos. Esto es más proyectos sexuales n, Tal vez pueda añadir un subrayado aquí. Entonces primero permítanme ajustar este texto. Podemos 45. Por lo que necesitamos tener 45. Entonces podemos hacer click sobre él. Permítanme seleccionar éste. Podemos, podemos tener 45 y luego podemos hacer click en él para ajustar éste. Y ahora después de eso podemos tener nuestro subrayado en éste. Podemos dibujar nuestra vesícula subyacente es una línea que vamos a dibujar aquí. Y voy a decir, vamos a ver, déjame cambiarlo. Puedo arrastrarlo hacia abajo y luego podemos disminuir la altura a, creo que de 240 a 40 ramo viejo. Y entonces podemos ajustarlo aquí. Ahora si ejecuto éste, entonces podemos simplemente, vamos a ver, tenemos que seleccionar el porque no agregamos ninguno. ¿ No agregarías ninguna opción prototipo en este momento, podemos navegar hasta el espacio de datos. Por lo que este es el espacio total al por menor. Y aquí vamos, tenemos este modo detalle de proyectos. Ahora, aquí vamos a sumar tres proyectos más. Lo vamos a diseñar en nuestra defensa. Definiremos, diseñaremos una opción de carta aquí. Así que voy a tomar ayuda herramienta de ángulo de objeto, haga clic en este rectángulo. Y luego aquí, desde aquí, podemos, podemos dibujar una guardia. Tal vez de aquí a aquí. Podemos arrastrar, podemos sacar esta carta aquí. En primer lugar, necesitamos sumar nuestro radio fronterizo para sumar lo que ya es 20. Entonces la frontera múltiple. No necesitamos tener la frontera y necesitamos tener una sombra. Entonces voy a sumar la sombra 20 por 20. Ahora si lo ejecuto, vamos a ver ¿qué podemos ver? Y tenemos este proyecto por aquí. Pero lo que pasa es que está tomando muchos espacios, así que voy a quitar éste. ¿ Qué puedo hacer? Simplemente puedo ajustarlo de esta manera. Ahora no necesitamos tener esta vista de diseño. Voy a quitar esta capa, terminará aquí. Podemos añadir nuestros archivos de imagen para agregar archivos de una imagen. Voy a dibujar aquí un rectángulo para que esta imagen pueda ajustarse fácilmente con eso. Y esta será nuestra área de imagen. Tan rápido necesitamos sumar, tenemos altura, tenemos un ancho 636 y para éste, Ok, ahora tenemos un tono alto. Tenemos blanco 536 y tenemos una altura cinco T6. Por lo que voy a quitar primero la frontera, y después tenemos que añadir lo que sea 20. Y entonces creo que podemos ajustarlo un poco más. Ahora. Editar ajustado. Ahora. Es perfecto. La nariz no es perfecta aquí porque necesitamos tenerla exactamente en el mismo tamaño. Ahora creo que está bien. Ahora podemos graficar nuestra imagen aquí. Podemos dejar caer nuestra maestría aquí, tal vez ésta. Tenemos estos e-mails aquí y podemos ver en esta imagen también se tiene este radio fronterizo. Y aquí podemos sumar nuestro título y la descripción, y es posible que tengamos poco texto y la esquina lateral derecha. Entonces, ¿qué podemos hacer ahora? Podemos hacer, podemos, ya tenemos un componente de esto. Simplemente podemos ir por aquí, y luego simplemente podemos arrastrar este componente aquí para el título de éste. Entonces podemos añadir este título aquí. Antes de hacer este equipo. Creo que va a tomar este camino, pero está bien. Y luego voy a hacer doble clic en él. Y luego en el Medial, voy a presionar el Enter que podamos llegar a la línea. Se ve bien ahora no hay problema en absoluto. Por lo que podemos simplemente cambiar el tamaño de la fuente a 35 para este título. Podemos. ¿ Qué podemos hacer? Podemos simplemente se está tomando mucho de lo mejor de sus mejores. Puedes ajustar éste o podemos eliminar pocos textos. A lo mejor te van a mover pocos textos de aquí solo para ajustar este 135. Y ahora tenemos que agregar nuestra descripción aquí. Para editar descripción, voy a seleccionar esta herramienta de texto y luego voy a dibujar el área de texto. De acuerdo, entonces tenemos muy menos espacio. Entonces, ¿qué puedo hacer? Voy a ajustar el título, tamaño de fuente. Estudia cinco a fiesta. Entonces tendremos poco espacio. Únicamente. Entonces podemos dibujar un área de texto. Así que lo voy a llevar de aquí a aquí. Tal vez de aquí a aquí. De acuerdo, y ahora voy a copiar algún texto para esto, para la descripción, tenemos aquí esta opción de texto ficticio, y voy a copiar esta, tal vez esta. Ahora, puedo copiar esto y puedo pegarlo dentro de esta área de texto y luego pegarlo. Y obviamente necesitamos cambiar el tamaño de fuente que puede ajustar con ésta. ¿ Qué pasó? Lo siento. Así que déjame dibujarlo de nuevo. Así que voy a dibujar, voy a arrastrar, dibujar el área de texto aquí. Y luego puedo pegar el texto aquí. Y entonces simplemente puedo cambiarlo a 30. De acuerdo, entonces si se inicia, entonces podemos tener éste, pero voy a pegarlo a 25 o tal vez beberlo para la descripción. Para éste, podemos tener éste. Podemos tomar un texto diferente, diferentes familias de fuentes para que se vea bien. Ahora sólo podemos anotar este que se va. No puedo leer este. Tal vez éste. Lo es. Ok. Ahora puedo dar click sobre éste para ajustarme con eso. Y justo con el texto. Entonces es bastante bueno ahora y aquí podemos sumar nuestro texto y podemos decir detalles de Bu o alternativamente, ¿qué podemos hacer? Podemos simplemente, podemos simplemente tener un botón Ver Detalles por aquí. Creo que simplemente podemos agarrar éste también si quieres. Creo que podemos agarrar éste. Déjame ver. Creo que conocimos a un grupo si no me equivoco. Entonces tenemos este fondo aquí. Tenemos este fondo en un grupo, así que lo voy a hacer y duplicar. Entonces presiona el Comando D, luego puedo duplicar éste. Se puede ver que puedo duplicar éste. Ahora. Aquí vas otra vez, simplemente ponlo aquí. ¿ Qué pasó? No se muestra aquí. Permítanme duplicar éste, Comando D, y luego puedo arrastrarlo aquí. El caso es que no podemos arrastrarlo directamente aquí porque está en un tablero de arte diferente. Y voy estas cosas están disponibles dentro de esta mesa de trabajo impuestos. Éste. Lo que tendría que hacer, solo tendré que ajustarme. Sólo tendré que convertirlo en un componente para poder reutilizarlo. Pero aquí no es visible. Si hago clic en éste, no se está mostrando aquí porque ya hemos editado éste aquí. Permítanme quitar este rápido. Esta cosa que voy a quitar de aquí. Entonces déjame ver si tenemos más aquí. Y este es el fondo principal. Así que voy a hacer que sea un componente, puede componente. Entonces todo esto va a estar en este componente. Ahora, simplemente podemos arrastrarlo aquí. Y esta vez va a funcionar. Nuevamente. No lo es. Creo que está funcionando, pero lo que pasa es que un momento, podemos simplemente, simplemente podemos nuestros genes, el fondo de éste. Ahora si lo ejecuto, deberíamos poder ver éste aquí. Ahora está bien, no hay problema en absoluto. Ahora, ¿qué podemos hacer aquí? Esto es lo que tenemos aquí. Entonces tenemos que hacerlo componente, entonces, necesitamos convertirlo en un componente. Entonces podemos reutilizar en éste aquí. Ahora está dentro de éste. ¿ Tenemos que sumar unos cuantos más aquí? ¿ Para hacerlo? Podemos hacerlo, podemos hacerles un grupo y luego podemos usar esta rejilla de repetición para agregar esta sección de cuadrícula de repetición. ¿Qué podemos hacer? Podemos simplemente se cumplen todos estos ítem en un grupo. Estas son las pocas cosas que tenemos aquí. Tenemos estas células grandes. Tenemos este botón componente y éste creo, creo que desde aquí lo tenemos todo. Por lo que voy a seleccionar todos estos. Y ahora podemos hacerles un grupo. Ahora haga clic en rejilla distribuida. Podemos volver a sumar, duplicarlo. Creo que podemos duplicarlo tres veces, pero no podemos duplicarlo tres veces. Puedes duplicarlo dos veces porque va a estar fuera de esta principal. ¿ Qué podemos hacer? Simplemente podemos hacer un espacio en él. Podemos hacer lo que podemos hacer? Podemos tomar la mezcla a escribir aquí. Podemos en el fondo. Déjame ver si podemos tomar c aquí. Entonces creo que podemos cavar debajo de uno más. Podemos tomar T aquí, y si disminuimos el espacio, entonces podemos tomar C. Y luego déjame ejecutarlo. Y vamos a ver. Aquí. Tenemos estos detalles espacio aquí. Y mi computadora no funciona correctamente. No lo es. Déjame leer y éste. Ahora si hago click en este botón Ejecutar, entonces tenemos estos detalles. De acuerdo, por lo que se selecciona página de inicio para adultos. Ahora si hago click en él, podemos ver nuestra pieza de detalles aquí viste nuestra característica, aquí está nuestros proyectos. Yo puedo, creo que está tan bien podemos tomar T o si quieres, podemos llevarnos unos cuantos más en el fondo también. Pocos más en el fondo también. Puedes sacar tres de aquí, no hay problema, metal y podemos sacar tres más en el fondo. Y ya tenemos esta opción aquí, por lo que simplemente podemos drogar o conducir. No necesitamos tener masa más aquí porque solo tenemos tres proyectos en la página de inicio. Por lo que ahora voy a cambiar el medio de éste. Así que voy a seleccionar diferente en esto. Seleccionemos éste aquí. Entonces tenemos que reemplazar este también. Para que pueda seleccionar éste aquí. Perfecto. Por lo que tenemos esta opción aquí y la siguiente parte vamos a sumar nuestra sección de pie de página, o creo que puedo agregarla en esta parte porque ya tenemos esta en los componentes. Entonces primero voy a quitar, voy a disminuir la altura de esta salida principal. Y entonces simplemente puedo agarrar esto. Simplemente puedo agarrar este pie de página porque todos vivimos más felices que nuestro componente. Ahora, puedo ajustar éste. Creo que no necesitamos tener mucho más espacio para poder quitar poco espacio más de aquí porque ya tiene un tamaño más grande. Aquí vamos. Perfecto. Ahora si hago click en este de acequias post, estamos en la página de inicio ahora, así que voy a seleccionar este espacio de detalle. Puedo tener esta opción aquí. Podemos ver que tenemos todos estos, tenemos esto más proyectos sexuales, y luego tenemos este pie de página ajustado. Y una cosa que puedo hacer aquí, simplemente puedo simplemente disminuir el tamaño de éste porque es muy grande. Tamaño más grande. No necesitamos tener este tamaño más grande. Y permítanme primero comprobar cómo se ve sin uno más pequeño, si disminuimos el creo que se ve bastante bien y podemos quitar podemos ajustarlo en este recipiente, la altura ancha es de cuatro o 55. Voy a seleccionar estos 455. Este también, para éste también seleccione 455. Perfecto. Ahora podemos ajustarlo para escuchar. Tal vez no hagas una. Y éste también va a estar en este veintiuno noventa, uno noventa. Ahora se ve bastante bien. Creo. Perfecto. Se ve bastante bien. Todo es igual aquí, no hay problema en absoluto. Y tenemos esta opción de detalles BU. Tenemos esta característica de Sean y tenemos nuestro pie de página. Entonces todo está hecho. En el próximo spot, trabajaremos en nuestro prototipado. Entonces nos vemos en la próxima conferencia. Adiós. 18. Prototipo con animación: Bienvenido de nuevo. Una vez más. Esta parte, completaremos nuestro proyecto y agregaremos nuestro prototipado. Entonces básicamente tenemos sólo dos tableros de arte en la salida principal. Tenemos toda nuestra aplicación y en nuestro espacio detallado tenemos los detalles del proyecto que estábamos mostrando en nuestra página de inicio. Así que primero déjame correr la página de inicio. Esta es nuestra página de inicio. Tenemos un diseño muy bonito. Tenemos nuestros objetos portadores o educación, sexo muestra sección proyecto. Y nuestras habilidades tecnológicas son herramientas. Y la retroalimentación, y la retroalimentación que obtuvimos mostrando esta vista de desplazamiento. Y luego tenemos nuestro formulario de contacto también. Entonces tenemos nuestro tiempo completo. Ahora la cosa es que cuando nuestro usuario haga clic en este botón Ver Detalles, los enviaremos al espacio digital. Pero ahora si hago clic aquí, no va a pasar nada. Significa que no contamos existir nuestro espacio digital. Para ello, necesitamos agregar prototipado. Entonces ahora la pregunta es que ¿cómo podemos hacerlo? Por lo que es una manera muy fácil. Nada que ya solo necesita sombrío unas cuantas veces. Ahora, encima de éste, se puede ver que hay una opción llamada prototipo. Simplemente puedes hacer click sobre este prototipo. Entonces si estás en este prototipo de muerte, entonces la esquina lateral derecha, vas a tener un par de opciones. Entonces básicamente tendremos que trabajar en ello. El primero es gatillo. Este gatillo significa que qué tipo de prototipado queremos tener. Por lo que tiene un par de opciones. En primer lugar, necesitamos seleccionar un ítem desde donde podamos hacer estas cosas. Entonces primero voy a hacer click en esta primera opción, que va a ser este efecto view detalles. Haga click en esto Ver detalles aquí. Ahora si hago clic así cuando lo harás, si estás en un prototipo o protector, por lo que cuando seleccionarás cualquiera del artículo, entonces solo te vas a dar un botón desde aquí. Desde aquí se puede agregar prototipado. Ahora, si selecciono éste y luego puedo acceder a éstos y se puede ver profundidad, arrastrar teclas y gamepad y voz. Entonces hay tantas cosas que hacer con eso. Pero para nosotros, vamos a usar esta opción paso para que al hacer click en esto, les mandemos loci. Así que voy a saltarme este paso. Y luego bajo estas acciones y tenemos diferentes tipos de opciones de animación. Entonces primero se mecanografia. Tenemos superposición de animación automática de transición. Superposición significa que si quieres mostrar algún tipo de mucho, entonces es genial que la reproducción de audio de la mesa de trabajo anterior, la velocidad de reproducción, y estas cosas también están disponibles aquí. Por lo que normalmente tendremos que usar la mayor parte del tiempo con la transición. Así que voy a seleccionar estos en transición. Tenemos el destino. Por lo que ahora tenemos dos opciones. O bien podemos hacer click directamente sobre éste y luego podemos arrastrarlo a nuestro espacio de detalle. Entonces se va a conectar de esta manera. Voy a arrastrar éste. Y se puede ver que se ha conectado automáticamente con el espacio de detalle. Para que podamos ver este es el espacio de detalle que tenemos aquí. Ahora tenemos esta opción, entonces también tenemos los bucles. Ok, entonces otra cosa que ahora es visible, la stat, tenemos esto, tenemos otro fondo por aquí. Vale, lo siento. Que no nos dimos cuenta cuando hicimos éste porque lo copiamos varias veces. De acuerdo, así que esto es lo que tendremos que arreglar. Lo haremos más tarde. Ahora cuando haga clic en él. Entonces en el, en el, en el destino, tendrás esta opción para agregar. Entonces cuando se hace clic en él. Por lo que nuestro destino es este espacio en detalle. Y aquí tenemos la diapositiva de animación a la izquierda, slider edge, por lo que podemos hacer click en trineo a la derecha. Y luego tenemos fácil fuera y fácil en Louisiana, otro tipo para que podamos seleccionar Lo suficientemente fácil. Y esta es la duración, 0.6 segundos. Ahora si corro éste, ahora si vuelvo a éste, si hago click en negación, podemos ver que este símbolo de mano cuando estamos en esta vista Botón Detalles, pero aquí no va a pasar nada. Entonces si voy a hacer click en él, vamos a ver nuestro espacio de detalle. Aquí vamos. Contamos con nuestro espacio de detalle. Y luego tenemos esta opción aquí. El botón está visible aquí. Creo que cuando copiamos esta, copia duplicada, hemos aprendido a hacer este prototipado aquí, pero este botón está aquí de alguna manera. Usted sí revisa éste aquí. Creo que este es el botón del que estamos hablando. Ahora voy a quitar este botón de aquí. Voy a eliminar este botón desde aquí. Puedo borrarlo. De acuerdo, así que ahora lo ha hecho, más se puede ver que ahora ya no tenemos ningún botón . Está bien. Entonces cuando lo copiamos del componente, lo duplicamos una vez más, creo, pero no lo noté. Ahora si lo vuelvo a ejecutar, esta es nuestra página de inicio. Ahora si hago click en este Ver Detalles, estamos en este espacio en detalle y está tomando un poco más de tiempo porque he seleccionado este. Plazo. Ahora desde aquí no podemos volver a nuestra página de inicio. Entonces, ¿qué podemos hacer cuando estamos en el espacio de datos, tenemos este botón Inicio. Entonces desde aquí podemos volver a nuestra página de inicio. Para hacerlo lo que tenemos que hacer, necesitamos seguir el mismo proceso. Así que primero déjame, vale, así que ahora déjame azar la duración 0.6 a 0.2 y la predeterminada. Y también puedes seleccionar diferentes tipos de cosas aquí, como en la parte superior, desde la parte superior, voy a hacer click sobre ella. Estamos en el espacio digital. Ahora. En lugar de deslizar, ¿verdad? Se puede decir deslizarse hacia abajo también. Si hago clic en la primera diapositiva hacia abajo, entonces va a salir de arriba y luego va a bajar. Se puede ver click y viene desde arriba. Pero es mejor tener éste para seleccionar el derecho. Y sólo tenemos que hacerlo, necesitamos tener esto fácil en. No necesitamos agregar facilidad de entrada y salida fácil. Y podemos hacer click ahora. Tenemos este espacio reducido. Ahora necesitamos agregar un prototipo más de esta casa. Entonces cuando haces doble clic en esta casa, ahora hay dos cosas que podemos hacer con esto. 11 es podemos seleccionar Mesa de Trabajo Anterior. Podemos ver nuestra transición va a ser Mesa de Trabajo Anterior. Significa que de donde hemos venido, así que venimos de la homepage al espacio digital. Por lo que se va a ajustar automáticamente el espacio de detalle. Pero el problema es que a veces si estuvieras en la página de inicio o si estás en cualquier otro lugar, pero si quieres, digamos que tienes 5678 páginas. Pero si estás todo el tiempo, si estuvieras usando estos Mesa de Trabajo Anterior, entonces solo existirás la salida anterior, tal vez desde la página principal para que te mudes a la pieza educativa, entonces compañeros de educación a la basada en el proyecto. Ahora si quieres volver a la página de inicio desde la base del proyecto, entonces no podrás hacer es dividir la mesa de trabajo anterior porque fuiste a proyectar, basada en proyectos desde la educación fase, sólo se le permite pasar a la pasta de integración, no a la página de inicio. Hay una razón. Así que déjame mostrarte todavía, te mostraré click en esta anterior a bordo. Ahora podemos ver éste. Ahora si yo, ahora si ejecuto directamente este espacio dígito y si hago clic aquí, entonces todavía puedo pasar a la página de inicio porque no vine al venir la página de inicio esta vez. Definitivamente dirijo estos detalles, pero esa es la razón por la que no está funcionando. Ahora si selecciono esta homepage rápido y si vuelvo al espacio de detalle desde aquí y hago click en éste, estamos en la prueba t, pero ahora si hago click en Homepage, entonces estamos en la casa basada ahora somos capaces de hacerlo. De acuerdo, Entonces este es el significado del sistema de mesa de trabajo anterior, pero siempre es mejor agregar este. Entonces, en lugar de agregar mesa de trabajo anterior, seleccione la transición y luego elija una salida. Entonces estamos en el espacio de detalle, vamos a ir a la página de inicio. Nuevamente. Dependerá del proyecto en el que estés trabajando. Por lo que solo necesitas saber cómo van a funcionar las cosas en Adobe XD y luego puedes usarla equidad en tu diseño. Ahora haga click en esta página de inicio es ahora esta vez, si hago click en esta página de inicio, nos trasladaremos a la página de inicio. Aquí vamos de nuevo, ver que estamos en homepage. Ahora si hago click en este Ver detalles, de nuevo, somos capaces de pasar a este espacio de detalle aquí. Esta es nuestra descripción, esta es nuestra característica. Esto es todo proyecto y tenemos este buen pie de página, así que todo está bien. Voy a detener este video aquí mismo y seguiremos con desde la próxima conferencia. Nos vemos en la próxima conferencia. Adiós adiós. 19. Exportar todos los diseños: Hasta ahora hemos terminado nuestro diseño de app web. Ahora es el momento de hacer la exportación de nuestro diseño. Hemos hecho este diseño ahora es el momento de compartir este equipo con otras personas. Cómo puedo hacerlo para hacerlo es muy fácil de hacer, que tenemos en esta opción en la sección de archivos. Así que ahora de nuevo, déjame mostrarte nuestro proyecto una vez más porque hicimos un muy buen trabajo. Diseñamos una aplicación web completa. Y ahora tenemos esta sección de educación, nuestro proyecto sexo mostró nuestras herramientas. Toma comentarios sesgos y también podemos desplazar nuestros comentarios desde aquí. Entonces tenemos este contrato de Sean's y luego tenemos este pie de página. Esta es la aplicación completa. Ahora, si hago click en este Ver Detalles, deberíamos poder ver nuestro espacio de datos aquí es de un espacio de detalle, y tengo nuestra característica de título y la opción de proyecto aquí. Y luego tenemos el pie de página. Tenemos que tablero de arte ahora necesitamos exportarlo. Ahora si hacemos clic en la página de inicio, estamos en homepage. Todo está bien. Para ello necesitamos dar click sobre este fichero de Sean. Y luego aquí tendrás una opción llamada export. Significa que si queremos exportar nuestro diseño, hay muchas maneras de hacerlo. Y dice que todos los tableros de arte o el seleccionado una fuente líquida en significa si selecciono éste, si solo quiero exportar este tablero de arte en particular, entonces puedo hacerlo. Puedo hacer click en este Exportar y luego se puede decir, dice un seleccionado, significa que sólo éste, pero queremos, hacer , queremos exportar todas las mesas de trabajo. Si quieres exportar todos los poros no a la vez, entonces debes seleccionar todas las mesas de trabajo. Entonces vas a tener opción de hacerlo. Y nos va a dar un pop-up de Shawn aquí tendremos diferentes tipos de opciones que hacer. Dice que el formato, ¿qué tipo de formato necesitas? A lo mejor necesitas formato PDF, tal vez necesites formato JPEG, tal vez un formato PNG único, para que puedas hacerlo por mí. Voy a seleccionar mi formato JPG, luego calidad. Puede seleccionar diferentes tipos de calidad. Por lo que es mejor tener un 100% y exportar estos y selecto activo exportará a uno. Y tenemos esta opción de exportar para opción de diseño no lineal. Y todo lo que podemos sólo para la opción web, lo que significa que puedes ejecutarla. Anuncio ahora diseñado. Puedes seleccionar. Podemos, ahora hemos exportado para éste y tenemos esta opción. Y podemos simplemente seleccionar nuestro destino donde queríamos guardarlo. Puedes crear una nueva carpeta o donde quieras, donde quieras configurar, que para mí ahora, voy a deslizar los escritorios y justo en el escritorio lo voy a mostrar. Ahora haga clic en exportar todo a bordo. Y solo te vas a llevar unos segundos. Creo que está hecho. Ahora. Esta es mi siguiente salida y aquí tenemos estos 21. Entonces esta es nuestra página de inicio. Ahora si hago clic en él, entonces se va a abrir. Momento. Ahora se está ejecutando. No es abrir la aplicación. Entonces aquí está nuestra aplicación. Momento. Déjame ver. Anchura. Pocos momentos más es muy lento. Aquí vamos. Tenemos todo este diseño que teníamos en Adobe XD código ejecutar lo mismo. Ahora podemos acercar y alejar y luego podemos, creo que podemos hacerlo un tamaño más grande. Ahora podemos acercar. Se puede ver que tenemos exactamente el mismo diseño que teníamos en Adobe XD. Por lo que lo exportamos con éxito. Análisis el 100%. Entonces esta es nuestra página de inicio. Y tenemos objeto de carrera, tenemos nuestra educación, y tenemos nuestro proyecto y definitivamente no tratamos de hacer click en él porque después explotarlo no va a funcionar aquí. Definitivamente, porque es sólo un formato JPEG. Y esta es nuestra habilidad tecnológica y se puede ver que no hay ningún problema de píxeles, por lo que todo está en forma y bien. Obviamente no podemos desplazarlo. Ajusta un correo electrónico. Y esta es la base de contacto y luego tenemos nuestro pie de página. Entonces todo es perfecto aquí. Ahora déjame abrir estos detalles espacio. Este es nuestro espacio de detalle. Ahora voy a acercar. Ahora, este es nuestro espacio de detalle y tenemos esta opción aquí. Nos hemos sobrecalentado. Tenemos nuestra barra de navegación, queremos nuestros correos electrónicos, luego características de descripción del título y más publicaciones y nuestro pie de página y definitivamente la promoción del producto no funcionará aquí. Entonces esta es nuestra página de inicio y este es nuestro espacio de detalle. Por lo que hemos terminado nuestro proyecto completo desde su cruz a vista en vivo. Hemos exportado nuestro diseño y creo que te hubiera gustado este curso. Voy a detener este video aquí mismo.