Experiencia del usuario / diseño de interfaces: aprende Adobe XD: animación de UX/UI: web / móvil

1. Adobe XD: Hola, bienvenido a los casos de diseño de interfaz de usuario 30. Mi nombre es únicamente arte y soy estrategias UX. De todos modos, diseñadora. Tú y yo vamos a crear este hermoso sitio web y aplicación móvil para un mero proyecto del mundo real desde cero en Adobe XD, si eres un principiante total o no tienes idea por dónde empezar. ¿ Cuál es el camino para convertirse en un diseñador de experiencia de usuario profesional? El discurso es para ti. Empezamos desde cero entendiendo la diferencia entre UX de todos modos, y descargamos e instalamos Adobe XD. Después aprendemos cómo funcionan las herramientas en Adobe XD. Entonces creamos formas simples. Y luego para tu asignación uno, tienes que crear múltiples formas. Y luego después de que creaste, puedes volver y ver el video para tu asignación dos, tienes que crear un búho. Ahora es el momento de trabajar con tipos en Adobe XD. Entonces para tu próxima asignación, tienes que crear esta topografía con la sombra. No te preocupes por una fuente ahora mismo. Hablamos de ello en el futuro. Entonces entendemos enmascarar o poner una imagen dentro de una forma. Para tu próxima asignación, tienes que crear una página de perfil de Instagram para tablet. También aprendimos a hacer que cualquier sitio web respondiera a la vista móvil. Por último, tenemos que iniciar un proyecto del mundo real. Pero primero, hay que convencer al cliente de que eres el mejor diseñador para este sitio web y diseño de aplicaciones móviles. Ahora, te mostraré el secreto de conseguir cualquier oferta de trabajo fácilmente. Al seguir estos pasos, entendemos la declaración del problema y se nos ocurre una posible solución para otro cliente. Después de conseguir el trabajo de declinado, tenemos que pasar por el proceso de diseño, que puede tener tres pasos en UX y pasos de giro en UI. Los tres pasos en UX es descubrir. En primer lugar, ¿qué está investigando el usuario? Qué es un alcance de trabajo o línea de tiempo y cómo creamos uno. ¿ Qué son las entrevistas de usuarios? ¿ Qué es el análisis competitivo? Y cómo podemos comparar al competidor. Cómo podemos crear personas de usuario, empatía, cómo crear mapeo de trayectos del usuario o mapeo de trayectos del cliente. ¿ Qué es el flujo de usuario? Cómo crear un moodboard requerido clasificación. Cómo crear arquitectura de información. ¿ Qué es el wireframing o el wireframing de baja fidelidad? Tamaños de sitio web, sistema de rejilla wireframing de alta fidelidad. Cómo crear prototipado tenía que hacer animación. Hay mucho que cubrir a los chicos. Estoy tan emocionado de empezar. 2. UX vs UI: ¿ Cuál es la diferencia entre el diseño de UI y UX? Que en realidad es como UX y UI. Ui UX. Ux o diseño de experiencia de usuario es los diseñadores de procesos utilizados para construir productos que proporcionan una gran experiencia hoy en día, diseño UX del usuario se refieren a llenar luego los movimientos de la experiencia del usuario al interactuar con el producto. Se enfoca en el flujo de usuarios y lo fácil que es para el usuario lograr los objetivos deseados. Entonces, ¿qué es la UI? diseño de interfaz de usuario o interfaz de usuario es el proceso. Los diseñadores utilizan interfaces en software o dispositivos computarizados centrándose en MOOCS o en un estilo. Ahora, déjame explicarte y empiezo con un ejemplo. Echemos un vistazo a esta imagen. ¿ Qué es UX? Ux es experiencia de usuario, que se ve aquí. Y tú, ¿por qué es así? Esta es una UI sin la investigación, porque esta es la experiencia del usuario, esto es, el comportamiento del usuario. Por lo general le gusta caminar de esta manera, de esta manera. Por lo que llamamos a esto un mal diseño UX porque lo usas. La experiencia no está bien. ¿ Y este ejemplo? Tenemos dos buenos diseños, pero uno de ellos tiene una batería, tú, uno de ellos tiene una buena UX. Un mal UX es este viejo típico diseño de ketchup de tomate Heinz, que no se puede sacar nada de él. Pero esta es una buena UX porque puedes conseguir toda la pirámide de ponerse al fácilmente y tiene una buena interfaz de usuario también. Ahora estás obteniendo, ¿cuál es la diferencia entre UX y UI? Pasemos a otro ejemplo. En este escenario, tenemos dos usuarios diferentes, padres. Y el chico. Como se ve en esta imagen, los padres están contentos y teniendo una buena UX porque pueden ver a los elefantes y al tigre y todo en el lugar correcto. Pero los chicos teniendo un mal, solo echa un vistazo. Los niños sólo pueden ver el fondo de estos animales. Por lo que siempre recuerda a qué persona estás diseñando. Estás diseñando esta zona para ti o para un niño. Si es por el niño, estás teniendo un mal día. F es donde están los padres, ¿verdad? Eres bueno. Ahora, vamos a conseguir una carta más profunda. Por lo que siempre primero hacemos una investigación, investigación basada en la UX que descubrimos, ser definida. Acabamos de hablar con mucha gente, con los titulares de estaca. Hacemos mucha entrevista con usuarios, minería de datos, análisis de negocios, y muchas cosas. Después de una buena investigación, que es la fase uno, significa diseñar el derecho. Piensa así. Diseña lo correcto. Diseña el tanque adecuado. Esto es UX. Cuando lo diseñas, cuando tienes el prototipo. Vamos por el diseño de la interfaz de usuario. Vamos por cosas de diseño, ¿verdad? El rostro al rediseño, y entregamos. Entonces básicamente es simple. Haz tu investigación y luego haz tu diseño a la UX y deber que eres. Y esta es una forma muy sencilla de explicar cuál es la diferencia entre nosotros. De todos modos. 3. Comienza a conocer el entorno y trabajar con herramientas: Veamos cómo podemos descargar e instalar el Adobe XD. Tan solo ven a Yale y solo teclea, descarga Adobe XD y solo haz clic en él. Y por defecto podemos encontrar aquí descarga Adobe XD y haznos empezar. Basta con dar click en él. Consigue XD, basta con dar click en él. Tienes dos opciones. Si tienes Adobe Creative Cloud, en el que tienes que iniciar sesión, significa que tienes que iniciar sesión en Arabic Creative Cloud. Entonces puedes descargar esta aplicación de escritorio de Creative Cloud. Después podrás descargar todas las aplicaciones. Adobe XD es totalmente gratuito. Cuando lo descargues, solo puedes hacer click en Abrir. Entonces, después de abrir Adobe XD por primera vez, tienes alguna plantilla personalizada aquí. Si estás diseñando para iPhone, solo tienes que hacer clic en este ícono aquí. Puedes elegir qué iPhone estás diseñando o qué tamaño de aplicación web. 1920. El 1366, que básicamente no en 2010 AT es el famoso. Historia de Instagram, Twitter post Facebook, video de YouTube. O quieres diseñar algo totalmente personalizado como un diseño de pancarta. Entonces, por ejemplo, estamos empezando con una web 1920 1080. Basta con dar click en él. Déjame solo hacerlo un poco más grande. Entonces, antes de empezar algo, veamos cómo podemos salvarlo. Puedes guardarlo en la aplicación Creative Cloud, que tienes que pagar por ello. O simplemente puedes venir a Archivo, Guardar como documento local. Y vamos a guardarlo aquí. Simplemente llamo a esta mesa de trabajo y haga clic en Guardar. Cerremos primero este 1. Y para acercar y alejar, sostén Alt y frío con la rueda del ratón. Mira. O si mantienes pulsado Comando o Control y presionas tres en tu teclado, Se va a simplemente acercar esa mesa de trabajo. Este es el lienzo que podemos dibujar, cualquier cosa sobre él. Y el lado izquierdo, tenemos las herramientas como rectángulo, círculo, triángulo, línea. Al igual que por ejemplo, sólo voy a dibujar algo como esto. Haga clic en él, dibuja en el símbolo at. Tenemos la herramienta de bolígrafo aquí. Puedes hacer click en él. Te explicaré cada detalle. Por ahora, solo voy a dar clic en él, como fuera, hacer clic y arrastrar para seleccionarlo y presionar Eliminar. Puedo hacer click en Texto, tipo, algo así como bienvenida a Adobe XD. Si hacemos click aquí, tenemos algún manejador de letra aquí y lo arrastramos hacia abajo. Puedo hacerlo más grande. Como ya he dicho, voy a explicar cada digest. Esto es para demostración. Ahora pulsa Eliminar. Si hago clic en art board, tengo acceso a todo el RPO como móvil, tablet y escritorio. Si hago clic, si salgo un poco, aguanta Alt u Opción ambigua, rueda de ratón, a la derecha. Y si hago clic, ahora, si lo arrastro hacia arriba, sólo puedo poner este, éste , este 1 de mayo ser un mal Nexo. mejor, tal vez Samsung Galaxy, reloj, 40 milímetros. Ahora, si hago clic y tal vez arrastre un poco esto hacia abajo, tal vez haga clic en éste, arrástrelo hacia arriba, arrástrelo hacia abajo, arrástrelo hacia arriba. Y hago clic y selecciono todos ellos. Y el lado derecho, tengo esta barra, que puedo alinear todo desde arriba. Click, Comando o Control Z. Quizás pueda alinearlos desde el centro. A lo mejor puede alinearlos desde abajo. Correcto. A lo mejor puedo alinearlos por igual. Por ejemplo, si esto está aquí y esto está aquí, esto es un poco aquí. Si hago clic y selecciono todos ellos y hago clic en éste, ver qué pasa. La separación y la brecha entre ellos son totalmente iguales a z Aquí, los puedo alinear totalmente desde la izquierda. Mira a la magnetosfera desde el centro, desde la derecha. Y esto va a ser igual desde el centro. ¿ Correcto? ¿ En qué tenemos puesto? Yo sólo voy a dar click en uno de estos controles comunes 32. Simplemente zoom específicamente en esta mesa de trabajo. Si salgo y doy clic en este, mando control de TV, sólo voy a hacer zoom y esta Lara. Entonces mantenga pulsado Control o Comando y salga la boca. Vamos a dar click en este. Para un zoom-in. Tienes esto. Si lo arrastro. Y basta con seleccionar esta zona y zona de riesgo esa zona. Si mantengo pulsada Alt u Option y solo haga clic en el lado izquierdo. Yo voy a salir. Si solo acerco así, sólo voy a ser su obra aquí. Ahora, volvamos atrás y seleccionemos la herramienta Mover, manteniendo pulsada Alt u Option y arrastrando con rueda del ratón va a ser muy fácil. Por lo que del lado derecho, tenemos nuestro panel de control. Si hago clic en este rectángulo y solo mantén pulsado, Shift, selecciona para ser cubo, ¿verdad? Del lado derecho. Las propiedades van a estar activas para este pequeño rectángulo o un cubo. puedo cambiar cualquier cosa. Yo sólo puedo ajustar eso o alineación. Puedo usar Repetir Grid, que tiene, que me van a explicar. Entonces es algo que si haces click y obtienes este mango y puedes repetir cualquier cosa que tengas. Ahora solo estoy comparando, vuelve entrometido. Te explicaré, repite grilla con un ejemplo real. Por ahora, sólo te voy a explicar, conseguir la idea de cómo funciona todo y transformación. Se puede cambiar el ancho, tal vez poner 600, tal vez éste a un 150. Y éste, va a ser Phillip, ¿ Algo que tengas aquí? Esto es para posicionamiento fijo para animación. Te explicaré, te explicaré el responsive para cuando estemos diseñando un sitio web. Y esto es como la opacidad. Déjame llenar esto. Si quiero colorear esto, solo voy a dar clic en este pequeño ícono aquí y justo con rojo. Y esta es la frontera, del tamaño, tal vez diez. Para que podamos verlo. Y el color, si hago clic aquí, puedo hacerlo negro. Ahora puedo arrastrar la opacidad y hacerla 20 por ciento. Ahora bien, si hacemos zoom en toda nuestra otra opción, asumiendo que te dan estos pequeños puntos de esquina aquí, si hago clic en él y lo arrastre, puedo apenas a la vuelta de la esquina, como ven aquí. Específicamente darle 20. Si quiero tener un control justo y cambiar sola esquina o un autor u opción, y basta con hacer clic en uno de estos y arrástrelo hacia abajo. Como ves, esto está separado por defecto va a ser algo así. Significa que todos los rincones son iguales. Pero si hago clic en este pequeño ícono aquí, tengo control en cada, cada esquina. Entonces tal vez pueda poner este 0, tal vez esta hora, lo puse 100 y veo. Déjame volver y todo son 20. Entonces todo es igual. ¿ Y el guión fronterizo? ¿ Qué pasa si me pongo el 10, a ver qué pasó? Y la brecha también lo es. Si menos. Entonces, tal vez aumente la brecha para probarlo. A ver qué pasó. Y el tamaño 20. Entonces está entrando. Yo tengo el control de esto se está viniendo dentro. Este saliendo afuera, pero éste está adentro, afuera está exactamente en el centro. Pero no quiero estar seguro. Yo quiero estar acorralando. Por lo que nuestro controlador que para mirar gorra redonda. ¿Y éste qué? Tapa de proyección. Pero éste pero gorra. Proyección RCA de esquina. Yo quiero ponerlo en gorra redonda. Y ahora puedo jugar con el guión, tal vez dos. Entonces te das la idea. A lo mejor echar un vistazo. Ahora, la brecha es de 50, es más brecha. El tamaño es 10. Más pequeño. Mira. Entonces me estoy convirtiendo. Pongamos un guión y el hueco en 002. Entonces el tamaño es 10, así que está bien por ahora. Es muy normal. Cambiemos el color a otra cosa, algo así como púrpura. En la parte superior tenemos algo llamado color sólido. Basta con dar click en él. Tenemos lineal, que solo puedo arrastrar este rincón y ponerlo aquí. Y puedo dar click en este y traerlo aquí. Como ves al hacer clic en él, hay un círculo blanco, borde blanco a su alrededor. Significa que está activo. Y puedo cambiar este color. Entonces tal vez pueda hacerlo rojo. Quiero cambiar este si hago click en él. El segundo va alrededor de éste. A lo mejor dos amarillas. Mira, ahora estamos muy cool. Gurión lineal. ¿ Y si quiero cambiar esto a gradiente radial va a estar en el centro. Puedo jugar con esto. Es muy sencillo llegar allí. Muy fresco, efectivo como efecto solar. ¿ Y los gradientes angulares? En realidad no es útil, este, quiero decir, puedes jugar con él. Se puede cambiar a diferentes colores, pero, básicamente nunca lo uso. Por lo que la mayoría de las veces va a ser lineal, lo que voy a explicar en otra lección, cómo podemos usar el gradiente lineal profesionalmente. Por ahora, te das la idea de cómo funciona todo. ¿ Qué hay de aquí? Tenemos las capas aquí. Entonces significa cualquier cosa que crees, si presiono Comando o Control D para duplicar esta es la Herramienta Rectángulo y la arrastra y lo pongo aquí. O si mantienes presionada Alt u Option y haces clic y arrastras hacia abajo, estás copiando estos dos. Por lo que algunos back-end con comando o control, menos o más también, se puede acercar y alejar. Por lo que estoy manteniendo presionada Comando o Control y click en menos y más. La otra forma de copiar es la simple, comando o control C y bucle de control de comandos también, puedes simplemente copiar cosas aquí. Entonces C, para que podamos conseguir un cuatro. Y ya ves, cuando simplemente lo arrastras y lo sueltas aquí ves que estos se alinean. Entonces dice linea look y solo déjalo ir. Entonces, ¿cuántas formas estamos copiando? Permítanme seleccionar y mantener presionada Shift y simplemente hacer esto más pequeño. Zoom. Sostenga en Alt u Opción, haga clic y arrastre. Estamos copiando. Presionar Comando o Control D. Podemos presionar Control de Comando C, Control V aún ser copiado. Entonces tres formas de copiar cosas en árabe. A ver, déjame dar click en esto. Vamos a bajarlo. Y el panel de efectos, tenemos sombra interior. Si haces click en él, busca un participante para inter, haz clic en éste en cinco. Pero no pasa nada. ¿ Por qué? Porque esto es transparente y ves algo como esto. Tienes que hacer clic en él y cambiarlo a negro y arrastrar esto hacia arriba. Y sólo ven aquí. Por lo que la sombra interior está consiguiendo la sombra dentro de esta simplemente presumiendo, se obtiene ésta y mira ésta. Ya ves que hay una sombra en el interior. Y déjame solo tal vez 10 de profundidad, ¿verdad? puede decir que está muy oscuro, ¿verdad? Entonces si haces click en él y éste podemos bajar la opacidad. Por lo que poco a poco estamos agregando la sombra interior como, como un botón. Muy bien, vamos a este. Bajando y pinchando en la sombra de gota. Nuevamente, arrastra esto hacia arriba. Por lo que automáticamente tenemos una sombra de gota y eje y, y. Por lo que la mayoría de las veces puso este como 20 o 12. Mira, obtenemos una sombra muy gradual a su alrededor no es muy afilada. Y puedes conseguir una dirección, tal vez 30, justo en el lado derecho, o menos 30. Simplemente pon un menos aquí y haz clic en Ok. Entonces te vas a quedar. A lo mejor esto son 30, así que va a bajar. Entonces déjame ponerlo como 026, las normales. Entonces esta es la capa normal. Ahora, si hago clic en él, puedo arrastrarlo hacia abajo para poder controlar la intensidad de la sombra. O puedo cambiar el color de la sombra. A lo mejor quiero algo rojizo, tal vez azulado. Entonces depende de ti. ¿ Y si hago click en este y en qué es el desenfoque de fondo? Si hago clic en él, cualquier cosa dentro va a ser borrosa. No tengo una imagen dentro. Entonces llevemos una imagen. Por lo que tengo mucho MHA basta con hacer clic en él y arrástrelo y soltarlo y ponerlo dentro. Cuando ves estas líneas azules, significa que está dentro y ves las palabras copiar, solo déjalo ir. Por lo que significa adentro, pero nada aparece. ¿ Por qué? Tenis off? Lo ves, ¿verdad? Volvamos al fondo atrás recién activado. este momento, la opacidad está en 0, es arrastrarlo hacia arriba por lo que está activo. Como ven cuando cambio la cantidad y el brillo, no pasa nada, solo opacidad. ¿ Por qué? Porque esto es un objeto, esta es una imagen. Significa que después de poner nuestra capa de objetos, ahora, ya ves, esto se ve como un objeto ahora tienen una cantidad a algo. Ahora tenemos la idea de cómo está todo en Adobe XD. Y en el lado izquierdo tenemos el tapón. Hay un montón de tapones que les mostraré cómo descargarlos. Y tenemos el panel de capas y tenemos el documento como las características de color en un componente el cual se explicará. 4. Crea formas sencillas: Empecemos el primer proyecto. En este proyecto, tenemos tres formas que vamos a crear. Formas y líneas. Entonces, ¿cómo lo hacemos? Empecemos con el simple. Entonces me estoy metiendo un poco dentro. Entonces tenemos un fondo, que vamos a crearlo. Sólo voy a dar clic en esta imagen y ir a Capa. Y por ahora, sólo voy a bloquear, bloquear en su lugar o presionar Comando o Control L para bloquear una imagen el lugar. Entonces bloqueé daños. Entonces si hago clic en él, lo desbloqueo y me gusta de nuevo. Por lo que para desbloquear y basta con dar click en él. Y así tenemos estas formas, esto creó muy rápidamente. Ahora da click en este rectángulo y está más cerca. Yo sólo voy a ir a esta esquina y sólo mantenga presionada Shift y arrastre para ver qué es exactamente debajo, debajo de él. Basta con arrastrar la opacidad hacia abajo para que pueda ver qué hay detrás de ella. ¿ Y el color? ¿ Cómo arreglamos el color? Yo sólo lo voy a dejar a un lado y sosteniendo Shift. Entonces va directo al lado derecho. Recoge este recolector de color y átomo de silicio. Entonces esto está consiguiendo el mismo color, pero como la opacidad está abajo, va a ser así. No necesitamos la frontera. Entonces ahora haz click y arrástralo hacia la izquierda. Ahora arrastra esta esquina hacia abajo para igualar esto con la capa de abajo. Yo sólo voy a encender la frontera para que veamos qué hay detrás de ella o derribar también la opacidad. Así que juega y mira, lo siento, esto es genial. Cuando está bien. Yo sólo voy a apagar eso de la frontera. Está bien. ¿ Y éste qué? Entonces porque esto es una recta, significa que tenemos que usar un rectángulo para por qué te muestro. Yo sólo voy a venir a esta esquina, mantenga presionada Shift y arrastrarlo hacia abajo. Da click en este pequeño rincón y simplemente hazlo totalmente un círculo. Ahora bien, esto es un círculo. Entonces por ahora, lo que voy a hacer es poco a poco desde el centro yo solo y lo arrastro hacia el exterior y ver esto se llama Nam. Da click en este pequeño círculo aquí y lo arrastro hacia abajo. Entonces consigo esta pequeña esquina en línea recta aquí. Después de lo mismo, haga clic en este icono para pasar a un turno largo, arrástrelo hacia la derecha, recoja el selector de color, hago clic, y ahora está coloreada. Vamos a traerlo de vuelta. ¿ Y éste qué? Esto va a ser muy interesante. Herramienta de marquesina elíptica y mantenga presionada la tecla Alt u Opción, arrástrela desde el centro. Y yo solo quiero hacerlo exactamente así. Muy bien, baja la opacidad para que veas donde la R la arrastra hacia abajo. Esta línea. Significa que estás en el centro. Voy a hacerlo un poco más grande. Por lo que a lo largo del turno, arrástralo hacia la izquierda. Sigue manteniendo presionado el turno, haz clic en esta pequeña esquina y arrástrala hacia la derecha. Recoge el color comenzó y está totalmente leído. Ahora, tráelo de vuelta. Ahora, ¿cómo conseguimos medio círculo? En realidad es muy sencillo. El genial de ello es que puedes venir aquí y hacer clic en la herramienta de marquesina de rectángulo y simplemente arrastrar una línea encima de ella. Ahora, haga clic de nuevo en la herramienta Mover, mantenga pulsada la tecla Mayús y haga clic en el círculo. Por lo que se va a eliminar el top. Esto podría hablar y dar click en sustrato, click, y se va a quitar. Ahora, haga doble clic en esto y revise la frontera. Entonces estamos bien para ir. O quizá sea un poco más grande. Mantenga pulsado Shift para hacerlo un poco del escritor, el grande, mejor. Este es sencillo. Simplemente ponlo en el centro Alt Shift y arrastra hacia arriba. Entonces con la tecla de flecha, arrastre la tecla de flecha izquierda, izquierda, opacidad hacia abajo. Apague el borde y arriesgue y arrástrelo a la derecha del color más grande, hágalo negro. Volvamos a un lugar y traigamos la opacidad. ¿ Y éste qué? Es como un botón escupir útil en realidad. Por lo que herramienta de marquesina rectángulo. Entonces bajemos la opacidad. Arrastra esto a la izquierda los fosos. Usa esta esquina para arrastrar esto. Un rey simplemente va a dar clic y arrastrar hacia la izquierda. Coo. No hace falta tener frontera. Arrástralo hacia la derecha. Selector de color, clic en brote superior. Y sólo lo voy a poner aquí. Si bien este es un triángulo. Y va a aguantar, Shift, bajar la opacidad. Y ven aquí, Vamos por encima de él. Y tal vez un poco más grande, manteniendo pulsado, Cambiar y arrastrar las esquinas. ¿ Y este rincón? Bájala. Ya ves, tiene algún rincón, ¿verdad? Está bien. Saquemos la opacidad. Y ves este mango aquí en la parte superior y simplemente arrastrarlo hacia abajo. Arrástrelo hacia la derecha, recoger el color comenzó y hacerlo naranja. Vamos a traerlo de vuelta. Apague la frontera. Y sólo voy a encerrar esto en su lugar otra vez. Haga clic aquí y seleccione todos ellos. Presione Mayús y arrástralo hacia los derechos. ¿ Cuáles son los antecedentes? No hay problema. Pueden Rectángulo Marquee Herramienta, haga clic aquí y arrastre a esta esquina. Ahora, arrástrelo hacia la derecha, pero está en la parte superior, basta con hacer clic derecho. Enviar para atrás. Podríamos recolector de color y erudito. Señaló tener frontera. Entonces los voy a volver a seleccionar todos y arrastrarlo a la derecha. Puedo hacerlos centrados. Por lo que todos ellos están seleccionados y voy a seleccionar este. Trae arriba los pasajes en este top opacidades. Este tiene una toalla y representa. Entonces básicamente este fue el primer proyecto. 5. Asignación crea formas múltiples: Voy a quitar esto. Empecemos de cero. Haga clic en este. Matrix suerte. Si no lo es, haga clic en el icono de candado porque yo cambio la mesa de trabajo. Ya no vemos estas líneas. Cada mesa de trabajo tiene sus propias líneas y formas. Esta es la segunda mesa de trabajo. Entonces solo veo por dentro, si hago clic en la mesa de trabajo y la imagen dentro de ella, puedo ver la mirada interna de uno a uno, que está bloqueada. Ahora, vayamos adentro. Siempre dibujamos 1 primero, que es el círculo. Están consiguiendo un círculo. Desplazar mantenga pulsado y arrastre hacia arriba. Bajar la opacidad herramienta de selección de hombre griego , arrástrela hacia abajo, mantenga presionada la opción Shift para que coincida totalmente con nuestra UCI. No hace falta tener frontera. Sigo bajando la opacidad para poder arrastrarla al selector de color correcto, escoger un color, así que arrástrelo hacia atrás. ¿ Y este cubo blanco? Entonces sólo voy a mantener presionado Shift y simplemente crear algo conocido fuera de frontera. Bajemos la opacidad. Si pongo mi ratón aquí, obtengo este ícono para poder rotarlo. Como que lo pones aquí, cambia de color y lo haces un poco más grande. A lo mejor cualquiera, tener un poco más de rotación para hacerla más recta a la izquierda. Ahora atrás. Ahora bien, ¿qué pasa con este triángulo? Este triángulo, mantenga, Shift, arrástrelo hacia abajo. Pon tu ratón aquí, selección girada para bajar la opacidad. Mantenga pulsado, cambie, arrástrelo de nuevo hacia abajo y obtenga más rotación. A lo mejor más rotación. Puedo hacerlo más grande. De este ángulo a 90 a una frontera. El color es naranja. Ahora hay un círculo en el interior. Puede condenar, rodear, aguantar, Alt y Shift y hacer clic y dibujar. Está bien, esto es genial. Yo sólo voy a traerlo aquí, ponerlo aquí, y llegar a nuestra frontera. A lo mejor puedo hacerlo más pequeño. Estoy sosteniendo Alt y Shift y arrástrelo hacia abajo. ¿ Es lo que está exactamente detrás? Entonces es bastante guay. Entonces 100 por ciento, 100 por ciento, un 100 por ciento. Y esto es lo que tenemos. Ahora mismo, dibujemos este. Es muy cool En realidad. Hagamos click en la herramienta de línea y solo pinchemos aquí. Y línea seca hasta aquí. Ahora da click en el color del borde y hazlo totalmente negro. Va a estar aquí también. Y sólo arrástrelo hacia abajo para el color, totalmente negro. Ahora, seleccione ambos, Comando o Control D para duplicarlos. Pon tu ratón aquí para conseguir este círculo de rotación y solo puedo rotarlo y conseguir éste. Un poco de Control D otra vez. Hazlo hasta que cubras todos estos. Suba en realidad. Lo mismo que hicimos la última vez. Ahora, para combinarlas juntas, solo tienes que seleccionarlas todas y dar click en el Añadir. Ahora, todos ellos están unidos, ¿verdad? Entonces significa que puedo moverlos. Ahora. Presiona rosetas de Comando T, retrocede. Muy bien, dibujemos. Este. Es realmente genial. En realidad. Haga clic en el triángulo y mantenga presionada la tecla Mayús. Yo sólo voy a volver un poco atrás. Turnos un poco. Yo sólo me voy a sentar, bajar la opacidad. Entonces, ¿qué es el fuego? La frontera? Vámonos a la derecha. Haga clic en el color, color azul. Por lo que significa si aumento el color porque el color. Entonces volvamos atrás. Bajar la opacidad. Entonces solo lo dejo aquí. ¿ Y éste qué? Entonces ya sé, rectángulo. Bajar la opacidad. Aquí, ver la selección. Por lo que estoy tratando de igualar este mantenga pulsado Shift. Vamos un poco, tal vez rotarlo un poco más. Linda frontera. ¿ Y éste qué? Nuevamente, rectángulo. A lo largo de Turno. Bajar la opacidad. Ven aquí y permite nave que más pequeño. Aguanta, Alt, arrastra esto hacia abajo. Aguanta, Alt, arrastra esto hacia abajo. Por lo que los tienes por separado. Agradable. Y el último es muy bonito. Bajar la opacidad. Gíralo, hazlo del mismo tamaño que nuestra selección de borde, selecciona en este y también borde de Mónica. Ahora solo voy a dar clic en este pequeño ícono aquí y déjame solo seleccionarlos todos. Arrastra un poco esto hacia abajo. Selecciona éste, sube la opacidad, selecciona éste, lleva éste al picker de color y el mismo color. Y este también es tipo rojizo de recoger la opacidad. Yo sólo lo voy a seleccionar, sólo voy a traerlo de vuelta a su ubicación. Dibujemos éste, que va a ser muy fresco como muy rápido. Rectángulo, arrastre hacia abajo la opacidad. Arrastre hacia la derecha. El color comenzó Glick. Agradable. ¿Y éste qué? Permitir turno. Una rotación. Vamos a dar click en selección. Yo sólo lo voy a dar aquí. A lo mejor un poco más de rotación, mantenga pulsado el turno. Arrastra estos 10. Talla, la talla tres aquí. A veces ves que no va a coincidir. Entonces por ejemplo, así, derribe la Opacidad. Haga doble clic aquí. Ahora tienes este punto por separado. Por lo que al hacer doble clic en cada esquina, es móvil. Entonces haga clic en este, así que arrástrelo hacia abajo. Haga clic en este, ponlo aquí, y haga clic en éste para que podamos convertirlo en un triángulo muy cool. Ahora, en la escuela, vuelta a ésta. Bajar la opacidad. Yo sólo puedo rotarlo. Yo lo puedo poner aquí. Más rotación, más grande, más grande, escuela. Ahora, ¿qué pasa con éste que ya conocemos? Haz un gran círculo aquí mismo. Ahora. Dibujemos una línea aquí. Está bien, así que para hacer eso, solo voy a usar mi rectángulo. Basta con hacer click aquí, bajar la opacidad. Y necesitamos simplemente girarlo para que sea línea muy precisa. Porque necesito simplemente ponerlo aquí. Esto está en la parte superior. Ahora, mantenga pulsado, cambie, haga clic en el círculo, y haga clic en, luego, restar. Ahora tenemos esto. Entonces solo necesito tener un poco de rotación. Y eso es todo. Sólo voy a seleccionar todos estos, arrastrarlo a la derecha. Por lo que típicamente color, éste era blanco, un 100 por ciento. Seleccione este. Éste era amarillo, rosa arriba la opacidad. Haga clic en este. Opacidad de color 100 por ciento. Y este también este 100%. Aquí. Tenemos este diseño muy cool e interesante. Yo los selecciono todos, los arrastra hacia la derecha. También necesitamos los antecedentes. Selecciónelo, arrástrelo hacia la derecha, haga clic derecho, envíe a atrás. Ahora tenemos el mismo borde de color, simplemente vamos a seleccionarlos de nuevo y arrastrarlo a la derecha de la misma. Entonces es muy cool e interesante. Por lo tanto, permítanme seleccionar éste y sacar la opacidad. 6. Asignación crea un búho: Intentemos hacer este. Yo sólo voy a borrar este. Vamos a acercar un poco. Yo sólo voy a seleccionar esto. Probemos el primero, que vamos a utilizar, Pen Tool. Recoge tu lápiz. Déjame mostrarte cómo funciona. Haga clic, haga clic, haga clic, haga clic y haga clic. Obras Solidworks. ¿Verdad? Ahora, selecciónela y elimínala. Otra vez. Seleccione la herramienta Pluma, haga clic, haga clic y arrastre. Haga clic y arrastre. Pero si quiero continuar, no quiero esto. Por lo que tengo que mantener presionada Alt u Option, click en este mango y traerlo de vuelta este punto. Por lo que soy libre de ir a donde quiera. Puedo dar click aquí y simplemente arrastrar, mantener presionada Alt otra vez, click en este pequeño ícono, traerlo de vuelta para que pueda seguir adelante. Siguiente ¿a la derecha? Ahora, vamos a seleccionarlo. Dibujemos este también. Vamos a dar click aquí, vamos a dar click aquí y arrastrar hasta que coincidamos con estas líneas. O lambda. Tengo esta manija. No puedo seguir manteniendo presionada Alt u Option. Haga clic en el icono, traerlo de vuelta al centro, va a desaparecer. Soy libre de irme. Haga clic y arrastre. Ahora. Reproduciendo esto hacia atrás, haga clic, haga clic y arrastre. Aguanta Alt, trae esto de vuelta. Haga clic y arrastre hacia atrás. Aquí vamos. Escoge un color. Ahora es noche roja nuestra frontera. Trae eso fuera. Probemos este. Presione el lápiz para capas. Yo sólo voy a cerrar eso. Más espacio. Herramienta Pluma de nuevo. Entonces haga clic aquí, haga clic aquí. Asegúrate de que sólo tienes que seguir la curva. Entonces ahora mismo se va a rectizar. Así lo hizo aquí, haga clic y arrastre Alt y arrastre esto hacia atrás. Recta, mantenga pulsado Shift para estar totalmente recto. Y da click aquí y arrastra Alt. Arrastre esto de vuelta aquí. Y sigue sosteniendo turno abajo aquí. Estoy tratando de ver si puedo hacerlo. Enfriar. Gracias. Se lo perdí. Kamikaze para volver atrás y hacer clic y arrástrelo aquí hasta aquí. Si va a ser algo así, no te preocupes. Si lo permites todo, solo puedes hacer click en esto y simplemente traer esto de vuelta al centro. Ahora, por qué nosotros esta justo la parte derecha, porque sólo vamos a copiarlo al lado izquierdo va a ser muy interesante. Selector de color para el campo. Haga clic en esto. Ahora, haga clic afuera. Ahora si hacemos click, lo tenemos todo. Presione Comando D para duplicarlo. Déjame sólo abrir esto. A ver qué pasó. Sha Pad 15, mira, conectada a D se convierte en pasado 16 encima de ella. Ahora, haz click en este pequeño ícono para voltearlo horizontalmente. Mantenga pulsado el turno, arrástrelo hacia la izquierda. Ahora es totalmente partido. Permitir Shift y dar click en este pequeño ícono. Por lo que ambos están seleccionados. Ahora da click en Agregar. Entonces lo son, dos de ellos se combinan. Queremos ver qué pasó, apaga eso. Pero ahora probemos este. Este o intentamos lado izquierdo, luego copiamos a trisecto. Entonces solo voy a dar clic y arrastrar hasta aquí. Por ahora. Bajar la opacidad. Ahora es ir adentro. Necesito tener este tipo de cuidados. Algún motivo aferrarse a Alt u opción y simplemente arrástrelo para conseguir la escultura. Entonces tengo que bajar esto. Enfriar. Yo lo tengo. El otro es haber descendido hacia atrás porque éste. Ahora mismo está encima de esto para enviar cualquier cosa de vuelta, mantenga presionada la tecla Control o déjame mostrarte las teclas de acceso directo. Enviar hacia atrás, Control, Soporte Izquierdo, traer hacia adelante contorno, soporte derecho, enviarlo totalmente a la espalda Control de Mayús Soporte Izquierdo. Para éste, vamos a ir paso a paso, enviados hacia atrás. Por lo que presiona Control Soporte Izquierdo, sólo va a seleccionarlo Controlar Soporte Izquierdo. Entonces voy al revés. Mira y siéntete y hazlo negro. O si vas a ser llegar al mismo color. Y tendrá cuatro ahí. También baje esto. Entonces no sólo veo esto. Ahora. Necesito tener este tipo de cuidados desear cosas, ¿verdad? Entonces lo que hago es hacer clic en rectángulo, herramienta de marquesina. Haga clic y arrastre. Ahora. Hazlo totalmente círculo. Bajar la opacidad. Subirlo a nuestra frontera. Y solo para hacer esto recto mantenga presionada Alt, arrastre esto hacia la izquierda o el arrastre es hacia la derecha. Pueden sentir y hacerlo negro. Asegúrate de que sea un 100 por ciento negro. Ahora, vamos a mantener presionada Alt y arrastrar esto hacia la derecha. Alt y arrastre esto hacia la derecha. De nuevo en la parte superior de estos mantenga pulsado Control y Shift bracket, soporte izquierdo hasta que va detrás de esto. Ahora, probemos el yo, haga clic en esto, bajemos la opacidad. Y vamos a dar click en esto para realmente bajar la opacidad. Entonces quiero ver exactamente qué está pasando. Haga clic en esta capa sílice. Ven aquí, aguanta Alt y Shift y arrastra desde el centro. Afilar la opacidad y la frontera política estratégica. Haga clic en este ícono. Comando D para duplicar el círculo de nuevo o eso apagado. Y así el hazlo desde el punto central. A lo mejor es demasiado grande. Vamos a dar click en este, elimínelo. Haga clic, mantenga pulsada la tecla Mayús. A lo mejor puedes hacerlo un poco más pequeño, lo cual es genial. Comando o control D. Sostén en Alt y Shift y hazlo más pequeño. Por lo que tenemos el punto central también. Ahora, un turno, haga clic en este círculo. Nuevamente, tenemos que restar esto del centro. Ahora restadlo. Se ha ido. ¿ Verdad? Ahora. Seleccionado, subir la opacidad al 100 por ciento seleccionado para pasarlo un 100 por ciento, seleccione éste como un 100 por ciento. Ahora, selecciona las partes izquierdas. No selecciono éste. Mantenga pulsada la tecla Mayús y haga clic en este icono. Por lo que sólo se seleccionan estos cuatro. Mantenga presionada Alt para copiarlo y arrástrelo hacia la derecha. Y mientras tanto, sigue sosteniendo Shift para ser una recta. Ahora estamos aquí. Haga clic en Voltear horizontal a lo largo de Shift para que sea una recta. Enfriar. Ahora solo echa un vistazo a esto. Ahora, hay algo encima de esto, que son dos de ellos porque copiamos de éste, simplemente contratamos no es necesario. Simplemente voy a borrar que puedo bajar la opacidad. También dar click en este , abajo, uno, izquierda, uno abajo para poder ver lo que hay aquí así como la presa porque ésta está encima de todo lo demás. Tú así que en realidad es un truco muy cool. Mira el círculo en el Alt y Shift, arrástrelo hacia arriba. Entonces este es nuestro círculo, ¿verdad? Y el color es borde amarillo. Bajar la opacidad. Entonces si hago doble clic en esto y obtengo cada uno de los puntos, ¿verdad? Ahora, haga doble clic en esta esquina. Se va a comer esto. Ahora, mantenga presionada Alt y haga clic en esto para obtener este mango. Haga clic y arrastre este mango, este punto. Nuevamente, mantenga presionada Alt, haga clic en este mango. Da click y pon esto aquí y sigue sosteniendo Alt. Está bien, ahora, lo cual es muy guay. Y mantenga presionada de nuevo Alt y arrastre a la izquierda que alt, etiqueta la izquierda y Alt. Y luego recoger la opacidad. Ahora, haga clic en todo lo demás para estar ahí arriba. Opacidad también, ésta. Sube la opacidad y EA vamos, Vamos a ver dónde estamos ahora mismo. Y son muy geniales. Está bien. El resto de ellos son simples y engreídos. Probemos con este. Probemos un rectángulo aquí por ahora. Aquí y aquí. Elige un color que sea amarillo o naranja, amarillo. Ahora, para éste es un círculo. Ven aquí y prueba silicio que Alt y Shift, baja la opacidad para que sea del mismo tamaño. Y tendrá borde, color, picker, amarillo, 100 por ciento. Ahora, necesitamos combinar estos dos juntos. De lo que hay algo fuera de aquí, sólo voy a traer este término va a desaparecer. Enfriar. ¿ Qué pasa con este rincón? Aguanta Alt y baja esta esquina para conseguir esta línea. Mantenga pulsado el turno, haga clic en el círculo para que ambos seleccionen y haga clic en Agregar. Por lo que están unidos con un alt, lo arrastran, y mientras tanto, mantenga pulsado Shift para ser una recta. Ven aquí y haz clic, Flip Selector de color Horizontal, y escoge el color y arrástralo y ponlo aquí. Puedes usar tus flechas, teclas de flecha izquierda. Ahora, mantenga pulsado el control y haga clic en este pequeño ícono. Mantenga presionada Alt y arrástrelo aquí. Se ve esta caja limitadora, la línea azul. Significa que aún estás dentro del grupo. Por lo que Comando o Control X para copiarlo. Haga clic fuera. Ahora estamos fuera de este grupo. Presiona Comando Ctrl V. Necesitamos porque necesitaba el círculo, porque quiero ponerlo aquí. Pero tengo que ponerlo detrás de esta forma negra. Entonces, ya sabes, ya Controlar Bracket Izquierdo hasta que vayas hacia abajo. Y estás detrás del recolector de color y hazlo mejor. Mantenga pulsado Alt u Option y arrástrelo hacia la derecha. Usa tu tecla de flecha para estar totalmente bien, y esta es blanca. Otra vez. Tiene que sangrar el control de espalda y la tecla de soporte izquierdo. Nuevamente, Control F enfriar rápidamente. Bueno entonces Alt y turno a la derecha. Y esto es amarillento. Alt y Shift arrástrelo hacia la derecha. Y éste es de color rojo. Entonces seguimos haciendo esto. Entonces aquí abajo, solo voy a escoger un recolector de color aquí. Y si utilizas tu espacio para un ya que solo puedes moverte o simplemente en medio del ratón si eres todo como haz click en él y simplemente puedes moverte. Control Soporte Izquierdo puede ir hacia atrás llamados turnos. Haga clic en color, mantenga pulsado Shift, haga clic aquí y hágalo blanco y Alt Shift también. Sólo lo pondré aquí. Mantenga pulsado Control paréntesis izquierdas para que pueda ir hacia atrás. Me desplazaré a la derecha. Turno. Podemos colorear. Escoge un color. ¿ Y estos dos? ¿ Ya lo sabes? Todo turno. Arrástrelo hacia la derecha. Haga clic en esta herramienta de rectángulo y simplemente haga clic aquí. Esto está en la parte superior, por lo que necesita que esto vaya a desaparecer o abajo Shift y haga clic en este círculo y restar. El color es solo cian, Alt y Shift y arrástrelo hacia la derecha. Así que ábrela y voltea horizontal. Sólo ven aquí. Y aquí. ¿Y estas líneas de aquí? Hay un truco genial para hacer eso. Permítanme simplemente dar clic aquí. Este es un rectángulo el cual va a ser borde totalmente negro. Tengo que ponerlo al revés. Yo sólo puedo arrastrar esto y simplemente ponerlo aquí detrás de todos ellos. Todas las capas. Ahora baja la opacidad para que veamos qué está pasando. Y vamos a usar este, mantenga presionada Alt y simplemente arrástrelo aquí. Y hagámoslo blanco. Otra vez. Arrastraré esto a la derecha. Arrastra esto hacia la derecha, vuelta horizontal a lo largo de Shift Alt y desplaza hacia la derecha. Pero tienen esta zona de fondo, así que tenemos que cortarla. Otra vez. Simplemente se puede dibujar un rectángulo. Haga clic aquí. Pero queremos eliminarlos todos como lo mismo. Por lo que significa que tenemos que unirnos y hacer clic aquí, mantener pulsado, desplazar , hacer clic, hacer clic, Agregar juntos. Entonces los R1, ahora están unidos. Haga clic en el rectángulo o turno de almuerzo, haga clic en el círculo y menos. Y entonces el de arriba es fácil. Aquí, rectángulo. Y aquí vamos. Arrastre esto hacia abajo hasta un borde. Ahora abajo Alt, haga clic y arrastre la esquina, alt click y arrastre la esquina. Y veamos qué has hecho. Seleccionado mantenga presionada la tecla Mayús y arrástrela hacia la mano derecha. ¿ Qué tan guay es eso? Pero estos dos tienen que estar atrás. Por lo tanto, selecciónelos a ambos. Control de pertenecer y llave de corchete izquierdo. Baikal. Esto se va a seleccionar y la opacidad debe ser del 100 por ciento. Y tenemos algo muy, muy interesante. Él va a ver este. A lo mejor puedo, ya sabes, a veces solo arrastremos esto con un viejo de una esquina. Puedo agregarle más. Todos. De un núcleo. Puedo agregarle más. Es más conveniente. Ahora, confíen en mí chicos. Ustedes pueden crear cualquier cosa en Adobe XD muy fácilmente. 7. Trabajar con tipos: Empecemos a trabajar con texto en obesidad. Sólo voy a dar click en la mesa y presionar Control 3. Entonces para ser exactamente, y es un spot. Ahora, solo voy a dar clic en la mesa y crear algo como esto. Por ahora, prestigio y tipo. Me encanta Adobe XD. Está bien. El primero aquí que vamos a buscar es el espaciado. Lo puse en un 0. Y si hago clic aquí y uso mi tecla de flecha superior, puedo aumentar las letras espaciadas. Si uso mi tecla de flecha abajo, disminuyo y menos espaciado. Inicialicemos cool, cool. Menos 60. Muy bien, este es el primer paso para entender estas dos opciones. Yo sólo voy a ir aquí y sólo copiar esta línea de texto, traerlo aquí. Y tratemos de usar esto para explicación. Demasiado grande, pego algo que es demasiado grande. Vamos a arreglarlo. Ponga esto en 10, todavía está totalmente encima el uno del otro. Este es el espaciado entre letras, interlineado. Porque mi jerarquía superior, así que juega alrededor de ella. Esto es genial. Y yo incremento el espaciado entre letras para que sea más legible. Y arrastra esto hacia la derecha. Entonces si lo arrastro hacia la izquierda, gritando así, así que arrástrelo hacia la derecha. Van a ser sólo tres líneas. Basta con echar un vistazo a este. Esto no está pasando nada, ¿verdad? Pero si hago clic aquí y justo, solo quería espaciar y presionar Control V y solo copiar el superior. Simplemente, veamos qué pasa. Si vengo aquí y uso esta tecla de flecha hacia abajo. Este va a ser el espaciado de párrafos. Si tienes dos párrafo, algo así. Si tiene dos párrafos, y haga clic en esto y aumente el espaciado entre párrafos. Pero éste está entre las líneas lo que va a afectar también al párrafo. Está bien, ¿ahora qué más? Yo sólo voy a aferrarme a Alt y arrastrar esto. Ya sabes, todo esto, ¿verdad? Si puedo hacerlo mayúscula, minúscula Z, la primera letra mayúscula Z. Y solo puedo seleccionar el XD y éste va a la parte superior o inferior. Esto está subyacente. Y esto es igual que un O prime. Ahora vamos a la frontera. ¿ Qué es? Usemos el campo cambiará el color a azul y tal vez lo cambié al blanco y solo le daremos algún borde. Y sólo echa un vistazo. Simplemente vamos a seleccionar esto y volver atrás y sólo echarle un vistazo. Me encanta Adobe XD, solo con una frontera. Se puede cambiar el color a negro o tal vez azul, ¿verdad? Como ven, tenemos algo llamado aquí sampler. Cómo podemos agregar desenfoque a esta imagen. Por borrosa, que está aquí, tengo que poner algo detrás de ella. Entonces simplemente ponen algo, tal vez un color detrás de él. Por lo que haga clic derecho, envíelo a copia de seguridad y solo échale un vistazo. Para éste, lo vamos a seleccionar y desmarcar el borde. Seleccione el texto, arrastre esto hacia abajo. Puedes agregar actitudes iniciales, puedes agregarle sombra de gota, y también podemos añadir desenfoque de fondo. Si se pone una lista de comprobación, sólo echa un vistazo y arrastra esto un poco hacia abajo. Ves, esto va a ser muy, muy interesante. Pero me levanto y abajo, veo que está totalmente borroso. Y solo puedo jugar con esta capacidad, esta borrosa y más borrosa para hacer clic en el fondo y jugar con el color. Ves quizá el efecto, el efecto borroso. Entonces de vuelta si cambio el color de fondo, el color va a ser cambio también. 8. Crea tipografía con sombras: Ahora es el momento de crear este hermoso efecto en Adobe XD. Está bien, sólo voy a crear una mesa de trabajo. Haz click y siéntete y hazlo totalmente negro. Y empecemos. Y vamos a ir una por una letra. Presiona S. Ahora, haz clic y arrastra y hazlo un poco más grande. Simplemente me voy a desplazar hacia abajo, no necesito la frontera. Sólo éste. Ahora. Sostenga Alt y Shift y arrástrelo hacia la derecha. riesgo va a llamar a esto h Pero necesitamos agregarle sombra, ¿verdad? ¿ Cómo lo hacemos? En primer lugar, agregamos un poco de sombra interior con la Y. Tal vez uno o tres esté bien. Este tal vez 10. Iniciativa. ¿ Qué pasa con la sombra de gota? Juega con sombra porque quieres agregar la sombra a la izquierda, a la izquierda o a la derecha, usa el valor x. Yo sólo voy a poner 10 o menos 20 para ir a la izquierda por la sombra y la y debe ser 3000. Ahora vamos a hacer clic en el icono de la sombra de soltar aquí y arrastrar esto hacia arriba la opacidad para agregarle más sombra. Por lo que significa que se pone en menos 10 sería suficiente. Ahora, la borrosa, Va a ser 10. Ahora, echa un vistazo a un altar y opción ir a la derecha. Esto va a ser doble clic en él, presiona Shift a a b mayúscula. Ahora volveré a desplazar, arrástrelo hacia la derecha, haga doble clic en Shift D. Llamo al Alt y Shift, arrástrelo hacia la derecha. Dirigido. Shift O. Arrástrelo hacia la izquierda. Un poco más cool. A lo mejor aquí, bonito. Alt Shift arrastre hacia la derecha y desplace W para mantenerse al día. Y solo echa un vistazo a bellamente, creamos este efecto cool en Adobe XD. Muy bien, haz algo de práctica cuando seas realmente bueno en ello. Ve a la siguiente lección, que es trabajar con imágenes. 9. Enmascarar imágenes en una forma en Adobe XD: Cómo creamos esto, cómo tenemos default dentro de estos hermosos artículos. Hay dos formas de hacer esto. esto lo llamamos enmascaramiento. En primer lugar. Probemos esto. Traigamos aquí las imágenes. Y probemos esto. Uno. Puede rastrear esto y simplemente ponerlo aquí. Va a ser enorme. Mira. Por lo que estoy sosteniendo turno y hago inteligentes estos diversos. Pero tenemos que añadir, poner esquinas a su alrededor. Hay dos formas de hacer es este hardware, que es enmascarar, desinterpretar. Haz click en la Herramienta de marquesina Rectángulo y solo haces una selección a nuestro alrededor. ¿ Verdad? Ahora. Hacer las esquinas redondeadas, tal vez alrededor de las 30. Ahora, aquí está la parte complicado. Estoy seleccionando la selección. Tienes que seleccionarlos a ambos. El de arriba debe ser el que queremos poner la imagen dentro. Muy bien, haga clic derecho Máscara con forma. Y recuerda el atajo Shift Control M, y mira qué pasa. Lo mismo. Ahora intentemos hacer de la manera fácil. Haga clic en una herramienta de marquesina de rectángulo. Haga clic y arrastre. Hacer la esquina alrededor de la primavera las imágenes de nuevo. Ahora sólo tienes que arrastrar la imagen y ponerla dentro. Como dice, copia, solo déjalo ir. Este es el fácil, pero éste se está quedando con la frontera. Simplemente hay que desmarcar esto. Y eso es todo. ¿ Y éste qué? El mismo escenario. Haga clic en el icono aquí. Y sólo voy a arrastrar algo como esto. A lo mejor quiero este. No necesito la frontera. Trae las imágenes. A lo mejor éste solo arrástralo y tírelo por dentro. El genial al respecto es que solo puedes hacer doble clic sobre él y simplemente puedes moverlo. Puedo hacerlo un poco más grande, tal vez aquí. Y haga clic afuera. Lo mismo con éste. Basta con hacer doble clic a su alrededor y seleccionar esta imagen, Alt y Shift y hacerla un poco más grande. ¿ Y este qué tal? No tenemos una forma como esta. Haga clic en nuestro triángulo. Ven aquí, y aquí tenemos algunas opciones. Tus jaulas de flecha, súbelo. Se puede cambiar el tamaño, algo así. Puedes ir a tus imágenes y esta vez lo es, arrástrala y soltarla dentro. Mira, ahora, haz doble clic sobre él y simplemente muévelo hacia la derecha para estar centrado. El exterior, haga clic en este pequeño ícono aquí. Echa un vistazo a la frontera, y eso es todo. ¿ Y estas dos imágenes? Yo puedo traer esta imagen. Va a ser enorme, ¿verdad? Volviendo atrás, estoy sosteniendo turno y hacer esto muy pequeño en un poner esto aquí. Yo sólo voy a subir para que ustedes vean a qué me refiero. Entonces cómo ponemos una forma borrosa encima de una imagen. Por lo que es bueno agregarle texto. Es muy fácil. Simplemente marquesina rectangular al radio alrededor de ocho está bien. Fronteriza. Está bien abajo y haga clic en desenfoque de fondo. ¿ Verdad? Haga clic en él y asegúrese de que la cantidad sea menor. Para ver más de la textura bajo una imagen real desde el fondo. Y puedes jugar con el cuerpo borroso y pegajoso. Una vez más, esto es agradable. Cómo podemos hacer que una imagen borrosa. ¿ Verdad? Haga clic en esto para el Alt y Shift, arrástrelo hacia la derecha. Y aquí, basta con hacer click en este ícono aquí y objeto desenfocar. Si hace clic en él, la cantidad es de cinco, bájala 1, 2, 3, o C. Eso por lo general es 1 o 2. Y así es como trabajamos en imágenes. En Adobe XD. Hay muchas cosas que cubrimos en el futuro. Asegúrate de hacer algunos chicos de práctica sin práctica, no vamos a ninguna parte. Después de hacer un poco de práctica. Y eres realmente bueno jugando con el texto y las formas e imágenes en Adobe XD. Vamos por nuestro proyecto. 10. Asignación crea una página de perfil de Instagram para la cuadrícula repetición de Tablet: Muy bien, Tratemos de recrear esto en Adobe XD. En realidad, es muy, muy cool y solo voy a dar clic en este ícono aquí. Haga clic aquí y arrastre una caja. Simplemente voy a dar click en mi selección y dar click en ésta para ver cuál es de dos a cinco. La altura difiere para, haga clic diferir para lo cual es fresco. Por lo que 23 el mismo. Muy bien, empecemos desde arriba. Volvamos a mi carpeta de imagen de aire y lo logo de Instagram. Sólo voy a arrastrarlo y soltarlo aquí. Es demasiado grande o abajo Alt y Shift y hacerlo más pequeño desde el centro. Y sólo lo voy a poner aquí. Tomemos la línea aquí y mantengamos pulsado el turno hacia el lado derecho. Ya ves que el tamaño es uno. Puedes ponerlo a la mitad. Haga clic en 0.5. Por lo que el tamaño va a ser la mitad. Ahora, necesitamos cambiar el color tal vez con un azulado. Ahora, cómo podemos crear esto muy rápido, vamos a crear uno de ellos. Entonces solo voy a hacer clic en mantener presionada tecla Mayús y hacer una de ellas. Vamos adentro y pinchemos en este pequeño rincón para tener frontera. Por ahora sólo voy a quedarme con el balón y sólo considerar algo. En Adobe XD, tenemos algo llamado Repetir Grid. Basta con dar click en él. Al hacer clic en él, obtienes dos asas. Simplemente arrástrelo hacia la derecha para ver qué pasó. Voy a copiar todo para ustedes chicos. Si pones tu ratón entre ellos, solo podemos cambiar el espaciado arrastrando hacia la derecha y hacia la izquierda. Yo quiero poner el espaciado de cinco. Ahora, arrastra esto a la derecha. Ahora, hagamos lo mismo con este. Pon el ratón aquí y haz que este espaciado cinco dragón nuevo arriba. Y la línea de los árboles es suficiente. Es click afuera. Yo quiero sentir esto con las mismas fotos. ¿ Cómo lo hacemos? Necesitamos un plugin. Es necesario instalar un plug-in en otras semanas, haga clic en este pequeño ícono aquí, que son los plugins. Y no deberías tener nada aquí. Basta con dar click en este pequeño signo más. Al hacer clic en él, obtienes este panel, la App de escritorio de Creative Cloud. Haga clic en Todos los plug-ins, una búsqueda de Caras de UI, y haga clic en Instalar aquí se ve a un historiador. Cuando esté instalado. Se puede cerrar éste porque sólo va a estar apareciendo en el panel Plugins. Haga clic en Caras de UI. Dice solo haga doble clic y seleccione una de ellas. Por lo tanto, haga doble clic y seleccione uno de ellos. Para que puedas decirles qué fuentes vas a usar. Puedo usar un splash y pixeles. Seleccionar foto. Yo lo puedo decir al azar llenar 24 sigue restantes para mí y dar click en Aplicar. Por lo que la naturaleza aleatoria lo va a llenar con esto y ver qué cool es eso. No necesito el borde Haga doble clic. Ahora veamos qué pasa. Si desmarco la frontera se va a cancelar para todos ellos. ¿Y qué más? Puedo agregar esta carta yo aquí y ver qué pasa. Cualquier cosa que le haga a esta sola imagen se va a afectar en todos ellos. En y en tu archivo de proyecto, tienes algo llamado iconos de material, iconos de material de Google. Y esto va a buscar aquí algo llamado iones. Simplemente lo vamos a seleccionar y copiar los ojos y un poco de Control V, mantenga pulsado el turno y hacer estos pequeños. Yo quiero ponerlo aquí. Y quiero hacerlo blanco. Pero la cosa es que quiero que me agreguen a todos ellos. Lo que haré es que solo voy a dar clic en Control de Comando X. Ahora, haga doble clic. Ahora voy dentro de uno de ellos. Ahora, manda y controla V para pegarlo. Mira, lo está agregando a todas las imágenes. Ahora arrástrelo y sólo ponlo aquí. ¿ Y qué tan genial es eso? ¿ Qué más? Tenemos aquí en realidad? Entonces esto son más espacios. Tenemos sombra de gota aquí. Por lo tanto, haga doble clic en uno de ellos. Añadamos sombra de gota. A lo mejor la y es uno y b es dos. Pero el color de sombra gota debe ser tener más intensidad. Y el color, tal vez cambiamos el color alrededor de algo así como. Lowish, algo más fresco. Pero tengo algunas líneas aquí, ¿verdad? Entonces puedo hacer doble clic aquí y simplemente arrastrar esto hacia la derecha. Y sólo echa un vistazo. Echa un vistazo. Si nos aflojamos aquí, haga clic aquí y el tracto es a la derecha un poco más. Y ahora echa un vistazo a esto. Si hago clic aquí, sólo puedo moverlo para que sea más agradable. ¿ Y éste qué? Kate y un círculo y mantenga Alt y Opción. Eso es todo. Se puede utilizar el mismo método chicos, que se va a plug-in. A lo mejor esta vez sólo Unsplash. Ahora selecciona foto. Y puedes escoger cuatro o como éste y aplicarlo. Correcto. Ahora, Cambiemos el color del borde. El azul lo va a cambiar a este color. Agradable. ¿Qué más tenemos aquí va a cerrar eso para ellos. Impuesto seguidores siguientes, t a 1 seguidores. Por lo que puedo dar click en Color y cambiarlo y volverlo un poco loco. Y ponlo aquí, ya ves que va a estar centrado todo turno de tiempo, arrástrelo hacia la izquierda y esto va a ser post. Y ves que este espaciado va a estar cayendo. Ahora, ¿qué pasa con el espaciado? Simplemente puedo seleccionar estos cuatro y hacer clic en este icono de capa aquí para que pueda hacer el espaciado igual. Está bien, esto es bonito. ¿ Y éste qué? Entonces necesito otra línea aquí, así que sólo voy a copiar esta porque soy perezoso o el Alt y Shift, arrástrela hacia abajo. Eso es todo. ¿ Qué pasa con esta imagen? Seleccionemos el rectángulo. Va a venir aquí e interactuar está abajo. A lo mejor cambiar la esquina de la misma para que se alinee. Sólo tienes que arrástrelo para que obtengas esta línea es línea. Ahora llevemos las imágenes. Voy a arrastrar esto y soltarlo aquí. No necesito la frontera. Simplemente bien. Ahora, vamos a añadir esto arriba. Ya sabes hacer esa pierna derecha un rectángulo. Se puede arrastrar borde, radio demasiado peso para que el fondo sea borroso. Haga clic en desenfoque de fondo. Así que arrastra esto hacia abajo. Juega con él hasta que estés contento con él. Creo que estoy contento con este. Tenemos que tener algunos iconos aquí. Volvamos al icono de Google. Simplemente al azar, sólo voy a añadir algo de esto. Puedes ir y simplemente escoger unos mejores iconos. Copia. Pegar, turno largo para hacerle sonreír. Ahora, pon esto aquí. Haga clic y arrastre este , y éste. Selecciona cuatro de ellos. Asegúrese de que el espaciado sea igual. Una línea desde el centro. Está bien, genial. Ahora de nuevo, selecciona cuatro de ellos. Y vamos a llenarlo de blanco. Ahora bien, ¿cómo agregar el texto aquí? Haga doble clic aquí, presione Control C. Ahora, ven aquí. Se puede hacer clic y arrastrar. Entonces nuestro texto va a estar justo dentro. Ahora, Control V. Ahora, dar click en él. Cambia el color de relleno a negro. Ahora, necesitamos agregarle más espaciado. ¿ Todo bien? Este, por lo que el look jerárquico superior va a estar siempre dentro de este cuadro limitador, que es muy cool. ¿ Y este qué pasa? O bien cambia, tú, haz clic en Texto de nuevo, con un solo clic. Sé el cambio. Tú, ¿verdad? Correcto. Ahora. Cambia el color a algo así. Debes estar arriba para poder hacer click en la parte superior. Está bien, eso es todo. Si mantengo pulsado Shift y lo arrastro, puedo ponerlo en el centro. El renglón. Significó que esto está centrado. Correcto. Ahora, fácilmente, creamos nuestro proyecto ahora presiona Command o Control S para guardarlo. Ahora es momento de finalizarlos, nuestro diseño, lo primero que puedo ver es que no están alineados. Por lo que significa que puedo hacer clic aquí y abajo Shift y muy poco a poco bajar esto. Puedo seleccionar todos estos y arrastrarlo un poco a la izquierda para solo alinear este bonito Instagram también. Enfriar. El de arriba. Simplemente voy a eliminar esto o hacia abajo, Alt y Option y arrastrar esto hacia abajo. Agradable. Este debería ser todo capital. Por lo que sólo vamos a dar click aquí y dar click en la capital. A lo mejor puedo arrastrar un poco esto. Diferentes colores, un poco más oscuros. Y eso es todo. Estás totalmente bien. Esto, tal vez pueda simplemente mover todos estos para derivarlo para estar centrado. 11. Cómo usar elementos de estilo de personaje en la biblioteca o panel de recursos: Trabajemos profesionalmente en Adobe XD aprendiendo a usar bibliotecas, o se solía usar para ser panel de Activos, pero en este momento se ha cambiado el nombre a bibliotecas. Aquí tenemos tres opciones, colores, carácter, estilo, y componente. Estoy tratando de crear mi aplicación móvil con múltiples imágenes y obras de arte. Va a ser mucho de esto puede ser un 1000 de esto. Pero, ¿cómo trabajar profesionalmente? A lo que quiero decir es que sólo estoy abajo Control y haciendo clic en este pequeño ícono para ir dentro de esta caja, veo el cuadro de límites. Por lo tanto, mantenga presionada Comando y Control y haga clic en el color que desee. Ahora, haga clic en signo más. Ahora he agregado esto. Puedo hacer doble clic en él y puedo simplemente escribir B seguro para Bitcoin. Yo estoy sosteniendo Control y click y este morado. ¿ Y estoy agregando este color también? Sólo voy a llamar a este botón, por ejemplo. ¿ Verdad? Ahora. Yo estoy tratando de agregar este color a éste también. Presione el control y seleccione éste. Y a tan solo un clic en esto. He añadido este color. El de nuevo, he añadido este color, por lo que va a ser el mismo nombre y los mismos colores. Ahora bien, si cambio de opinión, si quería cambiar este color a otra cosa, solo echa un vistazo, haz clic derecho y el color que quieras cambiar. Presiona, Edita, y simplemente cámbiala y ve que va a cambiar en cada otro color que había estado usando este color, ¿verdad? Echa un vistazo. Todo esto ha estado usando este color es Comando o Control Z para volver atrás. ¿ Cómo son los personajes? Basta con echar un vistazo a este texto es diferente a éste y éste, ¿no? Pero quiero que todos estos textos sean iguales. Entonces lo que hago, hago clic en este texto de Bitcoin y hago clic en este signo más. Ahora estoy seleccionando éste y solo tienes que hacer clic seleccionando éste y dar clic en los caracteres como y siempre voy a cambiar el nombre para que sea código de cuatro bits. Por ejemplo. Ahora, sé que todo el nombre va a ser del mismo tamaño, la misma familia, la misma fuente. Y no me preocupo por ello. Yo también estoy agregando este color. Yo estoy seleccionando esto. Yo también estoy agregando este color. Pero hay un problema. Yo quiero agregar este color a este, pero también quiero tamañar y fuente ser igual también. Entonces en este escenario, necesito hacer esta matriz de caracteres también. Basta con echar un vistazo. Si solo voy aquí y agrego este color, se agrega la corriente, pero el tamaño de la fuente no va a ser el mismo. Entonces lo que hago, presione Comando o Control Z para volver a la normalidad. Ahora, echa un vistazo. Yo soy silicio este y estoy agregando una diapositiva de personaje. Ahora, cambiemos el nombre a número. Ahora, sólo echa un vistazo. Si vengo aquí y selecciono éste y click y éste va a ser lo mismo que éste. ¿ Y éste qué? El mismo? Y lo genial al respecto. Si cambio de opinión y quiero cambiar la fuente y el color, puedo hacer clic derecho. Puedo editar la confección de colores, tal vez hacer que se publique, ¿no? Y también qué pasa con la fuente? Puedo cambiar la fuente a. Todos ellos van a estar cambiando al mismo tiempo. Esta es la forma en que trabajamos como diseñador profesional y Adobe XD. ¿ Qué son los componentes? ¿ Ahora? El componente es muy fresco. Basta con echar un vistazo a este un día convertirse en logo. Por ejemplo. Necesito este logo en todas partes. A lo mejor estoy sosteniendo Alt y Option y Shift y arrastre esto para copiar esto. Tengo muchos de estos Bitcoin. Si cambio de opinión, quiero cambiar este logotipo, que sí tienen que ir aquí y cambiarlo uno por uno. No tiene sentido. ¿ Y si quiero cambiar el color por lo que necesita así que qué pasa con el otro? Tienes que ir uno por uno y cambiar todos los colores. Entonces esto no es realmente bueno en diseño porque tenemos miles de cosas que cambiar. Por lo que la mejor manera es solo mantener presionada Control y clic en este ícono y convertirlo en un componente. Y sólo voy a llamar a esta API. Basta con echar un vistazo a este. Tengo que quitar todos estos también. Ahora, hay dos formas en que podemos hacer esto. Podemos hacer click en esto y arrastrarlo y ponerlo aquí. Lo cual no es buena idea porque quiero ser exactamente el mismo lugar. Por lo que quiero borrarlo. Presiona Eliminar en tu teclado. Da click en este pequeño ícono aquí, pulsa Comando o Control C para copiarlo. Ahora, selecciona el superior, el Arthur presiona Comando o Ctrl V, para copiar en el mismo lugar. Nuevamente, el control V para copiar en el mismo lugar. Ahora, ¿por qué hacemos esto? Porque si cambio de opinión, si hago clic aquí y tal vez quiero cambiar este color a otra cosa y echar un vistazo. Todos los colores están cambiando. Y otra forma fresca por qué hacemos esto. A lo mejor en el futuro, cambié de opinión. Quiero añadir este letrero a todos estos Bitcoins. Lo que hago, déjame sólo aguantar a Alt y copiar estos. Sostenga el turno y hazlo un poco más pequeño. Agradable. Ahora, echa un vistazo a esto. Estoy dando click en este signo más. Ahora, es un terrier. Yo quiero cambiar todos los Bitcoin porque todos ellos están combinados con logo italiano. Simplemente voy a dar clic en el Ethereum y arrastrarlo y ponerlo en una caja de CDS. Déjalo ir. Ver. Todos ellos están cambiando y son del mismo tamaño, del mismo lugar. Presionemos Comando o Ctrl Z para volver atrás. Correcto. Ahora ya sabes por qué estamos usando esto. Ahora puedo hacer clic en esto y a, B. Todos ellos están cambiando. Ahora ya sabes por qué usar colores, caracteres, diapositiva, y componente. Siempre cuando diseñamos, siempre tenemos que calificar nuestra paleta de colores. Es así como creó. O si quieres todo el compilador que estás usando el tablero de arte, puedes dar click en la pantalla y simplemente dar click en el signo más. Todos ellos se van a sumar. Entonces solo recuerda, cambia el nombre para que sepas dónde están. A lo mejor esta es la fecha, este es el título de Ethereum. Esta línea es la línea. Este son los precios. Entonces se te ocurre la idea. Es así como se trabaja con esto. También podemos hacer algo más en este. A lo mejor éste. Este se va a repetir mucho. Por lo que estoy manteniendo pulsado Control y haciendo clic y este número cambiará para ser estos dos están seleccionados. Entonces Control Shift, soy de silicio 28 y hago estos componentes, ¿verdad? Volvamos atrás. Ahora. Vamos a dar click afuera, dar click en esto, y arrástrelo y ponerlo aquí. Yo quiero ponerlo aquí. El camino fácil es hacer clic derecho Editar componente principal. Y estoy sosteniendo Control y clicando y este color, voy adentro. Estoy cambiando el color a otra cosa. Por lo que también se va a cambiar aquí. ¿ Y estos números? Es lo mismo, tal vez el valor del tamaño del elemento a 15, 14, C también está cambiando. Entonces esto va a ser muy fácil. Y cuando tenemos muchas obras de arte, nos hace la vida mucho más fácil, sobre todo con el cliente que cada día está cambiando como la mía en el futuro en nuestros proyectos. Hacemos mucha práctica en esto. No te preocupes por ello. Esto fue sólo una revisión de cómo usamos los colores, personajes como componentes. 12. Crea un diseño responsivo: Tienen que hacer que todo sea receptivo. En Adobe XD, tenemos este encabezado de sitio web y tiene que ser responsive. Significa que si arrastro esta animada una sonrisa para la vista móvil, todo debería venir a la izquierda. Pero en este caso, no pasó nada. Presione Command o Control Z. Pero si selecciono mis mesas de trabajo, el azul en la parte superior y haga clic en redimensionar responsive. Ahora, echa un vistazo. Si arrastro esto a la izquierda. Funciona. Entonces así es como funciona la respuesta en realidad, ¿verdad? Está bien, déjame presionar Comando Z. Ahora, déjame explicarle cómo funciona. Voy a borrar estos dos. Ahora mismo Vamos a crear un botón. Sólo voy a dar clic en un rectángulo, arrastrar de izquierda a derecha. Arrastremos esta esquina para que sea botón muy redondeado. Haga clic en el color de relleno, se convirtió en color verdoso, borde más t. Y ponlo aquí, llame a este lado. Yo quiero hacerlo un poco más grande. Yo sólo lo voy a poner aquí. Haga clic en esto. Y es automáticamente va a ser un redimensionamiento sensible. A ver. Si lo arrastro y lo hago más pequeño. Se va a cambiar. Este va a hacer todo sensible dentro de la página. ¿ Y si quiero que este sea receptivo? Significa que si quiero arrastrar esto, estos textos de inscripción deben estar siempre en el centro. ¿ Cómo hacer que eso suceda? Presionemos Control Z. Debe agruparse primero, seleccione ambos. Control G. Ahora, si hago esto a la izquierda o a la derecha, si está agrupado, Va a estar siempre en el centro. Ese es el truco. ¿ Verdad? Déjame, déjame hacer esto más grande. Y esto va a ser exactamente así. ¿ Y éste qué? Si selecciono este y quiero hacer esto más pequeño, quiero ser igual. Pero lo mismo. Agrupar todo, Control G. Ahora, si hago esto como pequeño, c, todo va a estar en la misma posición. Apenas la imagen va a cambiar. Muy bien, este fue un redimensionamiento de respuesta muy simple. Ahora, ¿qué pasa con este? Una barra de menús en la parte superior. Si arrastro esto y lo pongo a la izquierda, estoy perdiendo todo bien? Entonces esto no está bien. Entonces significa déjame simplemente copiar esto. Yo quiero mantenerlo aquí y asegurarme de que todos sean de control de grupo G. Ahora, hagámoslo otra vez y veamos qué pasa. Nada, ¿verdad? Porque después de que hagamos eso, tienes que hacer clic en redimensionar responsive. Ahora vamos a comprobarlo. Todo está bien, pero el texto va dentro Y y te vamos a mostrar una prensa Control Z para volver. Ahora, vamos a hacer clic en la barra de Menú. Después de hacer doble clic. Seleccionar bits, desplazar todo el texto. Ahora entrando en manual. Y ver aquí tenemos posición fija, significa ancho fijo y una altura fija. Yo reviso eso. Yo quiero dar click en esto. El alto cambia al tamaño de la pantalla. Mira esta pantalla. Esta va a ser una pantalla de tableta y esta va a ser una más o menos dada, pero aún así lo va a hacer bien, pero el tamaño está cambiando. Presione Control Z. Volvamos de nuevo. Selecciónelos, mantenga presionada, Mayús, selecciónelos todos, asegúrese de que se alineen desde abajo. Por lo que p están todos alineados. Ahora, quiero arreglar la posición aquí, la alineación en la parte inferior, para que no vayan arriba y abajo. Eso es una cosa. ¿ Y éste qué? Silicon, ¿éste? Y ve al manual. Tan arreglado con la gráfica y sólo tomar todos ellos, son Ramón ser arreglado, tal vez sólo el fondo. Entonces selecciona este y arrastrémoslo hacia la izquierda. Sucedió Cva. Muy interesante. Y así es como creamos un diseño web responsive. 13. Proyecto del mundo real: declaración de problemas: cómo conseguir el trabajo: Tenemos una oferta de trabajo de un cliente, y esto es lo que están pidiendo antagonistas. Tienen una librería llamada T book, y ya que algunas personas tienen tiempo para visitar y comprar el libro físico. Y también debido al bloqueo COVID-19, estamos pensando en crear una librería en línea. Estamos pensando que están pensando que significa que no estoy seguro al respecto. Este es nuestro trabajo convencerlos que hagan la descarga y tú eres la persona adecuada para ello. Quieren un sitio web y aplicaciones móviles para que cualquiera pueda pedir libro en cualquier momento. No tenemos ni idea del proceso. Por favor háganos saber lo que piensa y danos sus ideas y cronología. Entonces quieren nuestras ideas. Cómo convencer al cliente. Eres el mejor diseñador para hacer este sitio web y diseño de aplicaciones móviles. Ahora, te mostraré el secreto de conseguir cualquier oferta laboral fácilmente siguiendo estos pasos. En primer lugar, le estamos diciendo al cliente vía entender su problema. Declaración del problema. Esto es lo que respondemos al cliente. Con el mundo cada vez más competitivo, mantener un buen equilibrio entre la vida laboral ya es un reto. La gente está persiguiendo plazos, viajando por trabajo más a menudo, estamos atrapados en el trabajo, pasarán sus horas de oficina. En este proceso, no tienen tiempo suficiente para visitar las tiendas o bibliotecas de Buda para comprar o alquilar el libro. También debido al COVID-19, se habían clausurado bibliotecas y librería. Y la gente está de suerte ahora, por lo que la gente no puede comprar ni pedir prestados nuevos libros de las librerías. Por lo que el libro T se enfrenta a una pérdida financiera ya que sólo tienen fuera de línea porque las puertas. Muy bien, Ahora le dijimos al cliente que entendemos el problema. Y ahora entramos con la solución. Se nos ocurren las ideas, solución digital o un sitio web de comercio electrónico que puede hacer la presencia del libro en línea. Que el usuario pueda navegar por dos categorías diferentes de libros y dar toda la información de libros en línea sin visitar ningún otro sitio web. Significa que el tamaño de Europa va a ser completamente perfecto. Los usuarios también pueden comprar los libros a los autores favoritos y al género favorito. Y también proporcionamos entrega gratis o en efectivo. Esto depende de ti. Entonces ahora se nos ocurrió las ideas. Vamos al siguiente paso, que es el proceso de diseño. Entonces ahora le mostramos a nuestro cliente cuál va a ser el proceso de hacer este trabajo y cuánto tiempo va a tardar. En primer lugar, hacemos el descubrimiento. Significa investigación de usuarios de VDD, entrevistas a usuarios, análisis competitivo con moodboard. Entonces definimos, definimos personas del usuario, empatía, mapa de viaje del usuario. Entonces ideamos el flujo del usuario, clasificación de tarjetas, la arquitectura de la información. Entonces se nos ocurre el diseño, wireframing o baja fidelidad, alta fidelidad y prototipado. Entonces al final de la prueba, que es la conclusión de retroalimentación conceptos futuros. Los tres primeros van a ser UX y un 4 y 5 va a ser UI. Ahora, tenemos que enviarles investigación de usuarios. ¿ Qué es la investigación de usuarios? Nosotros les enviamos estas preguntas porque tenemos que decirles entendemos sus problemas y se nos ocurrió las preguntas. Entonces tienes que decirnos las respuestas. ¿ Cuáles son las metas, valores, y visión del usuario de su empresa? ¿ Cuáles son tus métricas brutas para los próximos cinco o diez años? Pero problemas ¿resuelve tu producto? ¿ Y qué tan viable comercialmente es? ¿ En qué estás tratando de ayudarlos a lograr? ¿ Quiénes son tus competidores? ¿ Qué te gusta de ellos? ¿ Cuál es la investigación que ya se ha hecho? ¿ Hay alguna restricción de diseño? En caso afirmativo. ¿Cuáles son? ¿ Hay alguna restricción tecnológica? En caso afirmativo, ¿cuáles son? ¿ Cuáles son los plazos para los proyectos? ¿ Cuál es el proceso de aprobación para el diseño? Y quién los estará aprobando. Después de que le hagas esta pregunta al interesado, se te ocurre un alcance de trabajo y cronología. El cronograma va a ser de ocho semanas. Hacemos el descubrimiento en paralelo. En la segunda semana definimos ideado, diseño y pruebas. Volvamos atrás y el usuario entrevista. Por lo que también le decimos a nuestros clientes, haciendo algunas de estas preguntas nuestros amigos para que se les presente una mejor idea, una mejor comprensión de cómo realmente gente lo hace y compre libros en línea. Esto es lo que estamos enviando al cliente. Por lo que estas preguntas de las entrevistas de usuarios y estas preguntas de la investigación de usuarios, vamos a volver actividad que estamos enviando de vuelta al cliente estas preguntas e ideas. Espere la respuesta. Si la respuesta fue sí, significa que podemos iniciar nuestro trabajo. 14. Qué es la estrategia de diseño de investigación de usuarios cómo crear una línea de tiempo de trabaj: ¿ Qué es la investigación de usuarios? Se trata de preguntas de entrevista a las partes interesadas. Incluso después de recibir un breve creativo para el proyecto. Realizar a un interesado entrevistas cruciales porque ayuda a tomar la decisión correcta, esperar, final, momento, decepción, y cambios para crear el producto adecuado. Aquí te dejamos algunas preguntas. Ya lo sabes. Cuales son la pregunta es. Entonces, por ejemplo, el primero, ¿cuáles son los objetivos, valores, y la visión de tu empresa? Reúne toda esta respuesta en un lugar llamado diseño, una estrategia. Intención ejecutiva. Este proyecto se trata de hacer usuario o sus libros de deseos. Los usuarios pueden navegar y también leer los libros de las elecciones. Además de eso, también pueden obtener información del autor al mismo tiempo. Además, pueden navegar libremente por libros como lo hacen en sus bibliotecas o en una tienda. Úsalo también puede leer la reseña por créditos superiores para elegir entre definidores, libros, colección, género o categorías. Entonces volvamos otra vez. Investigación de usuarios. ¿ Cuáles son las métricas brutas? ¿ Cuáles son los problemas? ¿ Cuáles son el punto de venta único? ¿ Quiénes son los usuarios? Todas estas respuestas va a estar aquí. Qué público objetivo, profesional trabajador, estudiantes, ama de casa, básicamente, todos los lectores activos de libros, género, masculino, femenino, transgénero no importa. Profesión trabajando o no trabajando ambas edades, todas las edades. ¿ Cuál es la tarea general? La tarea general es vender libros son add-on que usted dice puede navegar por diferentes secciones y categorías de libros y también puede leer el prefacio e introducción de cada libro en línea. Así que presta atención a los detalles y todo lo que diga el interesado y simplemente ponlo aquí. restricciones tecnológicas, adquierenrestricciones tecnológicas, Internet, teléfonos inteligentes . Un pueblo pequeño podría tener problemas de red, canales cruzados. Querían para todas las plataformas, iOS, Android, plataformas web. También puede funcionar en televisores, laptops y tabletas. metas de marketing o branding aumentan las ganancias para aumentar las ventas de libros y mantener la tasa de retención. Apalancar las redes sociales, las redes sociales es el Nuevo Mundo. Deberíamos dejar que la gente cree cuentas y hacerles compartir blogs, artículos y productos, y contenido de publicación en redes sociales. Para aumentar nuestra credibilidad, podemos escribir artículos, compartir videos, información, aplicaciones y servicios, referencias de usuarios. Podemos utilizar el programa de referidos para aumentar la conciencia de la marca. Gran competidor, libros de Amazon, comprar libros, India. Por lo que comenzó y presentar en línea. Ahora. Nuevamente, todas las respuestas y investigación de usuarios va a ser en dos lugares. Uno, en el diseño de estrategia. Volvamos otra vez y también en un ámbito de trabajo y cronología. Entonces después de toda esta respuesta, se nos ocurre las semanas y la duración adecuadas del proyecto, y ponemos todo aquí. Descubre las entrevistas de las partes interesadas que ya hicimos. Después vamos por entrevista de usuario, investigación de usuarios o investigación competitiva. Después definimos, definimos metas de usuario, metas negocio mediante la creación de atributos de marca, personas de usuario, C, j, m, o mapa de viaje del cliente y mapa de empatía. Creamos cada detalle. Esta plataforma los chicos no se preocupan por las ideas. Crear flujo de usuario, clasificación de tarjetas y arquitectura de información de posibles características y secciones a agregar. Después vas a Design, View o service sketch, wireframing, que es diseño de baja fidelidad. Vas por el diseño de alta fidelidad y el prototipado final. Después hacemos pruebas y retroalimentación, probando prototipos, obteniendo retroalimentación, ejecutando mejoras, presentación final. 15. Cómo hacer una entrevista de usuario crea la visión de reunir: crea la visión de reunir: crea: ¿ Qué son las entrevistas de usuarios? Análisis cualitativo. Entrevisté a algunos de los amigos y familiares que aman leer libros y también a personas que son estudiantes y líderes pasivos. Los entrevisté a través videollamadas y llamadas telefónicas usando Zoom, WhatsApp y lo conseguirás hacer por COVID-19. En total, 11, nueve participantes. Cual tuve la oportunidad de hablar y hacernos un poco de visión sobre sus retos y motivaciones. A continuación te presentamos algunas preguntas generales. ¿ Cómo describirías tu día típico? ¿ Qué haces actualmente? ¿ Con qué frecuencia lees libros, cuál es tu libro favorito? Y una y? Entonces estas son algunas de las preguntas y la respuesta va a estar reuniendo por dentro y pone la respuesta en reunir perspicacia. Siempre me gusta comprar libros nuevos cada mes, aumentar mi colección. Utilizo mucho apps de compras online para comprar todos los productos para el hogar. Tenía la costumbre de ir a tiendas fuera de línea y leer información de un libro. A mí me gusta. A mí me gusta tener buenas ofertas, MDS y los nuevos libros que compro. Siempre escribo en con un nuevo libro publicaciones y libros para leer. Libros que quiero no siempre están disponibles en línea. Siempre tengo que seguir revisando. ¿ Cuáles son los puntos de dolor? ¿ Cuáles son el problema? ¿No hay apps disponibles un Amazon para comprar libros en línea? No recibo ninguna buena oferta o descuento o bajo compra múltiple de los libros, tengo que buscar las reseñas e información relevante sobre un libro en diferente página web. Significa que no todo está en un solo sitio web. No tienes mucha opción para elegir. Muchos de ellos están agotados, tarda demasiado tiempo en entregarlos o los recibieron en mal estado. Las pasarelas de pago nunca se sienten seguras. Y estos sitios web, de los que nunca oí hablar. Volvamos otra vez. Cuando hacemos este análisis cuantitativo, se va por el análisis cuantitativo. Hice una encuesta en línea usando Google para observar cualquier patrón y similitud en lo que el usuario potencial pueda querer. Un total de 56 personas respondiendo a esta área lo que nos ayudó en problema enmarcado correctamente. El libro encuesta de usuarios, me sale el apodo de correo electrónico. ¿ Cuál es tu edad? ¿ Qué haces actualmente? Usted lee libros. ¿Qué libros de papel generan? Leer. Mencionó el nombre de tus libros favoritos. ¿ Has comprado tu libro? ¿ De qué se trata la educación o los negocios? Mencionó el nombre de tus libros favoritos mientras encuadernaba nuevo libro. Lo que te excita más y lo que se puede mejorar en la página web y luego SAP it. Aquí está el análisis de la investigación respondida. ¿Cuál es tu edad? En su mayoría eran alrededor de 21 a Teddy. ¿ Qué haces actualmente? mayoritariamente de trabajo. Qué tipo de libros sí generan lectura. Entonces 22, es no ficción. 23 es ficción. 18, educativo, que es bueno. ¿ Cómo compras tus libros? Nuestro volando una tienda, 39, que es mucho, y alinear 51. Por lo que tenemos que convertir este ester offline al éster online. Si bien encuadernación nuevo libro. ¿ Qué te excita más? Esperamos obtener algunos más buenos conocimientos. Por lo que esto es mayormente lo que quieren para leer un detalle o reseñas. No confíe en cualquier sitio web en él para todos los detalles desde la página web, compro el libro. Busco otro sitio web donde pueda obtener toda la info. Por lo que tenemos que crear un sitio web que esté completo. ¿ Qué características te encantaría tener en una librería? En su mayoría secciones de noticias. El dueño C. ¿Cuáles son los libros más nuevos sobre un género? Categoría? Notificación, que es mayor recogida fuera de línea. Y lo impresionante, como la gamificación, como, uh, como las espinillas vienen con nuevas ideas. Está bien. 16. Cómo hacer investigaciones de mercado y análisis competitivo mediante crear un moodboard: En modo de descubrimiento, Hagamos análisis competitivos más moodboard. ¿ Qué es? El análisis competitivo, la gestión competitiva y estratégica es una evaluación de la fortaleza y una debilidad de los competidores actuales y potenciales. Hice la investigación buscando productos similares y comparé cinco sitio web o cuál de ellos son fuertes. Entonces así es como los comparaste. Ponen las características bajas a la izquierda. Altos pescadores subscriben, alta experiencia de usuario, Lu, experiencia de usuario. Y pasamos por cada uno de ellos, que es chicos simples. Yo voy aquí, busqué comprar libros en línea, India, o en cualquier país que estés. Después un paso a paso. Te las pasas y tratas de averiguar cuál es el problema y cuál es el proceso que están haciendo exactamente. Es decir, la primera insignia en bookshop.org. Demos click en uno de los libros y veamos el proceso. Justo cuando hago click, voy AC, descuento es los priors que es muy bajo. No me gusta el diseño. Y solo pon un montón de garrapatas aquí. Es aburrido. Entonces creo que no es un buen diseño. El bueno se trata de la parte de Arthur, que es bueno, pero no está en un bonito diseño. De acuerdo, tienen en el núcleo, en la lista de deseos, lo cual no es realmente importante para nosotros en este momento. Ahora vamos a la siguiente página. Entonces voy a galletas. Quiero ver la maquetación. Yo quiero ver el proceso. Yo quiero ver cómo lo están haciendo los competidores y llegar a un mejor diseño es bueno el siguiente. Por lo que las fisuras están en la parte superior. Es confuso. Todavía en la categoría y en la parte superior. No es mal diseño. Se preocupan por el precio. Muy bien, Empecemos con la categoría de la izquierda para el diseño de la pieza. Por lo que vas por el diseño de Amazon. A ver. Estamos cerca de la semana del Viernes Negro. Tienes 20 por ciento de descuento. ¿ Es la publicidad en la primera página? Lo cual es bueno. Tenemos todas las categorías de largometrajes, como la animación. Este es Departamento de Libros, lindo. Sabina, mi línea, otro competidor. A ver. Está bien. Ahora es el momento de crear el moodboard. Entonces, ¿qué es moodboard y cómo crearlo? Al igual que ven aquí, busca captura de pantalla de página completa Chrome. Es un plugin. Ir captura de pantalla completa. Sólo vamos a entrar y añadir a Chrome. Y sólo va a subir aquí en extensión. Por lo que ahora agregamos estos a la vez. Entonces está bien, solo ven aquí. Yo quiero tomar una captura de pantalla abit toda la página, ¿verdad? Sólo si desapareciera, sólo voy a refrescarlo. Si no, si no lo ves en la parte superior, solo tienes que dar click en este ícono aquí y tratar de activar este cacahuete en la parte superior. Entonces ahora es pin. Ahora, sólo tienes que hacer click en él como tú lo que pasó? Sube la pantalla toda la página ¿verdad? Ahora, presiona Comando o Control C para copiarlo. Volvamos a Adobe XD, discriminemos los tableros de humor, ¿verdad? Yo sólo voy a presionar Comando o Control V. Y va a venir aquí. Y sólo voy a reducirlo. Por ejemplo. Voy a ponerlo en alguna parte, tal vez aquí. Entonces se te ocurre la idea. Sólo voy a poner esto aquí. Sólo voy a poner esto aquí. Entonces puedo acercar y comparar todo este sitio web que tomé la captura de pantalla. Entonces, cualquier cosa que te guste, solo toma una captura de pantalla de cada proceso y cada una de las páginas que son su mitad de página web. Entonces cópielo aquí, trate de compararlo, idee nuevas ideas. Basta con revisar los colores y el proceso, el flujo, y se obtiene la idea de todo el proceso. El moodboard es lo mejor que ustedes pueden hacer en realidad. Por lo que después de crear el tablero de humor, podemos ir al análisis competitivo. Entonces ahora sabemos cómo funcionan. El Luisa vivió el OBS o en línea porque había rumbo perder y experiencia y características bajas. Amazon Books y Sedna tienen unas características bajas. Pero, ¿cómo experiencia de usuario? El mejor fue comprar libros, India.com. Este es nuestro principal competidor. También ponemos las cuentas de fisuras, el o tienen, tienen que crear cuentas. Envío gratis. Simplemente compra libros en el culo para el envío. Regalo con compra. Tres de ellos. Detalles del libro, libros educativos para devoluciones, filtros de tienda offline, o tener atencion al cliente, o tener ofertas de cupones y tejas. Y así es como ustedes crearon análisis competitivo y esto es muy, muy importante. Tienes que llegar a la mejor idea entonces. Este. Siempre. Si quieres ser un verdadero competidor, en realidad. Ahora terminamos nuestro descubrimiento en parte, es hora de ir por proceso definido. 17. Cómo crear un usuario Personas de forma: Proceso definido. El propósito de las personas es descifrar la representación confiable y realista de sus segmentos clave de audiencia. Para referencia. Estas representaciones deben basarse en investigaciones cualitativas y algunas cuantitativas de usuarios y en un análisis VIP. Recuerda, las de tu persona son tan buenas como la investigación detrás de ellas. Está bien, ahora nos sentamos a hablar con Sartre Sandy. Su edad es Teddy para la educación, estatus de posgrado, casado, ubicación mortal India. Ocupación, Diseñador, apasionadamente, entusiasta con los libros. Libros son padres, redes sociales o medios digitales? Esto es lo que ella está pensando. Personalidad, creativa, portadora, profesional, organizada. Empezaremos con el comprador. Sarah es diseñadora de interiores y trabaja de forma independiente. Le encanta leer libros y tiene una enorme colección de libros. Por su carga de trabajo. Ella es incapaz de visitar fuera de línea porque motivación estudiantil consigue libros físicos y siempre que se requiera, libros electrónicos aleatorios. Leer libros físicos da más satisfacción una vez que el libro está terminado bien. A otra le gusta leer toda la categoría de libros. Pero en su mayoría se ve de diseño, le gusta conocer los detalles descripción de libros, metas, obtener libros físicos en línea al bajo costo, obtener más recomendación de libros cercanos en mercado debería poder comprar múltiples libros a la vez. Punto de dolor o problemas. Visitar tienda offline para comprar libros cada vez no es posible. Navegación por categorías en tiendas offline, difícil. Comprar libros cada vez es caro y no obtener descuentos. No recibas ninguna recomendación de libro ni información de libros nuevos. Llegamos a añadir una persona persona. Tenemos a David Taylor aquí, edad, educación extranjera, posgrado, casado, Mumbai, India y es maestro. Por David es profesor en secundaria y le encanta libros a diario. Amaba todas las categorías, pero los libros de sabiduría, conocimiento, y positividad, o sus favoritos, también se anima a sus alumnos a leer libros. Motivación como ser miembro de una comunidad lectora. Me gusta preguntar comentarios sobre libros y también les gusta darles retroalimentación. Me encanta explorar más sobre nuevos libros. Y creyó cada día tener que aprender cosas nuevas. ¿ Cuáles son estos objetivos? Esta debe ser una plataforma donde puedan leer noticias relacionadas con libros, obtener más sugerencias de acuerdo a categorías. Puede ser capaz de recoger libros de tiendas fuera de línea una vez pedidos en línea. Y le encantaba crear una lista de deseos y recibir notificaciones cuando el libro esté en el estómago. Cuál es el problema para pintar, pero no hay detalles adecuados disponibles del libro en línea. No hay lugar para leer noticias sobre el libro. Los lectores no podrán recibir libro con anticipación. Eso es capaz de leer una reseña de los compañeros lectores sobre los libros en particular. Muy bien, ahora ustedes saben cuál es el usuario personas. 18. Cómo crear un mapa empatía de la empatía para conocer a tu cliente: Sección definida, ¿qué es el mapeo vacío? El mapeo vacío es una herramienta que realmente te ayuda a conocer a tus clientes entendiendo lo que piensan, sienten, dicen y hacen tus clientes . Se puede desarrollar, llegar dentro del cual le ayuda a identificar problemas, problemas o preocupaciones genuinos que su cliente pueda tener en este momento. Está bien. Sarah, ¿qué dice y qué hace el usuario? ¿ Qué ve el usuario? ¿ Qué piensa y siente el usuario? ¿ Qué hace el usuario aquí? ¿ Qué dice y qué hace el usuario? Ama su trabajo y brinda solución de diseño a nuestros clientes siguiendo la línea de tiempo que se le ha dado, mantiene su cuerpo sano y forma mediante el ejercicio regular, hábitos alimenticios saludables. Al igual que dos unidades y toma un largo en coche es mucho unos. También les gusta hacer compras. A veces le encantaría conducir. ¿ Qué significa? Significa que puede escuchar podcasts. Podemos dibujar un podcast o audio en nuestra librería en línea. De qué se utiliza un C, ver documentales en línea y buscar libros nuevos y árbol de revistas con novela y revista regularmente y comprarlos mensualmente. Con blogs y artículos en diferente página web en su tiempo libre. O buscamos buenas ofertas y descuentos. Por lo que la mayoría de la gente está buscando descuento, piensa y siente. En caso de tratar de ahorrar dinero para comprar productos valiosos, se siente frustrado por muchos temas de redes sociales que actualmente están sucediendo en el país. Se fija la preocupación por la salud de su familia y amigos puede cuidar bien de ellos. Todas estas cosas que necesita para estar más enfocada y organizada en su trabajo. ¿ Qué hace el usuario aquí? Aquí se trata de quejas de su familia para gastar menos dinero. Escucha podcasts y un Spotify. Aquí te mostramos reseñas sobre diferentes libros y artículos de tus amigos. Aquí te explicamos lo que las inferencias de redes sociales hablan sobre el diseño y un estilo. Por lo que realmente estamos entendiendo las necesidades de las personas y tratamos cubrir todas estas necesidades en nuestro sitio web. Y tenemos lo mismo con David. ¿ Qué ve y hace el usuario? Le gusta wildland Tn, diferentes proyectos y actividades sociales y gastar mucho dinero en comprar productos. Y redujo la cantidad de productos que se pueden comprar. Entonces obtienes el punto y obtienes la idea chicos, asegúrate de crear mapeo vacío te va a ayudar mucho durante el proceso. Porque cuando estás hablando con la gente cara a cara, tienes la sensación de lo que realmente necesitan. Y te hace un mejor diseñador. Porque cuando sientes la gente y sientes los entendimientos, puedes crear y llegar a buenas ideas. 19. Crea el mapeo de viajes de usuario o un mapa de viaje de un cliente: Sección definida, ¿qué es el mapa de viaje del usuario? Es mapa de viaje del usuario, también conocido como mapa de viaje del cliente, es un diagrama que ilustra visualmente el flujo del usuario, haga realidad sus sitios, comenzando con contacto inicial o descubrimiento, y continuando a través del proceso de compromiso hacia la lealtad y la abogacía a largo plazo. En base a la investigación de los usuarios, han creado un recorrido del cliente. Por lo que creamos estos pares sobre Uso de la investigación para comprender mejor los puntos cruciales, desafíos, mentalidad, y GMI en general, que usan un contador de manopla mientras compran un libro. Y enumerar abajo las oportunidades. Tenemos. Cinco partes, Conciencia, Investigación, comparar, elegir una retroalimentación, y los chicos echan un vistazo, uh, encontrar un libro en partes de conciencia e investigación, luego comprar en comparar y elegir, luego post- retroalimentación de compra, punto de contacto y emoción. Entonces el punto o punto de contacto, y estos son el emocionante proceso. El usuario está pasando por este proceso para comprar nuestro libro, cosas, para leer un nuevo libro. En primer lugar. Después toma sugerencias de amigos, como por ejemplo para leer libros en línea, reseñas, información sobre un Libros, navega por diferentes secciones para buscar libros nuevos, como sitio web para comprar el libro, como en si el libro está disponible. En la investigación parte verifica con el filtro y otras opciones disponibles. Después de seleccionar el libro. Busca la información sobre el libro. Controles para ofertas o descuentos o cupones. En el libro al carrito. Verifica otras sugerencias, agrega más libro al auto. Procede a pasarela de pago. En detalles como nombre, números y dirección, selecciona método de pago, realizado, pedido, recibió la entrega después de unos días, escribe una reseña sobre el libro y potencialmente regresa para siguiente compra. Si bien hacemos cada proceso individual, esta va a ser nuestra mentalidad. Esta va a ser nuestra mentalidad de cliente. lo primero que está pensando un cliente, ¿hay algún libro nuevo que me guste? ¿ Conseguir un libro de género particular? Rápidamente buscaré el libro que tengo en mente. ¿ Cuáles son sus libros me interesaría? Esa es la parte de la sugerencia. ¿ Cuáles libros son los más vendidos? ¿ Cuánto gastan en los libros que agregué? ¿ Tengo algún descuento de boleto con código de cupón? Ahora, quiere comprar el libro y este es su inicio ahora mismo. ¿ Por qué necesito firmar no puede comprarlo como invitado. Entonces hay mucha gente a la que no le gusta iniciar sesión y querían comprarlo como invitado o los descuentos en alguna pirámide en particular? ¿ Hay alguna opción para obtener la entrega más rápida? ¿ Hay alguna opción de regalo? ¿ Puedo recoger el artículo en una tienda, puedo esperar para recibir los libros. No he cometido ningún error. Por lo que estos son los objetivos. ¿ Dónde está mi entrega? ¿ Por qué aún no he recibido mi pedido? Nos pasa a muchos de nosotros. Por lo que esto significa que necesitamos un sistema de seguimiento de la línea de tiempo. Entonces cada vez que te preocupas por ello, nos acercamos a un lado es el proceso de seguimiento. Y sabemos exactamente dónde ordena nuestro libro varios. Espero que el paquete no se dañe. Por último, nuevos libros en ello en mi colección. Nuevos libros para leer y adquirir conocimiento. ¿ Cuáles son los puntos de dolor en algunos sitios web? Hasta sobre qué libros nuevos hay? Hasta sobre los precios de los libros? No, como los libros o los libros más vendidos se muestran. Pueden encontrar los libros significa que a veces se busca y no podemos encontrar los libros, pero ustedes no son los libros es que no son filtros de búsqueda adecuados para acotar los resultados. Entonces este es el proceso que debemos hacer. Chicos. Sitios es difícil navegar por el sitio web desordenado, puede encontrar cualquier resultado y los libros agotados pueden aplicar un cupón existente en el pedido. estoy seguro de por qué necesito firmar demasiados pasos para pedir libros. Por lo que tenemos que reducir los pasos. Descuento en opciones de pago, nueces, muchas opciones de pago. Sin entrega gratuita, sin método de entrega alternativo. No entrega rápida ni en el mismo día. No estoy seguro de qué hacer a continuación, no hay información adecuada ni la entrega estimada o la pista o su opción. Este es un imperdible chicos en seguro. Acerca del estado de entrega, su notificación de los ingresos de entrega de entrega tardía, libro incorrecto recibido, y ninguna opción para devolver el libro. No hay información clara para dar una retroalimentación. ¿ Y cuál es nuestra oportunidad? Esta es la parte más importante de nosotros. Regularmente tenemos que actualizar libros de usuario o nuevos. Vendedor ofrece sugerencias de libros visuales basadas en consultas de búsqueda comunes. Significa que tenemos que abordar eso. Qué está buscando el usuario y se nos ocurre sugerencias, proporcionar investigación adicional. Twitter proporciona sugerencias de acuerdo a las palabras clave, personalizar la recomendación de libro en página de inicio para reducir la necesidad de navegación. Por lo que al minuto en que el usuario esté buscando algo, si agrega una fila en la parte superior de nuestra página principal y le recomendamos nuevos libros relacionados con esas palabras clave, diseño reorganizado, reducir el número de CTA. Llamar a la acción es un prompt en un sitio web que le dice al usuario que realice alguna acción específica. Entonces ustedes chicos entienden la idea, ¿qué es exactamente el mapeo de viajes del usuario? Y esto es muy, muy importante porque en cada defecto, en cada proceso, sabemos de qué se preocupa el usuario, cuál es el problema. Y si tienes que llegar a las soluciones. 20. Cómo crear flujo de usuario: Después de hacer el mapa de viaje del usuario, tenemos que crear un flujo de usuario y manera fácil en parte IDA. Entonces, ¿qué es el flujo de usuarios? Es un flujo es un camino tomado por un usuario y un sitio web o aplicación. Para completar una tarea. El flujo del usuario los lleva desde el punto de entrada a un conjunto de pasos hacia un resultado exitoso y una acción final, como comprar un producto. Escenario. El usuario había oído de un amigo sobre T book, librería en línea para comprar libros y decidió probar y comprar algunos libros. Esto es lo que usan. Se va a hacer Página web de búsqueda y Google va a escribir t libro en línea porque piedra luego navegar a través de enlace, haciendo clic en el enlace del sitio web, abriendo el enlace se llega a la página de inicio, el libro T. En una página de inicio, contamos con ofertas y descuentos. Tienes ventas flash Sobre Nosotros. Y el menú va a navegar a la página principal y explorar los productos disponibles. Para la exploración, tenemos páginas recomendadas, hemos catalogado, y tenemos una oferta especial para al final, llegar a la página del producto, explorar los productos disponibles. Tienes noticias, boletines testimoniales. El parte más importante es la categoría que es el filtro, libros y boletines de ventas. A lo mejor va al feto a comprar los libros. A lo mejor acudir a las ofertas especiales y bar y pedir el libro. Al final, tenemos una página de producto. En la página del producto, contamos con libros relacionados. A lo mejor quiere agregar otro libro basado en nuestra recomendación, proteger información y reseñas, lo cual es muy importante. Después de leer todos estos infos, se va a añadir esto al carrito. En mi carrito, tienes las opciones de regalo y agrega cupones. Proceder a la caja, página de pago en la información de pago, en dirección de entrega lugar antes. Y entonces tenemos un sistema de seguimiento para mostrar el proceso de recepción del libro y la entrega del libro. Este va a ser el flujo de usuarios de Avar. 21. Qué es la clasificación de tarjetas y cómo moodboard puede ayudar: ¿ Cuál es la clasificación de tarjetas? La clasificación de tarjetas es una técnica de investigación UX para descubrir cómo las personas entienden y categorizan la información. clasificación de tarjetas crea una base para una arquitectura de información robusta que permite la creación de un sistema de navegación que coincida con las expectativas del usuario. Por lo que siempre preguntamos qué va a ser dentro de la página de inicio, menú de navegación, búsqueda, cuenta de tarjeta favorita. Por lo que esta parte también se va a basar en nuestros chicos de moodboard. Entonces estamos bien el moodboard, si tienes todas las páginas, todos los pasos. Entonces si hacemos click en esto, ¿qué va a pasar? Si agregamos una tarjeta de identificación iba a suceder. Por lo que ya sabemos qué están haciendo sus sitios web. Ahora con esta información. Podemos crear nuestra clasificación de tarjetas. Entonces volvamos atrás. Entonces sabemos lo que vamos a tener en la página de inicio. De lo que vas a tener en un catálogo o página de categoría 330, temas de edición de género deben estar en la parte superior. Por lo que sabemos lo que tenemos para traer catálogo de página de prueba de campo. Sabemos lo que hay dentro de EU. Sección de héroe dada dos líneas de información sobre esta puertas, misiones, y metas, lo que va a ser dentro de galería de productos de dos o cuatro imágenes del libro, tanto precio como ofertas y descuentos. Descripción detallada, nombre del autor, publicación, publicación, botón de libros de múltiples secciones y opción de agregar al carrito. ¿ Qué va a ser dentro de la página del carrito? Listado de todos los libros en ListView ofertas mencionadas, descuento aplicado, también entrega gratuita si está disponible. Pagina de pago en la información de los compradores, nombre y dirección, opción de pago CTA, incluyendo información y servicios y características de pago seguros y seguros. Entonces esto es exactamente lo que tenemos que hacer encarcelando. Entonces ponemos como una nota que lo que va a ser dentro cada página que vamos a crear. Y nos va a ayudar mucho en el futuro. 22. Cómo crear la arquitectura de información: Después de la Clasificación de Tarjetas, hacemos la arquitectura de la información. Entonces, básicamente, la arquitectura de la información se basa en el nombre de Carter. Sea lo que sea que se ponga ahí. Si tienes que ponerlo dentro de este libro T, librería online, proceso o arquitectura. arquitectura de la información es la práctica de decidir cómo organizar las partes de algo. Para ser comprensible. La arquitectura de la información tiene como objetivo agregar contenido organizativo para que el usuario ajustara fácilmente la funcionalidad del producto y pudiera encontrar todo lo que necesita sin un gran esfuerzo. Entonces esto es lo que hacemos y esto es lo que usamos para prototipar, para bosquejar. Entonces Tybalt, la página de inicio AV. ¿ Qué hay dentro de la página principal? Contamos con menú en el menú de nuestros libros, revistas, lleva libros, audiolibros, libros para la venta. En la página de inicio de tus bestsellers, noticias publicadas, preventa, libros educativos, y libros usados. Contamos con diferentes secciones como trending, libros recomendados, ofertas especiales, venta flash, últimas noticias. Tenemos también diferente navegación para menús desplegables, barra de búsqueda, como marcador favorito de argón, donde contar desplegable. Y tienes algunas características podría entrega, pago seguro. Entonces es por eso que tienes que confiar en nosotros sección básicamente mejor calidad conserva garantía para la entrega de luz más grande. Y del lado derecho tenemos filtros. Tienes parte de redes sociales. En la parte inferior. Tenemos la cuenta, mi lista de seguimiento de pedidos en el editor vf fetal picks en la parte superior. Libros más nuevos destacados Ver historia. En este momento sabemos exactamente cómo organizar nuestro diseño. En categorías. Contamos con fotografía, Biografía, Libros de cocina educativos, y enlaces rápidos como sobre nosotros, contáctanos en la parte inferior para el pie de página. Y esta va a ser la arquitectura de la información. Y también tienes que usar tu moodboard, ver qué están haciendo otros sitios web y llegar a una mejor idea, una mejor solución. 23. Cómo crear Wireframes o un encuadernado de poca fidelidad: ¿ Qué es wireframe? Wireframing de baja fidelidad o boceto de papel. Una vez que organicé toda mi perspicacia desde la fase de ideación, empecé a diseñar el sitio web. Para iniciar este proceso, comencé a bosquejar varias de las pantallas principales de sitios utilizando mi flujo de usuario como guía para el flujo de usuarios, este proceso. Y también podemos utilizar la arquitectura de la información. ¿ Cuál es el proceso? ¿ Cuál es cada detalle? No ponemos cada detalle, sólo el general la sección Inicio, como éste. Volvamos a los wireframes. Y así es como se ve. En la parte superior tenemos el logo, tienes la barra de búsqueda, aquí tenemos algunos iconos. Y tienes el llamado CTA a las acciones. Se puede ir a la página del filtro. Entonces aquí, Servicios, características, tendencia y e-books recomendados como trending recomendadas ofertas. Después ventas flash, nueva sección, testimonios, boletines. Y tenemos el pie de página, tenemos el logo, aquí tenemos las redes sociales. Y página de derrota. Tenemos los más utilizados. Y la de arriba fue página de editor y todas las categorías aquí, si haces click en uno de los libros de la página de descripción, tenemos algunas fotos, tienes algunos detalles, alguna información sobre los libros, reseñas. Y también tenemos un boletín de pie de página. Por lo que también tenemos una página Acerca. Después de añadir este producto, después de añadir este libro para tener una tarjeta. Tenemos una lista de productos agregados a nuestras tarjetas, ¿verdad? Tenemos un subtotal, tenemos un cupón para un descuento. Tenemos un desglose detallado de la cantidad de dinero que tienes que pagar y por qué. Tenemos una barra de progreso rastreando el pago de parte en cuatro y la seguridad de pago bastante línea. Entonces este es el proceso que tenemos que hacer en nuestra wireframing o bocetos de baja fidelidad. 24. Tamaños web y cuadrícula del sistema de la fidelidad: Ahora es el momento de un diseño wireframing de alta fidelidad. Así que crea una nueva página y pon aquí tu moodboard y tus bocetos. Y estamos tratando de hacer alta wireframing basado en la retroalimentación y la perspicacia personal. Aprendí de la fase de bocetos. Empecé a diseñar mis primeros wireframes usando Adobe XD. Tienes que asegurarte de crear algo que sea mejor para nuestros usuarios, ¿verdad? Trata de hacerlo muy sencillo. Por lo que tienes un montón de ideas desde diferentes ubicaciones, diferentes lugares. Cómo empezar desde la página de un héroe, la página superior, el logotipo. Pero el diseño de alta fidelidad debe ser muy rápido porque quieres obtener algunos comentarios. No queremos ir al proceso de diseño. Es decir, recoger los colores y elegir las fuentes. Este es un proceso muy rápido. ¿Verdad? Ahora es el momento de crear nuestro sitio web. Sabemos qué hacer. Tenemos mucha idea, tenemos mucha información. El primero que hacemos es los chicos del sistema de distribución de cuadrícula. Por lo que por defecto es 12, 16, 122, y 140. Por el margen, voy a explicar cada detalle en este momento. Pero primero, vamos a movernos aquí. Por defecto. Esto es lo que nos va a dar el Adobe XD. 1640. ¿ Y si mis clientes quieren 1400 para el diseño? Entonces tenemos que crear estos márgenes. Permítanme que explique lo que va a estar pasando. Tengo que hacer esta línea 1400. Significa que esto va a ser 1400. Entonces mi diseño, debería estar en el centro. Entonces hasta así y hay que hacer que la cuadrícula se vea exactamente así. Y esto es puede ser 16, no importa, puede ser 20 y jugar con la canaleta. Pero va a la izquierda. Eso se excusará. Hazlo muy raro cuando quieras poner el margen. Puedo hacer click en este ícono aquí. Yo lo puedo decir 120, deft 120, ¿verdad? Pero también va a cambiar este. Por lo que es muy difícil alinear todo con el tamaño que quiero para mi página web. Entonces tengo un truco muy cool para eso, que te voy a mostrar. Nuestro cliente enviándonos un sitio web que nos está preguntando, ¿podemos tener este sitio web? El tamaño del sitio web es 16, forzando el tamaño total en 1920. Por lo que fácilmente podemos usar esta fórmula, 1920 menos este tamaño que nos pidió el cliente, o el tamaño del sitio web que realmente nos gusta va a ser igual a un número. Dividimos eso por dos y tenemos el margen. Y entonces sólo puedo venir aquí y poner el margen aquí. Volvamos aquí. Por ejemplo, voy a diseñar algo así como cuatrocientos. Cuatrocientos, ¿verdad? Aquí. Nosotros lo tenemos. 1920 menos 400 va a ser 5, 20. Ahora 520 menos 2 es 260 para el margen de derecha e izquierda. Si hago clic en el principal, entonces se va a activar la cuadrícula. Basta con hacer click en este ícono, a la izquierda. Ahora, haga clic aquí y ponga este número a 60 para obtener el 400 a 64 el margen. Está bien. Ahora, como exactamente en el centro, ¿qué tan cool es eso? Vengamos aquí. Por lo que esta línea roja va a ser nuestra principal página web. Entonces no vamos a la izquierda ni a la derecha. Este es el área de margen. Este es el área de espaciado. Sólo para los más pesados. Y para algunas páginas de héroes, podemos usar el total 1920. El resto debe estar exactamente a mediados de 1640. Tenemos 12 columna. El hueco entre la columna es canaleta con 16. El columna es 12. 12 columna. Tenemos la canaleta. Ver, cuando hago clic en el número, uso la cuadrícula, siempre tengo que volver atrás y dar click en el nombre principal predeterminado. Decretado se va a activar ahora mismo. Y el ancho de columna, podemos hacer esto como un make default, pero no quiero hacer eso por ahora. Entonces cuando estés realmente seguro de que quieres usar esta cuadrícula, úsalo como predeterminado para ese proyecto. Entonces significa que si creas una página de edición va a ser exacta misma cuadrícula. Entonces aprendes que si el tamaño es 1640 antisindicales menos que dividido por dos, tienes el marginal, ¿verdad? Pon el margen aquí y obtienes el mismo tamaño que realmente quieres. 25. Diseño de una sección de de héroe o deslizante o diseño de banner de Hi Fi: Muy bien, volvamos aquí. Por lo que ya tenemos este 400 y muscular quitar este riesgo va a quitar esto. Vamos a empezar o una fanfarronada wireframing. Pero, ¿cómo empezamos muy rápido y muy rápido? Tenemos algún kit de UI para empezar. Vamos a venir a sus kits de interfaz de usuario y haga doble clic en el material móvil web UIKit actual, probablemente él oscurecimiento equipo. Puedo añadir algunos más también. Se trata de una web de kit de UI. Tenemos, acabo de poner algo de título aquí para que ustedes puedan encontrar el elemento UI. Si estás buscando páginas de aterrizaje, estas son algunas opciones. Solo puedes copiarlo y solo ponerlo dentro. Tu página de aterrizaje va a ser tan fácil. Por ejemplo. El nuestro va a ser combinación de éste y tal vez la cabecera, el héroe tenía aire. Se va a añadir algo de metraje en video, o tal vez éste. Muy bien, así que vamos a venir aquí al elemento de la interfaz por ahora y solo mostrarte la primera llamada a las páginas de acción. Déjame mostrarte precios, tablas, sección de contenidos. Podemos sumar rápidamente para que tengamos la idea de cómo le gusta al cliente. Por ejemplo, quiero este y haga clic con el botón derecho. Copiarlo. Bien. Tu página, Principal. Da click en la principal y controla V. Ahora lo tenemos aquí. Sólo ponlo aquí chicos. ¿ Verdad? Ahora solo lo voy a arrastrar a la izquierda y aquí también. Entonces es genial. Ahora, haz click en el principal y ven al área de columnas y arrastra esto hacia abajo. El opacidad. No quiero verlo un muy, muy corto, algo así. Tiene menos atracción. Tenemos una cabecera superior, ¿verdad? Pero puedo cambiar algunas de estas. No quiero poner algún nombre en la parte superior. A lo mejor sólo va a borrar este. Y vamos a llegar a algunas de las ideas, chicos. En base a lo que vemos. Voy a dar click aquí y sólo ponerlo aquí. Subamos un poco. Vamos a acercarnos un poco. A lo mejor seis va a estar bien. El borde debe ser blanco y la sensación está vacía. Simplemente voy a usar el mismo texto. Y yo sólo voy a llamar a este efecto que son 10, es demasiado pequeño. Hagámoslo 14. Ahora. Es igual de izquierda y derecha. Ahora vamos a acercar un poco. Selecciona el tablero, solo hago doble clic en él, sosteniendo Alt y Shift y lo arrastra bien? Correcto. Y estoy tratando de ser solo igual en el centro de este 12º grado. Simplemente voy a usar esto como mi barra de búsqueda. Tu viaje, más largo. Rastrea esto y simplemente ponlo aquí. El mismo toma sostén Alt y Shift. Y yo sólo voy a llamar a esta búsqueda bajo el lado derecho. En lugar de usar estos 10, esto, sólo voy a eliminarlos. Entonces ven aquí y tal vez poner el personaje aquí. Sin frontera. No tengo que poner aquí a la persona. Vayamos a tus plugins. Haga clic en icono para el diseño. En una barra de búsqueda tipo corazón. ¿Verdad? Creo que esto es genial, ES corazón. Por lo que presiona Comando o Control X para copiarlo. Volvamos aquí y sólo peguémoslo aquí. Se lo va a dejar aquí. Yo sólo lo voy a hacer blanco por ahora. Solo seleccionemos este para que va a ser copiarlo junto a éste. A continuación necesitamos carrito, tal vez carrito de compras. Enfriar. Entonces si seleccionas éste se va a copiar estos iconos junto a él. ¿ Está bien? Y yo sólo voy a sostener el turno y hacerlo un poco más pequeño. Y también lo puso aquí. También es blanco. Por ahora está bien. Entonces y aquí en lugar de x, tenemos un libro t. También se puede crear el logotipo de una mesa muy rápidamente, chicos. Entonces vamos a crear este logotipo porque va a ser de ayuda. Presiona T. Volvamos. No necesito un plugin llamado libro T. Planteándolo. Ahora, vamos a crear lo mismo. Basta con usar esta mesa de trabajo y simplemente ponla aquí. Cambia el color a negro goo. Sólo voy a copiar esto y ponerlo aquí también. Amplíe un poco. Agradable. Vamos a acercar un poco con el interior aquí. Agradable. ¿ Qué pasa con estos dos va a poner esto aquí en el centro y arrastrar esto aquí. Enfriar. Ponga esto aquí. Negativo b, el más pequeño rotarlo, ponlo aquí para el C. Aquí, tal vez con zoom más grande. Vamos a seleccionar todo esto a lo largo del turno y seleccionarlos. Y ahora seleccione el texto total y haga clic en este menos b2, restar. Y mira. Creamos el logo muy rápidamente. ¿ Y qué pasa con la tienda online de textos? Simplemente voy a escribir más grande, cambiar el color. Y la primera letra es mayúscula. Haga clic en esta capa. Y aquí vamos. Agradable. Muy bien, Ahora espaciado, estoy usando mi tecla de flecha hacia abajo y seleccione aquí una tecla de flecha superior hasta que coincida con este golpe. ¿ Verdad? Control de mando G para agruparlos. Bonito, ¿verdad? Ahora, tenemos esta imagen también, ¿no? Vámonos. Estoy tratando de poner esta retención en Alt y sólo copiar tus pulmones Shift para hacerlo a varios pequeños y traté ponerlo aquí chicos. Y a ver cómo va. Agradable. También mantenga pulsado el control y haga clic en el interior. Haz esto blanco. Entonces tenemos aquí la LIGO, que es muy guay. Algo falta ahora mismo, creo que el espaciado y el margen católico es, tiene un problema. Haga clic en un diseño principal. En este momento no lo es, falta algo, algo no es cool o no tiene control y haga clic en esto dentro. Por lo que hay que dar click en Control para entrar. Y ahora sólo puedo traer esto de vuelta. A veces pasan, no sabes lo que pasó. Por lo que se trata de arreglarlo. Por eso usamos el margen. Entonces volvamos atrás. No necesito el margen. ¿ Por qué? Porque sólo puedo usar algo como esto. Necesito dibujar algunas hasta así. Y vamos a recoger un color. Este es nuestro color principal. Y vamos a llegar a algo muy ligero. Demos click en este color plus para agregar este color a nuestras muestras. Son tan click en este color o abajo Control. Haga clic. Vamos a entrar y más. Por lo que tenemos estos dos colores como nuestro color principal para que podamos usarlo todo el tiempo. Ahora, volvamos a esto. Vuelve aquí. Busco un video chicos, algo así. Porque voy a añadir un video Control C, volver atrás, controlar V. Me gusta este color mejor que este. Por lo tanto, selecciona este. Sin frontera. Cuentagotas de ojos, haga clic en esto, y este es del mismo color al que nos gusta ir aquí. Y en esta, no me gusta esto para quitar esto, sólo arrastrarlo hacia fuera, va a leer. Bien. ¿ Qué pasa con esto? Yo quiero este logo, quiero este ícono. Vayamos a los iconos aquí. Simplemente llama a esto un video. Seleccione este. Y puedes conseguirnos videos van a estar aquí. Arrástrelo aquí, y nos hacemos un poco más grandes. Yo quiero ponerlo en el centro. Entonces lo sé y el cliente lo sabe. Esto va a ser reproduciendo un video. O puedo cambiar el color a azul para ser más obvio. Aquí puedo teclear. Bienvenido al libro T. Es cambiar el color. A lo mejor sólo un poco más grande. Nosotros comprobamos, quiero poner este 0, ¿verdad? Entonces puedo decidir tal vez 50 estaría bien. Y también el libro T debe ser seleccionado en negrita. Usando el perno. Arrastra esto hacia abajo, hazlo un pequeño músculo llamado esta tienda online seleccionada. El primero sería capital. Que sea un poco demasiado pequeño. Y la fuente debe ser estrecha. Es sólo una prueba. No importa. Puedo cambiarlo más tarde, cierto. El hueco, tal vez 600, tanto. Ahora, seleccione la tecla de flecha hacia abajo. Y volvamos atrás. Ahora, presiona Command o Control S para salvar nuestro proyecto. Y por mi Moodboard, tener algunas ideas. Yo quiero poner algo de imagen aquí. Y sólo voy a dar click aquí, 16 está bien. Ahora, el campo debe ser azul. Y además, voy a poner algo así como el bestseller. Arrastre esto hacia abajo. A lo mejor 60, demasiado. 8, cocinar o Alt. Arrastra esto hacia atrás, mantén pulsado, Alt click en esta pequeña esquina, romperlo hacia atrás. Apague la frontera donde yo ness ahora más t y teclea aquí. Best seller, ¿verdad? Yo sólo voy a la lista 10. Esto es, debe ser audaz. Y también estas brechas demasiado, Tal vez 100, Mucho mejor. Opción más vendida aquí. Esto es débil. ¿ Verdad? Ahora. Asegúrate de que esto esté en el centro. Enfriar. Seleccionar. Eso toma pulsado, Shift, select, y select, pulsa Comando o Control G para agruparlos. Bueno, yo soy Control y dar click en esta frontera. Yo quiero hacerlo un poco más pequeño. Arrástrelo hacia la izquierda. Haga clic en Repetir cuadrícula. Y esto de aquí, mira, está alineado. Yo sólo voy a inducir de vuelta. Muy interesante. O podría, estas son algunas de mis ideas. Yo quiero poner algo de texto aquí. No sé qué es, pero probablemente sólo voy a poner algo de texto para hacer click en Texto, Volver de plugins, búscalos. Rellenar con un marcapasos. Significa que tienes el Select. Ahora llénalo. E insertar texto. Se va a agregar en algún texto basado en tu configuración predeterminada. Esto debería ser 12. Adivina. Arrastra esto hacia arriba. El hueco es un muy alto. Usa tu uso este espaciado entre la letra y luego la tecla de flecha. Entonces creo que esto es genial. Y no quiero ser tal vez ni dos líneas. Bonito número aquí. A lo mejor un poco. Como escuela, aquí, tengo una colección de un botón, botón llamada a la acción. Decide la noche correcta no importa. Explica sobre el tamaño y soy un erudito. Yo sólo voy a llamar a esta colección. Haga clic aquí. Recoger por qué las garrapatas más grandes. ¿ Verdad? Necesito la flecha. Entonces vamos a seleccionar este es bueno a los iconos. Simplemente llama a esta flecha. Y nosotros, esto es genial. Quadratics vienen aquí. Por lo que a lo largo del turno lo hacen un poco más pequeño aquí. Y que sea blanco. Seleccione ambos y arrástrelos para que se centren. Agradable. A lo mejor este se mete un poco, ¿verdad? Este de aquí. Se puede hacer un globo ocular para tener la buena idea. Busco Libro, Escriba su libro. Y tú vas Control X, ven aquí y póngalo aquí. Quiero mencionar cuántos libros tenemos en restaurar prensa T, tal vez 60 K libros que tenemos en nuestra librería en línea. 60 K. Y llame a esta colección de libros colecciones. Aquí 45, primera letra debe ser mayúscula. Seleccione los iconos deben ser azules. ¿ Verdad? Copia. Aquí lo mismo. Busco usuario. Usuarios. Un poco poner a los usuarios S, dándonos algo fresco o UCI. Permitir turno, hazlo un poco más pequeño. No quiero esto. Ponlo aquí. Que sea azul. Haga clic aquí, borrado. A lo mejor tenemos 20 millones de usuarios. Está bien, genial. Yo sólo voy a poner aquí cliente. Tienes 2 millones de clientes, ¿verdad? Agradable. Esta es nuestra página principal, el icono de la página principal aquí a la placa. Y así es como se va a ver. Por lo que el bestseller tal vez pueda ser un poco audaz. Todo está fresco en línea porque tienda agradable. Podemos cambiar esta fuente. Seleccionó a un vendedor. Y quiero que esto entre dentro. Agradable. Nuevamente, principal. Si mantienes presionada la tecla Control y pulsa Intro, también puedes obtener el botón Reproducir. Eso malo. ¿ Y en línea? Porque tienda estrecha debe estar en lo regular, supongo, mejor. Y seleccione esta tecla de flecha hacia abajo para traer el espaciado hacia atrás y seleccionar fuera. Consíguelo aquí. A lo mejor nos levantamos. A mí me gusta más. 26. info Diseño de páginas para página principal: diseño principal de Hi Fi: Por lo que en base a nuestros bocetos, tenemos cuatro categoría aquí. Por lo que le pregunté al cliente el único nos dijo lo que necesitan. Estoy sosteniendo Alt, arrastra esto hacia abajo y asegúrate de hacer clic en este pequeño ícono aquí, alinearlo, siéntete azul. Entonces estos son los nombres que necesitamos por ahora. Simplemente vamos a dar click en el texto. Simplemente voy a llamar a esta entrega rápida. Hazlo blanco. 0. Bueno blanco. El espaciado debe ser de 20. Y lo hacemos un poco más pequeño. Está bien, genial. Busco ícono del tiempo. Simplemente voy a dar clic aquí y escribir tiempo. No está mal. Tracto está aquí. Hazlo blanco. Entrega rápida y la fuente debe ser negrita. Agradable. Cuando se trata de algún texto, sólo voy a dar clic en esto. Distribuidor se aferra al Alt, arrástralo hacia abajo y hazlo blanco. Si lo haces blanco, va a ser muy bonito año. Sólo voy a arrastrar esto aquí. Algún texto. Muy cool, muy interesante. Y acaba de poner esto. Buena entrega. Aquí vamos. Muy bien, ahora ¿qué pasa con el espaciado? Bien hecho todo esto. Selecciónelos con Shift y haga clic en Agregar rejilla Rúbrica. Ahora sólo puedo hacer esto. Yo sólo quiero ser cuatro. Y la brecha y el espaciado deberían ser así. conciencia puede mirar lo principal y ¿qué pasa con el sistema de red? Muy bien, cada árbol, Colón, tenemos esto, así que estaríamos bien. Seleccione el grupo de rúbrica y desagrupar la cuadrícula. Haga clic derecho. Vámonos adentro. Yo llamo a este pago seguro. También, cambiamos los iconos con una tarjeta de crédito. Agradable. Hazlo blanco, hazlo un poco más pequeño. Y sólo ponlo, sí, sólo voy a quitar esto. Estampado está de vuelta aquí. Agradable. El otro es de la mejor calidad. Podemos adelantar rápidamente a estos chicos, pero quiero hacerlo. Entonces tal vez muchos de ustedes en engañados por el exactamente do. Yo sólo buscaría el ícono, lo puse aquí. Se va a quitar éste y arrastrar éste hacia la izquierda. Y también este. Voy a buscar un ícono. Yo lo puse aquí, sólo voy a mover este de aquí. Este ícono aquí. El nombre es garantía de devolución. Entonces esto va a ser exactamente lo que buscamos y jugamos. Muy cool y muy interesante. ¿ Y éste qué? Necesitamos algo como esto también. Ahora da click en la línea y ven aquí y justo a x hasta así, hazlo azul. El tamaño quizá debería ser de cinco. No está mal. A lo mejor un poco más grande. Coordinar cabina. Agradable. A lo mejor este ES debería ser ocho. Mejor. Rastrea esto a la derecha. Tamaño para y también el tamaño debe ser menor. El color. Aquí debe estar orgulloso. Y aquí vamos. Select y C. Sólo lo voy a poner en el centro de esto. Por lo que simplemente cambian a estos tres. Agradable. Entonces tenemos tres banner aquí entonces haciendo clic y este va a ser Switch, va a la izquierda y nunca. Agradable. 27. Sección de tendencia de diseño: diseño de el diseño de la sección de la tendencia de la realidad de : Así que selecciona la página principal y haz clic en este pequeño ícono y lo arrastro hacia abajo. A veces la gente tiene problemas con esto, ¿verdad? Esto es como Kool-Aid y el punto de vista superior debe ser 1080. Si está aquí. Si hago clic y abro esto, va a ser así. Ser realista. Debe ser el 1080. Y jugar o Control Enter sólo va a ser así. Ahora puedo desplazarme hacia abajo. Entonces el siguiente es muy importante y muy cool. Sólo llama a tendencia. A partir de nuestros bocetos, sabemos que tenemos que poner icono de tendencia aquí. Puedo usar lo mismo. Poner en líneas. Si quieres estar alineado. Simplemente selecciónelos a ambos, alinéelos para que lo primaveren y póngalo en el centro. Ya ves la línea azul está en el centro. Selecciona este y arrástrelo hacia arriba. Para tendencia, puedo usar algo así como tengo una idea, tal vez no la uso, pero sólo voy a dar algunas ideas aquí. 16. Ningún borde debe ser azul. Busco polígono de imagen, solo vamos a llamarnos y ver qué consigo aquí. Entonces agreguemos una imagen. Puedo usar esta imagen Centro, ¿verdad? Tienes imágenes de tendencia aquí. Y también tenemos quizá algunas ideas, chicos. Siente el pobre, debería haber blanco, tal vez cinco, demasiado, tres. Y además, necesitamos llenar esto con esta no escuela. Ahora mismo. A lo mejor quiero Drop Shadow para esto. Pero la sombra del camión debería ser azul. Opacidad. Y el nombre del autor del libro, tal vez papeles de Dave. Y también necesitamos la estrella. Simplemente haz click aquí este triángulo y arrastra esto hasta ser cinco. Esto va dentro, usa estos rincones. Y también aquí. Para crear esta estrella. Se va a ir al campo, llegar a un color muy interesante. Ahora puedo hacerlo más pequeño. Que sean cinco. El vacío debe ser menor. Desagruparlo. Haga clic y haga este paquete o G para agruparlo. Bonito. Entonces tenemos todo esto. Seleccionemos este comando G para agruparlo. Es arrástrelo hacia la derecha, sostenga Alt y Shift para hacerlo un más pequeño desde el centro. Da click en esto y baja la opacidad. Por lo tanto, seleccione este botón derecho y establezca la parte posterior. Otra vez. Seleccionarlo, arrástrelo hacia la derecha y Alt y Shift para hacerlo más pequeño. Clic derecho. Enviar a Atrás. Entonces opacidad. Por lo que bajamos la opacidad va a ser parece que esto no está frío o pulmón Control. Y haga click porque es grupo. Entra. Haga clic en este pequeño ícono aquí y seleccione este color. Ahora, triglicéridos, recogemos el mismo color, control pulmonar. Haga clic en esto. Haga clic, trató de pasarlo a la derecha. Entonces tenemos el mismo color. Entonces sé que debería ser como aquí y aquí. Esta es la brecha, ¿verdad? Entonces podemos usar lo mismo de la derecha. Lo mismo, mantenga presionadas Alt y Shift y arrástrelo hacia la derecha. Bonito. Entonces esta es mi idea de poner aquí el entrenamiento. Así que selecciónalos todos y solo arrástrelo y ponlo en el centro. 28. Diseña la sección recomendada de la sección de la de la sección en el diseño de la de la de la perso: Entonces solo voy a venir aquí y llegar a algunas ideas de crear mi recomendado para ti. Puede ser algo así, pero tal vez pueda usar esto a mi manera. A mí me gusta esta parte, la grande y las dos pequeñas, pero de manera diferente. Vamos a llegar a la idea. Por lo que obtenemos la idea de diseño diferente y lo usamos para mejorar nuestro diseño. Vamos a hacer clic y arrastrar esto hacia abajo. Lo mismo, rastrear tendencia. Yo sólo lo voy a poner aquí. Llámala cuatro. Sigue bajando un poco el acto . Sólo vamos a usar este. Hacemos un seguimiento de esto, lo ponemos aquí, controlamos. Hágalo blanco. Este, hazlo, mira. A lo mejor puedo simplemente hacerla más pequeña, algo así. Ahora, C, arrastra esto hacia la izquierda para ver el centro. Ahora, cuando veas esto y luego solo arrástralo un poco a la izquierda. Agradable. Ahora vamos a dar clic y arrastrar esto aquí. Hágalo blanco. Hacerlo un poco más pequeño. Título. Yo sólo voy a escribir algo. ¿ Te ves bien por quién? A lo mejor esto debe ser estrecho por ahora. Debe ser regular. Por Jack Dorsey capital. Vamos a arrastrar esto y ponerlo aquí. Hágalo blanco. Haz que se vea bonito. Todo esto. Y también necesito esto. Voy a copiar esto y esto y simplemente arrastrarlo aquí. Yo quiero hacer esto azul. Selecciona el marco, obtén blanco. Por ahora. A lo mejor un poco más grande en el centro. Aquí vamos. Y aquí. Ahora presione T y escriba $40. campo debe ser blanco. Ahora, todo en Alt y arrastre esto. Necesito mi red principal, así que no quiero salir de la escuela aquí atrás. Entonces esto va a estar aquí. Esto va a entrar aquí. Entonces tenemos la brecha entre ellos. Entonces necesito dos de ellos. Entonces aquí vamos. Sólo vamos a la escuela cooperativa de vuelta hacia abajo. Tener el mismo tamaño. Se va a copiar esto y sólo ponerlo aquí. Turno para hacerlo más pequeño. Lo mismo. Este texto ya debería ser un poco más pequeño, ¿verdad? Y 40 en la parte superior. A lo mejor el tamaño debería ser de 40 también. Ahora, selecciona esto y Shift y arrástrelo hacia abajo para ponerlo encima de esto. Vamos a subir. Entonces ahora es totalmente partido. Ahora, haga clic derecho, envíelo a atrás. Y es uno. Por lo que hemos recomendado para ti. Agradable. De acuerdo, lo deja principal, controlar, entrar, función de depuración, buscar, todo está en su lugar por nombre. Encomido por usted. Agradable. 29. Sección de oferta especial de diseño: hii Fi: Volvamos hacia abajo, es ir y conseguir algunas ideas. Seleccionemos este 110 de la cuadrícula de diseño. Algo así. A lo mejor buscando algunas ideas geniales. Y tal vez pueda usar este. Pero colorelo. Ponga, en lugar de agregar la canasta en las tarjetas, ponga el número aquí. Y los tres de ellos, porque estos son muy pequeños. Yo quiero ver el panorama general. Muy bien, volvamos. Usa el mismo entrenamiento o grumos Shift y Alt y arrastra esto hacia abajo. Por lo que llamamos a esta oferta especial. Especial ofrece un turno largo y lo convierten en centro. Arrástrelo hacia la derecha. Muy bien, Vamos a dar click en esto para que tengamos más espacio para una oferta especial. Voy a primero dar click en la principal y activamente, genial. A ver adónde voy. Voy a seleccionar este, aguanta Alt y Shift y arrastra esto hacia abajo. Entonces busco cuatro. Ahí hay cuatro de ellos. Haga clic aquí. Radio fronteriza 16. Ahí hay un truco genial. Presionando el Comando C, comando V, y haz que esta luz. Y arrastra esto hacia arriba para copiar uno encima del otro. Puede usar esta imagen. Entonces le estamos diciendo al cliente, ponemos la imagen aquí. No necesito la frontera y la grande ahora mismo, selecciona esta. Controla, mantén presionada Alt, arrastra esto hacia la izquierda. Arrastre esto hacia la derecha. Agradable. Necesito esto. Toma alrededor. Sólo voy a hacer doble clic para ir adentro, mantener pulsado, desplazar, hacer clic, Copiar, venir aquí, pegarlo, hacer clic y mantener presionado Alt y arrástrelo aquí. Bueno ser más pequeño. Pero antes de eso, para una oferta especial, necesitamos algunas etiquetas. Simplemente haga clic aquí y solo cree etiquetas. Seamos encarnados. impuesto seis estaría bien. Texto. Como un romance. Descripción de qué trata el libro, ¿de qué se trata esta oferta? Pero si la categoría de los libros, romance y tal vez juntos debería ser de 20, juegas con él hasta que tengamos algo en la escuela, un turno largo y lo arrastramos hacia la derecha. Llamemos a esto inspirador. Para que pueda hacerlo centro. No está mal, ¿verdad? Pero hagámoslo. Esto debe ser 12. Esto es debe ser varios más pequeños, algo así. Y tratar de hacer de este centro. Yo estoy arrastrando a la derecha. Lo mismo. Nuevamente, haga doble clic en copiar, haga clic aquí, control V centro inspirador. No quiero cumplir con esto en. Por lo que el fondo ilegal y arrastra hacia abajo para hacerlo un poco más grande. Ahora a la carta opción al carrito redondo puede usar esto toma comando o control V para llevarlo en la parte superior. Tarjeta. 16. Siguiente. También necesitan estos números. Pongámoslo aquí. Para la consola del dólar, estoy todo el tiempo. Arrástrelo hacia la derecha, haga este bit regular más pequeño. Y tal vez era d3 color. Hicimos descuento, bajamos la opacidad y pinchamos aquí en este ícono de Capa. ¿ Verdad? Ahora, ponlo aquí y centralo. Asegúrate de que el color esté cerca del azul. Significa arrastrarlo hacia la izquierda. Ten este color azulado claro y haz clic en este ícono aquí para el descuento. A lo mejor puedo hacer clic aquí y más ligero. Por lo que fue 53. Y ahora en cuanto al descuento, haga clic aquí, baje esto. Esto es lo que estamos creando. Ahora. Haga clic en el fondo y Control L para bloquearlo. Simplemente voy a dar click en esto y traerlo un poco a la izquierda. Agradable. Se puede sólo para traerlo a la derecha. Mucho mejor. Ahora haz click en esto y desbloquearlo. Ahora, volvamos a subir. Haga clic en una principal, active layout. Selecciona todos estos cuadrícula lipídica. Ve a la derecha. Se va a acercar un poco para poder vivir con ello. Agradable. Muy cool. Esta va a ser una oferta especial. Partes. Y el diseño de click está apagado en este momento. Hagamos click en el principal y anoten estos para hacerlo un poco más grande. Y también este plato. Y veamos qué hemos hecho. Recomendado para estos dos pico oferta especial. Se juega con él se necesita algo que tenemos que arreglar primero es éste. Explicé que toma el tamaño y todo. 30. Sección de descuento de diseño: hii Fi: Ahora el siguiente es descuento. Arrastre esto hacia abajo. Simplemente voy a poner estos descuentos. Y la primera letra es mayúscula. Y usemos uno de estos. Rastrearlo a la derecha. Y va a hacer esto bastante bueno aquí. Esta blanca. Yo sólo voy a poner esto aquí. Opción de descuento. Ya tienes el icono para esto. A lo mejor aquí esta. Copia esto y solo ponlo también aquí. ¿ Está bien? Y tenemos tiempo para los descuentos. Digamos que pongamos esto en 16, estaría bien. Sin frontera. En realidad el polaco debe ser blanco, el campo debe estar vacío. Probemos este. Y el tamaño siempre puede cambiarlo. Entonces, venga con la idea. Sólo voy a llamar a esto Rs. Buen radiador. Bonito. A lo mejor una semana más grande, 14. Y sólo va a tipo de control G para agruparlo. Trae aquí y trae aquí. Cambia esto a 12, y son 6. Segundo. Ahora selecciona tres de ellos y alinéelos desde el centro de esto. Muy interesante y muy cool. Ahora, estoy pensando demasiado bien. Dos o tres libros aquí para descuento. Lo que hago es diseñar algo como estos tipos. Pongamos esto en una frontera 16. Ya tienes un arriba este rosa lo aquí. Tráelo en la parte superior, haga clic derecho. Tráelo al frente y hazlo pequeño. ¿ Y qué pasa con el texto? Soporte de libro aquí? X Comando Control V, escoge un color, hazlo blanco, y hazlo más pequeño. Realmente no prestamos atención a las garrapatas y otras cosas. Apenas las ideas de los diseños y cómo deben colocarse las cosas, sólo cosas así. Y también en el carrito. Copia, esto de aquí debe ser bajo y se necesita, debe ser bastante agradable. Haga clic en esta camarilla k. Todo esto repite cuadrícula. Yo también puedo hacerlo. Aquí vamos. Entonces esto va a ser descontado y va Nuestro granito. ¿ Y todas estas coordenadas? Seleccionar, Seleccionar, seleccionar debe ser 16. Este. Está bien porque en la parte superior, 1616 y este, por lo que el radio de esquina debe ser 16. 31. Diseña últimas noticias en la sección de la sección de la de la de último: El siguiente, sólo vamos a copiar esto y arrastrarlo hacia abajo. Debería ser Últimas Noticias, que a todos les gusta. Se. Yo veo. Si puedo copiar desde cualquier lugar. Vamos a desagrupar esto, solo puedes hacer clic en uno de estos, arrastrarlo hacia abajo. Y quiero poner cuatro de estos naturalmente en este momento, grilla acaba de seleccionar. Yo quiero algo como esto. Y agregar al carrito. No importa así porque está en las noticias. No hace falta tener tiempo. Y también los usos deben venir en el centro. Entonces escucha estos dos y arrástrelo y ponlo en el centro. Es dejarles poner alguna línea de texto desde el centro. También se puede jugar con esto. Bonito. El siguiente, quiero añadir aquí la cara del Arthur, la foto de la otra luz. Y esto debe ser de color diferente. Es algo que es obvio. Bueno ahora, ¿qué pasa con el nombre Sarah? Y el momento de estas noticias ¿dónde? A lo mejor hace dos días. Ahora bien, no debería ser mayúscula, minúscula, un selecto, y arrastre este bolígrafo en algo como esto. Haga clic en Repetir cuadrícula. Y debido a que este árbol va a ser cuatro aquí, vamos dentro del hígado esto. Por lo tanto, presta atención al número y a la brecha. Por lo que siempre intentas diseñar algo muy fácil para nuestro desarrollador. 32. Sección de Testimonials de diseño: hii Fi: ¿ Y los testimonios? Simplemente voy a copiar esto, rastrearlo para nuestro testimonio. Entonces llamamos a estos no necesito logo para esto. Esto va a ser genial. En lugar de esto presiona Comando L para bloquear el fondo, solo voy a eliminar este. A lo mejor un venir con la idea de poner alguna imagen de algunos de los autores. Escribe la repetición polaca y repite crear, algo así. Y me lo voy a poner encima el uno al otro. Alguien en como estos tipos. Yo quiero mostrarte algo genial. Vayamos a Plugins. Volvamos atrás. Seleccione una de estas caras de la interfaz de usuario. On Unsplash es genial. Seleccionar fotos. Se puede seleccionar para aquellos medios o aleatoriamente campo hacia fuera nueve restantes y aplicados. Se lo va a llenar para ustedes chicos. Y tan rápido como eso. Ahora mismo, y doy clic en esto y lo desagrupo. Podría de nuevo este ícono de la letra aquí y hacer el último blanco. Esto va a poner aquí un número como más 60. Estos son el número de personas que lideran. Tenemos los testimonios sobre sus libros y reseñas. Entonces no quiero esto. Elimine esto. Y vamos a llegar a ideas muy interesantes. Para mí aquí a aquí. Recuerda que la frontera es de 16. Arrástrelo hacia arriba, se enfría. Uno de estos aquí es más grande que el top. Y la frontera aquí debe ser 3. Nuevamente, usa algunas de estas garrapatas. Haga clic derecho. Rompe adelante con azul. Veamos algunos. Y hay algunos testimonios o personas que están escribiendo alrededor de un 100 que acabamos de almacenar. Yo busco esto. Zoom. Copiarlo y volvamos aquí. Ponlo aquí pero eso arriba. Alineemos esto. Discurso, seleccione esto, seleccione éste, y seleccione éste y alinee todos ellos. Podría, y también necesito una flecha. Volvamos al icono y toque esta flecha. Hola, Gun, Control X. Volvamos porque solo está copiando en la parte superior. Si seleccioné esto y hago click en esta flecha va a estar justo aquí. Es mejor. A lo mejor hacerlo un poco más pequeño. Pero aquí puedes cambiar el color a otra cosa. Y la gente lo sabe. Y sólo entrando en esta capa, puedo simplemente cambiarla para desvestirlas exactamente eso. Simplemente pueden cambiar esto. A mí también se me ocurre una mejor idea. Apenas todos en pista este derecho derecho y envíalo hacia atrás. Déjame ver si se me ocurre una mejor idea. O puedo simplemente seleccionar todo esto, grupo, it, ir a esta ventana en la parte superior, rastrear esto. Y yo sólo voy a algo como esto en el color. Es decir, así que vamos por este color. Y antes de eso, este diseño es muy distrayente. Y yo sólo voy a sostener Alt y arrastrar esto hacia abajo. Algo así. También se puede jugar con esto. Ahora, puedo poner esto aquí. Es algo obvio que hay algo Benezet. Bonito. Muy bonito. Ahora, si hago clic, se va a cambiar de izquierda y derecha. 33. Diseña la sección de suscribirte y de pie de la sección de la sección de la de la sección de la cual: ¿ Qué tal suscribirse? Yo sólo voy a dar clic en esto. Simplemente voy a arrastrar esto para suscribirme a nuestro boletín. Vamos a llegar con un diseño muy cool aquí. 16, ¿verdad? Comando-c. Vamos, rastreamos esto a la derecha. Haz esto azul. No necesito éste. Por lo que necesito más espacio más t escriba. Y consigue el derecho. Aquí está el mango para hacerlo un poco más grande. El espaciado debe ser 20. Por lo que el espaciado debe ser de 40. Entonces ya hice el pie de página por ustedes, así que no pierdan el tiempo. A la tabla, algo de información al respecto sigue. Cliente de enlace rápido, mis ejes de coordenadas cartesianas se ponen en contacto. El domicilio, el teléfono y el correo electrónico. 34. Diseño de una página de filtro de la de Hi Fi: Muy bien, empecemos la página del filtro. Haga clic en la prensa principal Comando D para duplicarlo. Ahora bien, no necesito todo esto de aquí para también aquí. Dejémoslo, estaba bloqueado. Haga clic aquí y solo listas. Yo me quedo con el pie de página. Entonces, vayamos adentro. Y lo que necesitamos son libros. Y lo voy a hacer como pequeño. Sólo tráelo aquí. Ahora. Necesitamos todas las categorías de libros. Entonces vayamos a Amazon por ejemplo, como libros. Y desde aquí, y solo copia todas hasta aquí, por ejemplo, presiona Control de Comando C. Ahora, la mejor manera de hacerlo es bueno tu bloc de notas y copiarlo aquí. Archivo Guardar Como a un lugar. No importa como los filtros. Sí. Y cierra eso. Ahora, volvamos a nuestro diseño. Yo sólo voy a teclear aquí algo. Por ejemplo, los libros son buenos. Entonces tal vez 24 deberían estar involucrados, debería ser regular. A lo mejor un poco más grande, un poco 2004 está bien, supongo. Ahora, usa tu cuadrícula de repetición y arrastra esto hacia abajo. Mida, este tamaño está bien. Todo. Y arrástrelo hasta aquí. A lo mejor un poco más cerca, tal vez mucho mejor. Ahora, vamos a conseguirte una carpeta. El filtro es que acabas de guardar como nodo y simplemente arrastrarlo y soltarlo aquí y ver qué pasó. Mira, este contrato es el espaciado debería ser más. Y aquí vamos. Y esta es la forma fácil de hacer el bien en Adobe XD. Está bien. Pero ahora noto que el tamaño muy grande. Yo quiero que sea 18 y mejor. El brechas es muy alto y sólo bajarlo tal vez ocho. Muy fresco, Muy bonito. Está bien, Cool. Aún así, creo que es enorme. A lo mejor usar 16. Agradable. Muy bien, ahora, vamos aquí y sólo presione el tipo T. Más comentado. También los DC's deben ser audaces. Y hay un plus aquí, aquí. Aquí. Y estos deberían ser 14. Y también regular. Selecciónelos, Repetir cuadrícula, encogerlo hacia abajo. Y agruparlo. Debe ser libro más reciente destacado, como libros. Entonces esto es lo que hacemos exactamente. Y por el lado derecho, se nos ocurre esta genial idea. Yo sólo voy a copiar esto y traerlo aquí. Haz esto un poco pequeño. A unos diez les gusta este zoom. Tenemos el tema y el género y tal vez use cómics. Cinturón solar, regular. Tenemos algo de giro para ponerlo aquí. También tenemos que copiar. Ponlo aquí. Esto es enorme 12. Aquí. Tienes el formato del libro. Y eso es formato de libros diseñado para que pueda elegirlo. 16, demasiado, 8. Entonces presione T, Esto va a ser p d f, p, d f Tal vez un poco más grande. El precio tal vez 19 donante. Y nosotros también aquí, tenemos la tapa dura. Blanco. 16. También 16, 40. Por el otro. No hay necesidad de frontera. Esto es debe ser algo así. Añadamos este color. Eso es también. Está bien, genial. Para que puedas elegir entre, quieres la tapa dura o PDF a la activa. Esto está activo cuando se Agregar al carrito. Por lo que esta es la mayoría de las veces simplemente copiamos esto del diseño de página anterior. Entonces para conseguir una vida más fácil, entrar en principal y este va a ser diseño de página. Si consigo camarilla, estaría bien. Control G para agruparlo. Agradable. Apague eso, seleccione todo esto. Repite grilla, bájala. Pero también quiero prensa Control Z. También quiero línea aquí. A lo mejor se alineará y descargará nuestra ciudad. Algo así a esto. Rejillas de foso. Qu. Bastante bonito. Por lo que si hace clic en estos iconos aquí, puede tener esto. También puede llevar esto a la izquierda un poco. Y basta con echar un vistazo a esto. Yo sólo puedo arrastrar esto a la derecha. Esto es algo que sucede así. Tienes que abrir esto. Tienes que aumentar esto. Y se puede jugar con esto. Estar alineados con esto. Retrocedamos un poco. Aquí vamos. Es más bonito, más limpio. Entonces hasta aquí estaría bien. 35. Diseña una página web de la de la página de la de la primera forma en el diseño de la de la misma: Ahora aquí, hicimos algunas páginas aquí. Yo sólo voy a dar click aquí. Vayamos adentro. Esto va a ser más viejo. Conoce la frontera también. Entonces este va a ser el número uno. Entonces va a ser el número 2. Algo así, pero un poco más de color a ella. El color de fondo debe ser el mismo que el erudito. Con MS es un activo. A lo mejor éste debería ser un poco de luz baja, más brillante. Ahora, aquí tenemos página siguiente. Debería ser la página siguiente. No necesito éste para esto. Vamos a agregarle un color. Esta debe ser la página anterior. Tapa P. Y es agregar algunas flechas, dados estatales. Era, cool. Este. Este. Y dar click en esto. Mi Control X, Control V para copiarlo. A veces es más fácil. Por lo que el color anterior debería ser algo así. Otra vez. Si arrastro esto y lo pongo aquí, cámbialo aquí, hazlo bien. Esto es demasiado grande. A lo mejor un bloc de notas debería ser un t en también. Y aquí y aquí vamos. Aún así esto es para apuntar así. Y así esto se debe hacer estallar, esto debe ser bajo. Por lo que 1234. Y voy a usar, ponerlo, algún lugar está fresco. 36. Diseño de secciones recomendadas y populares de la de la hi-Fi: Nuevamente, hemos recomendado. Ahora activemos la grilla. Y sumemos seis libro recomendado. Podemos usar lo mismo aquí. Haga clic, haga clic, Copiar, salir y pegar. Aquí vamos. Nuevamente, cierra eso un poco. ¿ Y esto y esta copia? Ven aquí. Simplemente pégalo aquí. ¿ Por quién? Janice. Hazlo más pequeño. Muévete aquí. Lo que necesito es este arrancador. Y en el carrito copiando, salir y pegarlo. Así que seleccionar, seleccionar, seleccionar, seleccionar. A lo mejor poner en el centro. Bonito. Entonces solo voy a dar clic aquí y sólo hacer esto bastante más grande. Deseche todo esto. A lo mejor puedo hacerlo. Selecciona este, selecciona éste y arrastra esto hacia abajo. Y lo hice bonito. Necesito arrastrar esto hacia abajo. Ahora siente que la frontera debe ser azul. Y haga clic derecho y envíelo a la espalda. Entonces haga clic aquí, alt y arrastre aquí, alt y arrastre aquí. Muy bien, ahora vamos a cerrar mi espacio. Haga clic en Repetir cuadrícula fácilmente y vea qué pasó. Yo voy a explicar. Presionar Comando o Control Z. Otra vez, Comando o Control Z. Tenemos que agruparlos, o al menos tenemos que seleccionarlos todos. No es necesario agruparlos. Porque al seleccionarlos y hacer clic en Repetir cuadrícula automáticamente se va a seleccionar. Y esto es lo que pasó. Pero el espaciado de la media, mira, si arreglo esto, espaciado va a estar bien. Mira seis de ellos. ¿ Y qué tan fácil es eso? Esto no se va a recomendar y lo mismo que el riesgo va a seleccionar a ambos como este o Alt y Shift y arrastrar eso hacia abajo. Esto va a ser popular. Y eso es todo. Y arrastra esto hacia arriba. Selecciona todo el lienzo. Amplía un poco y cierra eso. Acerquemos y pinchemos para ver la página. Escribe libros y toma lo que hay aquí mismo. Necesitamos dirección de dondequiera que vengamos aquí. Debe ser de casa y ajustador de guión. Entonces esto va a estar en la cima. Es bueno estar aquí. Y toda la página y todo el asunto desde aquí. Sube a ella. Bonito. Y éste no es tan malo, ¿verdad? Ver una vez más. Libros. Aquí vamos. En la corte aquí. Esta línea debe ir hasta el final. Volvamos atrás. Pequeñas cositas que solo tienes que arreglar. Bonito. Portada sigue página siguiente, página anterior. Encomiado, popular, y se irá. Entonces el total de ellos. Entonces si hacemos click en el signo más, puedo ver que va a estar abierto y agradable. Haga clic en gratis para revisar estos diseños de cuadrícula. Y esta era nuestra página de filtro. Si haces click en este libro, ¿qué va a pasar? Cada libro tiene su propia página. 37. Diseña un sola página de libro y información de la información de la de la sola en la página de un l: ¿ Qué va a pasar si hago click en este libro único. Entonces va a tener su propia página. Haga clic en el icono Filtro, presione Comando o Control D para duplicarlo. Ahora, seleccione aquí y elimine esta parte. Seleccione aquí. Yo sólo voy a ir en un rato. Yo quiero quedarme con uno de estos y desagrupar la grilla. Haga clic derecho. Desagruparlo. Necesitamos estos surcos. Agregar al Carrito y algunos de los textos. No necesitas éste, borra. No necesitamos este PDF. Puedo poner estos libros porque si lo decimos son libros. Y por ejemplo, esta categoría de libro es cómics. Va a ser un momento para gustarle esto. ¿ Correcto? Yo sólo voy a arrastrar y poner este aquí. A lo mejor un poco arriba, abajo, Shift. Arrastre esto hacia abajo. Hazlo muy pequeño. Aquí vamos. Más pequeño. Repetir cuadrícula. Necesito tener cuatro de ellos. Si puedo poner este golpe. Pero sigue siendo el tamaño es de dos pq, pero es más pequeño. Por lo que debería estar en el centro. De nuevo, haga clic y seleccione. Ten algo de espacio. Agradable. Y estos dos deberían estar bien. E integral aquí. El título debe ser 20, por ejemplo. Y lo necesito. Este lo va a poner aquí. Comando X para salir de esa caja verde. Comando de control V, cambia el color a azul para que pueda verlo. Esta va a ser la imagen del otro. Y sólo voy a oírme, puedo usar uno de estos escritores. Sarah. Esta va a ser zona que se va a tirar. Tengo que anotar si tan sólo copian estos dos aquí deberían publicarse. Uno de los famosos editores es Mc Kay. ¿ Y cuándo se va a publicar? A lo mejor no enciende un nuevo libro. No necesito éste. Puede descomponer estos aquí abajo. Yo lo puse aquí. Déjame hacer esto un poco más grande. También necesita algo así como 26. Esa es una alineación muy importante y bajar. Entonces cuando entramos, podemos poner algo como esto también. Yo sólo voy a copiar esto. Asegúrate de que esté alineado y solo voy a teclear un poco porque se lo va a comprar del Amazonas tal vez. Y los intentos de Amazon deberían estar aquí. Y también podemos simplemente ponerlo de este lado. Viniendo aquí. Y tal vez fue 246. Y aquí, Bowl viaje irregular. Aquí lo mismo. Para que puedas elegir entre PDF, un poco y tapa dura. Aquí vamos. Bájala y ponla aquí. Haga clic. Pero me hacen clic para entrar. Yo estoy sosteniendo los chicos de Control Glick. Usa estos círculos y simplemente arrástralo por dentro. Entonces va a ser programador. Ahora, solo voy a seleccionar todo este tracto es Cuéntame. Y quiero poner esto aquí. Ahora solo voy a arrastrar y seleccionar todo esto y arrastrarlo hacia arriba. Este va a estar debajo del lado derecho. También necesitamos un botón Compartir. Vayamos a Filter. Simplemente voy a llamar a este icono de compartir. Selecciona una de estas. Por lo que seleccionaremos uno de estos iconos. Comparte ícono aquí, o éste puede comparar. Creo que éste es mucho mejor. Este es enorme. Está bien, así que tienes el icono Compartir. También necesitamos corazón. Puedo arrastrar y soltar esto aquí. Cambia el color a azul. Y el contorno debe ser azul. En realidad, saber, sentirse mucho mejor. De acuerdo, y mira, tenemos que alinearlo desde arriba. Agradable. También tenemos esta diversión. Pero para que TCF ponga el número como 4, bien, bonito. Y por dentro, sólo voy a necesitar tres críticas. Hagámoslo un poco más pequeño. Pongámoslo aquí. 12 es un buen número. Y bien, puedo seleccionar esto y hacer esto un poco más grande también. Del mismo tamaño que éste. Otra cosa que tenemos la mayor parte del tiempo es este signo para el descuento. Su velocidad, el diseño que efectivamente salimos. Porque tienen caja de contorno. Por eso a veces siete, ¿no? Selecciona el top one y k2 que este selecto esta esquina debe ser ocho, bonito. O el azul debería ser de 20 por ciento de descuento para hoy. Y esto es 0. Para que pueda caber dentro. Ver también cuál bajar esto. Del mismo tamaño. El siguiente, sólo voy a subir un poco. ¿ Qué más tienen? Lo mismo. Sostenga el control y seleccione éste, arrastre hacia arriba comando Control X para ir seleccionar fuera y comando o control V. Muy bien, ahora activemos el borde de unos pocos. Dame ir. Selecciona el número 1. El campo debe ser negro y también audaz. Lo va a poner aquí en el centro. Y luego Alt, arrastre esto hacia la derecha, haga doble clic en Shift plus. Volvamos aquí. Turno. Y esto sube. Este es el color debe estar arriba, algo así, ¿verdad? Este también debe ser azul. Por lo que puedo agregarle seleccionado, ver su tamaño real, correcto, así de malo. Entonces tenemos todo aquí, ¿verdad? ¿ Qué más tenemos basándonos en nuestra investigación, tenemos algo llamado, solo voy a usar este formato aquí. Y yo sólo voy a hacer estas estadísticas y no hay brecha entre ellas, tal vez 0. Contamos con detalle de producto y además tenemos vista acostumbrada. Está bien. Sólo voy a hacer de esto un ritmo. ¿ Y qué más necesitas? Necesito una línea aquí, de aquí a aquí. A lo mejor de color azulado. Arrastra esto un poco hacia abajo. Es seleccionar la entrada que aquí. Agradable. Y sólo voy a dar clic y dibujar algo aquí. Haz esto. Vamos adentro. Pero luego Alt, arrastra este rincón hacia abajo. Alt arrastra esta esquina hacia abajo. Esto es exactamente lo que necesitamos. ¿ Qué tenemos aquí? Vamos a usar esta línea, arrastra esto hacia abajo. Y tenemos título de libro. Haga clic en ambos y asegúrese de que sólo podemos usar este. Ahora solo voy a seleccionar ambas. Repetir Rejilla. Agradable. Desagruparlo. A lo mejor voy a volver a configurarlo, haga clic con el botón derecho desagruparlo. Entonces crearé éste debería ser el otro. Entonces sólo voy a quitar estos, arrastrar un poco esto hacia abajo. Las etiquetas pueden ser algo así como este tipo va a poner ocho y también hacerlo azul. Es demasiado. A lo mejor por amor. Estas son la categoría del libro. Entonces sólo voy a poner algo como esto. Amor, porque tenemos mucho de esto. Sólo voy a seleccionar este y mantener pulsada la tecla Mayús y seleccionar también ésta, pulse Comando o Control G para agruparla. Cuando hacemos eso, tenemos aquí algo llamado relleno, sólo tomó datos. Entonces significa que a partir de ahora, utilizo este método. solo ir a usar va a ser 10 también. Así es nivel, por lo que está en el centro en este momento, 10, 27, 27. Hagamos esto 28. Y este 128 también de izquierda y derecha. Ahora prueba esto. Si presiono Alt y Shift y arrastra esto y lo pongo en el lado derecho. Y yo sólo voy a llamar romance a esto. Sólo echa un vistazo a eso. Ver, prominencia. No necesito hacer nada más. Va a estar en el centro y me va a dar una línea también. Llamemos a este diseño es yo y j Esto fuera va a ser lo mismo, 1028, 1028, escribir algo en la parte inferior. Seis. Entonces esto van a ser seis también . Arrastra esto hacia arriba. Qué más tenemos del lado derecho, tenemos libros relacionados, lo cual es muy importante. Todo el mundo lo estaba pidiendo. Entonces solo voy a usar uno de estos y solo arrastraré este aquí. Más pequeño, desagruparlo. Si solo puedo caber estos dos años de edad, es demasiado pequeño. No tan mal. Yo libros relacionados. Pégalos a los dos. Repite grilla y aquí vamos. Cuatro. Puedo poner algo aquí. Yo sólo voy a usar este. Y ahora tenemos que diseñar la barra de clientes. Y esta es la parte complicado. Nosotros lo vamos a diseñar aquí primero, ¿verdad? Y estos son los comentarios que la gente agrega a esto. Muy interesante. Hagámoslo bien. Al igual que los nombres de las personas. Dave Jackson debería ser regular. Y estos deberían ser algunos textos que mencionó sobre el libro. Y esta va a ser la estrella que dio . Está bien, Cool. Agradable. Tenemos para estos por ahora. 38. Crea animación de componentes para los detalles del producto de Hi Fi: Muy bien, ¿cómo crear el componente? Selecciona la parte que quieres que desaparezca. Entonces significa que si hago clic en esta opinión de clientes, no deberíamos ver esta parte, ¿verdad? Por lo que éste debe ser grupo, Comando o Control. G. Bonito. Ahora, si hago clic y selecciono todos ellos y selecciono la parte componente. Este, tenemos un estado por defecto. Haga clic en este signo más y haga clic en Nueva finca. Simplemente déjalo en el estado dos o simplemente puedes ponerlo en revisión de clientes. Lo dejaré en el estado dos. En ensayo 2. Recuerda, selecciono este grupo y derribo la opacidad. Entonces no veo este. Y también es lo que va a pasar. Simplemente voy a dar click en esto. Se contrata a la derecha. Agradable. Haga clic en esto, y este debería ser de este color. Y esta opinión de clientes debe ser totalmente azul. ¿ Qué más? Simplemente voy a seleccionar este comando Control X. Ahora, sólo voy a entrar, hacer doble clic dentro de Command Control V y arrastrar esto hacia arriba. Ahora estoy dentro del estado de este componente. Si ahora pudiera volver a seleccionar esto, vaya al estado predeterminado. Si tienes que hacer algo llamado prototipado, Hagámoslo ahora mismo para que sepan a qué me refiero. Ir al prototipo. Quiero cuando haga clic en esta costumbre, cuando haga clic en esta opinión de clientes, solo haga doble clic en ella. Ya ves que esto está pasando. Significa por tapping. Y esta visión habitual, puedo ir y elegir mi destino podría destino es el estado a enfriar. Y la flexibilización debe ser una facilidad de entrada, de salida. Y la duración es de seis segundos. Vayamos afuera. Volvamos a poner el diseño. Da click en este producto de u Ahora vamos al estado 2 y al estado dos. Si hago clic en Detalle del producto, ¿qué va a pasar? Nuevamente, es bueno hacer prototipos. Haga doble clic en detalle del producto, haga doble clic. Significa que al tocar el detalle del producto, la transición debe estar en auto animate. Tenemos el cambio esto también, el anterior. También el tablero es por defecto, estado seis segundos. Entonces salgamos y seleccionemos este, y vayamos al estado predeterminado. Y en defecto, si hago clic en esto, la transición, el tipo debería ser bueno para animar. Por lo que necesito esta animación suave de izquierda a derecha. Vayamos afuera. Haga clic en diseño, haga clic en esto. Por lo que podemos cambiar si ves éste, click en Predeterminado Estate. Entonces otra vez, esto, se puede ver que esto es todo. Ahora haga clic en filtro y reproducirlo. Simplemente echa un vistazo a esto. Si hacemos clic en las opiniones de los clientes, ¿qué pasó? Si hago clic en los detalles del producto, ¿qué pasó? Por lo que llamamos a este estado componente. Haces mucho ejemplo y mucha práctica y la, así que no te preocupes por ello. Esta es sólo una simple explicación de cómo funciona. Y aquí vamos, Sigamos. Por lo que en la parte inferior tenemos algo llamado recomendado. De nuevo, sólo voy a copiar a estos tipos. Simplemente arrástrelo y suéltelo aquí. Agradable. Y eso es todo. Sólo vamos a arrastrar esto hacia arriba. Vamos a entrar. Y esto es lo que hacemos. Agradable, muy cool y muy interesante. Presione Command o Control S para guardar también esta página. 39. Crea mi página de tarjetas de la de la de Hi Fi: Ahora esto era un cómic, una página sobre cómic o un solo libro. El segundo es mi tarjeta. No necesito todo esto. Eliminar. Yo no quiero este también. A lo mejor me quedo con el resto. No me gusta formatear el nombre. Está bien. Está bien escribir aquí. A lo mejor puedes decidir si quieres conservarlo o no. Ten algo extra aquí. Teníamos que escribir un nombre, tratamos de hacer esto muy pequeño. Y también tenemos algo como esto. Añádalo al carrito, ¿verdad? No necesito esto, ¿verdad? Bueno, no hay necesidad de hacerse más pequeños. Esto sólo lo va a poner aquí. Entonces aquí va a ser libre. Y el número ISBN para asegurarse de que este sea el mismo libro. Voy a poner. Esto podría ir a una G a grupo. Se va a venir aquí. lo que estoy pensando es algo que por encima de esto, de sólo ir a seleccionar todos ellos son turno largo, arrastra esto hacia abajo. Necesitamos algo como esto porque podrías tener múltiples libros en esta página. Y hay que tener pobre el azul, pero muy, muy azul claro. Sólo voy a copiar esto y traerlo aquí. Haga clic derecho, Traer al frente. Estos son los ítems, tal vez tengamos un ítems de archivo. Muy bien, arrastra esto a la cantidad correcta. También tenemos el precio y el precio total. Precio tal vez fue forrajeo. Y el precio total va a ser de 40. ¿ Qué más tenemos? podemos tener basura Aquípodemos tener basura en el basurero. Puede ser a la izquierda. Trae todo a la izquierda. Si quiero, puedo borrarlo. Puedo seleccionar todas estas cuadrícula de repetición. Pero antes de eso otra vez, necesitamos la línea clínica, pista, ciudad abajo. Selecciona toda esta cuadrícula de repetición. Aquí vamos. Tres, bien, desagruparlo. Se supone que son cinco. Significa que esto va a ser para los dos libros ordenados del mismo libro, tal vez 20 también. Este va a ser el 80 dC. En la parte inferior tenemos algo llamado subtotal. Aquí vamos. Tenemos GST, muy bajo. ¿ Qué hace la mitad si tenemos un cupón? La disciplina debe ser azul. Este debe ser azul, sin campo. Y esto crea algo interesante. Presione Comando C, comando V. Arrastre esto hacia la derecha. Para el azul, necesito x. yo. A lo mejor escribe tu propio código aquí, debería ser más pequeño. También aquí. Tener un código de cupón. Agradable, y arrastra esto hacia arriba. ¿ Ves cómo se ve mi tarjeta? Plato. Para que tengamos cinco artículos cuando precio total, subtotal GST, envío, pago total en tu código aquí. Y eso es todo. 40. Crea el seguimiento de envíos: diseño de Hi Fi: De acuerdo, Para nave y rastreo, solo selecciona el título Control de Comando V. Va a llamar a esto significaba seguimiento. Y no necesitamos, tal vez necesito este título se va a llamar a esto. Aquí hemos esperado la entrega y debe ser tiempo en ello. 16 o ejemplo. Este, no tengo éste. Aquí. Tenemos sus paquetes fuera para su entrega. Selecciónelos todos, haga clic derecho y desagrupe porque no necesitamos esta parte. Esta parte y esta parte. No hay tiempo seleccionar todo esto hacia abajo Shift para hacer todos estos diversos pequeños. Ok. Selecciona esta T. Sólo tienes que arrástrala hacia la derecha. Bajar un poco esto para nuestras partes principales, que va a ser parte muy, muy interesante. Cual contrato es tapa redonda, azul. A lo mejor cinco o tal vez 10. Ligand el círculo. Todo encendido, todo el tiempo vaina de aquí. Aquí. Pero éste debería ser gris. También. Pon DCL abajo, desplaza hacia atrás y desplaza, arrastra esto hacia la derecha. Yo también voy a hacer esto marrón. Y lo puse aquí, abajo, Shift, arrastra esto hasta aquí. Por lo que este va a ser nuestro principal rastreo de envíos. Sólo voy a cooperar. Y estos son los textos envío pronto. Y también debe ser gris. Y aquí tenemos algo llamado inconsciente, que es de muy baja opacidad. Por lo que este es el seguimiento del envío en el proceso. ¿ Qué más necesitamos aquí? Necesito el precio, $40. Ese mismo año. No necesitas esta parte. Yo sólo voy a copiar esto y rastrearlo . Se va a ir adentro. Va a ser rastreando detalles. Control de lámpara y selecciónela. Entonces Alt y Shift y arrastra esto hacia abajo. Subamos un poco. Y necesitamos esta frontera. No hay necesidad de tener pista. Y yo sólo voy a seleccionar esto y subir un poco. Y además solo voy a usar el mismo título. Va a ser algo así. Selecciona esos, ven aquí, ven aquí. Entonces este es el proceso que hay que agregar, tal vez paquete llegó. Y a ti te llega la idea. Y yo sólo voy a subir lo mismo. Por lo que terminamos con nuestro rastreo de envíos también. 41. Diseño de la página de la página de la página sobre nosotros: Para crear la página Acerca de Nosotros basta con hacer click en esta otra vez. Podemos utilizar la primera y la página principal para que se va a mantener presionada Alt y sólo copiar éste. Ponlo aquí. Vayamos adentro. Sólo voy a llamar a esto Sobre Nosotros. Suprímate esta parte. Esta parte, solo quiero pausar la foto aquí y solo tienes que hacer clic en este Comando o Control L para bloquearla y simplemente eliminar todo esto. Simplemente voy a borrar éste vendrá a ser sobre tal vez pueda centralizar éste. No necesita esto. Desbloquea. Prueba esto. Y también podemos usar el mismo método. Aquí. Va a ser tal vez. Y agregamos algo de texto aquí, chicos. A lo mejor nos gustaría el número 6. Esto ha pasado. Entonces eso son seis. A lo mejor tenemos un conteo de números. No se puede controlar L para bloquearlo. Y está centralizado. Esta línea es del centro. Centro. A lo mejor ir y mejor, selecciónelo todo y desde el centro. Ahora. Y solo repite grilla. Sólo necesito para Ungroup. Ahora sólo voy a poner una imagen aquí, por ejemplo. Esta es la parte de la imagen. Y creo que cada uno simplemente vamos a escribir algunos improbable proporcionar libros de mejor calidad en el mercado. Seleccionado y la capital X. ¿Cómo me controlaba? 16. Entonces dos como éste. Entonces la cantidad de publicación que tenemos o lo hacemos aquí, hacen muy pequeña. Arrastra esto hacia abajo para no 400. Entonces ambos, tal vez éste debería ser un poco más grande. A lo mejor 26 va a ser compradores. Selecciona este y éste debería ser 0 aquí también. Por lo que necesitamos foto aquí. Tienes algún testimonio. No necesito éste. Eliminar eliminar el testimonial ya sucedido, seleccionado, y arrástralo hacia arriba. Y necesitamos suscripción y también la ubicación. Por lo que pones la suscripción aquí. Y puse no localizacion aqui. Porque quiero usar estas vacaciones y traerlas aquí. Pega ellos. Asegúrate de usar el color azul. Selecciónalos y hazlos un poco más grandes. Y en el mapa, seleccione aquí. De acuerdo, para el mapa, tenemos un plug-in. Se llama mapa de fantasía. Simplemente selecciona el mapa y sólo tienes que ir a él. Y tal vez Tokio, realmente no importa, Tokio. Y puede recoger este y aplicar el mapa. Eso es todo. Y aquí necesitamos pin. Simplemente voy a acercar y crear una elipse y un círculo. Algo así. borde debe ser blanco. Los campos deberían ser tal vez. Por qué deberían ser tal vez cinco. Basta con hacer doble clic en él. Aquí está éste. Arrástralo hacia abajo. Nuevamente, crea una elipse, el centro. El borde debe ser blanco. Y cinco tal vez no hay campo. Y es lo que hacemos. Turno, haga clic en esto y menos, y eso es todo. Esto es lo que tenemos aquí. Sólo tienes que hacer el tamaño un poco más pequeño. Y tal vez sea el lugar. Interesante, ¿verdad? Y aquí vamos. Haga clic y arrastre esto hacia arriba. Veamos lo que muchas veces olvidamos de nuestro discurso. Mercancías y desgarro, y sobre el libro, algunos textos o misión y nuestra historia. guardarse testimonios o ubicación. Y eso es todo. Se mantuvo encendido. Agradable. Está bien. Cerremos ese tapón. Cerremos este. Y la siguiente parte, hicimos prototipado. Este es uno de los mejores y lo divertido que nos encantaría hacerlo en Adobe XD. Seguro que a ustedes les encantó. 42. Cómo empezar a prototipos y animación: Antes de hacer el prototipado, Vamos a jugar con sí auto animación y prototipo y entender lo básico de la misma. ¿ Verdad? Ahora, he creado la caja aquí y estoy tratando de duplicar esto. Aguanta Alt y Shift y arrastra nuestra mesa de trabajo para escribir. Correcto. Ahora, arrastra este. Ellos regresan. Si arrastro esta fórmula hacia abajo, muevo, arrástrela hacia la derecha. Es así como funciona. Yo quiero cuando haga clic en esto, esto se va a mover a la derecha. Entonces cómo funciona, vaya al prototipo. Cuando vayas al prototipo, cuando selecciones algo, esto va a aparecer. ¿ Verdad? Ahora solo voy a arrastrar esto y soltarlo a esta mesa de trabajo. Yo le estoy diciendo lo que voy a dar clic en este cubo y una caja, moverlo a la derecha, y ves esta línea, esto se llama wireframing. Por defecto es destapar. Entonces significa que si hago clic en esto, va a escribir el tipo por defecto está en transición. Y dos, por lo que significa si haces click en esto se va a R2 y se disuelve la animación. Y la duración es de un segundo. El tiempo que va a este de izquierda a derecha. Haga clic en esto. Vamos a jugarla. Como usted está arriba. Saltando a la derecha. Ahora. Vuelve atrás y selecciona esta otra vez. Buena transición. Y en lugar de transición, solo ponlo en auto animate. Por lo que el tipo es auto animate. El relajamiento no es ninguno. Ahora mismo voy a explicar. Haga clic en Mesa de trabajo, plato, seleccione y haga clic. Es sólo arrástralo a la derecha. Es como una animación de izquierda a derecha es entender por sí misma. Ahora bien, si selecciono este y arrastro esto a la izquierda o al tablero de arte uno. A esto se aplica lo mismo. Al tocar esto, escribimos auto animate y Eurasia por un segundo. Si hago click de derecha a izquierda, Vamos a jugar. Jugar. Jugar. Es animación simple. ¿ Y si quiero este? El relajamiento, debe estar en facilidad fuera para este. Y por la derecha a la izquierda. Voy a poner una facilidad en. ¿ Ves la diferencia? Esto está fuera. Va rápido y lento. Déjame sólo hacer una cosa más. Yo quiero hacerlo más pequeño. Simplemente selecciona este cambio de columna, selecciona este, y haz que ambos sean varios pequeños. ¿ Verdad? Para que pueda ver la duración. De nuevo, ve al prototipo, selecciona éste, placa, ve qué pasó. Va a ser muy rápido y muy lento. Este está empezando un lento, es 0s adentro, esto está desacelerando y va rápido está fuera. Significa que cuando estás terminando trató de ser lento. Pero el mejor es siempre, es esto usando, usando dentro y fuera, decir el inicio, los diversos humildes en el medio, van rápido y al final, tratan de frenar de nuevo. Este es cualquier plato Zout. Izquierda, derecha, derecha, izquierda en el centro es rápido de surtidos, lenta al final es una lenta. Esa transición va a ser de modo diverso. ¿ Y la diferencia entre usar snap? ¿ De derecha a izquierda? Pongámoslo, terminemos la diferencia. Entonces a la izquierda, a la derecha es un chasquido. Simplemente chasqueando al lugar. De derecha a izquierda es viento volviendo atrás y solo saltando. Es como un correr, ir rápido, conseguir un impulso como ir, chasquido, impulso, ir rápido. Este que usar al final debe ser equilibrio, digamos. Y este es un chupón. Ve la diferencia entre snap y bounce. Simplemente rebotando como este. Y esto va a ser varios bajos y justo al final va adelante y atrás. ¿ Qué pasa con la duración? Si hago click en esto y duración, tenemos 1 segundo. Pero puedo venir aquí y presionar el número tres y entrar. Ahora la duración va a ser de tres segundos. ¿ Ves la diferencia? Haga clic. Esto está tomando tres segundos. Entonces esto es rápido. ¿ Qué pasa con estos? Los extranjeros podrán hacer éste por el posible sí. Cuatro segundos. Por lo que 3 segundos rebote. Fuerza otra vez. Snap. Segundo rebote por un segundo, snap. Entonces solo estoy explicando la parte de animación. Ahora intentemos poner esto en 1 segundo para ahorrar tiempo. 1 segundo. Y auto animate es una facilidad de salida. Este también está en su fuera. Esto es mayormente lo que hacemos. ¿ Cuáles son los desencadenantes? No quiero simplemente dar click en esto. A veces quiero tener una página limpia. No quiero que aparezca mi ratón. Por lo que solo voy a dar clic y seleccionar el alambrón, ir a gatillo y ponerlo en Keith y gamepad. Significa que puedes escribir unas palabras clave como S. Así que si presiono S, esto va a ser animado como esta. No quiero poner mi ratón aún, mi ratón lo afuera. Y presiono S, se va a animar. Pero para el siguiente, tengo que dar click. Si quisiera que éste fuera con llaves, podría desencadenar. Pero al igual que las teclas y gamepad tipo S también. Por lo que la placa S, de nuevo, ya que funciona. También podemos activarlo con arrastre. Sólo voy a arrastrar esto. Está bien. Yo sólo voy a arrastrar esto a la derecha. Eso es todo. Otra vez. La prensa S va a volver. Se va a arrastrar hacia la derecha. ¿ Qué pasa con la voz? Puedes poner tu voz, sí, quiero decir, puedes decir, oye, y esto va a ser animado. Y también hay que sostener la barra espaciadora. Y tu avión te va a decir sostén la barra espaciadora y dirás: Oye, ahora porque estoy grabando, no voy a hacer esto. Entonces Spacebar y di: Oye, y va a funcionar. Yo sólo voy a poner una ficha ahora mismo. No se va a arrastrar. Por lo que la mayor parte del tiempo está sin explotar. Y éste también está sin explotar. De lo que voy a mostrar mi animación, lo pondré en palabras clave y gamepad, Así que no uso mi ratón en toda la página. Ahora, déjame mostrarte una cosa más sobre auto animate. Voy al modo de diseño. Yo sólo voy a arrastrar esto a la derecha, derecha. Y sólo trataron de asegurarse de que este es círculo C va a conseguir esta esquina y convertirlo en un círculo. Y sólo ver esta animación chicos. Al tocar va a ser tan guay. Volvamos atrás. Tapping es bueno escuchar. Entonces esto se llama auto animate y lo ponemos en la flexibilización. Debe ser está dentro, es fuera la duración que lo pones a segundo. Ahora lo puedes ver mejor. Y lo mismo aquí, sacarlo a segundo. A ver qué pasa. Ahora va a ser muy pequeño porque la flexibilización estaba en ninguno ahorita está encendido, está en su fuera. ve muy bonito y muy suave. Ahora ustedes saben lo básico del prototipado. Sólo voy a seleccionar ambos y eliminarlos. 43. Prototipos la página principal: Antes de hacer el prototipado, Vamos a jugar con la auto animación y post dip y entender lo básico de la misma. Muy bien, ahora he creado la caja aquí y estoy tratando de duplicar esto. Mantén pulsado Alt y Shift y arrastra o orto a la derecha. Está bien. Ahora arrastra este, arrastra éste hacia abajo, desplaza, arrástrala hacia la derecha. Es así como funciona. Yo quiero cuando haga clic en esto, esto se va a mover a la derecha. Entonces cómo funciona, ve al prototipo y vas a Puerto cuando seleccionas algo, esto va a aparecer bien. Ahora. Sólo voy a arrastrar esto y dejarlo caer a esta mesa de trabajo. Yo le estoy diciendo lo que voy a dar clic en este cubo y una caja, moverlo a la derecha, y ves esta línea, esto se llama wireframing. Por defecto es destapar. Entonces significa que si hago clic en esto, va a escribir el tipo por defecto está en transición y la herramienta de mesa de trabajo. Entonces significa que si hacemos click en esto se va a R2 y se disuelve la animación. Y la duración es de cuatro segundos. El tiempo que va a este de izquierda a derecha. Haga clic en esto. Vamos a jugarla. Como usted está arriba. Eso es todo, saltando a la derecha. Ahora. Vuelve atrás y selecciona esta otra vez. Buena la transición. Y en lugar de transición, solo ponlo en auto animate. Por lo que el tipo es auto animate. El relajamiento es no, ahora mismo voy a explicar. Haga clic en Mesa de trabajo, plato, seleccione y haga clic. Es sólo arrástrelo a la derecha. Es como una animación de izquierda a derecha es entender por sí misma. Ahora bien, si selecciono este y arrastro esto a la izquierda o a la Mesa de trabajo 1. A esto se aplica lo mismo. Al tocar esto, escribimos auto animate y Eurasia por un segundo. Si hago clic de derecha a izquierda, como se juega, juego, juego. Es animación simple. ¿ Y si quiero este? El relajamiento, debe estar on easy out para este. Y por la derecha a la izquierda. Voy a poner una facilidad en. ¿ Ves la diferencia? Esto está fuera. Va rápido y lento. Déjame sólo hacer una cosa más. Humo automatizado. Simplemente selecciona esta columna, cambia, selecciona esta, y haz que ambas sean muy pequeñas. ¿ Verdad? Para que pueda ver la duración. Se puede ir al prototipo, seleccionar esta placa y ver qué pasa. Va a ser muy rápido y muy lento. Este está empezando un lento es fácil, la piel se está desacelerando y se va rápido se está apagando. Significa que cuando estás terminando trató de ser lento. Pero el mejor es siempre, es esta flexibilización es un interior, significado. El inicio muy despacio, en el medio, va rápido y al final intenta frenar de nuevo. Este está en su placa LT. Izquierda, derecha, derecha, izquierda en el centro es rápido de surtido, lento al final es, es lento. Esa transición va a ser de modo diverso. ¿ Y la diferencia entre usar el snap? ¿ De derecha a izquierda? Pongámoslo, terminemos la diferencia. Entonces a la izquierda, a la derecha es un chasquido. Simplemente chasqueando al lugar. De derecha a izquierda es windup está volviendo y sólo saltando. Es como un registrador corriendo. Ve rápido, consigue un impulso como ir, chasquido, impulso, va rápido. Esta que utilizarla al final debe ser balanceada. A ver. Y este es un snappy ver la diferencia entre snap y bounce. Simplemente rebotando como este. Y esto va a ser muy lento y al igual que al final va adelante y atrás. ¿ Qué pasa con la duración? Si hago click en esto y duración, tenemos 1 segundo. Pero puedo venir aquí y presionar Número 3 y entrar. Ahora la duración va a 3 segundos, ¿ve la diferencia? Haga clic. Esto está tomando tres segundos. Entonces esto es rápido. ¿ Qué pasa con estos? Los extranjeros pueden hacer éste para lo posible, sí. Cuatro segundos o tres segundos. Rebote. Fuerza otra vez. Snap al segundo, rebota. Por un segundo. Snap. Entonces solo estoy explicando la parte de animación. Ahora intentémoslo. Y pondré esto en 1 segundo para ahorrar tiempo, 1 segundo. Y auto animar y es algún Zout este también? Esto es mayormente lo que hacemos. ¿ Y el gatillo? No quiero simplemente dar click en esto. A veces. Yo quiero tener una página limpia. No quiero que aparezca mi ratón. Por lo que solo voy a dar clic y seleccionar el alambrón, ir a gatillo y ponerlo en Keith y gamepad. Significa que puedes escribir unas palabras clave como S. Así que si presiono S, esto va a ser animado como esta. No quiero poner mi ratón aún, mi ratón lo afuera. Y presiono S, se va a animar. Pero para el siguiente, tengo que dar click. Si quiero que este sea con llaves, ve a engullillo. Pero al igual que las teclas y gamepad tipo S también. Entonces placa S, Otra vez, s, funciona. También podemos activarlo con arrastre. Este contrato es correcto, sólo voy a arrastrar esto hacia la derecha. Eso es todo. Otra vez. Plus S regresando. Se va a arrastrar hacia la derecha. ¿ Y por qué? ¿ Puedes poner tu voz? Sí, quiero decir, puedes decir, oye, y esto va a ser animado. Y también hay que sostener la barra espaciadora. Y tu avión te va a decir sostén la barra espaciadora y dirás: Oye, ahora porque estoy grabando, no voy a hacer esto. Así que abajo la barra espaciadora y di: Oye, y va a funcionar. Yo sólo voy a poner una ficha ahora mismo. No se va a arrastrar. Por lo que la mayor parte del tiempo está sin explotar. Y éste también está en la cuenta. De lo que voy a mostrar mi animación, lo pondré en palabras clave y gamepad, Así que no uso mi ratón. Toda la página. Ahora, déjame mostrarte una cosa más sobre auto animate. Voy al modo de diseño. Yo sólo voy a arrastrar esto a la derecha, derecha. Y sólo trata de asegurarte de que este es círculo C va a conseguir esta esquina y que sea un círculo. Y sólo ver este caso de animación. Por tapping. Va a ser así llamado. Volvamos a tocar año mosquitos. Entonces esto se llama auto animate y lo ponemos en la flexibilización. Debe ser dentro, fuera la duración que lo pones a segundo. Ahora lo puedes ver mejor. Y lo mismo aquí, usando estos fuera a segundo. A ver qué pasa. Ahora va a ser muy inteligente porque la flexibilización era desconocida en este momento, está encendido, está en su fuera. ve muy bonito y muy suave. Ahora ustedes saben lo básico de la creación de prototipos. Sólo voy a seleccionar ambos y eliminarlos. Vengamos aquí. Para la creación de prototipos. Yo quiero usarlo rápido. Yo sólo voy a sujetar todos estos y arrastrarlos un poco a la derecha. A lo mejor selecciono todo y traigo todo aquí. Entonces para crear prototipos, solo voy a arrastrar esto hacia la derecha. Para la primera, solo voy a seleccionar todo esto y presionar Comando o Control G para agruparlo. Cuando agrupe eso, solo voy a hacer clic derecho y arrastrarlo hacia la derecha. Correcto. Muy interesante. Entonces si hago clic en este ícono, quiero cambiar este banner e ir a la derecha. Entonces significa que va a arrastrar esto a la izquierda. Arrastre esto hacia la derecha. Está bien, genial. También esto va a la derecha. Y la opacidad está bajando. Este dos está llegando al centro. Esto va a la derecha y las capacidades a la baja. Rápidamente. El centro es asegurarse de seleccionar el tanque correcto en abajo Control y Shift select. Control Shift Seleccione ir a la derecha y la opacidad hacia abajo. Pero éste, control selecto viniendo al centro. A lo mejor sí cambiamos de color y tal vez cambiamos este color a morado también. Ahora, veamos la animación. Si hago click en esta flecha pequeña, va a la derecha, a la derecha. Vamos al prototipo está seleccionado arrastra esto a esta pestaña Mesa de trabajo y esto, el auto animate, facilidad de entrada, facilidad de salida y seis segundos, está bien. Lo mismo. Si hago clic de nuevo en este pequeño ícono, está volviendo a esto. El C árabe va a recordar los ajustes anteriores. Entonces solo arrastra esto a la izquierda, a la mesa de trabajo de izquierda y va a funcionar. Selecciona el Click Principal Reproducir. A ver si hago click en esto, veamos qué pasa. ven muy bonitos y muy cool. Esto va a ser agradable slider y todo va a ser comprensible. Basta con mirar el interruptor y vamos a cambiar conciencia del color. Entonces lo siguiente es que si hago clic en ir a colecciones, ésta debería venir a esta página, la página del filtro. Está bien, así que sólo voy a arrastrar esto a la derecha. Si hago clic en esto y lo arrastro, ponlo en esta página, si página fetal, todo, deberías estar bien. Ahora, al seleccionar el libro T, hay que volver siempre a la página principal. Entonces no necesito ponerlo en auto animate ahora mismo porque no estoy buscando animación. Si no buscas animación, siempre ponla en transición. También en este, no busco auto animate. Busco una transición sencilla. ¿ Todo bien? Voy a explicar cada detalle en animación de destino y tipo en mucha práctica. Pero ahora mismo sabemos lo básico. Entonces si hago clic en Principal y voy a Colección, transición sencilla, ahora volvamos atrás. Simplemente transición, ¿verdad? Por lo que debemos el cliente, si haces click en para ir a Recogida, vas a los Filtros. Volvamos al diseño. ¿ Qué más? No necesitamos animar todo esto es comprensible, es comprensible. Tan solo animar este árbol te va a mostrar cómo funciona. Selecciona estos tres Repetir cuadrícula e intenta hacer la cuadrícula de repetición. Sólo voy a arrastrar esto y sólo ponerlo en algún lugar así. Al expandir esto, tienes acceso a este grupo de desplazamiento. Basta con dar click en él. Si haces click en él, obtenemos dos asas. Y sólo voy a traerlo de vuelta a aquí. Y traerlo de vuelta a aquí. Animémoslo y veamos qué pasa. Ir al plato principal. Está bien abajo y solo echa un vistazo. Puedo arrastrarlo hacia la izquierda, puedo arrastrarlo hacia la derecha para poder mostrar fácilmente mis clientes cómo funciona este carrusel. Muy bien, muy bonito. Lo mismo se aplica a éste. Puedo venir aquí y puedo ampliar esto para poder mostrárselo a mis clientes. Es así como funciona. Nuevamente, haga clic en este enlace, es nivel dos asas. Vamos a acercar un poco. Vengamos aquí. Amplíe un poco. Vengamos aquí. Vamos a jugar de nuevo. Vamos a jugar de nuevo. Se enfría. Y ya ves cómo funciona. Es muy fácil y muy interesante. Muy bien, así que ahora sabemos si un buen paso de acercamiento, si seleccionamos esta pestaña, transición sencilla, no necesitamos la animación que pasa por los filtros. 44. Crea la página de filtro animado de la página de la Prototyping de Hi Fi: Ahora animemos estas partes. Haga clic en el modo de diseño. En esta parte, necesitamos dos cosas. Si selecciono esto por ahora, Vamos a arrastrar esto hacia arriba. Una cosa equivocada, desagruparla. Entonces solo tal vez estos muchos, este lo desagrupa. Entonces necesitamos la línea. Yo quiero cambiar esto con éste chicos. Porque quiero animarlo. Yo quiero animar todo el asunto. Copulas aquí y péguelo. Y trata de hacerlo de un tamaño muy pequeño. ¿ Verdad? Haga clic derecho, desagruparlo y elimine. Y mover estos para traer esto aquí y sólo poner aquí. Entonces animemos esto. Ahora quiero seleccionar este químico a G. Seleccione este uno Control de Comando G y seleccione esta línea de comandos para asegurarse de que el espaciado es correcto es cuatro, Está bien. Ahora, seleccione todos estos y haga clic en los componentes. Este va a ser nuestro estado por defecto. Haga clic en Signo Plus cerca de estados, estado más nuevo el. Yo sólo voy a llamar al PDF. Significa que estamos dando click en PDF. Si seleccionas el PDF, todo va a estar al revés. Mira, este es el PDF de estado. Estamos dentro. Ahora, mantenga pulsado el control y seleccione este sostenible apagado. El campo debe ser azul y todo lo demás debe ser blanco. Excepto éste. Bajamos la opacidad alrededor de 15. Y esto Para, debe ser, este color. Debe ser blanco y pobre hay este color. Entonces animemos esta configuración afuera. Haga clic aquí. Este es pdf y este es el estado por defecto. Voy a prototipo uno. Estoy seleccionando este, obtengo este mango ya está agrupado el PDF. Por lo que quiero elegir el PDF, basta con hacer doble clic en él para componente y el estado predeterminado es como funciona. Hacemos doble clic en él y haces doble clic, obtienes esto. Y la animación de tabulador, ponerlo en auto animate es una facilidad de salida y seis segundos, pero el destino es PDF. Ahora, salgamos. Vuelve a seleccionar. Ahora si estamos en modo PDF y necesitamos volver a hacer clic en tapa dura, esto es lo que haces. Si seleccionas la tapa dura, haz doble clic en esto, solo podemos manejarlo significa que la animación va a estar activa. Ve a animar. El destino es por defecto. Estado ahorita es una facilidad fuera y seis segundos, salgamos a ver cómo funciona. Haga clic en la placa de filtro. Así que haga clic saltando, saltando. ven bien. A lo mejor va a ser un poco rápido, ¿verdad? Tratemos de hacerlo un poco más lento. Entonces voy al modo PDF y lo pongo en 1 segundo. Vuelve a sacarlo fuera, haga clic aquí, estado por defecto. Haga clic en este ícono aquí y póngalo en 1 segundo. Muy bien, vamos a Design feeder play. Por defecto. Tengo ahora es un poco mejor. Para que pueda seleccionar cuál quiero. Puedo añadirlo al carrito. Ahora, lo genial al respecto, si selecciono todo esto y mantengo presionado turno y selecciono éste. Bien hecho el Repetir Rejilla y pintarlo hacia abajo. ¿ Verdad? Y de nuevo, ve a caber en un plato. Todo esto va a ser animado. Hace el enfriamiento por Repetir rejilla y componente. Por lo que todos ellos están funcionando correctamente. Esto es heredabilidad. Esto es, solo voy a añadir esto a mi carrito. 45. Categorías prototyping de libros Añadir a la animación de tarjetas de la de la de Hi Fi: La otra cosa aquí que podemos animar es ésta. Seleccione este, haga clic derecho y desagruparlo. A estas alturas. Ahora, sólo tienes que pulsar Comando o Control G para agruparlo. Todos ellos están seleccionados. Cambia el color a gris. Y estamos en la página del cómic. A lo mejor hay una página llamada Comics. Si no lo es, crea un cómic, es uno como los cómics. Entonces estamos en la página de cómics. Debe ser diferente a otras páginas, ¿no? Entonces el color debe estar en 20, tal vez un poco demasiado. 16, quizá un poco audaz. Y azul. Y sólo propina. Por lo que sólo voy a presionar Control de Comando G para agruparlo. Ahora, qué opción alternativa para copiar esta página de Victor. ¿ Verdad? Ahora bien, si hago clic en ficción, esto es lo que va a pasar. El cómic se remonta a 14, volviendo al mismo color. Y también un radiador. La ficción va a ser audaz y va a ser, mira, correcto. Pero cuando hacemos clic en la ficción, éstos o deberían estar cambiando el clima, éste debería ser ficción. Ficción, ¿verdad? Entonces sólo voy a cambiar el color. A lo mejor lo peleamos para que pueda ver la diferencia de que estamos cambiando algo. Entonces vamos al modo prototipo. Si hago clic y ficción, mantenga presionado el control y haga clic, obtenemos este mango wireframe letra. Arrástrelo hacia la derecha. Yo quería ir a animar, está en noticias fuera. Y seis segundos, si hago clic en cómic, se remonta a los cómics. Lo mismo aplica la autonomía de tabulador. Y eso es todo. Vamos a jugarla. Si hago clic en ficción, voy a contar con secciones de largometrajes. Todos estos libros va a cambiar la ficción cómica que regresa. El otro cosa es Agregar al carrito. Si hago click en esto, ¿qué va a pasar? Tenemos otro ejemplo de chicos componentes. Simplemente desagruparlo. Si hago click en esto, se seleccionan estos dos, ¿verdad? Y un componente agregando nuevo estado, un estado al que presentar un patrimonio. Este va a ser el color se debe cambiar a tal vez verde. Y esto se va a agregar al carrito. ¿ Verdad? Vaya al estado predeterminado, vaya al puerto, el tipo. Haga doble clic en esto. El animación es que todo está bien. Esto va a ser estado a estado, para hacer doble clic en esto al destino. Hacemos estado por defecto, retornar el estado por defecto. Y ahora solo puedo seleccionar todos estos de nuevo, Repetir Grid y volver a bajar. Bien, un filtro. Control Enter. Entonces esto está funcionando, ¿verdad? Quiero una tapa dura puede agregar a mi carrito y agregar al carrito. Vuelve atrás. Tenía carta puede usar lo mismo para este. Y éste puede sumar éste es un guardia. Entonces esta es la animación fresca y muy interesante. Y también esto está funcionando. Ficciones. Cómics. Vuelve atrás y haz la animación. ¿ Verdad? Cuando hacemos el agregado a la animación, también podemos, en el mundo real, podemos agregar el 1 a esto. Aquí hay ícono de carrito, mi tarjeta, la canasta, que lo vamos a hacer en diseño final. Pero por ahora, ya sabes lo básico. Por lo que esto se agrega al carrito. Si hago clic en esto, vincularlo a la página de mi carrito. Ahora mismo, para animación. 46. Termina el prototipo y animación de Hi Fi: Voy a seleccionar este. Si hago click en este, ¿qué va a pasar? Se va a esta página. Sólo voy a arrastrar esto y soltarlo aquí. Acerquemos esto. Por lo que esto anima esta página. Si hago click en esto, ¿qué va a pasar? Voy a una sola página. A mí me gusta llamar arte. También. Ya hicimos éste. ¿ Ves qué guay es eso? El componente partes. Todo es agradable y suave. Ahora mismo vamos a añadir a la opción de carrito. Se va a volver aquí. Simplemente voy a hacer doble clic en esto, copiarlo y traerlo hasta aquí. A lo mejor es un poco pequeño. Pero no hay nada que podamos hacer al respecto va a ser muy difícil simplemente cambiar este estado por defecto. Entonces volvamos a hacerlo muy rápido. Basta con echar un vistazo componente cerca del estado. Entonces el nuevo estado, éste va a ser y solo teclea agregado al carrito. Y eso es todo. Vayamos al prototipo y la VR animada por defecto, estado haciendo doble clic. El destino debe ser de estado a estado para hacer doble clic. destino debe ser predeterminado. Estado se llama la página del cómic. Y tratemos de hacer la animación. Enfriar. Si hago clic en esto, algo sólo va a aparecer aquí. Otra vez. Va a ser muy interesante. Vayamos a Diseño. Puedo agregarle un signo más. Esta va a ser E también. Selecciona todos estos comandos Control G para agruparlo. Haga clic en el signo de componente más cerca del estado, un nuevo estado. Este va a ser el número 2. Y también esto va a ser totalmente volado. ¿ Verdad? Entonces volvamos al estado por defecto. Si estamos en estado predeterminado y un doble clic en esto. Doy click en este doble clic. El estado por defecto debe estar en el estado 2. Y si hago clic en esto, definir estado dos y conseguir el caramelo es doble clic. Elegimos el destino es el estado predeterminado. Veamos qué pasó. Juego de cómic. Menos 1, 2. Ves este letrero. Significa que tienes que hacerlo más rápido. Aquí. Si estamos en estado predeterminado y hacemos click en este destino debe ser y dos segundos. Y otra vez salir y hacer clic en estado para seleccionar en este, el destino debe estar encendido a segundo clic. Y aquí vamos. Menos plus, plus. Agregado al carrito va a ser así. Es así como lo animamos. Nos va a decir algo así. Más firmar y agregar al carrito. Y uno va a aparecer aquí y vemos las críticas. Todo está funcionando correctamente y tenemos que arreglar esta parte con el diseño. Si estamos en estado por defecto. Entonces esto va a llegar a esta parte. Por lo que significa que tenemos que seleccionar esto. Y tenemos que hacer algo así. Y podemos agregar algo llamado Más. Si haces click en Más, puedes ver más de esta opinión de clientes. De nuevo, lo mismo. El ícono aquí. Trae bien esto. Antes de eso, sólo voy a alinear esto primero. Entonces solo voy a jugar con él hasta que tengamos efecto muy cool, interesante. Está bien, esta va a ser nuestra página. Volvamos a la escuela abajo. Entonces esto es lo que hacemos. Llegamos a esta página y tal vez usamos la tapa dura. Ya lo hicimos. Cambiamos el producto. Vemos el título para ver al cliente revisarlo. Vemos los libros relacionados que podemos agregar, podemos ver más, podemos ver más reseñas. Y podemos ver esa recomendación. Muy cool, muy interesante. Y eso es todo. Ellos le agregan más, Agregar al carrito. Ahora tenemos el silicio, la canasta, algo que viene a la canasta. Entonces si seleccionamos la canasta, vas a esta página, pero el transitorio debe ser Tipo Transición. Algo es, creo que déjame solo comprobar si hago clic en este prototipo de estado por defecto. Ahora bien, esto es un, esto es una transición. Por eso fue una buena animación. Seleccione esto, consulte el estado predeterminado. Ahí es donde ves los 12 números, ¿verdad? Solo voy a seleccionar en esto para intentarlo y debería ser auto animate. Salgamos, haga clic de nuevo para quedarnos al tipo. Si hago clic en el signo menos, el tipo de transición para auto animar, animar esto de nuevo. Si fuera raro, vemos el 100 para ver bonito hoy en día a la Autonoma animate se va a abordar eso. Pero estaba en transición. Incluso éste está en transición, supongo. Déjame ver. Es una transición debe poder animar. El estado predeterminado es auto animate. Sólo vamos a cómic otra vez al carrito. Más inteligente. Agradable. Entonces si hacemos click en este disco va a estar en transiciones porque no necesitamos animación. Transición y estar yendo a esta página y vas al pago. Y al final, vamos al seguimiento de envíos. Si hago clic en el pago, el seguimiento del envío, haga clic en libro T. Volvemos a nuestra página principal y va a ser transición. Esta transición selecta conocida en animación. Este, selecciona mi transición de auto. Entonces significa cuando terminemos, algo que va a venir aquí. Entonces es como dos o la canasta está llena. Al hacer click en la canasta, llegamos a esta página y vemos el subtotal. Se puede hacer click en el pago se pague. Después del pago, vemos nuestra entrega de envío y toda la información. Y cuando se entrega, está bien. Podemos volver a T libro todo. Funciona perfectamente. Podemos ver toda la animación y los libros finales. 47. Grabar tu prototipo y el check final de Hi Fi: Por lo que antes de enviar esto a nuestro cliente y obtener algunos comentarios, tratamos de probar esto y obtener algunos comentarios de algunos amigos. Envió esto a unos amigos, tal vez cinco o seis amigos, y pregúntales, ¿entiendes esto correctamente? Tienen que conseguirlo. Entonces esto es algo que tenemos que simplemente grabar. A ventanilla Alt R va a grabar justo esta página, chicos. Por lo que Windows Alt R es una grabación de esta página. Entonces puedes enviárselo a algunos amigos. Cuando te dan algunas retroalimentaciones. Cuando hicimos algunos tweets y algunas revisiones rápidas, algunos cambios en diseño y texto. Se puede enviar esto al cliente y obtener alguna información. Puedes pedirle al cliente sus nombres reales, los libros, y algunas palabras, vocabulario, oraciones, todo lo que necesites en este proceso. En cuanto a About Us página y un montón de cosas. E incluso la página Acerca de Nosotros también se puede animar. Si volvemos aquí, tenemos algo llamado Acerca de Nosotros. Ahora se va a arrastrar esto y ponerlo en la página Acerca de Nosotros. Haga clic en este. Arrastre esto a esta página y fresco. Entonces significa que si voy aquí, baje. Si hago click en la página Acerca de Nosotros, voy a ir a Sobre Nosotros. La otra cosa que podemos hacer aquí chicos, es ésta. Puedo hacer clic en este pequeño ícono aquí y tan solo seleccionar todo esto derecho, hacer clic derecho y llevarlo al frente. Y posición fija, luego desplazándose, esto es lo que va a pasar. Si revisé esto cuando te desplazas, todo va por debajo de él, ¿verdad? Y se está pegando a la parte superior. Hay mucho cliente que nos pidieron que hiciéramos eso. Y también podemos simplemente dar click en esto y subir. Si estás en modo diseño, haz click en este pequeño ícono aquí. Simplemente rascaremos esto a la izquierda. Y también puedo llegar a la sombra de gota. Down shadow va a ser bueno para este. Mira, hombre, estoy aquí, mira la sombra de gota. Entonces la corriente no se va a combinar y se ve profesional, ¿verdad? Por lo que siempre tenemos acceso al menú de la barra superior. Hay algunos que nos piden hacer eso. Por eso tengo que decirles que la posición fija, funciona así. ¿ Verdad? Ahora, ya hicimos nuestro prototipado. Vamos a dar click en esto. Otra vez. Va a venir aquí. Volvamos atrás. Desplácese hacia abajo. Esto va a ser un pergamino o carrusel. Carrusel. Muy bonito. Vayamos a las colecciones, ficciones y obras de cómics. Vamos a PDF y tapa dura. Funciona en las obras de la tarjeta. Y vamos a dar click en esta página es ir adentro. Bajen esto. A lo mejor fui yo también. A lo mejor quiero ver los detalles del producto. Muy bonito. Carrusel este. O quiero tener estos libros en la cancha. Ahora da click en la canasta. Perfecto. Paga por ello y consulta el envío de entrega. 48. El secreto de elegir colores: guía de emoción de color para crear un sistema de diseño: Cómo elegir colores para nuestro diseño web y móvil. Antes de elegir el color, tenemos que entender el color, emoción, y el color del logotipo de la empresa. La empresa cuenta con este logotipo. Significa que ya tienen una esquina principal. Entonces la mayoría de las veces tienes el color, pero no has tuiteado, tal vez este color se pueda cambiar este color. Yo voy a explicar. Antes de eso. Imagina que hay una empresa que ni siquiera tiene logotipo. Por lo que hay que sugerirlas. Si hay sobre un libro, significa que es la confianza es la creatividad es salvajemente imaginativa. Combinación de azul y morado va a ser del mismo color. Vayamos a algún sitio web como éste. El Amazonas, guardaban el título, significan el estandarte. Es del mismo color que este color. Entonces significa, pero éste es un poco más ligero. Volvamos atrás. Por lo que deberían del mismo color aquí también, tenemos algunos colores. Por lo que hay que visitar algún sitio web y conseguir algunas ideas. A lo mejor este color, tal vez descolorido. Por lo que la mayoría de los colores son un poco oscuros, tiene tinte a ella, tiene oscuro a ella. Entonces Volvamos a Amazon, cómo se les ocurrió estos colores. Hay un sitio web llamado mi color dot es espacio, ¿verdad? Volvamos aquí. Imagina que tengo este color. Este es el color principal, ¿verdad? Yo sólo voy a copiar esto. El tipo principal de la empresa, los ya hábitos o uno de estos colores. No importa. Simplemente lo busco, tal vez desanimar lo mismo que este color. Escoges una corriente como puedas encontrarte. No importa en base a lo que exactamente está haciendo la empresa. Por lo que necesitamos este color a este triángulo y simplemente llenarlo con este color. Y es de color, solo cópielo. Control C. Volvamos a este sitio web, Control V, y del mismo color, basta con dar click en Generar. Por lo que pongo mi color principal aquí y clic en Generar en la página web de Michel Wedel Espace. Ahora, aquí obtenemos mucha generación de color fresco. Este es un gradiente genérico. Esto es gradiente coincidente, paleta de puntos y mucho más. Para que podamos usar esta paleta. El primero es tu color principal, y el segundo, tercero, y hay mucho, ¿verdad? Pero básicamente, elegimos tres colores la mayor parte del tiempo, ¿verdad? Este es nuestro color principal. Este podría ser nuestro segundo color, pero tenemos que tratarlo, tenemos el cambiarlo un poco. Entonces, ¿cómo hacerlo? Yo sólo voy a copiar esto. Yo sólo voy a venir aquí y duplicar esto. Y de nuevo, sólo voy a poner este color aquí y conseguir y generar. Entonces vengo a algo como esto, ¿verdad? Entonces este es en realidad el color que ya tienen aquí. Mira, este es el color, entonces así es como eligen el color. Pero botón para llamada a la acción, necesitamos algo más pop para que puedan verlo más. Entonces va a venir aquí. Yo sólo voy a arrastrar esto como copiaron abajo Control V. Así que este es el color que tienen. Por lo que jugué con él. Ya sé que esto me gusta. Se llama DCG surgiría. Entonces déjame volver aquí. Este otro sitio web llamado hexa actual significa que podemos poner este color aquí en color hexa que vienen. Presione Entrar. Obtienes un montón de opciones. Obtienes las alternativas. Y a lo mejor voy a eximir así, ¿verdad? Es de color rosa, algo más pop. Pero ya sé que quiero algo llamado un buen color rosa. Y este es el color que ya conozco. Es una especie de rosa, pero está sombreada. Significa un poco de oscuridad añadida a ese rosa. Entonces este es d 71868. Entonces escojo este color y una perihelia, ¿verdad? Entonces ahora este es mi segundo comentario. Entonces este es mi color principal. Ya tiene la empresa. Significa sabio creativo, el mismo tipo de tener esta empresa, eligen el mismo color. ¿ Qué más? Volvamos aquí. Y esto va a un tercer color, exactamente como Amazon. Por lo que es este de nuevo color material. Entonces primero, éste, lo cambié a más color pop como rosado. Y éste va a ser de color naranja. Crimen de tercer cuello. Por lo que sólo tenemos tres colores. Entonces, ¿cómo aplicarlos? Ahí hay una regla llamada el 60, 30, 10, 60 por ciento va a ser nuestro antecedente. Ahora, echa un vistazo a esto. Aquí. 60% va a ser este color de fondo, ¿verdad? 60 por ciento. El 30 por ciento va a ser elementos o aquí, texto o fotos. 10 por ciento está llamado a la acción. A esto se le llama Llamada a la Acción, ¿verdad? Por lo que el 60 por ciento es el fondo. Esto es lo que vamos a hacer. Y la telepresencia es puede ser elementos de fotos aquí y textos, y 10 por ciento de llamada a la acción. Y así es como aplicamos. ¿ Verdad? Ahora, volvamos a nuestro diseño. Si quieres saber el significado del color, basta con buscar en Google color significado. Y se puede conseguir mucho de esto. El morado es lujo, ambicioso, independencia, misterio. Hay un significado dos colores, ¿verdad? Entonces, cuando elijas tus colores, puedes crear algo como esto. Yo lo llamo sistema de diseño. Pongo sitio web del distrito y mi color que es espacio correlacionan adobe.com y color hex. Déjenme mostrarles que adobe.com también. Cómo funciona. Podemos poner este mismo color, como tal vez este. Vamos a copiar esto y ponerlo aquí. Eta. Entonces puedes elegir E1 analógico. Monocromático es todo lo mismo. Entonces simplemente pegarlo de nuevo. Entonces todo monocromático. Entonces elige qué cardio como tríada, color de cortesía, son opuestos, solo pegados, ven lo contrario de desechados. Se puede decolorar. Y hay mucho más. Pero lo genial al respecto es el botón Explorar. Eso significa que puedo buscar si me gusta un color rosa y simplemente agregar filas. O si me gustan las filas oscuras, sólo puedo girar filas oscuras. Basta con dar click en él. Y obtienes mucha paleta de colores cool. Basta con echarle un vistazo. Hermosa. Y solo puedes hacer click sobre ellos y simplemente copiar el color que realmente te gusta. Ven a Adobe XD. Y aquí vamos. Simplemente pegarlo. Y este es tu auto, por ejemplo. No necesito éste. Entonces ya tenemos nuestro color, ¿verdad? De qué lo puso aquí. El color principal, el color rosa de madera oscura, y el color amarillo, como el del Amazonas. El amarillo era éste, pero añadí un poco de tintado, arrastra esto un poco hacia abajo para obtener el mismo color. Entonces estaba pensando que tal vez un poco oscuro es mejor que éste. Entonces fue demasiado brillante para mí. Entonces para cada color bajar la opacidad, para conseguir un segundo color de ese color tal vez va a ser útil durante el diseño, ¿verdad? Y además, tenemos el color negro y el gris y la luz. Greg va a ser útil para muchas cosas, especialmente para este tipo de fronteras. ¿ Verdad? Al final, pongo el significado de cada color para que el erudito signifique algo. No debes confundirte con el color de Yakarta. Te expliqué por qué usamos ese retira y por qué usamos este tipo de color amarillo. ¿ Y qué significa? Entonces cada color tiene un significado, por lo que hay que buscarlo. 49. Añade colores a la paleta de colores: Ahora es el momento de agregar estos colores a nuestra biblioteca o a nuestros activos de color. Tenemos que añadir estos colores a la paleta de colores. Yo sólo voy a crear algo como esto. Sin borde y este color. O puedo simplemente copiar estos. No hay diferencia. Ven a aquí, haz doble clic y pégalo. Entonces lo mismo. Necesito hacer dos cosas, clínica y la sensación, no necesito estas. Arrastra esto hacia fuera. Basta con hacer clic en este signo más. Tengo este color principal. Y además agrego este signo más. Yo agregué esto. Entonces este va a ser mi color principal. Siempre puedes nombrar a este color principal. Ahora éste, por lo que éste está seleccionado. Haga clic en el cuentagotas consiguiendo un color más claro. Haga clic en esto, más ligero, y también haga clic en este signo más. O bien ocurre lo mismo, y este es el signo de color más. Y también estas sutiles UCI. Ahora, sólo voy a arrastrar esto hacia abajo. Lo mismo con éste. Eso se elevaría, sólo voy a copiar esto. Seleccione éste aquí. Haga clic en el signo más. Y además solo voy a añadir este, sólo voy a llamar a esta rosa, luego haga clic en el cuentagotas. Este. Esta va a ser nuestra paleta de colores. ¿ Algún otro color? A lo mejor se puede cambiar la opacidad. Apenas estos colores. 50. Cómo encontrar las mejores fuentes para nuestro sitio web: Está bien, Ahora es hora de hablar de algo que es muy importante. Cómo encontrar la fuente adecuada para nuestra página web. El mejor modo de hacerlo es éste, chicos. Por ejemplo, vamos a ir a Amazon e instalar este plugin se llama Font Finder. Tipo. Buscador de fuentes obtendrá extensión de Chrome y en un sólido va a ser como una t. Muy bien, Así que cuando estés en un sitio web y haga clic en este ícono aquí, puedo poner mi ratón en cualquier texto que quiera saber. Por ejemplo, ¿cuál es su título? Si haces click en él, te va a decir que tamaño de la fuente es de 28 pixel. Por lo que sabía que me gusta este tamaño de fuente. Usaré lo mismo. ¿ Cuál es la font-family? El familia tipográfica es Ariel y Amazon Ember. Entonces básicamente estas áreas sensibles. Por lo que la mayor parte se necesita o Arial. Y aquí, este es a un ocho, y es normal. El peso de la fuente es normal. No es audaz. Entonces otra vez, sólo vamos a cerrar. ¿ Y este qué pasa? Esto se ve como ambos. Ya ve, si doy clic en Siguiente y doy clic en esto. El peso de la fuente es de 700, así que son ambos. Entonces 400 es normal, 700 es ambos. ¿ Qué pasa con la font-family es otra vez, ariel es el tamaño de fuente es 28. ¿Cuál fue éste? Esta noche también? Por lo que 28, normal, 28, negrita para categorías destacadas. ¿ Y este qué pasa? ¿ Y qué pasa con estos números? Es averiguarlo, vamos a teclear aquí y tal vez este número va a ser de 21 píxeles de área y normal. Entonces así es como nos enteramos de todo. Entonces si vamos de ida y vuelta cuando estás diseñando algo y a veces no lo sabemos, puedes volver atrás y para que nosotros encontremos lo mejor para nuestra página web. Entonces otra vez, crea algo como esto. 51. Cómo crear estilo de personajes para tu diseño: Yo sólo voy a escribir algo como esto. Jugar. Uno. Tráelo aquí. Ahora, el color que queremos usar va a ser este color oscuro, el color principal, ¿no? Simplemente voy a seleccionar Asia. Y también no lo hago, espaciado debe ser 0. Y lo es, espaciado es, mayor parte del sesgo de tiempo es de 16. Y 16 y su Fourier se inicia a partir de 48. Entonces sólo voy a ir a las ocho. Entonces la Fonda es Helvética. Yo sólo lo voy a poner en área por ahora. Por lo que creamos todos estos, tiene una superficie de 484044 y el 14 es el menos. A continuación, crea los carbonos 1234 superiores. Por lo que tengo este solo display. El cuarto camino es 400 y significa es regular este. Por lo que seleccioné esto y haga clic en estilo de personaje. Y eso es todo. Entonces significa que si tipeo algo como éste, hola, cambia el color. Esto. También cambia esto a cerrojo y calmar. Sí, así. Si los selecciono, esto va a pasar, va a estar cambiando a exactamente lo mismo. Por lo que esta área 48, esta área 48 también puede ser audaz y también puede ser regular. Entonces en este momento sólo lo voy a poner en ambos n plus k Bueno, se puede ver esta pequeña, ¿verdad? Por lo que ahora de nuevo, lo bajé regular. Esta vez, 40 ng-click. Se puede ver esta zona 40, ¿verdad? Entonces esto es lo que hacemos. Esto va a ser 40 audaz. Aquí vamos. Por lo que antes, antes va a ser el Poppins. Entonces no lo usamos. Ahora vamos por 36. 36. Ahora, ponlo en regular. Y signo más. Va a audaz. Se puede signo más. Entonces chicos, puse todo del 48 al 14. Negrita y normal o regular para la zona o son regulares y pernos. ¿ Y los títeres? Vamos a mostrar uno y mostrar dos para los títeres, 48 y 40 y 44. Vamos a intentarlo. Simplemente voy a dar click en esto. Yo sólo voy a teclear. Poppins es una fuente de Google es gratis para sólo escribir cachorros en la fuente de Google y descargarla. Basta con escribir el teléfono de Google Poppins. Y si le das click. Ahora, descarga la familia. Y este tamaño debe ser 4848 normal, o 48 extra ligero. Y un signo de un plus. Se va a llamar a esto Poppins, que es Poppins. Y aquí solo teclea display uno. ¿ Verdad? Y lo mismo puede ser también chicos pernos. Mira, muestra uno, que es ambos. Al hacer esto, ahorramos mucho tiempo y confusión durante el proceso, chicos. Por lo tanto, asegúrate de hacerlo primero. El siguiente es, estoy tratando de hacer el Fourier que 44 porque es el encabezamiento. Muy bien, ahora somos creados nuestros personajes y nos enteramos de nuestras caras tipo. 52. Diseña la barra de menú sitio web: Tienen que empezar a diseñar. Ya tenemos el diseño de alta fidelidad, ¿verdad? Sólo voy a desplazarme hacia atrás y sostener Alt y simplemente arrastrarlo y soltarlo aquí. Está bien, presiona Comando o Control D para duplicarlo, porque yo también quiero la cuadrícula. Entonces si hago clic aquí, puedo obtener mi diseño de cuadrícula. Ahora. No necesito nada más. Entonces ahora sólo voy a borrar todo. Por lo que vuelve a ver cómo podemos diseñar desde cero. Es una historia que diseñar, sólo voy a dibujar una caja aquí. Doy click en un rectángulo y te hago que acabes de venir aquí. ¿ El derecho total? Ahora. Entonces lo arrastras hacia arriba y ves cuál va a ser la regla del terror lo. Entonces creo que está bien. Tan correcto. Por lo que la mayor parte de esto va a ser parte del video que el vehículo sólo va a mostrar. Por ahora. De lo que sólo voy a cambiar este color por el color principal. Y hay algo más. Yo sólo voy a arrastrar esto hacia abajo para esta parte. Busco un muy, muy así que éste tiene frontera. No hace falta tener frontera este como frontera. Voy a usar un color más claro, pero no me gusta este color. Esa es la cosa. Entonces solo voy a subir y sólo voy a arrastrar esto hasta que consiga algo muy cool. Entonces solo lo voy a arrastrar para que sea muy bajo, color claro, pero tenemos que hacerlo más claro porque necesitamos poner un texto. A lo mejor un oscuro lleva a ella puede ser algo así como una buena entrega. Y tal vez esto va a ser 20 o 40. Por lo que el fondo debe ser más brillante. Volvamos aquí. Este va a ser nuestro antecedente. Entonces estoy tratando de cambiar esto por algo muy, muy ligero, esto. Entonces me gusta este color. Yo sólo voy a copiarlo. Solo voy a contar este sutil clic derecho editado y pegarlo aquí. Entonces esto es básicamente lo que hacemos. Entonces ven a cambiar el color. Entonces déjame sólo venir aquí y editado. A lo mejor puedo ser un poco más. Este tipo es algo muy, muy ligero. Si vuelvo, me gustó esto, así que sólo me lo voy a quedar por ahora. Entonces así es como trabajamos en torno a esto. ¿ Y qué pasa con la línea de arriba? Tenemos algunos como estos que T libro y el tamaño y todo. Pero intentémoslo. Yo sólo voy a traer este año como referencia. Y esto se empieza a diseñar esto. Por lo que la mayor parte del tiempo va por 17 y 20. Aquí. Santi en ella. Si quieres diseñar algo como esto. Por lo que el ancho debe ser de 17, 20, el radio de frontera debe ser de 16. Y jugamos alrededor con la altura. Empezamos a diseñar IE o seis veces. Y pulsa 1, 1 e y pulsa Enter. Entonces este va a ser nuestro gris claro. Entonces siempre podemos cambiar esto durante nuestros chicos de diseño, ¿verdad? Entonces solo voy a dar clic aquí y subir aquí. Necesito este ícono. Y yo sólo lo voy a poner aquí. Yo sólo voy a salir de esa caja. Así que haz click afuera, ven aquí y solo, pongámoslo aquí. Y el color principal. Agradable, sólo estoy revisando. Entonces pongamos todo aquí primero, luego nos levantemos con las ideas. Aquí necesitamos algunos iconos de que todos sean iguales. Entonces vayamos a tus archivos y pinchemos en Material, Icon Google. Ábrela. Busco corazón y son dos. Y también la canasta. Y vamos a copiarlo. Vuelve aquí. Y aquí en la parte superior, voy a crear una mesa de trabajo. Del mismo tamaño. Y todo lo que sólo estoy copiando, sólo voy a traerlo aquí. Vamos a desagruparlo. Entonces. Tengo una colección muy cool y no los voy a perder. Por ahora. Tengo los tres. Volvamos atrás. ¿ Qué más necesitamos de aquí, del audio. No necesito uno. Porque estamos buscando tal vez los principales iconos que siempre usamos. Editor de archivos para descargar, tal vez para imagen. Y vamos a copiarlo, volver aquí y pegarlos aquí. Podría cerrar. Aquí vamos. A lo mejor ir. Además, necesito el icono de compartir. A ver si podemos encontrar eso. Copiarlo. Vuelve atrás. Aquí vamos. Se lo va a traer aquí. Entonces todo debe ser lo más alto. Sólo voy a seleccionarlos todos y hacerlos iguales y nivelar. Está bien, bien, ahora tengo estos, sólo voy a llamar a estos iconos. Por lo que siempre puedo venir aquí y encontrar mis postales. Por ahora. Necesito éste. Está bien. Necesito buscar ícono, supongo también. Volvamos atrás y encontremos el ícono de búsqueda. Aquí vamos copia. Se va a comparar que creo que es mejor. No me gusta ese porque el mango es un más pequeño solo lo voy a copiar aquí. Está bien. Mantén esto aquí. Agradable. Corazón electro. Y vamos a traer su canasta también. Pero la canasta está llena. Necesitas tener algo muy parecido. Por lo que diez fuera de este campo, vaya a la frontera y haga clic en este ícono, el mismo que éste. Se trata de campo de trigo y erudito afiliado. Ahora cómo hacer que el trazo sea igual? Yo sólo voy a dar click en este. A lo mejor dos. Yo creo demasiado. 1.5 mejor. Y yo estaba un poco cerca. Ahora sólo puedo traerlo aquí. Y sólo lo toma de nuevo aquí y la cara. El personaje. O el usuario. Hazlo a Napal para agregar una cara aquí, vamos a Filtrar caras de interfaz de usuario y una foto de selección de chapoteo. Yo sólo voy a elegir a este tipo, aplicarlo y traerlo aquí para que pueda poner el nombre, como traerlo aquí. Y volvamos a nuestra biblioteca y paneles de activos. Y aquí busco este tipo de cosas. Si consigo, como usuario, ¿qué debería ser? ¿ Cuál es el color que necesito? Siempre puedo ir aquí en Amazon y estoy buscando algo como esto. Es decir, esto puede presionar T y yo sólo voy a venir aquí. Y aquí tienes. Este tamaño es de 14 pixel. ¿ Todo bien? Entonces esto es lo que voy a ir y es normal. Entonces, sólo vamos a volver. Yo quiero poner este pase 14 normal para que pueda poner cualquier nombre. Entonces vamos a ver. Entonces, así las artes, así es genial. Entonces no tratamos de adivinar cuál es el tamaño. Siempre búscalo en diferentes sitios web, los principales sitios web, el famoso sitio web, para que pueda tener la idea para qué debe ser el tamaño de la fuente. Ahora, sólo recuerda esto. No solo pongas cualquier tamaño a tus deseos. ¿ Qué más necesitamos? Necesitamos este pequeño ícono aquí para perfil para que pueda hacer clic en él, puede desplegarse. Vayamos aquí. Esto es lo que necesitamos para copiarlo. Tráelo aquí. Pegado. Agradable. Cambia el color. Podía escuchar, ¿qué tenemos un filtro y tal. Cambié de opinión. Intenté simplemente diseñar algo como esto y hacerlo gris claro. Entonces otra vez, ¿no es Argon? Sí, tal vez pueda hacerlo gris o deshonra o simplemente puedo agregarle estas luces. Veamos cuál es el color. Yo sólo voy a copiarlo. Yo quiero tener esto en mis muestras, ¿verdad? Sólo voy a pegarlo como seis, 1, 2, 3, 4, 5, 6 contador y agregarlo y sólo traerlo por aquí. Entonces todo es diablo. ¿ Y éste qué? Entonces no está bien. Entonces estos son bonitos. Pero mira la gorra. El gorro debe estar a su alrededor. Porque todo está redondeado en nuestro diseño. Aquí tenemos Filter. Entonces solo voy a escribir cuál es el tamaño del efecto que volvamos a esto y solo voy a revisar esto va a ser 14 otra vez, IT es lo mismo que éste. Volvamos atrás. Entonces sólo voy a poner estos 14, volver. Yo también puedo hacer esto un poco más pequeño. Por lo que puede tener más sentido. Nunca diseñas y seleccionas esto. Ese bonito y más espaciado para estar alineado con la decadencia. Si ves cuando lo haces pequeño, a veces esto va a pasar, chicos. Es decir, a veces algunas de estas cosas van a faltar. Y debido a que este lado está llegando a un pequeño, esto es lo que va a pasar. ¿ Sé que tenemos aquí, tenemos búsqueda. Subiremos filtro gris, color principal. Ahora, cambiemos esto a casa Control Enter. Para que podamos ver la parte superior. A ver qué cool y hermoso es eso. ¿ Agradable? Está en el centro, justo hoy en día, y tal vez impreso épica a la izquierda. Entonces ahora todo tiene sentido. Solo puedes buscar. Y no necesito éste. Yo lo voy a borrar. 53. Sección de de el diseño web o diseño de la banner o deslizante: Ahora es el momento de agregar aquí la pantalla. Voy a escribir algo que ya tenemos aquí. Bienvenido al libro T. Sólo voy a arrastrar esta última selección y venir aquí y pegarlos aquí. ¿ Verdad? Esto va a alinear esto así. Por ahora. Yo lo voy a hacer blanco. Entonces éste, por ahora, debería ser el display uno, cuál es el Poppins, ¿ verdad? Va a intentarlo. El libro es 44. ¿Qué tal 48? Porque es mucho mejor. Pero éste, el libro T, debería ser 48. El capitalino o el audaz. Si no lo ven chicos, como, ¿por qué no lo ven? Es porque cambiamos el gusto de este personaje para ser lo mismo que el fondo de color de dominio descolorido. Aquí, ven aquí al campo y cámbialo. Lo mismo que librería. Si añado estos dos, como algo así como 44, lo veta. Simple, ve a sentir, hazlo blanco. Por lo que tenemos librería en línea, bienvenido a T libro on. Voy a guardar cool. Aquí necesitamos algún texto aleatorio, que solo lo voy a copiar de esto y traerlo aquí. Eso es algo genial del diseño de alta fidelidad. Siempre puedes ir ahí. Y antes de eso, ¿de qué es este color? Sólo voy a volver al año es algunos de estos colores. A ver, ¿cuál es el tamaño de esto? 26. También voy a buscar 2014 A6, nuestra AMI pequeña como esta. 24, mismo color. Cambia el color a blanco. Creo que 24 es demasiado grande. Entonces busco otra cosa. Busco algo como esto. Tamaño. Aquí vamos. Creo que son 40 pixel. Entonces busco algo así como 14 píxeles o 16 píxeles. Aquí, cambió de color mejor. Y ahora necesitamos arreglar el espaciado. Pero la tecla de flecha superior cambia el espaciado. Si haces clic en él, ves este icono rojo significa que puedo arrastrarlo hacia abajo. Yo sólo puedo traerlo para llenarlo con sólo tres líneas. Bonito caso, ¿verdad? Correcto. Volvamos aquí al fondo. ¿ Qué tenemos aquí? Si lo selecciono, está agrupado, haga clic derecho y desagruparlo. Entonces ahora solo puedo bloquear el fondo y sólo copiar esto. Copia y tráelo aquí. Muy bien, Por el botón, esto es lo que hacemos. Ya se creó uno, por lo que puedo explicar este tamaño del botón y el margen. Entonces esto es lo que hacemos. Esto es que no necesito la frontera. Esta es la caja. Mira, la altura es importante, es un 40. La mayoría de las veces, el VDD tiene 14, 16 para este, no importa las malas hierbas. Así es como hacemos realmente mal calculando el centro. Basta con echar un vistazo desde la izquierda y desde la derecha es 32, desde arriba e abajo es 12 para el margen, ¿verdad? Entonces solo voy a cambiar selecto y agrupar estos dos. Y sólo tienes que seleccionar este y llenarlo con un color oscuro para que ustedes puedan ver este. Ahora vamos a dar click en el fondo. Ve a Color, color rosa, matando en una vista más, y selecciona el blanco desde aquí. Y si queremos convertirlo en un componente, podemos hacerlo. Simplemente puedes, si es grupo. Después de agruparlas, queremos aprovechar al máximo el tiempo o hacerlas como componente. ¿ Qué hacemos aquí? Es recrear relleno. Entonces cualquier cosa que escribamos aquí, va a consistir en estos 12 de arriba e abajo y de izquierda y derecha. Entonces aquí necesito teclear. Bueno a la colecta. Y va a estar en el centro. Ahora, arreglamos este derecho ya es perfecto. Tenemos que convertirlo en un componente primero. Entonces después de que lo hagamos como componente es lo que hacemos se va a copiar esto, selecciona Copiar. Sólo chicos, haga doble clic en el interior y pegarlo. Arrástrelo hacia abajo. Por lo que está sosteniendo el telnet 1 momento adecuado. Y asegúrate de que esto sea genial. Y eso es todo. Y esto es lo que tenemos, ya es guardarlo, decírselo y decirte que lo hagas. ¿ Y qué tan genial es eso? Eliminar. Y ya es un grupo. Yo sólo los voy a alinear. ¿ Qué pasa con esto? Si no buscaban ícono aquí, chicos, Vamos a pico libre o gratis Victor. Simplemente puedes buscar libros. Hay muchos iconos geniales que puedes usar, ¿verdad? Tan plano icono es la página web que ustedes chicos tienen que ir o gratis peaks.com, sólo pueden escribir libro. O libros. Digamos que hay muchos iconos de libros que solo puedes descargarlos y utilizarlos en Adobe XD. Por lo que ya tengo estos para asegurarme cuando lo copie aquí, también copiarlo en un ícono principal. Y sólo voy a cambiar el color. Por lo que siempre tienes los iconos en un solo lugar. Muy bien, volvamos aquí. No necesito éste. Y tengo este rosa abajo. 60. Busquemos algo que se adapte a nuestro diseño. 48, tal vez. Va a hacerlo blanco. Entonces es demasiado grande. ¿ Es lo que voy a hacer? Yo sólo voy a hacer sea del tamaño que busco. Extra luz, no tiene sentido. 24 negrita. Haz que se divida. Agradable. Porque quiero ser obvio. A lo mejor podemos ponerlo en 20 y también cambiar el color de relleno a blanco. Esto me gusta más que simplemente copiar esto hacia abajo. Voy a dar por algo 16. Y también blanco. Haga clic en este. Nuevamente, este título, caso capital. Esto es, bueno, es demasiado grande. Busquemos algo un poco más pequeño, como 14 píxeles de ancho y no está mal. Para que puedan poner 14 pixel. Correcto. Haga clic en esto. Se debe utilizar la primera letra mayúscula. Yo sólo voy a alinear esto a aquí van. Trata de alinear esto, esto también. Ir dar click en esto y Comando o Control L para bloquearlo. Otra vez. Simplemente juega con esto. Yo sólo puedo bajarlo y conseguir que se vaya a casa. Contralor, inter. Y agradable, muy suave, muy fresco y muy interesante. Acude a colecciones. Impresionante. Va hacia abajo. Aquí mismo, tenemos best-sellers. El fondo va a ser un video chicos. Por ahora. No lo voy a hacer. Apenas el diseño en prototipado y para animación, podemos sumar todas estas cosas y hay mucha diversión que vas a hacer. Por lo que sólo voy a dar clic en la casilla para una portada de libro. En primer lugar, tenemos que averiguar cuál es el tamaño real de una portada de libro. Volvamos a Amazon. Aquí vamos. Yo sólo voy a copiar esto. Tráelo aquí. Plegado. Este va a ser el tamaño real. Entonces va a, está en la parte superior, clic derecho, Traer al frente. Entonces este va a ser el tamaño real. Ahora, va a bajar esto a 26, por ejemplo. Aquí, necesito tener frontera, así que no necesito éste, sólo voy a borrarlo. Entonces básicamente este va a ser nuestro tamaño real. Recuerdo orbitar, basta con copiar esto y llevarlo a diferentes lugares en diferentes lugares en nuestro diseño. Por lo que también podría necesitar algo como estos para ser a cualquiera. Si puedo llegar a cualquiera, solo puedo entrar y solo tocarlo, levante la tecla de flecha para que la brecha entre ellos sea de 20. También. Este es Tony. Y ahora si quiero hacer esto más pequeño, voy a sostener Alt y Shift y hacer esto más pequeño. ¿ Verdad? A lo mejor un poco más grande. Disco. De nuevo, tal vez un poco más pequeño. Ahora de nuevo, sólo hagamos este 20 y hagamos este 20 también. Y así de malo. Yo volteo esto, esto puede ser un poco más grande. Y el oso, para seleccionarlos a ambos, asegúrate de que el centro y se alineen desde este ángulo también. Entonces lo que hago la mayor parte del tiempo es que sólo voy a sostener el cuidado del ratón y arrastrar esto una regla sobre un ratón aquí y arrastrar esta regla. Entonces no salgo afuera. Volvamos atrás. Busco algo más interesante. Este, Sostén y arrastra y suelta dentro. Y el siguiente, tal vez éste, sólo voy a arrastrarlo interrumpido aquí. No necesito esto. Yo sólo lo voy a dejar afuera. Echemos un vistazo. Control en ratones recolectados mucho. Entonces. Pasemos a la siguiente parte. 54. Sección de información del sitio web: Ahora decidimos ir por 1400. ¿ Cuál es el 4800 va a ser de esta talla? 1400. Entonces ustedes recuerdan lo que hicimos. Si quieres 4800 de izquierda y derecha para ser 260. Por lo que si hago clic aquí, agregue mi maquetación. Esto va a ser 400, ¿verdad? Entonces voy a diseñar entre estos dos a partir de ahora. Entonces éste, el texto debería estar aquí. Entonces no necesito esto y lo vamos a borrar. Ahora. Yo sólo voy a arrastrar una línea o una regla por aquí. Arrastra otro, ponlo aquí. Entonces déjame simplemente cerrar. Ver desde perfecto. Si no te gusta el color de estos chicos, también puedes cambiarlo a cualquier color. Recuerda, quiero decir, ¿podemos cambiar? Depende de tu diseño, pero la mayoría de las veces, el silencio. Enfriar. Está bien. Yo sólo voy a borrar este. Seleccione este comando y controle L para bloquearlo. Ahora, vengamos aquí como éste también. ¿ Puedo controlar L? Yo sólo voy a arrastrar o sólo uno de estos. Y por ahora, Lo va a poner aquí y cambiar el color, este color. Entonces así es como va a ser, va a alinearse aquí en el centro. Icono de entrega tan rápida. Busco estilo de personaje. El mismo tamaño estaría bien, supongo. Pero audaz. Es demasiado grande. Yo quiero que sea 20 iPad. Este debe de tener 14 años. Y normal. Agradable. Sólo voy a arrastrarlo un poco. El vacío 16 está bien. Por lo que la mayoría de las veces son 16. Depende. Pero creo que puede ser más. Volvamos a la página web de Amazon como ¿qué es esto? Y basta con presionar T y dar click en esto. Línea. La altura es de 2960. Volvamos aquí. Yo sólo voy a dar click en esto. Eran 14. Yo sólo voy a arreglar este. Haga clic derecho en Editar. Conjunto de seis milímetros puede convertirlo en 20 y en ley. Y funciona perfectamente. Entrega tan rápida. Por lo que ya tengo icono. Yo sólo lo voy a pegar aquí. Y también péguelo aquí. Yo sólo lo voy a poner en una pestaña. Haga clic y arrástrelo hacia fuera. Ya ves que fue si estás fuera de la caja, mando o Control X, haz doble clic dentro mando o control V. Ahora estamos dentro de este grupo, ¿no? Vamos ahora necesito conseguir un tres columnas y los musulmanes podrían hacer doble clic aquí. Y así sólo voy a arrastrar esto y venir aquí. Por lo que cubrimos las dos columnas, Repetir Grid. Y asegúrate de que esto va a estar exactamente aquí. Entonces creo que esto está un poco regresando. Por lo que arreglé para todos ellos. Y eso es todo chicos. Bellamente hecho. Seleccionarlos todos. Ahora bien, si todo es perfecto, déjame revisar. Por lo que puede volver un poco mal. Todos ellos. Está bien. Y ahora desagrupados. A cool. Ahora cambiemos el nombre. Esto fueron pagos de seguridad. Pago de seguridad y control hola. C, Pero tienes presionado el control para ver un cuadro delimitador aunque dentro de un grupo, haz clic en él. Ahora haga doble clic, copie, salga de nuestro control. Seleccionar totalmente contrario. Haga clic, doble clic, Copiar y volver atrás. Haga doble clic. Ahora para el ícono, hay que buscar seguridad de pago segura. O simplemente puedo poner esto, solo voy a hacer doble clic en el interior, pegar éste. Yo sólo voy a asegurarme de que estoy exactamente aquí, el centro. Y basta con dar click en esto y justo hasta que sea de mejor calidad, haga doble clic aquí. Todo lo que tienes. El logo. Haga doble clic. Y yo sólo lo voy a poner aquí. Eliminar, retenida Garantía. Ten el logo, haz doble clic, copia, y aquí vamos. Dona este. Demos click en Inicio control inter. Y aquí vamos. A ver qué hermoso es eso. Solo consigue este hermoso color que creamos. El buen viejo pings o alinear y son absolutamente perfectos. A mí me encanta. 55. Sección de tendencia de diseño: Lo siguiente que tenemos que hacer es algo llamado tendencia. Yo sólo voy a traer esto aquí. A lo mejor para este entrenamiento, necesitamos usar 28 negrita, es muy pequeño. 10 es seis. No está mal. Vamos a traerlo, ponlo aquí. Y esto es, ya sabes, debe ser 14, irregular. Estamos bien y arrástrelo, arrástrelo un poco. Si ves que esta cuadrícula es un poco distrayente, puedo hacer clic y controlar, ir a columnas y bajarla. Y necesito verlo. Ahora. Por éste, cambié de opinión. No quiero usar esto. Sólo, usa uno de estos como mi guía. Y aquí vamos. Yo quiero poner seis aquí. Entonces esto va a estar en línea. Ahora aquí necesito dar click en el Inicio, ir a columna, sacar eso. Yo quiero ver exactamente dónde estoy. Entonces sí, por eso necesitas estos lineamientos. ¿ Qué hay de aquí? Perfecto. Ahora puedo volver atrás y puedo bajar esto. Entonces, ¿qué más necesito? Necesito llegar a una idea muy interesante, que es buena. Ven aquí y sólo tienes que mantener Alt y Shift y dar click con un círculo. Puedo crear algo como esto. Frontera y frontera, tal vez una frontera más ligera. La frontera debería ser una lástima. ¿ Y el nombre? Se va a llamar a esto David. Seguro que son 14. Arial bold. Cuando algunas estrellas, ya creamos las estrellas. Furiosamente. Es lo mismo. Voy a usar la misma estrella aquí, pero o su real historicizar. Volvamos aquí y busco tiendas. Y también tienen esto se va a copiar estos tres retenidos Tab. Y en primer lugar, quiero simplemente copiarlos aquí es espera un segundo. Olvidé copiar estos. Para copiar pegar. Y vamos a pegarlos aquí. Entonces ver que el amigo decide que en realidad un poco más pequeño. Entonces sólo voy a mantener esto aquí consiguiendo un lindo. Y esa sería la grilla. El espaciado estaría bien. Porque voy a cambiar quizá el color igual que el erudito. También. Sólo voy a poner esto aquí. Por lo que ahora turno, selecciónalos todos, manda Control G para agruparlos. Se trata de uno diluido. Y pon esto aquí. Y así es en realidad como diseñamos esto. Por lo que este también debe ser gris claro. Ahora, voy a seleccionar toda esta cuadrícula de repetición. Y Eleanor puso seis de ellos aquí. Entonces esto es lo que hacemos, va a venir aquí y asegurarnos de que esto esté exactamente alineado con estas líneas. Por lo que va a ser muy fácil para nuestro desarrollador diseñar esto. Entonces déjame ir un poco afuera. Entonces si le doy sombra, estaría bien si le diera sombra. Entonces, ¿qué pasa con este tipo? Y esto cubre tendencia, ¿verdad? Arrastremos esto un poco. Y éste. Haga clic en esto. Volvamos a tus caras de ojos en un chapoteo. Seleccionar Fotos ya seleccionadas seis. Y sólo escojamos el siguiente árbol 112. Parece autores. A lo mejor este tipo, éste. Aplicar. Y sólo echa un vistazo. Incluso por el nombre. Si tienes algunos, solo puedes poner algo como esto. Sólo te voy a mostrar y fuegos en litros. Tenemos muchos nombres aquí, ¿verdad? Podemos poner algunos nombres, como solo te voy a mostrar. Permítanme simplemente duplicar esto. Control C, Control V. Llamemos a esto nombres. Va a hacer doble clic en el interior. Debería ser Dave Lee. Bueno, entonces imagina que tienes seis de estos. Y sólo voy a guardarlo y cerrarlo y sólo echarle un vistazo, chicos, esto puede hacerlo más pequeño. Entonces solo voy a arrastrar esto y solo ponerlo aquí, mira y solo echar un vistazo. Todos ellos tienen ese nombre. Por lo que puedes pedir toda esta información. Sólo se retrasó a ti mismo. Pide esta información. Y creadores de contenido trabajando con este cliente, entonces solo pueden enviártelo. Si eso es, solo puedes hacer esto. Echemos un vistazo, da click en Inicio Mac Control plus. Y sólo echa un vistazo. Trending. Muy bonito, me encanta. Volvamos atrás. 56. Diseño de secciones recomendadas: Lo siguiente que tenemos que hacer es recomendable para ti. Ya teníamos éste, ¿verdad? Recomendado para ti, es puede arrastrarlo y soltarlo aquí para tener la idea de lo que estaba diseñando. ¿ Correcto? Sí, Por la brecha entre ellos, sólo voy a mirarlo. Entonces esto es tendencia. Significa que si tenemos una brecha de tal vez alrededor de 62, sólo voy a seguir haciendo lo mismo con estos pequeñitos. Entonces hay una brecha entre aquí y mantener esto aquí. Selecciona cada tanque. Bajarlo a esta línea. Y yo sólo voy a ir a casa y sólo presionar conlleva si está bien. Sí. Recomendar tal vez pueda subir. Encomiado por usted. Por lo que ya tengo este espaciado y todo. Yo sólo voy a borrar esto ya se sabe. Yo sólo voy a quedarme con esto. A lo mejor puedo copiar este y simplemente arrastrarlo. Ensayo clínico x2000. Así que tráelo en la parte superior. Mismo tamaño. Nos encanta la talla en realidad, no creo que sea lo suficientemente grande la talla? Puedo jugar con esto. A lo mejor puedo simplemente apretar. Estos dos pueden venir aquí, pero también pueden subir. Aquí vamos el Buy Now. Y éste. Ya creamos esto, ¿verdad? Creo que la misma fórmula, pero necesito cambiar el color. Entonces volveré a como panel. Arrastro aquí uno de botón. Agradable. No necesito éste. Yo sólo lo voy a borrar, sólo voy a escribir por ahora. Entonces porque es independencia, otra vez, cambia el color. Puedo seleccionarlo. Y ya puedo elegir este color. ¿ Y los antecedentes? El color de fondo? Es por esto que el 1 de mayo sea el color principal, el mismo color principal? El comprar ahora opción a 40. Debería serlo. ¿ Cuál era el tamaño del principal? Algo así, rosa. Esta es una pequeña escuela atrás. Lo que dice es que este tamaño es tamaño de fuente 21. Yo creo. ¿ Es con esta pequeña para mi gusto? Vamos a ver sitios web. Veamos dieciséis, pero es más pequeño. Entonces realmente no lo hizo grande, ¿verdad? Entonces 21 está bien. Este, busco. 20. Haz que lo hagas. Puedes agregar más texto aquí. Más información sobre un chico. Aquí vamos. Esto es debe estar aquí. Entonces aquí estaba el rey para hacerlo aquí. Entonces sólo voy a alinear esto desde la izquierda. Todo debe estar alineado también. Incluso el texto. estos coronarios ELLA es de izquierda a derecha es igual. Entonces estoy tratando de hacer que todo sea nivelado. Agradable. Humano. Este 40 puede traer otro aquí. A lo mejor el precio real fue de 56. Este va a ser Tony. Y qué luz cambia el color debe en medio de tu recuerdo ser 16. Nuevamente, cambia el color. También. Agrega que me dieron una huelga y verdad. Y probablemente bajar la opacidad. Déjame ver lo que hemos hecho. Siempre tenemos que comprobarlo de esta manera, chicos, porque este es el camino real. 40. Seis, creo que es un poco pequeño para nuestro diseño. Yo sólo puedo hacerlo un poco más grande. El 40 es ahora mismo es 20. Quieres que sea 28 pernos. Y también que sea blanco, rosado hacia abajo. Este ya es 16. A lo mejor puedo hacer 24. Hazlo blanco. A lo mejor 24, luz. Y una huelga y verdadera. Echemos un vistazo a esto. Esto no está mal porque la portada es tan grande. Hay mucha información esta recomendada para ti. Sólo déjame arreglar eso. Puede bajar la tendencia. Abanca aquí. Haga clic en esto, Copiarlo, haga doble clic aquí y cópielo aquí. Se lo recomendó. Y solo, sólo ponlo aquí. Y sólo éste. Y yo sólo puedo ponerlo aquí, subir un poco. El desfase entre estos dos debe ser de alrededor de 20. Entonces esto es lo que hacemos. No conozco este. Guardémoslo, presione Command o Control S. Lo otro que falta de aquí es, yo creo que la estrella, sólo voy a copiar estas estrellas. Eso lo va a traer aquí. Limpiemos para estar en algún lugar aquí. Bonito y alineado. Esto se debe alinear también. ¿ Y el tamaño del libro verde? El tamaño del libro de sueños? Es demasiado grande a los 40. Todavía grande. Teddy busca alcanzar el pico 24. No está mal. Y éste debería de ser 16. Luz. Por Jack Dorsey era vieja primera capital. Aquí vamos. Recogerlo. Aquí vamos. El lapso de aprendizaje algunas toma, el orden debe ser muy ligero 16 y quiero hacerlo blanco. Ahora aquí vamos. Todo es perfecto y está en el lugar correcto. Para volver a comprobar eso. Trending recomendado para ti. Prepárense lo suficiente. A mí me gusta y es audaz. Y por ahora, ¿eso es un bicho ahora? Puede ser en la corte. Es mucho mejor. Agregar al carrito. Y además solo voy a seleccionar todos estos. Arrástrelos a la izquierda, copie esto y simplemente arrástrelo hacia la derecha. Nosotros subimos. No quiero este. Se va a borrar, copiarlo, y arrastrarlo hacia abajo. ¿ Verdad? Glib va a volver, no quiero hacer éste, borrado el mismo año. Haga clic y arrástrelo, póngalo aquí. Mantenga pulsado, Shift, hazlo un poco más pequeño. Esa es la cosa, chicos. Yo sólo voy a explicar el radio fronterizo la esquina. Si éste tiene 16 años, éste debe ser 16 o 88 es mejor. Entonces lo que tenemos para mantenerlos muy organizados en esta debe ser ocho. Agradable. Simplemente selecciona esta herramienta la va a traer aquí para mejorar la estrella. El texto. Agradable. Simplemente voy a alinear los clics de botón, texto de botón alineado. Eso malo. A la tarjeta debe venir. Aquí. Para ADKAR, necesito el icono del carrito también. Entonces así es como lo hacemos chicos. Seleccione esto, cheque, tosylate. Pégala, y luce bien. Justo en la curva. Eso es demasiado grande. Puedo hacer click en él, hacerlo un poco más pequeño. Aquí vamos. Aquí vamos. Alinear esto con esto. A lo mejor aquí, y basta con dar click en esto. Y aquí el 32, podemos hacerlo 2828. Incluso puedo volver a hacer clic 24. 24. Ahora no tienes espacio. Entonces esto es algo que podemos hacer todo el tiempo. Podemos jugar con él. Entonces no debería ser exactamente lo mismo, chicos. Así que base nuestro diseño. Cambiamos las cosas. Entonces puedes poner esto aquí por lo mismo, pero éste lo puso en la parte superior. Entonces sólo voy a copiar esto. Ponlo aquí. X, borra este, Control de Comando V para pegar ese. Digamos, bonito, muy bonito. En realidad, el espaciado entre estos dos y estos dos. Por lo que éste puede llegar a la derecha de ella. Este. Entonces en esto es, esto puede llegar a la derecha hasta que obtienes el mismo tamaño de esto. Agradable. Volvamos a verlo de nuevo. Esta talla y esta talla. Todo se ve perfecto y limpio. Ver tenemos algo de espacio, así que no lo sientas todo. Por lo que la mayor parte del tiempo necesitamos algo de espacio. Correcto. Esto es recomendable para ti. Entonces tenemos una oferta especial. Oferta especial va a ser como este entrenamiento. Sólo voy a copiar a estos dos. Sólo voy a arrastrar esto hacia abajo. Entonces, ¿y si quiero ver más de esto? Necesito algo como Ver icono, ¿verdad? Y solo copia esto, arrástrelo aquí. Y todos estos compañeros. Ver capa de fondo se puede llamar tiros. Y sólo puedo ponerlo aquí. Porque si es recomendable, quiero ver más de ella. Ahora está en el centro. Y esto puede ser una oferta especial. 57. Diseña la header de visualización móvil: Ahora es el momento de crear la vista móvil de esta página web. Por lo que da clic en el botón Inicio. Entonces vayamos a la Mesa de Trabajo. Y en móvil, busco en iPhone XR, Zmax 11. Este es en este momento el tamaño digital de iPhone. En realidad, sólo voy a arrastrarlo y ponerlo aquí. Entonces si quieres usar esto como auto responsive va a ser un montón de problemas para mí. Personalmente arrastra esto y todo va a ser desordenado y para arreglar todo esto, se necesitan muchas veces chicos. Por lo que es mejor simplemente arrastrarlo y ponerlo aquí y crear nuestra propia vista móvil. Entonces vamos a crear primero este 1. El fondo y un agua. Aquí vamos. El segundo es éste. Sólo tienes que arrástrelo un poco aquí. Esto debería ser esta petanca es de ocho. Simplemente lo voy a poner aquí para móvil de izquierda y derecha. Necesitamos un margen. Yo sólo voy a dar click en este. Y el margen debe estar alrededor de 15 o 15, derecha, de izquierda a derecha. Entonces hagamos de esto un color diferente. Y yo sólo voy a arrastrar esto y ponerlo aquí también. No necesitas crear la cuadrícula para ésta porque fácil, solo voy a arrastrar esto y ponerlo aquí. Sólo voy a arrastrar esto aquí. Entonces no necesito a estos dos. Y para móviles es sencillo. Y lo es. Y también necesitamos algo como esto para About Us Staff buscando tal vez alrededor de gorra, tal vez un poco más pequeña y simplemente arrástrala aquí. Y lo voy a hacer de este color. ¿ Y qué pasa con los textos? Va a pasar lo mismo. Yo sólo voy a volver a ver el Amazonas. Entonces si quieres revisar las páginas, solo voy a abrir esto. Vamos a guardar este, esto, esto, esto, esto, abre aquello. Si hago clic con el botón derecho e inspecciono. Por lo que haga clic derecho en cualquier página, inspeccione y haga clic en esta letra icono móvil. Y asegúrate de poner el tamaño que quieres de mí es como para 14. Simplemente ponlo en dimensión. Por lo que significa que el Amazonas, el sitio web más grande bajo el planeta, no soporta la vista. ¿ Y por qué hay? No sé por qué. Vamos a revisar este. Haga clic derecho en Inspeccionar. Y este es el tamaño. Entonces busco las líneas de texto y los números de texto. Puedo usar esta otra vez, el tamaño de fuente. Por lo que sólo voy a dar click en este. Entonces decide que el tamaño de fuente para el grande es de 14 píxeles. Nuevamente, para este, el tamaño es de 12, por lo que 14 y 12. ¿ Y el texto? Entonces 1412, ¿manera normal o ésta? T, dar click a este 13. Entonces entre, entonces este es 13. Esto es por algo es 12. Entonces eso es lo que empezó a partir del 14. 12, y esto va a ser 13. ¿ Y éste qué? El título? Eso van a ser 18. Por lo que tenemos 18 título. ¿ Verdad? Ahora mismo. Sabemos qué hacer. Volvamos a inspeccionar honestamente cómo alinean las cosas y es cómo lo hacen. ¿ Y éste qué? Como T? ¿Haga clic aquí? 14, el número 18. Y esto es enorme. Creo que esto es demasiado grande para un móvil. Creo que esto fue mucho mejor. El 1801 fue mucho mejor, ¿verdad? Volvamos atrás. Por lo que tenemos algo de info al respecto. Sólo voy a arrastrar esta retención Shift y seleccionar todo esto y arrastrarlo hasta aquí. Yo lo voy a hacer pequeño. Listo para ir. Va a ser el más grande fue 18. Pero creo para este Móvil, puedo hacerlo 26. Yo también puedo simplemente poner esto aquí. Este puede ser de 18 años. Este 126. Extra luz. Este, puedo bajarlo 14. Aquí vamos. Siguiente. ¿Y estos iconos de aquí? Se va a controlar click y luego shift click y seleccionarlos todos. Copia. Y puedo ponerlo con el mismo tamaño aquí. No sería un problema. Pero la cosa es, cuando vienes de izquierda a derecha y al móvil. Creo que si hago todo en el centro va a ser mucho más agradable. Y echa un vistazo. Puedo arrastrar este centro y Control L para bloquearlo. Por lo que sólo puedo cambiar, seleccionar estos dos, y arrastrarlos y ponerlo aquí. Y ahora, echa un vistazo. Qué guay es eso. Echemos un vistazo a esto. Control inter, hermoso, hermoso. ¿ Qué pasa con este árbol? Este árbol también se puede arrastrar aquí, creo aquí. Y Shift, Eliminar y hacer lo mismo. El único problema es la frontera. El límite de esto debería ser de ocho, estaría bien. Y también este comando Control L, solo voy a rastrear esto para que sea más interesante para la vista móvil. 58. Información de diseño y tendencias de secciones de diseño de vista web móvil: Entonces tenemos algo de espacio. Sólo voy a dar clic y arrastrar esto hasta aquí. Y también lo mismo. Y tenemos algunos aquí fuera. Tenemos algo de espacio. Puedo arrastrarlo hasta llenar este espacio. Asegúrese de que estos tres hagan clic derecho y traigan al frente. Ahora es el momento de poner estos hermosos artículos. Contraerlos uno por uno. Entonces este es genial. Este es 14. 14. Rastrearlo. Y esto debe ser 12. Puedo ver todas estas hermosas. Y cambiemos el nombre. Esto va a ser control seleccionar, hacer doble clic y de mejor calidad. Controlar seleccionar o hacer clic. Copiarlo a un selecto dirigido, llegar a un C. Control select, esos son el tipo de control V. ¿ Y qué pasa con estos iconos? Copia. Escribe algo. Sólo cantidad. Fregadero. Está bien. Copia. Entra, pega. Hazlo un poco más pequeño. Vamos a hacer la parte de entrenamiento. Haga clic, cambie, haga clic, arrástrelo y suértelo aquí. Esto va a ser 14. Esto va a ser 12. Y centro. Siguiente, tendencia. Por tendencia, quiero hacer este carrusel. Entonces quiero rastrearlo, ponerlo aquí, desagruparlo, cambiarlo, convertirlo en una pequeña Alice. Puedo poner tres aquí en un solo tiro. Seleccionarlos todos, y agruparlos para que no pierda nada. Esto es lo que vemos. En realidad copia esto. Esto va a ser 12. Arrástrelo hacia abajo. Arrástrelo hacia abajo al tamaño debe ser ocho. Nash, ¿verdad? Entonces lo voy a hacer es hacer clic derecho y desagruparlo y solo eliminar todo esto. Arreglemos uno. Y sólo voy a usar la cuadrícula de repetición para arreglarla. Aquí vamos. Genial. Y debe ser un carrusel. La mayoría de las veces lo ponemos en 10 estaría bien. Entonces van a haber seis. Vayamos a portada de libros aquí. Está bien. Entonces para esto uno llamado UI Faces en un splash y aplicar aleatoriamente. Por lo que puede ser una imagen. Cambia a todos ellos. Enfriar, y poner los nombres. Vamos a los archivos y rastreemos los nombres aquí. Todos ellos van a cambiar también. Entonces este, debería ser como estos chicos. Voy a dar clic en este ícono aquí. Y siempre va a ser agradable. Ahora, está bien. Entonces si hago clic en este pequeño ícono aquí, control plus, así puedo saltar. Ahora puedo desplazar esto a izquierda y derecha. Agradable. Es exactamente lo que estamos buscando. Correcto, genial. Ahora, voy a arrastrarlo hacia arriba. Eso fue por entrenamiento. 59. Diseña secciones recomendadas en la vista web móvil: ¿ Y qué hay de recomendado? Simplemente voy a arrastrar lo recomendado aquí. Volvamos al panel de activos. Poner un 14. Y es genial aquí. Está bien, vamos a copiar esto. Copiarlo y pegarlo aquí. Pegar, izquierda, mantener pulsado, desplazar, arrastrar hacia arriba. Ahora Está bien. El Libro de los Sueños debe ser 14. Pero Jagger Rosie debería tener 12 años. Bájala un poco. Se necesita, debe ser 12 también. Abajo. Empezó a bajar un poco también. Este radio debe ser para Agregar al carrito, debe ser 12. Este. Entonces solo voy a arrastrar esto un poco. Esto es llegar a una pequeña decodificación debería ser obvio. Esta rutina, esto es de 14 voltios. No tienes que tener 12 años. Echemos un vistazo a esto. Tengo curiosidad por ver si éste y éste es romperlo un poco y Control, Eliminar Control, Enter. Linda tendencia. Carrusel. Recomendado para ti. Está bien, no hay problema en la tarjeta. Es un poco grande. A carnet, puede ser 10. Y el problema, y esto puede ser un poco más grande. Entonces el único problema aquí es que puedo hacerlo más pequeño. Line es de este rincón. Está bien, genial. Por lo que puedo hacer clic y esto y llevar estas líneas para alinearlo con esto también. Perfecto. Vayamos por éste. Yo sólo voy a arrastrar esto hacia abajo. También necesitábamos cambiar esto también con alguna portada de libro. A lo mejor este, tal vez esto, escriba éste también. Esto va a hacer que esto sea más pequeño. Debe ser B2, más pequeño. Elevador. Arrastra todo hacia arriba. Y control click, arrástrelo hacia arriba. Ahora, puedo jugar con él y simplemente poner la disciplina de izquierda también. Y al carrito y arrastrarlo hacia arriba. Deberían ser 10. No lo estoy, sólo voy a copiar este cambio. Libro. Este y éste es checar esto, ver cómo va a ser. Una pierna. Bien, Bonito, Muy bonito. Decorrelacionar a la guardia, correcto, somos interesantes. Basta con alinear esto completamente. Lee estas últimas líneas, la imagen. No creo que sea necesario porque está alineado con esta tarjeta add. Está bien, genial. También tienes, tienes el VOR va a arrastrarlo y soltarlo aquí. Y todos estos tienen sus propias páginas, chico, así que no lo olvides. 60. Diseña secciones de oferta especial de las secciones de oferta especial: Se va a desplazar selecto, arrastra esto hacia abajo. Va a ser una oferta especial. Agradable. Rastrear esto. Por la oferta especial que esto también va a ser un carrusel. Sólo voy a arrastrar esto y sólo a tirarlo aquí. Alt para copiarlo. Necesito arreglar una. Desagruparlo. Y yo sólo voy a arrastrar uno de estos. Hago dos de estos o tres. Este carrusel. Ahora, vamos a ser graduados para carruseles 10. Y así es como va a ser. Se va a quedar así. Entonces básicamente puedes ver que algo está saliendo para que puedas arrastrarlo a izquierda y derecha. Totalmente. Todavía mucho. Por lo que mi Control L para bloquear el fondo. Yo sólo voy a traer esto de vuelta. Desagruparlo. Este tamaño debe subir y asegurarse de desbloquearlo o sed corporativa. Otra vez. Y grupo seleccionado. Si no puedes seleccionarlo, significa que tendrás que bloquear primero el fondo. Esto es por esto va a ser 12. Estrella. Copia esto y pégalo. Lo mismo con éste. Ir a click arriba, abajo, ¿verdad? Muy bien, Bonito. Ahora voy a hacer es lo mismo. Este debe de tener 14 años. Por lo que debe ser 12. Y puede estar subiendo este también. Y puedo arrastrar esto también. Seleccione Repetir cuadrícula. El vacío debe ser de 10. Y esto es lo que voy a hacer, va a arrastrar esto para que sea seis. Saquemos las fotografías de aquí para aquí. Entonces sólo voy a arrastrarlo y soltarlo. También. Yo sólo voy a ir a Archivos y luego nombres. Porque tienes algo llamado por De Li. Si lo arrastro y lo suelto porque no tengo una y frente a ella, así que no va a mencionar el bicho. Entonces solo lo voy a hacer así. Pero para unas partes de carrusel, me voy a meter en el ícono aquí. Mantenlo de esta manera. Controlar a pasante como bajando. Agradable. Sólo tienes que arrastrarlo un poco. Ser más liberal. La tecla de flecha, solo puedo venir a controlar. Bolsillo. Tira hacia arriba, hacia abajo. Mu 0 va a ser dueño de una página de oferta especial. 61. Descuento en diseño y sección popular Vista web móvil: ¿ Y el descuento? Simplemente van a arrastrar esto hacia abajo. Tenemos el color de la página principal aquí. Oferta especial. Esta fórmula lo va a arrastrar hacia abajo. Comando, lo hacemos blanco y vemos este conteo. Y también sólo voy a copiar este pequeño ícono aquí y ponerlo aquí también. Hacerlo un poco más pequeño. Esto puede colorear. Se trata de una niña o de un texto. O el comando de tiempo de descuento, G para agruparlo, mantenga presionada Alt para copiarlo. No lo olvides, mantén presionadas Alt y Shift para que sea pequeño. Desde el centro. clic debe ser ayudas de la frontera. Aquí vamos. Es agradable tener esto. Entonces solo voy a arrastrar esto hacia abajo Comando o Control L para bloquearlo. Y Alt Shift seleccionar, hacer clic derecho y desagruparlo. Haga clic derecho y desagrupe la cuadrícula. Y vamos a ver. Si no podemos poner dos aquí. Hacerlo más pequeño. Algo así. Está bien. Este debe ser 810, crear debe ser. No necesito éste. También dispuesto a eliminar éste también. Seleccionar y eliminar. Aquí. Realmente deberían serlo. 1210. Las estrellas son un poco raras. Por lo que hacen clic derecho y desagrupan el componente. Esto se está volviendo demasiado loco. Y que sea un poco más grande. Haga clic en Todo para copiarlo. Y debería tener frontera. Debe ser 1.31.5. Agradable. Ahora, controle, selecciónelos y agruparlos para que pueda usarlo en diferentes ubicaciones, diferentes lugares. Genial a realmente 14. Ahora, copia uno de estos y súbete a mí. Para que lo pueda poner aquí. Esta esquina debería ser cuatro, supongo para esta imagen. Puede controlar seleccionar y bajarlo un poco. Porque todo está moviendo artículo agradable. Las estrellas bajan. Y se ve el precio. Cuadrícula seleccionada. Asegúrate de que la brecha sea. Y yo consigo 23. Y solo arrastra esto y solo déjalo caer aquí. Y también selecciona esto de nuevo, selecciona ese icono aquí. Grupo de desplazamiento. Veamos qué hemos hecho. Iphone. Desplácese hacia abajo. Bonito WebView. Hermosa. Tus manos, solo puedes arrastrarlo a izquierda y derecha y todo es legible y añadir al carrito opción. Bellamente hecho. Ven controlo la L para desbloquearla de nuevo. Arrástralo hacia arriba. Aquí vamos. ¿ Y qué pasa con lo popular? Lo genial de la popularidad es que puedo arrastrar todos estos y arrastrarlos hacia abajo. Porque estoy usando el mismo equipo. Simplemente popular. Y va a derivar estos dos, ¿verdad? Y aquí vamos. Muy bien hecho. Y echemos un vistazo a esto. Comando o Control Enter. Consulta esta oferta especial. Y son hermosas. 62. Diseña últimas noticias y testimoniales: Bueno, vamos a hacer tienes las últimas noticias y testimonial y suscríbete. Particularmente fácil. Nuevamente, shift select, rastrea eso hacia abajo. Copia, ven aquí. Pegar. Últimas noticias de drag. Haga clic derecho. Grupo. Elimine esto, elimine éste. Seleccionar, Mostrar. Este es un león de la izquierda hacia arriba, hacia abajo turno y lo hacen muy pequeño porque es Nios debe ser legible. Entonces sólo voy a arrastrar un poco esto hacia abajo. Esto va a ser 12. Así que arrastra esto hacia arriba. Por Dave Lee, que sea 10. Lo mismo aquí. Que sea diez. Por lo que va a ser Grupo Últimas Noticias. Entonces sólo voy a arrastrar esto hacia arriba. El hueco entre ellos debe ser de 10, tal vez 14. Para Móvil, sé muy agradable. Y aquí, hagamos esta pista así. Realmente ya se tenían un profundamente aquí. ¿ Qué lo puse aquí? Entonces esto es algo que no deberíamos hacer. Por lo que sólo voy a dar click en este Davey. Fecha de vencimiento, arrastra esto hacia arriba. Arrastra esto hacia arriba. Simplemente voy a aumentar esto porque es neón para que puedas leer más. Ahora tiene más sentido. Nuevamente, predictivamente. En caso de suprimirse, se omiten. Arrastra esto hacia arriba. Por lo que sólo podemos agregarle más líneas para que puedan leer más. Ahora, el 10, El ego de hoy debería ser 10 también. Arrástrelo hacia arriba. Y esto es exactamente lo que queremos. Mac Control G para agruparlo, repite grilla. El espaciado es 10. Ahora, Aquí vamos. Sólo vamos a ir a mis fotografías, empezar de aquí para aquí, quizá ésta también. Arrastrar y soltar. Y también para el control Imagen, click y lágrima y un splash aplicado al azar. Y eso es todo. Esto está bien, supongo. Déjame comprobarlo. Control Entrar. Desplácese hacia abajo. Está bien, Noticias. Desplazamiento. Triángulo lo. Está bien, porque de nuevo, sólo lo vamos a hacer. Escolar de vuelta. Control en me encanta lo que lo hemos hecho. Es decir, es hermoso. Por lo que las reseñas parecen una aplicación. Impresionante. Terminémoslo con el testimonio. También necesita la vista todas las comidas. Y el testimonio. Seleccione y se dejó caer aquí. Cambia el color al color principal. Testimonios. Copiar, pegar. Esto debe ser 14. Esto debe recoger 12. En el centro. Esto está funcionando así al conocerlo y subirlo, arrástrelo hacia abajo. También puedo copiar esto y tirar de todos para arrastrarlos todos aquí. Num Shift, hazlos pequeños. Y arrastra esto un poco más hacia abajo. A la suerte, buena suerte también. Yo sólo voy a seleccionar todo esto. Mi Control G al grupo. Después mantendrá presionada Alt, Shift. Más pequeño. Arrástrelo de izquierda a derecha. Aquí vamos. Entonces sólo voy a adjuntar esto. Entonces no necesitamos a estos dos, pero está bien. Podemos recoger mis manos, puedo desplazarme y arrastrar a la izquierda y a la derecha. Y va a estar bien. Está bien. ¿Qué más nos falta aquí? Me falta el nombre de esta copia. Basta con hacer doble clic aquí. Debería estar en lo cierto. Empezar a trabajar. Debe entonces ser audaz, debe ser regular. Gneiss, mucho mejor. El mismo equipo. Kirby debería ser Sarah trabajadora, podría hacer x cuadrado 12. Volvamos a los activos. 12. Ok, selecciónalos todos, arrástrelo hacia arriba. El accidente cerebrovascular es demasiado, hazlo también. Y es hermoso, impresionante. Sólo voy a seleccionarlo todo. Arrástrelo hacia el centro, hacia el exterior. ¿ Puedo desbloquearlo? Arrástrelo hacia arriba. Vayamos por suscribirse. Entonces subo aquí. Deberían ser 14, dividiendo el centro. Aquí vamos. Arrástrelo hacia arriba. Lo mismo. Está bien. Aquí vamos. ¿ Y qué pasó? Está bien. Pongámoslo aquí. Hagámoslo un pequeño arrástrelo por aquí. Asegúrate de que esto va a ser genial boletín. Agradable. Perfecto. Y tenemos la parte inferior. Permítanme simplemente dar clic aquí. Yo me pongo abajo. Entonces para ahorrar tiempo, ya lo he hecho. Por lo que ustedes sólo pueden echar un vistazo a esto. Lo mismo. Sólo la mesa puede arrastrarlo hacia arriba y poner todo esto aquí también. Vamos a seleccionar este, desplazarnos hacia abajo y también la experiencia. Entonces ya ves que se está apagando. Seleccionado el grupo a la izquierda. Y pongámoslo como componentes. Por lo que podemos usarlo debe ser a la vista de pie de página y móvil. Agradable. Y esta es la última vez. Está bien, tengo el carrusel top trending recomendado. Atención de descuento. Tan hermosa. Impresionante. Aquí vamos. 63. Diseño de una página de filtro en categorías de categorías: Vamos a crear la página del alimentador. Pero antes de que creemos el filtro, arreglemos esto, esto va a estar más en forma. Y lo único en lo que estoy pensando es, así que esto está bloqueado. Voy a seleccionar todos estos Comando o Control G para agruparlo. Y yo sólo lo voy a arrastrar hacia arriba. Porque en diferentes páginas vamos a tener lo mismo. Te lo mostraré. Entonces vamos a presionar Comando o Control D. Eliminar todo esto por ahora. E incluso éste, va a ser página de filtro. Entonces porque vamos a usar mucho esto, hay que hacer este componente. Por lo que un signo más. Y eso es todo. Sólo voy a copiar esto por ahora. Y también es al mismo tiempo copiar pegar aquí. Se va a en esta página porque es la página de Flickr. Yo quiero algo como esto. Ahora empecemos. Ahora, Vamos a copiar todo esto. Copia y pega aquí. Pero no sabemos dónde pegarlo, verdad. Entonces tenemos que activar decretado. Ahora sé dónde poner toda esta zona. En lugar de libros. Estos deberían ser filtros. Decide probablemente 2020. Es bonito. Sé que es un filtro, ¿verdad? Lo que voy a hacer es arrastrar una línea aquí y arrastrar otra regla aquí. Entonces sólo voy a asegurarme de que la regla se pegue a este lugar. Impresionante. Ahora, la otra cosa es que voy a empezar este formulario aquí. Este ángulo. Entonces desde esta zona, ten este espacio y el lado izquierdo aquí va a estar bien. El ventanal, necesito una línea de aquí a aquí. Por lo que arrastro la línea. Sólo voy a mostrarte lo que hice. Arrastre una línea que la voy a poner aquí. Está bien. Agradable. Y eso es todo. El resto estaría bien. A lo mejor esta línea puede venir aquí. Y solo puedo empezar desde aquí porque necesito el mismo espacio. Y puedo cambiar el color a este color por ahora. No necesito retrasar ahora mismo porque aquí es tan distraído. Esto es lo que voy a hacer. Yo sólo voy a arrastrar todo esto, mantenerlo al frente. Y aquí. A lo mejor retrocede un poco. Y bajando. Contamos con filtros. Pero aún así, creo que es grande. 16. Bien. Arrástrelo hacia abajo. Tener categorías, que van a ser filas. Son 14 filas. Y todos estos son 15. Luz. Hagamos clic en uno de estos, 14. Entonces porque veamos, haga clic derecho y desagruparlo por ahora. Yo sólo voy a seleccionar y agradecerles. Y de color más claro o incluso más claro. Creo que está bien. Entonces tenemos estos cómics por ahora. Este cómic puede dibujarse como este color, probablemente debería ser azul. Y esto es, su hace que sea más obvio que estamos en esta página ahora mismo. Por lo que 16 audaces. ¿ Qué más aquí? Estos van a ser el color principal. O tal vez el color más claro sería bueno también. De acuerdo, los seleccionamos a todos y los ponemos en 14 cuerpo como regular. Entonces, ¿qué hace el sí. Lo que voy a hacer es que necesito agregar algo aquí. Yo sólo soy contrato es escribir. Este debería ser más cargar más. Lo cual puede arrastrar esto hacia la derecha. Hazlo amarillo. Arrastra estas cosas hacia arriba. Entonces sólo voy a arrastrar esto hacia abajo. Tenemos algo llamado picos de editor. ¿ Y qué tenemos aquí? Sí tenemos un ícono. Sólo voy a copiar esto. Suéltala aquí. Asegúrate de que este bajo. Aquí si vamos. Y traigamos uno de estos aquí. Estos van a ser el pick editor. Y también estos están aquí también. Cargar más. También tenemos solo agrupamos estos formatos de libro. Seleccionado, mantenga pulsado el turno y gírelo. Editores. Y, y siéntate ahí y mantén pulsado Shift. Diseñemos el rango de precios. Seleccione la línea de aquí a aquí. Entonces puedo alinear, asegurarme de que la cabina esté redondeada. Amplíe un poco. El tamaño, Eso es bueno. Tres, Wow, Zhuge. Tres o cuatro por cuatro está bien. En este círculo superior y restamos a estos dos por dentro. Haga clic en esto. Tan fresco madura en el centro. Está bien. Apague la frontera. Gilligan, siéntete bien desde aquí. Y baje esto un poco. Asegúrate de que esto sea gris claro. O porque esto va a funcionar en el lote de campo en la frontera. Por eso sí tenemos todo lo largo aquí. Además, sólo voy a probar uno de estos aquí. Otra línea de aquí a aquí debería ser tres. ¿ Fueron tres o 444? Y el color. Seleccione éste y éste, haga clic derecho y envíelo a la espalda. Ahora, puedes jugar con esto y es rastreable y lo va a traer aquí por ahora. Entonces en animación, animaremos esto. Esto va a ser tal vez 10. Dólar. El tamaño es de 14 bolas y lo va a dejar aquí. Y esto va a ser de 40 dólares. Y es como va a funcionar. Aquí. Vamos a agruparlos. Y sólo lo voy a poner en la parte superior para la animación. Entonces cuando hacemos clic bajo carga, se va a animar más. Todo esto sólo va a bajar y va a ser una hermosa animación. Muy bien, impresionante. Hagamos clic en Control Enter. Y vamos a ver, tenemos una variedad de categorías. Tenemos un cerdito. Tenemos más comentado función de libros más nuevos, que es leer estos libros cargar más formatos de libro o para mi asno y editores año y precio por rango. Impresionante. Simplemente voy a hacer clic en él y arrastrarlo un poco hacia abajo. Así que trae para arriba. 64. Diseña libros listados: Entonces echemos un vistazo aquí. Voy a tener idea. Sólo voy a volver a mi diseño y arrastrar uno de estos y ponerlo aquí y alinear esto a la parte superior. Déjenme revisar. Esto va a ser 16. No está mal. Aquí arriba. Yo sólo voy a usar este filtro y sacarlo. Esto va a ser 12, en realidad. Adivina, es bueno estar aquí. Libros. Y aquí en la parte inferior, lo que tenemos aquí es seleccionar ambos, alinearlos. Se va a llamar a esta C. Y ésta debe ser 12. Enfriar. Voy a hacer clic derecho en esto y desagrupar la cuadrícula. Copia este, y pongámoslo aquí para que podamos usar algunos de estos como guía. Voy a hacer clic derecho y desagruparlo porque ya tenemos esto. Sólo lo voy a poner aquí. Simplemente cambia esto. Entonces mira en default, estado y PD del individualismo. Este va a ser de color rosa. Y también es de bordo, va a haber más ligero. Lo mismo en defecto, estado, PDF, mismo color. Ahora da click aquí. Asegúrate de que el borde sea más ligero. Por lo que ya tenemos esto. Trae todo esto y ponlo aquí. Alineado los lunes. Los cómics deben ser 14. Muestra de libro va a ser audaz, pero creo que puedo ponerla en 16 negrita. Regular. Cuatro líneas serían suficientes. Aquí, sí tenemos algo llamado este formato para que la gente pueda entender esto. Lo que también tenemos es esto. Déjenme arrastrar esto por encima. Entonces va a ser el escritor del libro. Y tenemos todo en el lugar correcto. Primera letra mayúscula. ¿ Qué pasa con las estrellas? Creo en un puesto las estrellas aquí. Y pongámoslo aquí. Y lo que necesito es 4.020. Mal. Lo que voy a decir es, es tal vez tengamos 230 críticas, ¿no? Y es más ligero. Pongámoslo aquí. Zoom-in. El cuadro está en el centro. Y aquí tienes. En la tarjeta. Yo no disciplino. No necesito éste. Tenemos necesitamos algo llamado así si esta colección de libros tiene un descuento, como comió demasiado para y la frontera debería verse así. Haga clic en el color y haga una DLL. A mí me encanta. Busco la opción de agregar al carrito porque ya la creamos. Volvamos aquí. Hermosa. ¿Qué más necesitamos? Entonces si vienes a la unidad de colecciones de libros, algunos filtros aquí, de aquí para aquí. Y yo sólo voy a hacer algo como esto van a ser cuatro. Esto va a ser ds. Echemos un vistazo a esto. Yo sólo voy a poner una línea aquí y hacerlas blancas. También te permite arrastrar esto hacia abajo como un círculo, arrastrar esto como un círculo, ¿verdad? Será algo así. Agradable. A lo mejor. Solo estoy pensando, si me pongo esto y hago que estos dos deberían ser algo así. ¿ De acuerdo? Georgie, desde el centro, arrástrala hacia abajo, escríbalo. Agruparlos, comanda como Georgie, ponlo en un centro. Seleccionarlos a ambos, alinearlos. Yo sólo voy a copiar aquí. Y esto va a tener frontera, no tener deuda. Y también se va a quedar como esta linda línea pequeña. Vamos a traerlo aquí y arrastrar esto hacia abajo. Trae esto aquí. Echa un vistazo. Por lo que para asegurarse va a estar en muy bien alineado. En el palo. Aquí. Da click en estos dos íconos, y esto es lo que tenemos. Creo que se puede acercar. A lo mejor uno más es dos y esto son dos. Y de nuevo, seleccione ambos. Alinearlos en el centro. Glute hacia abajo, asegúrate de que la salida. ¿ Qué más tienes? Yo lo llamo espacio. Cualquier tecla de flecha será más fácil. Se va a copiar esto, arrástralo hacia la izquierda con Alt y Shift Command Control X. Salga de esa caja. ¿ Puedo controlar V? Arrastre esto hacia la izquierda. Necesito uno de estos. Copiar, seleccionar fuera de la caja. Ven aquí, pégalo. Y lo que necesito es un texto aleatorio como éste, sólo voy a ponerlo aquí. Llamemos a esto más nuevo. Por lo que estamos buscando el nuevo libro y pick color debe ser también morado. En animación animamos esto va a ser más nuevo a más antiguo. El más alto calificado, el más comentado, y va a ser de nivel libre basado en la deuda. Ahora bien, ¿qué más necesitamos? Necesito una línea básicamente de aquí a aquí. Y este va a ser el color. Ella. Descomponga la opacidad. Agradable. Selecciona todo lo que necesites. Control G para agruparlo. Haga clic en lípido, cree, asegúrese de que estas líneas sean iguales. 14. Agradable. Y bájala. Bájala. Básicamente. 1, 2, 3, 4, 5, 6, 7 1012345678910. 65. Diseña una página web y termina la página de filtro: Ahora aquí tienen que agregar las páginas y la página siguiente y la página anterior. Entonces página en partes de nación. Simplemente voy a usar este formato. El tamaño, establecer Shift. Arrastre esto hacia abajo. El azúcar es cuatro. Y esto va a ser tal vez sean números. Arrastre esto hacia la derecha, de derecha a izquierda. Entonces tal vez esta va a ser la página dos a color blanco. Y también va a ser audaz. Se va a dejar que me revise. 18 para este color sería bonito. Y también esto hacen de este subtotal. Y éste va a ser uno. Plomo, éste va a ser tres. Y entonces sólo voy a hacer algo como esto. Ahora selecciona todos estos. Puede bajar la opacidad. Algo así sería más interesante. A lo mejor sólo estos colores. A lo mejor el anterior. Apenas en su mayoría la gente está buscando la siguiente página. Presione Control y pulse Intro. Si vamos a New us, estas pestañas de conmutación van a mostrar los siguientes filtros. Sólo las estrellas, creo. Déjenme copiar estas estrellas de aquí. Copia y ven aquí y pegarlo. Pégala aquí. Porque estas estrellas son muy grandes. Dividirlo aquí. También. Uno de estos debe ser el gris. Selecciónelos, ambos y alinéelos . Echemos un vistazo. Agradable. De verdad, me gustó mucho este diseño. Modo diverso, muy natural. Todo está en el lugar correcto. A mí me encanta. Simplemente si agregamos algunas hermosas imágenes portada de libro. Vengamos aquí. Arrástrelo y suéltelo. A ver ¿Qué guay es eso. Ahora, echa un vistazo otra vez. No cambió, ¿verdad? Entonces, ¿qué pasó? Selecciónelos, selecciónelos arriba, bucle a una empresa por la opacidad más. Vamos a ver de nuevo. Cuando me gusta bastante. Sí, muy interesante. Ahora. Ahora es el momento de agregar lo popular y lo recomendado en una copia. Estos chicos populares, ya tenemos lo recomendado para ti, ¿verdad? Pero quiero usar este tipo de formatos. Yo sólo voy a poner este año. Entonces vas a usar esta misma cosa, dos iones. Esto se va a poner en el centro. Esto va a ser lo popular. Yo sólo voy a quitar esto. Entonces ustedes pueden ver que también agregamos la frontera porque queremos marcar la diferencia entre ésta y la otra. Por lo que esto se va a recomendar para ti. Y esto va a ser lo popular. Igual que el estilo, sin diferencia. Y sólo cambia el color de lo recomendado. Por lo que sería más fácil tal vez de aquí para aquí. Agradable. Ahora, vamos a comprobarlo. Libros, todo fuego. O yo había recomendado para ti un amor ella. Y lo popular que eres ahora es traer este y arrástrelo, ¿verdad? Creo que ya tengo un pie de página, ¿verdad? Tener una amenaza. Por lo que nuestro pie de página, ya creamos esto en anterior. trabajo, va a subir y eso es todo. Ya tienes un diseño terminado. Sube. Digamos que una vez más. Pasante de control. Y vamos a comprobarlo. Dentro de estas categorías, todo en el lugar correcto. Cuando éste está trabajando con animación. Vamos a animar a todos estos tipos, así que no te preocupes por ello. Incluso el Añadir al Carrito todo. Paginación, bonito. Todos los populares y 66. Diseño de una página Filter móvil de la página web de diseño: De acuerdo, esto crear vista. Y voy a mantener presionadas Alt y Shift y arrastrar esto hacia la derecha. Sólo vamos a mantener el pie de página y arrastrar las cosas para este trato aquí. Y también este. Suprímate esto. No necesito éste. Eliminarlo. Vamos a subir. Seleccione estos. No lo necesito. Volvamos atrás. Haga clic en el fondo Controlar L para bloquearlo alrededor de él. Todos estos movimientos van a eliminarlo. Y aquí vamos. Se va a quedar así. A lo mejor puede subir por encima. Entonces esto es candado. ¿ Y puedo controlar G para agruparlo? Y además, hagámoslo un componente. Por lo que si has cambiado, sería fácil usarlo. Bitácora y agradable. Entonces va a ser móvil y web tú. ¿ Cuál es el nombre de éste? Página principal? Y luego cómpralo. Porque ya tenemos mucho de esto. Voy a copiar algunos de ellos y usar el mismo texto. Copia. Tráelo aquí. Sólo, sólo déjalo aquí. Entonces sólo voy a copiar esto. Ponlo aquí. Decidir está bien para que el filtro se comunique por algo como esto. Este es el filtro. Entonces vamos a Plugins, icono para el diseño y tipo de filtro. Y éste, y éste. Veamos cuál es mejor. Entonces x fuera y colóquelo aquí. ¿Quién está aquí? Y usemos este para el filtro, que va a ser así. Por lo que la gente sabe que tiene que hacer clic en él para ser activado. Entonces si hacemos click y podemos elegir la categoría de libros y todo. Por ahora, necesito tener estos dos va a sostener Alt, copiar todos estos. Trae esto y desagruparlo. Y asegúrate de que pueda hacer todo perfecto sólo para esta zona. Por lo que necesitamos habilitarlo en un poco. Ahora turno y tráelo hasta aquí. Sólo voy a borrar esto por ahora. Basta con usar este. Selecciónelo todo, y tráelo aquí. No tan mal. Sólo esto. Probablemente, solo voy a eliminar la corrida editorial y mantener el aire aquí porque es móvil. Mucho mejor. Además, necesitamos el corazón. Vamos a copiar esto. Voy a dejarlo aquí. Déjame revisar. Entonces si vienes a ver la vista móvil, puedes ver estas hermosas, ¿verdad? A lo mejor. Entonces esto no está dentro, debería ser lo mismo. Así que arrástrelo hacia arriba. Y vamos a hacer click en Repetir, crear la brecha diminuta, bien. Porque es un filtro que puedes filtrar lo que quieras y simplemente buscarlo. Pero queremos seguir en busca. Después de seis. Tenemos que ver algo como éste, pero cambia el tipo para cargar más. Aquí vamos. Tan divertido ser mucho más. Simplemente puedes hacer click en esto. Correcto. Ahora sí tenemos lo recomendado y popular, que ya tenemos. Y vamos a usar lo mismo. Y aquí tienes. Echa un vistazo. Usuarios de Comando o Control, Enter o Return o Mac. Esto es demasiado grande. Más reciente. Yo me estoy desplazando. Por lo que aún puedes buscar. Hermoso, se puede ver al año escritor. Agradable. Permítanme simplemente cambiar todo en estos datos. Cargar más. Todos ustedes recomendaron para ustedes. Marcado de Aire Popular. Agradable, Muy bien hecho, hermoso. 67. Diseña la página individual: Ahora es el momento de diseñar la página única. Entonces sólo voy a copiar esto. Vuelve aquí para tener éste. Selecciona estos dos para actuar a la izquierda. Sí, vamos a ponerlos aquí. Elimina este, selecciona esto y Control V. Así que tengo esto. Por lo que se olvidó de hacer esto un poco más pequeño Alt Shift. Y eso es todo si ves las tallas demasiado grandes. No hay problema. Voy a alinear esto a lo más alto de esto. Genial, Impresionante. Sabemos que si hacemos click en él, podemos ver la página del filtro. Está bien, ya tenemos este riesgo tío es de una sola página Como libro, de una sola página. ¿ Verdad? Ahora solo voy a aguantar el Alt Shift y arrastrar esto hacia la derecha porque necesitamos muchas de estas cosas para simplemente eliminar esto y mantener algo de esto en la parte inferior porque probablemente los vamos a usar. Y va a ser en casa. Y de nuevo, copia tú y yo tenemos este triángulo aquí. Esto es genial. Arrastre esto hacia arriba, desagruparlo, tómalo aquí. Como ves, usamos muchas de estas cosas, sobre todo cuando hacemos nuestra primera página. El resto es fácil en realidad. Para que podamos hacer clic derecho y desagruparlo. Por lo que sería fácil hacer cualquier cosa, justo es ahora probablemente no lo necesito. Yo sólo voy a borrarlo. El resto. Selecciona todos estos y arrástralos hacia la derecha. Selecciona todos estos y arrástralos aquí por ahora. Y esto debería ser mucho más grande que una sola página. Es la gente quiere ver. El diseño real lo hará ocho. Bonito. Y yo sólo voy a añadir cuatro cuadro más de este libro. Al fondo de este ocho. Veamos si podemos usar, podrías crear cuatro. Bonito. Y también puedo arrastrar esto para arriba por hermoso. Ahora pongamos la portada del libro y llevemos cuatro bellas imágenes. Arrastra y suelta. Es como si estuvieran dentro de este libro. Probablemente si lo eres, tenga sentido, busca algunas imágenes que sean del mismo tema, el mismo look. Entonces tal vez éste, éste, tal vez éste. Arrastra y suelta. Al menos tienen el mismo tema de color porque no queremos mostrar que son libros diferentes. Y probablemente necesitamos que algo se borre a la vuelta de la esquina. Y aquí tenemos el número uno. Aquí tenemos el menos. Entonces hazlo más grande. No debe ser audaz, debe ser regular. Usa tu tecla de flecha si no funciona. Voltaje, vidrio de cambio. Por lo que after made es muy pequeño. 28. Sube, cambia selecto, y cambia el color a morado. Y ésta debería ser la opacidad por ahora. ¿ Verdad? Ahora, probablemente voy a usar este 20 pixel arriba y abajo en el centro. Entonces selecciona este estado por defecto y solo necesitamos colorearlo, chicos, Eso es todo. El detalle del producto es enorme. Probablemente. Cuando es algo este pernos del lactato es de 28. Lo mismo. 28, que es C. Así los alineamos. Debería estar aquí. Entonces no necesito uno ahora mismo. Y por ahora, la opacidad, Es muy ligero. Puede usar este. Y no debe ser audaz. Debe ser producto regular hasta el título del libro. Todo es 16. Por lo que sólo voy a cambiar selecto todo. Y 16. Mal. Lo mismo. Turno selecto 16 bots. Regular. ¿ Qué pasa con este turno seleccionar tal vez un turno, seleccionar turnos y no funciona. Ahora mismo tienes que mantener pulsado el control y hacer clic para entrar. Ahora enfriado Shift y seleccione. Entonces podemos cambiar el fondo. Por lo que sólo vamos a cambiar seleccionar y copiar esto para quedarnos dentro. Esto suprimió. Seleccione esta eliminada. Aquí caramelos. Cambia el color amarillo para el tipo. Lo mismo debe ser 14. Esto debe ser 14. Bajo. Debería bajar probablemente. Sólo voy a usar uno de estos y sólo traerlo aquí. Pero no este. Cambiamos esto por otra cosa. La visión, copiar, hacer doble clic, pegarlo aquí, y ponerlo aquí. Porque quieres saber lo que la gente está diciendo. ¿ Cuál es la tarifa? ¿David? El color debe ser este color probablemente es algún informe de texto. El abuso debe ser de 14. Incluso yo estoy pensando 12. Es de un color. Y baje esto y borre éste. Impresionante. Me encanta. Me encanta, Es hermoso. A lo mejor esta muy ligera. Seleccione el estado predeterminado del códec, seleccione esto. Y veamos si eso realmente funciona. Porque cambiamos algo de esto. Entonces si estoy en default, es estado. Si voy al prototipo, éste. Bonito. Toma fuera seleccionado paso dos. Si hago clic en, así que algo es, hay un problema. Por lo que este color debe ser, si hago clic en esto, seleccione este color y asegúrese de que nuestro como el mismo que este, pero no audaz, regular. Seleccione este. Hazlo audaz y cambia el color al color principal. Ahora creo que va a estar bien, sólo el prototipo. Al hacer click en este doble clic aquí, y tenemos que elegir el estado por defecto. A ver si funciona. Tronco de modo prioritario. Este, la transición, debería ser un auto animado. Echemos un vistazo a esto. Veamos que el defecto es éste. Nosotros lo ponemos en seis está en facilidad fuera. El exterior seleccione de nuevo, estado a éste. Haga clic en seis y usando estos fuera. Por lo que tiene que ser una animación para trabajar. Tan hermoso, impresionante. En el medio, tenemos unas líneas azules. Arrastra esto hacia abajo. Ahora, aquí, por defecto, no quiero perder nada. Aquí tienes. Desagrupar componentes. Desagrupar componente. Entonces tenemos dos de estos. A ver si podemos arreglarlo. Entonces selecciona esto. Y sobre todo tenemos que seleccionar esto primero. Se trata de un grupo. Este es un grupo también. Entonces esto es un grupo y eso es todo. Por lo tanto, asegúrate de que éste sea de grupo. Y luego en esta parte superior a ella. Ahora yo también, sólo voy a volver a G para agruparlo, hacer un componente. Entonces este es un estado por defecto. Por lo que ambos default va a ser éste. Pero al minuto le agrego un signo más estado más nuevo y un estado para ver qué va. Entonces esto es lo que tenemos. Selecciona esto, ven aquí. Debe ser audaz, color. Este, gris y regular. ¿ Verdad? Pero éste, sólo voy a rastrear esto. El opacidad. Por lo que el cliente no necesito que se borre el top. Sólo éste. Levántalo, tráelo aquí para que parezca profesional. Entonces cuando estés en defecto, estado 2, y tenemos éste, presiona Control X. Así que estamos dentro de esta caja, ¿verdad? Control de Comando V. Y esto va a ser estado a estado por defecto, estado a estado por defecto y estado a escribir dado estado por defecto. Tenemos que volver a hacer la animación, Porter muy rápidamente. Si hago clic en opinión de clientes, haga doble clic, va a ser de 0 a 18 es un IN OUT seis segundos. La mesa de trabajo debe ser estatal al exterior. Vuelve a seleccionar esto. Si soy una herramienta inmobiliaria y hago click en los detalles del producto, haga doble clic. Se va a elegir el estado por defecto. Lo mismo, estado por defecto. Sólo vamos a revisarlo. Bonito. Entonces antes de libros relacionados, sólo va a escribir y buscar relacionados, sólo va a copiar lo mismo y traerlo aquí. A ver si lo puedes igualar. 24. Necesito agregar una línea aquí. Al final de esto. Para este último. Debe ser de este color y bajar la opacidad. ¿ Verdad? Echa un vistazo a esto. A lo mejor puedo traerlo aquí. Lo mismo. Libros relacionados. De verdad quiero usar este, ver si puedo hacerlo y agruparlo, arrástrelo. Recortado para ver lo que tenemos aquí. ¿ Hay algo que hubieras borrado? ¿Cuáles son estos? ¿ Hace una copia de éste? Ahora, voy a acercarme. Si puedo. Aquí hay mucho espacio. Estado para tener aún mucho espacio. Para volver a seleccionar. Y puedo traer cosas, escuchar cosas de vuelta a aquí. Nuevamente, seleccionó el estado por defecto. Banca cosas aquí, ¿de acuerdo? Es Shift select this one, Control, Shift, Select. Arrástrelo hasta aquí. Me estoy perdiendo esto. Y Control Turno. Bonito. Veamos si fue esto y por defecto, ¿es así, lo siento, busco el estado por defecto y arrastra esto hacia abajo. Esto es bueno. Voy a aguantar el turno y hacer esto más pequeño lo que pueda. Está bien. Veamos si se ha cambiado el tamaño. Yo quiero mantener la talla 12. rebaja debe ser la bonita historia de nivel estrella. Este debe ser 11 o 10. Y 10. Esto es disparando, y eso es todo. Yo quiero asegurarme de que sea Repetir Grid. Está bien. Y es anuncio para esto. Sube la portada del libro. Shift, haga clic en Seleccionar más Comando o Control S para guardar todo el diseño. Entonces en este, probablemente lo indiqué de esta manera. Yo le estoy agregando uno e incluso hago uno más. Entonces solo voy a venir aquí, arrastra esto a la izquierda si se descompone. Levanta todo, y alinéelos. Impresionante y hermoso. Me encanta. Entonces este es el estado uno, estado dos aquí. También podemos poner algo llamado agregar más o ver todas las reseñas. Sólo voy a arrastrarlo aquí. Haga clic derecho, desagrupe el componente. Elimina este C, divídalo aquí. Y busco esta flecha otra vez. Es muy útil. En todas partes. Esto debería ser gris y también tal vez la plaza. Y pongámoslo aquí. Hágalo blanco. Mi Control G para agruparlo. Consulta todas las reseñas. Y aquí vamos. Quiero volver a poner aquí lo popular. No hay recomendación. Estaba ahí. Para esta recomendación, voy a usar estos. Todos estamos aquí. Entonces todo está en el espacio correcto. Selecciónelo, arrástrelo hacia arriba. Vamos a comprobarlo. Controlado entero. Todo es bonito, legible. Trabajando Libros Relacionados totalmente alineados, compartir como detalle de producto, revisión de clientes. Y tienes las críticas populares de CR, vista popular, y eso es todo. Por lo que aquí agregamos esto al carrito. Entonces hay que ir para agregar a la sección de corte. Pero ahora mismo, vamos a ver. 68. Diseña la vista web móvil de una sola página: Llamemos a esto de una sola página. Y ahora mismo vas por una vista web o móvil de este musculoso. Seleccione esta retención en Alt y Shift y arrástrela, colóquela en el lado derecho. Vamos a entrar. Se va a copiar esta vista móvil de una sola página. Mantén esto. También tenemos que quedarnos con éste. Voy a quitar estos dos. Seleccione y arrastre esto, arrástrelo aquí. Este control entrar. Para revisar un poco estos. En una página tengo este anuncio puede cubrir, puede cambiar la tapa dura, PDF. Y muy, muy cool. Déjame conseguir el contrato. Entonces un poco. Pero también tienen dos cosas. Yo sólo lo voy a poner aquí. Ya tengo esto antes para diferentes diseños. Yo sólo voy a traerlo aquí, sumar aquí también. Y también yo sólo los voy a agregar aquí también. Entonces esto va a ser aquí o aquí. 20 por ciento de descuento banco de difusión en stock. Todo se ve perfecto y tienen un semestre. Entonces voy a usar el mismo método, lo mismo aquí en mi diseño. Porque esta es una sola página. Tienes que explicar si este libro es, estoy tratando de hacer que esto se alinee con esto, si es posible. Bonito. Arrastre esto hacia la derecha. ¿ Qué tal en stock? ¿ Podemos hacer eso por todo lo posible? Ahora, ¿qué pasa con estos tipos? Arriesga y arrástrelo y suéltelo aquí. Así que el estado predeterminado, selecciona esto, ponlo un poco aquí, y allá, solo ve el tamaño. Porque es más fácil jugar afuera a mi lado aquí. Entonces esto es lo que tenemos. Entonces tengo que poner todo dentro. Ahora. Sólo voy a poner y arrastrar esto aquí y hacer clic derecho sobre él. Tráelo al frente. Primero, solo voy a tratar de arreglarlo aquí. Entonces. Entonces cuál debería ser éste 14. Aquí vamos. Voy a arrastrar esto aquí. Hazlo un poco más pequeño. Yo sólo puedo arrastrarlo, ponerlo aquí. Y aquí vamos. Producto. Contamos con cliente 14. Si eres largo Controlar y hacer clic y mantener presionado Alt y Shift y arrástralo hacia la derecha. Yo puedo alinear esto. Scanright. ¿Qué va a pasar? No lo necesito. Entonces esto se va a centralizar. Y luego nos restaremos para alinearlo. Lo es. Ahora. Seleccionar todo, seleccionar, Controlar, seleccionar. Lo que voy a hacer es ponerlo aquí 14 e interactuar esto todo. Voy a tratar de hacer este sushi. A lo mejor 16, 16. 16, 16. Porque el margen sostiene. Porque necesito encontrar la manera de encajarlos, de una manera que todos estén alineados con esto. Y esto no tendría sentido. Por lo que el exterior hace doble clic en esto. El de cualquiera es 10, 10, 10. Está bien, me encanta. Esto es genial en realidad. Entonces solo voy a quitar uno de estos, controlar seleccionar y eliminar. Ahora, está bien. Seleccionado, ponlo aquí, haga clic en esto, arrastre esto hacia abajo. Ahora, si voy al estado 2, Volvamos aquí. Éste y éste, y éste. Copiarlo. Quédate para pegar, borra este, borra éste, borra éste. Directivas una amplitud aquí. Seleccionarlos, arrástrelos todos y ponerlos dentro. Y las líneas deben seleccionar. Desplácese hacia arriba. A lo mejor sólo puedo poner tres de esto. Aquí. Yo voy. Déjame tratar de ver si todo está bien. Hacer click aquí, Shift select. Nuevamente, 1, 2, 3, 4, seleccione, haga doble clic y pegue. Por lo que por defecto un estado al estado 2. Esto debería ir a la derecha. Está bien, di dos. Porque va a ser audaz. Esto va a ser un 0. Y veamos si lo que hemos hecho es trabajar. Está bien, arrastrémoslo y soltémoslo aquí. Tan agradable. Sre es Control, Enter. Echa un vistazo a esto. De todos modos, esto va a causar un tipo. Si hago clic en esto, así que pasa algo por problema. Si voy al estado 2 y hago clic en producto, ese era Lee aquí, tengo que elegir el destino y ponerlo por defecto, el estado en él. Para el lujo, el detalle del producto, revisión del cliente, el amor , y algo aquí. Entonces tengo que arreglar esto va a ser parte del diseño. Y aquí vamos. Ahora bien, sí tenemos relacionada con la deuda. A ver si puedo convertirlo en un carrusel como este. Arrastra todo hacia arriba. Evento aquí. Y éste parece explicación. Está bien, chico. Céntricos ish. Rastrearlo. Todo debe hacerla hermosa. Y va a funcionar. También. Yo sí tengo estos populares también. Lo mismo. Vamos a arrastrar esto hacia arriba. Easy-peasy. Control, entra a revisar estos. Cómics, Libro Verde, todo en el lugar correcto. Me encanta, además de que algo falta aquí. Esto debería venir aquí una vez más. Entonces en animación, arreglamos todo esto porque tenemos que animar todo esto también. Todos ustedes al carrito. Muy bien hecho. Algunos populares. Está bien. Por lo que ahora es el momento de quitar este. No lo necesito. Seleccionar, Mayús, seleccionar arrastrar hacia la izquierda. ¿ Cuál es el siguiente? Deberían ser mis tarjetas ahora mismo es el momento de diseñar. 69. Diseña la página de mi tarjeta: Muy bien, Ahora es el momento de crearlos. Mi tarjeta pitch, solo selecciónela Comando o Control C para copiarla. Ven aquí abajo, selecciona esta rueda de comando o control. Vamos a controlar y hacer clic en Alt Shift y arrastrar éste hacia la derecha. Vamos a usar esto. Este lo va a borrar. Selecciona esto probablemente solo voy a usar todo esto. Entonces éste de arriba debería estar aquí. Hazlo muy pequeño. Yo quiero este. Control de comandos C. Seleccione el superior, coma Control V, y arrástrelo hacia abajo. Bonito. Aquí debería estar mi cursor. Está bien, seleccionado. Ve aquí, selecciona éste, baja la opacidad. Aquí. Me gusta. Seleccionar toda esta medida es de 14 bolas. Eso es todo. Por la cantidad. Tenemos que sumar éste. Asegúrate de que este grupo, ¿puedo controlar G? Este ya está en cartulina. Arrastre esto aquí. El precio debe ser de $40. Nuestra línea, este Alt Shift, arrástrela hacia la derecha, y eso es todo. También necesitamos los botes de basura. Entonces las personas que no quieren cambiar de opinión, también pueden más pequeñas. Cambia un poco más pequeño y cambia el color a gris claro. Y eso es todo. Todo. Asegúrate de que es el centro de esto y arrástralo bien hacia abajo. Y eso es una gracia. Y SELEX y arrastre la línea. Asegúrate de que la línea sea muy ligera. Seleccionarlo todo, subirlo un poco, una cuadrícula de bits, arrástrelo hacia abajo. Asegúrate de que esto va a igualar. Bonito. Es bueno cubrir algunos de los cool aquí que te gusta activarlos interrumpirlos aquí. Siguiente. Entonces Hagamos estos dos. Y también soy Control seleccionando dos. Esto va a ser 80. Va a ser de 20 dólares. ¿ Todo bien? Pueden ser más 20 voltios. Este va a entrar y seleccionar esta parte. Probablemente 16 o 14 voltios. Estoy pensando en 16 vida. Por lo que todos los seleccionan estos y éstos pueden conseguir, obtener flechas. Yo sólo voy a alinear esto. Este va a ser el subtotal. $240. Arrastre esto hacia abajo. En busca de subdural, regresa, retiro L para bloquearlo. Y trae todo esto aquí, llamado Shift. Arrástralo. Todo esto. Selecciona esto, haz que el borde morado y rastrea éste y éste aquí a la izquierda. Tenemos Coupang pesado. Y esto es todo. Esto, de nuevo, déjalo aquí. Seleccione esta opción con el botón derecho y desagrupar componente. Entonces esto es lo que hacemos. Tu código, copia Control-V. Entonces esto va a ser 14. Esta va a ser la frontera y esto va a ser blanco. Aquí va a producir. Pero el color debe ser gris muy claro. Y sólo éste sube un cupón, tal vez 16 estaría bien. Para que puedan arrastrar esto, seleccionar, arrastrarlo hacia la derecha. Si puedo, sólo puedo ponerlo aquí. Me encanta. Y vamos a rastrear esto. Entonces toma mi tarjeta y vamos a guardarla primer comando o Control S para salvar todo el proyecto. Ahora, haga clic en mi tarjeta. Control o Comando Retorno. Todo está en el lugar correcto. Demasiado fácil si tienes mucha brecha aquí. Volvamos atrás. ¿Puedo controlar? Seleccionarlo todo, arrástrelo hacia arriba y bloquearlo así. Bonita cantidad. Perfecto. Ahora mismo hemos terminado mi carrito. Me encantó. Vamos a crear la vista móvil de mi carrito. 70. Diseña mi página web de tarjetas: Muy bien, ahora vamos a crear la vista móvil. Arrastre éste hacia la derecha. No necesitamos éste. Seleccione ambos, arrástrelos hacia la izquierda. Entonces voy a quitar todo a la cima. Nada. Déjenme darle un poco más pequeño. S1. Es bueno sin embargo. Por lo que podemos sumar y plus como le llamó precio. Y cada vez que traigo esto a la izquierda. El genial de esto, si no necesitamos éste en realidad en medida móvil. El chulo de esto sólo va a arrastrar esto hacia arriba. Veamos el subtotal en la parte superior. Enmendado. Vela esta. Sí, hace calor. Por lo que vengo a la página de mi carrito. Veo este subtotal. Este es un rendimiento móvil, por lo que estará bien. Voltémoslo graduado y lo defraudemos. Asegúrate de que esto sea 14. Agradable. Desagrupar. Desagrupa, no lo desagrupe. Ahora, solo agreguemos aquí algunas de estas bellas imágenes. Entonces puedes desagruparlos. Para que puedas ir a, así que esto van a ser dos. Esto va a estar bien. Y yo sólo voy a arrastrar este y nivel policial. Entonces veamos qué podemos hacer con esto. Arrástralo hacia arriba. Algunos abajo. ¿ Puedo controlar como la Luckett? Entonces este es mi contrato con suerte, éste también. Arrastra y suelta esto aquí. Está bien. Hacemos algo como esto. Tengo un código de cupón. Ponlo aquí, ¿verdad? Trata de hacer algo como esto. Ahora vamos a asegurarnos de que está en el centro lo mismo que esto. Seleccionar todo. Vuelve. Te dije que lo agruparas Alt, arrástrelo aquí es una línea. Coincidir, arrastrar todo hacia la izquierda hasta que el alinear esto con esto, alinear esto con éste, y recogerlo. Siguiente. Simplemente todo debe ser 14, Esa es la línea. Arrástralo hacia la izquierda. Este debería ser de 20, supongo. Hermosa. Y todos estos deberían ser 16 o tal vez menos, 14. Esto es bueno. Continuar debe ser de 14 o incluso de color más claro. Y es el pago. Y yo estoy bien para ir. Arreglemos este. Otra vez. Seleccionado, subirlo. Por lo que esa sola página ya es mi tarjeta móvil vista y guárdala. Y vamos a comprobarlo. Muy bien, podemos ver el subtotal anterior. Por lo que el NAD plus puede eliminar. Belleza son algunos tienen un código de cupón aquí. Y eso es todo. ¿ Y si alineo esto con esta pierna izquierda? Comprueba lo que sería mejor. Al igual que 23, alineado a la izquierda. A ver. Yo no lo creo. Control de Comando Z para volver atrás. Pero se puede hacer algo para mejorarlo. Alineado el último sobre este y, así. Ahora tiene sentido. Gíralo aquí para que pueda verlo mejor. Ahora me encanta. Un código de cupón es enorme, ¿verdad? Entonces tal vez 14. Yo lo recuerdo. Veamos que otra vez, subtotales móviles, hay 40. Muy bien, ahora me gusta diseñar. Continuar comprando y e-book y el pie de página. Está bien, tenemos el miocardio o valor. Veamos de qué más nos reímos diseñando. Entonces tenemos mucha lista cool del enemigo que estoy realmente emocionado por la parte de animación. Y ahora vamos a crear la forma. 71. Diseña la página de seguimiento de envíos: Ahora vamos por el diseño de seguimiento de envíos. Yo sólo voy a copiar esto y traerlo aquí abajo. Seleccione este comando control V para copiar estos. Y otra vez, selecciona esto, mi tarjeta. Yo jefe, arrástralo a la derecha. Voy a eliminar esto primero y luego se desbloquearía la corriente. Voy a hacer clic derecho y desagrupar. Este puede ser el caso. 24 ahora, podemos simplemente bien, solo voy a arrastrar esto hacia abajo por ahora. Copiarlo solo es como diseñar. A lo mejor. Yo solo cambio de color. Y creo que todos son pequeños. Agradable. Arrástralo aquí. Ey aquí. Hagámoslos todos iguales y turnos seleccionando luego lo turna. Aquí vas a títulos. Hagámoslo. Por ahora. 14. Subiremos aquí, envío, envío. Ahora, selecciona todos estos. Estoy tratando de llegar a esta idea para hacer esto amarillento. Si no funciona, necesita su frontera y tengo que hacerlo de esta manera. Entonces, ¿qué pasa con el término que ya tenemos es control de copia seleccionar doble clic Control V. Así que va a quedar así. Esta rosa. Y a veces está colgando otra cosa. Y luego haga clic. Esta herramienta MOOC aunque no sería problema. Suprímate esto. Trae tu paquete es totalmente entrega, está fuera para entrega. Y aquí vamos. Y hoy nos derivamos por ceros. O incluso filas. Debe ser gris. Repita Grid, baja esto, asegúrate de que ocho iguales en tamaño. Busco misma foto de las mismas fotos. Entonces cuando los animamos a todos para que sean iguales y el CIO se preocupe. Está bien. Son iguales. Ahora vamos a bajar esto. Sería el mismo diseño probablemente. Por lo que sólo voy a seleccionar. Estas cosas de aquí abajo pueden ser del agrado. Estos rubros, cinco área explicada. Está bien. Y es copia uno de estos. Ponlo aquí. Seguimiento de envíos. Y aquí vamos. Esto debe estar fuera para entrega, entrega. Entonces debería cue rutina, debería ser 14. Lo mismo que yo bajé. Y hacer esto uno puede ser 16. A ver, o incluso éste. Copiar, pegar. Volvamos atrás. Pegar, seguimiento Chapin, control, rastreo inter ocular hacia fuera para artículos de entrega. Detalles de seguimiento. Poeta. Yo llamo algo que falta aquí. Entonces algo que podemos hacer aquí es seleccionar estos y hacer lo mismo. Haz que entre dentro. Seleccione estos, mantenga presionada Alt u Opción, arrastre esto hacia abajo. Si estos dos están en el mismo color, ahora, lo hicieron del mismo color. Y éste debería ir por aquí. Seleccionar es Alt u Opción, arrastre esto hacia abajo. Entonces ahora tiene más sentido. Control o Comando Retorno. Eso son, así que estos dos deberían ser, solo voy a hacer esto y arrastrar esto hacia arriba. Muy bien, alineados. Y luego hacer un motor diesel creció con él. Seleccionar controles. Claro, esta está seleccionada Zona de control. Y eso es todo. Vamos a comprobarlo. Entonces la belleza, la justicia debe ser 8080, dos artículos. Por lo que no lo olvidamos para animación. Entonces intenta que todo tenga sentido. Ahí hay menú, animar esto y la gente dice, Lo que pasó, fue cuarenta fue 80. Por lo que no siempre diferente paciente y un diseño y quieren ver algo real, sobre todo en animación. Por lo que tenemos dos artículos AT. Entonces puedo Control S? Y vamos por la vista móvil de esto. 72. Diseña la página de seguimiento de envíos: vista web de la página web de seguimiento de envíos: Muy bien, Vayamos por la vista móvil del seguimiento de envíos. No necesitamos éste. Seleccionar es arrastrar esto hacia el lado izquierdo es móvil. Te Alt y Shift al mismo tiempo y eliminas todo aquí. E incluso la cerradura. Entonces de nuevo va a ser muy rápido. Copia esto, pegarlo aquí. Arrastra un poco esto hacia abajo. Control Entrar. Por lo que puedo tener por deber hombres muy asociados. Está bien. Hace frío y muy sencillo y cogerlo. ¿ Verdad? Yo sólo voy a salvar este Comando o Control S. Vamos a ver ¿qué más tenemos? Ahora diseñemos la página Acerca de Nosotros. 73. Diseña la página de la página sobre nosotros: Ahora vamos a diseñar página para mi Control C. Ven aquí. Vamos a la primera vez. Arrastra y mantén pulsado, cambia la página principal. Porque vamos igual. Mira probablemente. Entonces mantenemos esto aquí arriba. No necesitamos nada. A lo mejor podemos dejarlos aquí por ahora. Entonces ¿puedo controlar eso? Utilizamos un video muy increíble aquí? Entonces esto va a ser, también he hecho el resto muy rápido para que pueda jugar. Entonces debería ser así. Historia. Simplemente fija estilo de carácter a cualquier misión. Sólo hay que arreglar esto. 1624. Demasiado tamaño 20 de esto. Hola. Por lo que podemos agregar más texto. A menos que tengan al editor. Y comprador. 16 probablemente debería ser 8, 24. Este debe tener 28 años, esto es 14. Distrito es 14. Este va a ser éste y éste debe tener 28. Esto, esto, esto debería ser de 16 voltios hora. Tienen este derecho. Se lo va a borrar. Y volvamos aquí porque ya hemos diseñado esto. Entonces nadie que lo vuelva a hacer. Arrástralo hacia abajo. Este. Bueno, eso probablemente sólo voy a usar esto. En lugar de esto, conseguimos que este enorme vaya a poner esto en práctica en la parte superior de esta suscripción. Está bien, y así terminó conectado para cambiar ese diseño. Y aquí vamos. A ver. Entonces si algo sucedió así, ya sabes, cuando mueves estos hacia arriba, todo se mueve porque es de tamaño responsivamente. Por lo tanto, asegúrese de que 10 de control sobre T MOOC o emisión. Entonces esto es debería, deberíamos cambiar estos colores, 1, 2, y 3 de esto. Este amarillo. Este amarillo. Esto. Asegúrese de que nuestra estancia principal Connor, proporcione oro rosa. Pollo para ubicación. Bonito. Todo está en el lugar correcto. Arriba un poco demasiado pequeño para el encabezado. Probablemente tengamos que hacerlo audaz y blanco. Por lo que la brecha entre ellos debe ser de 26, probablemente seis horas. Hacerlos centralizados. Vamos a revisarlos. Se va a llamar a esto Acerca de Nosotros. Tarjeta dibujada en S3. Está bien, todo está perfecto. Vamos a cerrar eso. Vamos por el móvil. Si no necesitamos éste, arrastra esto aquí y tráelo aquí. Entonces ya hice la vista móvil para ustedes porque es fácil. Y sólo copiarlo aquí. Porque entonces Va a ser sobre nosotros el trato móvil. Porque ahora podemos ir por la animación. Sólo vamos a guardar esto. Y es hora de la creación de prototipos y animación. Nuestro trabajo. 74. Añadir video a la Header usa la animación Lottie en Adobe XD: Por último, estamos en partes de animación. Vamos a jugar a esto. Esto es lo que estamos tratando de hacer. Vamos a añadir un video a la pancarta o a una bandera de héroe. Entonces si vengo aquí y doy clic en este libro, veo un volteo de tarjetas. ¿ Verdad? Entonces si añado al carrito, si un efecto depresor click va a cambiar el add to cart. Y entonces tenemos mucha animación. Y también éste va a aparecer aquí. Vuelve a revisar esto en el auto. Mucha de la animación y la que está apareciendo aquí. Volvamos atrás. Muy bien, hermosa. Veamos cómo podemos diseñar esto. Y eso apagado. Y sólo voy a imprimir uno de estos aquí. Y te mostraré la animación adecuada. En primer lugar, selecciono el fondo, me aseguro de que esta sea una activa la transformación 3D por ahora. Seleccione el fondo. Acude a tu expediente, los videos. Tenemos tres video aquí. Edité esto y lo corté en Adobe Premier Pro. Se convirtió en éste, pero el tamaño del archivo era de 25 megabyte. El problema es que el tamaño del archivo es enorme, son 25 millones. Adobe XD está aceptando menos de 15 megapíxeles. Por lo que estoy usando una aplicación llamada bolso. Estoy arrastrando y soltando estos dos. Es aplicación, es gratis. Simplemente busca en Google freno de mano, arrastra y suelta esto. Se puede ir al modo video y bajar la calidad es de menor calidad. Entonces asegúrate de que esto va a ser M p cuatro. Así que guárdelo como un MP4. Tienes que hacerlo a mano. Por lo que sólo tienes que teclearlo MP4 y hacer clic en Código de inicio, darle una ubicación puede ser dislocación y empezar a codificar. Después de codificar, tienes algo como este ocho megabyte y lo tienes, arrastra y suelta al fondo. Ahora si hago doble clic en él, entro. Ya ves aquí estoy en rectángulo. Todavía no hay nada activo aquí. Asegúrate de hacer clic en este ícono, el ícono de juego. Entonces ves que este panel de video está activado. Asegúrate de que esto esté desenchufado automáticamente. También puedo reproducir el video. Puedo decirle por dónde empezar ahora mismo. Si hago clic aquí y jugado va a empezar desde aquí. Pero si vuelvo a hacer clic en él, asegúrate de dar click en este pequeño ícono aquí. Con el ícono de juego sobre él. Play automáticamente click en este panel y a la izquierda, puedes elegir tu propio tiempo cerca de ascensor que tengas, o simplemente podemos usar lo que esté en tu video. Entonces. Y sobre el audio, lo voy a silenciar. Este embellecedor. Si hago clic en él, puedo recortarlo. Puedo decir empezar desde aquí, empezar en segundo lugar. Y también quiero ser igual que aquí para poder recortarlo. Puedo decir que sea como hasta aquí, el 15 segundos. Entonces OK. Haga clic fuera. Ahora puedo jugarlo seleccionado y jugarlo partiendo de aquí va a ser de 15 segundos. Yo también, puedo ponerlo en un bucle, lo cual no hice por ahora. Si hago clic aquí, Reproducción en bucle, puede activarlo. Entonces va a ser loop para siempre, pero no queremos eso por ahora. Pero si quieres, puedes ponerlo debajo. Entonces así fue como puedes agregar un video a tu banner fácilmente en Adobe XD. Está bien, ahora vamos por la segunda animación. Esto va a ser muy interesante. Esto va a ser un volteo de tarjetas. Entonces esto va a ser frente, va a llamar a este frente para prensa Comando o Control. D va a copiar algo por encima, lo mismo. Entonces creo que algo le falta pieza puede arrastrar esto a por año. Seleccionado de nuevo. Entonces esto va a ser frente, esto va a estar de vuelta, ¿verdad? Así que apaga el frente por ahora. Pero antes de eso, selecciónelos a ambos y presione comando o control G para agruparlos. Yo sólo voy a llamar a esto Flipkart. Flipkart, tenemos al fondo y al frente. El frente debe ser altura, ahora mismo. Mira esto, hago clic en él y es difícil vender la espalda. Asegúrate de dar click en Rellenar y traerlo de vuelta a este ancho, va a ser blanco. Y aquí lo que tenemos que hacer. Y esto va a copiar estos tres copiados. Seleccione afuera, así y péguelo aquí. Yo sólo voy a arrastrarlo arriba por encima de él. Y esta línea de texto copiado aquí. Aquí vamos. Centralizarlo hacia abajo. También necesito estos, copia, esto, esto, y esta copia. Tan como afuera. Entonces ven aquí y pégalos aquí. Entonces esto es exactamente lo que queremos. Por lo tanto, selecciona esto de nuevo. Si flipkart, asegúrate de estar dentro. Y solo voy a bloquear este comando Control L. Así que bloqueé el fondo para que pueda simplemente seleccionar todo aquí y definitivamente tarjeta ¿verdad? Control de mando G para agruparlo. Entonces todo es un grupo y ver qué pasa. Entonces el Flipkart, deberías salir afuera. Echa un vistazo. El Flipkart está afuera. Este grupo debería ir dentro de esto, e incluso la bolsa debe venir aquí. Entonces lo cambié todo. Entonces el Flipkart, hay un grupo dentro. Este es el grupo dentro de la Flipkart ya tiene, sólo voy a llamar a esto de vuelta. Entonces nada realmente especial entonces que en la parte delantera y trasera, la parte trasera está justo dentro de esta tarjeta flip. Eso es todo lo que hice. Entonces están de nuevo. Y luego sumar. Perfecto. Hagámoslo una copia, sostenga Alt y Shift y arrástrelo a los derechos para la animación. Después de llegar a la segunda, selecciónelas, active esta animación 3D y rote ésta. Si roté, se va a girar. Flipkart está presionando Comando o Control Z. Ábrelo, selecciona solo el frente, luego gíralo 90 grados, predecirá la mano de APUESTA 90. Está bien. Eso es todo. Seleccionar fuera. Ven aquí. Diez, el frente fuera por ahora, que puedan volver atrás. Si este es el frente que va por ahí, éste debería ir por aquí. Esto va a ser 90 desde el ángulo recto. Ahora, asegúrate de que esto esté activo. Haga click en Flipkart. Y veamos si podemos animar esto. Vayamos al prototipo. Arrastre esto hacia la derecha. Va a ser tabulador, ir a animar, facilidad de entrada, facilidad de salida. Eso es una facilidad fuera. Y Eurasia es de seis segundos estaría bien. También selecciona este, arrastra esto hasta aquí. Lo mismo se va a aplicar una ficha o a animar está en su fuera seis segundos. Veamos qué hemos hecho. Seleccione este. Plato. Silicio. Es bonito, bonito. También podemos hacer algunos tuits, algo así como éste. Vuelve a Diseño, selecciona estos, asegúrate de que el frente esté apagado en este momento. Vete a atrás. Tráelo de vuelta a 0 por ahora. Vayamos adentro. Ahora, selecciona este. Simplemente apágalo cuando seleccione esto y arrástrelo hacia arriba. Arrastra esto hacia arriba. hecho es la izquierda, arrastra esto hacia la derecha, arrastra esto un poco hacia abajo, y eso es todo. Trata de no salir porque la cancha de volteo, si sales va a estar rezagada en base a tu computadora. Simplemente voy a seleccionar esto. Después en seleccionar la parte posterior, activar, estos son 90. Nuevamente, seleccione la placa de inicio. Veamos qué hemos hecho. Seleccionar. Agradable. Tan realmente obvio que lo somos, pero esto es un poco significa que algo se está moviendo en segundo plano. Y eso lo hace más interesante. O si quieres hacerlo más interesante. Frente, fuera de la parte trasera, seque la espalda, asegúrate de que sea 0. Sólo puedo arrastrar esto a la izquierda, a la derecha. Por lo que podemos ver un poco de animación cool. Y 90, encienda eso. Vamos a jugar de nuevo. Entonces así como lo haces eliminado jugar con él y ves que algo se está moviendo hacia atrás. Y eso es hacerlo más natural e interesante. Siguiente parte es si alguien Agregar al carrito, ¿Qué pasa si presiono esto? Tenemos que añadir algo llamado animación Lottie para esta parte. Vamos a la página web, latae files.com. Entonces escribes aquí carrito de compras. Esto es algo que estamos tratando de usar. Si hago click en esto, tengo esta animación. Simplemente puedo descargar la latae JSON, pero en este momento tengo un problema. El color de esta capa es negro. Yo quiero ser mi color principal. Por lo que vengo a editar estas capas. Si hago clic en eso, puedo venir aquí y cambiar este color. Volvamos a mi diseño. Uno de estos colores, solo voy a copiar, esta fue mi copia principal en color. Seleccionar fuera. Volvamos a la página web. Vamos a dar click en él. Esto va a aparecer y simplemente pegarlo aquí y actualizarlo. Si lo actualizo, ya ves lo que va a pasar. Y actualizas que intentaron actualizar también toda la imagen, toda la animación. Ahora, haz click en este pequeño ícono aquí para que solo puedas descargar el archivo JSON y lo descargues. Ya lo he puesto aquí en archivos. El latae, el de Jason, y el carrito de compras. Volvamos atrás. Vamos aquí a la segunda parte lo va a traer aquí porque estos archivos JSON son enormes. Ver es tan grande y no se ve ningún día 10 de cada 10 la animación 3D de mantener pulsado Shift para hacerlo más pequeño. El problema es que no vemos el tamaño. Entonces tenemos que adivinarlo y tenemos que jugar alrededor y turno largo y estoy tratando de ponerlo en el lugar correcto. En realidad. Lo dejo aquí para que siempre pueda ver si vengo aquí seleccionado, podemos seleccionar la C, poner mi ratón aquí para que vea, sé que está aquí. Por lo tanto, haga doble clic en esto, haga clic derecho y desagrupe en el componente. Intentamos volver a hacer el componente, por lo que Shift selecciona todos ellos y haz clic en este signo más. Otra vez. Vuelve a dar click en el signo más y en tus estados. Estamos en un estado 2. Significa que esto tiene que cambiar a, por ejemplo, este color agregado al carrito. Esto va a la izquierda y también desaparece la opacidad 0. Esto va a entrar. El centro. fondo debe ser blanco, el borde debe ser morado. Muy bien, genial. Y aquí tengo que añadir esto a esta declaración. Tan seleccionado Comando o Control X. Estás en este estado, ¿verdad? Seleccionar en él. Estamos en un estado para hacer doble clic, para entrar, luego presionar Command o Control V para pegarlo y para copiarlo aquí, solo voy a arrastrarlo y ponerlo aquí. Y lo hará un poco más pequeño. Manteniendo Shift, hazlo un poco más pequeño. Aquí. Un poco tal vez con más pequeños. Porque va a ir a la derecha y desaparecer. Entonces estamos en el estado 2 y este es el estado por defecto. Cuando estás en estado predeterminado, si voy al prototipo, haz doble clic en esta pestaña, auto animate. A lo mejor por segundo, elige el destino. El destino debe ser un estado dos. Si estamos en el estado 2, de nuevo, Agregar al carrito tiene que volver al estado por defecto. Elija el estado predeterminado. Volvamos aquí y veamos qué hemos hecho. Plato. Voltea la tarjeta. Hermosa, Agregar al Carrito. Agradable animación. Mira. Otra vez. Mira, es un poco grande. Ética cuadrada. También. Cuando hacemos clic en Agregar al carrito, algo debería venir aquí como un número, algo añadido a la cesta. Por lo que tenemos que demostrar que hay un artículo está en tu canasta. Volvamos aquí. Vayamos al modo de diseño. Vuelve aquí. Nosotros, también podría el defecto indicar dos. Hacemos clic en esto y o almuerzo, lo hacemos un poco más pequeño. Agradable. Entonces cuando estamos en un estado para hacer doble clic en el interior, ve al llamado Alt Shift, drag, algo, algo así. Además, necesito hacer de este púrpura un borde de blanco a y presionar T y escriba 1 aquí, asegúrate de que el color sea blanco. Aquí. Es, debería ser un poco más grande. Está bien, genial. Desplazar seleccionar Control de Cámara G para agruparlo. Ahora estamos en default, state to como derecho. Arrastre esto y suéltelo aquí. Entonces significa, hagamos doble clic y volvamos al estado plegado. Señorita, si hago click en este plato, voltea la tarjeta para ver. Se trata de Jack Dorsey puede ver la revisión. Me encanta este libro. Yo quiero comprarlo. Si hago clic en él, veo la animación también la que va a aparecer aquí. Si no lo quiero, puedo volver. Mira, echa un vistazo aquí y doy clic en él. Está conectado aquí. Y hermosa animación latae. Me encanta. Muy bien, entonces, hasta ahora sabemos agregar el video a Adobe XD. Ya sabes cómo reducir el tamaño del archivo a menos de 15 megabytes. Ahora el auto aleta y también cómo crear un estado componente con animación Lottie en él. Lo que veo es cuando hago click en esto, veo esto detrás de él, ¿verdad? Viene muy rápido. Todavía está disponible eso? Entonces hagamos esto arreglado en realidad. Si hago click en el primero y estoy dentro de parte, el de atrás debe ser 0. Y éste también. Si voy al siguiente , en éste, el carro detrás de él, que es el frente, la opacidad debe ser 0. Ahora bien, si lo toco, sería mucho más pequeño. Y exactamente para ser como voltear cancha, ¿verdad? Tess, es mucho mejor. O que tratemos de hacer esta animación un poco más rápido. Se trata de seis. Si me lo pongo para, esto son seis. Si me lo pongo para, veamos qué pasó ahora. Mira, es mejor. Entonces cuando algo está volteando, trató de hacerlo más rápido para que no veas algo en el medio. ven mucho mejor. Y también estoy pensando que si hago clic en esto y pongo la flexibilización en un chasquido, ¿qué va a pasar? Entonces sólo la prueba. Entonces a veces hay que jugar con él hasta que veas cuál es mejor para ti. A ver. Tan sólo un paso a un lugar. Al final. Mira, es un movimiento de letras. El chasquido es mucho mejor de lo que aumenta la duración del tiempo. Mira, si pongo un ocho, sólo una muestra, veamos qué pasó. Es mucho más pequeño. Pero por voltear, si no quiero ver algo detrás de él, puedo hacerlo más rápido o puedo hacerlo como le toca a ti así que intentas jugar con él. A lo mejor por un segundo, es bueno. Y vamos a ver, cuál es más agradable para ti. Creo que el 4 segundo es bonito. A lo mejor es un poco rápido o depende de tu cliente. Se puede jugar con él. Puedes ponerlo en 6 segundos. 6 segundos. Yo creo. Es bueno ir. Vamos a comprobarlo. A mí me encanta. Me encanta la sensación de ello. Está bien, genial. 75. Crea secciones de tendencia de animación de Hover: Vamos por segunda animación para tendencia, para click aquí y Control Enter. A ver. Por lo que hemos hecho este. Y si me cierto sobre esto para ver qué pasó afuera y colocarme sobre él. A ver qué hermoso es que esto se acerca. Ver algunos textos, ver el Prius y añadir a la acción del carrito. Impresionante. Si no quieres, solo tienes que dar click atrás y salir afuera, mira. ¿ Es un hermoso? Muy bien, veamos cómo podemos crear esto. Probemos con este. Yo podría. Es muy sencillo. Si seleccionas esto, Llamemos a este homer también. Sólo voy a llamar a esta carpeta hover. Entonces probablemente para ustedes deberían ser así. Si es así, ves este mango solo desagrupa la cuadrícula. Si desagrupa la cuadrícula, vas a tener lo mismo. Por lo que cada individuo va a ser una carpeta, que nosotros llamamos a estos más altos también. Ahora, estoy dice click en es como nuestra finca y dar click en ella. Quiero ver lo que hemos hecho y exactamente hacerlo en el mismo lugar. Ahora, ya hemos hecho nada, acaba de seleccionar el hardware a componente clínico. Ahora, haga clic en Signo Plus, y aquí debe estar flotando estado, simplemente lo colocó y déjalo ir. Ahora o control LAN, haga clic para seleccionar la imagen. Arrastra esto hasta aquí. Y vamos a ver. El radio fronteriza es de 10 aquí, el radio fronteriza también debe ser de diez. Después turno selecciona todos estos y arrástralos hacia arriba. Justo a continuación. Ahora selecciona fuera. Yo sólo voy a copiar esto. Copiar estos también. Este árbol. Puedo controlar C directamente aquí, este zoom. Ahora sal Control V y arrástralos hacia abajo y hazlos Centro. Y tratando de alinearlo, este conjunto de Galton. Si queremos ser una línea, en realidad, sólo voy a arrastrar esta aquí para asegurarme de que estoy 100 por ciento alineado. Entonces haz clic en esto y uno hacia abajo, así que para ser perfecto. Y también es preguntarse. Entonces si selecciono este estado de la amina hover, cómo nuestro patrimonio por defecto está animado por sí mismo. Entonces significa que si vuelvo por defecto, el estado, Vamos a nuestra finca y haga doble clic en esta imagen. Así que arrástrelo un poco para que pueda ver mejor ambos ojos. Ahora, de nuevo, seleccionado, volver al predeterminado el estado. Y aquí seleccionados vuelven al valor predeterminado ya que seleccionan su árbol de inicio y el icono de reproducción y animación. Ahora jugémoslo. Bajen al minuto que rondo y esto es lo que estoy viendo. O éste, o éste. Se puede cambiar la duración de esta animación por defecto es esto ha animado. Si vas al prototipo, ves que está animado por sí mismo. Es hover auto animate n es de tres, básicamente tres segundos. Yo sólo voy a tirar de ella como facilidad entrar y pongámoslo en seis segundos. Y veamos la diferencia en realidad. Volvamos a la placa de diseño. Entonces veamos primero este realmente rápido. Ahora éste, es mucho más lento, ¿verdad? Y es rápido. Más lento. Entonces depende totalmente de ti. Sólo les estoy mostrando cuál es la posibilidad es inadecuada. Ver, así que aquí, bastante aquí. Creo que esto es bonito. Y puedes agregar al carrito. Impresionante. Volver atrás y salir fuera es muy rápido. Este es modo diverso, así que no deberíamos gustarnos realmente, Depende totalmente de ti. Muy bien, ahora, hemos hecho la animación muy rápida después de trending. Subiremos a la siguiente parte. 76. Drag animación con grupos desplazados: Muy bien, Vamos a animar el resto de la página. ¿ Qué tenemos aquí? Contamos con esta oferta especial. Chicos. No necesitamos animar todo, así que te recomendamos como si esto estuviera bien. Contamos con una oferta especial. Entonces ahora mismo es una grilla. Yo sólo voy a arrastrarlo aquí. Bonita mezcla. Yo sólo voy a seguir continuando algo como esto. Y haga clic en desplazamiento, desplazamiento grupo ID. Y aquí vamos. ¿ Qué necesita ser un pergamino agrupado? Este necesita desplazar grupo también. Aquí vamos. Arrástrelo hasta aquí, arrástrelo aquí. Por lo que estos van a ser un muy fácil y muy rápido. Aquí lo mismo. Debe ser grupo de desplazamiento también. Aquí vamos. Vamos a comprobarlo. Mira, todo es suave. Esta hermosa. Tienes estas animaciones, esta animación, impresionante, genial. Pueden verlo es esta oferta especial. ¿ Mucho más? También el popular y las Últimas Noticias. Perfecto. Ah, y necesitamos animar esta familia cambiada diseñada a algo más fresco. ¿ Verdad? Volvamos atrás. 77. Sección de estimación de animación en 3D: Esto va a ser, nuestra animación va a ser así. Y volver atrás. Es hermoso. Entonces, ¿qué hacemos aquí? Simplemente voy a bloquear esto y cambiar el diseño. No necesitamos éste. No necesito éste. Yo sólo voy a apaciguar esto. Haga clic derecho y vaya a Francia. Y trae esto aquí. Usa tu tecla de flecha, haz clic con el botón derecho, haz clic derecho y llévala al frente. Entonces, vamos a seleccionarlo. Asegúrate de estar dentro del grupo. Estos dos deberían venir también dentro de este grupo. Por lo que estos dos iconos están fuera. ¿ Verdad? Ahora. Sólo voy a llamar a todo el asunto. Y tú mencionas este. Entonces sólo voy al número uno. Haga clic fuera de nuevo, seleccione es, por lo que este es el número 1. ¿ Puedo controlar litro domesticado, llamar a estos dos Comando o Control D para duplicarlo también. Entonces Va a ser doble clic. Se le va a cambiar el nombre para llamar a este tres. Por lo que 123. Entonces ahora mismo tenemos tres carpetas encima de la otra a qué tenemos que hacer? Es esto exactamente. Así lo hizo tres es la parte superior derecha. Ahora, apaga eso. Ve al número 2 y 10 que fuera también. Entonces estamos en el número dos ahora mismo. Cambia esto para quitarte eso del 3D, para aplicar y aplicar de forma aleatoria en tus rostros. David, Volvamos a lineal. Ahora. Entonces estos son tendones están entrando. Otra vez. Selecciona esta foto, enchufando. Aplicar aleatoriamente. Está bien, genial. Volvamos al año. Ahora. Todos estos están en el mismo lugar y fresco, pero las garrapatas están dentro, tiene un problema. Entonces, ¿qué hacemos aquí es algo así como estos tipos. Número 2, ve al número dos, el nombre derribado. Y también la elipse, la imagen. Bajar la opacidad. Ve al número uno. El nombre, bajar la opacidad, ir a elipse el círculo, bajar la opacidad. Por lo que tenemos a los tres dentro de esta carpeta de animación. Ahora, necesitamos copiar esta carpeta de animación. Se ha borrado y pegarlo dentro de esto. Entonces tenemos la animación dentro de esto. También hay otra copia. Entonces tenemos tres de estos en el número 2, en la página dos. Por lo que estamos llegando a la página 2. Esto va a, voy a estar dentro de esta animación. Selecciona esta parte superior, selecciona esta, gira esta. Y lo que hacemos aquí, sólo voy a dejarlo ir a la izquierda y bajar la opacidad. Ahora, ese era el número dos. Entonces significa que ahora mismo estamos viendo el número 2. Selecciono esto para traer la opacidad. Como vamos a hacer este. Abre eso, selecciona la línea superior, baja la opacidad. No importa. Seleccione un número 2. Vamos adentro. Mira a David, una elipse, saca la opacidad. Estás en esta carpeta ahora mismo. Entonces sólo voy a rotar este también. Arrástrelo hacia la izquierda. Entonces a veces ves que eso está pasando ¿verdad? Así que bloquea el número tres. Número dos. Entonces sólo voy a arrastrarlo a la izquierda. Con mi ratón. Yo sólo puedo rotarlo. Más. Arrastre esto hacia arriba y la opacidad debe rastrearse. Seleccionado, debe ser desbloqueado. El número tres, seleccione el número uno. Vamos dentro de la carpeta. Simplemente voy a traer de vuelta la opacidad. Entonces vemos éste. Entonces esto es lo que va a pasar. Si haces click y esto ver el prototipo de animación va a esta página. Si vuelvo a hacer clic, sólo voy a ir a esta página. Y se auto animar es una facilidad fuera como en segundos. Lo mismo. Esto va a suceder. Aquí se puede ver. Esto va a suceder. Si haces click aquí probablemente sólo voy a volver a este porque sigue. Si haces click aquí, solo voy a volver a este y vamos a ver qué va a pasar. Control de Comando, Entrar. Vamos a bajar. Está bien, vamos a ver. Glick. Bonito, bonito. Volvamos atrás. Volvamos atrás. Impresionante. ¿ Qué hermoso es eso? 78. Animación desmayada: estado componente: Estamos en una página fetal y aquí tengo mucha animación. Y también aquí. Veamos cómo podemos animar estos primeros riesgos. Voy a seleccionarlo, seleccionarlo todo, Control de Comando G para agruparlo. A continuación, haga clic nuevamente en el componente. Y nuevas fincas. Que sea uno. En el estado estadounidense. Tenemos algo como este control, haz click en esto y arrastra esto hacia abajo. Entonces volvamos. Si el estado predeterminado debería ser algo así porque es predeterminado. Al hacer clic en esto, ve a éste. Y tenemos algo como esto. Tenemos calificación, que va a ser de color gris. Aquí. Ocho Tate. También golpeó el control. Dar click en este va a ser reseñas. Por lo que tu búsqueda se va a basar en reseñas y tiendas. Muy bien, entonces cuando hacemos click en esto, esto se va a abrir. Ahora voy a dar click en calificación, a ver qué pasó. Entonces necesito uno nuevo y llamar a esto 2. Entonces el número 2, B, o haciendo clic en una escala de calificación, que significa que todo va a cambiar. Este más nuevo está bajando. Esta calificación va subiendo. Este va a ser de este color. Y el color de calificación, debería cambiar este color. Y también esto se va a respaldar. También, éstos deberían bajar la opacidad. Veamos qué hemos hecho. 123. Ahora vamos a animarlo aquí. Haga doble clic. Si haces click en esto, se va a indicar uno. Por tabbing, yendo al estado 1. Si estamos en el estado uno. Si hacemos click en rating, por tabbing, vamos a decir dos. Afuera. Vuelve aquí. Si estamos en el estado 2, Bye Click y este doble clic, vamos a volver a seguir. Declara otra vez uno. Muy bien, veamos qué hemos hecho. Jugar. Entonces es una calificación. Haga clic en más nuevo con calificación ligando, se acerca la calificación. Hacemos click en esto. No hemos elegido éste. Entonces significa probablemente ser más estados. Volvamos a Diseño. Entonces el predeterminado, el más nuevo, por lo que el número uno se está abriendo, la nueva S está justo ahí. El número dos. Y vamos a seleccionar la calificación va a estar lloviendo. Ahora, necesitamos algo llamado el número tres. número tres es el que cuando hacemos clic en la calificación, todo está volviendo a encenderse. Esto es, ¿puedo bajar? Necesitas volver a elegir el más nuevo, y va a volver al número el predeterminado. Muy bien, Así que nos perdimos un paso. Otra vez por animación. prototipo es cuando hacemos click en él, va al número uno, ¿de acuerdo? Correcto. Nosotros somos el número uno, que es la calificación, va al número dos. Número dos, correcto. Aquí tenemos un número al mismo. Haga click en TS, VG ir al número tres. Está bien. Y estamos en el número 3, damos click en nuevo preguntado. Vuelves al estado caído. Esto es algo que probablemente debería funcionar. Entonces de nuevo, selecciona esto, vuelve al estado de la foto. Haga clic en esta placa. Entonces solo voy a ordenar esto es y calificarlo. Bonito. Haga clic en este más cercano. Impresionante. ¿ Y qué tan genial es eso? Estos están funcionando correctamente. Impresionante. El siguiente animación sería cuando hacemos click en la carga más, ver qué pasó. Todo va abajo y arriba. 79. Animación en categorías - Estado componente: Muy bien, En el lado izquierdo tenemos muchas características, ¿verdad? Animemos esto primero. Voy a duplicar esto, arrástrelo a la derecha. Y aquí. Cuando arrastremos este, sólo voy a traerlo aquí y traerlo aquí también, tal vez 120 o uno o dos. Arrastre esto hacia la derecha. Si hacemos click en este y vamos a verter el tipo y pinchamos sobre éste y lo arrastramos. Esta obra de arte mediante activación debe ser y arrastrar el auto animar, facilitar hacia fuera. Y además, si hago clic en esto y arrastro esto hacia atrás, va a ser y arrastrar y lo mismo. Veamos qué pasó. Bajemos, veamos, arrastramos a la derecha, 100, 10 a 40 en un dos por la magnitud para algunos bellos. Entonces me encanta esto. Cotización. Veamos qué más podemos hacer. Yo busco esto. Recuerda, si hago click en Cargar más, solo voy a traer de vuelta toda esta tecla de flecha. Si podemos cargar más, esto es debe venir y agregarse aquí. Por lo que voy a seleccionar todos estos presione Comando G para agruparlos desde aquí. Por lo que sólo voy a seleccionar todo, incluso la carga, pulse Comando o Control G para agruparlo. Ahora voy a seleccionar todo. Haga clic en componente, el signo más. También esto es por defecto. Por defecto debe verse así. ¿ Y si hago clic en nuevo estado, estado a una finca a año, arrastre esto hacia abajo, traiga la escena. El derecho, un poco, un poco a la izquierda, baja. Agradable. Ahora, control de mando. Haga clic aquí, haga doble clic. Entonces vamos adentro. Presione Control de Comando V para agruparlo. Está bien. Ahora aquí en este estado a esto debería volverse menos y el color debería estar cambiando a algo así como, genial. A ver. Estado uno. Estado dos, impresionante. Muy bien, vamos a seleccionar este. Estás en estado predeterminado, ve al prototipo. Selecciona la carga más, asegúrate de que el gatillo esté destapado. Si no lo es, si es un arrastre no va a funcionar. Entonces eso fue más afortunado. Si es un arrastre, ya no vemos. No se ve el destino. Por lo que debería ser un tabulador. Al hacer clic en Tab autonomía para comprometerse activado. Y puedes elegir este día también. Y en el estado dos, cuando hacemos clic en menos, haga doble clic aquí, se puede elegir un destino de estado predeterminado, lo que el control estatal. Por lo que si hago click en Cargar, sucederá Morsi. Impresionante. Eso es más o menos. Más perfecto sin embargo. El resto sería lo mismo. Y además, este de aquí es por perfecto. A mí me encanta. Entonces hay algo que falta chicos. Yo sólo voy a mostrarles lo que pasa. Entonces a lo que me refiero aquí, y es el número uno. Este debe estar girando por dentro porque está abierto. Volvamos aquí. El número 2 está bien. Número tres. De nuevo, si miro a estas pequeñas cositas que lo hacen perfecto, Ahora echemos un vistazo. Abre eso. Hermosa. Calificación, devolución de llamada. Abre eso. Sí. Mira, qué guay es eso. Cositas tan pequeñas que hacen que esto sea perfecto. 80. Animación de contador y agrega a la animación de tarjetas: estado componente: También ya tenemos esto. Lo mismo que creamos. Haga doble clic aquí. Puedo controlar V, traer esto aquí, eliminar éste, arrastrar esto y simplemente seguro está aquí. Por lo que sólo podemos editar la tarjeta. Veo esta hermosa animación en el auto. Y ver esta hermosa animación. Entonces te encanta. ¿ No amas a esta señora? Animaciones. Entonces todo funciona. electromagnética. Perfecto. Veamos qué más hacer sí, tienes esta sola página. Vamos a ver todo en el lugar correcto. Tan sólo hay que animar este. Atrás. Esto es genial. Y aquí vamos. A este me encanta. Esta popular. Tienes que simplemente animar esto también. Ya sabes cómo hacerlo. Agregar al Carrito y este icono más. Vamos a copiar esto y traerlo aquí. Cámbiala con este. Muy bien, ahora animemos esto. Simplemente voy a seleccionar este icono para copiar esto. Y un plus por defecto se va a ver así. El signo más en tu estado. Entonces en nuevo estado, va a sumar estos dos, número dos. Y éste va a volver a subir. Busca el estado. Eso es todo. Ahora necesitamos animarlo. Ir a Prototipo. Si hago click en este signo más, se va a quedar dos. Ahora vamos al estado dos. Si hacemos click en el menos, haga doble clic. Volvió al default. Diseño o mascotas. Anima esto. Menos, más, menos, más. Ahora puedo agregar esto a mi carrito. Entonces es algo malo con esto. Entonces éste no es el de animación real, es éste. Discursos. Copia esto. Tráelo aquí. Ese es el uno. Dividirlo aquí. A ver si funciona. Impresionante. Vamos a hacer copias de seguridad. Detalle. Cliente. Ya sabes hacer esto. Nuevamente, muy rápido. Este alcance y ver lo rápido que es que podemos animar todo. Control plus ns en cancha. Desplácese hacia abajo. A mí me encanta. También puedes venir aquí y hacer lo mismo. Cuando le agregas cosas a esto, tenemos que ver bulto número 2 aquí, ¿verdad? Vuelve a este doble clic aquí, y tratamos de confiar en algo. Otra vez. Whitewater al texto se debe agregar número para que sea blanco. Aquí. Turno, selecciona mi Control G, y lo voy a probar aquí. Copia. También estoy tratando de ponerlo aquí también y jalarlo porque tengo cinco artículos aquí. Se puede poner el 5. Entonces esto es lo que va a pasar. Selecciona esto, tráelo hasta aquí. Entonces si hago clic en este ASCO bolsas No aquí, y esta es una. Entonces este es el escenario que vamos a enviar a nuestros clientes. Entonces, ¿cuál es la tapa dura? Se ve el producto C, el cliente revisa todas estas hermosas animaciones y hacemos click en el signo más. Agregamos el carrito. ¿Verdad? Enfriar. Por lo que aquí se suman dos. Volvamos atrás. Nada. Este año. La siguiente parte es, cuando haga clic en esta canasta, ¿qué va a pasar? Si hice clic en la canasta, voy a la página de mi carrito, luego selecciono el pago, lo pago. Entonces vemos una fecha de entrega, y ese va a ser el final de la misma. ¿ Verdad? Ahora Es hora de la conexión final en wireframing. 81. Prototyping final y encuadre final: Muy bien, Hagamos la animación final y escuchemos de nosotros página también. Entonces estamos aquí en modo prototipo. Haga clic y vaya a las colecciones. ¿ A dónde va? Se va a filtrar página. Por lo que arrastrando una página en particular. Si hago clic en este libro T, voy a volver a mi página de inicio todo el tiempo. Entonces cuando estamos en página fetal, hacemos muchas cosas cargan más. Podemos jugar con el rango de precios e incluso el PDF de tapa dura cuando seleccionamos este, el primero, solo voy a ir a una sola página y no necesitamos poner el tiempo y también animar. Podemos ponerlo en transición. Incluso el primero. Cuando hago clic en este, no deberías ir a animar. Debería estar en transición, solo tres segundos. Por lo que las páginas sencillas que van, debe ser en transiciones. Por lo que cuando estés en página, en esta página, entonces puedo simplemente dar click en esto. Si hago clic en esto, va a animar esto. Entonces tengo que tener un truco. Yo sólo voy a venir aquí, arrastrar algo encima de esto. Asegúrate de que ahí no haya nada, pero veo esto. Ir al modo prototipo. Y si hago click en este, puedo ir con transición. Puedo ir a esta página. Si hago el pago, entonces voy por fin a despachar. Y aquí, si hago click en esto o si veo o hago click en Sobre Nosotros, voy a esta página. Cuando leo esto, puedo volver a mi página de inicio. A ver si todo funciona a la perfección. Es decir, esta página, todo está funcionando al descarte. De acuerdo, veo uno. Puede traerlo de vuelta. Se puede ir afuera. Seleccionar. Y veamos ¿ qué más tenemos? Tenemos éste. Sí, éste. Si hago clic en ir a colecciones, vengo a esta página fetal. Y solo puedo hacer click en la calificación más reciente. Rejillas más cercanas. Perfecto. Puedo dar click en una carga más y menos. Impresionante. Puedo ir a esta página. A mí me gusta este libro. Quiero ver más info al respecto, ¿verdad? Detalles del producto, opiniones de clientes, impresionante. Cuando los libros populares al respecto, el electrodo de libros relacionados está en Agregar al carrito y esto está en uno. Entonces solo voy a agregarle un signo más. Yo estoy agregando el descarte, así que dos se van a la cesta de la compra. Ahora, lo genial es que si hago click en la cesta de la compra, voy a mi tarjeta 122. No elimino nada y tendré que pagarlo. Pago, pero no veo esto. Aquí falta algo. Volvamos aquí. Vayamos al diseño. Algo falta. Yo quiero ver si está detrás de mí se va a desbloquear este clic derecho y enviar a la espalda. Entonces baja esto, mala conducta, este control L, desagruparlo. Este tipo seleccionado, ponlo aquí. Debe ser del mismo tamaño. Este debería estar en 41. Escribe esto de nuevo. Es más pequeño. Ven aquí. A veces pasan, chicos, no saben qué le pasa. Y esto, debería ser Arial. Regular 14a. A veces vuelves y ves que algo no está ahí. Y esto es exactamente cuando se quiere terminar el trabajo final. Pero eso es todo. Ese es el proceso de nuestro trabajo. Y vamos a hacer de este 14. Tener un cupón nombre de esa escuela. Entonces tienes esta página? Yo lo he pagado. Se va por aquí. La página de entrega, el rastreo, adivinando el rastreo que todo lo demás. Y entonces puedo ver de nosotros. Se trata del libro, de confianza, contáctanos y el mapa y todo lo demás. Y si hago click en el libro T, vuelvo a la página principal. Y esto es lo que le enviamos a un cliente. Y confía en mí, no pueden amarla porque todo está en el principal. 82. Prototipos y wireframing móvil: Ahora, volvamos a bajar. Todavía. Tenemos estas páginas. Lo mismo chicos. El animar esta vista móvil. Vamos a ir al prototipo, arrastrar esto, y dejarlo aquí. No hace falta animar esto, así que ya saben cuál es la verdadera animación. Entonces va a exhibir éste. Ir a esta página. Perdón. Ir a esta página. Y ahora hacemos click en las cestas. Pasa por aquí. Y nosotros hicimos el pago. Se va a aquí. Haga clic en el e-book, vuelve a aquí, y veamos qué hemos hecho. Por lo que puedes ver esta página es hermosa. Todo en el lugar correcto. En incluso la animación está ahí. Acude a colecciones. Agradable. Estos están funcionando correctamente. Volviendo hacia arriba. Y solo voy a dar click en esto o tener esta página. Está bien. Agregar al carrito o dar click en la cesta. Y estoy en mi canasta, el pago total puede pagarlo ya que es entrega y eso es todo. A ver si también tenías la página Acerca de Nosotros, sobre nosotros. Y aquí vamos. Entonces permítanme sólo traer de vuelta a la página principal. Control. Entrar. Una vez más. Las colecciones son algunas de las revisiones de clientes de una sola página. Todo funciona y es hermoso. Si algo agregado al carrito. Sé amable. Se puede pagar por ello. Y también otra vez, ver eso de nosotros. Impresionante. Y voy a volver a la página principal. Y esto es lo que enviamos a nuestro cliente para comprobar si todo está bien sobre la página web. Y vista de David. 83. Diseño de páginas introducción a aplicaciones y animación de prototipos de la evolución de la aplica: Después de crear el sitio web y la vista móvil, va a ser fácil para nosotros crear la aplicación. Fui a dribble y página web Behance. Y solo para obtener una instantánea de un montón de ideas de cómo se ve un libro de lectura, cómo es AP, libros, y qué hay que hacer. Hay mucha información sobre las páginas, sobre la incorporación. Y se me ocurrió algunas buenas ideas y que necesitamos empezar. Tenemos que empezar con la intro. El genial de este diseño. Pasamos por esto, recrear la intro. Después animamos, vamos a la onboarding y animamos al mismo tiempo. Por lo que hacemos tanto el diseño como la animación. Por lo que no necesitamos crear el wireframing y mucho diseño de baja fidelidad y alta fidelidad. Basta de ir por un diseño porque ya nos desviamos lado y la vista VIP. Y tenemos los colores, las fuentes. Se utiliza la misma fuente como Poppins y las áreas. Muy bien, ahora tenemos que empezar a diseñar. Haga clic en la mesa de trabajo. Bajemos. Mira desde iPhone X, XOR y 11 Pro. Por lo que esto también va a ser bueno para la versión de Android y la versión de iPhone. Entonces algo como esto. Yo sólo voy a llamar a esta intro. Haga clic en la herramienta Mover, luego haga clic en Diseño. Asegúrate de que esto va a ser, el margen va a ser 20 de derecha e izquierda. Después de que creamos de derecha e izquierda, basta con dar click aquí y arrastrar una regla y ponerla aquí. Y a cualquiera, arrastra otro hasta aquí. 20. Sólo voy a arrastrar esto hacia fuera. Y además solo retírelo. Así que asegúrate de que sean 20. Y desde arriba también bajo contrato algo así como es 20. Entonces de izquierda, derecha, arriba van a ser 20. En la parte superior tenemos la muesca. Entonces por eso tiene un 20 por ciento de descuento. Y en la parte inferior, y tenemos el botón de inicio. Entonces para la intro, realmente no importa. Simplemente voy a dar click en cualquier verdadero. Vayamos a Rellenar color. Vamos a solidar corregir y ponerlo en un gradiente lineal. Ahora, asegúrate de que éste esté seleccionado. Por lo que se selecciona la parte superior, Oregon seleccionado a partir de aquí. Después haga clic en esto o haga clic aquí, esto va a ser más fácil. Después cambiamos este , el lado derecho, el fondo, y click sin descubrir, así que ya tenemos la corriente. Entonces es genial. Asegúrate de tener el libro de TI. Tienes que copiarlo desde cualquier lugar. Al igual que aquí. Arrástrelo hacia abajo y ponlo aquí. ¿ Verdad? Entonces este va a ser el e-book, así que probablemente sólo lo voy a poner aquí. El principio de los tercios, lo hace aún mejor. Entonces para nuestros ojos, ¿verdad? Ahora, tienes que asegurarte de que este sea grupo, éste y éste. Por lo que a ambos les encanta seleccionarlos y agruparlos comando o Control G. Ahora, haga clic aquí y mantenga presionado Alt y Shift y arrástralo hacia la derecha. Por lo que para la animación, solo voy a dar clic en este. Sostenga el control. Asegúrate de que esto sea azul. Ahora puedo seleccionarlo, arrastrarlo hacia abajo y bajar la opacidad. Para este, acabamos de seleccionar. Arrástrelo hacia arriba. Ahora, vamos a hacer clic en el icono 3D y asegurarnos de que esto esté volteado. Al igual que esto es menos 180. ¿ Verdad? Ahora. Asegúrate de que esté seleccionado y baja la opacidad. ¿ Verdad? Ahora. Como dije, diseñamos y animamos en este proceso. Vayamos al prototipo. Arrastre esto hacia la derecha por ahora, porque no hay botón Tab, siempre es un disparador. Para desencadenar. Debe ser la hora. Entonces lo ponemos a tiempo. Voy a explicar cuál es el retraso. Y el tiempo sería auto animate. Y este, sólo voy a poner el número 2. Por lo que en dos segundos está en, relájate y ve al siguiente. Pero echa un vistazo. Si jugamos, esto va a ser muy rápido. No puedo ver lo que pasó. Entonces lo digo antes de ir a la siguiente mesa de trabajo, quiero 1 segundo de retraso. ¿ Verdad? Entonces por este retraso de 1 segundo, si pongo, a ver qué pasó. Estamos 1 segundo, después tenemos la animación. Entonces déjame solo hacer clic en esto y arrastrar esto hacia atrás y ver qué pasa. Otra vez. Vamos a jugarla. Agradable. Volvamos atrás. Agradable por lo que sólo puedo ver qué pasó. Muy pequeño y muy natural. Por lo que fue a tiempo. Ponemos un retraso para que solo podamos esperar la animación, entonces va a suceder. O UCI. 84. El canto en la aplicación en el diseño y la animación de prototipos: Volvamos a Diseño. Haga clic en la intro y Control D para duplicarlo. Y solo llama a este inicio de sesión de incorporación. Para hacer dos cosas. Voy a seleccionar todo y asegurarme de que esto esté apagado. Y pulsa Eliminar. Haga clic en la incorporación y asegúrese de que el color de relleno esté volviendo a sólido y sea totalmente blanco. Antes de llegar a esta página porque es onboarding. ¿ Qué es la incorporación? Son 30 toboganes. Antes de iniciar la animación, después de la animación de intro, tienes el onboarding. Se trata de algo de la aplicación, ¿qué es lo que sale? ¿ Cómo podemos confiar en nosotros? Hay muchas cosas que podemos aprender en la incorporación. Entonces después de lo poco gratificante, vamos a la página principal, ¿no? Aquí lo mismo. Por lo que necesitamos algunas fotos sobre la lectura. Entonces vamos a esta página web. Libre grande y mecanografía, lectura. Si estás leyendo en la página segundo, vemos algo como esto, ¿verdad? Apenas descargado. Cuando lo descargues, solo lo vas a tener como aquí. Es como simplemente hacer clic derecho y extraer a los jóvenes. Entonces aquí vamos. Sólo voy a hacer doble clic en Adobe Illustrator porque necesitamos hacerlos archivo SVG. Está bien, esto es lo que hacemos. Sólo voy a presionar Comando o Control N y sus puntos. Yo quiero ponerlo en pixel. Yo sólo lo voy a crear. Ahora. Simplemente selecciono a cada uno de ellos, cópialo, y sólo vamos a venir aquí y pegarlo. Entonces solo lo voy a poner aquí. Haga clic en este tablero de arte, hazlo un poco más pequeño. Entonces esa es la parte delicada. Vamos a Archivo, vamos a Exportar y Exportar As. Entonces aquí. Escriba como debe ser, es V, G, sobre todo en Illustrator, pero para Adobe XD, para sitios web. Entonces, ¿por qué SVG? Porque InDesign, necesitamos la imagen de alta calidad. A veces haces que la foto sea más pequeña o más grande. No queremos perder calidad. Por eso lo hacen SVG. Entonces solo voy a llamar a este getter por ejemplo, o chica leyendo libro de pie. A continuación, haga clic en Exportar y haga clic en Aceptar porque ya lo tienen. En realidad cancelar. Chicos. Lo mismo con éste. Yo sólo voy a dar click en este pequeñito. Control C. Simplemente voy a borrar este, Control V, y asegurarnos de que nuestro código sea un poco más grande. Que contrato este tipo lo puso aquí y lo hacen del mismo tamaño, un poco lo mismo. Archivo, Exportar, exportar As. Y esto va a ser niño leyendo libro, sentado. Y el siguiente va a ser éste chicos inconformes. Volvamos a Adobe XD. Ahora, arrastrémoslo aquí. Por lo tanto, selecciónelos a ambos. Por lo que ahora selecciona tres de ellos y arrástralos, ponlo dentro, eso se extinguirá o UCI. Ahora sólo los voy a poner en la parte superior. Entonces el primero va a ser éste. Simplemente arrástrelo y suéltelo aquí. Branko, ¿eso qué necesitamos? Necesitamos un diseño fresco. Entonces, en realidad, no me gustó ninguna de estas ideas, así que traté de surgir traté de llegar a mi idea. Entonces esto lo que pasó cuando ves muchas imágenes, muchas cosas. Esto es finalmente que vienes con tu propia idea. Entonces esto es lo que voy a decir. Arrastra algo aquí, haz zoom un poco y sin borde. Vamos a llenarlo con el color principal. Mantén presionada Alt y arrastra este rincón hacia abajo hasta el año cinco. Entonces hagámoslo 90. Está bien. Ahora haz doble clic en él y asegúrate de dar clic por aquí. Este ícono está aquí arriba. Ahora, haga doble clic en él. Entonces llegamos a manejar. Ahora arrastra esto hacia arriba. Si vuelve a hacer clic en esto, haga clic aquí, mantenga presionada la tecla Mayús y arrastre hacia la izquierda. Tenemos una seda muy pequeña por aquí. Entonces me encanta. Y esto es como estar de pie encima de esto. Tan muy interesante, muy cool. Y me aseguro de que esto sea por aquí. ¿ Qué más necesitamos? Necesito crear algo tal vez más interesante. Craig, círculo. Sin frontera. Debes sentir que es del mismo color que éste. Y bajar la opacidad. Haga clic con el botón derecho y Enviar a atrás. Entonces va a ser por aquí. Y mantenga presionada Mayús magnitud mayor que Alt, arrástrelo y suéltelo aquí. turno largo lo hace un poco más grande y llegar a un color diferente y lo va a hacer azul. Imprimir hacia abajo la opacidad. Entonces para onboarding, ya tienen algunos textos los cuales voy a ponerlo aquí. Por lo que estos son para la incorporación. Pongo algo de texto aquí, ¿verdad? Y también necesitamos como un botón que demuestre que estamos en la siguiente página. Entonces esto va a hacer la primera página, ésta y ésta. Entonces solo estoy seleccionar estos dos y llegar a su diferente color y asegurarme de que todos estén centrados. Arrastra un poco. Y eso es todo, el código. Asegúrese de que estos tres estén agrupados. Y por último, agrupe todos estos juntos también. Entonces éste, éste, éste y éste, nuevo, los grupos R. ¿ Qué más necesitamos? Necesito el botón de inicio de sesión aquí también. Por lo tanto, seleccione este fondo, presione Comando o Control C comando o control V para copiarlo. Ahora arrástrelo hacia abajo. Asegúrate de que el color sea este color púrpura principal. Por lo que antes de que supiéramos algo, agregamos aquí el botón de inicio de sesión. Yo sólo voy a hablar del tipo. El tipo aquí son áreas sobre toma. Usa Arial, negrita. Y para el teléfono móvil es una muy buena fuente en realidad. Pero para firmar para las vistas de texto principales el Poppins es estampar y tipear. Y aquí tipo en seno n. Asegúrate de que Es impopular es 24 y medio. Escribir. Este texto es Ariel, por lo que no importa que lleve área de bar a cualquier medida de 2016. Estos tres están agrupados. Además, mantengamos pulsado turno y agrupemos estos también para incorporarse Comando o Control G. Así que tenemos un grupo aquí. Seleccionemos este y seleccionemos éste y arrástrelo hacia arriba por ahora. Y además, vamos a arrastrar un poco esto hacia arriba. A lo mejor por aquí, bien , por aquí, ahora mismo lo genial es, si arrastro esto, sólo voy a cambiar la forma. De acuerdo, así que tengo que hacer doble clic, dar clic en este turno solo, clic en esta tecla de flecha, y el turno, van a ser 10 píxeles en la parte inferior. Entonces no cambio de arriba a abajo. Entonces va a ser algo así como los fichajes de este tipo aquí. Sólo lo voy a poner aquí. También ten el apuntalado. Y vamos a pasar es 40% turno selecto y hacerlos en el centro. Aquí para estos puntos tenemos algo como esto. Debe ser blanco, el tamaño tres tapas redondeadas. Y asegúrate de que esté en el centro y bájala un poco. Entonces de aquí para aquí, sólo voy a arrastrar una caja. Asegúrate de que esté alrededor de las ocho. Déjame tener frontera. Sostén presionada Alt y arrástrala hacia el interior. Mucho mejor. Más t y escriba en dirección de correo electrónico. Entonces si usamos color gris, en realidad es 14. Y ponlo aquí. Vamos a enchufarnos. Vamos a los iconos, y sólo voy a teclear aquí. Hecho. Busquemos algo interesante. Al igual que lo que es esta cosa es genial. Sólo voy a arrastrarlo y soltarlo aquí. Y asegúrate de que todo municipio y hacer esto más pequeño. Sólo lo voy a poner aquí. Cambia el color a morado. Asegúrate de que esto va a salir bien. Está bien. Ahora, mantengamos pulsada la tecla Mayús, seleccione ésta, y volvamos a sus bibliotecas. Y dar click en el componente es signo más. También puedes hacer click en esto. Uno es verde, significa que es un maestro papeleras. Este es el que tenemos que editar. Si lo arrastro hacia abajo, sostén Alt y Shift Arrastre esto hacia abajo. Esto va a estar vacío. Mira, está vacío por dentro. Haga clic en esto, esto es verde por dentro, esto está vacío. Ahora tengo que cambiar. Esto toma la contraseña. Entonces veamos si lo cambio. Veamos qué pasó con este punto. Ahora, hay un punto dentro. Significa que ha cambiado y va a traer esto de vuelta a aquí. Dije que no quiero que esto se cambie, pero si vuelvo así, nada ha cambiado. Si hago clic en esto y cambio esto, todo va a cambiar. Mientras esto esté vacío, no le hemos hecho nada más. Pero si cambio esto a contraseña, significa que ya he hecho el cambio. No quiero que le pase nada a estos componentes en particular, pero solo necesito que todo esté exactamente en el mismo lugar. Para una contraseña. Volvamos al plug-in. Da click en el ícono para que solo voy a llamar a este candado. Y veamos qué encuentras aquí. Suerte. Escoria aquí, haz esto más pequeño. Ven voy a hacer doble clic. Entonces BR dentro del módulo de mando V. Y pongámoslo aquí, es un poco más grande. Vamos a cambiar el color. Ahora, selecciona esta y elimínala. Entonces esta es la contraseña y el registro. Entonces asegúrate de que esté en el centro. Hermosa. Y echa un vistazo a por qué no hicimos esto así. Porque si hacemos eso, y luego si quieres crear algo como esto, obtienes la altura es 46. Y sólo échale un vistazo a éste. Sólo voy a dar clic a algo aquí. Simplemente ir a arrastrar esta esquina va a estar al tanto, botón Iniciar sesión. Y echa un vistazo. Deberías ver una diferencia entre el formulario que toma el campo de texto del formulario que escribes en algo y la parte inferior como Botón Iniciar sesión y Charles escriba aquí. Entonces pongámoslo aquí. Es como 16. Poppins debe estar en negrita. Bonito color, tan morado. Y estoy pensando que estos son un poco grandes. Y vamos a ver, hagamos esta talla 40 y asegurémonos de que esto esté en el centro. Esto también está en la frase, seleccionará esto y lo arrastrará hacia arriba y se asegurará de que sea 20. Y esto también es 28, mi mal Turno, seleccione ambos y haga clic en este componente. Y volvamos a las bibliotecas y llamemos a este botón. Este va a ser campo de texto. Entonces sé si quiero tomar este campo, puedo usar ese. Esto va a ser diseñando. Y también necesitamos algo aquí como contraseña olvidada aquí. Por lo que debe ser irregular, debe ser 12. Y también pasar palabra y el signo de interrogación y bajar la opacidad. Entonces hagámoslo 70. Y también necesitamos el online sólo va a dar click aquí. Entonces para la contraseña, este siendo un deprimente de la misma. Muy bien, impresionante. Ahora vamos a dar click en la Capa. Haga clic en todos estos tipos. Este, éste, éste, éste, éste, éste, y éste. Y también este, el fondo. Está bien. Y pulsa Comando o Control G después de la agrupación, papá, solo voy a derribar a esto chicos. Mira, sólo voy a bajar esto hasta aquí. Está bien. Antes quiero llevarlo al botón Registrarse, porque éste, al dar click en Regístrate, tenemos la dirección de correo electrónico y la contraseña. Y también tenemos algo más llamado confirmar contraseña. Entonces selecciona aquí, selecciona y este, el campo de texto solo voy a llamar a este TextView. Contraseña. Cambiar que lleva al correo electrónico. Ahora vuelve a configurar la contraseña, pulsa Command o Control D para duplicarla. Selecciona la que se encuentra a continuación y llama a esta confirmación. Entonces si mantengo pulsado turno y jerarquía aquí en este momento, así que llama a esto conferir. Arrastre esto hasta aquí. Y eso es todo. Selecciona de nuevo, selecciona la confirmación y arrástrala hacia arriba. Por lo que está exactamente detrás de la contraseña. Entonces tenemos que poner todo aquí primero, después tenemos que animarlo. ¿ Qué más debería haber dentro de este grupo? ¿ Verdad? Dentro de este grupo, tenemos algo. Volvamos a Gear. pie, sentarse y sentarse a juicio es escribirlo. Entonces estoy haciendo doble clic en este grupo. Asegúrate de que esto es, está dentro. Yo sólo voy a copiarlo. Haga doble clic dentro de este grupo. Entonces estamos dentro de este grupo Comando V. Así que este es el chico. Y yo sólo lo voy a arrastrar fuera de esta caja. Entonces sólo vamos a arrastrar esto aquí. Entonces si hago click en este tablero, así que si hago click en esto, el chico está dentro de este grupo, pero está afuera. ¿ Y qué hay de la chica? Copiar, haga doble clic. Toma a Gil o dentro de este grupo, si salimos afuera, asegúrate de que esté dentro. Entonces solo voy a arrastrarlo en realidad está aquí. Por lo que tenemos todo en el lugar correcto. Ahora, selecciona este inicio de sesión. Haga click en esta chica, Control X, haga doble clic para ir dentro de este grupo. Nuevamente, ¿puedo controlar V? Porque esta chica era una perspicacia estaba afuera. Así que selecciona el borde, selecciona el inicio de sesión, asegúrate de hacer clic en componente a. Este es nuestro estado por defecto, pero aun así tienes que hacerlo perfecto. Sólo voy a poner este letrero aquí. Date de alta. Sólo traigamos éste e incluso para confirmar abajo, más, inscríbase viniendo aquí, y éste viene por aquí. Entonces este va a ser nuestro estado por defecto. Si hacemos click en el signo más, entra a un nuevo estado, que voy a llamarlo inicio de sesión. Ahora, esto es iniciar sesión desde el pasado y se olvidó, selecciona todo y arrástralos hacia arriba. Va a ser algo así. Este va a la derecha. Éste viene aquí. ¿ Qué tenemos? También manda esto a la parte de atrás. En algún momento así. Está bien. Y tenemos que cambiar esto. Lo es. Está bien. Pongamos el letrero aquí. Arrastra esto hacia arriba. Perdón esto arriba. Correo electrónico, contraseña y confirme, seleccione ambos, arrástrelos hacia arriba, asegúrese de que esté casi cerca de 20 años, como 19.9. Así que está bien. Esto está bien, y esto también está bien. Si quieres ver qué pasó hasta aquí. Entonces esto va a estar firmando, este va a ser el estado por defecto. Muy bien, Así que quiero decir, estado por defecto. Para animar esto. Vayamos al prototipo. Inicia sesión. Haga doble clic aquí en este pequeño ícono. Ahora, asegúrate de que el tipo esté encendido auto animate. Y asegúrese de que el destino, la mesa de trabajo debe estar firmada. Facilidad de entrada, facilidad de salida es lo mejor para este tipo de animación y ponlo en 0.6. Vamos a animarlo. Se juega. Da click en Iniciar sesión. Hermosa. Volvamos atrás. Vamos a dar click aquí. Volvamos a Diseño. Haga clic aquí, inicie sesión. Por lo que también tenemos el botón Registrarse. Haga clic en el signo más, nuevo estado. Date de alta. Para la inscripción. Este es el selecto esto es 40 por ciento de opacidad. Va a ser de plena capacidad. Y arrastra esto hacia la derecha. Seleccione esto, traiga la opacidad, y esto es lo que tenemos que hacer. Entra y se está bajando la contraseña. Te vas a la contraseña dada un Kafir y te permite si una tecla de flecha, asegúrate de que esto sea lo mismo, como noventa y nueve punto nueve. Para bajar este 2, como 40, no necesitamos la contraseña. Arrastra hacia abajo la opacidad. Y esto también se debe inscribir y asegurarse de que está en el centro. Por lo que esto va a ser el registro. Entonces cuando estoy firmando y vamos a retratar, mantenga pulsado el control y seleccione el registro. Haga doble clic. Destino debe ser inscrito. Otra vez. Salgamos, regresemos cuando estés en Regístrate y mantén pulsado el control y haz clic en Iniciar sesión. Haga doble clic. Tienes que firmar aquí. Está bien. ¿ Qué hace la imagen cuando estoy inscrito? Este. Déjame sólo seleccionar esto, arrastrar esto a la derecha aquí y traer esto aquí. Esta es la inscripción. Pero cuando yo y me inscribo, tengo que bajar esto para asegurarme del mismo nivel. Nuevamente, el registro, el inicio de sesión debe estar aquí. Y veamos nuestra animación desde el principio. Aquí. Por defecto, la placa estatal, inicio de sesión, impresionante. Inscripción, inicio de sesión. ¿ Ves qué hermoso es ese registro de registro? Ahora, creo que es un poco aburrido. Lo que necesitamos es la animación latae va a estallar animación. A lo que me refiero es a que vayamos a archivos y tecleemos pájaro. Aquí, tenemos éste. Haga click en él y descárgalo como Lottie JSON. Ahora vamos a tus archivos latae JSON, y aquí está el pájaro feliz JSON. Ahora arrástrelo y suéltelo aquí. Verás, sólo lo voy a poner aquí, chicos. Y no mordimos más pequeños. A ver si está bien en diferentes estados. Entonces vuelve atrás, inicia sesión, regístrate. Agradable. A lo mejor puede subir un poco. Y también tal vez más pequeño. Algo así. Inicia sesión. Estado. Impresionante. Ahora tiene sentido cuando traigas la animación latae, asegúrate de que esté en reproducción automáticamente. Y este, necesitamos reproducir en bucle para activarlo. Entonces significa que cuando lo tocamos, siempre va a ser animado. Y echemos un vistazo. Entra, regístrate. Y regístrese. También podemos ir al Sign In cuando le estoy dando click a este pequeñito. Y estoy en prototipo, puedo hacer doble clic y volver al estado predeterminado. Incluso cuando estoy en un registro y hago click en esta chica haciendo doble clic, puedo volver al estado por defecto, así puedo ver la animación aquí. Llamemos al estado por defecto en el embarque, jugado. Inicia sesión, impresionante, regístrate en un volver a por defecto el estado. Por lo que se inscriben. Me encanta. Ahora, ¿qué pasa con la incorporación? Entonces lo que voy a hacer es presionar Comando o Control D y también d. Y tú pinchas en esto porque es de incorporación. Realmente no importa. En este. Simplemente vamos a arrastrar esto hacia arriba o arrastrar esto a la derecha. Asegúrate de que este está entrando. En este. Seguro. Sólo voy a arrastrar todo esto a la derecha y arrastrar éste hasta aquí. Y además solo voy a poner esto aquí y lo correcto, Perdón, Sólo éste es tres a la derecha. Deberíamos alinearnos con el Dragón derecho aquí también. Yo sólo voy a jugar con este texto. Entonces haciendo y justo y hermoso. Además, necesito hacer algo como esto. Esta es la segunda página sobre la incorporación. Por lo que esto debe activarse, y ahora esto es debe activarse. Aquí vamos. Si hago clic en este prototipo, arrastre esto hacia la derecha. No necesito el auto animado y él hizo transición. Puedo ponerlo en disolver, pero estos son estos aburridos. Basta con echar un vistazo. Estos son aburridos. Pero podemos volver a tomar. Pero si lo ponemos en una diapositiva a la izquierda, Veamos qué pasó. Plato. Hermosa. Nuevamente, Control, selecciona este. Tribu está a la derecha. Y la cosa se va a quedar en el mismo lugar, esa animación. ¿ Y si quiero volver? Esto va a ser un tobogán, ¿verdad? De nuevo, es como correcto. Ahora echemos un vistazo. Aquí vamos. El cool al respecto es que esto va a ser animado todo el tiempo. Entonces la animación, funciona. Volvamos, y eso es todo. Pero si un plato aquí, Echemos un vistazo. Volvamos atrás. Impresionante. A ver. A ver. Y básicamente vamos así. Es, podemos arrastrarlo también. Por lo que onboarding, diapositiva para escribir leve a la derecha, lado a izquierda, leve a la derecha. Por lo que nombro. Date de alta. Hermosa animación latae. También aprenderás a traer esto como SVG. Y ya terminamos con la intro y muchas cosas. Pero cómo podemos conectar esto a esto simple, arrastra esto a éste. Debería ser a tiempo porque vamos a tocarlo. No hace falta tener un retraso. Y pongámoslo en 1 segundo. Echemos un vistazo. Si jugué 1 segundo retraso, animación de libro T e impresionante. 85. Reglas para diseñar aplicaciones móviles perfecto: Muy bien, antes de empezar a diseñar aplicación móvil, averguremos cuáles son las reglas para un diseño móvil perfecto. El primero es la legibilidad. Los dispositivos móviles tienen las pantallas más pequeñas en comparación con los escritorios. Por lo que encajar mucha información en una pequeña interfaz de usuario móvil puede ser un reto. Una buena manera de equilibrar el color son las reglas 60, 30, 10. Entonces este es el dominante no es un segundo color, el Columbia más pesado, y el 10 uno es el tercer color. Tan y claro avance. Echa un vistazo a este avance. Tenemos que apretar en proceso de envío D4 en una tina del dispositivo móvil. Esta no es una buena manera y esta es una mejor manera la información de envío. O podemos diseñarlos verticalmente, no en modo paisaje. Entonces esto no es don, y esto se debe. ¿ Qué pasa con la accesibilidad? Diseño para cada bono? El diestro, la mano izquierda y Dan el combinado. Por lo que la mayoría de las personas son diestros. Entonces esta es la parte que está fuera de alcance. Es difícil a su derecha. Y también aquí es difícil de alcanzar. Por lo que hay que poner la mayor parte de la información, la información principal en estas áreas, está bien, porque es de fácil acceso es natural. Para zurdos, es exactamente lo contrario. Esto está fuera del alcance, es difícil de alcanzar y también es difícil de alcanzar. ¿ Y un espaciado? La pantalla más pequeña no significa un texto pequeño o menos espacio. Hecho el texto u otros elementos se superponen así. Basta con echar un vistazo aquí. Y el interlineado o la altura de la línea está muy cerca uno del otro. Por lo que es difícil de leer y sólo echar un vistazo a este. Entonces esto no es don, y esto se debe. El número 4 es relleno. Cada día se presentan nuevas tecnologías. Como diseñador, debes estar al día. Por ejemplo, cuidado de este lugar, aumento de panning, ¿verdad? Entonces es más cuidado. Tienes que agregarle más relleno. Por lo que el relleno mínimo sería el estudio Pitman del 16 al 20. Por lo que siempre lo pongo en 20 desde el inicio, de izquierda a derecha. Por lo que el margen o relleno de izquierda o derecha es de 20. El top, debe ser de 30 por el bloc de notas. Número 5 es hacerlo responsive para Android es 360 pixel el mínimo? Cuando pienses en pantallas móviles, piensa primero en diseñar para la pantalla más pequeña, luego hazla responsive para pantalla más grande para iOS es 375, que vamos a diseñar esta. El número 6 es la navegación. Intentó utilizar unas secuencias estándar para su menú de navegación, como la barra de pestañas de iOS o, y o cajón de Nav. No intentes reinventar la rueda. Los usuarios están familiarizados con estos patrones comunes. Por lo que tu app será más intuitiva, ellas como esta para iOS o Android app. Por lo que básicamente la pestaña iOS es muy popular hoy en día, dado para Android. Pero recuerda, puedes diseñar de esta manera o simplemente mantenerlo como el paso número 7 de iOS. peso visual, generalmente en la interfaz de usuario proviene de una combinación de muchos elementos, colores, tamaño del texto, espaciado, etc. ¿Qué llama la atención? Echa un vistazo aquí. Esto me está captando los ojos. Si bien estás proporcionando mucha información, tu objetivo principal es arrastrar la atención del usuario. Necesitan estar sin mucho del análisis de pantalla. Por lo que quiero que lo use para pensar en esta área de espaciado, esta área en la que se puede enfocar. Y el número 8, pruebas de usabilidad. Las pruebas de usabilidad definen qué tan bueno es su diseño. Las pruebas ofrecen una perspectiva fresca y cosas que podrían haber escapado a tu atención, a veces incluso un posible rediseño. Por lo que antes de entregar un proyecto al equipo de desarrollo, recuerda manejar las pruebas. Herramientas que puedes utilizar es usertesting.com. App.com, disciplinarte en tus compañeros o bajo usuarios potenciales. También, podemos usar una cámara para grabar sus interacciones. ¿ Verdad? Entonces recuerda estas cosas. Después vamos y seguimos el piso de usuarios y la arquitectura de la información. Cuando no conozcas vértigo, qué línea tenemos que poner, tenemos que volver aquí y solo pensarlo. Seguir el flujo de usuarios, seguir la arquitectura de la información. Y puede volver aquí. Y es exactamente qué hacer. 86. Animación de prototipos del diseño de páginas principales en la aplicación: Por lo que estamos en la página de inicio. Es sencillo. Así que arrastra uno de estos, aguanta, Alt, arrástrelo a la derecha a lo largo del turno, va a quitar esto políticamente aquí. Simplemente voy a llamar a esto casa, acercar y borra todo. Y vengo aquí, pongo la página principal, vista móvil, video móvil en el lado derecho, para que sepas exactamente cuáles son las diferencias. Primero lo primero, aquí, tenemos que aumentar esto a Teddy pixel porque tenemos el pack de muesca, barra de muesca en la parte superior. Está bien, vamos a tu Icono de Material de Google, el hambriento de material, está bien, y solo tienes que hacer click en este Comando o Control C para copiarlo. Y vamos a venir aquí y pegarlo aquí. Y pongámoslo aquí. El margen de izquierda y derecha es de 20. Entonces si hago clic en Aceptar y veo el diseño. Entonces bajemos la opacidad para que sepamos exactamente qué hacer. Ahora, vamos a crear aquí la barra de búsqueda. Por lo que sólo voy a Click aquí a aquí, va a hacer este ocho. Ahora vengamos aquí y tendrá frontera. Se quiere soltar sombra, pero saber por qué, que sea 0. Por lo que se muestra de izquierda y derecha. Entonces, ¿qué tan genial es eso? Por lo que siempre comprueba que cuanto tiempo Controla y pulsa Enter. Para que sepas exactamente lo que estás haciendo. Ahora mismo. Puedo copiar esta búsqueda por ícono y la puedo poner aquí así, pero con un color muy claro, algo así, o incluso éste. Y algún texto. Así que asegúrate de que sea Poppins y sea 12 o incluso 14. Pero para mí, creo que es 12 es mejor. Por lo que la fuente que estamos usando para móvil sigue siendo la misma que la web, Poppins. Y para el texto deben ser áreas o puedes mantenerlo en Poppins. Poppins es muy popular en el diseño web, se agrega en más aplicaciones. Simplemente lo voy a poner búsqueda aquí. Y tal vez gris claro o tal vez éste o gris más claro. ¿ Verdad? Puedo ahorrar, buscar libros o así. Y haga clic aquí y arrastre esto aquí también. No quiero poner una barra de menús aquí porque creo a mi chico, mi usuario está registrado. Cuando firmó. Tienes que ver algo como esto. Ya tengo mi imagen, así que sólo la voy a arrastrar, manzana aquí. Yo sólo voy a borrar estos. Entonces, entonces chicos, porque es tu trabajo, intenten usar tu propia imagen. Entonces le exhibes esto al cliente o lo pones bajo dino web, diseñas esto porque tus PJs por todas partes. Entonces esta es una de las cosas cool publicidad o de la marca a ti mismo. Entonces aquí la frontera debería ser un poco más ligera, o ésta, quizá ésta. ¿ Y este tamaño, la altura de esta barra de búsqueda? Chicos trataron de ponerlo en 50 y en un arrastrarlo hacia abajo y sólo llegar aquí. Por lo que hay un espacio entre la parte superior y la inferior tan fácilmente que solo pueden hacer clic en él. Ahora lo que voy Alt y arrastre este texto aquí y ponerlo en 14. Entonces el número que tenemos para Poppins es 14, 18, 12, 12, y 12. Entonces se trata de 18 Poppins. Por lo que puedes ver Poppins 18 mínimo. Es enorme, ¿verdad? Entonces por ahora sólo voy a ponerlo en un 14. Y yo sólo voy a hacer de esta manera oscura. Y sólo voy a llamar a este Viernes Negro. Doubleclick se da click en este y hacer este amarillo. Y de nuevo, haga doble clic en esto, y este es el color principal, el viernes negro. Ahora, probemos una caja. Pb ya sabe el tamaño de nuestra cubierta es de 12, 82 o tres. El radio es de cuatro. El color del borde. Ahora, vayamos a la portada del libro y arrastremos éste hasta aquí por ahora. Entonces sabemos exactamente qué es, porque es Black Friday. Tenemos dos cosas aquí a aquí. Tienes Agregar al carrito y en la parte inferior tienes compra y la etiqueta de precio. Entonces vamos aquí y aquí. Puedo copiar esto. Pégalo aquí, hazlo blanco, y debe estar exactamente aquí. Déjame revisar. Está bien. Es bonito. Pero es demasiado grande, supongo. Yo podría. Y hay un truco. Si lo traigo aquí, chicos, no es posible verlo. Por lo tanto, agréguele una sombra de gota. Si le agregas una sombra de gota, es una especie de y solo estoy completamente 10. Y tal vez esto es 0. Entonces, al menos podemos ver qué pasa. Algunas de las portadas del libro y algunas de las cubiertas diseñadas. A lo mejor esto va a ser en un fondo blanco. Por eso agregamos esto. Por lo que al menos lo pueden ver. También. Tenemos algo como este caso. Nuevamente, va a ser para la altura debe ser de 32. El borde es una especie de este color por ahora. Ahora, aquí teclea por, asegúrate de que aquí los Poppins. Está en semi negrita porque no lo tenemos aquí. Y esto a veces son formas fáciles de hacer esto. Y por lo general puedo traerlo porque a veces normalmente es mejor sacarlo de una pulgada. Ahora, los seleccionados agregan estilo de carácter, por lo que va a ser éste. El tina. Y también asegúrate de que sea de color amarillo. Entonces sólo lo voy a traer aquí. Ve a la derecha. Ponga un $1.9, 0.99. Selecciona ambos y asegúrate de que estén en el centro. A ver qué está pasando. A mí me gusta. A lo mejor haga doble clic, escúchame, tráelo un poco a la derecha. Es un poco mejor. Ahora, voy a seleccionar todo esto. No necesito este diseño. Para que pueda verlo mejor. Puede seleccionar esta cuadrícula de repetición. Y vamos a la derecha. A lo mejor aquí, ¿verdad? Pero la portada del libro y seleccione aquí, mantenga pulsado Shift select year, seguir todo de nuevo. Y aquí vamos. Haga doble clic en esto y arrástralo de nuevo hacia la derecha. Simplemente voy a seleccionar esto y poner mi ratón entre ellos y arrastrarlos a la izquierda de la misma. Entonces esta es la brecha entre otra vez, Vamos a comprobarlo. Impresionante. Al igual que el viernes, perfecto. Y puedo seleccionar esto, arrastrar esto hacia abajo. Y esto se va a explorar. T libro, a la derecha, se da clic en el rectángulo y dibuja una caja alrededor. Vamos por dos. Y la altura 85, ¿verdad? Borde para y su color principal. Revise la frontera. Sí, quiero poner un icono para el género, sección. Género. Hagamos este capital y también hagamos estos blancos. Para encontrar los iconos para el género, busco un libro debería tener algunos libros sobre él. Para que puedas ir a pic.com gratis y escribir iconos de libro. Y hay muchos libros que luego solo puedes encontrar aquí. Pero ahora mismo pongo algunos de estos, que podemos encontrarlo aquí. Yo sólo lo voy a poner aquí. Entonces éste lo va a poner aquí. Y sólo voy a mover esta API a la derecha, género de tres. Copia esto, arrástralo a la derecha, tal vez 10. Y voy a llamar a esto top selling. que significa que tengo que aumentar un poco esto, ¿verdad? Sí. Está bien. Ahora vamos a quitar esto. Pon este aquí, tipografiando, y trae esto de vuelta un poco. Entonces, ¿puedo controlar G o Control G? Arrastremos éste hacia la derecha. Entonces se va a copiar este W aquí, quitar éste y el control actual V es solo voy a arrastrar y ponerlo aquí. Eso sí, sólo voy a llamar a esto nuevos lanzamientos. Y dar click en este y aumentar un poco esto. Y quitar este mes, cito. Por lo tanto, asegúrate de que estas barras estén agrupadas. Selecciona este árbol, y de nuevo, agruparlos. Seleccione este, y haga clic en este pequeño ícono aquí para un grupo escolar. Y aquí vamos. Déjame como aprendiz aquí. Entonces este va a ser éste al que llamo Explorer, libro TEA. Lo que estoy pensando es explorado mesa puede ser semi perno. Este es oscuro. Déjame simplemente hacer clic derecho en él y editado. Recoge el color, picker, el color principal. Y eso es todo. Mucho mejor. Incluso éste puede ser semi audaz. Entonces la siguiente parte es algo totalmente nuevo, que mis clientes me dijeron que diseñara para ellos, que es una combinación de eBooks y audiolibros, que no estaba disponible en la página web. Simplemente, va a ser una aplicación. Por lo que sólo voy a dar clic en esto. Se va a arrastrar una caja. Mantenga presionada Alt, arrastre esto hacia abajo, o Alt, arrastre esto hacia abajo. No alterar, arrastra esto hacia abajo. Bajar un poco. Sin frontera. Y prueba este. También para este, busco algo como esto, muy ligero y yo estando dentro. Entonces va a ser, déjame sólo aferrarme a Alt y arrastrar esto aquí. Libros electrónicos y también audiolibros. O bien, permite Shift y arrástralo para que se centren. Entonces esta es la parte central. Entonces aquí vamos. Aún así, es grande desde el lado del corazón. Hazlo abajo, hazlo cinco. O incluso para mejor. Ahora, la otra cosa que tenemos, así que ésta debe ser de color muy claro. Entonces busco un encendedor como éste. Y también estos son demasiado pesados, lo que significa que tengo que ponerlo en medio ahí. Y en rosa abajo en ella. Ahora puedo ponerlo todo sobre él y arrastrarlo hacia arriba. A lo mejor todo debería bajar si es el mismo espaciado. Impresionante. Ahora, pinchemos aquí y arrastremos esto hacia abajo. Ahí hay algunos colegas todo esto en un solo lugar. Es bueno enchufar el error tipo I. Este error, control X. Ven aquí, control V, hazlo muy pequeño. Y ponlo aquí. Se va a encontrar las líneas Qu. Simplemente voy a ponerlo exactamente una idea y convertirlo en un alcance de vuelta a la biblioteca y convertirlo en un color rosa. Perfecto. Chicos, lo mismo. Nosotros sólo vamos a seleccionar este. Copia. Ven aquí y pega. Entonces pongámoslo aquí. Haga clic y arrástralo hacia abajo para que tengamos más espaciado. Por lo que un e-book, de nuevo, el color debe ser de color rosa. Voy a dar click en este y arrastrarlo hacia abajo. Entonces para el texto, quiero ponerlo en 12, medio, algo así, Exactamente, chicos. Entonces, ¿deberíamos Poppins medio 12? ¿ Verdad? Ahora, sólo voy a mantenerlo alineado. Subirlo. Casa de Gucci por Maya Shen. Por lo que éste debería ser un encendedor. Entonces busco algo ligero. Entonces este es el Poppins, pero regular. Y también para que puedas ver ese rosado hasta un poco. Entonces la brecha entre ellos. Yo quiero ponerlo en brecha 16. Aquí tienes. Debe ser 4.8. Y además, busco una estrella. Esa es ser una de estas copias históricas. Y ponlo aquí. No queremos distracción. Lo que significa que este es el color y este es el tamaño, el mismo color. A lo mejor un poco más grande. Por 0.8. Esto debería ser hace diez años. Y el precio debe ser, el otro 9.99. El precio debe ser de 40. Entonces aquí vamos. Asegúrate de que los Poppins, y este debe ser un precio medio. Entonces solo echa un vistazo. Puede hacer que esto sea un poco más pequeño. Trae todo para arriba. Aquí está mucho mejor. Cerca de esto. Echémosle un vistazo. Entonces tenemos que visualizarlo, correcto, 4.8, es muy pequeño. De nuevo, sólo voy a dar click en él y ponerlo en 12. Da click en esta estrella y hazla un poco más grande. Todo va un poco a la derecha. Echemos un vistazo a esto otra vez. Muy bien, bien. Ahora, selecciona este Control de Comando G para agruparlo. Repetir Rejilla. El hueco entre ellos debe ser alrededor de 10. Y eso es todo. Rastrearlo a la derecha. Solo asegúrate de usar diferentes fotos. Está bien. Entonces, ¿y si seleccionamos el audiolibro, qué va a pasar? Así que selecciona esto y desagruparlo. Ir a capa, ver si está agrupada. Por lo que se trata de tres grupos. Yo quiero que sea un grupo, controlar G para agruparlos. Entonces todo un grupo, grupo. Por lo que total grupo y tiene el mismo tamaño o UCI. Entonces éste es justo, ustedes pueden ver que este es el valor y este es un formato totalmente diferente, ¿verdad? Entonces no necesito esto, solo lo voy a arrastrar para escribir. Seleccionar todo chicos y todo. El top de sonda, e-book, audiolibro y todo, y componente crítico. Entonces por defecto, indica esto es cuando haces clic en eBook, ¿qué va a pasar si hacemos clic en un audiolibro? Por lo que tenía un signo más y su estado. Entonces usted nuestro estado más nuevo, ¿verdad? Arrastre éste, correcto. Selecciona esto y hazlo click en el cuentagotas. Y este va a ser del mismo color, este. Vámonos. ¿ Se puede utilizar sentir audiolibro? Y además solo puedo aguantar al Alt y simplemente aumentarlo de izquierda y derecha. Aún mejor. Entonces seleccione todo esto, y esto es, el ancho, es uno o siete, la altura debe ser de 10, 7 también. Lo mismo. Lote de 7. Selecciona cada Piensa y haz clic en 10, 7. Ahora selecciona todo. Mantenga pulsado Mayús 1, 2, 3, 4, 5, 6. Lo mismo. 1, 2, 3, 4, 5, 6. Seleccionado contra tu estado para ir al modo prototipo. Por lo que si hace clic en eBook, mantenga pulsado el control y haga clic son capaces de estar seleccionando. Haga clic aquí. El tipo debe ser auto animado, duración 6 segundos. Y el destino debe ser el estado por defecto. Got come out, selecciona esto de nuevo, ve al estado por defecto. Si continuas controlando haz clic en audiolibro, selecciona esto. Y esto va a ser honesto estado dos. Se quiere ver lo que pasó. Seleccione la placa de inicio. Y sólo chicos, echen un vistazo a esto. Mira. Audiolibros. Audiolibros. Haga click en Diseño ha venido aquí. Haga clic en este y también en éste. Arrastre esto hacia abajo. Control X para salir de esa caja. Seleccionar fuera Comando o Control V. Misil. Llama a esto, mantén estos en un libro. De nuevo, lo mismo. Haga clic aquí. Copia, sal afuera, ven aquí y pégalo, y asegúrate de que está aquí. ¿ Verdad? Y aquí vamos. Haga clic en Repetir cuadrícula. Ve a la derecha, mide, esto es diez. Y aquí tienes. Sudar a lugares frescos, lindas fotos. Y sólo voy a arrastrarlo y soltarlo aquí. Hermosa. Ahora mismo pinchemos aquí y arrastremos este otro bit. Ven adentro. Y aquí vamos y pinchamos en este triángulo está a la izquierda. También, éste. Mantenlo igual también, pero lo dejamos. Entonces este, este eBook. Entonces la cosa es que cuando juegas esto, esto debería haber llegado a la cima también, ¿verdad? Entonces hagámoslo. Entonces solo voy a seleccionar, éste tiene que ser deselecto. Simplemente va a seleccionar estos Comando o Control X. Haga clic aquí si está en defecto, estado, ¿verdad? Entonces haga clic para ir dentro de esta caja, este comando grupal o control V. Así que ahora todo se mete dentro de esto. Ahora haga clic fuera, seleccione el AM y vaya al estado al estado 2. Yo sólo voy a seleccionar esto, esto, todo. Aquí vamos. Y arrastrar todo hacia arriba, ¿verdad? Ahora. Por lo que esto va a ser doblado estados, estado dos. Y veamos cómo funciona. Vayamos al default, estado, casa, juego, un libro, todo se acerca. Trabajo. Audiolibro, un libro. On Qué cool es eso. Me encantaron estos componentes. 87. Uso de la animación de un menú de aplicación de estado componente y prototipos: Ahora diseñemos la barra de navegación inferior. Por lo que solo voy a dar clic en esta mesa y asegurarme de que David sea JSON 50 a 75, y la altura es 61, que es el mejor tamaño para la navegación móvil. Puedes ir algún interés atrapado arriba y abajo, pero normalmente sólo voy a tratar de hacer esto. Entonces no hay frontera, asegúrate de este tablero de arte, solo voy a bajarlo un poco para poder ver éste porque voy a añadir una sombra de gota. El y es menos tres en realidad. Y además, sólo voy a usar este color, pero bajar la opacidad alrededor de 25. Ahora, diseñemos la barra de navegación o el mapa inferior estamos en la barra de menús. Hay muchos nombres para ello. ¿ Verdad? Ahora, Traigamos aquí los iconos. Ya seleccioné algunos de los íconos tú, solo voy a copiar esto. Ustedes también pueden copiar o simplemente pueden seguir aquí en Material Icon Google y encontrar aquí sus propios iconos. Y sólo voy a dejarlo aquí. Bajemos esto. Entonces por defecto, solo voy a empezar con este y asegurarme de que los separes de la manera correcta. Entonces la mejor manera es que solo voy a arrastrar esto. Selecciona todos ellos, asegúrate de que el espaciado esté bien. De nuevo, pulsa Comando o Control G para agruparlo. Seleccione este turno largo, seleccione el fondo, y haga clic en éste. Entonces esto es totalmente y dije, selecciónelo todo, haga clic derecho y desagruparlo. Ahora, sólo para mirar las fronteras, las fronteras son enormes ahora mismo. Entonces éste, por lo que éste, la frontera debe estar alrededor de uno o 1.5. Mejor. Este, No hay manera porque diseñamos este bit feel o los iconos en el campo. Por lo que podemos agregar algún borde aquí, pero que sea blanco y 1.5. Por lo que tenemos el mismo tamaño para la frontera. Lo mismo. No podemos agregar frontera. Mira, así que hazlo un borde de blanco y 0.5. Lo mismo, control seleccionar borde blanco, 0.5. Por lo que todos tienen el mismo tamaño de borde. ¿ Y el color? Sólo voy a Turno. Seleccionarlos todos. Y tú vas. Yo puedo lograr dicho porque uno de ellos es éste. Y me desplazaré selecto. Estos son sólo necesitan sentir. Y aquí vamos. Entonces por defecto va a ser éste, ¿verdad? Por lo que también necesitamos diseñar la segunda etapa. Este. Este, éste, éste. Así que trae este aquí, haz clic derecho y envíalo para atrás. Nuevamente, selecciona esta otra vez y envía este fondo para atrás también. Todo debería renombrarse ahora mismo. Entonces ésta debería ser líneas. Esta biblioteca de una línea. Sólo voy a arrastrar esto aquí y ponerlo aquí. Arrastra este y ponlo aquí. Este también. Y este, yo llamo algo así, estaríamos bien chicos. Si quieres hacerlo alineación perfecta, si lo seleccionas, solo esa flecha izquierda y está perfectamente, aquí vamos. Va flecha abajo, flecha izquierda. Entonces si algo sucedió en izquierda y derecha no importa, solo asegúrate de dar click aquí y simplemente ponerlo en la imagen de la izquierda. Selecciona esta cabeza y hazla un poco más pequeña. Y seríamos amables. Por lo que seleccionamos el hogar, seleccionamos este. Por lo que sólo voy a seleccionar todos estos favoritos de la biblioteca casa. Y también cuatro o cinco, 1, 2. Entonces solo los voy a descomponer. Por ahora. Cada uno de estos necesita un color. Yo sólo voy a hacer esto. El erudito. También. Yo sólo voy a escribir aquí, que va a ser a un píxel. Y también mediano. Algo así, y del mismo color. Entonces copiemos esto aquí y llamemos a esta biblioteca. Para encontrar un color muy fresco para ello. Iba a apuntar esto, arrastrar esto hacia arriba. Me encanta este color. Selecciona este y haz que este sea del mismo color. Entonces el duro probablemente ya sepa que es rojo. Pero no tan rojo. Este rojo. Un poco más ligero. Va a ser favorito. Recoge el cuentagotas y hazlo rojo. Y éste debe ser verde. Y sólo voy a llamar a este perfil y también verde. Por lo tanto, asegúrese de que estos estén seleccionados. Y en la parte inferior, que los va a alinear. Lo mismo con esto. Alinearlos y traerlos aquí en el centro. Esto también es para mantener pulsado Shift, seleccionarlos y alinearlos desde la parte inferior, y también alinearlos desde el centro. Además, tenemos que hacer algo como esto chicos, solo voy a arrastrar esto, sólo voy a seleccionar el cuadro aquí. La meca es redondeada. Selecciona todo este municipio, selecciona este. Haga clic con el botón derecho del ratón en, hacia atrás. Entonces sí, por favor en la espalda puede arrastrar esto hacia arriba. También puede arrastrar esto hacia arriba. Aquí. El límite. Asegúrate de que este sea del mismo color, el fondo. Ahora, arrastra esto a la izquierda. Entonces se te ocurre la idea. Algo así estaría bien. Está bien, ahora sólo vamos a arrastrar esto. Por lo que este rectángulo está tranquilo. Y su contrato es a la derecha. Así a la cima en el centro. Entonces para los números contratistas la izquierda. Entonces selecciona este árbol, manda Control G para agruparlos. Selecciona este árbol, vuelve a G para agruparlos. Seleccione esta. Seleccionar Control de Comando G. Así que este grupo está en casa, esto es biblioteca, esto es favorito, y esto es por archivo. Seleccione estos cuatro, mueva, seleccione el Fondo, haga clic con el botón derecho y envíelos a la espalda. Asegúrate de hacer algo como esto. Arrástrelo hacia arriba. Entonces exactamente yendo detrás de eso. Arrástrelo hacia arriba. Arrástrelo hacia arriba. Así que asegúrate de ponerlo, todo el asunto. Arranca hacia arriba. Y lo mismo, me levanto, me voy. Entonces va a ser algo así como estos tipos tienen razón. Esto es genial. Ahora, selecciona todo, lo selecciono todo. Asegúrese de hacer clic en componente. Entonces esto va al signo de estado por defecto más, nuevo estado. Esta va a ser casa en tu Biblioteca Estatal, ¿verdad? Sí, estado, fav, perfil estatal. Ahora volvamos al estado por defecto. Entonces en defecto el estado, esto es lo que tenemos. Arrastre esto aquí. Y voy a duro a casa. 10 auf. Seleccione el hogar. Aquí vamos. Otra vez. Biblioteca, el fondo, arrástrelo hasta aquí, apáguelo. Y todo el asunto. Ya basta con diez. El fondo, tráelo aquí. Apague. Y pero éste antes de un 10, todo apagado. Voy a hacer algo así. Entonces es como si esto viniera desde adentro. Ahora arrástrelo hacia arriba. Entonces hagámoslo también. Entonces veremos a casa desde adentro, está saliendo. Por lo que opacidad. Si lo leemos como grupo. El perfil. Aquí tienes. Aquí tienes, y visita. Y este va a ser nuestro estado por defecto. Ahora mismo sabemos qué hacer. Todo está volviendo a la normalidad. Si haces click en Inicio, esto es lo que solo van a seleccionar. Este. Este cancela, éste, arrástrelo hacia arriba. Este. Va a ser así. Haga clic en el Inicio, arrástrelo hacia la derecha. Y esto va a ser muy interesante. Selecciono éste. Trae nano gasolina. Entonces este va a ser el hogar, pero dentro del hogar, esto está demasiado cerca. En casa. Deberías arrastrar esto hacia la derecha. Práctica. A la derecha. Esto sólo va a pasar en casa. Entonces si vuelves a la biblioteca de nuevo, porque su estado predeterminado de las cosas retrocediendo. Entonces en un modo de biblioteca, selecciona este, arrástrelo hacia arriba. Seleccione esto, arrástrelo hacia arriba y también seleccione éste. Arrástrelo hasta la opacidad. Aquí tienes. Sostén el control y selecciona esta cosa a la derecha. Este, no necesito una tonelada de opacidad. Vuelvo a seleccionar el fondo. Gracias. A la derecha un poco. Muy bonito. A lo mejor debería estar alineado. Agradable. Lo mismo si haces click en este triángulo es a la derecha y arrastras a la derecha. Entonces esto va a ser biblioteca. Vayamos a la fe click y esto derribe la opacidad. Por éste. Esto es lo que hacemos, lo va a arrastrar a los Sordos que mordieron. Y quiero mover esto. Y también yo sólo voy a mover esto aquí también . Aquí vamos. Agradable. Esto es, así que esto va a ser favorito y va a ser el perfil. Aquí. Éste viene a la izquierda. Por lo que constantemente se fue. Y esto se va a hacer. Ahora, tenemos que ir a Prototipo. Si soy, digamos si en defecto el estado y hago click en el Inicio, click en este pequeño ícono aquí, ven a auto animar. Un destino será hogar. O abajo Control, haga clic en el seleccionado de la biblioteca. Elige la biblioteca, controla, selecciona, haz clic en un fav de 20 minutos, luego deslízate. Creo que debería serlo. Está EN FUERA y seis segundos. Y este está diciendo está adentro, afuera, es mucho mejor. ¿ Verdad? Control. Haga clic en el perfil seleccionado, por lo que se activa. Perfil. Así que selecciónala de nuevo, ve a casa. Si estás en casa, y selecciono el Inicio, haz click en él. Debería volver al incumplimiento, state. Si hago click en, la Biblioteca, debería ir a biblioteca, algo. Fave y click Perfil. Seleccionar fuera, volver a hacer clic dentro, ir a biblioteca. Para la biblioteca para una biblioteca de silicio, va a ser el control estatal por defecto. Haga clic en el Inicio, me lleva a casa, me lleva a preferir. Y el archivo pobre seleccionar. Estamos en fav. Si hago clic en fav, volvamos a la predeterminada, el perfil estatal. Vayamos al perfil, biblioteca. Ella está activa. Acude a biblioteca y a casa. Se va a casa. Por lo que fuera seleccionan de nuevo. Y el último es perfil. Por último perfil haga clic en Perfil va a ser por defecto. El click estatal en el fav va a ser fav. Haga clic en biblioteca va a ser Biblioteca y seleccione el hogar se va a convertir. Ahora vamos a dar click aquí y ponerlo por defecto, el estado seleccionando barra de navegación. Y vamos a probar esto. Kilogramo. Porque nuestro dispositivo de pruebas hermoso. Ver el espaciado está cambiando con frecuencia en él. Se está volviendo al incumplimiento. Veo un pequeño movimiento que lo hace muy interesante. No trates de volverlo loco, como voltear, subir y bajar, algo de chapoteo en él. No funciona en el mundo real. Entonces esto es genial, simple, y hermoso. Para que sepas exactamente dónde estás. ¿ Verdad? Ahora. Selecciona el diseño seleccionado, y arrastrémoslo. Seleccionemos este. Entonces tenemos que ponerlo aquí en esta línea aquí, sólo voy a arrastrarlo y ponerlo en esta línea. Está bien, genial. Ahora probémoslo. Tan como plato de casa. Entonces arriba y abajo. Entonces esto es lo que pasó. Está subiendo, ¿verdad? Así que asegúrate de que al hacer clic en él, la posición fija esté activa. Por lo que de nuevo, haga clic en un plato de inicio. Entonces significa que si voy arriba y abajo, solo pegas este fondo. Y va a funcionar maravillosamente. Impresionante. A mí me encanta. Está bien, esto es genial. Ahora ya terminamos. La barra de menús en la parte inferior. 88. Animación simple de prototipos sencillos: Hagamos algo de animación. ¿ Qué pasó si hacemos click en este pequeño ícono aquí, la barra de búsqueda? Entonces veamos qué pasó. Entonces la cosa es que solo voy a seleccionar, Shift, seleccionar todos estos. Y vamos a dar click en los componentes que quieras. Solo voy a seleccionar aquí y cambiar este color para descartar. Es mejor. Entonces este va a ser el estado por defecto. Tan neo estado, va a ser así. Haga doble clic aquí. Turno, haz esto recto. Ahora, haga clic aquí. Y cuando haces doble clic aquí, ves estos puntos. Entonces, elimínalos, solo los primeros. Entonces sólo voy a eliminarlos hasta que el último sean dos. Así que asegúrate de solo seleccionar este. Por lo que se elimina el top. Cuando hago zoom, veo algo como esto. Sólo voy a rastrear esto arriba o abajo Shift y arrastrarlo hacia arriba. Seleccione este, arrastre estos son desplazamiento paralelo, y selecciónelo de nuevo y arrastre esto hacia arriba y tratando de hacer esta bonita curva, algo así. Ahora, selecciona este, mantén pulsado, Shift, selecciona éste y también éste del Zoom Mac. Haga clic en Tecla de flecha. Agradable. Ahora salir afuera, arrástralo hacia arriba. Por lo que esta barra de búsqueda va a ser así. Está llegando a aquí y la opacidad va bajando. Lo mismo que hacemos es ir a la derecha y la opacidad está abajo. Ahora, selecciona esto, va a por defecto este día. Si Control, haga clic en este y vaya a seleccionar esto y asegúrese de destino Estate T2. Entonces si estás en el estado dos, si haces clic aquí o aquí, va a volver al estado predeterminado. Por lo que solo voy a dar clic aquí, volver al estado por defecto, casa. Vamos a jugarla. A ver lo que obtienes. Agradable. Entonces es como, Es, este se está comiendo estos textos. Tan hermosa. Es muy mínimo y efectivo. Entonces esto es lo que hacemos con la animación. 89. Diseño y animación de prototipos de aplicaciones en las categorías de aplicaciones: Entonces este es el enorme proceso por ahora. Yo sólo voy a dejarlo. Si haces click en esto, algo muy cool va a suceder. Vengamos a explorar. Si hacías click en este género iba a suceder. Vaya al modo de diseño, alt, Shift, y arrastre esto hacia la derecha. Yo sólo voy a llamar a este género. Y yo sólo voy a quitar todo. Vamos a dar click en esto y eliminarlo. Ya no necesito que sepan exactamente lo que pasó. Y ya ves, todo es totalmente diferente. Voy a desplazar selecto esto porque necesitamos éste. Copiar, seleccionar afuera, ven aquí y pégalo. Ahora, arrástrelo hacia arriba. Por el top one. Volvamos aquí y arrastremos esto, copiemos esto, y péguelo aquí. Y asegúrate de que sea exactamente así. Y este es el espacio más fresco entre ellos. Check down es 10, exactamente el espaciado, ¿no? Entonces solo lo pego dos veces, 92 rojo. Entonces el género está aquí. Y así podrás volver al género también. Entonces esto es algo que tienes que poner aquí, arrastrarlo un poco. Ahora, vamos a traer algo de texto aquí. Yo sólo los voy a poner aquí. Es lo mismo que eso toma que ponemos aquí. El SEMMA, las estacas, sólo copiarlas, traerlas aquí. Entonces también necesitamos tipo de toma hay otra. Y yo sólo voy a eliminar algunos de estos y arrastrar todo hacia arriba. Ahora, vamos a seleccionar todo. Componente. No seleccione esta y salga de esta caja aquí. Y asegúrate de que la capacidad sea 0. Así que arrastra esto aquí. Entonces este es el estado por defecto. Si haces click en Audio, ¿Qué va a pasar? Vayamos a nuevo estado. Estás en el estado de Nueva York ahora mismo. Esta va a hacer. Está bien. Bueno, soy viejo y esto va a pasar más grande. Selecciona un cuentagotas de ojos de libro electrónico. Aquí vamos, el color de audio. Y éste tiene el interruptor con éste va a traer éste aquí. Está bien, eso va a rastrear esto a la izquierda. Está bien, y aquí vamos. Volvamos al defecto al prototipo estatal. Si Control click, haga clic aquí, vaya a animar, state to click outside y click back state to efectivamente puede e-book seleccionar dos estados por defecto activados. Muy bien, volvamos a dar por defecto al estado y a ver qué pasa. Pero si hago clic en este pequeño género de iconos, solo voy a arrastrar esto y ponerlo aquí. Va a ser el tobogán a la izquierda. Por lo que el tipo es transición y la disolución es una ligera izquierda. Si hago click en esta atracción es a la izquierda, quiero volver atrás. Entonces esto es ligeramente a la izquierda o se desliza, a la derecha. Veamos qué pasa. Por lo que esto se mueve hacia la izquierda y la derecha. Si hago click en el género, bonito, HUAC. Impresionante. Género. Ve en CU. Todo funciona perfectamente. Bonito. Me encanta. Género. Audio, e-book. Ver la transición. ¿ Qué hermoso es eso? ¿ Impresionante? 90. Barra búsqueda de diseño profesional y animación de prototipos: Ahora vamos a traerlo a aquí poco. Entonces solo voy a mantener presionada Alt y arrastrar esto hacia la derecha. No necesitamos esta parte. Yo sólo lo voy a quitar. Pero me pregunto línea, sólo voy a seguir seleccionando aquí. Sube la línea hasta aquí. Muy bien, bien. Y en algunos textos como Control X, Control V, como top selling, al hacer clic en buscar, el ajuste superior es una de las opciones aquí. Y debe ser en radio ahí. La mayor parte del campo es más ligero. Y busco un ícono que ya tiene va a ser éste. Al igual que el Senado superior. ¿ Qué va a pasar si hago click en esto? ¿ Qué va a pasar con esto? A éste se va por aquí. Y esto va a bajar. Nuevamente, éste está girando. Va a pasar lo mismo. Haga doble clic y sólo voy a eliminar todo lo que está en la parte superior. Lo mismo. Voy a hacer zoom a lo largo de Shift para que sea una recta mantenga presionada Mayús para que sea una recta. Arrástrelo hacia arriba. Arrástrelo hacia arriba. A lo mejor arrastrarlo hacia abajo. Escríbelo. Agradable. Ahora, selecciona este un árbol con turno, zoom hacia atrás y tecla de flecha y son exactamente lo que estoy buscando. Oscilar fuera seleccionado. Y aquí vamos. Por lo que necesitamos crear algo como parpadear. Entonces para crear el parpadeo, quiero algo más y algo así. Entonces en este, esta opacidad debería enfriarse. Ves la cobija. Entonces significa que si hago click en este prototipo y vamos a ir a esta multa con auto animate 6. Segundo en su salida. Pero cuando estás en esta página, esta página debería ir a ésta y volver atrás, ¿verdad? Y vamos a seleccionar el de arriba, arrástrelo hacia la derecha y ponerlo a tiempo. El tiempo de animación es, hay seis segundos. Veamos qué pasó. Si hago clic en esto, esto sólo vuelve a éste también. Entonces si hago clic aquí o hago clic en este pequeño bar de aquí, me trae de vuelta. Entonces si hago clic aquí, me trae de vuelta. Ahora veamos qué pasó en esta página. Si hago clic en este icono de Capa. Hermosa. Mira. Es exactamente como si estuviera animando. Agradable, vuelve. Bonito, más vendido, hermoso. Echale un vistazo. Me encantó este tipo de cosas Y me encanta Adobe XD. Es fácil hacer eso. Muy bien, así que diseñamos y animamos. De acuerdo, una vez más. Echémosle un vistazo. Cuando la primera página, buscará. Por lo que C no es como tú ahora mismo. Entonces es genial. Audiolibro, género. Audio, e-book de baliza para una búsqueda. Perfecto. Volvamos atrás. Volvamos atrás. ¿ Y si hago clic en biología? ¿ Qué va a pasar? Este va a ser nuestro próximo diseño. 91. Diseño y clasificación de prototipos con base en categorías: Entonces si hacemos clic en biología, deberíamos ver una categoría de libros de biología y ordenados por venta o calificación. Y también podemos ver alguna categoría. Podemos dar click en. Así que haz click en género y Alt, arrástralo a lo largo del turno Señorita va a llamar a esta biografía. No necesitamos estos. Simplemente voy a quitar esto y hacer doble clic aquí o UCI. Lo primero que necesitamos es algo así como estos tipos. Aquí vamos. A lo mejor voy un poco a la derecha. Esta indagación al general. Simplemente lo voy a dejar aquí. Se 12. Déjalo aquí. Y éste debe ser muy ligero. Y también el fondo debe ser muy ligero también. Entonces hay un general esta es la brecha entre ellos. Es tapa redondeada. Y también muy ligero. Esta es la categoría a nuestra biología como compositor. También necesitamos éste. Voy a hola Ally. Asegúrese de que negro, tapa redondeada, Comando o Control D para duplicarlo. Y asegúrese de que el pulmón seleccionado 90 grados Desplazarse para arrastrarlo y hacerlo más pequeño. Vuelve a G para agruparlo. Necesito ponerlo aquí, o probablemente quiero ponerlo aquí y arrastrarlo hacia abajo. Tan baja opacidad. Así que selecciona todo. Ir al componente. A este estado por defecto es el nuevo estado. El Estado dos va a ser algo así. Controla tanto tiempo y selecciona el fondo, algo así. Y voy a desplazar todo a la derecha. Y aquí vamos. Yo sólo lo voy a poner aquí. También realiza un seguimiento de esto a la derecha. Tengo algo aquí. Capacidad anclada. Ahora. Seleccionado. Llénalo con éste, y esto va a ser general y esto es ligero. Veamos la animación. Si estás en prototipo de estado por defecto, si selecciono un general, si va al estado dos, si estamos en el estado dos, si hago clic en este ícono aquí, para cerrarlo, debes ir volver al estado predeterminado. Entonces volvamos al estado por defecto. jugó fuera. General, lindo. Entonces aquí, si voy al estado 2, ahora a veces esto es muy inteligente el clicker va a diseñar. Y voy a seleccionar algo a su alrededor. Pero sin frontera. Nuffield todavía tiene a estos chicos mirar. Entonces solo voy a seleccionar este comando o Control X, haciendo doble clic y pegarlo. Por lo que estamos en el estado para dar click en este estado por defecto. Entonces ahora si hago clic en él, si voy aquí, se va a activar. Bonito. Icon está volviendo a las capas. Aquí. Yo sólo voy a volver a Diseño. Presione T, y ordena por más vendido. Vámonos aquí. Por lo que este es 12 regular y el color debe ser éste también. Y para clasificar, necesitamos hacer algo como estos tipos. Gorra redondeada. Hágalo también. Aquí vamos. A ver. Bonito seleccionado. Haga clic en este turno en línea, atrás, selecciónelo y arrastre esto hacia atrás. Selecciónelo todo y seleccione éste. Y grupo dos. Éste debería ser un poco más obvio. Vamos a dar click en esto o vamos a seleccionar uno de estos. Y cambiaré selecto Copiar. Ven aquí y pegarlo. Este es enorme. Esta más pequeña. Sólo lo voy a poner aquí. Alineación esto. Todo lo demás debería estar aquí. Entonces si selecciono todo Comic-Con a través de G para agruparlo, Repetir Grid, arrástralo hacia abajo. Esto es lo que tenemos. Vámonos a cubrir. Arrástrelo aquí. Enfriar. Vamos adentro. Hagamos esto. Número dos. Yo quiero poner todo dentro de esto. Sólo voy a arrastrar esto un poco. Seleccionar todo. ¿ Voy a hacer un poco aquí? Entonces estoy dentro de esta repetición de rejillas van a leer. Entonces digamos afuera, entonces esto es componente. Por lo que en defecto exterior aquí en este estado de enfermedad para escribir a la finca por defecto, seleccione esto. Seleccione, tal vez solo vaya a traer este y selecciónelo y arrástralo y soltarlo. Entonces en estado predeterminado tienes algo como esto, pero en un estado para afirmar dos. Y veamos si podemos cambiar esta bioplaca. Bonito. Entonces el saber exactamente lo que estamos haciendo. Todo cambiando. Hermosa. Ahora haga clic en la biografía, haga clic en prototipo. Y cuando hacemos click en esto, esto debería suceder. Es como un empujón. Disolver es empujar a la izquierda. Si hago click en bio, debes ir a empujar a la izquierda, empujar a la derecha. Entonces esto se va a empujar ¿verdad? Esto es lo que pasó. Si una bio Gilligan. Volvamos atrás. También podemos hacer algo así. Si hago click en esta biografía y si hacemos click en componente a, pero si, si me muevo sobre esto, entonces puedo hacer clic en ella y luego podemos ir el siguiente paso por ti. Entonces cuando haces click en Boeing o algún momento esto ha sucedido. ¿Por qué? Porque ya tenemos un componente en esta página. Y cuando se quiere agregar algo dentro ese componente sólo nos va a dejar fuera, es decirnos crear este. Fuera de esto, podría dar click en este video y nuevo estado. Entonces no deberíamos tener en el USDA, volvamos atrás. Lo que queremos es Horace estados en hover. Esto va a ser algo así. El color cambiará. Por lo que control-click que se necesita sería algo así como éste. Biografía. Ahora, hemos creado el día de Horace. Ahora aquí, si hago clic en esta finca de terror y estoy importando el tipo, puedo arrastrar esto y soltarlo aquí. Y lo estoy diciendo en transición, empuja a la izquierda. Así que asegúrate de que éste esté en un lugar seguro. Normalmente lo pongo encima de esto. Entonces un exactamente lo que tenemos. Si hago clic en género, si paso el cursor sobre esto, mira, es como tu web. Entonces es un empujón. Pero debido a que no tenemos una aplicación hover y móvil, solo vamos a poner esto aquí por ahora. No importa si todo el estado se cierne. No obstante, no quiero que esto suceda. Y hover, quiero lo mismo, mismo color, cuadrado dentro del hover. Y luego arriba. Pero lo que yo quiera, algo así. Yo quiero una caja que es de aquí para aquí. Es como si estuviera presionando algo. A lo mejor todo el espacio. Y quiero descubrir y derribar la opacidad. Y quiero enviarlo a la parte de atrás. ¿ Verdad? Ahora, Vamos a arrastrar esto afuera. Hagamos click en género jugado. Mira, si presiono mi ratón, eso va a pasar. Por presionar mi boca, eso va a pasar. Por lo que necesito aumentar la altura, sujetar a Alt y aumentar la altura o la longitud. Haga clic en género. Prensa. Para que sepas exactamente en qué estás haciendo clic. Correcto. 92. Animación especial de drag en BookStore: Correcto, Vamos a animar la página de inicio. Pero después de seleccionar esto, desagruparlo. Ahora de nuevo, tengo que agruparlos. Haciendo eso. Nuevamente, mantenga pulsado Shift y duplique esto. Si arrastro esto a la izquierda, quiero decir es algo así como u. y si vengo y solo selecciono uno de estos, ve al prototipo, arrastra esto a éste, mide los disparadores y arrastra auto animate, seleccionar todo el asunto. Y la otra mesa de trabajo. Arrastre esto a la izquierda. Y veamos qué pasó. Puede hacer clic en esto y arrastrarlo hacia la izquierda y arrastrar hacia la derecha. Hermosa. ¿Y la animación de éste? Yo quiero animar esto. Entonces esto es 24, ¿verdad? Sólo voy a llamar a esta pic para poder recordarla. Entonces este va a ser nuestro pico. A ver. Un recluso es perfecto. Dentro de este pico. Este pico. Tenemos que tener algo interesante. Yo sólo voy a dibujar una caja aquí. Entonces quiero ver si va a estar en forma aquí. Todavía grande, tal vez un poco más pequeño. Ahora sólo voy a probarlos por un centro. No está mal, quizá un poco más pequeño. Está bien, vamos a ver. Yo sólo voy a poner en el centro. Genial, me encanta esto. Yo sólo voy a agrupar estos mando o control G para agruparlo. Por lo que éste está dentro de un grupo. Yo sólo voy a llamar a este pico máximo. Pico. Tenemos tema. Pongámoslo en la parte superior. Tienes rectángulo sobre él. No es necesario tener el borde seleccionado. Asegúrate de que puedes soltar sombra. 3 debe ser 0 en y Este debe ser 20. Sombra de gota. Yo quiero que este Comando o Control D duplique esto llamado Shift, que sea aún más pequeño. Arrástrelo hacia arriba, nanotube drop shadow. Subamos a esto y probemos esto aquí. No necesitamos éste. ¿ Verdad? Y yo sólo voy a escribir algo aquí. Para que pueda salir y entrar. Entonces solo voy a dar clic, solo voy a estar aquí en tema. Vuelve y Julia a veces cuando copiamos esto, salgan afuera. Entonces sólo voy a volver al tema. Entonces teclea cosas, vaya encadenado. Sólo lo voy a poner aquí. De lo que tenemos, sí tenemos estrella, copia, control, click en esto. Se ha acercado y Control V. Así que sólo lo vamos a copiar aquí. Asegúrate de que solo voy a llamar a esta estrella y ponerla dentro del tema. Asegúrate de que sea amarillo. Y repite grilla. El vacío debe ser para desagrupar. Ir a ajustar el grupo y sólo llamar a esta estrella en el centro. Da click en uno de estos y hazlo de cuatro estrellas. ¿ Verdad? También. ¿ Qué más tenemos? Arrastra un rectángulo, obtén esquina. Y yo sólo lo voy a poner aquí. Tau. Entonces Wuji Comando Control D, duplicarlo, ponerlo por encima del rectángulo. Entonces sólo lo ponemos dentro. Entonces está fuera de esta caja. Hacer este 12, podemos llamar a esto romance. Cambiemos el color a algo así, a pesar de que también tenemos que cambiar esto. Hermosa. Entonces este rectángulo y romance. Un controlador seleccionado y llegar con dos G. Y aquí vamos. Tenemos esta fantasía. Bueno, Vamos a hacer necesitamos, necesitamos copiar estos antecedentes o control pulmonar retención seleccionada en Alt y arrastrarlo hacia abajo. A lo que yo llamo. Ahora, dibuja aquí un rectángulo. Asegúrate de volver por el color a nuestra frontera, baja la opacidad por lo que necesitamos ver dónde estamos. Simplemente yendo a dar la vuelta a las esquinas. Me encanta, perfecto. Y sacarlo a la luz. Turno, selecciona sólo estos dos, ¿verdad? Y se cruzan. Necesita tener una sombra de gota, puede arrastrar esto hacia arriba y llenarlo con este hermoso color. Seleccionar esta selección es que pueden arrastrar esto un poco hacia abajo . Seleccione esta. Simplemente selecciona Control. Voy a salir de ella. Selecciona esto, arrástrelo un poco hacia abajo para que sea totalmente partido. Si seleccionamos este, casa de Gucci Command o Control D. Y puedo arrastrarlo hacia abajo y ponerlo aquí y hacerlo blanco. Simplemente voy a escribir más info. Y 14 es genial e impresionante. Entonces ya ves, aquí tenemos el pico superior. Sólo voy a arrastrarlo y ponerlo aquí. Además, necesito aguantar Alt y Shift y arrastrar una copia de la misma y ponerla aquí. Arrástrelo un poco hacia abajo. A lo mejor aquí. Haga lo mismo, arrástrelo un poco hacia abajo. Entonces tenemos tres temas, está bien, pero tenemos que hacer es, voy a cambiar el ícono de esto. Si este tipo y este, hicimos Joker. O con esto, me encanta todo, todo en un mismo lugar. Apenas el nombre de esto. Esta es una. Este es el tema uno. Este va a ser el Tema 2. Simplemente haremos eso. 22 y 23. Seleccione estos tres. Y otra vez, conviértalos en grupo. Grupo denominado animación. Por lo que todo va a estar dentro de esta caja de animación. Entonces digamos afuera click. Y este cuadro de animación va a ser 0 pasando click en Home Alt y arrástralo hacia la derecha. Entonces el escenario es, yo quiero sólo este, no el otro. Entonces cambia, selecciona todo lo demás, arrástralo hacia la derecha, baja la opacidad. No necesito éste. Eliminar. Éste borrar. Deberían suprimirse todo. Y borrar. Turno seleccionar. Vamos dentro de ella y arrastremos esto a la izquierda. Aquí vamos. Control. Da click en este y hazlo un poco más grande. Ves estos rincones. Arrástrelo dentro. Ahora. Puedo arrastrarlo a la izquierda. Bajar la opacidad, mantener pulsado el control y seleccionar la foto, mantener presionado Alt u Opción arrastrar hacia la izquierda. Y este va a ser nuestro fresco trasfondo. Seguir, hacer la opacidad en 50 pixel. Ahora es el momento de traer esta animación, sacarla y sacarla así. Aquí vamos. Muy bien, Bien. Ahora veamos la animación. Control. Haga clic en este, prototipo de pista. Este es el control de tablero de arte. Haga clic en este, arrastre esto en el artículo. Por lo que va a ser sin explotar. Transición ahora está mal. Debe ser un auto animate debe estar en 1 segundo. Facilidad de entrada, facilidad de salida lo mismo. Control-click. Cotizaciones, animo. Animación de 1 segundo, facilidad de entrada, facilidad de salida. Entonces vamos a plato. Impresionante. A mí me encanta. ¿ Ves qué hermoso y genial es eso? ¿ Encantadora? Encantador. No hay error. Todo es suave y perfecto. A mí me encanta. Ahora. Seleccione este. Entonces todo es perfecto. Sólo voy a arrastrarlo un poco a la derecha. Seleccione esto también. Por lo que cada parte superior de estos, necesitamos un pico como este. Por lo que presiona Comando o Control D. Tráelo aquí y bájalo. Imagen. Esta debería ser esta señora. Está bien, genial. A ver. Hermosa. Y arrastra esto de nuevo a la izquierda. Trae las fotos. Arrastre esto aquí. Por lo que estos dos son de relleno cero. Entonces, vamos a nombrar eso. Entonces este es el número 2, pico al número dos, P3, número crema. Ahora bien, ¿qué necesitamos? Por lo que al mirar este sistema un árbol y hablarle , algo así. Selecciona este y selecciona solo estos dos. Alt y arrastre esto hacia la izquierda. Entonces tenemos éste. Ahora, selecciona el tema 2 y control de dos puntos y selecciona éste también, o Alt, y arrástralo hacia la derecha. Ahora cambia el sigue este. Y ahora podemos hacer la animación, arrastrar esto hacia la derecha. ¿ Verdad? Lo primero que hacemos es derribar a uno de estos gobernantes de aquí a aquí y a uno de los gobernantes de aquí a aquí. Entonces sabemos exactamente dónde poner las disciplinas. Y también esto, así que haga clic en esta opacidad desacoplada. Claro, salvamos éste y éste, tecla de flecha derecha. Yo sólo me muevo a la izquierda. Al igual que esto. Y esto y tráelo aquí. Apenas con la tecla de flecha, asegúrate de que estén perfectamente alineados. Ahora, sólo digamos el pico, rosa hacia abajo opacidad. Este, Shift, selecciona éste y sólo arrástralos hacia arriba. Ahora, solo selecciona esto, asegúrate de hacer lo que es y nuestro píxel. Así que baje esa opacidad a 50, recoge esto. Y esto debería venir aquí. Impresionante. Ahora, echemos un vistazo. Si selecciono éste. Si selecciono un pico de tema a pico uno. Prototipo de endurecimiento, arrastre a éste. Entonces el gatillo es drag, ve a animar. Aquí lo mismo. Eso grande para arrastrar porque lo son. Entonces, animémoslo y veamos cuál es nuestro curso. Perfecto. Agradable. Entonces cómo podemos hacerlo mejor. Selecciono esto usando, debería estar usándolo fuera. Seleccionando usando su app. Entonces va a ser más suave. Mira. Hay un rezago. Yo creo. Ponlo ahí. Ninguno. Ninguno. Este también. Deberían ser nueve. Y cuando hago clic en estos dos, éste, creo que puedo ponerlo en un chasquido. A ver qué pasa. Si hago click en esto. Esto es snap in place. Esto retrocede. Corriéndose al lugar. Ahora puedo arrastrar. Perfecto, Impresionante, me encanta. Pero ahora si hago clic en Más Info, lo que va a pasar va a ser el siguiente video. 93. Diseño de una página y animación de prototipos de una sola página: Ahora mismo es el momento de diseñar la sola página. Entonces significa que si hago clic en Más Info, ¿qué va a pasar? ¿ Verdad? Simplemente voy a seleccionar uno de estos y Alt Shift y arrastrarlo hacia la derecha. Elimina todo. No los necesitan. Simplemente voy a dar click en este clic derecho. Desagruparlo. No los necesito. Biografía. Trae esto aquí. No necesitamos éste. Entonces vamos a algún ícono aquí. Yo sólo voy a necesitar este. Por ahora. Pongámoslo aquí. ¿ Qué más necesito alguna en este también? Pongámoslo aquí. Hazlo del mismo color. Por lo que es Add to Cart y asegúrate de que todos estén igualmente espaciados, igualmente centrados. Ahora está alineado con éste también. Tan perfecto. Entonces vámonos aquí y sólo voy a copiar este. Tráelo aquí, asegúrate de que sea un más pequeño. Aquí. Sí tengo algunos textos y algunos iconos para esto, así que no perdemos el tiempo, ya sabes, de dónde sacar todo esto. Y el diseño es espaciado. Es muy sencillo. Lo mismo. Imprimamos este $1.9, 0.99, y también lo hagamos morado. ¿ Qué más necesitamos? De acuerdo, vamos a crear una caja. A lo mejor. Ese es el radio polar. Para. Esta va a ser una muestra gratuita. Por lo que puedes hacer click en él y puedes leer alguna parte de los libros para éste. Y este es el muy, muy cool, creo. Simplemente voy a usar esto y también para esto y usar esto mucho mejor. Gracias. Tan bien, así que agruparemos este es el grupo dos, así que ya va a llamar a esto. Seleccione el fondo. Asegúrate de que este es el rincón. Y hazlo bien. Lo mismo, copiar, pegar. Hazlo un poco más pequeño. Aquí vamos. Volvamos a los iconos. Necesito el botón más. Aquí y aquí, pega. Aquí vamos. Centro, centro de alineación. Esto debe ser morado. Esto es debe ser una muy ligera. Morado. A lo mejor bajar la opacidad. Entonces aquí vamos, contrariamente a contribuir a comprometer el top one. Asegúrate de que sea un muy oscuro. Así que selecciónelo, síguelo, desagruparlo, turno, seleccione. Este, se asegura de que estos estén en un centro. Hermosa. Por lo que esta seleccionada y esta seleccionada, dar click en Componentes. Entonces este es el estado por defecto. Si hago clic en el signo más, nuevo estado debe ser el número dos. Número dos, asegúrate de que esté alineado. Y este también es un pasivo es alto y los números deben ser 18. Y a rayos X. Nuevamente una vez más en un plus firma tu estado 3. Se trata de tres. Veinte y siete. Noventa y siete. Correcto. Volvamos a la finca por defecto. Si hago clic en este signo más, ¿qué va a pasar? Vamos al prototipo, pestaña activada, auto animate. Y va al número 2. Si estás en el número dos, ¿qué va a pasar? Si hago click en este signo más, va al número 3. Pero si hago clic en el signo menos, voy a volver al estado por defecto. Si estás en un número tres, haz click en Menos. Adelante y veamos qué pasa. Jugar. Bonito. Hermosa. Está bien, solo, pongamos esto en estado completo así que va a ser normal. La otra cosa que mi cliente quiere, está cambiada a audiolibro. Y quiero ponerlo aquí. Si lo presionas, solo va a cambiar todo y solo puedes, en lugar de leer, solo podemos escucharlo. Entonces volvamos atrás. Entonces aquí tenemos algo llamado sobre esto, pero déjame simplemente poner esto en el centro. Sólo ven aquí. Y yo estaba pensando en copiar uno de estos y también copiar sentado afuera y pegar. Vamos a arrastrarlo hacia arriba. Debe tratarse de este libro o e-book, que es ebook. En realidad. Tenemos algo de texto, podemos ponerlo aquí para que podamos jugar con él. Texto tan aleatorio. Está bien. Permítanme simplemente agrupar esto. Bajen esto. Esto va a ser calificación y reseñas. Entonces la parte de calificación, solo voy a copiar esto para traerlo aquí. Entonces este va a ser de este color. A lo mejor hacerlo un poco más grande. Este va a ser de un color más oscuro. También. Semi negrita. Algo así. Repetir rejilla capturó el piso. Y ve a mirar. Y van a entrar en uno de estos. Eliminar. Éste debería ser éste. Ven al centro. Agrupar esto. O tal vez pueda alinear esto aquí. Veamos cuál es mejor. Nosotros decidimos. Y necesitamos algunas calificaciones. A lo mejor ponértelo por tal vez siete. Gorra redondeada. Aquí vamos. Por lo que esta va a ser la escritura controlada de fondo obligada. Cambia el color. Imprimiendo esto hasta aquí. Por lo tanto, seleccione estos dos. O tal vez solo ponga un número aquí. Esto van a ser cinco. ¿ Todo bien? Entonces cinco. También este tipo de 5. Color medio. Bonito. Ahora selecciona todo, manda Control G para agruparlo. Ahora podemos usar la cuadrícula de repetición fácilmente. Escribe cinco. Principalmente el texto es Grande. 12 mejor. Y hacer que se alinearan. Porque creo que puedo criarlo. Agradable, Esto es bueno. Ahora desagruparlo y selecciona éste. Eliminado. Selecciona este y tráelo hasta aquí. Bueno, soy Shift, click, mantenga pulsado, shift click. Y cuando lo hagan. Entonces, la mayoría de la gente acaba de seleccionar el número 5, seleccionar todo y un poco Control G a grupo. Seleccione aquí y seleccione aquí. Queremos saber cuántas personas votaron realmente. Entonces solo voy a teclear aquí como las críticas. Sólo ir a poner total es asegurarse de que esto sea capital. Entonces sólo voy a alinear esto en el centro. Centro. A ver. Lo que creo es que si éste es, la izquierda es mejor. Y a pesar de que éste. Es muy pequeño. Deberían ser 14. Es como, pero los colores deben admitir que esto es bueno. Esto es bueno. El tal vez 12. Entonces esto es a veces hay que jugar con él hasta consiga algo que es muy cool e interesante. Entonces, ¿qué pasa con el abuso? ¿Tomó críticas? Tenemos unos dos como éste apropiadamente. Tenemos éste. Prensa T. Por ejemplo, un a dentro es Ese es el nombre. El persona está empezando con un grupo. Y selecciona éste y tráelo aquí. No debe ser semi audaz, debe ser regular. Y el nombre es Toolbox. Uno es sí y no. Muy bien, interesante. Ahora, selecciónelos a ambos. Crear un componente. Esto va a ser, primer componente está limpio. Este va a ser morado. Este va a ser blanco. No más ahí. Entonces el número tres es ahora. Esta va a ser la misma cosa. Este es blanco. Pantalla es perfecta. Está bien. Entonces, animémoslo. Si hace clic en el sí. modo prototipo se va a utilizar en. Si haces click en no, va a ser como el árbol. Entonces si te perdiste el 211 sí. Volvió al estado por defecto. Si te vuelves ahora, vas a decir aquí, si nSdate árbol, supongo, volviendo al estado dos, puedes saber quién es el malo, el estado predeterminado. Así funciona. En realidad. Curioso. Sí, no, sí. Sí. Bonito. A mí me encanta. Sólo tenemos que arrastrar un poco todo el asunto. Y pongámoslo en estado por defecto. Asegúrate de Repetir cuadrícula. Haz esto un poco. Lo siguiente que necesitamos es Acerca del Autor, algún texto. También contamos con series continuas. Yo sólo voy a recoger algo como esto. Esto arrastra todo hacia abajo, haz clic con el botón derecho y desagrupa el componente. Entonces podemos simplemente copiar esto y ponerlo aquí. Porque esto es exactamente lo mismo. Arrastra este pueblo. Si el libro tiene una serie, se puede decir simplemente continuar la serie. Llevemos esto hasta aquí. Y sólo todavía algo de código. Entonces probablemente, así que probablemente tengamos que conectar todo con éste porque éste es el de animación. Animamos esto. Volvamos a la transición de la pestaña Diseño. Desliza a la izquierda por un segundo. Alcance, si hago clic en eso, retrocede. Puede volver a este. Se va a bajar esto. Y asegúrate de que estos cuatro estén aquí para, aquí. Juega con esto, ver si éste está funcionando. Bonito. Género. Vuelve a esto. En un go. Impresionante, me encanta. Hermosa. O simplemente puedo quedarme con éste. Volvamos a este. No es por ti como una sola página. Está hecho es un poco más grande por ahora. Lo siguiente que tenemos aquí en la misma página, tenemos algo llamado e-books similares. Volvamos aquí por mí aquí y, y dejemos esto. Y también tenemos crear este e-book. Yo puedo decirle a los demás ¿qué opinas? Y sólo voy a copiar una de estas estrellas. Ven aquí, bit grid y grupo, y hazlos en el centro. Ahora, crea un componente. Por lo que este es el estado por defecto. Si voy a nuevo estado, va a tener cuatro estrellas. Estado por defecto, prototipo. Si selecciono este, esto va a la transición está bien. Ninguno estado lo hace. Entonces. Esto está probado sin deformar. Bueno, estoy en el estado dos. Si hago clic en esto, va a volver a por defecto un sello. A ver. Una sola página. Ven aquí. Todos trabajando. Hermosa. Hielo. Entonces estos deberían ser como estos chicos. Así que asegúrate de seleccionar esto. Correcto es el háto en esto. Y así podemos animarlos. Además, tienes algo aquí, tenemos algo llamado déjame solo arrastrar una caja para ser la misma. Copia. Pegar. Al igual que escribir una reseña. Aquí vamos. Y eso es todo. Eso no es tan obvio, por lo que estaría bien. Simplemente voy a arrastrar esto hacia arriba y echarle un vistazo. Por lo que estos están funcionando. Ya se puede dar click. Acerca es calificación de ebook y reseñas. Icono. Si haces click sobre este ebook, ¿qué va a pasar? ¿ Verdad? Entonces vamos a crear otro. Esto va a ser lo que va a pasar. Haga doble clic en prototipo. Pero sí, y éste, y va a ser un ligero a la derecha. Disolver la diapositiva a la izquierda. Y si vuelvo, Va a ser un tobogán, ¿verdad? A ver si funciona la animación. Ligeramente. Si resto. Bonito. Ahora, no necesitamos nada, chicos. Yo sólo voy a quitar todo y usar uno. Dadas todas estas críticas y todo lo demás. Volvamos a subir. Este debe tener 16 años. No hace falta tener éste. Aquí vamos. También tener aserción de caso es algo que se puede. Y veamos qué pasó. Hermosa. Impresionante. 94. Cambio de componentes de libro de texto y tono E para leer animación: Vamos por la parte divertida y creamos las páginas de muestra gratuitas. Si hacemos click en muestra gratuita, ¿qué va a pasar? Entonces básicamente, necesito esto. Llamemos a este ejemplo. Aquí. Este país P centro, como Capital capítulo uno. También tienes algo de texto y no necesitas esto ahora mismo. Y también estos serían yo, solo haz clic derecho en él y desagruparlo. Este sería de 20. Entonces básicamente el título del Capítulo 1 es enorme, un poco. Abajo a si presionamos y pinchamos sobre el texto, algo en la parte superior va a aparecer. Y podemos cambiar la fuente, puedes cambiar el tema y es ir a los iconos. Ya están teniendo esto. Sólo voy a copiar esto. Yo sólo lo voy a poner en la parte superior. Entonces va a estar aquí, exactamente, correcto. Entonces éste y éste está bajando un poco, algo así como aquí. Entonces solo echa un vistazo. Este tiene una sombra de gota. Yo sólo voy a Control click en Agregar Sombra Drop de cinco y esto es 65 es arrastrar esto hacia abajo porque no lo necesito. Algún borde o un espacio o sombras en la parte superior. Entonces por eso puse cinco y la frontera. El jugador es seis. Entonces si haces click en esto, ¿qué va a pasar? Entonces déjame solo hacer esto. riesgo puede venir aquí. Y 10 está apagado. Si hacemos click en la página, esto va a aparecer. Entonces significa que si presiono es que esto va a aparecer. Ahora. Por ahora, sólo voy a hacer algo como esto. Simplemente voy a seleccionar todos estos y hacer de esto un componente. Ahora vamos a crear otro. Voy a llamar a este cuadro de texto. De aquí a aquí. Queremos cubrir todos estos, probablemente 16. Arrástrelo hacia arriba. Y luego como aquí, necesitamos tener frontera. Yo hago la sombra de gota. Y también lo hicimos un poco más oscuro. Yo quiero este color al refrigerador. Respuesta. Entonces aquí tenemos algo como esto. Bar. El tipo será de texto. Se trata de 12, semi negrita. Phi. Déjalo aquí. Y también tenemos tono. Esto va a ser morado. También queremos algo como esto. Y Alt, arrastra esto hacia abajo, Alt arrastra esto hacia abajo. Vamos a llenarlo de púrpura también. Asegúrate de que sea muy pequeño desde el lado del corazón, escribe texto. Y sobre todo, la mayoría de las veces, si hago este tamaño del texto o incluso un más pequeño, básicamente sería mejor. Agradable. Por lo que todos estos alimentos causan o leer texto en el centro. Aquí vamos. Alinémoslos en el centro. Esto también se puede hacer. ¿ Qué más tenemos aquí? Sí tenemos algo como esto. Si hago clic en esta pantalla para ser, se necesita un, por ejemplo, hacer que lo hagas, Vamos a hacerlo más grande. Por lo que debe ser irregular. Por lo que si hago click en esto, cambiará toda la página. Voy a teclear aquí original y asegurarme de que el color sea rosa. Hacer muy pequeño. Y sólo léelo. Ella dijo TI. Grupo. Arrástrelo hacia la derecha. Este debería ser algo así. Tiene una luz de zona fronteriza e incluso ésta. Zona. Comprueba, correcto, Genial. El siguiente. Selecciona esta para premium hasta aquí. Esto va a y para las partes inferiores, Vamos a ir a los iconos y sólo copiar esto. Traedlo hasta aquí y simplemente pegarlos. Y sería algo así. Sólo voy a dar clic y arrastrar esto hacia arriba. Muy bien, entonces este es el texto. Entonces solo voy a, déjame solo seleccionar todo. Entonces agruparemos estos primer introductor. Todos estos son seleccionados. Entonces cuando hago clic aquí, esto es texto, ¿verdad? Entonces selecciona este, el total. De acuerdo, llamemos a este control de texto X. Haga doble clic aquí. Y haces doble clic, mira, un solo clic, Está dentro del texto. Haga doble clic. Nos aseguramos de que estemos dentro de este grupo luego Comando o Control V. Entonces si vengo aquí, por defecto, debería ser éste. El sabor es éste que hemos diseñado. También tenemos que añadir esto toma también a éste porque cuando lo cambiemos, esto va a cambiar. Entonces sólo voy a seleccionar esto, el fondo. Br en rango de textos, selecciona el color de fondo Control X. Asegúrate de que estás dentro. Haga doble clic. ¿ Puedo controlar V? Haga clic derecho en él y envíelo a la espalda. Entonces estamos en texto. Si hago clic en Ariel como gravedad, haga clic en un texto a. Así que vamos a declarar Toma un, entonces significa que estamos cambiando. Entonces si hago clic en un, debería ser opuesto. Éste debe ser blanco. Zona fronteriza es morada. Y lo mismo. Ahora siente un borde y también el color. Entonces en esta situación, esto va a ser Arial audaz. Simplemente voy a hacer esta zona. Pero audaces tipos de ver la diferencia. Entonces si hago clic en Original, estoy en el área del prototipo sería se activó la célula gustativa si el texto ligando, Ben-Gurion texto haga doble clic aquí. Activado. Cuando hacemos click en área. Esto es debe ser auto animarlo usando está fuera por un segundo. Y el estado debería tomar un, volvamos a tomar un, seleccionar éste y asegurarnos de que es auto animate está adentro, está fuera por un segundo. Entonces volvamos al estado por defecto. Veamos cuál es éste? Objeción. Es éste. ¿Puedo controlar X? ¿A mí? Voy a hacer, sólo voy a los países. Y para realmente asegurarnos de que esto esté aquí. Y en realidad puedo escribir esto si todo está en el mismo lugar. Pero aquí no lo es. Por lo que sólo tienes que copiar, dar click en este código. Se necesita hacer doble clic en el interior, así que estoy dentro de mi control V. Nuevamente, esto debería venir arriba, contradice ventralmente. Entonces probablemente se arregle eso a continuación. También necesitamos a este uno chicos. Si voy al texto, si hago click en esta X, click en esta. Obtiene estado predeterminado, haga doble clic en el interior. Ahora pegarlo y asegúrate de enviarlo de vuelta. Entonces si hago clic en esto, cada uno de ellos, tienes que escribir uno encima del otro, ¿verdad? Este es el uno encima del otro. Entonces sólo voy a borrar este. A ver. Se debe cambiar ¿verdad? Área y propano y bolas. A ver si funciona. Está bien, genial, genial. Por lo que este texto debe estar en estado predeterminado y en otros estados, lo vamos a cambiar. Impresionante. Y vamos a echar un vistazo a esto si vemos si la animación funciona correctamente. Si no soy yo después de arreglar el equilibrio esto, para dar click en esto, algo debería pasar. Entonces quiero decir, estado por defecto. Yo sólo voy a dar click en esto. Ve a puerto arriba. Si haces click en esto, va a ser auto animate y va a aparecer el texto. Estás en texto. Por lo que el resto estaría bien. Supongo. A ver. Cambio activo animado. Agradable. Está bien. Entonces esto es genial. También tenemos que animar este. Si hago click en este centro y esto debería suceder rápidamente. Esto es, debería aparecer también. Entonces veamos venir esto. Está bien. Entonces, hasta ahora, tan bueno. Todo está bien hecho. Entonces sigo aquí. O sea toma un me refiero a textos. Ahora después de la cirugía la lengua. Por lo tanto, agregue un nuevo estado llamado este término. Aquí tenemos éste, éste va a la derecha. Esto toma, cambiará a erudito. Erudito podría ser morado. Por lo que no vemos ninguna actualización. Todo esto va a ser como estos tipos. Se los va a animar al centro e incluso éste y éste. Por lo que cada uno de ellos va a desaparecer en el centro. Y aquí está bien. Por lo que ahora sentado afuera, selecciona esto. Si estoy en texto o en la hora. Si hago clic en tono activado. Bien, a ver. ¿ A quién se veía la animación? Si estoy a su vez, si hago clic en Texto, estado por defecto. Vamos a animarlo. Aquí. A mí me gusta. Impresionante. Está bien. Entonces aquí vamos. Volvamos a término. Tenemos, solo voy a usar estos textos leyendo el brillo. Y necesitamos crear a estos tipos. Y muy rápidamente en un muy fresco o hecho más ligero. Practicemos hasta. Eso es todo. Y también tenemos que poner algo de sombra de gota. ¿ Qué es tal vez dos? A lo mejor uno, tal vez un poco más oscuro. Control G para agruparlo. Y esto es que debería ser como estos realmente pequeños y el otro. Entonces solo lo voy a poner aquí. Sí, debería ser la lectura de luz nocturna. También cuenta con una línea para controlar su brillo. Seguro. Gorra siete redondeada. Control D, arrastre esta bolsa de color diferente. Y también. Aquí vamos. También tenemos algo llamado equipos de visualización. Activemos este componente de alternancia. Y aquí está arrastrarme hacia fuera porque todos somos, esto es un componente dentro del componente nuevo estado o Portugal con sólo declarado más nuevo. Algo más fresco. Si hago click aquí, puedo dar click en Toggle estate. Esto va a ser automáticamente entonces porque está abordado ¿verdad? Entonces para esto, si arrastro esto a la derecha y hago esto morado y hago este de un litro. Entonces va a funcionar. Hagamos el estado por defecto. Simplemente lo voy a arrastrar y poner en el tiempo. Se irá. Si hago click en él. El toggle de forma automática. No quiero hacer este toggle porque nuestro plan para esto. Entonces haga clic en esto, todo el asunto. Obteniendo tono. Yo sólo voy a crear un tono noche meses cerca del estado, punto nocturno. Entonces si estoy en modo nocturno, esto va a estar sucediendo. Arrástrelo a la derecha. Eso es todo. Eso es todo. Entonces si éste está activado, echa un vistazo. Estoy dentro de este doble clic para volver a entrar. Y estoy arrastrando una caja, haga clic derecho, envíala a atrás. Deberías sentir es probablemente de este color, tal vez un poco más claro. Entonces selecciona esto. Por lo que se puede ver que si hago clic en Toggle, ver qué pasó. Entonces si estoy en tono y si voy al prototipo y doy clic en este pequeño ícono aquí, quiero llevarme a girar modo nocturno. Y si estoy en modo noche tono, si hago clic en esto, puedes apagar eso. Volver al tono. Veamos nuestra mitad en, la mitad. A ver, mira. Entonces después de animar todo esto, nuevo, toggle también. Entonces si estoy aquí, si selecciono y texto debería tomar en texto. Por lo que todos estos deberían estar animando el estado predeterminado del texto. Entonces intentémoslo una vez más. Entonces ven este va a tipo de control X, X , volver atrás, click. Debería estar en el tono, solo haciendo doble clic. Así que asegúrate de que esté justo dentro del tiempo. Volvamos atrás. Una vez más. Haga clic una vez en la página o pestaña de la página. Esto va a desaparecer. Tráelo de vuelta activado. En Taiwán, la zona. Volvamos atrás. Vayamos a dar la vuelta. Impresionante. Toma tono perfecto a las lecturas de lata y el modo nocturno. Perfecto. Ahora, antes de pasar al siguiente video, solo voy a hacer clic en esto y arrastrarlo arriba y comprobarlo una vez más desde la muestra gratuita. Ahora, conectemos también la muestra gratuita al Capítulo 1. Asegúrese de que está en transición y deslice a la izquierda. Si haces click en esto, se va a volver a esta en esta diapositiva, ¿verdad? Vamos a comprobarlo. Si hago click en, por ejemplo, son algunos bellos, bonitos , bonitos, perfectos. Me encanta todo de vuelta. Y necesito dar click afuera. Haremos click en esto, por lo que esto debería desaparecer. Entonces volvamos atrás. Cuando estoy en texto. Si hago clic en esto, deberías volver a la muestra gratuita o debes volver al estado por defecto y al superior también. Entonces vamos a ver. Simplemente puedo dar click aquí. Para que pueda volver aquí, ¿verdad? Haga clic fuera. Mucho mejor. Entonces cuando estoy aquí, haga clic afuera, algo así, y eso es todo. Perfecto. A mí me encanta. Ahora, en el siguiente video, vamos a diseñar el flipping Page. 95. Efecto de página de flop en Adobe XD de diseño y prototipos: Es hora de crear un Philip en página. Por lo que sólo voy a seleccionar esta muestra gratuita. Entonces antes de eso, necesito poner un número aquí. A lo mejor uno. También. Liquidez también. Enfriar. Por lo que ahora hay que practicar este. Cambia esto. Sólo ir a cortar tal vez esto sería algo como esto. Por lo que quiero ver es diferente. Eso es un, sólo necesitamos ser un poco diferentes en caso del texto. Por lo que será más creíble y más realista. Esta va a ser la página dos. Impresionante. Entonces si haces click en esto y arrastras esta página, podemos darle la vuelta y se va a la página 2 on puedo traer esto aquí y también traer esto aquí. Y es a la izquierda y además asegúrate de culpar esto en la parte superior. Por lo que todos estos deberían estar encima de esto. Entonces, así que vayamos a Google y busquemos unas páginas de Filadelfia. Hay un montón de páginas totalmente chicos, y puedes descargar uno de ellos. Hicimos fondos de P&G, por lo que no debería haber antecedentes. Entonces ya hice eso. Acabo de copiar este, chicos. Voy a copiar esto. Tráelo aquí. Este tiene animación. Sólo voy a apagar eso por ahora. Ahora mismo me estoy centrando en la parte de la Flota y solo presiona Control de Comando V. Asegúrate de que esto sea muy pequeño y lo voy a poner aquí chicos. A lo mejor cada rotación del año. Si fuera, tal vez así. Es así como volteamos la página. Voy hacia afuera por la caja. La línea azul está dentro, así que significa que estoy bien. Ahora, sólo eliminemos este. Y vamos a tratar de hacer esto nuevo porque sólo va a copiar esto aquí. P1 quiere usar lo mismo. El capítulo 1 va a estar haciendo más. El número 2 va a ser dos. Esto va subiendo la capital D. Diferente. Mira. Y eso es todo. En este. Tenemos que hacerlo muy grande. Y también tenemos que hacerlo algo así. Entonces hazlo muy grande. Rotado. También necesitamos ver una sombra aquí. Yo sólo voy a arrastrar todo el asunto y traerlo vuelta a la derecha. Por lo que se ve la sombra interior mal calculada. Entonces tienes la tomografía computarizada de sombra porque es como voltear PageRank. Entonces Veamos si lo animas, qué va a pasar. Entonces haz click en prototipo, arrastra este. Ve a drag, auto animate y asegúrate de que esto sea. Vuelve a hacer clic en éste, y lo mismo. Veamos qué pasó. Arrastre. Entonces aquí perdemos alguna parte en la parte inferior, como aquí, aquí. Entonces significa que tienes que hacer dos cosas. En primer lugar, es la opacidad debe bajar la opacidad. También, y esta opacidad es demasiado alta, bájala. El segundo es que aún tiene que hacerlo más grande. Entonces no vemos estas partes. Vamos a intentarlo de nuevo. Está bien, Aún así, estamos perdiendo algún punto, pero todo está bien. Impresionante. Tiempo. Todavía lo hacen un poco más grande. Creo que va a estar bien. Entonces, ¿qué tan simple es eso? Pones algo pequeño aquí y mira y presiona el ratón. Significa mantener pulsado el ratón a la izquierda y a la derecha. Y así es como podemos mostrarle una animación a su cliente. Y esto es muy, muy cool. Dede. Y me encantó esta parte. Y esta parte es increíble. Muestra el efecto de las páginas anteriores. A mí me encanta. ¿Qué pasa con la desconexión? Entonces solo voy a hacer algo así como estos chicos, si hago click en el prototipo superior, si hago click en la pestaña, va a éste. Ahora necesito alterar mi transición. Disolver estaría bien. Y eso es todo. Si hago click en esto, va a volver a éste. Entonces vamos a ver si voy a Diseño y lo toco. Si hago clic aquí, esto va a aparecer, para volver atrás. Por ejemplo, de nuevo, va a aparecer click en la parte superior. Y todo es suave y en el lugar correcto. Me encanta todo lo que chicos que hemos hecho hasta ahora. Vamos a dar click aquí. Página, derecha. Al dar la vuelta a la página, Algo ha pasado. Por lo que éste debe ser ningún campo todavía funciona. Por eso tienes que probar tus aplicaciones. No ver nada. Hasta ahora tan bien, y me encantó cada parte de ella. Entonces en el siguiente video, vamos a comprar este libro para ver qué va a pasar. 96. Animación de prototipos de producción de efecto vidrio en 3D de vidrio en 3D de la tarjeta de crédit: Está bien, es hora de diseñar el pago y la animación actual solo puede probarlo. Una de estas, sólo voy a quitar todo. Ahora, selecciona la mesa de trabajo. Yo sólo voy a escribir este pago. Asegúrate de que solo te voy a dar la sensación de lineal. Esta guerra. Probablemente debería ser de color Scholar o incluso más oscuro. Y éste debería ser algún tipo de color azulado. A lo mejor un poco más oscuro. Ahora, haga clic en este rectángulo y dibuje aquí un cuadro, borde de Mónica. Vamos a tus imágenes y tengo una carpeta llamada textura. Arrastra a uno de estos tipos de texturas y simplemente póngalo aquí. Si está activo, este es el 3D se transforma o apaga. Entonces solo arrastramos una de las texturas y la dejamos caer dentro de esa caja. Pero lo que voy a hacer es que sólo voy a usar el modo de mezcla por defecto. Si lo pongo en una pantalla, será hermoso. Es como estrellas, ¿verdad? Lo siguiente que podemos hacer es que sólo voy a arrastrar un poco esto a la derecha. Entonces solo voy a dar clic aquí y probar cuadro. Nuevamente, vaya a lineal. A lo mejor uno de ellos debe ser leído religioso, rosado se va a rosa. Y éste debería ser algún tipo de azul. Seleccione este y mueva el borde duplicado o sin duplicar. Hazlo un poco más pequeño y solo déjalo caer aquí. Ahora, seleccione estas dos elipse. Y se puede ver eso, ¿verdad? Apenas estos dos, estos dos círculos y dejarlo abajo. Para que veas que va a afectar todo el asunto. Y es que es mucho más agradable. Una es, sólo vamos a hacer es crear tarjeta, la tarjeta de crédito. Y la frontera debe ser lateral. Fronteriza. Conferencia. Asegúrate de que esté en el centro. Ahora ves el desenfoque de fondo. Basta con dar click en ella como qué app. Se ve la cantidad. Podemos arrastrarlo a la izquierda y a la derecha. Entonces a la derecha, no vemos mucho del fondo, pero aquí también podemos ver algún tipo de fondo , lo cual es genial. Y puedes jugar con el brillo. Y a veces es realmente bueno si añades un borde de borde blanco y también lo haces muy ligero. Va a ser muy, muy interesante. Pero para mi caso, y nuestro deseo, no necesitamos tener la frontera. Cree que está bien. Hay otra cosa genial que podemos hacer. Si volvemos a esta textura, se puede ver que es textura de gota de niebla. Arrástrala y suéltala aquí. Pero cuando haces eso, no ves nada porque la opacidad es 0. Si juego con la opacidad, nuevo, síralo. Y este diseño es muy famoso hoy en día en Dribble Behance, ve mucho diseño como este, y así es como lo hacen. Es mucho genial jugar con esto. Y también puedes jugar con esta cantidad también y el brillo para obtener efecto más hermoso. Y tú también ves el fondo. Por lo tanto, baja la opacidad, mira la textura. Pero eso no queremos. Les mostraré chicos ¿ cuáles son las opciones y cuáles son las otras cosas que ustedes pueden hacer? Entonces déjame ponerle un poco de texto a estos tipos. Algo así. Agradable puede sólo poner el cctv y eso es todo. Asegúrate de que esto esté en el centro. Selecciona este, selecciona éste y éste, y hazlo si agrupa. Está bien, esto está bien o aún puedes jugar con él y solo puedes hacerlo un poco más agradable, cual creo que esto es muy cool y muy interesante. Está bien. Ya ves si todo está dentro de este grupo. Cuando lo que voy a hacer es sólo voy a dar clic en esto para que ustedes puedan ver algo. Si giro esto, el número y los autos están separados, incluso ellos están en el grupo. Y a veces el Adobe XD hace eso, a veces funciona. A veces no lo hace. La mejor manera de solucionar esto es hacer de esto un componente. Entonces haga clic en este componente, y eso es todo. Ahora bien, si vas a la transformación, podemos rotarla. Y el texto se va a pegar al carro, es traer de vuelta. Ahora necesitamos duplicar esto. Por lo que este componente debe ser tarjeta uno, Control D. Y esto se llama 2, 3, 4. Escribe el número 4 es el que queremos está debajo de la parte superior. Entonces sólo lo voy a traer aquí. Después el número tres y el número uno. Así que el número uno debe ir a la derecha y tenemos que rotarlo como menos 50%. Bueno, turno largo y tecla de flecha derecha, puedes enviarlo a la derecha. A continuación se encuentra núcleo a menos 50. Y también arrástralo hacia la derecha. Hartree menos 50 y mantenga presionada la tecla Mayús y arrástrela hacia la derecha. Porque no es visible. Esto es lo que vamos a hacer. Y dijeron, haga doble clic en él. Vayamos a la frontera. Y podemos agregar un borde de 0.5 pixel. Agradable. Lo mismo, frontera 0.5. Lo mismo. O simplemente están aquí, 0.5. Y aquí estoy manteniendo presionada Control y dando click en esto para seleccionar esta capa de texto y activar el borde. Y acabo de poner 1.5 y ver qué tan cerca eso y podemos ver todo. Ahora, es hora de la animación, pero antes de eso tenemos que desplazar seleccionar todo esto. Por lo que he seleccionado todos estos y presionado Comando o Control G para agruparlos. Entonces básicamente tenemos un grupo, solo llama al carrito, correcto, va a ser nuestro grupo. Ahora, pulsa Comando o Control D. Ven aquí, selecciona éste. Entonces si cambiamos y vamos a éste, la suma va a cambiar. Así que asegúrese de que cuando seleccione en no seleccione el original. Haga doble clic para, puede ir a la cancha para rotar menos 50. Cambia el clic izquierdo, y va a llegar hasta aquí. Siguiente. Selecciona este y pon el número 0 y también tráelo hasta aquí. Hermosa. Ahora, vamos a animarlo con disparadores y teclado. Haga doble clic en esto. Entonces esto está seleccionado, ¿verdad? Vayamos al prototipo de dragón y dejémoslo aquí. Por lo que el trienio debería ser llaves y gamepad. Entonces si presiono S, voy hacia adelante y doble clic en esto y arrástrelo a éste. Si presiono un en el teclado, si va a volver atrás. Entonces aquí ves el número S, y aquí ves a. Entonces si lo toco, presiona S en tu teclado, presiona a, s, a, ve qué hermoso es eso. Por lo que en este tipo de animación y presentación, no necesitas mostrarte un ratón porque es un poco distrayente. Pero si uso los tres años, es mucho más suave y agradable y sientes que lo has hecho con Adobe After Effects. Theat sube. Entonces es volver atrás. Selecciona este, esto vuelve a Diseñar, pulsa Comando o Control Lee. Esa una vez más. Yo sólo voy a hacer doble clic para ir dentro de este menos 50. Desplazar flecha de elevación. Agradable. Y éste debería ser 0. Arrástralo aquí. Agradable. Lo mismo. Haga doble clic. Por lo que se ve el prototipo de caja verde. Arrastre esto hasta aquí. Es S es para. Si selecciono, si hago clic en este y lo arrastro a esto, presione a. El tipo de animación es un snap chicos. Así que asegúrate de poner un broche de presión. Por lo que hay una transición. O sea, puedes poner tu Unbounce, pero no va a ser agradable. Sémoslo, si un puesto esto, Unbounce, ver qué pasó. Presione S, C, va a ser así. Pero el snap es como es muy pequeño, así que no queremos eso. Así que asegúrate de seleccionar esto. Ponlo en Snap. Plato. S va por S y una espalda. Hermosa. ¿ No es así? Chicos Impresionantes. Ahora estoy pensando que eso apaga eso. A lo mejor esto son demasiado las estrellas y se puede bajar la opacidad de la misma. A lo mejor alrededor de 50, 50. Agradable. Desplazar, seleccionar estos dos y ponerlos en 50 también. Mucho claro, así que no veo ninguna distracción. En el siguiente video, creamos la información de pago. 97. Información de pago: animación de prototipos: Muy bien, Vamos a crear una info de pago. Si hago clic en esto, si digo comprar ahora, entonces ¿qué va a pasar? Si hago click en Comprar ahora? Yo sólo voy a ir a esta página. Y yo sólo voy a crear una caja aquí y la parte superior. Y bajamos la esquina de la misma. Aguanta Alt, arrastra esto hacia atrás, estos dos en la parte inferior. Impresionante. Y lo que necesito es exactamente lo mismo. Este es, esto es copiarlo y pegarlo aquí. Entonces hagámoslo muy pequeño. Esto debe ser 14 raíz cuadrada aquí. Entonces 14, la brecha entre ellos, debería ser 16. Entonces podemos arrastrar esto hacia arriba. Y también éste debería de ser 12. Sólo voy a arrastrarlo y soltarlo aquí. Por lo que ya diseñé esto. Es muy sencillo, lo mismo, sólo lo voy a poner aquí. Y lo que necesitamos es algo llamado déjame arrastrar esto y soltar esto. Tu dirección de entrega. Está bien. Shift select, todo, sale Control G para agruparlo, arrástralo hacia abajo. Y éste es el que se selecciona, el de arriba. Entonces esto está bien. Entonces tal vez cambie este, morado. Y es interesante y agradable. Entonces déjame seleccionar esto y seleccionar aquel. ¿ Podría un componente crear un nuevo estado? El Estado dos sería lo contrario. Entonces éste es éste, éste es éste. Por lo que sólo voy a dar clic en este, que sea borde morado. Por lo que por defecto el estado. Ir a Prototipo. Si selecciono este, Vamos a animarlo. Vayamos al tabulador. Para animar. No debería ser un chasquido, debe estar encendido está en su fuera. Debe ser más rápido para un segundo estado con el estado para seleccionar este, vaya a un estado para hacer clic en este activado. Debe ser estado por defecto. Entonces por defecto es esto. Veamos qué va a pasar. Se puede seleccionar es, Es muy bonito. Muy bien, volvamos. Seleccionemos todo aquí. Dirección. Y también tenemos que poner el pago también antes de agruparlos. Necesitas el botón de pago. Estaría bien. Está bien. Busco una flecha. Copia. Ven aquí a pegar. Voltea, hazlo blanco. Ahora vamos a empatar el pago. Asegúrate de que sea 14 y esté alineado en el centro. Por lo que establecer metas y alcanzar tus metas están alineados centro. Mucho más agradable como esto. Ahora, selecciona todo, vuelve a j es dos. Entonces este grupo R también, tienes grupo separado, éste, éste, y éste, e incluso hacer comando de fondo Control G. Así que tenemos un grupo de esto. Yo sólo voy a copiar estos dos aquí y dos aquí. Si hago click en Comprar, Ahora, ¿qué va a pasar, chicos? Echa un vistazo, da click en Comprar. Ahora. Arrástrala y suéltala a ésta. Pongámoslo en transición. Deslízate hacia arriba. También necesitamos este ícono aquí a éste también. También hay que hacerlo blanco. Lo mismo. Para que podamos volver atrás. Tenemos que poner éste encima. Esto no puede controlar V y hacerlos blancos. Vamos adentro y juguemos esto. A ver qué va a pasar. Hermosa. De acuerdo, déjame simplemente cerrar esto. Entonces si hago clic en esto y prototipo, puede volver a éste, ya sea deslizarse hacia abajo, Vamos a ver, deslizarse hacia arriba, o ya se va a ver. Es un poco rápido. ¿ Verdad? A lo mejor seis segundos. Veamos por qué ahora. Dirección de entrega, y este va a ser tu pago. A ver si S, S, S a, a, impresionante, me encanta. Y volvamos atrás. Por lo que volver también es rápido. Pongámoslo en seis segundos. Vamos a verlo una vez más. A estas alturas. Presionar S, S a volver atrás. Y Erica, elige tu dirección. Se puede dar click en el pago. 98. Animación de prototipos de seguimiento de envío y diseño de menú paralelo: Vamos a crear el seguimiento del envío. Sólo voy a dar clic en uno de estos alt Shift, arrástrelo, eliminarlo todo, acercar un poco, y envío. En primer lugar, voy a dibujar una caja así. Algo grande, bebé un poco más grande. Aquí vamos. Y esta va a ser nuestra imagen. Vayamos a enchufar. Hay un plugin llamado mapas de fantasía, ¿verdad? Vamos a dar click en él. Y puedes elegir tu ciudad. A lo mejor Tokio, París, París. Y creo que esta oscuridad estaría muy bien. Y puedes acercar un poco para ver qué está pasando. Algo así, creo que estaría bien. Por lo que esto debería ser un poco grande. Y aplicar mapa. Por lo que el mapa va a estar dentro y ahora puedes hacerlo un poco pequeño. Hago eco algo como esto estaría bien. Entonces este va a ser nuestro mapa para el rastreo. Y voy a copiar esto desde aquí. Este es uno y éste. Copia y pega aquí. Asegúrate de que puedo arrastrarlo arriba. Se está subiendo. Ya tengo algo de texto. Entonces sólo lo voy a poner aquí. Simplemente voy a arrastrar esto hacia abajo. Esto va a ser orden. Arrástrelo hacia abajo. Bonito. Entonces sólo voy a cambiar esto un poco diferente. Consulta este 10 y me pongo guapa. Ahora, necesitamos crear algunas líneas aquí. Algo así va a ser, lo es, va a crear una línea a partir de aquí. A lo mejor aquí. Hazlo rosa. Dash sería tal vez 25. Bien. Esto debería llegar a la cima. O tienen algún texto, solo lo voy a poner aquí. Entonces este va a arrastrar esto aquí, acercar un poco los campos. Y también aquí vamos. Arrástrelo hasta aquí. Yo copio esto, lo arrastra hacia abajo, lo subo. Esto debería ser algo así. Cambia el color. Entonces está alineado. Muy bien, Cool. Tiempo. Y todo el asunto acaba de bajar. Este sería gris. Todo lo demás sería genial también. Con el tránsito. Necesito este ícono aquí y arriesgo, lo pongo aquí. Entonces volvamos. No necesito esa. También necesitamos uno de estos va a venir aquí y pegarlo aquí. Vamos a conseguir un obligado a seguir estas líneas. Escapar. Y puedes cambiar el color al mismo color que este es cuando debe ser un click superior y llevar al frente. Lo mismo. Y voy a hacer algo así como estos chicos dibujan un rectángulo. El borde debe ser amarillo y el interior debe ser del mismo color que éste. Punto de partida. Y esto es, y tal vez puedas hacer la línea al evento Pixel. Este puede ser de dos píxeles hermoso. Este también se puede cambiar. El color debe ser un poco rosado. Se trata de un borde de blanco. Y tal vez un poco más grande. O se me ocurre una mejor idea. A lo mejor hacer algo como esto. A lo mejor hay otro camino ahí. Entonces esto es lo que hacemos. Yo sólo lo voy a dejar aquí. Bonito. Impresionante. Cambiemos el espaciado y lo hagamos también. Creo que es más obvio que C. Está bien, está bien, me encanta, bonito. También necesitamos algún tipo de chicos de animación, pero hagamos un truco muy cool aquí. Sólo tienes que arrastrar una caja. Déjalo aquí. Asegúrate, ya sabes, sentir un poco de peso. Cinco, tal vez. Bonito. Vamos a duplicarlo. Comando o Control D para duplicarlo el superior. Y sólo echa un vistazo. Ahí va hacer esto rosado, pero asegúrate de que la brecha sea un 110. Sólo te voy a mostrar un truco, 11000. Ahora, si hace clic en Dashed y la tecla de flecha superior, puede aumentar esto y podemos animarlo. Va a ser muy interesante. Ahora, volvamos atrás. Comando Z para volver atrás, ¿verdad? Este va a ser nuestro truco por ahora. Y por ahora, hagámoslo Dos 100, demasiado, tal vez 120 y 140. Porque está muy cerca, ¿verdad? 160. Y gorra redondeada sería muy agradable para dentro cuando es algo, cuando es algo más interesante. Si vas a pic.com gratis, tenemos esto hecho muy moto, ¿verdad? Apenas descargado. Ya lo tienes en tus archivos. Sí varió. Haga doble clic en el archivo AI va a estar abierto en Adobe Illustrator. Simplemente selecciónelo, selecciónelo todo, regrese a XD. Y vamos a pegarlo aquí. Es enorme. Y si cambio esto deliberadamente va a ser aserciones. Ven I Control Z, sólo voy a hacer doble clic aquí, Control, haga clic en Control X para copiar esto. Ahora puedo rotarlo, lo quiero de esta manera. Puedo pegarlo de nuevo y traer esto, pero debería estar dentro de este milisegundo Comando o Control X. Haga doble clic. Yo sólo voy a ir dentro de la magnitud. Ahora. Yo estoy dentro de esta capa, justo dentro de este grupo. Está bien, sólo voy a quedarme aquí la gran advertencia. Trae uno más hacia abajo y mantén siempre el original. A lo mejor pasó algo, no lo sabes. Está bien. Yo quiero hacerlo, como acabamos de ver, el centro estaba pensando en hacer algo interesante. Simplemente lo dejo así. Bonito. Ahora, vamos a hacer algún tipo de chicos de animación cool para hacer la adición. Estaba pensando que también necesitamos a este tipo Aguanta, Aguanta y arrastra. Yo quiero ponerlo en este camino. Pero y un control haga clic en esto, quite esta parte. Eso es lo genial de este archivo es que puedes simplemente animarlos. Yo quiero ponerlo está en marcha, ¿verdad? Entonces es más interesante. Entonces para la animación, tenemos que hacer algún tipo de agrupación. Por lo que un mexicano hago clic en todo y agrupo la parte superior y un clic derecho en él y lo mando a volver prime. Para esta parte, sólo voy a separar esta parte y la parte superior. Por lo que siempre hay que agrupar estas cosas. Vuelve a una G. Nice. Este primero. De nuevo, selecciona Shift, selecciona Control G. Y éste, éste, y éste Control de Comando G. Así que sólo nos quedamos con silicio todo. Y otra vez, éste, y éste totalmente agrupado. Entonces todo está agrupado, ¿no? Entonces es sólo un grupo de todo. ¿ Puedo Controlar Z? Ahora puedo traerlo aquí. Puedo seleccionar esto y arrastrar esto hacia abajo. Puedo seleccionar esta parte para animación. Yo sólo puedo mover esto aquí, esto aquí, esto aquí. Y va a ayudar mucho para una animación muy agradable va a ese puerto. Para estas partes. Voy a hacer click en este mapa, hacerlo un poco más grande, y moverlo un poco. Y también haga doble clic en esto es Shift, seleccione estas barras y muévalas aquí, por ejemplo, así. Y aquí está Pi aquí. Entonces éste probablemente salga a, no los vemos. Este es probablemente un poco más grande. Se va a venir aquí. Y éste va a estar aquí. Lo mismo. Y este, Pongámoslo en 0. Y asegúrate de que estoy seleccionando este 1100000. Esta es la brecha, ¿verdad? Yo quiero que se vea así. Entonces veamos la animación. ¿ Qué va a pasar si hago clic en pago, significa que hemos hecho el pago y deberíamos ver el seguimiento del envío. Si voy a un prototipo, arrastra esto y ponlo aquí. Por lo que este es debe ser un tránsito y debe estar dentro por un segundo. No importa. Entonces cuando estás aquí, éste a éste, debería ser a tiempo. Está bien. Debe estar en auto animate. Debe estar en 1 segundo y facilidad de entrada, facilidad de salida o probablemente un broche de presión. Entonces comprobamos si cuál es mejor. Tan seguro es usar resultados. Y además, necesito uno de estos carpi basado. Entonces si selecciono esto y traigo esto de vuelta, sólo puedo traerlo de vuelta aquí. Nos limitamos a tránsito sencillo con cuatro segundos. Veamos qué hemos hecho. Echarlo aquí. Si presionas S, estas van a funcionar hermosas. Volvamos ahora a elegir la ubicación y será el pago. Impresionante. Mira, todo se mueve, pero es muy rápido. Por lo que hay que verlo más. Envío de polígonos, poner un número a dos. Y vamos a intentarlo de nuevo. Jugar pago. Volvamos aquí. Mira, todo está en el lugar correcto. Probemos el chasquido. A ver si lo ponemos en la pila. ¿Qué va a pasar? Vamos a traerlo aquí. Pago. Es un poco movido al final, ¿verdad? Es yo creo que es lindo. Bonito. Al igual que con las manos, arrastras arriba y abajo. Me encanta. Entonces todo podría simplemente, esta parte no está bien. A ver. Es bueno diseñar. Esta parte. Debe ser gris. Así. Impresionante. Honestamente una vez más. En realidad funciona. Es hermoso, hermoso pago. Entonces veamos esta animación. Simplemente concéntrese en esta animación. Ahora esta animación , no funciona. Algo anda mal en estas gracia de animación. Si lo copio es algo así. Así que siempre haz un Control V. Hagámoslo oscuro. Control V. Y aquí vamos. Este, Glick. Esto es, debería ser tal vez 120. Hagamos la animación. Al igual que la animación del tiempo. Vamos a retrasar un 1 segundo. A ver si podemos ver la animación. ¿ Verdad? Podemos ver la animación. Entonces esto es lo que chicos. A veces mira ahí arriba, pero al fondo porque estamos déjame solo volvamos atrás. Adelante y solo hagamos la entrega. El reparto. Pega aquí. Copia el n ahora pegado aquí. Sólo para pegar. Eso es todo. Y control-click, automatiza esto. 120 es sólo querer ver si funciona. Vayamos al pago. De acuerdo, ahora funciona. Y sólo copia eso otra vez. Eso es lo que hice. No me canso de ver este aspecto impresionante. Está bien. Los equipos de auditoría que hay que sumar es, chicos, éste. Esta es una barra lateral. Y no creamos una pizarra de Soy. Es decir, solo quiero usar este porque es simple y es normal, y está bien. Entonces si haces click en esto, si vas al prototipo, éste, transición, y se debe deslizar de izquierda a derecha. Deslice a la derecha. Si el cierre que abajo. Debe deslizarse a la izquierda. A ver. Bonito. Impresionante. Es un chasquido. Por eso ves algo como esto y creo que es genial. Pero es un poco lento porque es un 2 segundos lo hará 1 segundo evento. Este, que sea 1 segundo. Otra vez. Aquí tienes. Mejor. Por lo que esto sucederá si haces clic en lista de seguimiento, puedes venir exactamente a esta parte. Transición. Yo quiero que sea ninguno. Se debe disolver. Veamos qué pasó. Si vengo aquí. Sólo voy a llamar a este menú lateral o a un menú de hamburguesas. Si vengo aquí y si hago clic en lista de seguimiento. Hermosa, tranquila, Perfecta. Ahora es el momento de compartir este trabajo con algunos de tus amigos, colegas e incluso ponerlo en algunos sitios web y obtener algunos comentarios sobre cómo hacerlo. Se puede ver en el siguiente video. 99. Animación de prototipos de la aplicación principal: Voy a hacer es sólo voy a sostener Alt y sólo hacer una copia de esto. Por lo que seleccionas este. ¿ Verdad? Ahora. Esta va a ser la biblioteca. Yo sólo lo voy a poner por defecto. En realidad, no quiero el default. Pongámoslo en casa. Vaya al prototipo, y haga clic en esto y elimine esto. Entonces solo necesitamos el hogar por defecto, ¿verdad? Cuando está en una casa. Significa que tenemos que poner todo dentro de este componente para ser animados. Simplemente voy a seleccionar esto y también turno seleccionar éste, comando o Control X, así que copiamos todo. Entonces estamos en casa. Haga doble clic aquí, controle V. Ahora, haga clic derecho y envíe a atrás. Perfecto. Esto podría hacer biblioteca. Tengo algo aquí. Basta con copiar este Comando. C, haga doble clic aquí, controla V. Así que es sólo un montón de imágenes con el fin sólo escribir ligandos en la parte posterior. Lo mismo pasaría para esto, el favorito haga doble clic Control V y simplemente cambiar las imágenes chicos. Entonces esto va a cambiar algunas de las imágenes para que ustedes vean a qué me refiero. Son iguales. Y para tu tarea y también asegúrate de hacer clic derecho y enviarlos a la espalda. Para su asignación. Dejaré que vayan al perfil y creen una página de perfil para este tipo. ¿ Cuál debería estar en su página de perfil, verdad? Ustedes tienen que hacer esto. Volvamos al estado por defecto. Y tiene que poseer. Haga clic aquí, aquí, aquí, aquí, aquí y aquí. Mi control C. Volvamos al incumplimiento, Estado públicamente aquí están mis controles. Hacemos clic derecho y lo enviamos a la espalda. Entonces básicamente debería ser como estos chicos. Entonces esto va a ser en casa, sin cambios. Esto es, la biblioteca, va a ser la favorita. Yo sólo voy a poner favorito aquí. Y hay que diseñar esto. Bonito y bonito. Y eso es todo. Déjame sólo arreglar este. Si éste está en casa, que es fino bibliotecas cinco, favorito. Y Michigan cambió se necesita a desfavorito. Vamos a comprobarlo de nuevo. Inicio. Eso es todo, y eso es todo. Entonces aquí vamos. Sólo voy a dar clic aquí y poner esto aquí. Vámonos al estado por defecto. Básicamente evento el default es estado deben ser los chicos de casa. Entonces solo voy a desconectar esto. Entonces esto está desconectado. Entonces si juegas en él, por defecto, debería venir a esta página. Y por defecto en esta casa. Entonces va a ser así. Entonces si llegamos a esta página, deberías ver el hogar, ¿no? Corazón. Perfecto. Y cómo y esto es llamado. Muy bien, entonces, ¿qué está pasando aquí, chicos? ¿ Aquí? Puedo mostrar este tipo de animación, para que pueda volver atrás, pero éstas no van a funcionar. Pero en esta página, esto va a funcionar. Entonces para hacer una animación perfecta para el cliente, porque grabamos una película. Cuando estoy en esta página. Si hago clic en Black Friday, solo voy a arrastrarlo y soltarlo al tablero de arte con la llave y el gamepad. Si presiono Z, sólo voy a volver atrás. Y solo estoy presionando Z otra vez, se va a ir. Vamos a presionarlo z, sólo vamos a volver de nuevo. Entonces vamos a ver. Si estoy aquí. Si hago click en esto, puedo volver atrás. No hay problema. Febreze. A nadie que haya visto, he cambiado esto, pero esto va a funcionar de nuevo. El Prezi, nadie ha visto esto. Voy a saltar a esta mesa de trabajo. Y este es un truco para tus ojos de trabajo y C no va a funcionar en este momento. Si quieres cambiar esto, procede, cambia, cámbialo. Y esta es tu tarea. Hermosa, ¿verdad? Prezi otra vez. Volvamos a John run, todo funciona como un char. Tan hermosa. Así que asegúrate de recordar traer de vuelta algo como esto. Presiona Z en tu teclado y va a funcionar perfectamente y solo lo hará este. Sólo vamos a eliminarlo. El resto de cosas que solo debes arreglar es éste chicos, si hago click en esto, si voy a Prototype, asegúrate de que esto esté conectado a éste con una ligera izquierda. Entonces pulsa Guardar. 100. Pruebas de usuarios compartiendo tu trabajo y obtención de comentarios: en la cantidad: Ahora mismo es el momento de compartir esto con el pueblo árabe. Escribe cómo hacer eso. Tratemos de organizarlo. Entonces solo voy a rastrear esto aquí. Entonces solo voy a seleccionar todos estos y arrastrarlos para que oigan, ¿verdad? Seleccione estos, arrástrelos hacia abajo. Y todo el asunto. Ahí hay un truco. Si quieres ver esta animación en otra mesa de trabajo, solo tienes que seleccionar todo en modo prototipo. Ahora vamos a Archivo, Nuevo. click en lo que quieras, realmente no importa. Entonces asegúrate de estar en modo prototipo, ¿verdad? Si estás en modo prototipo, puedes pegar la prensa. Sólo déjame abrir eso. Cierra este, manda o controla V para pegarlo. Perfecto. Ahora se puede ver el alámbrico también y todo, funciona como un char. Entonces vamos a probar eso. No necesito éste. No necesito éste. Vayamos a Diseño. No necesito este también. Voy a eliminarlos. Ahora vamos a cada cosa. Por ejemplo, como sine n. Y veamos si el modo prototipo está funcionando. Entonces si al final juegas iniciar sesión, significa que si estás aquí, si haces click en Iniciar sesión, éste debería ir a éste, nos transitaríamos y deslizaríamos dos a la izquierda. Entonces echa un vistazo a esto, comprueba todo si está funcionando o no después de que pruebes esto y toda la animación lo están, todos los enlaces están funcionando, entonces podemos ir por compartir. Muy bien, ahora veamos cómo podemos compartir esto con otras personas y obtener algunos comentarios, que lo llamamos pruebas de usuario. Entonces básicamente, tenemos que compartir esto con otras personas. Vamos a Compartir automáticamente se va a seleccionar. Estamos en esta página vista revisión de diseño. Y solo voy a decir si esto es para desarrollo, si esto es solo para presentación o esto es para pruebas de usuario. Ahora mismo, lo pongo en pruebas de usuario. Por lo que cualquiera con el enlace puede simplemente verlo, revisarlo, ver la animación, y darme algunos comentarios. A continuación, haz clic en Crear enlace. Ahora, esperemos por ti. Depende de tu obra de arte y de cómo utilices tu fotografía para básicamente tardar dos o tres minutos crear el enlace para nosotros. Ahora mismo está hecho. Se creó un enlace para ustedes chicos que puedan compartir este enlace. Simplemente puedes copiar el enlace y enviarlo a algunos de tus amigos para conseguir algunos comentarios. Demos click en él y veamos qué pasó. Esto es solo para los ojos de prueba del usuario. Por lo que la animación va a empezar aquí mismo. Esto es básicamente, va a empezar desde aquí. Inicio de sesión, inicio de sesión. Volvamos atrás. Esto es todo animado. Hermosa animación con leche funciona como un encanto. Hermosa. Escribir. Todo funciona perfectamente. Voy a firmar. Bueno, estoy en esta página. Entonces, veamos si funciona. Bonito, bonito audio e-book. Y si hago clic en un género, ¿cómo hace el libro? Se puede buscar. Agradable. Volvamos atrás. Biografía. General. Volvamos atrás. Increíble. Por lo que antes de dar clic en esto, quiero mostrarle al cliente éste. Entonces si presiono Z en mi teclado, estoy cambiando de nuevo, entonces solo puedo MAX. Y esto es algo que ustedes tienen que diseñar. Muy bien, entonces volvamos a este. Si vuelvo a presionar Z, voy a volver de nuevo y puedo dar click en esto. Y veo esta hermosa animación. Impresionante. Hermosa. Por lo que más inferir. Golpe, a ver si esto funciona. Ya ves que esto es solo una aplicación móvil animada para que todos puedan darte algunos comentarios al respecto. Por ejemplo. Y si haces click en una parte superior, activada o x, perfecta, buena para girar. Agradable. El texto. Volvamos aquí. Entonces página Philip. Hermosa, impresionante. O un cool. Volvamos atrás y pinchemos en la parte superior. Volvamos aquí. Y yo sólo lo voy a comprar. Entonces recuerda, hay que decirle al cliente que tienen que presionar S, S y a, a para volver atrás. Ellos pueden elegir. Se puede pagar. Y ver estas hermosas animaciones. Alguien puede volver todo el camino y todo estaría bien. Entonces esto es algo que compartiste antes de enviar esto al cliente. Esto es para pruebas de usuario. Entonces volvamos. Y esta vez chicos lo ponen en desarrollo y dicen Update Link. Para el desarrollo. Tienes que contar esto explorado para iOS o exportar para la versión Android. Si por ejemplo es para Android y uno y ponerlo en Android por ejemplo, y actualizar el enlace. Por lo que cuando se declinó, acepta tu diseño. Esto es lo que vas a enviar al equipo de desarrollo. Ahora, tenemos el enlace de nuevo. Haga clic en él. Esta vez obtenemos mucha guía de información. Vamos a dar click en este 1 primero, Vamos a dar click en esto, esta la primera página. Entonces la segunda página. Después vamos a esta página. Entonces básicamente deberías venir al inicio de sesión espacial, registrarte, iniciar sesión. Vamos por un caramelo. Entonces se va a animar. Entonces si hago clic en algo aquí, como por ejemplo, éste, o éste obtiene alguna animación ¿verdad? Y puede cambiar entre ellos. Y podemos escribir un comentario. Si quieres algo que decir, tal vez varía en la siguiente página, por ejemplo. Y puedes mencionar a un usuario si lo sabes. O sea, puedes simplemente presentar eso, ¿verdad? Para que te puedan responder o puedes responderles. También puedes ir a la parte de codificación, los aspectos de vista. Entonces si haces click en algo que puedes ir a spec para poder ver todas las paletas de colores y podrás ver todo el estilo de personaje que has creado y todas las interacciones. Arrastre la pestaña. Entonces, y esto va a ser impresionante en cuando estés en esto, si pones tu ratón aquí para que sepan qué hacer. Ya ves que toma la primera línea, todo está aquí por lo que será fácil para ellos crear tu diseño con programación. Muy bien, Así que esta es la parte que alguien puede responder a tu mensaje. Entonces eso fue muy sencillo en compartir la empresa en modo de desarrollo o presentación, o pruebas de usuario. O el cliente puede hacer muchas cosas con él. Entonces básicamente, eso es todo. Por lo que la parte más importante es la prueba del usuario. Asegúrate de hacer pruebas de usuario cuando esté bien y declinar. Aprobar eso, enviarlo al equipo de desarrollo para su programación. Está bien. Ese fue todo el curso. Espero que hayan disfrutado de este enorme tutorial. 101. Proyecto final UX UI de estudio de caso: Consigamos tu proyecto final. Tu proyecto es sobre mercado fresco. Tienes que crear un sitio web y una aplicación para eso. En primer lugar, hay que contestar a este cliente. Tienes que demostrar que puedes hacer este trabajo. Entonces, ¿cómo lo haces? Diseña sitio web de compras de comestibles o una aplicación que ayude al cliente a afilarse fácilmente y comprar abarrotes en línea. ¿ Cuáles son las metas del proyecto? Compra de abarrotes frescos y asequibles a través de un sitio web y aplicación y consigue que se entreguen puntualmente a poco o sin costo. Está bien, ¿cómo tienes que empezar? Ve a escuchar. ¿Qué es la investigación de usuarios? Cómo crear cronología de trabajo y estrategia de diseño. Muy bien, Bien a cada paso. Y crea preguntas para tus clientes. Para entrevistas de usuarios, haz algunas preguntas para que sepa que te importa este trabajo. Entonces definitivamente te va a conseguir el trabajo. Después ve a los chicos de la línea de tiempo. Entonces imagina que conseguiste el trabajo a cada detalle. Después ve a descubrir, definir, idea, diseño, pruebas de usuario. Y tienes que hacer cada paso y enviármelo. Y si tienes alguna pregunta durante el proceso, no dudes en preguntarme. Definitivamente me pondré en contacto contigo lo antes posible. Y podemos pasar juntos. Para que puedas diseñar esta hermosa aplicación de sitio web para tu portafolio.