Desde el boceto a Adobe XD: diseño de la interfaz de usuario y prototipo interactivo | Irfan Rosandi | Skillshare
Menú
Buscar

Velocidad de reproducción


  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Desde el boceto a Adobe XD: diseño de la interfaz de usuario y prototipo interactivo

teacher avatar Irfan Rosandi, Product Designer

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      Introducción

      0:58

    • 2.

      Activos de diseño

      0:40

    • 3.

      UI de información de la ciudad - Parte 1

      14:03

    • 4.

      UI de información de la ciudad - Parte 2

      6:52

    • 5.

      Ajustar la interfaz de usuario

      2:18

    • 6.

      Lista de ciudades UI

      10:46

    • 7.

      Lista de ciudades - Swipe Interaction UI

      1:28

    • 8.

      2ª interfaz de la ciudad

      7:24

    • 9.

      Agregar interacción a la interfaz de usuario

      18:42

    • 10.

      Añadir interacción a la segunda ciudad

      10:36

    • 11.

      Conexión de la interacción entre ciudades

      5:19

    • 12.

      Finalizar el prototipo

      3:35

    • 13.

      BONUS - Comparte el prototipo

      4:20

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

201

Estudiantes

--

Proyectos

Acerca de esta clase

Descripción general

Hola a todos soy Irfan, soy un diseñador de UI/UX, gracias por visitar esta clase. En esta clase quiero compartir contigo sobre cómo crear un prototipo interactivo con animación con Adobe XD, esta clase está abierta para todos los que quieran aprender a diseñar una interfaz de usuario y un prototipo interactivo, ya sea que seas un diseñador principiante o intermedio.

Esta clase te enseña el proceso paso a paso sobre cómo crear un prototipo web interactivo simple desde cero, la clase comienza con la creación del diseño de la interfaz de usuario en Sketch y luego la creación del prototipo y la animación en adobe XD.

Al final de esta clase, espero que puedas crear tu propio prototipo interactivo con Adobe XD. También te proporcionamos activos de diseño que se usan en esta clase, para que puedas observarlo y practicarlo.

¡Así que empiezamos!

ESTUDIO DE CASO

Conoce a tu profesor(a)

Teacher Profile Image

Irfan Rosandi

Product Designer

Profesor(a)

Irfan is a product designer that passionate about designing digital products that work for the business and create a positive impact on the life of people. He specializes in enterprise and SaaS applications. He experienced designing for various industries and platforms. Irfan has helped early stages startups to Fortune 500 enterprises to achieve their goals through his product and design skills.

Ver perfil completo

Habilidades relacionadas

Diseño Diseño UX/UI Prototipado
Level: Beginner

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. Introducción: Bienvenido a From Sketch para agregar un B x, d u i Diseño y lugar prototipo interactivo. Hola, estoy verificando un U N Greg Diseñador Basing Indonesia Gracias por revisar esta clase en esta clase quiero compartir contigo y cómo crear un prototipo interactivo con animación usando Adam B X d. estoy verificando un U N Greg Diseñador Basing Indonesia Gracias por revisar esta clase enesta clase quiero compartir contigo y cómo crear un prototipo interactivo con animación usando Adam B X d. para todos los que quieran aprender a diseñar un sitio de protesta U I e interactivo. Ya sea que seas un diseñador principiante o intermedio. Difundida, emitió un proceso paso a paso y cómo corregir un sencillo interactivo donde prototipo desde cero. La clase comienza con crear el yo diseño y boceto y en crear el prototipo en una inmersión en otro B x d Al final de este vidrio, espero que puedas crear tu propia persona interactiva. Sobrevivió usando fuera de txt. También se te proporciona diseño Isis. Tenían temas en esta clase para que puedas verlo y practicarlo. Entonces, empecemos 2. Recursos de diseño: antes de empezar a diseñar, queremos asegurarnos de una cosa, que es queremos asegurarnos de que ya hemos llamado. El activo registrado en esta clase es así que te he proporcionado una carpetas llamada Activos. Por lo que en esto, los titulares confinaron los años de estatus de imagen en esta clase para que puedas encontrar también estas excepciones de texto y puedas encontrar imagen. Por lo que esta imagen que la tomé de en Splash Splash es muy caminata. Recomendar ese sitio si busca imagen gratuita sin atribución grabada incluso para uso comercial . Tan alta carrera comprometida con tu postura rubor. 3. IU de información urbana: parte 1: bien, entonces en esta clase, lo definí el proceso en dos partes. Por lo que la primera parte es sobre el diseño yo. Tu diseño está en elegir el teléfono, administrar los diseños y cosas así. Y la segunda parte es sobre Paris I ping, que es quien quiere hacer el tú yo para ser aplicable para ser interactivo con animaciones y cosas así y para la yo diseño parte boceto divertido para eso porque he estado usando sketch para años y soy bastante familiar con boceto para tu diseño. He estado memorizando las tarjetas cortas del boceto, así que es un poco más rápido para mí, para King y sketch para ti. Diseño pero 40 por cyp Inham usando el auto B X D. Pero si te sientes más cómodo trabajando con otros Bexley, eso está totalmente bien. Puedes crear el que estás usando en una B X d Básicamente el es tipo de lo mismo. Simplemente sigues a lo largo de estas clases. Se puede ver cualquier cosa e implementar eso en el otro B X d s. bueno, básicamente no es como cosa muy completamente diferente, Pero en esta clase, quiero usar sketch porque estoy más cómodo trabajando en boceto para ti. Yo diseñé. Pero yo sí. Yo sí sé que cómo ser éxtasis es herramientas bastante robustas para mecanografiar piezas. Entonces estoy usando ambos sufren. Muy bien, entonces ahora voy a crear nuevos documentos. Y lo siguiente es, quiero crear un fueraborda. Entonces y por el amplio tamaño en esta clase divertido 12 80 y 7 20 Bueno, esto es sólo un ejemplo. Fuera del tamaño y puedes usar cualquier rebanada. Lo más importante no son los tamaños, pero se trata de cómo se puede entender el proceso. Está bien. El siguiente es que quiero importar el activo a estos fueraborda. Entonces vamos a nuestras carpetas dije aquí y ahora quiero probar esta imagen. Ahora se puede ver que esta imagen se está mordiendo. Estoy usando varios enchufes si quieres revisar. Ah, chicos cortos MDs cool Prague in han estado usando eso desde hace mucho tiempo. Y esto es realmente genial, Borgen y realmente alto Klay recomiendan este enchufe en su mejorar la productividad y el segundo enchufe en Entonces te recomiendo que utilices este distribuidor para poder distribuir Ah. un objeto a otro objeto con un espaciado muy específico. En cambio, lo ajustas mentalmente. Eso se puede comprobar a la escuela, ¿verdad? Muy bien, volvamos a nuestra clase ahora. Um, sólo quiero precisarlo, acuerdo? Se ve bonito. Y lo siguiente, a menos que pasemos a imagen un poco así. Entonces creo que está bien ahora, y cualquier cosa es, um Vamos a impuestos ya que escribimos algún texto aquí. Se quiere escribir el título, Así que estoy usando abre. Él puede. Viniste dólar estos este teléfono propio teléfono de Google. Es gratis. Voy a hacerlo lleno. Está bien. Entonces lo siguiente es, se quiere agregar algunas descripciones puerta para descripciones. Yo quiero que sea incertidumbre, y sigue siendo pequeña. 70. Está bien. Para que pueda tomar las descripciones sobre el titular del activo. Puedes usar la gloria. Yo soy ipsum un oleaje si quieres. De acuerdo, entonces es bastante de Lila. Nos lo re rebanamos, ¿verdad? Y el siguiente elemento es el tú yo, um de trato. Está bien. Está bien. Ahora vamos a crear trato descubrir bien. Cerca para hacerlo lleno. Y el siguiente es aprender. Bueno, esto es sólo ejemplo. No es un sitio web real. Es sólo aprender. Propone T. OK, consigue el siguiente. Probablemente bloqueado. Y la siguiente es tienda ártica. Por lo que ya tenemos un aventón. Pero se puede ver que esto es, como, todavía desordenado. El espaciado entre Wan Ling y otro no es consistente. Entonces, ¿cómo hacer que eso sea consistente? Podemos usar el plug in que te he mostrado antes, que es distribuidor para hacer eso. Es muy sencillo que acceda al Blufgan que estoy usando Short llegó aquí y podemos insertar el espaciado. Por ejemplo, quiero insertar para un cinco. Digamos que está bien, así que tienes muy cinco. Está bien. Muy sencillo. Y lo siguiente que quiero en algunos, no en algunos sino en uno, creo. Sí. Entonces vamos a Nosotros a los colores. Entonces esto es solo, um esto es como, la página actual. Entonces, ¿está bien? Está bien. Está bien. Deja que la semana trabaje. ¿ De esta manera cómo agruparlos esta guerra? Está bien, se ve bien. Agruparlo. Y lo siguiente es quién quiere agregar, um, um, los botones, los botones de contracción. Mamá y yo usamos, uh o terminarlo romper soltero. De acuerdo, así que queremos que Musa experimente encajes. Bueno, gira. Por lo que puedes fijar estos 18 en este tema en 30. Muy bien, así que cambiemos el radio Gay ya que, como, un poco también. Está bien. Perdón. Está bien, se ve mejor ID de grupo y cambia esto a gusto y esto a luz. De acuerdo, así que lo siguiente es, que quieres agregar alguna estadística debajo de ella, eso es lo que. Entonces el país, esto es 13. Y esta es Alicia. Está bien. Ahora, a menos que lo hagamos 17 y este, es que reducimos la capacidad alrededor de 60. Por lo que queremos establecer un espaciado. Irán Fife. Kayla, Dulce Corbett. Ahora se duplique que vamos a preguntar. Dijo que esto es Population Swan están en 1.8 1,000,000 lenguaje cisne. De acuerdo, así que lo siguiente es, queremos establecer el espaciado de esta pared, así que vamos a usar el enchufe llamado Molestar Batory Game. Por lo que quiero que esto sea 50. Está bien, mira, escuela, eso está torcido. Está bien, Así que lo siguiente es, quiero agregar algo así como unos botones de juego. Entonces esto es, como jugable. Ahora vamos a crear ese icono que voy a usar. Ah, este rectángulo. Y ahora estoy usando comando enter. Se puede ver esto, y queremos que Dell ocupe 81 punto. Está bien. Así como lo devolvimos así. Está bien. Y el siguiente Lex, creamos. Agradable. Está bien, ponen aquí. Por lo que quiero cambiar el color para nosotros. De acuerdo, eso es que perdemos a debajo de esta capa para que pueda ver eso. Está bien. Está bien. El siguiente es, que quieres hacerlo. Es ser centro. ¿ De acuerdo? ¿ Quieres este click en esta forma aplanada primero? Está bien, así que quiero que sea centro. Está bien. Se ve bien ahora, y queremos dar click en esto. Calma, capaz de apreciar capas utilizando como sub golpeó opresiones. Haga clic. Ok, se ve bien. Ahora, cambiemos esto a luz. Ahora queremos cambiar la opacidad para que estén en 80 o 70. ¿ De acuerdo? Y lo siguiente es, queremos en flecha aquí, así que esto es como un ligero Sí. Puedo dar click en el toque Cerro para cambiar la ciudad. Correcto. Lo hizo en lo muy simple Eso es lo que creamos en absoluto. En primer lugar, estoy usando rectángulo otra vez. Voy a usar partidario aquí. Sin marcar. Agradable. Está bien. Asegúrate de que quiero usar esto para ser, pero esto en centro y el antro también honesto en este medio aquí. Y lo siguiente es, um, queremos usar estas costas cuando tenga esto. Está bien, ahora, vamos Estábamos emocionados así, ¿ verdad? Se ve bien. El conocimiento cambió. El color es demasiado claro. Callo. Nosotros lo cortamos, eso es lo que buscamos. Se ve bien, pero se ve bastante grande. Política. Reducirlo. Está bien. Se ve bien. Conocimientos's Cambiamos esto. Nosotros lo sabemos. Cambia la opacidad a alrededor de 60 o 70 años. Está bien, así que se ve bien. Necesitamos una más aquí, ranuras, duplicamos ese comité. Vamos cariño a darle la vuelta bien. Es como la escuela. Está bien, así que ajustemos un poco esto. Yo quiero asegurarme de que aquí tenemos espaciado Cory. Creo que está bien. Y esto es solo los consejos suelen ser estos al lado de la sección de odio de línea aquí, Así que si el teléfono rebana 17 solo puedes multiplicarlo 17 multiplicar con 1.5. Entonces conseguiste los números. Si te gusta que ven más puede salir de ella. Karekin, solo haz que esto sea, uh, marca. De acuerdo, Entonces lo siguiente es, um, quieres asegurarte de que este espaciado, bien tiene suficientes cosas que tiene, como, comenzó aquí. Es, como, solo espacio vacío ahí Puede arreglar eso también. Está bien, así que vamos a reagruparlo. Y lo siguiente es, queremos agregar pocos todos icono. Entonces usted, señor, ¿puedo ir a otra ciudad? Pueden ver adversidad, así que te permite hacer eso. 4. IU de información urbana: parte 2: cuando uso todo rectángulo. De acuerdo, sólo hace siete para empezar que sólo para asegurarnos de que este es un árbol cuando sí cogemos en este golpea la guerra de Trias, son tres. Está bien, Así que vamos a citar este ataque de conocimiento gay aquí si todos lo hacen tirar posibilidades Toy pan esta pared. De acuerdo, así son sólo hacer esto alrededor de los 15. Vayamos un poco. Está bien. Por lo que se ve bien y las cajas se ve un poco a un grande. Entonces, ¿quieres reducirlo? Ha estado ahí. Por lo que hoy queremos reducir esta rebanada. Tan increíble comando K en una escala estos a 80% se ve mejor. No, es nosotros se puede ver que es bastante pixelado aquí. Entonces arreglemos eso cuando le dije a cinco en su lugar, Ok, nos guste múltiples. De acuerdo, entonces esto es lo que hace que esto se vea pixel mater. De acuerdo, vamos a ocultar esto en tres, ¿verdad? Muy bien, ahora cambiemos el espaciado pronto, ¿ verdad? Por lo que se ve bien. Ahora vamos a ajustarnos. Él espaciando un poco más o menos desde la parte superior aquí que quieren poner estos van a poner estos alrededor de 50 este 'll en la pared de los 50 s. Vamos de verdad con ello hasta aquí. Se quiere hacer que esto sea para cosquillas centro a esto. Está bien, se ve bien. Ahora, vamos a los dos. Pero está bien, así que creo que ahora está bien. El siguiente es que quiero cambiar el espaciado aquí. Por lo que te deja con ella están en 60. Se ve un poco pequeño. Eso es lo movemos a 70. De acuerdo, creo que 75 años bien. Y podemos simplemente bajarlo un poco. 40 su línea. ¿ Se puede querer reducirlo un poco? Un poco más. Yo quiero hacer esto a la carne verticalmente centro. Entonces en esta pared. Entonces esto es que estoy usando un boceto. Blufgan descoloró al trabajador del guión EM para que pueda memorizar este atajo. Y es hacer diseñar a la izquierda, si uno más fácil. Entonces de verdad les recomiendo que revisen esos enchufes. Está bien. Perdón. 30 y quieren hacer este 30 también. Está bien. Entonces se ve bastante bonito ahora, Y lo siguiente es, queremos simplemente fumar estos botones, pero queremos hacer esto alrededor de los 30. Y éste quiere alinear con el botón y desde abajo. Se quiere hacer este Irán 40 Creo que vino Cerdo 40 s. Y este queremos que se centre verticalmente a este gay. Disses dicen 512 Haz esta guerra por aviso que se ve un poco donde ¿Y si cambiáramos esto a, uh, mismo con esto? Mira sabe dónde cambiaste un poco. Está bien, así que esto es mejor. 50 y 65. Bueno, en el problema. Está bien. Entonces creo que está bien. 30. Está bien. Entonces solo quiero asegurarme de que esto sea que estén en las mismas exposiciones. Está bien. Está bien. Nuestra X. Así hemos terminado nuestro diseño en la primera página. Y en el siguiente video, um, diseñamos la interacción. Cuando veas, click en la sección de pocos en los pocos, todo para que puedan ver otras ciudades. Muy bien, muchas gracias. Y te deja en el siguiente video. 5. Cómo hacer la interfaz de usuario: Está bien. Entonces lo siguiente es, queremos que Teoh truco un poco en el diseño que hemos diseñado antes, vamos a trabajar un poco, así que parece oficial encendido. Se puede ver a ese Ling aquí. Yo quiero hacer algunos retoques aquí. Por lo que quiero asegurarme de que ahora se pueda ver claramente aquello que hornear es el pitch actual. Por lo que quiero reducir un poco la opacidad en los subalternos. Entonces hagámoslo. Y dije, así. ¿ Y qué es? Algo en 15. Yo también quiero hacerlo lleno. Y sólo podemos volver a comprobarlo. Está bien, puedes ver eso. El espaciado como diferente ahora es tiene un especial diferente. No se preocupe, porque no se puede Sólo ese Gae 45. ¿ Todo bien? Es genial. Ese soy yo. Vamos a quitarlo. Entonces creo que 50 está bien. Está bien. Entonces lo siguiente es, solo quiero mover esto un poco, y una vez basing tuvo este idiota. De acuerdo, así que no está demasiado cerca con esta flecha. Está bien. Perdón. Creo que es Es vino. Creo que este es mi miedo. El mordido otra vez. Está bien, así que creo que está bien en solo vivir este EU lo es. Si siguió estos, creo que es que se necesita demasiado basar. Creo que está bien por ahora. 6. Lista de ciudades UI de la UI de la ciudad: Está bien. Entonces lo siguiente es, antes de ir a nuevos lotes, salvamos a su hija, hombre. Porque no estoy sirviendo el stickum y sin embargo, así que sólo para asegurarme de que la mitad de todo, me salvó la vida. Y me siento aquí, y lo siguiente es, queremos duplicar estos fueraborda. Entonces vamos a tener b y duplicar esto aquí arriba. ¿ De acuerdo? Está bien. Y lo siguiente es, que es que creamos Tom Nail. Entonces para acreditar tiempo ahora queremos en el F cuatro patas primero. Entonces vamos a usar rectángulo y vamos a la sombra , son pequeños castillos. Básicamente, es molienda. Está bien, entonces, um, dijo esto a ciegas, deshonestas quería jugar, pero este, voy a reducir la capacidad. De acuerdo, entonces es como, ah, para Les on. El siguiente es, quiero agregar el auto. Voy a usar estos redondeados. De acuerdo, ¿ entonces quieres hacer, como, tres, tres cartas? Entonces el tamaño que quieren hacer el con para estar alrededor de 400 creo que se va al infierno, Es realmente sólo hacer el odio que se enhebre en tierra. Creo que es como Y ahora vamos quién cambió tus ideas? A lo mejor alrededor de los 15. Está bien. Está bien. Entonces lo siguiente es, eso es que practicamos. Eso es que volvimos esto a ser masa. Está bien en. Queremos simular cómo nos parece. Por lo que quiero hacer este 25 frente abajo y 25 de días también. Está bien, así que leamos años de caramelo. Este dinero para esta guerra, esto es 25. De acuerdo, entonces tenemos un pequeño problema aquí con nuestro con su Así que quiere asegurarse de que usted, señor, pueda ver que esta es una lista fuera de la tarjeta, así que habrá otro auto aquí, así que queremos inyectar el hombro un poco fuera de otra tarjeta para que veas que esto es lo intercambiable Ahora vamos a reducir facilidad con That's Intentamos Irán para ti, 50. Está bien. Yo quiero reducir la pared de los haters, por lo que se ve mejor. Está bien. Entonces creo que ahora está bien. Hola, señor. Cambiaste esto a 25 portón. Esta vida, lejos de abajo. Una llave pequeña. Ahora vamos a dulce triciclo. Correcto. Por lo que ahora se ve mejor. Muy bien, Así que lo siguiente vamos a insertar imagen aquí. Lobbies van a ir a mi buscador aquí. Y esto es de calidad y pobre. Entonces esta es la imagen encendida para insertar aquí. Clave. Está bien. Se ve bien ahora en marcha. El siguiente es, que es que agregamos algunos, algunos ordenar texto fuera de curso. En abajo está el país apenas milicia. Yo quiero hacer este 17. De acuerdo, éste un poco más grande, pero 20 cisne es un medio. Está bien. Se ve bien. Ahora, eso es que éramos Fitbit. Entonces son 40. Creo que son treinta, así que ya lo sabes. Está bien. Está bien. Por lo que hay que asegurarse de que este espaciado sea correcto. Horrible. Entonces a veces los bocetos, como, si esperas a esto, uh, distendido mostrando al al objeto donde tus historias centrales. Entonces, por ejemplo, si yo sobre el curso o aquí, Entonces el distendido es de estos objetos a este objeto por debajo del curso son así que quieres medir la distancia de este objeto a estos, um, libros. Esto es que se puede sólo ah, esperanza por acres están aquí, así que se puede ver que se encuentra mostrándole el dising que viento en este objeto al objeto en su curso. De acuerdo, entonces creo que sí. Conozco a Onda. Queremos sólo a un poquito un Grady oscuro aquí por lo que los detectos pueden ser más irritables. Eso es lo que hacemos ese increíble rectángulo. De acuerdo, ahora veamos en Greg aquí. Pequeña casa. Yo sólo quiero hacerlo un poco suave. De acuerdo, entonces creo que es para que lo sepa en lugar de hacer eso otra vez y medir la distancia. Sólo deja que éste Es sólo para jugar gatitos, Eso es sólo un espaciado. Está bien. Entonces, Nellis, cambiamos la imagen y cambiamos el texto, que no tuviéramos que reajustar el espaciado y agregar esto justo dentro. Ahora lo siguiente es, que se quiere agregar otra ciudad. Yo quiero agregar esta medicina de la ciudad. Está bien, así que está bien, éste. Está bien, eso está listo. Cambia esto a Dubai. Una especie de sesgo. Y tu nombre hizo nuestro Ok. Está bien. El siguiente es cuando tuve esta foto. Por lo que no se puede ver esto sólo puede moverlo primero Esperanzas. Entonces yo, ah, hice la llave. Borai Price Siyuan mantener o es como que no debería presionar ese caso. No hay problemas. Desaparece ahora. Está bien. Por lo que puedo sólo un espaciado en el juego derecho. Cisne es que tengo, uh, se pone en Boenisch. Por lo que la propongo off. Ah, este Grady Y es que usted piensa que esto no es rey legible y sólo él. Pero el problema es que es Ah, no es consistente. De acuerdo, Entonces nosotros solo Si quieres hacer eso, si actualizas esto, si cambias esto, tienes que cambiarte a otros lugares. Bueno, lo siento. Es consistente. Entonces voy a debajo de eso. Creo que está bien. Creo que aún es legible. Está bien, así que creo que está bien. Está bien por ahora. Tiene puede ver que este es el lanzamiento inicial de la guerra y luego se fue a dar click a los pocos. Todo lo que ven, Eric. Por lo que las graduaciones. Ahora vamos a reclutar el siguiente paso. 7. Lista de ciudades: desliza la interfaz de interacción de la Interacción: La siguiente parte es que queremos, um, querer um, crear otro escenario, que es cuando los usuarios se deslizan, thes, menos desprevenido. Por lo que cuando lo pasen fuera de curso, este auto sería así. Y este tipo sería así. Sí. Y queremos crear esa, um, um, esa piel Ari. Ah, Entonces lo que haces es queremos tientas esto primero vienen en G divertido keep o tarjeta corta y podemos duplicar eso. Y acabemos de ajustarnos. Entonces es 25 Muy bien, entonces porque queremos ponerle un tipo en Ida B x d El camino en otro B X'd a cualquier carne funciona es ah, necesitamos crear múltiples estados para que sea extra will auto. Yo estoy animado nuestro diseño de este estado a otro estado. Y lo que tenemos que hacer es simplemente crear el segundo estado. Entonces este es el primer estado y este segundo estado ISTEA. Por lo que en realidad es bastante simple. Solo necesitamos crear la pantalla para la variación. El estado de pantalla y fuera del rayo X irá a cualquier carne y la animación para nosotros 8. 2ª UI de información de la ciudad: Por lo que hemos creado el primer sorbo te para la miseria a bordo. Y ahora queremos crear otra ciudad. Apenas en la segunda ciudad se encuentra Medina. Entonces queremos duplicar estos fueraborda, y vamos a cambiar el contenido. Entonces hagamos eso. América será todos estos fueraborda mano implicados. Está bien. Está bien. Por lo que ahora quiero cambiar estos cuadros a través de este cuadro. De acuerdo, entonces lo siguiente es, que quieres cambiar estos títulos Bueno, y para la superposición antes de que Lay se base, básicamente engañando. Entonces quieres solo quiero agrupar trato para liferes, cotizar y simplemente renombrar este dedo excesivamente. Está bien. Voluntad deshonesta. De acuerdo, entonces, uh, debería estar aquí. Tecnicos Onda que quieren cambiar esto. De acuerdo, Perdón, porque este es auto que la imagen es bastante diferente, así que puedo verlo en el Texas. No es creíble comparado con el 1er 1 No, eso está mal, me temo. En primer lugar. Está bien. Para que pueda ver la comparación. Está bien. Entonces voy a borrar esto primero. ¿ Todo bien? Entonces vamos a hacer algunos ajustes en la imagen para que podamos leer el texto allá Para hacer eso es lo que queremos y algunas películas. Es también con Grady en. Por lo que la imagen puede ser más donde el texto puede ser más comestible. De acuerdo, entonces tú Texas poco más comestible ahora, y quiero cambiar a este pequeño pendejo. ¿ De acuerdo? Está bien. Entonces quiero cambiar. Se quiere tientas esto y esta vez lo hará. De acuerdo, entonces, uh, quería arreglarlo, pero esta, esta pared, ¿ verdad? Ese es mi dolor oculto. Entonces, pendejo. Está bien. De acuerdo, así que esto es por un píxel. Entonces voy a mover esto por un píxel. hincha. Está bien. Por lo que se puede ver que esto no es legible. Difícil cambiar esto a colores oscuros. Por lo que es más capaz y este pendejo Hajric. Entonces creo que está bien. Hagamos en el fondo para ser un poco oscuro. De acuerdo, entonces creo que está bien. No. Entonces lo siguiente es, queremos duplicar esto, ¿de acuerdo? Podemos simplemente ponerlo aquí. No somos un boleto. Eso y nosotros podemos usted está muerto. Pero, ¿quién puede hacer esto también? De acuerdo, entonces hay muchas maneras de hacer eso. Al menos lo más importante es que entiendas el concepto porque A veces puedes simplemente diseñar estos y luego vuelves atrás, vas, ajustas algo, y luego lo devuelves de vuelta a aquí. Um, si ya entiendes el concepto, entonces esto es realmente muy sencillo. Entonces el concepto es el primero que creamos el primer estado inicial. Entonces este es el primer estado, y luego creamos el segundo estado, que es cuando hicieron clic en esto, pero y ven horrible un suficiente para laicos. Y luego, uh, el carro, Ok. Y luego otro estado es cuando dijiste deslizar esta tarjeta. Entonces vamos a crear el otro estado. Entonces esto es básicamente sólo una variación fuera de estados, y luego queremos a cualquier carne que en el anuncio A B x d Nuestras filas están entusiasmadas. Ahora vamos al siguiente video. 9. Añadir interacciones a la interfaz de usuario: después de haber creado con éxito nuestro propio diseñado. El siguiente paso es que queremos transformar que tú diseño en vida de proceso clicable. Quieren cambiar la imagen estática en broadside interactiva clicable usando fuera de B X D y lo cool de las ciudades Utterback que excepto horario para que no tengas que hacer nada. Simplemente acaba de abrir este archivo catch en el propio Adobe X'd para que no tuviera que hacer ir por nada tan simple como abierto como abriste cómo cae Toby X'd. Entonces, empecemos. Vamos a archivar y luego porque guardé el archivo de boceto de Falls en mi computadora. Entonces básicamente un clic en abrir desde tu computadora, Muy bien, así que voy a elegir tesis en mi archivo. Hajric. Por lo que toma algo de tiempo para cargar. Está en contra de la que otra B x d. Realmente agradable en renderizar nuestro diseño. Entonces no hay como, um, imagen borrosa. No hay, como Miss Place. Objeto hasta el momento es muy bueno. Es muy, muy buen trabajo salir. Entonces sí, creo que ahora es círculo. Lo siguiente es, vamos a probarlo. Así que para jugar un prototipo next t solo tienes que dar click en esta obra Puedo Sus ex servicios son guerra Priceline on Si quieres parar o escribir, puedes ver hay un prototipo tipo un tap aquí así que le das click y se vuelve a ser mal humor mecanografiado como GNC que hay icono de casa aquí. Entonces esto es Ah, una señal Si quieres hacer este ARB debería ser el fueraborda inicial Cuando arranca el prototipo . Después hacemos click en esta casa puedo así que se vuelve azul. Por lo que significa que cuando los cuatro top exhibieron entonces este arte pero mostrará primero. De acuerdo, entonces lo siguiente es, vamos a probarlo por nosotros. Talla hajric. Se puede ver Ahí está. No se puede hacer clic. Si hago clic en él y no pasa nada, es porque aún no hemos hecho nada. De acuerdo, entonces la primera interacción que quieres crear es que queremos crear estas, um, interacciones la inicial y emisiones. De acuerdo, entonces cuando dices jugar el parásito pueden ver, como en detectos, como moverse desde arriba, para que puedas ver puedes sentir que las emisiones. Entonces eso es lo que haces eso para hacer Eso es muy sencillo. Queremos duplicar esto. De acuerdo, entonces volvemos a nuestro grifo de diseño aquí y ahora, vamos a Rico Pittis y su básico aquí. De acuerdo, lo voy a mover a la cima aquí. ¿ De acuerdo? Entonces, como digo la forma en que funciona auto animate. ¿ Está fuera transformar el objeto de un estado a otro estado? Está bien, que se deje dar. Está bien, lidera. Yo les doy un ejemplo. Entonces, franca simple. Yo lo muevo a la derecha aquí. Está bien. Esto es sólo un ejemplo. Y voy a broadside, y luego queremos asegurarnos de que esta sea la persona titular porque este es el primer fueraborda que se lanzará primero. De acuerdo, así que queremos poner estos para que sean vayan a estos cartón. Yo quiero poner el gatillo al tiempo y el trato Quieres tener retrasos en. Nosotros queremos. Cuando dices jugar, no hay realmente queremos x t guerra se ejecutan. El animación directamente, Pensamos, habiendo retrasado o cualquier cosa y las transiciones que quieren hacer clic fuera de enemigo. De acuerdo, así que digamos que el ruso es tres. De acuerdo, así que veamos cómo se ve cuando hacemos clic en Jugar. Está bien. Por lo que se puede ver que se trata de un dedo pequeño. Eso no es bueno. Eso no es bueno. Pero el punto es, quiero mostrarles cómo están fuera a cualquier red. Entonces la forma en que funciona es básicamente se convierte para, um, cómo el objeto de un estado a otro estado automáticamente. Entonces lo que hacemos es simplemente prepararnos para afirmar. Entonces este es el primer estado, y este es el segundo estado y fuera alto animar automáticamente eso para nosotros como importaciones eso. De acuerdo, así que esto es un poco que he sido fea, así que vamos a cambiar esto de nuevo. Yo quiero revisar 12 conseguir las exposiciones. Podría ser. Y vamos a decir esto a la explosión de vuelta. Está bien, entonces en el estado inicial, queremos que esto sea la opacidad del objeto para estar alrededor de 10. Entonces así es como haces eso. Por lo que la opacidad que quiere se lo dijo a 10 Cisne pendejo, o simplemente puedes multi seleccionarlo. ¿ De acuerdo? Está bien. Es como si fuera bueno. Y lo siguiente es quién quiere cambiar esto a un poco aquí arriba, por lo que la animación Mostrará que esta pila viene de arriba aquí a abajo. Y éste? Yo quería estar de abajo aquí. Está bien. Y esto lleva años. Quieres ponerlo Onley debajo de ella en el fondo aquí. Está bien, ¿ éste cuándo? Cierto desde aquí. Está bien, entonces éste, este enlace que quería, lo dijo desde la charla también. De acuerdo, entonces este es el estado inicial. Entonces vamos a reproducirlo jugar. Así es que revisamos de nuevo en el sitio de la pieza. Básicamente, es que podemos Estamos usando el disparador de tiempo. Por lo que hay mucho gatillo en la instrucción ahí. Toca, arrastra, fuerza teclas y compacta. Pero, temporizador, lo que usamos lo que elegimos el tiempo porque queremos ser queremos establecer es ser automatizados. Entonces por eso nos limitamos a tiempo. De acuerdo, así que vamos a reproducirlo. De acuerdo, puedes ver eso. Es que es un poco animado ahora, ¿verdad? Eso es que lo jugamos de nuevo. De acuerdo, así que parece que es un poco lento. Eso es que cambiamos esto. La velocidad alrededor de dos segundos. Está bien. Otra opción que podemos probarnos. La opción oriental. Esta opción de cosa es cómo se ve la animación esta velocidad, bien, está fuera significa, um la velocidad que las animaciones pensaron un poco rápido. Y luego, Ah, la saliva se reducirá lentamente al final de la animación. Entonces este es el fuera y los pecadores. Um, la animación comenzará con lentitud para escupir. Empezaremos despacio, y luego va un buen más rápido al final de la cualquier misión, por así decirlo. Por lo que la flexibilización se trata de cómo la velocidad de las animaciones. De acuerdo, quiero revisar esto para estar fuera y vamos a quien juegue el juego. Está bien, volvamos a jugar. ¿ Todo bien? Por lo que es genial. Pero creo que si todo es movimiento, entonces es como bastantes distracciones. Yo quiero poner estos para que estén en las posiciones. No es nada. Creo que eso es mejor. Una copia. Ahora, medida que volvamos al grifo de diseño, voy a tomar esta exposición, voy a aplicar esto aquí. De acuerdo, así que volvamos a jugar. Sí, creo que es Es mejor. Creo que es genial. Bueno, esto es animación. Se puede jugar con esto, se puede crear la suya propia y la misión, pero el principio es que quiero mostrarle al principal cómo volvió a crear esto. Depende de tu creatividad. Cuanto más creativa pueda obtener la animación. Aún mejor, puede probarse a sí mismo. Y para hacer las cosas más interesantes, quiero mencionar que la imagen para ser un poco más grande en la segunda son pobres, por lo que puedes ver como si fuera una especie de zoom. Por lo que hay efecto off zoom. De acuerdo, así que hagamos eso. ¿ De acuerdo? Ahora me gusta tanto esta imagen y luego la retomo la suya. ¿ De acuerdo? Sí. Simplemente No estábamos precisamente para ser demasiado grande, sólo sólo pequeña re rebanada como esta. Ahora volvamos a jugar, acuerdo? Entonces puedes ver que es una especie de zoom, ¿ verdad? De acuerdo, para que veas que es amable. No es realmente suave bateo fuera de Bhakti puede arreglar eso. Pero por ahora, creo que es es Es muy cool hasta ahora es muy bueno ahora. De acuerdo, así que vamos, uh, hacer lo siguiente que es cuando veas click en estos pocos todos ganamos. Quiero mostrarle al usuario esta superposición así que ayúdame a hacer eso. Entonces este es el principio es el mismo, como Hardy. Lo profeso así en lo profuso. Este es el primer estado, y este es el segundo estado justo en. En este caso, este es el primer estado, y este es el segundo estado así que en el elemento debe ser contiene en esa parte. Entonces si este es el primer estado y este es el segundo estado, digamos que el primer estado tiene varios elementos. Entonces en el en el segundo estado, debería tener siete elementos también. Entonces la pregunta es: Bueno, Bueno, aquí tenemos autos, ¿ verdad? Tenemos oferta más tarde. Por lo que significa como si fueran elementos adicionales. La respuesta es no. Este elemento debe ser el acceso aquí también. Pero el truco es que quieres establecer la capacidad de ser cero aquí. Por lo que estas tarjetas pudimos escuchar que no se está mostrando. Aquí. Vas a comprar esta noche. De acuerdo, Ahora, vamos a liderar con eso. Por lo que he crecido Did in tiene suficiente para después. De acuerdo, así que el laico sufre contiene fuera Ha. Estos oscuros Ins Grady y este carro. No, vamos a Chicopee. Dennis Bueno para decidir junta. Está bien, está bien. Para que veas que esto es así. Y lo siguiente es que se quiere establecer la opacidad. De acuerdo, La opacidad a cero. Nosotros queremos establecer la capacidad de este cero, y luego queremos poner su capacidad a cero está bien, antes de eso, vamos a quitarlo al fondo. Aquí y l A v cambió su 20 Así que el un tirón emocional muestra como este auto se mostrará desde abajo. De acuerdo, así que vamos a abordar. Es como si fuéramos a proteger. Pero desafortunadamente porque, um, como se puede ver, que esta oferta yacía la horrible A está encima. Este es el on top off todo capa fuera de lugar hasta que todo. Entonces cuando hacemos clic en la parte superior del prototipo, no podemos acceder más a estos objeto combustible. Porque cuando le hacemos clic Ah, lo que seleccionado es est'll a er off layer. Entonces el truco es ¿quién quiere crear otro objeto? De acuerdo, que quieren crear rectángulo como lo colocamos en Tom un ajuste. ¿ A quién le vas a quitar la frontera? Y cuando dije la capacidad a cero. Entonces cuando vamos al prototipo, y luego cuando hacemos clic en esto, puede ver que aquí podemos sumar los puntos calientes. Pero básicamente estamos agregando nuestro spot en la parte superior del rectángulo inviable. Está bien, ve al punto. Y entonces somos nosotros. Por lo que me gusta este informe. De acuerdo, así que vamos, uh sólo para que el gatillo sea paso. ¿ Por qué es eso? ¿ Por qué no el tiempo? Porque estamos pinchando aquí, está bien. Y lo siguiente en realidad está fuera de un compañero de equipo. Pero para este, queremos que la dirección sea en cuclillas más rápido. Una carrera. 0.38 Ok, entonces creo que es genial. Ahora, vamos a filar broadside. De acuerdo, Ahora vamos a dar click en este campo, acuerdo? Entonces oye, se ve muy suave. Ahora. Queremos establecer el tipo de pieza. Cuando veas dar click en esta zona, vuelven atrás, la cicatriz se volverá a ocultar. Entonces a medida que volvamos a nuestra X'd y en la sección de tipos de socios aquí, vamos a vender como este rectángulo. Precisamente esta lineal. Escucha el fondo de esta tarjeta, y luego quieres agregar esa instrucción. Entonces, ¿qué hacen estas direcciones de estatinas es cuando haces clic en ella? Yo quiero devolverlo a este fueraborda. ¿ De acuerdo? Y el suyo puede ver que el ajuste será dicho automáticamente por la ciudad externa de atrás. Entonces es copiar la interacción profusa, que es la misma, como las instrucciones dis. De acuerdo, nada menos. Lo jugamos de nuevo. ¿ Quién? Tómalo. Y ahora hacemos click en unos cuantos. Todo bien, no lo veo. Cuando hacemos click en esta zona, retrocede. Está bien. Expectable Rx en corsé Ellison. Lo siguiente es que queremos hacer unas interacciones medicamentosas. El rumbo del dragón también es muy sencillo. Ya sabes, la gran ciudad. Entonces lo que hacemos es querer en la interacción bebió en esta tarjeta. Entonces hacer eso también es muy sencillo. Hacemos click en esta tarjeta. De acuerdo, hacemos click en esta tarjeta y luego quien en un enlace a este trabajo duro en lugar de apagado toque como el gatillo. Nosotros queremos poner esto para ser transportado en camión, vale. Y la acción también enemiga. Y este es un oleaje que queremos sumar. Así que asegúrese de que lo que seleccionó lo seleccionado sea sólo este grupo. Entonces no vas a sumar va a descubrir, como el trabajo, pero sólo a esto sino a ellos. De acuerdo, ahora vamos a hacer clic en él, y sólo pero aquí también está usando automáticamente el mismo ajuste. Ahora jugémoslo. Hacemos click en unos pocos, todo lo que es lo movemos. Muy bien, Así que es movida cuando lo drogamos. Está bien. Relaciones actuales 10. Añadir interacciones a la segunda ciudad: hemos creado con éxito nuestra primera instrucción urge sobre la primera Ciudad. Ahora queremos seguir trabajando en las interacciones de segunda ciudad. Entonces, empecemos. En primer lugar, necesitamos también el primer estado inicial para la segunda ciudad. Lo mismo, como esta primera ciudad. Simplemente necesitamos establecer la capacidad, como Like, esto es lo mismo. Entonces vamos a reducir la opacidad para el estado inicial. Entonces para eso, queremos copiar días. Entonces vamos a renunciar. A menos que lo coloquemos aquí. Eso es lo que se puede. Si es aquí. Ahora, cambiemos la capacidad del objeto de la misma manera. Por lo que la opacidad es del 10%. Vamos a hacer que sea la misma Gail. Entonces vamos a reducirlo al 10% la cámara lo hace. Este muro. Está bien. Y lo siguiente es, queremos que también Teoh cambie la posición fuera del objeto, como se puede ver eso. Ah, estos impuestos alrededor de un poco por encima de aquí. Entonces queremos tomar las posiciones del vino, y lo vamos a jugar aquí una escuela. Entonces es una consistente vamos a tomar esto, como era un muro de seguridad. Es básico. Aquí se puede ver eso. Ah, el botón. Necesitas que te cambien. Escolar. Por lo que este es de 31 pixel del texto. Vamos a quitarlo mentalmente. Está bien. Y este, eso es lo que Kobe, Esta bien? Es genial. Y el siguiente es Ah, este ling. Eso es lo que me consiguió esto también. Está bien, así que se ve bien. No, vamos a hacer Gran Bretaña como así queremos añadir forma de pared Lingus. Ah, esta caliente nacida a estos. Entonces vamos a beberlo. Haga clic y pruebe. Y luego vamos a poner el gatillo a tiempo, Russell, porque quieres que esto sea automático. Por lo que queremos asegurarnos de que ah diseccionar sea lo mismo que éste. Entonces es temporizador son tus segundos. También, cualquier carne. Está fuera dos segundos y cisne es lo mismo. Cero enfermos. Saldrá en dos segundos. Está bien, así que si quieres probarlo, si haces clic en este botón de reproducción aquí, se iniciará con el hogar con el fueraborda que ya marcus el hogar con indicado por este íconos azules. Pero si quieres iniciar el prototipo en los barcos a los que quieres empezar, por ejemplo, queremos este pensamiento partimos sitio para pruebas propone de éste porque estábamos trabajando en esto actualmente. Entonces lo que haces es en lugar de fuera estás crujiendo. Este botón de juego antes de eso, mientras que hay que hacer, es simplemente elegir cuáles se compran. Quieren jugar como titular en puerto. Entonces porque quieres hacer de este aeropuerto como el arranque nuestro puerto para este propósito de diseño en este momento, por lo que hacemos clic en él para nosotros. Hacemos clic en él primero y luego pero hacemos clic en el botón de reproducción. Entonces Ah, esto en lo que se convertirá en los fueraborda iniciales cuando lo trajeron hasta el almuerzo. Está bien, se ve bien. No, vamos a aplicar lo mismo. Aplicamos lo mismo como en esta diversidad. De acuerdo, entonces lo siguiente es, cuando haces click en esto para todos Ah, ven que es instrucciones de tarjeta. Bueno, así que para hacer eso vamos a copiar este muro porque el diseño Alice, copiamos esta oferta yacía carpetas. Vamos a darle un ritmo aquí. Y lo siguiente es, queremos reducir la capacidad. Entonces ahí es donde es Antes de que yo quiero a Teoh simplemente poniendo aquí debajo de ella. Está bien, Eso está bien. Y vamos quien redujo capacidad 20 Cisne, imbecil . Está bien, así que veamos algún rectángulo aquí. Entonces es solo, como, bastante complicado. De acuerdo, fronteras sirias. Y vamos a leer esto, Theo Opacidad a cero personas. Muy bien, ahora, volvamos a Prototype Tab, nuestro click y dragón. Voy a usar la misma configuración. Entonces en estos levantando grifo o a cualquier fuera de borda significada está fuera. ¿ Y hay un 0.3 segundos? De acuerdo, éste, eso es todo. Bueno, hoy, tal vez está fuera. Nos vamos a asegurar que estos 0.3 segundos sea como éste. Está bien, así que vamos a rehacerlo. Ahora, vamos a ver. Entonces, al igual que, esta efusión hará clic, haga clic, vuelva a jugar. Gay funcionó, como, sentirse bien. Está funcionando ahora, así que vamos a estar en las otras instrucciones. Entonces, en tu bodega, haz click en estas superposiciones. Ellos van a este fueraborda. Entonces, ¿cómo ser extra? Tú automáticamente que solo diseccionando el automáticamente copiado el ajuste de la instrucción prefiere para que no tengas que ajustarlo de nuevo, acuerdo? Y lo siguiente es, queremos, um, um, recitar la imagen para que veas las interrupciones ism. Déjame jugar el primero, ¿de acuerdo? Para todos ustedes. Está bien. Por lo que se ve genial. Blading. OK, entonces queremos sumar interrupción ism. Al igual que éste. Se puede ver que son instrucciones. Por lo que es muy sencillo. Donde ibas a hacer es sólo recitar la imagen. Sim egx. De acuerdo, entonces vamos a renunciar momento por nosotros. Muchachos que no nos gustan. Entonces, como, la imagen, Ok, nos deja recitar un poco, Ok , entonces , sí, es bastante complicado de abogar. Está bien, así que vamos a comprobarlo. Por lo que me gusta de bocetos. Si desea seleccionar, um, de capas abajo en, puedo. Clic derecho. Y ahí hay, como, como, un selecto opciones de mentirosos. Pero en Adobe X'd, uh, no hay ese tipo de característica. Entonces cuando olvidas el nombre de la falta, entonces es un poco problemático. Ahora, volvamos antes de primero. ¿ De acuerdo? Entonces esta es la imagen, acuerdo? A menos que lo precisemos. De acuerdo, Así que quiero mantener mi llave de opción, y ella la vio recita centro. De acuerdo, entonces vamos a recitarlo. Tan solo un ligero cambio de tamaño. No demasiado Así currículum no es demasiado extremo, Will. No demasiado rápido. Al igual que yo creo que éste es. Eso está bien. Vamos a tocarlo de nuevo, ¿de acuerdo? Soy un olvidado de seleccionar esta fuerza. Y a medida que hacemos clic en bahía Vale, así que ahora se puede ver que las instrucciones de zoom. ¿ Verdad? Está bien. Está bien. Ahora sigamos mirando aquí la construcción seca, por lo que es muy simple, en realidad. Una vez que entiendas el concepto, entonces esto es bastante fácil, ¿de acuerdo? Con hacer clic y arrástrelo aquí y desencadenar su huelga. Está bien. Y también al mismo en ruso en esta tarjeta, clic y secado. Está bien. Los desencadenantes. Intentando cómo a cualquier principal. Ahora volvamos a jugar. De acuerdo, Así que está funcionando. Está bien, así que Felicidades. 11. Enlace ar la interacción entre las ciudades: después de que creamos con éxito las interacciones fuera de esta segunda ciudad y la siguiente son las mejores. Queremos agregar interacción cuando digas hacer clic en estas tarjetas. Entonces cuando hacen clic en esta excavadora actual para, ah, instrucciones de esta ciudad y algo, cuando hay un click en estas calidad y mala tarjeta, van a estas interacciones de animación. Entonces eso es lo que hacemos. Entonces vamos a ir a o el tipo tap. Y básicamente es muy sencillo. Lo que hacemos es agregar indicaciones de tap en este auto por lo que seleccionamos esta tarjeta, así que me aseguro de que esté seleccionada y haga clic y rastreo. Entonces lo vamos a arrastrar a este fueraborda. ¿ Por qué? Porque este es este punto inicial de partida a partir de estas interacciones. Por lo que al hacer clic en él, queremos que ese usuario aterrice del pie este tablero de chozas. De acuerdo, para que puedas ajustar el ajuste aquí como las transiciones, y para estos porcinos queremos poner la acción a la transición, no a salir a animar. De acuerdo, porque , ah, no estamos fuera a ninguna reunión. En realidad es cosa diferente. OK, así que solo, uh,lo seleccionamos uh, , preguntamos las transiciones. Y para las a emisiones, preferiré que ninguna. Porque cómo no recurriremos a directamente, um, ver las interacciones y emisiones de éstas a bordo mismo. Por lo que esto suma más. Ya tengo. Es una emisiones. Entonces cuando veas dar click en esta tarjeta a este auto, básicamente solo queremos dejar que estos aire vean este auto directamente. Entonces vamos a retocar. Este tipo más amplio podría jugar Alice Hebrews sentir todas y formas de hacer clic en esta carta. Asiento saudí es idénticamente goto a este fueraborda inicial. Está bien, te deja volver a jugar. Haga clic. Pocos todos hacen clic en esta tarjeta. De acuerdo, así que esto es muy sencillo. No, Vamos a la misma interacción con este auto. Por lo que eres DoubleClick kid y haz clic y arrastra, y queremos agregar la introducción al soporte. De acuerdo, entonces vamos a aplicar el mismo ajuste, que es disparador tocado y lo mismo para dirección. Alyssa, click play. Siente todo por lo que sigue rompible. Haga clic en manning a. De acuerdo, haga clic en el juego. Click calidad. Pobre. Está bien, está bien. Está bien. Es frecuente cuando está en vivo. Al hacer clic en estos, sí funciona. ¿ Por qué? Porque no has sumado las interacciones en este. Entonces, ¿quieres hacer eso? No se puede hacer algo. Agregas la interacción en este Carcelle. Entonces hagámoslo. Haga clic y seque. Indra llega aquí, el Tigger apuñalado. Transición en una emisión no lo es. Y vamos a una especie de que vamos a hacer lo mismo para este también. Está bien, así que creo que funciona. Ahora vamos a reproducirlo. Hacemos click en unos cuantos todos cuando en Medina. Muy bien, cocinamos para todos ustedes y pinchamos en esta calidad pobre. Está bien, así que funciona Muy bien. Ahora son excelentes. Enhorabuena por completar estas clases. Por lo que espero que lo disfruten. Ellos pueden aprender algo de ello. Bueno, básicamente, este es concepto muy sencillo. Quieres entender el principio básico fuera de íntimo puedes Aplicarlo a cualquier proyecto para este tipo de interacción. Entonces esto es un muy sencillo en realidad lo que deambula si te sugiero que lo practiques. Si lo deseas, puedes descargar los activos y, ah, recrear esto desde cero y hacerlo tú mismo y probarlo tú mismo para que puedas entender mejor cómo usar este auto animate características en otras B x D. Entonces así felicitaciones por terminar esta clase así espero que puedan aprender algo de ella. Si tienes alguna pregunta, puedes preguntarme. OK, entonces instalaciones de Gore. 12. Finaliza el prototipo: en este video. Yo quiero arreglar dos cosas en este tipo de parte. Entonces básicamente no es un gran tema. Es sólo una solución rápida porque ah, hay una cosa que falta. Por lo que cuando se juega el sitio de protesta, puede ver que al hacer clic en él, es trabajo. DeCero no se preocupa. Y lo segundo es en esta ciudad Marinus puede ver que el país todavía Malasia. Entonces es que es permisos equivocados. Ahora quiero arreglarlo este video, por lo que debería ser realmente rápida solución. Entonces vamos a empezar con arreglar esta información's así que asegúrate de que cuando cambiamos en el diseño de estamos en la pestaña de diseño, no en el prototipo. De acuerdo, así que quiero mover esta capa superpuesta primero para escribir porque queremos acceder a estos textos porque es difícil hacer click, y es muy difícil hacer click. Entonces va a solo cuerpo aquí por nosotros le regaló esta capa a ella, ¿ verdad? Y entonces podemos acceder a este impuesto cuando ah cambió su a Arabia Saudita y las poblaciones es 1.1. El idioma es árabe en. Este basamiento tiene 50. Está bien. Está bien. Por lo que se ve bien. Ahora volvamos a poner estos sobre una capa podemos cambiar Expedition s wall zero. Está bien. Está bien. Y lo siguiente es, queremos sumar estas interacciones. Entonces vamos al prototipo y luego cuando dijiste click y estos son Oh, van a estos Ah, en puerto. Entonces queremos hacer el truco también, porque no podemos acceder a estas flechas. Por lo que queremos agregar algún rectángulo en la parte superior si se puerta cuando un Forneris remoto y tristemente, un cero positivo. Muy bien, volvamos a Broadside otra vez. Y ahora seamos agregados esto a aquí. Y desencadenó un paso. Transiciones, reduccionista, transiciones y animación. No es ninguno. De acuerdo, entonces lo mismo para este que llega a no ir a diseñado para nosotros, eso es que teníamos rectángulo aquí. Vale, Gonna Border dijo que es 20 enojado un prototipo. Ahora hacemos clic en esto y lo arrastramos aquí y un paso Tigger. El correcto de esta nación los istas tenían una línea maquinista. Ahora vamos profusamente broadside donde hacemos clic en él, Click it Click it this one. Está funcionando. Haga clic. Aquí Está funcionando. Click Este siendo click aquí. Está funcionando. Está bien, lo siento. Correctas relaciones 13. BONUS comparte el prototipo: Por lo que después de haber cortejado con éxito prototipo, probablemente quieras compartir el prototipo amargo a tu usuario o a un interesado para que lo haga en árabe. Status quo. Simple. Ves aquí en los botones de compartir, lo que quieres hacer es simplemente hacer click a la vez, y luego puedes ver algunas opciones aquí. Entonces porque queremos compartir el prototipo para Refute persiste. Por lo que la mejor opción es hacer click en este share para si tú, porque puedes interrumpirlo. Traído fuera de la lata puede comentar. Pero si quieres compartir un prototipo con fines de desarrollo, entonces lo que haces es solo hacer clic en el share para desarrollo para que puedas, ah, ah, tu desarrollador puede inspeccionar el tipo de partes como el espaciado de ciudad entre un objeto a otro objeto, pero para unos pocos propone, por ejemplo, que se quiera realizar el uso de estudios de pruebas Erviti. Lo que quieres hacer es solo dar click en estos compartir para aquí, así que vamos a darle click, y en la configuración puedes sentir los títulos, y también puedes ver ahí. Aquí hay tan pocas opciones que sí Queremos muchos comentarios al lado hermano o no, si quieres mostrar las escenas de puntos calientes no son cosas así. Uno de los desencadenantes. Si desea realizar pruebas de usabilidad, probablemente lo desee. Y comprueba esto porque está mostrando las manos de punto caliente. Significa que tú para que yo pueda ver. De acuerdo, éste se puede hacer clic. De acuerdo, tengo que hacer clic en eso. Tengo que ir ahí. Pero quieres realmente? Ah, prueba el Yusor. Probablemente quiera en jaque, porque usted, señor, no debería conseguir algunos aquí porque realmente queremos probarlo. Muy bien, así que para hacer ese mismo tablero, solo tienes que hacer clic en estos, crear lean, y luego el proceso se subirá a la nube de adobe. Y entonces conseguirás algún tipo de lince. Y luego puedes copiar ese compartir Lincoln a tu Stakeholder o a tus usuarios. De acuerdo, Entonces es crear colocación pública. Se necesita a veces. Está bien. Está bien. Tan solo blanco. Por lo general no es demasiado largo por sus minutos de guerra. Dos minutos. Está bien. A veces se podría facetar. Podría ser más lento, pero no debe ser como una tolva enferma. Está en aturdir nuestro Es 100% ahora. Muy bien, así que disuadan un par de segundos más. Está bien. Está bien. Para que veas que la hermana Ling, por qué quieres hacer es solo copiar a Sling. Y puedes compartir esto vinculado a tus amigos. A usted, señor, al interesado. Entonces vamos a revisar este enlace, voy a gol con Google Crumb, y eso es lo comprobamos. Está bien. Está bien. Cargas laterales Así puedo ver eso en el lado derecho. Aquí, hay unas secciones comunes. ¿ Dónde está esto? Se puede comentar para salir del sitio. Está bien. Para que puedas ocultar el lapso, muro de Elissa. Sólo tienes que hacer clic en él unos, acuerdo? También puedes simplemente expandirte si así vamos. Intricado. Porque permití que entrara el hospital. Entonces cuando haces clic en estas áreas donde no hay esperanza de que su reporte muestre las ubicaciones de los puntos calientes Así que si quieres llevar a cabo habilidades de uso, entonces probablemente quieras inyectar eso. De acuerdo, vamos a verlo. Está bien. Entonces probablemente notes que probablemente el proceso no es Eso es muy suave, pero creo que el rosario depende de, um, la complejidad del prototipo. Y también probablemente depende de la computadora que utilices. Tiene más lejos, señor. Computadora con procesadores realmente de alto rendimiento. Probablemente el bastante, um, suave. Pero hasta ahora creo que es así de genial. Y puedes intentarlo. Se convirtió en ling copiado y compartido. Aferrarse a tus amigos, a los usuarios, a tus grupos de interés. Muy bien, buena suerte.