Transcripciones
1. Introducción: Hola, me llamo Rob. Trabajo en una pequeña empresa de diseño y desarrollo Web que esa empresa diseño sitios web. Entonces lo que voy a hacer es trabajar todo con un cliente para hacerse una idea de lo que están buscando. Entonces crearé un simulacro en base a lo que quieran, y luego iré de ida y vuelta con ellos en el simulacro arriba, reconfigurándolo hasta que lo lleguemos a donde quiera el cliente. Y luego me entregué a nuestro equipo de desarrolladores y me quedé con el proyecto como
gerente de proyecto para darle vida al diseño del dedo del pie. Entonces en este curso, lo que voy a cubrir es una introducción al diseño de sitios web. Específicamente, vamos a diseñar una página de inicio y luego también una introducción al uso de Adobe X D. Así que para las personas que llevan un tiempo diseñando sitios web, ojalá puedas obtener algo de la introducción a Dobie X'd. Si no estás familiarizado con ese programa, y para las personas que no tienen experiencia, esto debería ser suficiente para que empiece a diseñar sitios web en Adobe X'd. Entonces estoy emocionado con este curso, y espero que todos lo disfruten. Empecemos
2. Etiquetas de video: Entonces puse estas gafas para que, como, me tocara una intro. Yo quiero que las canchas sean útiles para las personas que han experimentado el diseño de sitios web y personas que también son nuevas en ello. Entonces para que sea para que las personas con que ya tengan experiencia no pasen, uh, cosas que ya saben para que solo puedan saltar a los videos que están enfocados en X d. etiqueto todos esos videos X'd skill. Entonces si eres un diseñador experimentado y solo quieres aprender un poco sobre X d, te
recomiendo solo saltes a esos y, uh, sería genial si completaras los proyectos, y creo que eso te ayudará a recordar estas cosas. Pero no creo que probablemente necesites pasar por todos los videos de diseño. Y si tu nuevo te recomendaría pasar por todo el asunto y definitivamente hacer el proyecto , porque puedes ayudarlo durante el proyecto solo te ayudará a aprender todo. Y también puedes usarlo para ayudar a iniciar tu portafolio.
3. XD en el sistema de: Hay muchas herramientas de diseño por ahí, y solo quiero dar una visión general de dónde cabe X'd. Herramientas más diseñadas. Haz una de dos cosas que ya sea las usas para diseñar. Ah, burla o úsalos para prototipear tus simulacros de que has hecho otro programa. X D hace ambas cosas en un programa que es bastante único. Teoh dentro de las herramientas de diseño existentes en otra cosa sobre X'd, donde cabe dentro de un sistema dhobi. Hasta hace X'd, realmente no
teníamos algo que fuera a la medida para diseñar sitios web. Mucha gente utilizó photoshop para diseñar sitios web, pero photoshop es una herramienta construida para editar fotos. Entonces había un montón de cosas que ni siquiera hacía ahí. Fue un poco torpe. Requiere mucho más. Una computadora mucho más poderosa que X'd lo hace por lo que X'd acaba de confeccionar solo para diseñar sitios web y APS. Entonces por eso, es mucho más racionalizado. Puedes moverte mucho más rápido, y entonces, sí, me gusta X d Vamos a empezar a aprender sobre ello
4. Prototipos: vamos a cubrir cómo hacer un prototipo en esta serie cómo hacer un prototipo en el siguiente D. En realidad no
vamos a construir uno completo, pero debes enseñarte los conceptos para que puedas construir a partir de cuatro prototipo si que querías. No obstante, no
vamos a cubrir cómo probar tu prototipo. Eso sería todo un video nother. De Siri. Entonces simplemente no vamos a incluir eso en esto. Ya estamos cubriendo suficiente. Algo antes de mostrarte cómo crear un prototipo en X'd que quería tocar es especie de razonamiento detrás de los prototipos. Sólo para que tengas algunos antecedentes si no estás familiarizado con eso. Entonces la razón por la que pro tipo de sitio web es porque es lento y costoso
codificar . Ah, página web. Entonces, con
el fin de limitar su riesgo antes de realizar esa inversión plena, codificando el sitio web. Puedes crear un prototipo mucho más rápido,
uh, y barato, y barato, luego puedes codificar un sitio web para que la gente construya el prototipo, y luego harán algunas pruebas de usuario y luego se asegurarán, ya sea o confirmarán que su diseño va a funcionar y están establecidos, lo
recubren o más
probable, probablemente descubriremos algunos temas. Ellos arreglarán esos temas nuevamente en la prueba de prototipo y seguirán en bicicleta así
hasta que hayan resuelto tantos temas como piensen razonablemente pueden con el prototipo y luego pasarán al desarrollo. Por lo que la creación de prototipos es sólo una forma de reducir básicamente los riesgos. Y, um, asegúrate de que lo que estás construyendo realmente va a funcionar para lo que ella quería, Teoh.
5. Usos de prototipos: prototipado es básicamente construir una versión rápida del sitio web para que puedas probarlo antes de poner todo el dinero en recubrirlo. Ahora eso es lo que X D está diseñado para hacer con su función futura de prototipos para construir esos prototipos. Pero he descubierto que también puedes usar prototipos para especie de así tus clientes en ideas o
dedo del pie o para conseguir proyectos a través del proceso de RFP. Entonces a veces lo que haremos es más que digamos, hay una RFP que pide ah, ya
sabes, unos cuantos se burlan. Entonces en lugar de simplemente enviar el envío de imágenes con nuestra propuesta, lo que haré es todo lo que crearé prototipos en X d y luego enviaré enlaces a esos a los clientes. Va a
ir, ir, repasar cómo hacer eso en un video posterior. Pero básicamente los clientes hacen clic en esos enlaces y pueden desplazarse por ellos, y tal vez puedan hacer clic en algunas cosas, y creo que, ya
sabes que realmente puede ayudar a los clientes a entender tu visión. Es mucho más fácil mostrarle a la gente cosas que es escribir cosas e intentar que la
gente las entienda a través de tu escritura, así que creo que adobes X'd características útiles para la creación de prototipos. Pero creo que también es útil para explicar tus ideas y conceptos a los clientes.
6. Inspiración y proceso: Entonces cuando estoy diseñando un sitio web, lo primero que dio es que hablé con el cliente, y usualmente les pido que me den,
um, um, 3 a 4 sitios web que les gusta, que les gusta el aspecto y la sensación de. Y desde ahí revisaré esos sitios y luego también buscaré,
buscaré por mi cuenta sitios que creo que caen dentro de esa zona. Y luego en Lee, sólo todos tomando notas. En realidad no empiezo a bosquejar las cosas después. Siento que tengo una buena idea de lo que le gusta al cliente,
que como que empiezo a pensar en cómo puedo tomar eso y encajar en sus necesidades. En ese punto, empiezo a hacer bocetos, y cuando estoy dibujando, no miro directamente a los sitios que me dieron los clientes ni a los sitios que encontré mientras navegaba. Hago eso porque sólo me ayuda a asegurarme de que estoy creando algo nuevo, que no estoy copiando, algo que no estoy copiando. Algún sitio que le gusta al cliente porque quiero decir primero, ya
sabes, no quieres robar el trabajo de otras personas, y segundo, quiero decir, aunque a los clientes les guste ese sitio. Probablemente no quieren que se vea. Realmente no quieren que su sitio se vea exactamente como ese sitio que quieren. Te están pagando para hacer algo único. Entonces encuentro que me ayuda hacer eso si en realidad no tengo el sitio levantado cuando im bosquejando porque conoces mis recuerdos en perfecto. Y aunque lo intente, no
puedo simplemente recrear sin tenerlo justo frente a mí. Entonces eso es lo que hago. Después de obtener algo de inspiración, empiezo a esbozar lo que me gusta, y luego voy a X d y empiezo a marcar.
7. cómo hacer bocetos;: todo bien. Entonces, como dije, uh, empiezo por conseguir sitios de los clientes y mirar esos sitios. Y luego también hago un poco de navegación por mi cuenta para encontrar sitios similares. Y todo el tiempo que estoy haciendo eso, estoy pensando en mi mente cómo puedo aplicar ideas y conceptos en estos sitios a los sitios del cliente . Y trato de hacerlo de,
ah, ah, una especie de forma diferente a la que se están haciendo en esos sitios. Entonces una vez que tengo algunas ideas, voy a mi cuaderno y empiezo a esbozar cosas. Normalmente uso pluma. Eso me ayuda a avanzar rápidamente y a no obsesionarme demasiado con los detalles, porque no es realmente productivo cuando estás dibujando la mayor parte del tiempo. Quieres decir eso hasta que te metes en X'd y empieces a hacer simulacro real. Así que pensé que solo hacemos unos bocetos rápidos aquí para que solo puedas ver un ejemplo de lo que hago. lo que suelo empezar haciendo la primera la primera sección que muestra por encima del pliegue. Por lo que me gusta dibujar. Uh, esto es cuando yo más o menos la relación de la primera sección por encima del pliegue. Y luego pongo algunas líneas para representar los ítems del menú y luego solo haré un círculo para el logo. Y luego tenemos un gran llamado a la acción para que yo quiera asegurarme de que eso quede claro. Y luego quiero tener un botón para que la gente haga clic si les gusta nuestro llamado a la acción y
necesitamos tener alguna manera de romper, romper la siguiente sección. Por lo que podría ser sólo una línea recta. Pero, ya
sabes, podría ser una línea curva, así que sólo voy a seguir adelante y a través de una curva en línea ahí dentro por ahora. Y entonces voy a empezar. Pasaré a la siguiente sección. Por lo que me gusta trabajar en secciones tipo de. Sólo dinos con,
uh,
pensando para asegurarme uh, de que estoy cubriendo todo y luego también, uh, me ayuda a no agobiarme. asegura de que cubrí todo lo que necesito. Teoh. Entonces esta sección, vamos a una especie de extender la línea Kirby en esta sección va a ser cuatro personas que aún no
estaban convencidas por esta sección. A lo mejor estaban un poco nerviosos por cómo iban las cosas. Vamos a pasar. Entonces les vamos a explicar cómo suceden las cosas en esta siguiente sección les va a explicar el proceso. Entonces lo vamos a hacer por pasos, así que va a haber una caja para el Paso uno y luego estas líneas van a representar texto explicando Paso uno, poner en aire por aquí. Entonces después de que pises cuando vas al paso dos y luego pasas tres y luego terminas y ojalá realmente quieras dedo te convenciste en este punto, Así que tal vez make pondrá otro botón de acción de llamada aquí. A lo mejor no. Ya veremos. Eso podría ser un poco exagerado, uh, cuando iba a la siguiente sección en. Y creo que es una buena idea del dedo del pie mostrar a la gente detrás de los sitios. Entonces vamos a poner la foto de los clientes por aquí. A lo mejor no es la foto de los clientes. Podría ser como un gran destino de viaje que va a inspirar a la gente. Y esto va a ser sobre que va a ser sobre el cliente y sobre su servicio. Entonces pon algunas líneas, texto ahí y luego realmente esperando que para este punto la gente esté convencida de que quiere apuntarse a esto. Entonces vamos a poner el cartel, formarnos aquí. Entonces esto es por su nombre. Y luego vamos a tener su correo electrónico y luego un botón de enviar encendido. Entonces tendremos un pie de página. No vamos a detallar eso ahora mismo, pero queremos asegurarnos de que recordamos poner un pie o adentro para que ahí abajo. Y así que eso es una especie de lo que mi proceso No, antes de que realmente vaya a x d hará normalmente es hacer, como, probablemente cinco o seis como este, simplemente experimentando con ideas diferentes. Encuentro eso haciendo con pluma y papel. Podría moverme mucho más rápido de lo que puedo, incluso en la próxima D y también sólo una especie de ayuda a que mis ideas fluyan más rápido y sin problemas. Entonces me gusta Teoh conseguir algunos conceptos y luego una vez que tenga algunos conceptos, escogeré una pareja que creo que me gusta. Y luego iré a X de y me burlé de ellos. Y puedes ver me quedé con estos bastante pequeños Y la razón por la que hice eso es porque encuentro que , como, usar pluma, solo me ayuda a moverme más rápido si lo hago más grande de lo que me siento tentado y digo, Sólo dibujando líneas aquí. Ya sabes, empiezo a escribir lo que va a ser cada elemento del menú, y entonces tal vez empiezo a intentar, como, en realidad sacar el logo y, ya
sabes, soltar botones y poner impuestos y escribe el llamado a la acción. Y eso no es realmente necesario en esta etapa. En mi proceso, al
menos sólo quiero llegar a conceptos, ideas. Es como traer almacenamiento para mí, y luego voy a entrar en más detalle cuando entre en X'd. Está bien, así que así es más o menos como lo hago. Como dije, hago algunos más de estos antes de ir a continuación. D. Entonces lo que te recomiendo que hagas ahora es hacer quiero decir, yo diría de 3 a 5 conceptos, así que quieres que todos sean diferentes. Um, así que tienes cosas diferentes, Teoh piensa y luego elige. Escoge tu favorito y toma eso y usa eso como la base es mientras aprendemos cómo el dedo del pie se burlan las cosas siguiente D. Así que adelante y haz algunos bocetos, subirlos al área de proyectos y luego pasa a los siguientes videos
8. Elegir un proyecto: el proyecto que vamos a hacer a través de este curso es hacer una página principal de un sitio web. De lo que voy a hacer mi solo voy a crear un cliente ficticio en mi cliente ficticio. Tienen un sitio de viajes de viaje, y lo que hacen es que te pongas en contacto con ellos, es y crean una experiencia de viaje para ti. Entonces digamos que quieres tener unas vacaciones tropicales. Ya
sabes, les dices tu presupuesto, les
dices qué tipo de comida te gusta y no te gusta, uh, en y cuándo vas a entrar en ese tipo de cosas. Entonces es una especie de que es como un agente de viajes slash concierge. Entonces ese va a ser el concepto detrás de la página web en el que voy a hacer. Como dije, esto se acaba de inventar. Entonces sólo voy a divertirme con él y ojalá todos lo disfruten. Um, lo que se te ocurre algo para tu proyecto fuera recomiendo hacer algo similar, tal vez solo tienes una idea. cierto que quieres probarlo y inventarte algo, maquillarlo por diversión. O tal vez tienes un amigo que tiene quien tiene una idea, y quieres burlarte de ella por ellos. O tal vez sabes de un sitio web que te guste, Pero ¿crees que el diseño podría mejorarse? Toma eso, toma ese sitio y luego rediseñarlo para este proyecto o última idea que me gustaría tirar ahí es tal vez tener un sitio web que realmente te gusta el diseño de ti, realmente me gusta cómo se configura. Y entonces tal vez solo quieras jugar fuera que tal vez quieras Aplica eso a otra industria . O tal vez quieras jugar fuera de eso de otra manera. Entonces esas son algunas ideas que tengo para que empiece a llegar con el proyecto por su cuenta. Eso. ¿ Por qué no vas adelante y conflictas proyecto y luego vas adelante y subes algunas notas sobre lo que piensas hacer al área de proyectos para luego seguir adelante en el siguiente video
9. Subir proyectos: Por lo que el proyecto para esta clase va a ser diseñar una la página principal de un sitio web. Entonces no vamos a hacer todas las páginas porque eso sólo va Eso es un poco demasiado para el alcance de este video. Te va a llevar un tiempo, así que sólo vamos a hacer la página principal, y te animaría a que empieces en la página principal tan pronto como empecemos en los
videos de la X D tan pronto como empecemos a bosquejar, animaría que hagas lo que me dio a tu manera después de ver mi video. Entonces de esa manera lo estás haciendo paso a paso, y luego a medida que creas cosas, por favor subirlas al espacio del proyecto. Creo que eso te va a ayudar a obtener más retroalimentación sobre tu trabajo a medida que avanza. Y entonces creo que también te va a ayudar a hacerlo en realidad en lugar de esperar hasta el final . Y entonces estás como, Oh, Dios
mío, tengo todas estas cosas. No recuerdo lo que se supone que debo hacer. Si haces una de las veces, creo que habrá más manejable. Y luego también te ayuda a aprenderlo mejor. Ella lo estará haciendo mientras aún está fresco en tu mente. Entonces te recomiendo después de la mitad veas cada video donde hay algo de habilidad sobre la que
puedes tomar acción, que tomes acción al respecto y luego que subiste un proyecto de ZA. Y luego podemos ver todo tu proceso a medida que vas de recoger colores a bosquejar
maquetas tempranas , puntera finaliza maquetas y prototipado. Entonces, uh, ese es mi pensamiento sobre los proyectos. Espero con ansias lo que creéis todos. Empecemos.
10. Cómo conseguir XD: Entonces el primer paso para usar X D es, por
supuesto, y venderla en tu computadora. Uh, sobre todo
voy a dejarte eso a ti. En realidad no soy un experto en hacer eso. No sé qué tipo de computadora tienes y ese tipo de cosas, pero diré que si no la tienes ya, probablemente no necesites
apuntarte a una versión de pago de Adobe CC en este momento. Probablemente puedas conseguir una prueba gratuita por, como, creo, la semana o 14 días y luego ver si esto es algo en lo que realmente te gusta, o no sé si esto seguirá pasando. Pero cuando se hizo este video, uh oh. Estábamos ofreciendo un uso
gratuito, gratuito de X'd No tenías que pagar. Por lo que ojalá sigan pasando. Se quiere pagar, Así que adelante y conseguir un X D instalado. Si aún no lo tienes instalado, y entonces vamos a seguir adelante. Teoh. El primer video sobre cómo usar X'd
11. Interfaz XD: Está bien. Entonces aquí, tenemos la primera pantalla que ves cuando abres. Siguiente de ah, cantidad
justa pasando aquí. Tienes tus archivos recientes por aquí. Te tienes I kits Eso pasará más tarde. Tienes tutoriales y recurso es. Pero lo que realmente necesitamos ahora es que solo necesitamos escoger una talla para un tablero de primer arte. Um, así que tienen iPhone iPad, y luego tienen una especie de escritorio estándar tamaño 1920 por 10. 80. Y luego puedes hacer tu propio tamaño también. Para esto, vamos a empezar con el 1920 por 10. 80. Entonces solo tienes que hacer clic en eso y luego se va a tirar de eso aquí arriba, y te voy a dar un rápido resumen de cómo se presenta todo aquí. Entonces del lado izquierdo, tienes tus herramientas. Ah, también
tienes tu panel de activos. Vamos a repasar esto más tarde. Se trata de símbolos, estilos de
carácter. Y entonces este botón es para tus capas. Um, puedes volver a hacer clic para cerrar eso y luego mostrarte el lado derecho hará una forma aquí, y luego puedes ver cuando hice esa forma. Todo esto se hizo clicable, así que podrías hacer un montón de cosas por aquí. Al igual que alineaciones entrando. Um, puedes cambiar las dimensiones. Se puede cambiar el color. Uh, entonces esto es algo así en pocas palabras. Esta es tu área de herramientas. Y entonces esto es tu lo que puedes hacer con tus herramientas y lo que puedes hacer con la forma que has seleccionado por aquí. Y entonces este es el menú el donde se puede obtener un nuevo documento, abrir uno, guardar documentos, guardar exportación, etcétera. Y luego lo que vamos a hacer rápidamente aquí, vamos a
alejarnos, vamos a hacer una copia de esto, y vamos a hacer de esto un venir diferente. El motivo por el que estamos haciendo esto es para que pueda mostrarles el área del prototipo. Por lo que para llegar al área de prototipos, es
necesario tener al menos dos tableros de arte. Entonces ahora solo vamos por aquí y hacemos clic en prototipo. Es como dije al día siguiente se puede tanto diseñar como prototipo. Aquí es donde haces tu diseño. Y entonces aquí es donde haces tu prototipo para que veas que aún tenemos nuestras mismas
tablas de arte . Se ven exactamente iguales. Están en el mismo lugar. Pero perdimos muchas herramientas por aquí, y perdimos todo nuestro panel por aquí. Eso es porque el área del prototipo no necesitamos esas cosas. Entonces aquí solo podemos ir a conectarnos, y luego repasaremos esto más tarde. Pero hay muchas opciones sobre cómo quieres hacer la transición, y luego también solo conecta esta de nuevo. Muy bien, entonces hacemos prototipos de estas cosas. Entonces la vista, tu prototipo y también puedes hacerlo en el modo de diseño, haces clic en vista previa, y ahora puedes ver que están conectados. Clifton para ir de ida y vuelta. Eso eso es sólo un resumen rápido de, uh, interfaz
X'd.
12. Habilidad XD: navegación: Muy bien, Así que ahora que sabemos tener una visión general de la interfaz, vamos a hablar de cómo puedes navegar en tus documentos X'd, así que hay muchas maneras diferentes en las que puedes navegar. Sólo te voy a mostrar mis favoritos rápidamente aquí. Ah, así que si estás mal en una pista, puedes usar tus dedos libros. Usa los dedos para acercar y alejar así. También puedes mantener el control en un comando de PC en el Mac y mientras mantengas el
mando Command, tenías menos dos cantidad Z más para acercar. Entonces estoy sosteniendo el control menos más aparentemente dentro y fuera. Entonces puedes seleccionar la forma y decir Quieres trabajar en esta forma lo que voy a hacer mucho
del tiempo. Um, todo ha
tenido control, mando, retención control, mando, luego golpeó tres. Y va a llenar esa forma dentro de mi pantalla. Y se puede ver ahora mismo alrededor del 120% en el que preferiría estar, um, 100% porque así es como se supone que tiene que ver el diseño. A 100% 7 todos hit control uno. No, no
estoy al 100%. Y ahora puedo diseñar, así que uso,
ah, ah, control o comando tres dedos tire hacia arriba cualquier objeto en mi pantalla. Entonces uso control o comando uno para llegar al 100%. Otro método abreviado de teclas útil aquí es el control o comando cero. Y eso va a levantar todo tu tablero de arte para que puedas ver todos tus tableros de arte a la vez. Entonces los principales de zoom que me gustan entonces también puedes sostener el espacio y eso te permite
moverte . Tu pantalla puede arrastrar a través. Entonces eso es no, es como puedes moverte en Adobe X'd. Al menos así es como lo hago. Um, pasemos al siguiente video.
13. Habilidad XD: agrega colores: De acuerdo, entonces aquí tenemos nuestra paleta con la que dije que quiero ir para este ah proyecto. Entonces voy a hacer clic derecho y copiar imagen, y luego voy a repasar el texto D. Y quiero decir ah, pega esta imagen aquí abajo y hay algunas maneras en que puedes usar esta paleta. Te mostraré un camino fácil. Simplemente puedes pegarlo en otro tablero de arte. Y entonces digamos que esta es nuestra junta en la que estás trabajando. Seleccionas tu forma que quieras colorear, y luego solo puedes usar tu herramienta cuentagotas. Eres cuentagotas, herramienta y pick, y cambiará el color de la forma. Entonces solo sigues haciéndolo Puedes hacerlo de esa manera. O lo que me gusta dio es, um, me gusta poner los todos los colores en extasios construidos en poco paladar aquí, Así que me parece un poco más rápido, sobre todo cuando terminas con un montón de tablero de arte. No tienes que arrastrar tu paladar a todas partes, y no tienes que acercar y alejar un montón para llegar a él. Solo puedes ir aquí mismo. Ya está ahí, así que ya puse este rosa medio dentro. Entonces iré adelante y pegaré. Además, y luego se puede ver que aparece, y luego papá y otros colores solo usarán la herramienta cuentagotas. Y cada vez que entro aquí, asegúrate de golpear. Además, me metí eso. ¿ Es otra vez? Espera, ese alguien ya lo hizo. Creo que haz esa. Muy bien, Así que ahora ves, tenemos los cinco colores, y si quieres, puedes arrastrarlos y arreglarlos como si estuvieran en tu paladar, así que se ven bien, pero depende de ti s Oh, así es como puedes tirar en tus colores a X'd. Entonces ahora te he mostrado cómo dedo del pie, cómo llegar con una paleta al menos de una manera y también cómo traerla a X D. Así que por qué no todos ustedes van adelante y eligen una paleta y luego suben su paladar Teoh a su área de proyectos de
compartir para que ustedes puede obtener algunos comentarios al respecto y luego una vez que lo hayas subido, adelante y tira de ella en X D, y luego pasaremos a la siguiente lección.
14. Habilidad XD: adición de fotos: Muy bien, entonces ahora tenemos nuestros colores importados. Esperemos que también hayas importado tus colores. Vamos a empezar a construir el sitio para que no necesitemos la plaza. Entonces solo voy a golpear hasta plomo para deshacerme de esa plaza. Y, eh, como mencioné cuando estaba dibujando, vamos a salir con una especie de área de héroes con un área de pancartas con un llamado a la acción. Y así en esa área, queremos que eso sea atractivo y atraiga a la gente de inmediato para que sea probable que se queden en nuestra página web y navegue por ella. Entonces una cosa que me gusta que me parezca podría ser útil para eso es si encuentras una bonita imagen que sea relevante para tu sitio y haces que sea ah, un fondo grande. Entonces, um, el siguiente paso, si estás siguiendo, sería encontrar una imagen para encontrar imágenes. A mí me gusta virgen mucho la ceniza en splash dot com. Vamos a ver eso, uh, muy rápido. Aquí. Por lo que se trata de ceniza virgen debilitar tipo búsqueda. Entonces mis vistas como un tema de viaje, así que me gusta la idea de una playa para que puedas ver una playa mecanografiada. Y tengo todo tipo de fotos geniales. Si encuentro uno que me guste, solo
tienes que hacer clic en descargar y guardar la foto. Um, pero ya
fui, seguí adelante y navegar por esto y encontré varios que me gustaron. Entonces echemos un vistazo aquí. Entonces después de que encuentre las fotos, como pueden ver, me gusta comprimirlas. Ah, la razón por la que hago eso es porque ayuda a dedo a mantener un poco el tamaño de archivo de mis tamaños
de archivo ex d . No tengo la computadora más poderosa. Entonces, a veces cuando esos tamaños de archivo
se vuelven demasiado grandes, empezará a ralentizar X d. Y también es sólo una especie de Ah, buena idea. Ya sabes, si no necesitas un archivo enorme, ¿por qué usarlo? Um, entonces también me gusta cambiar el tamaño de los archivos, así que lo estoy diseñando 1920 píxeles de ancho. Entonces, en su mayor parte, no
voy a usar en imagen. Eso es mucho cable que 1920 s. Ah, esa también es otra forma de ahorrar para ahorrar,
um, um, espacio y mantener los tamaños de archivo reducidos. Entonces vamos a ver. Me gusta mucho esta imagen así que voy a hacer de esto mis fondos. Hay muchas maneras de traer imágenes a X D. Probablemente mi manera favorita es,
um, um, solo arrástrelas y soltarlas desde el explore. Entonces aquí vamos. Podemos simplemente arrastrar esto y soltarlo justo dentro, y luego una vez que lo tengamos, podemos usar nuestra herramienta selectora y arrastrarla alrededor, y luego puedes ver que tiene estos pequeños puntos. Haga clic en esos puntos. Puedes cambiar el tamaño y algo Eso es un poco bonito sobre X'd. Eso es diferente a algunos productos de manipulación fotográfica como Photo Shop. ¿ Es en cualquier lugar que arrastre arrastre a un costado? O si arrastras en una esquina, se va a quedar con las porciones de la foto? Um, entonces, como en la tienda de fotos, si empiezas a arrastrar por un lado sin sostener nada más, es conseguir que las fotos se van a distorsionar. Pero como puedes ver, el Anexo D no hace eso porque, ya sabes, mayoría de las veces cuando estás construyendo un sitio web, no
quieres una foto distorsionada, así que solo vamos a seguir adelante, no
había jugó un poco con nosotros. Hazlo donde creemos que queríamos hacer un pequeño cultivo un poco más así. Y luego una vez que veas todavía seleccionado, puedes conseguir ese punto en ese borde azul. Entonces una vez que un seleccionado, entonces se puede ver que sólo va a mostrar en mi tablero de arte. Entonces, ¿por qué no van todos adelante y pasan algún tiempo buscando algunas fotos que crean que les
van a gustar, y luego comprimirlo y redimensionarlo y traerlo en remolque X'd y luego también subirlas a su área de
proyecto para que podamos dar retroalimentación y y ver Ve tu progresión a medida que construyes el sitio s. Así que en el siguiente video, solo
seguiremos construyendo el sitio y aprendiendo más cosas sobre X'd.
15. Habilidad XD: formas: Está bien. Entonces para mi diseño, voy a usar formas como, ah especie de,
ah, ah, característica de interés
visual. Entonces voy a hablar de cómo crear formas en este video. Por lo que hay dos formas ah que puedes hacer fácilmente en X'd que rectángulos. Está en la herramienta de rectángulo y la elipse. Simplemente puedes hacer clic en él a un lado o simplemente e y entonces eso va a tirar cambiarte a la herramienta Elipse son para la herramienta de rectángulo para que puedas arrastrar alrededor. Se puede ver si arrastro Es sólo hacer cualquier tipo de forma. Um, para los míos voy a hacer círculos perfectos. Entonces para hacer un círculo perfecto mantienes presionada la tecla Mayús mientras arrastras y luego
va a mantener la forma en un círculo perfecto Y entonces, si golpeo, son para traer de vuelta la herramienta de rectángulo y arrastrarlo arrastrando Y entonces voy a sostener cambio descendente y se puede ver lo mismo funciona con la herramienta de rectángulo solo se crea
cuadrados perfectos cuando se mantiene presionada la tecla Mayús. Entonces tenemos mi plaza. Una vez que tengas tu cuadrado, puedes ir para aparecer en el área de apariencia, y puedes jugar con cómo se ve para que puedas aumentar o disminuir la opacidad, lo
que hará que más o menos ver a través de rectángulos. Puedes manipular el radio del borde, manipular las esquinas, así que si quieres hacerlo con todo lo que selecciones,
um, um, este ícono y luego puedes hacer clic aquí y puedes usar tus teclas de flecha para simplemente ir arriba y abajo así. O también podrías ingresar un número. Digamos que querías hacer hacerlos realmente redondeados 90. Si quieres ir uno por uno, haces clic en el icono poco punteado radio diferente, llegar esquina on. Entonces puedes ver por aquí la ah, en el ícono. Cualquiera que estés editando está resaltado azul, así que solo haremos este más grande para que veas que en la acción 1 80 solo estoy escribiendo con teclas
numéricas y entrando,
y luego hace que esa esquina sea más redondeada. Y luego para el relleno, haga clic en esto. Y como vimos antes, se
puede, um, habitaciones. En realidad, como vimos antes, también
puedes, en lugar de hacer click que solo puedes usar la herramienta cuentagotas y seleccionar un color. A partir de ahí, ya
tenemos estos lindos colores jalados aquí para que podamos usar estos. Simplemente haz click y va a cambiar al color que elijas. Y luego si quieres un tono ligeramente diferente, puedes jugar con eso. Arrastra esto alrededor del dedo del pie, ya
sabes, agrega más o menos negro, más o menos blanco. Um, si quieres, solo aparece color por aquí, y luego si quieres cambiar de color por completo e ir por aquí, um y entonces esto establecerá la opacidad. Esta es otra forma de establecer la opacidad. El tipo de cosa que puedes hacer con esto es que no puedes establecer un pasado que te guste, y luego lo puedes más, y eso lo va a salvar aquí abajo. Y luego puedes volver a aplicar eso en otras áreas. No vamos a hacer eso ahora mismo, sin embargo, así que puedo arrastrar eso. Se lo va a quitar de mi paladar. Entonces así es como cambias el color de relleno. Y entonces el color del borde tiene el mismo conjunto. Se puede jugar con los colores igual que se puede, um, para el relleno, y luego también se puede ajustar el tamaño del borde para que podamos hacer que sea un dicho si entramos en 15. El teclado de números y que tenía entrar. Se puede ver que la frontera se hace mucho más grande, mucho más gruesa. Podrías darle un guión a la frontera, así que dimos un pequeño guión ahí. Y luego se puede establecer la brecha entre el borde pero entre el guión fronterizo, y luego se puede ver a un 20. Entonces la brecha se hizo mucho más grande entre esos guiones, Um, y luego también puedes jugar con la forma del guión y ese tipo de cosas. Hazlo redondeado. Se puede dar la forma de sombra de gota. Cubra eso más tarde. Pero solo revisas esa casilla y luego puedes poner un fondo difuminando aquí, volando el fondo de lo que estaba debajo de la forma. Después puedes ver que hay unos controles adicionales para el desenfoque de fondo. Entonces así es como se crean y manipulan formas. Eso es lo básico en el próximo joven y agregar algunas formas a mi simulacro arriba. Entonces vamos a conseguir vamos a seguir
16. Agrega formas: Está bien, así que ahora que sabemos hacer formas, te
voy a mostrar cómo las voy a usar en este simulacro. Entonces me gusta mucho esta imagen. Y creo que podríamos simplemente dejar esta imagen tal como es y justo, um, poner nuestros textos se llaman acción texto año y, ya
sabes, oración. Mira por aquí y termina con ello. Pero uhm, voy a usar algunas formas y poner esas formas sobre la imagen para especie de agregar otro elemento. Y luego voy a usar las formas y llevar eso a lo largo del diseño askew. Ve más abajo por la página para que ese es el orden esperemos que junte el todo . Entonces me gusta mucho la forma en que este barco crea un arca. Y así creo que voy a usar círculos. Es mi forma. Entonces voy a ir por aquí, seleccionar el círculo, también
podría hacer eso con solo golpear cualquiera y luego mantener pulsado turno para que haga un
círculo perfecto , y luego esto arrastre hacia fuera. Yo quiero empezar con uno grande. Usa esta grande. ¿ Qué va a aguantar turno para mantener el círculo perfecto y usar este grande para mi llamado a la acción. Entonces si agarras la herramienta de selección podría moverse así. Um y entonces no quiero fronteras en el algo desmarque la frontera. Y entonces para que no tengas que seguir yendo de ida y vuelta así. decir, Esdecir,es bastante fácil si usas V para la herramienta de selección, Andy para que la herramienta Ellipse vaya de ida y vuelta. Ah, pero otra cosa que puedes hacer es que puedes seleccionar y luego ir a la herramienta de selección pulsando V y luego mantener presionada Ault o su equivalente en el Mac y luego arrastrar mientras estás sosteniendo todo y hacer una copia de la forma, y luego puedes mantener pulsado el turno para mantener el círculo perfecto. Yo quiero que solo los círculos sean de diferentes tamaños. Entonces sé que soy tú necesitas otra aquí arriba para el menú para que puedas ver fácilmente el menú. Um, así que hagamos ese un poco más pequeño y luego quiero decir a menudo, arrastre dedo del pie, métanse ahí, circulo pasando. Aquí va a ser donde voy a poner el logo. Pon esa por aquí, hazla un poco más grande. Pero haz que salga un poco de la pantalla. No arrastre va a poner otro aquí abajo. Y entonces creo que también quiero tener una que tú que no esté cortada donde puedas ver
todo el asunto sosteniendo turno para mantener el círculo perfecto quieto y hacer de ésta una
cosa bastante pequeña . Vamos a poner ésa aquí por ahora mismo y voy a jugar alrededor del posicionamiento. Ah, más. Pero así es como empezaremos. Entonces ahora tengo todas estas formas. Ahora quiero darles un color. Entonces sólo voy a ir uno por uno, seleccionar y luego ir aquí. Y creo que me refiero a hacer la mayor parte del cual va a ser el color principal del sitio este color rosa
magenta. Así que solo tienes que hacer clic con la forma seleccionada, y luego puedes ver que aplica eso Phil a la forma
como Bueno, como discutimos, um y luego siento que estos círculos aire ocupando mucho de ellos están cubriendo mucho de la imagen, y quiero que no la cubran tanto,
así que les voy a dar algo, quiero decir, un cambio. Cambia la opacidad. Para que puedas ver. Ver la imagen debajo de ella. Y lo bueno de esto es que podemos cambiar la opacidad aquí, encontrar algo que nos guste. Digamos que queremos un poco más que decir, como, nos gusta alrededor como 75. Entonces nos gusta 75 para que pueda simplemente hacer clic en plus, y luego va a agregar ese ajuste exacto aquí, y luego puedo ir a seleccionar mi siguiente forma, y luego no tengo que volver a jugar con la capacidad. Se aplica automáticamente esa capacidad. Um, otra manera. ¿ Puedes hacer eso? Sí. Acabemos con esto. Diga, les
estoy haciendo todo este color, excepto que quiero que este sea el verde. Entonces voy a hacer eso cuando el verde y lo voy a dar, haga clic ahí y luego usando mi teclado numérico golpeó, entrar, y luego es 75. Pero digamos que, ya
sabes, decidí, en realidad, creo que quiero que la opacidad sea un poco,
um, um, más baja, así que voy a bajarla 38. Entonces puse eso en este en lugar de ah, copiando,
copiando eso aquí abajo. Otra cosa. Otra forma. Puedes hacer eso si haces clic en eso y luego controlas, um, ve para copiarlo y luego haz clic derecho aquí y pega apariencia, y entonces no va a cambiar la forma en absoluto, pero solo va a seguir el ritmo del estilo. Um, así que esa es otra forma de hacerlo. Pero me gusta en 75 en realidad. Entonces lo vamos a dejar a los 75. Entonces así es como puedes hacer tus formas. Um, ¿por qué no van todos adelante y vean si tal vez su imagen se ve bien como es y solo quieren dejarla? No quieres poner ninguna forma, pero si decides que quieres poner algunas formas o y seguir, lo otro que haces es ponerle unas líneas encima. Agrega un poco de interés, pero juega con él y decide qué quieres hacer. Y luego una vez que estés satisfecho, sube a tu área de proyectos para que podamos seguir viendo tu progresión. Está bien, y así pasaremos al siguiente video
17. Fuentes: Entonces este video no se trata realmente de elegir fondos, sino antes de entrar en el diseño. Yo sólo quería mencionar algunas cosas sobre las fuentes solo para que tengas un áspero Así tienes alguna base de la que salir en solo unas pocas recomendaciones. En primer lugar, diría que me gusta mucho usar los fondos de Google, así que recomendaría usar las fuentes de Google porque son gratuitas y funcionan bien y
tienen muchos buenos fondos ahí fuera si apenas estás empezando, es realmente el camino a seguir, diría que sobre invertir en,
um, um, como una diversión pagada. Por lo que recomiendo las fuentes de Google, y luego cuando sean cosa, te
recomiendo que te limites a una o dos fuentes cuando estés empezando. Es, uh, podría ser tentador intentarlo con Adam. Ya sabes, un teléfono diferente para botones, un fondo diferente para encabezados, diferente frente para tu menú. Ah, fondo
diferente para subpartidas y demás. Pero eso va a ser realmente difícil de hacer, y creo que es solo que es muy probable que no funcione bien,
así que simplemente elegiría un fondo y usaría un montón de pesos y tamaños diferentes t para mostrar tu jerarquía o tal vez dos fuentes. A lo mejor haces uno para encabezados, botones de
menú, y luego tienes uno para el texto de tu párrafo. Ah, así que esas son las cosas que yo esas son mis pensamientos sobre los fondos. No exageres con demasiados, y recomiendo fondos de Google, y ahora podemos hablar de cómo usar fuentes y X'd.
18. Habilidad XD: todos los derechos este video, vamos a cubrir cómo agregar texto. Um, antes de que empiece a hacer eso, sin embargo, sólo
quiero mostrarles sobre el bloqueo. Just Ah, puedes ver ahora este contorno es gris Para hacer eso, bloqueé,
así que solo lo desbloqueé dedo del pie bloqueo algo. Lo seleccionas y luego golpeas control o comando l Y entonces puedes verlo se vuelve gris, y ahora puedes seleccionarlo, pero no puedes moverlo. Por lo que el desbloquearlo que seleccionaste de nuevo, control. Bueno, ahora está desbloqueado. Puedo moverlo, pero quiero mantenerlo bloqueado mientras estoy metiendo. Entonces voy a golpear control l. Lockett, y tenemos un poco de cosas pasando aquí, así que sólo voy a dibujar es rectángulo blanco sobre para mostrar agregar impuestos para hacer un poco más fácil . Ver, Así que agrega impuesto, seleccionas la herramienta de texto o golpeas el té, y luego solo puedes empezar a escribir. Ah, Así que después de que hayas terminado de escribir, haz clic en él y luego puedes ver que tienes opciones por aquí para cambiar tu ah, aquí y lo que acabas de escribir para que puedas desplazarte y elegir un teléfono diferente. Si quieres. Digamos que quieres hacer honesta amurallada y luego aumentará el tamaño para que sea un poco más fácil ver. Solo estoy usando los números en mi teclado y escribí 60 luego presioné Enter se hace más grande y luego voy a hacer clic en V para cambiar la herramienta de selección para que pueda arrastrarla al centro y se
puede ver que es ah, es, um, ayudándome con estas guías inteligentes para mostrarme dónde estoy y cuándo está centrado. Ah, así que ahí mismo, son senadores los que pueden ver y luego para mostrarles algunas otras cosas, vamos a cambiar a una diversión diferente. Si conoces el nombre de los fondos, puedes empezar a escribirlo y luego mucha población. Y cuando veas la que quieres, acabas de golpear Enter, Tire hacia arriba. Um y ahora se puede ver cuando hice eso. Merryweather, tengo un montón diferentes opciones de espera de fuentes así que puedes cambiar la opción, hacerla ligera o, si quieres oscurecer, hazla negra. Soy realmente audaz diversión, y luego puedes enviarla. Eso realmente no va a,
um, um, hacer nada hasta que empezaste a escribir de nuevo. Um y entonces esto está en bonita característica de X D. momento está configurado para que el texto sólo vaya a ocupar la cantidad de espacio que naturalmente hace. Um, así que si fuera a empezar a escribir de nuevo, solo sigue creciendo, y la tengo línea izquierda para que veas cómo va a la izquierda s. así que voy a dar clic para que esté fuera de ahí y arrastrarlo de nuevo. Y ahora está seleccionado para poder editarlo todavía. Y ahora voy a hacer clic en esto, y eso lo convierte para que ahora el texto se quede en un área. Por lo que ahora puedo dar este texto en área y se va a quedar en esa zona para poder arrastrarlo. Digamos que quería Teoh, um, hazlo así. Entonces sólo puedo arrastrarlo. Y ahora todo el texto que escribo se va a quedar en esta zona. Y digamos que quiero centrar centro y luego editar esto. Doy doble clic aquí, haga clic al final, y ahora solo puedo empezar a escribir, y no importa lo que escriba, se va a quedar dentro. Ah, esa zona que quiero decir Y lo bonito de X'd es que fácilmente puedes cambiar de ida y vuelta . Entonces digamos que decidí más tarde eso, um quería que Teoh volviera a esta manera donde sólo ocupa el espacio. Naturalmente lo hace, y no hay restricciones al respecto. Yo sólo puedo hacer eso haciendo clic en esto. Entonces eso es algo que es realmente bonito aquí. Puede cambiar el espacio entre las letras Un espaciado entre letras eso A veces esto es agradable. Estás haciendo todas las mayúsculas para poner un poco de espacio extra entre letras. Simplemente pondremos un poco de espacio extra ahora para que puedas ver. Y luego aquí se puede cambiar el espaciado entre las líneas. Eso Hagámoslo más grande para que podamos ver eso. Y entonces, um aquí se puede cambiar el espacio entre párrafos. Entonces esas son las principales cosas que puedes hacer con el texto en sí. Además de esas cosas, también
puedes cambiar. El aspecto del texto podría cambiar la opacidad. Es como si se pudiera con las formas. Phil. cambio falló a lo que quieras. Um, puedes darle un borde y luego, como puedes con formas puedes aumentar o disminuir el tamaño del borde. Tapar un número hit. Entra, um, da una sombra de gota. Dale ah, fondo desenfocar eso esas Las principales cosas que puedes hacer con el texto eso No, En el siguiente video, voy a añadir algo de texto el simulacro arriba.
19. Añade texto a la maqueta: Muy bien, entonces ahora vamos a añadir un texto a nuestro simulacro. Lo primero que hacemos es agregar un bonito gran llamado a la acción. Entonces vamos a conseguir nuestra herramienta de texto, y luego empiezas a escribir. Vamos a llamar, vamos a decir,
um, um, toma el viaje de toda la vida, tal vez de tu vida. Muy bien, entonces nos dieron nuestro texto, y ahora sólo quiero mostrarles algo. Ver, el cursor sigue ahí y nada seleccionado. Entonces si vengo aquí y trato de cambiar la fuente ahora mismo, tengo sobre Lata, que es un fondo de Google. Entonces digamos que iba a cambiar de nuevo a Merryweather. Había entrar. Se puede ver que no pasó nada. Eso se debe a que el cursor sigue aquí y nada seleccionado. Entonces si realmente quiero cambiar lo que hay en lo que he escrito que tengo que ir a una
herramienta de selección It v lo que es en realidad cuando estás escribiendo no puedes ser hay que ir por aquí, conseguir la herramienta de selección. Entonces puedes ver ese borde azul muestra alrededor del exterior de lo que escribiste. Y ahora si vienes por aquí, pegas a Merryweather y luego entras, va a cambiar tu diversión, pero me gusta Ah, este fondo. Entonces vamos a ir con eso por ahora. Um, se
puede ver que tengo un bastante grande quiero que sea agradable y grande para esto llamado acción. Yo quiero ser realmente claro. Y también voy a hacer un corte con él, así que quería ser realmente audaz. Déjame asegurarme de que este es el eso que pienso. Sí, tengo el más audaz,
um, um, cayendo disponible para esta familia. Y voy a convertirlo en un área de texto para que pueda cambiar el espacio que está ocupando. Ahí vamos. Entonces. Yo quiero que esto repase esto, y vamos a dejar eso por ahí así por ahora. Um, es un poco extraño de mi último bebé. Yo sólo voy a sacar eso, Golpea cero, entra. Y ahora no nos preocupamos por el espaciado extra. Cuando sí regrese. Ahora, voy a añadir en nombre de esta empresa. Ah, así que ese es el nombre de la empresa de mi cliente. Y como pueden ver, hice clic fuera, hice clic fuera de las áreas las cajas azules al saber lo agregaron. No lo quiero tan grande como el llamado a la acción. Entonces voy a ir por aquí y dejarlo caer. Probemos 36. Eso es un poco demasiado pequeño. Intentamos 48 así que eso me gusta bastante bien. Y quiero poner esto aquí,
y en realidad, mi cliente no lo hizo. Todavía no tiene logotipo, pero sólo voy a hacer algo realmente rápido por ellos. Entonces tengo mi herramienta de labios, y luego voy a sujetar a Ault y cambiar. Cuando te aguantas, todo eso lo hace. lo hizo cuando empezaste a crear tu forma. Va desde el centro. Entonces vamos a hacer un círculo por el fondo así. Um, me voy a quitar la frontera. Voy a darle uno de los colores. A lo mejor le vamos a dar un ligero color. Es como verde. Y ahora puedes ver que lo está cubriendo. Um, así que voy a mover la forma de nuevo para hacer eso, tú mantienes pulsado el control o el comando en un Mac, y luego obtienes la llave de corchete que se mueve. Mueve la capa hacia abajo unos, y luego puedes verla de nuevo. Está bien. Tsunami para hacer un segundo círculo para esto. Haces turno de ahold mientras yo hago eso. Por lo que se mantiene un círculo y hacer un poco más pequeño. Uno nos arrastró. Entonces no está cubriendo todo el asunto. Despegue la frontera. Vamos a darle a esta Ah, ligero color rosa y luego seleccionó raqueta de mando del controlador y luego empujarla hacia abajo. Y supongo que este es el soporte abierto que estoy usando dedo del pie, um, para mover la capa hacia abajo para moverla hacia arriba, usas la ropa hacia atrás. ¿ Te gusta eso? Está bien, así que tenemos eso. Tenemos nuestra imagen de fondo, y voy a jugar un poco más con nosotros. Pero, uh, ¿por qué no van todos adelante y empiezan a agregar su llamada a la acción y tal vez hagan un pequeño
logo rápido donde realmente no necesiten un logo si lo desean, Podrían simplemente escribir a nombre del año su empresa ah para el que estás haciendo el sitio, y luego sube eso y pasa al siguiente video
20. Habilidad XD: fusión y conversión de texto a los contornos: Está bien. Entonces este video, vamos a cubrir la conversión de contornos de dedo de texto y luego también formas emergentes. Entonces para fusionar formas, agarraremos una forma aquí, y luego vamos a empezar a hacerlo desde el centro. Entonces para hacer eso, te aferras a Ault u opción en el Mac y cambias para mantenerlo un círculo perfecto. Y luego empiezas a arrastrar y puedes ver que va desde el centro. Um, y luego si vamos por aquí y no aguantamos todo lo que acabamos de decir que me refiero a dragón, sale a un lado. Entonces vamos a hacer estas dos formas,
um, um, luego golpear V para cambiar a la herramienta de selección. Y luego vamos a seleccionar ambos para hacer eso y tú seleccionas Ah, mantienes turno. Ah, bueno, haciendo clic en ambos. Y luego puedes venir aquí con ambos seleccionados, y puedes hacer estas diferentes opciones de fusión. Esto los fusionará, que es lo que vamos a hacer. Pero también podrías hacer algo restar que va a sacar el control de objetos frontal Z deshará eso, y luego puedes sacar la parte donde se superponen y luego puedes Onley Um dentro del último dejó la parte, debilitarla más. Y donde se superponen, éste sacará donde se superponen. Para que lo veas. Quita la parte donde se superponen s. Así que así es como puedes manipular formas. Déjame deshacer esa última. Vamos a fusionar eso, y luego se puede ver que hemos surgido la forma. El genial de X d son algunos otros programas, como ilustrador. A veces cuando usas algunas de estas características, es ah, es destructivo. Entonces dices emerger la forma no sería capaz de volver atrás, pero en x d. puedo si mantienes el control. Ah, entonces solo puedes hacer click. Algún control de retención sería comando en un Mac. Simplemente puedo hacer clic, y luego puedo ver la forma es justo donde está y aún están fusionadas. Todavía hay totalmente comestible, aunque puedo hacerlo más pequeño. Más grande, ya
sabes, haz lo que yo quiera. Um, y todavía están emergiendo, pero aún están completamente debilitados. Todavía puedo controlarlos. Y si quisiera ponerme el dedo del pie, fusionarlos, podría simplemente subir aquí y luego son formas separadas otra vez. Por lo que es realmente bonito acerca de x d No tienes que preocuparte por emerger destruyendo cosas. Entonces algo que vamos a hacer para el simulacro de arriba es que vamos a convertir nuestros contornos de texto o pasar, y luego vamos a Teoh fusionarse con la forma. Entonces solo voy a repasar cómo cambiar el texto a un pase. Así que seleccionaste, ir a ruta, convertir a ruta, y ahora ya no es texto. Es ah, es una forma o camino. Entonces lo ves haciendo doble clic, y luego sólo trae los puntos de anclaje. No trae el cursor donde podría escribir de nuevo. Entonces eso es algo que te es destructivo. Una vez que haces eso, la única manera de volver atrás es dedo del pie. Deshazlo. No se puede. No hay botón mágico para hacer clic y volver a hacerlo texto. Va a ser un poco cuidadoso que tengas tu texto justo como lo quieres antes de hacer eso. Está bien, entonces en el siguiente video, te
voy a mostrar cómo voy a usar estas técnicas en el simulacro de arriba
21. Habilidad XD: texto de recorte: De acuerdo, Así que ahora lo que vamos a hacer es su fusión se llaman acción con nuestra con el círculo. Entonces creo que eso será una especie de efecto fresco, porque podrás ver a través del texto a la imagen. Pero, um, como mencioné, una vez que conviertas tu texto de caminos, no
puedes volver atrás y editado como, ah, como, um, impuesto. Entonces, ¿quieres estar seguro de que lo tienes? Cómo lo quieres antes de hacer eso. Entonces una cosa en la que he estado pensando es que este dedo se ve bien. Creo que preferiría tener algo que sea un poco, um, un poco más grueso, un poco más pesado. Entonces creo que en realidad voy a cambiar la fuente que estoy usando aquí de Lado Teoh son Chievo . Así que empieza a escribirlo y luego golpea. Entrar. Y ahora se puede ver que es una fuente más gruesa, más pesada. Podría tener que bajar la talla para que quepa donde quiera. Eso es lo que es significativamente más grueso. Ah, así que también voy a cambiar esto sólo para que las cosas vayan juntas. Te recomiendo no volverte demasiado loco con las fuentes cuando estás especialmente cuando estás empezando, así que puedes o simplemente quedarte con una y luego usar diferentes pesos extraños como el negro y luz y combinarlos de esa manera. O tal vez quieras acostumbrarte a. Puedes simplemente Google emparejamientos de fuentes si quieres, o puedes una especie de juego por ahí normalmente quieres tratar de encontrar a eso, um, supongo que hay muchas cosas sobre el emparejamiento divertido, pero una manera fácil de hacerlo. Está bien para eso Luzcan mucho diferente, pero aún así se ven bien juntos. Es fácil en problemas si tienes que lucir realmente similar. Um, eso fue algo así como, ¿Por qué estás pagando a estos dos? ¿ Por qué no solo usas uno? Entonces de todos modos Ah, sólo un poco apagado. Ah, un poco fuera de pista en las fuentes. Por lo que convertimos este Tar Chievo. Y creo que este es este texto es un poco demasiado largo para lo que yo qué? Yo quiero entrar aquí. Entonces lo voy a cambiar para decir, toma tu viaje de ensueño. Es como un poco más pequeño. Y luego lo voy a poner aquí. Se puede ver Ondo. Tiene el alineamiento. Dos goles. Y también quiero pensar que quiero enviarte esto. Eso va a quedar mejor dentro de este círculo, y así lo voy a alinear en el centro del círculo. Y una vez que lo tengo, donde yo donde creo que quería estar, entonces voy a dar click derecho e ir towpath, convertir a path y ahora puedes ver que ya no es texto. Es ah, forma. Es un camino por doble Haga clic en él. No puedo teclear. Simplemente trae arriba los puntos de anclaje. Entonces eso es lo que quería dio Um, así que ahora vamos a fusionar la, ah, esta forma que hicimos a partir del texto con el círculo detrás de él. Por lo que selecciono el círculo haciendo clic en él. Entonces mantengo el turno y selecciono el texto que le gusta tanto a la vez. Y entonces podemos subir aquí. Podemos fusionarlo, pero lo que queremos hacer es restar, por lo que queremos restar el texto de esta forma. Entonces hacemos clic en eso, y ahora puedes ver que es como si hubiera un corte para el texto. Um, así que ahora que hemos hecho eso, vamos a mover esto. Ah, tal vez
tengamos que sólo la imagen de fondo para que podamos ver lo que dice el texto así hacer eso . Y, um, algo en lo que estoy pensando aquí es tal vez queremos poner un poco de superposición sobre esto para que, um Para que estas áreas un poco más oscuras. Ah, pero en realidad, creo que esto va a estar bien. Podríamos volver y hacer eso más tarde. Pero por ahora, hemos fusionado el texto, y se puede ver que es una especie de efecto de corte fresco. Ah, con nuestro llamado la acción. Entonces en el siguiente video, vamos a seguir construyendo el simulacro para arriba.
22. Botones y menú: Entonces en este video vamos a agregar un botón al que la gente puede hacer clic justo debajo de la llamada a acción. Y luego también vamos a añadir un menú de hamburguesas. Vamos a construir un anuncio. Ambas cosas. También puedes ir de pie contigo. Yo niño, um, te
pongo como, es ir a un marco de alambre uno y hacer clic en eso y dar algunos pasos y luego puedes tirar de un botón desde ahí. Pero son bastante simples de hacer, así que solo te mostraremos cómo hacerlos aquí para hacer el botón, voy a la herramienta de rectángulo y luego lo arrastro y probarlo. Y como dije, esto es algo que queremos estar diseñando algo así cuando probablemente deberíamos hacerlo con el texto, también al 100% para asegurarnos de que no sea enorme. Entonces quiero decir, hit control uno. Amplía y luego me voy a mover a ver mi botón, y lo puedes ver al 100%. Ese es un botón grande, así que voy a bajar el tamaño. O sea, baje la altura 48. Entonces ahora puedo empezar a ver OK, esto es un poco demasiado grande y usualmente para mis botones. Voy a usar un tamaño de texto alrededor de 18. Entonces es tipo en, um, ir lugares podría verlo usando estos. Ah, herramientas de
alineación para ver cuándo está centrado. Uh, y entonces realmente no me gusta la frontera. Entonces me voy a quitar la frontera. Se puede ver en este momento es el aire de los bordes totalmente cuadrados. No usualmente me gusta usar bordes totalmente cuadrados si quieres cuadrado. Mira, pondría al menos, ya
sabes, 2 a 5, um, en el radio fronterizo para que puedas ver ese tipo de solo, um, lo
limpia. Hace que se vea un poco más profesional. Un poco más. Ah, como si pusieras un poco de esfuerzo en una supuesta que simplemente dejarlos cuadrados. Pero para este, ya que tenemos tantos círculos, voy a ir con bordes totalmente redondeados. Entonces tenemos eso, um Y creo,
um, um, si vas, si realmente quieres meterte en botones, puedes ir a buscar diseño de materiales El manual ah de Google. Y entonces Apple también tiene algunos materiales bonitos sobre cómo recomiendan hacer botones. Podría ir ahí si quieres conseguir el espaciado exacto para usar para los botones, pero sólo vamos a ir con algo que personalmente me gusta,
um, um, y está bien, así que ahí vamos. Eso me metí centrado. Y luego quiero decir, haga clic en ambos del este usando manteniendo presionado el turno, y quiero agruparlos juntos para que no tenga que seguir arrastrándolos por separado o seleccionando eso una vez. Entonces haz eso. Mantenga pulsado, control o comando en un Mac y luego golpea G. Y ahora los agrupa y ahora se iguala moviéndose alrededor de algo un centro dentro de esto. Y entonces vamos ah, alejar, Comando
Controlador menos. Y ahora tomemos un montón entero. Mira, todo
esto seleccionó el control tres. Y ahora, ya sabes, creo que me gusta la forma Eso se ve bastante
bien, um , bueno, estoy pensando que esto es un poco demasiado grande. He decidido que voy a bajar esto a 36 y también voy a bajar esto, Alton y cambiarme a la cartera Dragon. Manteniéndose centrado. Está bien, así que creo que eso es un poco mejor. Yo sólo quiero hacer eso cuando estaba pensando en ello. Entonces ahora vamos al menú siguiente, así que vamos a hacer un menú de hamburguesas que vamos a poner por aquí. Entonces, de nuevo, esto probablemente sea algo. Queremos hacerlo al 100%. Entonces solo voy a hacer algunos rectángulos como V para la herramienta de selección y luego mantener presionada Ault u opción en el Mac. Espera un segundo, en realidad. Te da el lujo de que quiero alrededor de estos rincones hacia fuera. Entonces quiero decir y borrar ese. Haga clic en esto y vamos a hacer esas esquinas totalmente redondeadas como lo hicimos, y también quitarían la frontera. Entonces ahí vamos y luego mantenemos pulsada la opción Alter en el Mac, y luego se puede ver donde no se puede ver muy bien. Es decir, arrastró estos por encima. Estás buscando ver para que puedas ver los números que muestran Ese es el espacio entre dos eso. Queremos igual espacio entre estos Y si sostienes a Ault, puedes ver el espacio entre ellos. Entonces vamos a aguantar todo y arrastrar de nuevo. Y ahora se puede ver que el espacio es igual entre los tres. Entonces eso es lo que queremos. Entonces vamos a mantener el turno hacia abajo para seleccionar todos una vez controlados G para agruparlos. Entonces arrastramos eso hasta aquí. Queríamos estar en nuestra,
um, um, un poco de área aquí arriba. Muy bien, ¿entonces sabes qué? Al mirar esto, creo que esto es un poco demasiado grueso, así que voy a volver a entrar y controlar tres, para poder verlo. Controla uno, consigue 200% luego controla turno G willen agruparlo para que pueda jugar con facilidad, y luego están todos seleccionados quietos. Entonces voy a bajar la altura de su pequeño delgadez. Piensa que eso fue un poco demasiado grueso. Está bien, ahí vamos. Para que no cambies. Seleccionarlos todos control G agruparlos otra vez, acuerdo? Y entonces sabes qué, en realidad quieres controlar turno g un agruparlos, haz esto en lugar de solo tener que todos sean, ah, mismo con Zoom aquí. Y entonces voy a sólo thes quiero que sean de la misma altura. Entonces esa cambió. Entonces los voy a hacer para que estén un poco escalonados. Troll uno, Atrás. 200% por aquí. Selecciona nuestro tablero de control tres para que pueda ver todo mi tablero de arte. Entonces voy a seguir jugando con eso. Pero así es como se puede hacer un botón y un menú de hamburguesas. Entonces solo dejaré que todos sigan adelante y agreguen esos mock ups burlones y luego suban su progreso . Queremos seguir subiendo el progreso después de cada video, solo causa que eso te va a ayudar a obtener retroalimentación. Ojalá de tus compañeros de clase, otras personas haciendo esto. Y luego también va a ayudar a que las cosas se peguen a medida que las aprendes. Así que adelante y agrega esas cosas a tu simulacro arriba, subido y luego entra en el siguiente video.
23. Limpieza general: Está bien. Por lo que a estas alturas, yo sólo quería hacer un poco de limpieza. Um, ya
sabes, realmente no necesitas ver este video, pero solo pensé que te lo mostraría si te interesa ver cómo cambian las cosas , ¿Cómo? Decidí cambiar las cosas. Entonces, ya
sabes, estoy mirando esto, y siento que por alguna razón, realmente no
me gustan estos colores. Creo que por la capacidad que le dimos esto se ve muy diferente a esas heridas. Y luego, ya que este es su color principal, me gustaría mucho tener su color principal más cerca de su logotipo. Entonces decidí que voy a cambiar estos colores para arriba. Voy a hacer de esto la oscuridad. Voy a seguir adelante y hacer este testamento. El texto es blanco, lo
puedes ver. Y luego voy a convertir esto en ese ese color verde. Pero quería darle un poco de ciudad pasada aquí, Darle un poco de pasado. Yo entonces. Es decir, sólo una especie de bebió esto alrededor. No, no, que quiero que esto se vea un poco parecido, te
haga pensar en un menos global. Entonces, um, ahora que tengo este color aquí como me siento como este. A lo mejor ya no necesito este. Así que deshazte de ese. Um, y luego bajista para seleccionar las tres de estas muchas cosas controlan g para agruparlas, entonces quiero decir, una especie de bombas. Empezaron a alinear un poco las cosas, así que quiero en la línea la parte superior de, um, el menú a la parte superior de ese bajo por ahí. Pero agruparemos primero el logo. Y conseguir eso donde queríamos antes de pasar demasiado tiempo haciendo eso s van a poner el logo ahí, no ver. Sí, creo que sí, creemos el logo ahí. Asegurémonos de que consiguió este top de esos dos alineados. Y luego si mantienes presionada la vieja llave para, um, opción en el Mac, puedes ver la distancia lejos de las cosas. Por lo que queremos llevar esto a la misma distancia del borde del tablero de arte que el logotipo . Um, así que haz eso. Necesito el dedo del pie cambiar esto porque ahora mismo esto se ha acabado fluyendo el aeropuerto, así que no me está dejando ver lo lejos que está. Um, así que voy a desbloquear esto rápidamente. Parotiditis. Y entonces sólo voy a arrastrar esto aquí. No, puedo ver qué tan lejos dice eso Si mantengo presionada la opción en el Mac, probablemente no pueda ver eso, pero es 110. Yo me voy por aquí. ¿ Ves a qué distancia está esto? Es de esa manera tendría que redimensionar eso realmente. Entonces en lugar de volver a dimensionarlo, lo que voy a hacer es que voy a hacer un poco de matemáticas. Yo lo sé. Mi, uh todo mi no puede. Todo mi tablero de arte es 1920. Entonces si quería ser 110 de cada lado que necesito restar 220 de 1920. Entonces este dibuja rectángulo aquí dentro, y luego haremos el rectángulo 1920 y luego puedes seguir, entrar menos a 20 y luego golpear. Entra automáticamente haz eso por ti. Entonces queremos centrar esto para que podamos usarlo para alinear estas cosas. Por lo que hacemos click mientras se selecciona, hacemos clic en centro, y luego volvemos a nuestra herramienta de selección. Entonces voy a usar mis teclas de flecha. Necesito agruparlo para hacer esto. Entonces voy a mantener pulsado el turno, seleccionar todas las partes que componen nuestro logo, Entonces usa las teclas de flecha para traerlo hasta que consiga esa, um, auto una línea que muestre que estoy en el borde del rectángulo en ambos lados. Y luego terminé con este rectángulo que lo lleva. Um, y entonces creo que voy a hacer el turno de espera, seleccionar todos estos, hacer esto en un G controlado por grupo, y traer esto un poco más. Y luego mientras tengo esto, creo que voy a jugar con esto sólo un poquito. ¿ Todo bien? Entonces creo que me gusta pensar, como donde eso es un poco mejor. Está bien, entonces eso es sólo algo que quieres hacer periódicamente. Tipo de paso atrás de donde estás y hacer ajustes. Um, entonces te gusta la forma en que se ven mejor las cosas? Está bien. Entonces sigamos trabajando en nuestros simulacros. Si quieres tomarte un momento ahora mismo, dedo del pie tipo de redefinir y reelaborar tu simulacro, luego sube eso al área de proyectos. Eso sería genial. Pero si te sientes bien al respecto, eso solo sigue adelante. Otra cosa antes de irnos, él puede ver esto es sin título, editado. Todavía no lo he guardado, así que siempre quieres guardar tu trabajo. Aquí puedes sobrellevar, guardar. Y luego vamos a llamar a este simulacro arriba,
golpear, Enter, Enter, guárdalo. Y ahora puedes ver que se llama Mock up. Y no hay nada que diga que fue editado. Entonces es todo lo que se ha salvado. Si fuera a entrar aquí y,
um, um, cambiar el tamaño de esto, dice editado, así que hay cambios inseguros. Entonces para hacer eso, para salvarlos, solo
podría tomar el control s o comando en el Mac s, y luego va a guardar esos cambios. Muy bien, Así que podría jugar con este pequeño botón más. Eso es suficiente. Sólo para que tengas la idea de cómo estoy haciendo las cosas. Está bien, así que sigamos, sigamos haciendo el Markham
24. Introducción a los estilos globales: todo bien. Solo quiero hablar un poco sobre,
um, um los colores son colores globales, estilos de
carácter y símbolos antes de recuperarlos en extra solo para que entiendas el concepto detrás de ellos. Uh, cuando estás diseñando sitios web air abs, vas a terminar con potencialmente,ya
sabes, ya
sabes, cientos de pabellones de arte diferentes y esos tableros de arte aire yendo del dedo del pie. Repite muchas de las mismas cosas, como tus botones. A lo mejor tienes un botón de envío en el piso y eso va a estar encendido, como, ya
sabes, 20 de tus, uh, 20 años maquetas en tu vas a usar los mismos colores a lo largo de tu proyecto. Vas a usar las mismas,
um, um, fuentes y tamaños de fuente y ese tipo de cosas a lo largo de tu proyecto. Entonces lo que los estilos de personajes y los colores y símbolos globales te permiten hacer es en lugar de
digamos , tienes este botón y piensas cuando estás empezando,
piensas que es perfecto,
así que úsalo piensas que es perfecto, todo a través de tu sitio. Pero luego le muestras al cliente que a los clientes les gusta, ya
sabes, uh, lo
siento, realmente no me gusta esto. Ah, gracias. Normalmente, hay
que pasar y hay que encontrar y cambiar cada uno de esos. Entonces primero es un dolor encontrarlos a todos. Y luego, segundo, es Lleva tiempo cambiarlos a todos. Pero con símbolos. Si usas símbolos de lo que puedes tomar ese botón y puedes editarlo. Simplemente lo encuentras en un solo lugar. Haces las ediciones, y luego las que su aire aplicó a los botones a lo largo de todos tus diseños. Entonces eso te va a ahorrar una tonelada de tiempo y los estilos de personajes y colores globales. Son una especie de concepto similar. Eh, digamos , tienes este verde que realmente te gusta y haces todo tu conjunto de simulacros
usando ese verde. Y luego resulta, ya
sabes que al cliente no le gusta ese verde. Entonces en lugar de tener que ir a buscar todas esas instancias del verde y cambiarlas una por una , solo
puedes ir a tu paleta de colores global. Cambia uno ahí, y lo va a aplicar en todos tus tableros de arte y lo mismo con personajes con estilos de personajes. Podrías simplemente cambiarlo,
cambiar el estilo del personaje una vez en tu panel de estilos de personaje. Se va a aplicar en todos tus tableros de arte. Por lo que básicamente los símbolos, los estilos de
caracteres y los colores globales son una especie de medidas de ahorro de tiempo para este proyecto. Probablemente no va a ser necesario sólo construir una página de inicio. Pero hay un concepto realmente importante y algo que realmente debes intentar usar una vez que estés diseñando sitios web completos.
25. Habilidad XD: los colores, y estilos de personajes: De acuerdo, Así que ahora que tenemos ah sitio de canaletas bien en marcha aquí, creo que es buen momento para repasar. Ah, el área patrimonial. Para que encuentres eso por aquí, haz clic en él y luego podrás expandirlo. Y hay tres partes principales a esto colores, estilos de
personajes y símbolos. Por lo que vamos a repasar cada uno de esos empezando por los colores. Entonces básicamente lo que todo esto hace es que te permiten cambiar algo rápidamente a lo largo cada elemento de tu documento. Entonces quiero decir ahora mismo Ah, esto No es muy difícil entrar y cambiar. Ya sabes, los tres círculos que tienes que son este Ah, este color que te llevaría, como menos de un minuto, probablemente. Pero di que estás haciendo como, un prototipo a escala completa de in ah app o algo así y tienes,
como, como, 50 años ah, 100 o más tableros de arte. Si necesitas cambiar, ya
sabes, necesitas cambiar este color en ah 100 lugares. Eso te va a llevar mucho tiempo. Entonces ahí es donde la idea detrás de estas cosas es que se puede cambiar algo. Cámbialo aquí una vez, y lo cambia en todas partes de tu documento, así que para configurarlo, Um, cuando tengas un montón de cosas ah, ya en su lugar, puedes simplemente seleccionarlas todas. Y luego ves que estos botones plus se activan. Simplemente haz click plus, y luego tira de todos los colores que tienes hasta ahora, puedes ver que hay una pareja que agregamos en nuestra zona de relleno que aún no están aquí
porque aún no los hemos usado. Pero esto debería ser todo lo que hemos utilizado hasta ahora. Y así ahora sólo para demostrar, digamos que sí queríamos cambiar esto. Ah, rosa. Por lo que solo tienes que hacer clic derecho aquí y luego editar. Y entonces digamos que queremos cambiarlo a, ah uno para cambiarlo a como, uh, un negro o como un gris. Haz eso. Y como puedes ver, cambió a los tres solo con cambiar a la vez. Pero en realidad no queremos hacer eso. Vamos a deshacer eso. Está bien, así que así es. La idea detrás de los colores y luego los estilos de carácter es similar. Simplemente me quedaré, um, todo seleccionado en este caso. Sólo tenemos, uh, para cuidar, um Eric Áreas con texto. Recuerda que se convirtieron esto en un camino, así que esto no va a aparecer. Así que adelante y haga clic en eso y nosotros obtenemos el nuestro también. Entonces estos aire ambos, um, meseta encendida. En realidad, quise hacer estos Ah, nuestro chievo. Entonces sigamos adelante y cambiémoslos ahora. Entonces al igual que con los colores, solo
tienes que hacer clic, editar y luego y hacer que sean Chiba. Y luego cambió. Eso cambió. Um y entonces también me di cuenta de que esto quedó de cuando lo estaba apareciendo antes. En realidad no quiero tenerlo puesto a eso. Si fuera a reutilizar este estilo en otro lugar, no lo
querría así. Entonces vamos a hacer que 48 bien? Y luego también vamos a cambiar este, y luego puedes ver ahora a nuestros linistas la cagaron en este botón. Por lo que sostengo Control. Esto es grupo. Entonces mantendría el control para seleccionar esto dentro del grupo, y luego voy a hacer esto un poco más grande. Y luego voy a golpear el control tres para acercar para poder ver en York y ver un poco mejor. Y luego vamos a reciente en esto Ahí vamos. Lo tiene re centrado. Está bien, así que ahora vamos a golpear el control. Yo quiero volver al 100% y luego vamos a asi que tuviste un poco mas. Um, entonces así es como usas los estilos de carácter. Y ahora, símbolos. Se trata de símbolos un poco diferentes. Ah, vas a usarlo más para cosas como tu encabezado. Cosas como botones. Um, cosas como este logotipo que quieres mantener igual a través de múltiples tableros de arte o a través múltiples lugares dentro de un tablero de arte. Entonces, por ejemplo, digamos que vamos a usar esto, Uh, déjame acercar un poco aquí. Entonces vamos a usar este botón. Déjame un selecto entrando. Ah, así es. Se me olvidó. Agrupar estas cosas enteras. Vamos a seguir adelante y controlar turno G dedo del pie en grupo eso. Entonces Aiken, haz de este botón un símbolo. Entonces ahora este botón es grupo a Comptel porque no puedo dar click en eso. Sólo es seleccionar todo el asunto. Entonces eso es que algunos grupos, así lo agrupamos y luego hacemos clic en Plus, y ahora hemos hecho un símbolo. Por lo que ahora debilita a Dio Ah, cualquier otro lugar queremos usar ese símbolo. Simplemente lo arrastras y lo pones donde queremos ponerlo y puedes verme acercar un
poco . Aquí puedes ver esto en lugar de tener el azul normal cuando algo es un símbolo similar, tiene el contorno verde tan pronto retrocede. Y, uh, imaginemos que teníamos este botón en,
como, 30 lugares diferentes, 30 lugares diferentes o tal vez incluso más, y decidimos que queríamos cambiar la forma en que queríamos. Cambia a la pequeña. Entonces para hacer eso, hago clic en mantener el control para obtener ah, um, forma parte del botón. Ahora digamos que quería hacerlo en este tipo de color verde menta. Entonces voy así y luego digamos que quiero cambiar el texto conceit cambió el fondo de este botón para que podamos cambiar el texto a, digamos uno. Hazlo así. Entonces como puedes ver, um, en este proyecto en particular, estos no van a ser realmente necesarios. No te van a ahorrar mucho tiempo, pero honestamente, probablemente sea muy raro que tengas un proyecto que sea solo una
página de inicio . Entonces recomiendo usar estos a menudo lo que me gusta hacer con estos este tipo de poner las cosas configuradas, ya
sabes, moverse por donde estoy ahora mismo, tal vez un poco más, y luego entrar y configurar estos una vez yo Porque en este punto, voy a tener una idea de cómo lo que voy a usar a lo largo del resto del documento. En realidad no lo configuro de inmediato, porque desde el principio, es probable que cambie las cosas. Entonces no quiero tener que preocuparme por cambiar estos y poner estilos que,ya
sabes,
en ya
sabes, realidad no voy a necesitar. Eso sólo me va a confundir. Entonces espero hasta que esté tengo algo que estoy sintiendo, ya
sabes, decente. Y entonces empiezo a configurar estos. Pero una vez que consigues una vez que te metes un poco en tu proyecto realmente te recomiendo usar estos porque te pueden ahorrar mucho tiempo. Ah, por el camino. Si los configuras temprano.
26. Habilidad XD: la herramienta bolígrafo: Ahora lo que vamos a hacer es repasar la herramienta de bolígrafo. Entonces como puedes ver, con casi doblez llena esta área de nuestros diseños iban a hacer esto un
poco más grande Cuando lo genial de X d es que puedes ir por aquí. Y si usas la estrella como, ah, puedes multiplicarte. Entonces hagamos el doble de este doble de la página web en una doble factura con Vamos a duplicar la altura . Ah, así que voy a seguir, hacer eso y luego voy a hacer ah star por veces para que entre y luego ah, duplica la altura que puedes ver Y tengo este otro aeropuerto aquí, así que voy a arrastrar eso fuera del camino y vamos a querer sólo, ya
sabes, sólo poner rápidamente una plaza sobre esto para que podamos demostrar el pento. Entonces la herramienta de pluma, como dije, ah, es bastante intuitiva a menos que estés utilizadoa ilustradores y herramienta en Es un poco
diferente a eso, pero aún así no demasiado difícil. Entonces si obtienes la herramienta de lápiz, puedes seleccionar desde el panel de herramientas aquí, o simplemente puedes golpear p ah, y luego una vez que la tengas. Si sostienes las bocas y mientras la estás sosteniendo,
si la sacas así, vas a empezar con una curva. Y dondequiera que iba este, um ,
pequeño mango, ese es el año de dirección que va a entrar tu línea, eso va a empezar. Entonces tenemos un señalador por aquí. Se puede ver cuando nosotros cuando suelto el ratón. Ah, las líneas que van por aquí. Pero como es una línea curva, puedo arrastrarla hasta aquí. Eso va a crear una curva. Pero siempre es la curva siempre está empezando en esa dirección. Entonces solo hago clic una vez sin mantener pulsado. Entonces la siguiente línea va a ser recta. Si quiero que la línea esté en, ah solo yendo ángulos de 45 grados alrededor del círculo así, mantengo presionado el turno, y luego así esta línea va a estar en cero grados, y luego vuelvo a hacer clic y tengo una línea recta. Ahora bien, si hago clic y sostén, entonces obtengo otra línea curva. Y como puedes ver,
um, um, este último mango va a ser donde la línea está apuntando así que puedes ir así si haces clic y mantenlo hace una curva, solo tienes que hacer clic una vez hace una línea recta, y puedes, ya sabes, haz lo que quieras. Vete salvaje. Y luego una vez que hayas terminado con tu forma, vuelves al punto de partida y puedes ver que la llena. Y ahora tienes una forma completa. Por lo que edita esto. Puedes usar tu puntera de selección directa. Um, así que si haces doble clic en un punto de anclaje como este, lo va a convertir a Si fuera una curva, lo va a convertir a, ah, recta una esquina en ángulo recto. Si fue ah ah ah. Si no se dio en doble clic en
él, va a hacer de ella una curva. Um, si sostienes, si arrastras estos mangos, puedes ver cómo, um, cambia la curva. Si los acercas, va a ser menos de una curva que traigas. Va a ser como una curva más ancha, más grande a su vez y ver cómo cambia la curva. Um, ahora, si quieres una como puedes ver, está moviendo ambas asas al unísono aquí. Entonces si solo quieres mover una manija. Sostén pulsado, Ault o ,
um, opción en el Mac, y luego puedes arrastrar solo uno. Y ahora verás este separado, también. Entonces para recuperarlos, si querías ser tú y Eunice y otra vez, tienes que ir y hacer doble click y,
um, um, DoubleClick de nuevo para meterte en curva de vuelta. Eso Entonces una vez que tengas tu forma como quisieras, entonces puedes venir a la apariencia y al igual que otras formas las elipsis y los rectángulos que pasamos antes. Puedes darles un relleno y también puedes jugar con la frontera si quieres. Por lo que quieres darle un guión, Dale una pizca de 10. Brecha de 10 Realmente no puedo ver eso. Déjame ir un poco más oscuro aquí y hacer esto un poco más grande. Está bien. Entonces, como pueden ver, en realidad
estaba seleccionando la, uh la forma que usé como fondo. Entonces estaba haciendo lo que estaba pensando que le estaría pasando a esto en este eso. Si querías cambiar esto, entonces puedes entrar aquí hará que este poco más oscuro. Para que lo veas y luego un poco más grueso. Y me gustan estos bordes redondeados y redondeados. Entonces entraremos y le daremos una pizca de tres, y luego automáticamente es un hueco de tres. Pero podemos hacerlo,
Ah, Ah, mayor brecha si queremos y eso lo que realmente se puede ver. Hagámoslo aún un poco más grande. Todos los derechos de Trump. Entonces se puede ver cómo tiene la frontera punteada de vez en cuando. Si quieres entrar ahora mismo, puedes ver que está seleccionando toda la forma para que pueda arrastrarla y manipularla así. Pero si quiero volver atrás y manipular los puntos de anclaje del acto real, solo
hago doble clic y luego estoy de vuelta. Al igual que yo Waas y Aiken hacemos todas las cosas que pasamos antes. Otra cosa rápida para mostrarte es que no tienes que dibujar formas completas con la
herramienta de lápiz . Simplemente puedes dibujar, digamos, solo
quieres dibujar como una línea curva así, y entonces eso es todo lo que quieres. Entonces acabas de escapar. Y luego que tu forma, um, como dije, podemos hacer lo mismo, um, frontera aquí. Entonces digamos que conseguimos ese. Nos gusta mucho la forma en que salió esto. la razón que sea, volvamos a conseguir el Pento. Vamos a hacer otra línea aquí y se puede ver que la fuga terminó. Y luego quiero Digamos que quería que esto fuera igual. Por lo que una manera fácil de hacer eso es seleccionar este control o comando, ver para copiarlo y luego seleccionar este clic derecho y pegar apariencia y luego se puede ver casi coincidir. Entonces eso es una especie de resumen rápido de la herramienta de lápiz en X'd en el siguiente video. Vamos a repasar cómo podemos usarlo para este simulacro de arriba.
27. La herramienta bolígrafo en la acción: Está bien. Entonces lo que vamos a hacer a continuación es ah, vamos a poner en el área la siguiente área de nuestra página donde ordenamos a la gente convencida. Como dije cuando estaba haciendo mi boceto. Las ideas Primeras personas vienen aquí. Si ya saben que quieren hacerlo,
um, um, entonces solo harán clic en este botón y empezarán a usar un formulario de registro. Pero, ya
sabes, mayoría de la gente va a necesitar un poco más convincente de lo que está en esta siguiente área. Vamos a dar una visión rápida de los pasos que tienen que recorrer. Entonces si hacemos clic en esto, se
puede ver esto. Se puede ver esta línea punteada. Esta línea punteada representa lo que se llama por encima del pliegue el contenido, eso es ah, La gente verá cuando vengan por primera vez a la página. Y luego cuando se desplacen hacia abajo, van a ver más. Entonces cuando vengan por primera vez aquí, van a ver justo esta parte. Y luego a medida que se
desplazan hacia abajo, van a ver más. Ah, una cosa que me gustaría hacer mientras estoy trabajando en las cosas es click play de vez en cuando porque no lo configuro automáticamente en el punto de ruptura y luego puedes desplazarte y especie de tener una mejor idea de cómo iban las cosas y cómo se va a ver en ellos. Navega aquí. De acuerdo, así que voy a seguir adelante. Y sólo para que tenga una idea de dónde esta Ah, donde la línea iniciada es una mejor idea. Voy a poner un rectángulo cuadrado, quitar el borde, así que sólo es esperar. Y ahora en esta área, voy a rápidamente,
bueno, bueno, relativamente rápido poner en los pasos que vamos a dio para convencer a la gente. Entonces, como dije, una vez que pase la zona principal me gusta mantener ah, más pequeño azotado. Si lo mantienes muy ancho, va a ser difícil para la gente leer. Y nunca puedes saber realmente qué tan ancho va a ser tu dispositivo, también. Entonces solo empieza a parecer raro, sobre todo a altas resoluciones. Si no pones un máximo con así que vamos a hacer los nuestros 13 100 hay otra forma en que puedes hacer esto y te mostraré más tarde que, um, X 'd incorporado. Pero me gustaría sólo usar un rectángulo. Es rápido y fácil. Entonces hago mi set. Lo que sea que Max pudiera con esto aquí. 1300. Centralo y luego sólo voy a alinear el filo de todo a eso. Entonces estoy haciendo los labios. Es decir, mantenga pulsado el turno para que se quede. Ah, círculo
perfecto. Y ahora me refiero a control de golpe tres. Entonces puedo acercarme y enfocarme en ello por un minuto. Quítate la frontera, dale ir con esto más tarde, rellena el color del deslizador, y luego voy a empezar a escribir aquí. Vamos a poner uno. Este es el primer paso, y luego voy a hacer un área de texto para que mi siguiente sea mi encabezado y me aseguren que todo se quede dentro de mi círculo. Entonces por eso lo hizo el área de texto. Entonces nos va a decir cómo viajas. Ese es el paso uno. Y luego solo ajustaré mi pequeña área de texto para que se ajuste al espacio y en una cabeza o seleccione la herramienta de
selección. Bueno, no bebas esto abajo. Y, uh um, golpear control o comando todo un lugar para seleccionar todo eliminar que tengo algún texto de Marcador que acabo de sacar de internet. Si vas solo generador latino de Google, deberías encontrar mucho. Ups. Parece que perdí ese algún punto. Déjame ir a buscarlo otra vez. Entonces aquí es donde conseguí el mío. Sólo tienes que ir en DCAA Pene, pegarlo y hacer clic en off para que puedas cambiar esto. Hagamos esto más pequeño que el encabezado. Vamos a hacer 18 y luego no quiero eso. Eso es demasiado espacio entre las líneas para mí, hijo. Y baje eso a 21 y no quiero ser audaz así. Entonces si ves el regular, no
sé por qué, pero no fui un gran fan del regular para nuestro Chievo. Entonces voy a cambiar esto por el dedo Merryweather en un Entonces vamos a decir que van a ser tres líneas. Si tienes el texto real, siempre
es mejor usarlo ahora mismo. Mi cliente no me ha dado el texto, así que no tengo el texto que él sólo va a usar, um, texto de
posición, pero siempre mejor si lo tienes para usar el texto rial. Entonces voy a conseguir el alineamiento, cómo lo quiero aquí. Por lo que 30 de arriba. Y luego si mantienes presionada toda opción en un Mac, puedes ver el espacio entre las cosas así que Hay ocho entre eso y 16 entre. Eso es Oh, eso
me gusta bastante bien. Déjame asegurarme de que esto esté centrado. A la espera de que su adobe me diga que está centrado. Ahí vamos. En. Este también está enviando porque se puede ver cómo las tres de esas líneas significa que estas dos están perfectamente alineadas. Entonces si el que manda el otro debe ser dos, y entonces voy a entrar aquí Bueno,
downshift, downshift, selecciónalo todo y míralo. Y mirándolo, creo que en realidad quiero bajarlo solo un poquito aquí. Por lo que un poco más de espacio igual habló de él y luego desplazar el control g para agruparlo. Y para que veas que hice todo esto. Y antes de poner en más círculos en la razón que hice eso es para que no tenga dedo del pie,ya
sabes, ya
sabes, rehacer mi texto y espaciado para que todos puedan mantener pulsada la opción todo rasgado en el Mac y luego arrastrarlo. Y entonces podría simplemente darle,
uh, uh, control de
casa abajo y luego ir a ello, lo que sea que necesite. Y así hay 12 abajo en arrastre iba a hacer tres. Está bien. Entonces creo que sabes qué? En realidad, tal vez deberíamos hacerlo por causa creo que quiero que el último sea una especie de, ya
sabes, boom. Ya lo has logrado. Entonces este último, creo que vamos a hacer un poco más grande. Entonces manteniendo el turno hacia abajo, que se quede un círculo perfecto, Pero voy a hacer lo siguiente. También quiero aguantar, cambiar y todo para que se vaya desde el centro, hacer éste un poco más grande. Entonces voy a hacer este que es verde menta. Por lo que destaca, y luego así lo puedes ver en realidad Entra y cambia el color del texto. Está bien, así que me voy a asegurar que esto esté alineado con eso. Entonces ahora tengo todo en mi ancho máximo, y luego quiero mover estos alrededor, ajustarlos un poco. No quiero estar uniformemente espaciado. Yo quiero ser una especie de, ya
sabes, poco al azar. Casi. Tampoco quiero que se superpongan con este gran círculo, que va a volver más tarde. Está bien, así que ya es suficiente. A lo mejor tocaré eso un poco más después, pero ya es suficiente por ahora. Entonces vamos a agarrar la pluma herramienta P, y luego voy a hacer algunas líneas curvas conectando éstas. Y sólo quiero que las cosas sean un poco, ya
sabes, divertidas y orgánicas en. Simplemente límpiate con ellos Nadie ha hecho. Entonces cuando esté hecho, me había escapado para salir. Entonces llegas al paso uno y luego esta línea te guía paso y quiero que esta línea sea un poco más gruesa Así se destaca un poco más. Es unas teclas de flecha Tal vez en piénsalo aún más grueso, como unas cuatro. Entonces me gusta la gorra redondeada para que la veas redondeada en el extremo Tipo de Tal vez no puedas ver ese zoom en Se puede ver Redondeado en extremo Cuando hice el redondeado no puedo versus el cuadrado como el redondeado voy a darnos un guión para empezar con cinco y ver cómo se ve eso Así que creo que eso se ve bastante sólido pero necesito más de un hueco. Entonces intentemos 15. Vamos Ah, conseguimos el 100% y ver cómo se ve eso. Eso se ve bastante sólido. Está bien, así que ahora déjame golpear p para volver a la herramienta de bolígrafo. Entonces voy a dibujar otra línea conectando con la siguiente. Hmm. Está bien. Déjame volver allá arriba y hacer esa, creo. No me gustó realmente la forma en que iba esa atención. Muy bien, escapar de eso se hizo. Volver al pentáculo. P, es uno. Suba. Um, no
es nada personal y apuntando ahí, pero eso está bien. Y boom. De acuerdo, escapa para salir de eso. Entonces ahora quiero este estilo en todos los demás. Tan rápido Forma de hacer eso. Es solo control. Ver? Después seleccionas este. Control Ault V que va a pegar la apariencia. También puedes hacer clic derecho en apariencia basada. Y también puedes obtener el atajo máximo. Si haces eso. Siemens Cannon Uh, opción de
comando v Esso, luego allá vamos. Tenemos de esas cantidades. Podemos ver todo esto. Entonces tengo una especie de nuestros pasos adicionales que vienen convencieron a la gente para apuntarse a nuestro serio. Tenemos esas dispuestas. Entonces en el siguiente video, voy a crear una forma que va a enlazar estas dos secciones. Entonces no es solo esto. Ah, línea recta
dura que lo termina. Por lo que hay alguna conexión entre esta zona principal y luego la siguiente. Y también probablemente los voy a retocar un poco, pero tenemos suficiente por ahora. Está bien, así que pasemos al siguiente video.
28. Agrega una forma curvada: Es como dije. Ahora vamos a hacer una forma que esperemos que conecten estas dos secciones juntos poco . Entonces, vamos a deshacernos de esto. No necesito esto ahora mismo. Siempre puedo volver a ponerlo después si quiero. Y vamos a deshacernos de esto también, para que pueda ver con qué estoy trabajando. Tengo eso bloqueado. Eso es bueno. Firma un selecto todos estos. Yo quiero mover todo esto hacia arriba. Estoy usando mi tecla de flecha para moverlos un poco arriba y mirando esto en el círculo, realmente creo que hice un círculo un poco demasiado grande, Así que voy a golpear el control de retención comprometido en el Mac. ¿ Por qué? Ir aquí Para que pueda ajustarme. Escucha, quiero decir, mantenga pulsado el turno lo suficientemente y solo haga esto un poco más pequeño, subiendo un poquito también. ¿ Todo bien? Digamos que vamos. Y ahora voy a golpear P para conseguir la herramienta de bolígrafo, y voy a hacer esta forma. Creo que como que quería seguir a esta isla tipo de seguir este círculo de esa manera, cuando bajemos al fondo de esto, no
va a ser No vamos a llegar sólo a un final agudo como ese. Entonces eso es lo que voy a hacer para probar el dedo del pie. Pero el vinculo de estos dos Así sosteniéndolo hacia abajo. Entonces empiezo con la curva y luego la tire de nuevo hacia abajo. Por lo que me quedé con una curva. Yo quiero quedarme todo el ah, todos los puntos ocurrieron. No me gusta eso cuando quiero decir, deshacer eso. Quieres ir un poco más abajo aquí. No lo sigo exactamente. Y quiero estar perfectamente espaciado. Entonces muéstrame. Es decir, retrocede un poco más para que puedas hacerlo así. Ah, ¿
estabas deshaciendo? Si no te gustan las cosas en las que puedes simplemente poner algo áspero y luego volver atrás y jugar con tus puntos de ancla después de tener una idea aproximada de lo que quieres hacer? Está bien. Entonces muévenos aquí y me importa. Quítate un poco de pantalla, tráelo de vuelta. No. Como dije, no
queremos tener una de mis metas es evitar ese final justo. Entonces voy a cubrir todo eso, traerlo aquí y luego fuera de pantalla. O sea, haz otra curva. Para que acabemos de traer esa foto de nuevo. Voy a Lincoln que me refiero a un DoubleClick DoubleClick otra vez. Consigue esa curva de vuelta. Voy a sacar esto de la pantalla un poco. No, voy a quitar la frontera porque no quiero que se importen. Voy a poner un Phil. No, lo está cubriendo porque lo hice más recientemente, así que voy a aguantar. Ah, control o comando en un Mac abierto corchete para mover eso hacia abajo tan abajo en las capas para que pueda ver lo que hice. Entonces, en realidad, eso
me gusta bastante bien. Um, podría
acercarme un poco y echar un vistazo a este doble clic en esto para que pudiera llegar a los puntos de anclaje. En realidad no quiero nada. Eso es una especie de afilado. Entonces voy a tratar de entrar y jugar con estos pequeños para suavizarlos. Pero, uh, básicamente, esto es que esto está bastante hecho. Jugaré con nosotros un poco más. Es necesario ver eso, sin embargo. Entonces ahora por qué no entras y creas lo que vas a hacer en tu siguiente sección después de tu ah sección de aterrizaje de héroe principal. Adelante y crea eso, guárdelo y luego subirlo a tu área de proyecto para que podamos seguir viendo cómo tu iterando tu proyecto
29. Habilidad XD: imágenes de Masking: Muy bien, entonces esta vez vamos a cubrir cómo enmascarar una imagen con forma. Entonces eso sería como cuando quieres hacer una imagen que es un cuadrado al que quieres convertir a un círculo para que solo puedas usar una forma para hacerlo. Entonces golpearé E para la herramienta Elipse y luego voy a mantener pulsado el turno para que se quede un
círculo perfecto y lo arrastre hacia fuera control tres para acercarlo para que puedas ver mejor. Y luego primero te mostraré la forma más fácil de hacer esto. Simplemente entras y agarras tu imagen que quieres usar y luego la arrastras sobre Y cuando la forma se vuelve azul así, suelta tus bocas sobre su it iss adobes lo hecho por ti. Han cambiado el tamaño de la imagen, cómo creen que debería ser y estás todo listo. Si golpeo ser para mi herramienta de selección, entonces puedes ver puedo arrastrar esto y todo permaneciendo conectado A medida que redimensiono la forma, también redimensiona la imagen. Si voy por aquí, puedo quitar la frontera. Si hago doble clic Ah, puedo cambiar el tamaño de la imagen así hacerla más pequeña, más grande Ahora. Algo que no puedo hacer cuando arrastré del archivo y caigo así. Ya verás que estoy haciendo doble clic en esta forma, pero no puedo seleccionarla, así que eso es una limitación. Cuando lo haces de esta manera, no
puedes cambiar de forma independiente el tamaño de la oveja. Ahí para siempre vinculado eso. Ahora voy a seguir adelante y eliminar esto y te voy a mostrar otra manera Eso te da un poco más de derechos de control esta vez pega la P para la herramienta de pluma. Sólo vamos a hacernos de forma abstracta, aleatoria aquí. Está bien, así que ahí está nuestra forma en un grabber imágenes otra vez. Esta vez, sin embargo, no lo voy a arrastrar a la imagen. O sea, arrástrela de la imagen, al
menos la de mi boca. Y esta es una imagen más grande. Mi computadora se siente un poco sobrecargada, pero eventualmente hasta sólo va a cargar allí más grande de lo que necesito, sin embargo, así que voy a ir aquí, entrar 500 por el látigo, conceder que Locke está ahí. Entonces cuando golpeo enter, redimensionar es proporcionalmente. Y ahora tengo quiero una máscara, esta imagen con esta forma. Entonces tengo la imagen seleccionada y mantén pulsado el turno. Seleccione la forma que controla. Turno em. Se me pide otra forma de hacer eso. Y vamos a deshacer hacer lo que acabamos de hacer. Si hace clic derecho, desenmascarar. Entonces ahora la máscara se ha ido. Entonces otra forma de hacerlo y manteniendo pulsada el turno de nuevo para seleccionar tanto la forma en la imagen . A continuación, haga clic derecho en Ah y enmascarar con forma. Ahora ya puedes ver si hago doble clic en esto. El primero que se selecciona es la forma misma. Ahora puedo cambiar la forma, y es completamente independiente de la imagen. Entonces, si vuelvo a hacer clic ahora, tengo acceso a la forma. Por lo que hacerlo de esta manera te da un poco más de flexibilidad que simplemente arrastrar y soltar directamente en la forma.
30. Agrega una imagen circular: Está bien. Entonces les voy a mostrar cómo voy a usar esa técnica de enmascaramiento que cubrimos en ah, en este proyecto. Entonces empezamos a tratar de convencer a los clientes, o mejor dicho, empezamos a tratar de convencer a los clientes de que deberían considerar este servicio . Entonces tenemos nuestros pasos aquí que ojalá ayuden en esas líneas. Y ahora sólo vamos a dar a la gente una idea de quién está detrás del sitio y una especie de tratar de construir confianza. Vamos a hablar más de quién está detrás del sitio dentro de sección. Entonces como este es un cliente hipotético, solo
voy a usar mi propia imagen aquí. Tengo aquí la herramienta Ellipse. Voy a aguantar turno para hacer un círculo perfecto. Voy a mantener el control o comando en un Mac zoom de tres en esa forma para que pueda verlo fácilmente. Y ahora voy a ir a agarrar mi imagen. Entonces sólo la foto que tengo de mí mismo. Y en lugar de dejarlo caer en la forma, voy a dejarlo caer en mi lienzo. Como dije, me voy a dar más control. Tengo mi imagen seleccionada. Mantén pulsado, turno como mi cambio de control de forma. M. Y me lo piden el doble, haga clic, vuelva a
hacer clic para obtener mi imagen. Y esta es una imagen un poco difícil de trabajar cuando intento poner en círculo porque mi cara está tan cerca del borde. Por lo que realmente no tengo ningún espacio con el que trabajar por aquí. Entonces probablemente en la vida real, quiero elegir una imagen diferente. Pero sólo vamos a ir con esto por ahora. Está bien, así que ahí subimos un mástil mi, mi cara voy a alejarme un poco y luego golpear E para agarrar la elipse para otra vez Sostén abajo, turno seco Tienes otro círculo Y este círculo va a ser para el texto sobre mí. Voy a mantener pulsado Control Command en el Mac It Ah, um soporte abierto para empujarlo atrás. Voy a quitar la frontera. Dale un relleno. Iremos con esto como verde por ahora. Sube un poco esto. En realidad no quiero estar totalmente centro en, pero no quiero ser Solo quiero encontrar el lugar adecuado para ello. ¿ Todo bien? Y tomé té para mi herramienta de texto y solo voy a escribir sobre mí. No escribirme. Agarra área aquí, haz un área de texto arrastrando, diciendo que eso es probablemente get jugará sin un poco. Y ya he copiado y pegado algún texto de positor de, ah, herramienta
en línea. Entonces voy a acelerar eso. Por lo que claramente necesito reajustar el tamaño de este texto. Entonces voy a ir por aquí. Ah, realidad
vamos a elegir primero la talla. Hagamos esto. Vamos a ver qué hicimos aquí arriba. A mí me gustaría ser consistente, así que voy a ir a ser conseguir mi herramienta de selección. Entonces vamos a ver. Está bien, entonces es solo control. Copia, control. Ver para copiar. Y luego vamos a hacer la apariencia de pasta para que podamos copiar ese estilo ahí dentro. Muy bien, entonces tenemos un texto de marcapasos aquí. Ahora quiero centrar esto dentro del círculo, así que voy a mover el ratón hasta que me diga que eso está centrado así. Otra forma de centro. Ah, selecciona ambas formas. Y entonces debería centrar con el más grande. Creo que eso ya está centrado. Entonces todo listo ahí. Y creo que eso probablemente sea un poco más de texto del que necesito algunos lo bajen, vamos a hacer como dos párrafos y luego lo bebimos un poco. También creo que este círculo han hecho es demasiado grande dada la cantidad de texto que tengo. Entonces quiero decir, uh, baje eso para seleccionar todo, probándolo un poco. Entonces solo estoy jugando con esto para llegar donde quería estar. Um, Entonces eso es básicamente lo que haces, cómo podrías incorporar ah, enmascarar con forma en tu diseño. Entonces, ¿por qué no piensas si hay alguna manera que quieras incorporar? Te estoy pidiendo con formas en tu diseño, adelante y haz eso, subirlo, y luego obtener comentarios y luego pasar al siguiente video.
31. Habilidad XD: degradados: Está bien, Entonces en este video, vamos a repasar cómo hacer un int Grady. Um, como los de ustedes que han estado viendo se darán cuenta de que jugué bastante con cómo tenía mi sección sobre mí, y lo que quiero hacer es que quiero una especie de enlazar estas dos secciones de alguna manera. Ah, no
estoy seguro de que sea una gran idea, pero ya veremos cómo va. Entonces lo que voy a hacer es golpear p para la herramienta de bolígrafo. Voy a ahogar otra forma. ¿ Te acuerdas? Dibujé la forma arriba en la parte superior. Yo sólo estoy dibujando. Ah, forma orgánica
al azar aquí. Está bien. Probablemente regresaré y refinaré esto más tarde, pero por ahora, creo que eso servirá. Está bien, así que lo digo en serio. En lugar de llenar esto con el color, voy a llenarlo con un int Grady. En primer lugar. Voy a quitar la frontera. Consulta Phil, haz clic en esto, y luego puedes ver en este momento se establece el color sólido. Por lo que está mostrando un blanco sólido. Voy a ir a ingrediente lineal. Y ahora se puede ver que se convierte en un int Grady. Este es el ah color blanco. Aquí se muestra el color blanco. Entonces si arrastro esto más que el color blanco va a empezar por ahí y entonces ¿qué es? Volvamos a eso? Mi arrastre este extremo, el gran color va a ir por ahí, que es lo que quiero, pero quiero cambiar estos colores. Entonces primero haré clic en el blanco. Ya puedes ver ahora está sobre el blanco. Entonces para cambiar ese color, acabo de bajar aquí y seleccionar uno de mis colores de esa zona. Y luego si quiero cambiar ese gris, puedo ir así. Entonces ahora tengo este Grady Int Ah, y eso es todo lo que hay para hacer ingredientes. Es bastante sencillo. Voy a seguir adelante y jugar un poco con nosotros. Pero ah, no
hay nada que más se necesita aprender a. Ah, crea tus propios saludos. Ah, una cosa que mencionaré es que también se puede hacer un ingrediente de radio que será desde el centro, especie de ah, radiante basado en
círculos. Por lo que todo la radio irradia desde el centro. Yo no uso esos a menudo. Normalmente uso el lineal grande y codicioso en ah así que Eso es Grady incidente Nutshell. Adelante y piensa cómo y si quieres, aplica eso a tu diseño. Y si lo haces, adelante y prepáralo y luego sube para que podamos seguir viendo tu progreso.
32. Agrega un formulario de contacto: Muy bien, entonces en este punto, sólo
vamos a terminar el simulacro aquí arriba. Voy a seguir adelante y añadir en un formulario de contacto. Entonces en un comienzo, comprando doble clic en mi lienzo y luego arrastrándolo hacia abajo Así tengo algo más de espacio para trabajar, y luego como que quiero quedarme con Oh, sí. Como puedes ver, cambio la forma de la cama. Yo sólo pensé que eso se veía un poco mejor de lo que tenía. Por lo que jugué un poco con eso. Um, Y mirando esto, creo que podría querer simplemente mover esto hacia arriba sólo un poco. Entonces consigo un poco más de superposición entre estas dos cosas, y como que conecta las dos secciones de una manera,
um, um, así que ahora bajaré aquí y empezaremos en el formulario de contacto, así que mantenga pulsado turno. Ah, empieza con un círculo perfecto. Um, pero quiero hacer algún tipo de forma sólo porque creo que va a encajar mejor. Y entonces también es una especie de más va a ir mejor con estos otros orgánicos en
formas perfectas que he hecho. Entonces voy a golpear V para conseguir la herramienta de selección a la que voy a dar clic en la forma contra eso , consigo los puntos de anclaje, y luego puedo simplemente arrastrar el punto de anclaje donde quiera. Y esta es solo otra forma de hacer tu propia forma. Sólo voy a jugar un poco alrededor de esto, Zach. Algo en otro punto de anclaje ahí. Entonces solo vamos a jugar con esto hasta que tengamos algo que creo que funciona bien para el contacto para Tal vez quiero tener un poco de superposición de nuevo solo para mantener las cosas vinculadas. Y desde que salí de la pantalla por aquí, um, ni uno. A lo mejor quiero salir de la pantalla por aquí, así que solo juego alrededor de la forma hasta que creo que es donde quería estar. Está bien. Creo que eso va a funcionar. Sube aquí y sólo agarra esto. Y mantengo pulsado en arrastrar esto aquí abajo, control cierre corchete para subirlo, y ahora va a hacer doble click para poder cambiar esto a contacto. Entonces como ya hablé antes Ah, gente tiene una oportunidad. Teoh, apúntate aquí. Si presionan el botón go places y entonces ojalá si no hacen eso. Pasan por aquí, leen sobre el proceso de lo que vienen aquí abajo. Y ellos, uh, leen más sobre la persona detrás del proyecto, y luego van a venir aquí, y luego van a hacer realmente el Sinem. Entonces ahora no entres. Voy a crear un rectángulo para el formulario de registro. Y este es un área donde realmente tiene que ser un poco cuidadoso otra vez. Algo así como cuando estás sentado aquí, tus tamaños de fuente. Se me ha alejado a 50. Entonces quiero decir, para mí, esto se ve bien, pero sé solo por experiencia que realmente quería mucho. Ah, mucho más corto. Entonces voy a ir por aquí y pegarle 48 enter. Y si acercas a 100 puedes ver que al 100% 48 funciona bastante bien. Entonces voy a alinear esto con el formulario de contacto y luego quiero alrededor de los extremos aquí para que coincidan con esos botones que tenemos. Entonces solo voy a hacer clic y luego mantener presionada la tecla de flecha de mi teclado hasta que consiga el borde
redondeado. Y siempre es una buena idea poner lo que la forma es cuatro por encima de la forma en sí en
lugar de hacerlo en la forma se puede hacer ambas. Si lo deseas, podrías hacer un ejemplo en el formulario y luego poner para qué sirve arriba. Pero siempre quieres tenerlo ahí porque la gente lo hará, una vez que haga clic en lo que estaba en el ejemplo o lo que fue, cuatro desaparecen. Y ahí podrían olvidar. Um, por lo que siempre quieres poner etiqueta por encima del formulario. Entonces vamos a hacer este correo electrónico. Mi texto es blanco, por
eso no lo puedes ver. Entonces vamos a seguir adelante y cambiarlo a un color que podamos ver cuando vayamos con este
morado oscuro . Y creo que también voy a ir en lugar de usar Merryweather, creo que voy a usar a Ah Chivo aquí. Me voy a poner negro. Eso me gusta. Voy a hacer esta pequeña salida sólo una etiqueta de formulario en. Vamos a bajarlo a 12. Podría ser demasiado pequeño, pero siempre podemos jugar con eso más adelante. Y luego me gusta especie de Aliant donde empieza esa curva. Eso es en lo que estoy en que sí quiero un poco más grande. Creo que 16 ¿Está bien? Sí. Y creo que voy a llenar esto. Rellene este campo de formulario en. Haz esto. Hagámoslo así. Creo que eso será fácil. Entonces podemos hacer letras blancas ahí dentro, y así quieres ponerlo listo. Cómo quieres tu ah, campos dedo del pie Mira antes de irte y ah, haz otro. Entonces, una vez que lo conseguiste dicho, luego selecciona ambos mantenga pulsado y luego duplicar. Y entonces puedes poner en otro campo aquí si quieres. Para que pudiéramos hacer que pudiéramos hacer de este un nombre, y luego el correo electrónico de éste. Ah, y entonces estoy mirando esto, y creo que eso es un poco también me dieron estos dos amplios, Así que quiero seguir en lo mismo con nosotros, como ambos al mismo tiempo bebieron esto en. Y luego voy a traer este botón. Dobie me está contando de esta gran nueva característica. Está bien, así que voy a arrastrar mi botón de símbolo que creó antes, y voy a acostarme con el borde de eso. ¿ Todo bien? Y así ahora tengo un formulario de contacto realmente básico. Obviamente vamos a necesitar jugar un poco más con esto, así que voy a seguir trabajando en esto
33. Crear un menú: Está bien. Entonces, como dije, pasé un poco más de tiempo trabajando en el área de contacto aquí, tener ,
como, radiante a ella. Y luego cambié alrededor de los colores de las formas de entrada y de los botones. Así que hice muchos cambios,
básicamente, básicamente, Y también agregué en un simple pie de página aquí abajo pegándose con el tema del círculo. Uh, y sólo van a haber tres elementos de menú. Entonces ahora lo que vamos a hacer es volver a subir, y conforme vuelva a subir, verás que he hecho algunos otros cambios en el diseño en el camino. Um, sólo una especie de limpiarlo un poco, y podría limpiar un poco más antes de llamarlo hecho. Pero ahora lo que vamos a hacer es hacer el menú, y para hacer eso, nos vamos. Ya tenemos nuestro ícono de hamburguesa por aquí que representa el menú. Pero ahora lo vamos a lograr. ¿ Qué? El menú se verá como lo que la gente haga clic en él. Entonces vamos a agarrar por rectángulo Herramienta en bebió salió de él. Ah. Entonces voy a quitar el borde, soltar sombra sobre y alrededor de las esquinas un poco. Aquí, prueba cuatro. Entonces tú en un poquito más. Podemos ver eso. Cambie al dedo del pie de selección directa y luego haga clic en apagado para que podamos ver Va a soltar sombra, esquinas
ligeramente redondeadas. Está bien. No, me voy. Teoh, agarra la herramienta de texto en. Vamos a hacer nuestro menú. Por lo que ya he olvidado lo que pongo los fondos. Tendremos que revisar de nuevo. Creo que es cantidad y luego herramienta de selección directa Paul arrastre para copiarlo. Contacto sobre cuál es el último otra vez? Volvamos a bajar mucho tiempo. Sí. Está bien. Está bien. Entonces eso lo conseguimos. Y ahora vamos a elegir un vínculo que hemos usado aquí. Entonces probablemente o sea lo que usamos para los botones o algo similar. Entonces quiero decir, selecciona eso, y voy a copiarlo. Entonces voy a seleccionar todos estos click derecho y pegar apariencia. Se pueden ver que se volvieron blancos. Entonces obviamente no se puede ver el blanco en el fondo del menú blanco, Así que vamos a cambiar eso a este morado oscuro. Y dado que hay tan pocos de estos y todo el espacio, quiero decir, probablemente
haremos que esta caja sea un poco más pequeña. ¿ Qué? Todavía vamos a necesitar algo de espacio, así que creo que voy a hacer esto más grande. Probemos 30. Está bien. Bueno, agradable incluso irá 36. Así que asegúrate de conseguir esos todos 36. ¿ Todo bien? Ahí vamos. Y lo siguiente vamos a hacer rebajar estos pedacitos. Estoy viendo que realmente no lo necesitamos tan grande. Entonces también necesitamos una forma de cerrar este menú. Maken X agarró el dedo del pie de línea mantenga pulsado el cambio por lo que hace un ángulo perfecto de 45 grados. Entonces voy a hacer aumentar el tamaño de la misma. Probemos por alrededor de los bordes. Aquí en. Vamos a hacer el color. También son morados. Rex. Herramienta de selección, el Ahí vamos. Y ahora a casa. Abajo, todo de nuevo, copiadora. Entonces lo vamos a girar 45 grados, en realidad girando 90 grados y luego lo vamos a alinear con este otro. No, tengo X para las personas para que puedan cerrar el menú cuando hayan terminado con lo que necesitan . Y pon eso aquí arriba en esta esquina. Yo estoy centrando estos dentro de esto y mantenga pulsado turno para seleccionar todo. Yo me voy por aquí y debería centrar en el objeto más grande. Entonces los que me centré, de seleccionar todo downshift y luego de seleccionar el rectángulo en el fondo realmente va a ser seleccionar todo. Voy a espaciar estos un poco más ya que tenemos tanto espacio aquí y luego
quiero asegurarme de que haya uniformemente espaciados. Voy a seleccionarlos todos por aquí para distribuir el espacio vertical de manera uniforme. Parece que ya hice eso. Entonces estamos todos arreglados. Ah, así que ese es un menú muy sencillo que hicimos ahí, así que probablemente en esto hasta un poco. Pero si quieres, quiero seguir adelante y ponerlo en marcha. Y entonces lo que vamos a hacer es que vamos a usar esto en el próximo video para hacer un poco de
prototipado básico .
34. Habilidad XD: prototipo de menú: hicimos un menú, y en este video le vamos a agregar algo de movimiento para que cuando los usuarios hagan clic en la hamburguesa, este menú entre. Entonces parte de eso es, quiero asegurarme de que esta X sea más o menos donde está el menú de hamburguesas. Entonces haz eso. Voy a dar reducir la opacidad en esto, que pueda ver lo que hay debajo. Y luego voy a mantener el turno hacia abajo para seleccionar ambas líneas en la X. Y mientras lo he hecho, voy a golpear el control G para agruparlas. No quiero seguir haciendo eso. Y luego voy a alinear esto más o menos para que sea más o menos sobre el menú de hamburguesas. Y ahora que lo he hecho, vuelve
a subir esto. Pero yo quiero jugar. Es decir, esto no tiene que presionar. Sólo estaban usando esto para un ejemplo. Pero yo sólo quiero simplemente no puedo evitar mover esto un poco y bajar esto un poco. Muy bien, Así que ahora el dedo del pie prototipo esto. Tenemos que conseguir esto en su propio tablero de arte. Por lo que queremos que el aeropuerto sea del mismo tamaño que este menú. Por lo que es 5 56 por 5 80 clasificación que Zoom hacia fuera aquí agarrber herramienta de tablero de arte tratando de una forma para empezar. Entonces vamos a teclear 5 56 por 5 80 que entre en nuestras palabras, mismo tamaño. Y ahora vamos a seleccionar todo lo que tenemos por aquí. Y sólo vamos a secar esto sobre el tablero de arte en movernos, usando mis teclas de flecha para moverlo de vez en cuando. Si Dobie te va a decir cuando es una línea, déjame acercar para que puedas ver un poco mejor. Aquí se puede ver arriba en la esquina superior. Me está diciendo lo lejos que está del dartboard superior. Por lo que quería ser tenido yo quería estar perfectamente alineado así. Y puedes ver cuando golpee esa alineación perfecta tiene la, um, cruz que entra para indicarte eso, y vamos a hacer un paso más. Esto no es necesario, pero creo que puede ser útil para prototipar solo para que este objetivo sea un poco más fácil para que la
gente golpee, vamos a poner ah forma justo sobre él. Pero vamos a quitar la frontera y quitar las películas por las que se puede ver la X
entrando . Todavía. Está bien, así que ahora todos estamos con el dedo del pie, guapo. Moción a esto. Ah, para hacer eso, necesitamos repasar la pestaña de prototipos, y se puede ver cuando hice clic en prototipo, todo
este menú desapareció. Y además, tenemos muchas menos opciones por aquí. Eso se debe a que esto se centra en la creación de prototipos, por lo que hay mucho que no necesitamos. Simplemente Adobe se ha limitado sabiamente a lo que necesitas. Y lo que queremos que suceda es que queremos que algo suceda cuando la gente haga clic en esto. Entonces vamos a hacer clic en esto y luego decirle a Adobe lo que queremos, um, este click para estar conectado para arrastrarlo a este tablero de arte. Y luego una vez que lo tengamos en el tablero de arte , lo
liberamos, y nos va a dar estas opciones para lo que queremos que suceda. El valor predeterminado es la transición, pero vamos a hacer una superposición aquí, y luego también puedes ver que tenemos algunas opciones para el destino. Nuestro tablero, nuestra palabra uno, y luego la animación se disuelven. Vamos a querer que como que quiera tener este tobogán en, um, un momento difícil recordando, uh, si quería deslizarme a la izquierda o a la derecha, vamos a ir una diapositiva a la derecha y ver cómo va eso. Y luego también puedes establecer la duración Cuánto tiempo tarda esa pequeña animación. Entonces solo para que sea más fácil de ver lo hará, uh, 0.8 segundos. Y ahora vamos a hacer click play para que podamos probar esto y ver cómo funciona. Entonces hacemos clic en eso, y como pueden ver, eso viene por el lado equivocado. No es una línea correctamente s Así que tenemos que volver aquí y jugar con esto un poco más. Entonces, volvamos a hacer clic en esto. Y una cosa que no pude hacer y esto es cuando haces la superposición te da esa
versión verde del arte aburrida y quieres arrastrar eso a su lugar para donde querías
aparecer . Entonces lo arrastramos a su lugar ahí, y ahora se puede ver ahí es donde va a venir cuando la gente haga clic en esto. Y como dije, me di cuenta de que en realidad lo tengo simplemente deslizarse bien. Pero realmente quería deslizarme a la izquierda. Por lo que vas adelante y haces que se deslice a la izquierda. Y luego otra cosa. Lo vamos a hacer mientras estemos aquí es después de que eso venga en lo que va a pasar cuando la gente haga clic en esto. Queríamos volver a este tablero de arte. Por lo que ahora tenemos ambas animaciones configuradas. Uh uh, apertura y el cierre. Está bien. Y así ahora vamos a hacer click play, no veas lo que hemos hecho aquí. Se puede ver que se abrió en el menú porque eso es lo que tenía ah, seleccionado al hacer clic en play. Por lo que en realidad queremos hacer clic en esto. Por lo que se abre, abre nuestra página web, y luego hacemos clic aquí que se desliza, pincha aquí, se desliza. Entonces eso es Ah, pequeña animación
simple. Ah, un poco de animación prototipo. Um Y así en el próximo año, vamos a mostrar cómo puedes compartir eso con tus clientes.
35. Prototipos de compartición de XD: De acuerdo, Así que esperemos después del último video, si todos
ustedes están siguiendo, siguieron adelante e hicieron alguna especie de parte clickable de su diseñador. A lo mejor construyes prototipo eso aún más avanzado en este video. Vamos a repasar cómo compartir tus prototipos. Porque si la gente no tiene X d, que la persona promedio no lo hará, entonces no podrán ver lo que has hecho a menos que crees ah, longitud que ah no sea te permite crear para que puedan acceder e interactuar con prototipo. Y como dije en el otro video mucho tiempo, no necesariamente uso esta característica de prototipo para prototipos. Lo uso para compartir cosas con clientes. Entonces así es como voy a discutir eso,
um, um para este video, así que para compartir. Ah, vamos por aquí al área de compartir así, y vamos a decir prototipo publicado y ya lo he compartido una vez para poder dar clic en actualizar donde puedo crear nuevo enlace. Voy a genial actualización de click, y luego va a tardar un poco en cargarse. Y otra cosa que quiero mencionar mientras estamos esperando este dedo completo. Es actualización es que está en Lee, si tienes prototipos algo pero no todo en ah espacio de trabajo, sólo va a mostrar lo que tienes lo que has conectado. Entonces en este espacio de trabajo, sólo conectaba el menú y este tablero principal de arte en el que hemos estado trabajando. Entonces, ¿y si tuviera control cero? Se puede ver que tengo un montón entero en sus cosas aquí para que pudiera controlar a tres para acercar de
nuevo. Pero verás en un momento que sólo se va a mostrar en el enlace las cosas que están conectadas. Entonces ahora saldremos. Y ya he abierto esto y otro y,
uh, uh, navegando. Esto es sólo cromo. Y acabo de pegar el Lincoln aquí. Uh, a veces tardará un poco en que se cargue el enlace. Entonces eso es algo que a menudo les digo a mis clientes cuando estoy compartiendo con ellos que, ya
sabes, solo sean pacientes. Tenemos mucho. Este es un gran proyecto, y tengo muchas cosas pasando aquí, Así que solo ten paciencia para la carga del dedo del enlace. Entonces puedes ver que solo puedes desplazarte normalmente una vez que tengas el mouse sobre esto al igual que estar en un sitio web. Básicamente, ven aquí y hazlo más grande, y luego puedes hacer clic en escape para salir de esa vista, también tus clientes tienen la opción de hacer comentarios aquí. Esa podría ser una característica útil. Entonces digamos, quería hacer esto. Vamos a fingir en el cliente. Puedo arrastrar un alfiler por aquí, ponerlo en este botón, decir algo como ID un poco más grande. Y entonces ese cometa va a aparecer y luego puedo responderle. Um, está bien, trabajaré en ello. Y también puedes alertar a las personas que mencionan a los usuarios. Yo soy el único con el que se ha compartido esto, Así que soy la única opción. ¿ Hacer eso? Um, eso es sólo otra característica. Y ahora te voy a mostrar el, um, ella tenía un prototipo que va a funcionar, así que si haces click en cualquier parte, puedes ver que está destacando la parte que se ha hecho clicable. Entonces venimos aquí y hacemos clic en esto y viene igual que lo hizo el día siguiente
usando el botón de reproducción. Ah, así que eso es una rápida introducción a cómo compartirías algo que tienes prototipo ya sea
con tu cliente o con los usuarios con los que lo vas a estar probando. Um, entonces en el siguiente video, vamos a hablar de cómo dedo del pie exporta tus tableros de arte como imágenes, causa que cuando lo
hago, normalmente cuando estoy compartiendo con clientes, suelo exportar como imágenes. Y entonces también creo estos enlaces solo para dar opciones a los clientes. Entonces, ¿por qué no todos ustedes siguen adelante y crean enlaces y luego los suben para que podamos ver el trabajo de
prototipado que han hecho en su simulacro?
36. Habilidad XD: exportar: Entonces en el último video, hablamos de cómo el compartir con enlaces, y eso es útil cuando quieres un prototipo. Y honestamente, cuando estoy compartiendo con mis clientes, generalmente
recomiendo que utilicen los enlaces. Creo que les da una mejor idea de cómo se va a ver realmente. Pueden especie de desplazamiento y pueden desplazarse, y se verá como lo hace en un navegador. Pero también suelo compartir imágenes sólo para que tengan esas también. Entonces lo primero que hago cuando estoy en las acciones, hago doble clic aquí y cambio el nombre ya. ¿ Eso cambió este nombre, la página principal, Y luego solo tomas el control E comando de Mac, y puedes seleccionar tu destino. Simplemente pondremos documentos, seleccionaremos carpeta, y también podrás cambiar el formato. Si quieres. Normalmente voy con PNG, y en realidad no voy a exportar esto, porque realmente no tengo ningún cliente, y lo voy a compartir en este momento. Pero si lo fuera, solo
hago clic en exportar, y eso lo exportaría a esta carpeta. Y luego puedes ir y usar en urge necesidad de desde esa carpeta. Ah, entonces eso es básicamente todo para esta página principal. Um, para terminar tu proyecto en recomendar pasar y pasar algún tiempo o encontrar lo que has hecho y luego subir todo lo que has hecho al
área del proyecto de haberes compartido . Y, ya
sabes, realmente
estoy deseando ver lo que se te ocurre en los próximos videos. Simplemente vamos a cubrir algunos consejos que realmente no tenían sentido para este proyecto. Pero eso debería ser útil para ti al final de la línea a medida que continúas. Ah, diseñando sitios web.
37. Habilidad XD: cuadrícula de repetición: Entonces una de las características más geniales que tiene X D es este tipo en sistema de cuadrícula que te permite repetir , um, algo. Y luego puedes hacer cambios dedo del pie todos los elementos de tu grupo a la vez para que te pueda ahorrar
mucho tiempo. Si, ah, ese es el tipo de marca que necesitas hacer. Entonces, como ejemplo, acabo de crear esta tarjeta. A lo mejor no tenía un lugar para esto en mi página principal, pero tal vez tendría un lugar para ello en algún otro lugar de alguna página o algo así. Y digamos que yo quería tener un montón de cartas, dije que sólo una. Entonces lo que hago es ir adelante y configurar la tarjeta. Es todo lo que quería y necesitaba. Y luego una vez que lo tenía configurado, seleccionaría todos los artículos en él. Y luego vengo aquí como repito grilla, y se puede ver que cambió en verde, y luego tú. Si arrastras sobre esto, puedes ver que va a repetir esa forma una y otra vez, y luego puedes ajustar el espacio entre las formas colocando el ratón por aquí, y luego simplemente arrastrando y saliendo, y que también puedes y las formas como esta. Um, así que hay unas cosas que puedes hacer con esto. Perdón grupos. Podrías moverlo como un objeto. Si quieres traer en el centro de la página, entonces también puedes agregarle el texto individualmente Aquí, um, para que puedas seguir adelante y cambiar todas estas como quieras, Pero entonces también puedes cambiarlas juntas. Ciertas cosas cambian individualmente. Ciertas cosas cambiarán juntas para que puedas cambiar el color de esto. Por lo que querías cambiar el color de ese botón. Puedes rápidamente simplemente entrar aquí y hacer clic en ese poco actualizarlos todos de inmediato. Entonces eso es un gran ahorro de tiempo. Y luego también puedes tomar el espaciado como pensar que tal vez esto es un poco demasiado cerca de
la imagen para que pueda usar mi tecla de flecha y bajar eso un poco y puedes ver que se está aplicando a través de todos los artículos en este, uh, grupo. Otra cosa genial que puedes hacer es que puedes tomar un montón de imágenes y soltar el manitol automáticamente. Repite esas imágenes en toda la cuadrícula, así que tienes que ir una a una para cambiar la imagen. Por lo que sólo les mostraré un ejemplo de eso viniendo aquí. Y tengo un montón de imágenes, así que selecciónalas en. No, los
arrastró hasta aquí. Se va a decir copia. Y luego cuando entras aquí, puedes ver que se actualizó para que esas imágenes se airen a lo largo de estas tarjetas que hice. Entonces esa es la característica de repetición de grado para el para ciertos diseños y maquetas. Va a ser un gran y útil ahorro de tiempo recientemente en un proyecto donde estaba mostrando un montón de caras ah. Y uso esta característica y me ahorré una tonelada de tiempo. Um, así que te recomiendo que lo supieras. Adelante y prueba esto y familiarízalo para que sepas usarlo. Uh, cuando necesitas a Teoh
38. Habilidad XD: pegar en el lugar: De acuerdo, Entonces otra cosa genial que X'd ha incorporado es esta pasta automática en su lugar. Entonces, por ejemplo, digamos que tenemos esto va a ser nuestro encabezado que círculos y menú y, um, logo. Por lo que estoy sosteniendo turno hacia abajo para seleccionarlos a todos. Y golpeo el control c Demasiado engreído. Y por supuesto, vamos a querer que el encabezado sea el mismo a través de todo nuestro un simulacro arriba. Entonces digamos que venimos aquí. Todo el mundo tenía eso aquí seleccionar tablero de arte y luego pegarlo en, y va a pegarlo exactamente en la misma posición
que, Ah, estaba en los originales. Esa podría ser característica muy útil. Por lo general lo que hago con el encabezado es, um ah, agruparlo y luego lo haré un símbolo. Y entonces es fácil en lugar de arrastrarlo desde el panel de símbolos. Lo que suelo hacer es como simplemente copiarlo de un pabellón Arc y luego ir a otro reporte y luego pegarlo. Por supuesto, la única excepción a este trabajo es si te aburres,
son de diferentes tamaños. No va a poder pegar y exactamente el mismo lugar en los tableros de arte. Entonces no es inteligente en este punto, pero aún así es una característica realmente útil, otro buen ahorrador de tiempo que me gusta.
39. Habilidad XD: prototipos II: Está bien. Entonces aunque esto sea, esto no es realmente un video sobre prototipado. Solo vamos a cubrir un poco más,
um, um, en prototipos sólo porque esa es una característica tan importante de X D. Así que solo voy a repasar cómo conectarías tableros de arte si estuvieras diseñando múltiples páginas en una página web . Entonces digamos que tenemos Esta es nuestra página principal, claro. Y luego tenemos una sub página eso vas a lugares y luego haces clic en este botón y te va a llevar a algunas opciones de diferentes viajes. Ya puedes seguir. Entonces para hacer eso, hacemos clic en el botón y luego vamos a arrastrar este aire hacia el aeropuerto, queremos conectado a ti suelta, y luego puedes establecer las diferentes transiciones. Entonces vamos a ir con la transición regular y la animación. Nadie piensa que eso es lo más natural de navegar entre páginas de Quinn. Y luego vamos a hacer que el logo vuelva a la página principal. Siempre me gusta tener una manera de volver a los prototipos, así que solo te mostraré cómo se ve eso. Por lo que vienes oyendo click go places y va a tirar hacia arriba esa pantalla que alguna página y luego haces clic atrás. Es hora de volver a la página principal. Otra característica interesante que Adobe X'd ha incorporado es la posición fija en posicionamiento al desplazarse. Entonces esa sería, por ejemplo, digamos la que tenía un poco de opciones siempre chatea ya que el usuario se desplazaba por nuestro sitio. Entonces lo hice rápidamente, y luego lo que haces para que sea un pergamino, tendrá una posición fija y se quedará. Um, quédate en el puerto de vista. A medida que te
desplazas, solo seleccionas todo. Hice esto en grupo y luego hi comprobó ficc posición fija al desplazarse. Y luego, si haces clic en play, puedes ver cómo se verá eso en el prototipo. Apenas días en lugares se desplaza hacia abajo por la página. Esa no es característica genial. Eso es sólo Ah, breve intro. Como dije, este video syriza no está realmente enfocado en prototipar, pero quería darte solo un poco más para que, uh , ya
sabes, tengas algo que seguir y puedas empezar a construir prototipos
40. Conclusión: De acuerdo, así que ese es el final de este curso. Espero que todos hayan disfrutado. Espero que todos hayan aprendido algo de ello. Uh, me emociona ver tus proyectos. No puedo esperar a ver que los subas. Por lo que gracias por su tiempo. Y espero con ansias ver lo que has creado.