Clase magistral de diseño digital para diseñadores gráficos | Lindsay Marsh | Skillshare
Buscar

Playback Speed


1.0x


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

Clase magistral de diseño digital para diseñadores gráficos

teacher avatar Lindsay Marsh, Over 500,000 Design Students & Counting!

Ve esta clase y miles más

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

Ve esta clase y miles más

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

Lecciones en esta clase

    • 1.

      Course Preview - NEW

      4:55

    • 2.

      The Course Guide IMPORTANT!!!!

      3:43

    • 3.

      Introduction to Design for Digital

      6:18

    • 4.

      Design Theory for Social Media

      5:39

    • 5.

      Design Theory for the Web

      11:47

    • 6.

      Design for Accessibility

      2:46

    • 7.

      Effective Digital Layout Theory

      7:13

    • 8.

      YouTube Thumbnail Project

      10:32

    • 9.

      YouTube Thumbnail Project - 2

      10:51

    • 10.

      YouTube Thumbnail Project - 3

      10:12

    • 11.

      YouTube Thumbnail Project - Double Exposure

      14:29

    • 12.

      Social Media Campaign Project

      10:58

    • 13.

      Social Media Campaign Project - 2

      8:09

    • 14.

      Social Media Campaign Project - 3

      8:25

    • 15.

      Social Media Campaign Project - 4

      10:10

    • 16.

      Social Media Campaign Project - Instagram

      9:09

    • 17.

      Social Media Campaign Project - Instagram 2

      7:07

    • 18.

      Social Media Campaign Project - Display Ads

      11:46

    • 19.

      Tips for Growing Your Following on Instagram

      20:34

    • 20.

      STUDENT DESIGN CHALLENGE

      0:52

    • 21.

      Animated Gifs in Photoshop

      12:57

    • 22.

      Animated Gifs in Photoshop - Photos

      8:29

    • 23.

      Animated Gifs in Photoshop - Exporting GIFS

      7:02

    • 24.

      BONUS - Making GIFS from Videos

      7:10

    • 25.

      E-Book Cover Project

      10:06

    • 26.

      E-Book Cover Project - Shadows

      11:06

    • 27.

      Hand and Procreate Lettering

      8:37

    • 28.

      E-Book Cover Project - Exporting

      5:11

    • 29.

      Creating Hand Drawn Digital Assets in Procreate

      9:47

    • 30.

      Creating Hand Drawn Digital Assets in Procreate 2

      13:15

    • 31.

      Using Our Hand Drawn Assets for A Social Media Project

      11:58

    • 32.

      Using Our Hand Drawn Assets for A Social Media Project - 2

      10:22

    • 33.

      Digitizing Sketches - Setup

      7:06

    • 34.

      Digitizing Sketches - Pen Tool Tracing

      7:12

    • 35.

      Digitizing Sketches - Coloring

      10:49

    • 36.

      BONUS - Puppet Warp Tool

      1:49

    • 37.

      Icon Set Design Project - Grids and Setup

      6:49

    • 38.

      Icon Set Design Project - Getting Started

      9:12

    • 39.

      Icon Set Design Project - 3

      8:37

    • 40.

      Icon Set Design Project - 4

      13:59

    • 41.

      Icon Set Design Project - 5

      8:30

    • 42.

      Icon Set Design Project - 6

      6:59

    • 43.

      Icon Set Design Project - Adding Color

      5:16

    • 44.

      BONUS - User Testing with a 5 year old!

      4:51

    • 45.

      App Store Icon - Getting Started

      10:17

    • 46.

      App Store Icon - Gold Bar Effects

      6:57

    • 47.

      App Store Icon - Gold Dials

      9:22

    • 48.

      App Store Icon - Exporting

      4:03

    • 49.

      Website Landing Page in Adobe Xd - Getting Started

      8:10

    • 50.

      Website Landing Page in Adobe Xd - Illustrations

      9:34

    • 51.

      Adobe Xd - Crash Course

      15:58

    • 52.

      Website Landing Page in Adobe Xd - Getting Started

      7:51

    • 53.

      Website Landing Page in Adobe Xd - Photos

      8:09

    • 54.

      Website Landing Page in Adobe Xd - Landing Page Details

      11:21

    • 55.

      Website Landing Page in Adobe Xd - Pop up

      10:15

    • 56.

      Website Landing Page in Adobe Xd - Prototype mode

      8:44

    • 57.

      BONUS: Global Styles

      3:23

    • 58.

      Exporting Assets from Adobe Xd

      5:55

    • 59.

      Introduction To Building A Wordpress Website

      6:32

    • 60.

      Wordpress Crash Lesson

      7:12

    • 61.

      Getting Started with Elementor Plug-in

      12:50

    • 62.

      Wordpress Website - Header Video

      12:07

    • 63.

      Wordpress Website - Creating other sections

      9:51

    • 64.

      Wordpress Website - Creating Our Instagram Feature

      9:55

    • 65.

      Wordpress Website - 3 Column Layout

      11:57

    • 66.

      Wordpress Website - Responsive Design

      5:31

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.

12,795

Students

51

Projects

Acerca de esta clase

El futuro del diseño es digital.

Este curso fue diseñado para que los diseñadores gráficos estén al día en los últimos y mejores proyectos digitalmente para que puedan expandir su conjunto de habilidades y ofrecer más servicios. Este curso es un curso masivo que cubre tantos proyectos de diseño digital de redes sociales, diseño de iconos, diseño web y más.

DISEÑO DE REDES SOCIALES (Youtube, Facebook e Instagram) SKETCHES
ANIMADOS DE GIFSDIGITIZING

DE ACTIVOS DIGITALES

CONJUNTO de
ICONOS DE APP DESIGNAPPLE ICONO DE ICON DESIGNAPPLE COBERTURA DE ICON DESIGNE BOOK

COVERS


DISEÑO WEB UTILIZANDO DISEÑO DE PÁGINAS WORDPRESSLANDING UTILIZANDO ADOBE XD

Primero cubrimos la teoría de Diseño digital y hablamos de cómo crear publicaciones de redes sociales convincentes, diseños de web y más.

A continuación, conquistamos varios proyectos de diseño digital populares, incluyendo la creación de varias miniaturas de YouTube que hacen clic a los usuarios. Incluso creamos una campaña completa de redes sociales y hablamos de cómo diseñar para facebook, instagram. Incluso hablamos de crear anuncios de display para sitios web para que puedas sentirte cómodo expandiendo tu conjunto de habilidades a todos los tipos de creación de anuncios digitales.

¿Necesitas saber cómo crear gifs animados con Photoshops en línea de tiempo? Crearemos un anuncio de visualización animado a partir de nuestra campaña anterior y agregaremos movimiento y animación.

También aprenderemos cómo crear GIFS a partir de clips de video importados. ¿Querías saber cómo crear una portada de libros electrónicos atractiva? We eso y aprenderemos cómo diseñar para cubiertas de libros electrónicos. Hablamos de tamaño, exportación y cómo crear un diseño que capte la atención de los espectadores. Revisaremos cómo tomar el tipo escrito a mano y lo introduciremos en photoshop para usarlo en nuestro libro electrónico y también aprenderemos cómo trabajar con otras aplicaciones de sketching para traer activos escritos a mano. También creamos nuestro propio mock-up para mostrar nuestro diseño final.

Un proyecto recién agregado se centra en más detalle sobre cómo crear activos dibujados a mano en aplicaciones de boceteo o procreación, y cómo llevarlos a Photoshop para crear campañas modernas y dinámicas que tengan estilo y un toque único.

¿Te gusta bocetar o ilustrar? Incluso creé un proyecto paso a paso en el que tomamos un boceto de lápiz y lo digitize con Adobe Illustrators Pen Tool. Saber cómo digitalizar bocetos es una parte importante de la expansión de tu conjunto de habilidades a la arena digital.

El diseño de icono está en el centro de cualquier proyecto de diseño digital. Los iconos pueden usarse en sitios web, aplicaciones móviles, aplicaciones y más. Usando una plantilla proporcionada crearemos un conjunto de iconos cohesivo completo. Aprenderemos a usar rejillas para crear un conjunto temático e incluso aprenderemos cómo agregar color y cómo exportar nuestros iconos en todos los tamaños adecuados para usarlos en todas partes.

Después de crear un conjunto de iconos básico e simple, vamos más profundamente para crear un icono de App de Apple Store muy detallado desde cero. Aprendemos muchas herramientas, como usar gradientes para crear un efecto dimensional, así como la herramienta de patrón y muchas más.

Aprenderemos a exportar estos archivos también para usarlos en la tienda de manzanas, así como a presentar nuestro icono de una manera profesional. Es difícil enseñar diseño digital para diseñadores gráficos sin incluir algunas secciones que se centran en el diseño web.

Aprenderemos qué papel es nuestro papel como diseñadores gráficos en este espacio, así como cómo preparar y exportar archivos para proyectos de diseño web. Aprenderemos desde cero Adobe Xd en un curso de caída rápido. Aprenderemos muchos aspectos del diseño y diseño web sólidos al crear una página de destino juntos, paso a paso. Incluso aprenderemos cómo vincular nuestras diversas páginas para crear un prototipo de trabajo y aprenderemos maneras de exportar nuestros archivos al desarrollador web.

Finalmente, conquistaremos un diseño básico de página web de primera línea para una empresa de viajes con Wordpress. Aprenderemos lo básico de Wordpress y aprenderemos el plug-in muy popular de construcción de páginas para Wordpress llamado Elementor para construir nuestra página web con fondos de vídeo, imágenes en paralaje, iconos, texto animado de columnas y más. Usamos solo la versión gratuita de Elementor, por lo que no las compras son bestiales para trabajar en este curso

Por último, en esta clase hay toneladas de recursos descargables incluyendo plantillas pre-hechas para la mayoría de los proyectos.

Esto incluye plantillas de libros electrónicos de Photoshop, YouTube y redes sociales y un conjunto de iconos y una plantilla de icono de tienda de aplicaciones en Adobe Illustrator. Este curso no es para aquellos estudiantes que nunca han estado en Adobe Photoshop e Illustrator antes, pero esta clase es lo suficientemente general para la mayoría de diseñadores gráficos principiantes que estén interesados en agregar a su conjunto de habilidades.

Para aquellos que nunca han abierto el software Adobe antes de sugerir que tome la clase magistral de diseño gráfico para que te apliquen las herramientas básicas.

Este curso asume que tienes conocimientos de trabajo básicos de Adobe Photoshop e ilustrador y herramientas como Wordpress, Adobe Xd, Editor de páginas de Elementor y más se enseñan desde cero, así que no es necesaria ninguna experiencia previa. ¿Estás listo para subir tu juego de diseño y agrega un nuevo conjunto de habilidades a tus ofertas? ¿Estás listo para explorar este lado esencial del diseño? ¡Nos vemos en la primera lección!

Meet Your Teacher

Teacher Profile Image

Lindsay Marsh

Over 500,000 Design Students & Counting!

Teacher

I have had many self-made titles over the years: Brand Manager, Digital Architect, Interactive Designer, Graphic Designer, Web Developer and Social Media Expert, to name a few. My name is Lindsay Marsh and I have been creating brand experiences for my clients for over 12 years. I have worked on a wide variety of projects both digital and print. During those 12 years, I have been a full-time freelancer who made many mistakes along the way, but also realized that there is nothing in the world like being your own boss.

I have had the wonderful opportunity to be able to take classes at some of the top design schools in the world, Parsons at The New School, The Pratt Institute and NYU. I am currently transitioning to coaching and teaching.

See full profile

Level: All Levels

Valoración de la clase

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

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

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

Transcripciones

1. Vista previa del curso: NUEVO: el futuro del diseño es digital. Este curso ''ll fue diseñado para que los diseñadores gráficos estén al tanto de los últimos y más grandes proyectos de enfoque digital para que puedan ampliar su conjunto de habilidades y ofrecer más servicios. Este curso es masivo cubriendo tantos proyectos de diseño digital desde redes sociales, puedo diseñar diseño Web y más. En primer lugar, cubrimos la teoría del diseño digital, aprendiendo los diferentes aspectos del diseño para lo digital como crear poderosas campañas de redes sociales , diseños de sitios web, maquetación para digital e incluso hablar sobre la accesibilidad en el diseño digital. A continuación, conquistamos varios proyectos populares de diseño digital, entre ellos la creación de varias miniaturas de YouTube que impulsan a los usuarios a hacer clic. Incluso creamos toda una campaña en redes sociales y hablamos de cómo diseñar para Facebook instagram. Incluso hablamos de crear anuncios de display para sitios web para que te sientas cómodo expandiendo tu conjunto de habilidades a todo tipo de creación de anuncios digitales. ¿ Siempre has querido saber cómo crear una portada de libro E convincente? Hará justamente eso y aprenderá a diseñar portadas de un libro. Hablamos de dimensionar, exportar y cómo crear un diseño que agarra a los espectadores. Se irá a la atención sobre cómo tomar tipografía escrita a mano y llevar eso a Photoshopped para usarlo en nuestra portada de libro e y también aprender a trabajar con otros APS de bocetos como Procreate para traer activos escritos a mano vida del dedo del pie. También creamos nuestro propio simulacro hasta para mostrar nuestro diseño final. ¿ Te gusta bosquejar o ilustrar? Incluso creé un proyecto paso a paso donde tomamos un boceto a lápiz y lo digitalizamos usando herramienta de lápiz de Adobe Illustrator. Saber digitalizar bocetos es una gran parte de expandir tu habilidad. Ambientado en el ámbito digital, diseño de Icahn está en el centro de cualquier proyecto de diseño digital. Los iconos se pueden utilizar en sitios web, APS móviles, aplicaciones y más. Y usaremos una útil plantilla proporcionada a medida que creamos un concepto de alto cohesivo completo. O aprende a usar cuadrículas para crear un conjunto temático e incluso aprende a agregar color y a exportar por todos los iconos y los tamaños adecuados para usarlos en todas partes. Después de crear un ícono básico simple, set irá aún más profundo para crear un ícono de la aplicación de la tienda Apple muy detallado desde cero. Wilder. Muchas herramientas como cómo usar el resplandor para crear un efecto dimensional así como las herramientas de patrón, y muchas más aprenderán a exportar estos archivos también para usarlos en la tienda Apple, así como a presentar nuestro icono en un manera profesional. Es difícil enseñar diseño digital para diseñadores gráficos sin incluir algunas secciones que se centran en el diseño Web aprenderán cuál es nuestro papel los diseñadores gráficos de Zara en el espacio, así como cómo preparar un archivo de exportación para los proyectos de diseño Web que vamos a aprender desde cero. Adobe X T y un curso rápido rápido aprenderán muchos aspectos de diseño y diseño Web fuertes al crear juntos una página de destino. Paso a paso. Incluso aprenderemos tenía un enlace o varias páginas juntas para crear un prototipo de trabajo y aprender algunas formas de cómo exportar nuestros archivos para un desarrollador Web. Por último, conquistaremos un sitio web básico de primera página diseñado para una empresa de viajes. Usando WordPress aprenderá los conceptos básicos de WordPress y aprenderá el muy popular plug in de construcción de páginas para WordPress llamado Element, o para construir nuestra página Web, música, fondos de video, paralaje imágenes, iconos, columnas, texto animado y más. Por último, hay toneladas de recurso descargable está en esta clase, incluyendo plantillas pre hechas para la mayoría de los proyectos. Esto incluye Photoshopped, e book, YouTube, YouTube, plantillas de redes sociales y un conjunto de iconos, un icono de la tienda APP, plantilla e ilustrador de adobe. Este curso no es para estudiantes que nunca han estado en Adobe Photo Shopper ilustrator , pero esta clase es lo suficientemente general y básica para la mayoría de los diseñadores gráficos de nivel principiante que estén interesados en agregar esto a su habilidad ambientado para aquellos que nunca antes han abierto software de Adobe, sugiero tomar mi otra clase de diseño básico llamada Graphic Design Master Class, para conseguir una ventaja en esas herramientas muy, muy básicas. Este curso asume que tienes conocimientos de trabajo muy básicos de Adobe Photo Shop e ilustrador y herramientas como WordPress, Adobe X'd, la página elemental Builder y Mawr se enseñan desde cero, por lo que ninguna experiencia previa es necesarios para esos. Entonces, ¿estás listo? Sube tu juego de diseño y añade un conjunto de habilidades completamente nuevo a tus ofertas. ¿ Estás listo para explorar esto? Un sitio central de diseño. Te veré en la primera lección 2. El guía de la curso es importante!!!: bienvenidos al curso. Me alegra tanto que decidieras unirte a mí para este maravilloso viaje de diseño digital conmigo. Yo quería repasar algunas cosas esenciales antes de empezar el curso. En primer lugar, recurso descargable es que notarás un archivo ZIP adjunto a esta lección. Esto contiene una gran cantidad de los archivos de plantilla que usarán en proyectos, así como varias imágenes, videos, archivos locales y otros activos que serán útiles dedo del pie tener al crear tu propia versión de cada proyecto en el curso. Y hablando de proyectos estudiantiles, existe un archivo de guía de proyectos estudiantiles que te dará más detalles sobre los proyectos a los que se les encomendará mientras trabajó a través de las lecciones. También hay un documento de palabras descargable que contiene todos los enlaces a diversos recursos externos como fotos, enlaces útiles y algunos de los programas que utilizaron a lo largo del curso. Y recuerda, este curso sí requiere algunos conocimientos de trabajo muy básicos de la tienda de fotos, y el ilustrador será de ayuda para comenzar este curso con algunos conocimientos básicos de herramientas. Ya, no estaré enseñando Adobe Photo Shop e Illustrator desde cero total, aunque la mayoría de las herramientas que introduzco. Iré de cero. Yo quiero que se sienta cómodo con el sistema de capas, el diseño básico de los programas y cómo encontrar las herramientas básicas. Un ilustrador. Quiero que hayas usado la herramienta pin algunas veces antes de iniciar este curso. No es necesario tener ninguna experiencia previa en WordPress, el constructor de páginas elemental o Adobe X'd, ya que esos programas se enseñarán desde el principio. Si sí te encuentras necesitando alguna capacitación adicional de fotoshop e ilustrador desde el principio y necesitas esa instrucción muy básica, ofrezco un curso de diseño gráfico para principiantes llamado la Masterclass de Diseño Gráfico que se te pondrás al día a la velocidad. Tomar ese curso no es necesario para tomar este siempre y cuando tengas algunos de esos conocimientos muy básicos de Adobe Photo Shop en Illustrator. Quiero que tomes este curso a tu propio ritmo y siéntete libre de trabajar a mi lado, con cada proyecto recreando el proyecto paso a paso, o, si te gusta ver las lecciones e ir y probar tu propio proyecto. Eso también es bienvenido a cada proyecto tiene archivos útiles para que empieces a crear tus propios proyectos para usarlos en un portafolio o para mostrar tus habilidades. Tengo un grupo exclusivo de Facebook estudiantil para aquellos que quieran publicar proyectos e involucrarse con otros en un entorno comunitario amistoso y servicial. Simplemente escribe en aprender diseño, Go Freelance y la barra de búsqueda de Facebook para localizar el grupo y asegurarse de responder a las preguntas que se le hagan. Además de los proyectos estudiantiles, también sostengo mensualmente retos de diseño estudiantil también. Si no estás en Facebook, también pubo estos retos mensuales de diseño en mi canal de YouTube en youtube dot com slash Lindsay Marsh. También puedes publicar tu trabajo en la Q y en una sección de este curso. Espero ver lo que ustedes crean a medida que se trabaja a través de este curso. Este es el más intenso de todos mis cursos, simplemente porque la gran variedad de tipos de proyectos que trabajamos en estos proyectos. Llévalos de uno a la vez y piensa en este curso como un maratón y no un sprint. Este es un gran dedo de introducción. Todos estos diferentes proyectos de diseño digital y cursos más intermedios y avanzados sobre los temas del amor diseñados, por ejemplo, estarán próximamente. Pero este curso al menos te dará el primer paso en el proceso para que empieces. Me encantan las críticas. Entonces cuando tienes una oportunidad mientras trabajas por los poros para dejar una crítica, leo a todos y cada uno realmente valoro lo que ustedes chicos y espero tenerlos como estudiante . Entonces sigamos adelante y empecemos. Te veré en el primer proyecto. 3. Introducción al diseño para digital: diseño digital se refiere a cualquier diseño que haya elaborado para el espacio digital, incluyendo dispositivos móviles, tabletas, computadoras de escritorio, pantallas de proyector, grandes carteleras digitales y más. Los diseñadores gráficos se han centrado en su mayoría en proyectos de diseño de impresión como tarjetas de visita, pancartas estacionarias de zoológico, camisetas, sombreros, diseño de paquetes en el pasado. Pero a medida que avanza el tiempo, sólo habrá B'more y más demanda de proyectos basados en digitales. Depende de ti como diseñador estar bien versado en todos los aspectos del diseño digital, que puedas sentirte cómodo diseñando para pantallas súper pequeñas y pantallas de proyección súper grandes , también. Todos los proyectos de diseño digital se dimensionan utilizando píxeles, píxeles o cuadrados de luz que pueden ser blancos, rojos, verdes, azules o negros. Todas las pantallas digitales se crean utilizando un área determinada de píxeles. Tus imágenes de TV de pantalla panorámica de 10 80 p Air creado usando una combinación de 1920 píxeles y con por 10 80 píxeles y bombo, dando a esa pantalla un total de 2,073,600 píxeles. Eso es un montón de píxeles que o bien sabían que simplemente se encendieron para crear esa imagen de alta y nítida resolución. Cuatro granos de caja usando aún más increíble cantidad de píxeles puntera iluminan la pantalla con 2160 píxeles de altura y 38 40 píxeles. Y látigo. Creo que el aspecto más desafiante de trabajar con proyectos de diseño digital como diseñador es la amplia gama de pantallas con las que necesitamos estar listos para trabajar. En ocasiones podrían ser más pequeños ya que entra una pantalla de ocho iPhone y solo 750 píxeles ancho por 1334 píxeles de altura. Aún más pequeño es un anuncio de display móvil que llega en tan solo 300 por 50 píxeles. Creo que la clave para ser un gran diseñador digital es entender cómo usar mejor los tamaños pequeños a tu favor. Por ejemplo, una simple campaña en redes sociales. Digamos que tenemos varios tamaños con los que necesitamos trabajar, pero de alguna manera tenemos que comunicar alguna información básica requerida por el cliente. A medida que nuestros tamaños se hacen cada vez más pequeños, hay que hacer ciertas concesiones, y depende de usted resolver esto y comunicarse con el cliente. Esas concesiones, por ejemplo, en nuestra campaña en redes sociales, empezamos con una gran publicación en Facebook, y luego necesitamos crear anuncios de display estáticos o hay pequeños anuncios que veas en sitios web en la parte superior y lateral de un bloque de contenido o blawg. Algunos de esos anuncios de display pueden ser muy pequeños. Más pequeños aún, son estos anuncios de display para móviles. Tenemos que convencer de alguna manera nuestro concepto principal y tema en áreas más pequeñas, pero aún así retener son consistentes branding nuestro mensaje y nuestro concepto principal de la campaña. Y lo hacemos centrándonos en lo que es más importante en este caso. El llamado acción es la parte más vital de un anuncio, y sin motivo para hacer clic hasta la página de destino, tu sitio web no hay valor que esté creando el anuncio. Es solo estático, y esto son solo redes sociales. Hay tantas categorías y diseño digital que dependen de un diseñador gráfico para desarrollar los gráficos. Para hay también el diseño para móvil. Esto podría ser versiones móviles, APS o incluso móviles de sitios web. ¿ Qué colores usar, cómo usar el contraste, qué pensamientos uso? Todas estas decisiones juegan grandes papeles en la efectividad de una aplicación móvil o sitio web. También hay formato más grande. Gráficos digitales como los que ves en tu estadio local. Su power point se desliza para grandes conferencias que necesitan hacerse que coincidan con el branding de la conferencia. Incluso hay carteleras digitales de gran formato, que se están volviendo cada vez más favorecidas sobre las carteleras impresas de estilo antiguo. Debido a los costos reducidos de ejecutar una cartelera digital, también es necesario crear iconos como el que ves para los iconos de APP en tu teléfono. Existe un método especial para crear aquellos que usan una cuadrícula especial creada por Apple para ayudar a encontrar la colocación más efectiva de los elementos. Ciertos iconos se pueden ver mejor que otros y un mar de diferentes iconos de aplicaciones. En ocasiones el uso del color como un rojo, puede ayudar a que uno realmente destaque en esa C o una forma simple o una letra. También, hay iconos que deben crearse para APS, sitios web y aplicaciones. Hay un arte para crear iconos que comuniquen acciones complejas. Usar las formas más simplificadas es posible. Los iconos solo pueden tener 50 por 50 píxeles y tamaño de cualquier momento, lo que poder simplificar un concepto complejo es algo aprendido y practicado Los iconos que se utilizarán como conjunto conjunto necesitan tener un aspecto y una sensación consistentes. Por ejemplo, estos tienen un tamaño de trazo similar en todo el conjunto, y no se detiene ahí. También hay miniaturas basadas en video que necesitan crearse para YouTube y otras plataformas . Estos necesitan convertir y ser efectivos en el dibujo del usuario para hacer clic a través del video. forma en que utilices fotos, colores y tipografía contribuirá todo a la efectividad del video y haga clic a través de las tasas. Por ejemplo, las miniaturas de YouTube que airean de naturaleza simple y tienen un punto focal principal tienden a hacerlo mejor que las que tienen toneladas de texto y fotos. Además, esas miniaturas con rostros de personas tienden a convertirse mejor con miniaturas con solo texto . Esto se debe a que nosotros, como humanos tendemos a conectarnos con los rostros humanos y la psicología humana, podemos jugar un papel importante en el diseño digital. También hay portadas de libros e, y tienden a impulsar las ventas en función de la efectividad del diseño de la portada. En ocasiones la portada de un libro es lo único que el espectador ve al clasificar a través de cientos de posibles selecciones de libros y poder crear una portada de libro digital que convertirá y atraerá y venderá. El libro puede marcar la diferencia entre buenas ventas y grandes ventas. Como puedes ver, los diseñadores tienen enormes papeles que desempeñar en un mundo adicional, y es nuestro trabajo asegurarnos de que estamos preparados para crear imágenes altamente efectivas rápidamente que puedan impulsar las ventas para nosotros mismos, nuestros clientes y los negocios para los que trabajamos. 4. Teoría del diseño para las redes sociales: ¿ qué pasa en diseñar una imagen para su uso en redes sociales? ¿ Cuáles son las cosas que se sabe que son efectivas y dibujando esas bolas altas a nuestro contenido ? Hay algunas reglas y consejos básicos que pueden ayudarte a ser más efectivo. Diseñador de contenido de redes sociales En primer lugar, entiende a tu público objetivo. ¿ Con quién intentas hablar? ¿ Teoh? Trata de entender al público objetivo estudiando la información demográfica. ¿ Están consiguiendo esa información para quien estés trabajando? ¿ Se mostrará tu anuncio de póster? Dos mujeres más que hombres? ¿ Estás apuntando a esos? Y un demográfico más joven que podría dar forma y moldear cómo te acercas al diseño? Un demográfico más antiguo podría necesitar un enfoque de diseño más conservador, mientras que un público más joven podría conectar más con algo más audaz y mostrar detenerse. Por último, donde se ubicaron geográficamente, los de Estados Unidos podrían conectar más con cierto diseño que alguien de Sudamérica o Asia, quizás usando fotos que mejor representen al público objetivo. Más podría ayudar en este sentido con su anuncio ser auténtico y parece obvio. Pero ser auténtico es más fácil dicho que se hace sobre todo en trabajar con clientes haciendo publicidad pagada . Clientes quieren empujar ofertas de productos y servicios. Pero necesitamos encontrar formas de crear un diseño que haga que esto parezca menos parecido a tus ofertas estándar Vemos todos los días, y hacen un dedo más convincente. Nuestro público objetivo. Por ejemplo, podemos crear un anuncio sencillo para una empresa de alimentos para mascotas y colocar una bolsa de comida justo en el centro del anuncio de redes sociales con un simple cupón. Parece muy tradicional, pero, bueno, bueno, ¿y si usamos una imagen de un dueño de una mascota disfrutando de su perro y luego la foto de un producto ? Mejor aún, ¿y si nos conectamos con ellos usando un titular inteligente también? Estos son pequeños retoques y cambios en los anuncios de dedo del pie, pero pueden tener un gran impacto en lo efectivo que es el uso del anuncio. Contraste bien, y hablamos de contraste en casi todas las lecciones de esta clase. contraste es la simple diferencia entre elementos de diseño. Cuanto más dramática sea la diferencia, mayor contraste tiene. Podemos usar el contraste de manera efectiva como diseñadores para dibujar los ojos del usuario en la parte más importante del anuncio, generalmente la llamada a la acción, o que a estas alturas desliza hacia arriba para obtener más botón o área. Pero también podemos usar el contraste con nuestro tipo resaltando una palabra en nuestro titular para sacar una palabra más favorable que ayude a empujar a las personas hacia nuestro objetivo principal para el anuncio. Por ejemplo, este anuncio que utiliza contraste para llevar esta palabra en el titular para dibujar al usuario en el concepto general del contraste del anuncio puede ser fácilmente más utilizado para muchos elementos que difieren drásticamente puede causar que un dedo del pie del anuncio se vea ocupado, anticuado y muy difícil de ver el contraste es el mejor uso con moderación y con un propósito. Utilice las fotos que se conecten con el espectador. Esto se remonta a ser auténtico también. Las fotos elegirían podrían tener enormes impactos en atraer a los espectadores. Y esto también es cierto para los anuncios impresos tradicionales. Toma, por ejemplo, este anuncio para un gimnasio podemos utilizar la foto estándar que se echa un vistazo fácilmente sobre donde podemos usar una imagen de mayor impacto para dibujar a esos espectadores y parar incluso por un segundo para echar un vistazo extra a la foto y el anuncio. Las fotos a todo color tienden a dibujar a los usuarios y más que en blanco y negro recuerdan en las redes sociales . Tienes el menor tiempo disponible para atraer a la gente a tu póster. Agrega la menor cantidad de cualquier otra plataforma publicitaria. Piensa en lo rápido que te desplazas por tu feed de instagram. No mucho tiempo, es fotos de lo primero que la gente ve y empiezan a leer el texto. A continuación, usa esto a tu favor. Cómo cosechas. Tu imagen es enorme también. Podemos hacer que las cosas se vean ordinarias o dramáticas simplemente recortándolas de las formas más convincentes en este ejemplo de la niña en un lugar exótico. Recortándolo de esta manera. Se ve bien, pero recorta de esta manera. Parece casi mágico e inspirador. Siéntase libre de editar sus fotos también. Para agregar pops de color, puedes hacer esto fácilmente, sea agregando nuevas capas a la tienda de fotos y fotos o un editor de fotos y usando modos de mezcla para dibujar color para hacer puestas de sol. Y más dramático, incluso he visto a la gente clonar en diferentes nubes para realmente poner la escena. Pero por favor ten cuidado con ser auténticos también. Porque famosos influencers en las redes sociales se han metido en problemas por agregar y falsificar nubes o comprar fotos, sus cuerpos. Hay una línea fina, y depende de ti decidir dónde recae esa línea para ti y tus espectadores. Hagas lo que hagas, solo asegúrate de contar una historia verdadera, creíble, creíble, auténtica. Usar variedad. Piensa en tu post y campañas en redes sociales como un tapiz de arte. Tiene que haber cierta consistencia de marca a lo largo de todo, pero eso no significa que necesites crear cookie. Cutter agrega que todos tienen el mismo formato. Algunas personas disfrutan viendo diferentes fotos siendo utilizadas titulares, arreglos y estilo. Esto es ideal para las pruebas de usuario para averiguar cuál es el mejor diseño y efectividad para diferentes tipos de anuncios. Social Media es una parte creciente de un conjunto de habilidades de diseñador y saber cómo lo mejor diseñado para redes sociales puede hacerte más comercializable como diseñador. En general, esto requiere mucha práctica y pruebas de usuario 5. Teoría del diseño para la web: ahora lo que hace un gran diseño Web todos los sitios web éticos? Eso podría ser para convertir usuarios a un servicio de suscripción, comprar un producto por solo proporcionar información útil al usuario. Un gran sitio web es aquel que convierte bien a sus espectadores. Esto podría ser a través del uso de branding consistente, autenticidad y copia bien escrita fotos efectivas del producto y más. Entonces, ¿cuál es tu papel es un diseñador gráfico en el mundo del diseño Web? Bueno, si puedes desarrollar en código un sitio web, eres una raza rara y te pagarán generosamente. Pero con el diseño de sitios web cada vez más complejo y codificación, cada vez más especializado y podría no ser algo malo tener nuestras diferentes especialidades, veo el diseño Web siendo responsabilidad de tres principales contribuyentes. En primer lugar, está el desarrollador. Tomará el diseño final y lo convertirá en una cosa codificada, riel factible. Requiere conocimiento de lenguajes de codificación front-end y back end, lenguajes del lado del servidor y mawr. Ah, individuo altamente especializado. Se enfoca en el lado técnico de las cosas. ¿ Cómo funciona? Y recién agregado al grupo en los últimos 10 años es el diseñador UX o diseñador de experiencia de usuario . Muchos diseñadores gráficos comienzan a aprender este campo del diseño, y está creciendo en popularidad. El diseñador de UX hará muchas de las pruebas de usuario y la investigación de usuarios para averiguar el orden de cómo el usuario necesita moverse por el sitio web. Esto significa que trazarán un recorrido del usuario para que sepas cuántas opciones de menú principal debe haber para el usuario y cuántos pasos en cada proceso para que el usuario llegue a su meta. Esto requiere un Thanh de investigación y algo llamado encuadre de alambre. El encuadre de alambre está lejos para que un diseñador de UX mapee el flujo de un sitio web y bloquee las áreas a las que puede necesitar ir un botón. Ah, foto o donde pueden estar las opciones para el usuario. Esto rara vez incluye gráficos finales y a veces puede simplemente ser genial fuera cajas. Entonces, ¿qué pasa con los visuales geniales, el branding, los colores? Aquí es donde el diseñador gráfico eres tú. Yo, diseñador de interfaz de usuario, podría entrar y realmente plasmar los detalles visuales. Una vez que tengas el marco básico de mapa del sitio de contorno, es tu trabajo crear guías de estilo de iconos, algunas ideas básicas de diseño para que el desarrollador pueda codificar esto y convertirlo en una realidad realmente pulida . Entonces ahora que conocemos nuestro papel, ¿cómo creo un diseño de sitio web efectivo o diseño de aplicaciones móviles? Y hay algunas ideas básicas a tener en cuenta usando el contraste. Y aquí estamos hablando de contraste una vez más. El contraste es una gran manera de llevar al usuario en un viaje hacia su destino deseado. Esto podría ser hacia un carrito de compras podemos usar rojo, que sería un color de contraste más alto aquí entre el mar de blanco. Para que el usuario encuentre fácilmente el carrito de la compra, facilitando su experiencia. Tu talla a tu favor. ¿ Qué opinas? Convierte mejor en este diseño de tienda e commerce, una característica de producto que tiene una foto pequeña o una que tiene una foto más grande. La foto más grande se convierte naturalmente mejor porque le da al espectador una mejor idea del producto en el que se están preparando para hacer clic. ¿ Qué crees que funciona mejor? 12 elementos listados en una pantalla o un seleccionado tres elementos comisariados. Los artículos tienen una característica más grande, tienden a hacerlo mejor. La gente se abruma con demasiadas opciones cuando te multaron esas opciones para el espectador. Tiende a reducir esta tensión emocional, facilitando la selección de una opción. En general, es por ello que la gente disfruta de contenidos curados como las noticias. Hay cientos de artículos noticiosos. Podemos leerlo en cualquier momento dado. Pero usar el tamaño para resaltar los más importantes sí maravilla para nuestra alma en nuestras mentes y nuestra conversión y haga clic a través de tarifas limpias y sencillas. Es el nombre del juego. Hablemos un poco de diseño limpio y diseño web y móvil. ¿ Qué crees que funciona mejor, El layout de la izquierda o el layout de la derecha? Simplificar el diseño puede ayudar al usuario a sentirse menos abrumado, igual que lo hizo cuando les dimos Más. Las opciones selectivas basadas en el tamaño tienen un sentido de jerarquía. No sientas que tienes que meter todo en un solo área. Serán ciertos artículos que traspasarán o importantes que otros. Por ejemplo, ciertos productos se venden mejor y serán una prioridad máxima. La jerarquía se puede aplicar al diseño móvil y Web de varias maneras. Tienes jerarquía de tipos, que podría definirse estableciendo un tamaño de fuente y esperar a tu tipo de titular principal más grande y luego poco a poco trabajas hacia los titulares más pequeños. Esto suele ser indicado por el término H uno para el más grande y bajando a H dos h tres , h cuatro y así sucesivamente para tamaños de titulares más pequeños. Después tienes tu copia principal del cuerpo o tu tipo de tamaño de párrafo, que suele ser una fuente simple, un peso normal y un poco más pequeña en comparación con los tamaños de titulares. Tu trabajo es un diseñador es establecer y establecer este sentido de jerarquía en el diseño. Tomemos este ejemplo. El ejemplo de la derecha realmente no usa el tipo son elementos clave o tamaños similares, y tienen casi cero contraste. Pero el ejemplo de la izquierda establece un sistema de jerarquía de tipos fuerte, que utiliza estilos variables para ciertos tipos de información, titulares y sub líneas, dando al diseño y sensación ordenada. Podríamos hacer lo mismo con el diseño de impresión, y se traduce bien a la Web. Las opciones de fuentes son todo no solo importante en el diseño Web, sino que todos los proyectos de diseño encuentran opciones lo son todo. Tamaños luchados más grandes pueden tener un enorme impacto en las páginas de aterrizaje para impulsar las ventas son para impulsar una acción o respuesta emocional. pontes que son demasiado pequeños en tamaño pueden impactar en legibilidad y efectividad. La mejor práctica para elegir fuentes para tu proyecto digital es mantenerlo de una manera sencilla y ordenada posible. Desea asegurarse de que sus opciones de fuente marquen todas las casillas en todo momento. Número uno. Es legible en el tamaño final. Una fuente utilizada en un sitio web de escritorio puede verse bonita y grande y legible. Pero cuando se reduce a la versión móvil del sitio web, ¿sigue siendo legible y no retiene el mismo impacto? Número dos. No estás usando demasiadas fuentes diferentes. Trata de evitar usar más de tres fuentes en una página Web o gráfico digital, a menos que exista una razón específica de diseño creativo. Para ello. Evita usar tipos de fuentes similares, como usar Helvetica cerca de Ariel. Ambos son muy similares en una apariencia de época, y ambos son tipos de letra sans serif, confundiendo al espectador de cuál es cuál. Por último, asegúrate de que sea fácil de leer manteniendo razonable la longitud de la línea. Qué columna de información es más fácil de leer La versión de la izquierda son la versión de la derecha. Lo más probable es que el derecho sea más fácil de leer porque la longitud total nuestra longitud de línea del tipo es más fácil para los ojos leer. Lo mismo se aplica a los proyectos de impresión. Quieres poder mantener la longitud de tu línea de no más de 60 caracteres por línea. Puedes usar columnas y fotos para ayudarte a que esto sea más posible para ti. No tengas miedo de ser expresivo con tu tipografía y diseño digital. Utilizamos las tipografías predeterminadas como Helvetica para Danna una aérea porque eran Web seguras y los dispositivos de todos tenían estos preinstalados. Hoy en día podemos almacenar fuentes en la nube. Por ejemplo, Google Fonts mantiene todas sus fuentes en la nube para que ahora puedas cargar una mayor variedad de fuentes. Y la gente no tiene que tenerlos instalados otras computadoras para verlos en sus navegadores . Esto ha abierto un mundo de tipografía creativa expresiva en la Web. Ahora ya no tenemos que usar imágenes para mostrar tipografías expresivas o tipografía. Podríamos hacerlo de tipo vivo, significa que la gente puede seleccionarlo, copiarlo, interactuar con él y a veces incluso se puede hacer que se mueva. Como diseñadores, podríamos ser Justus, creativos como lo somos con proyectos de impresión con proyectos digitales. Asegúrate de experimentar con tipografía interesante para tus titulares. tipografías San Serif tienden a gobernar el día del pasado, pero ahora estás viendo cada vez más detallada sehr de tipografías e incluso tipografías de script en vivo en interfaces digitales. El único aviso aquí es asegurarte de no usar en exceso la tipografía expresiva y detallada con demasiada frecuencia en tu diseño digital. Podrían haber sido gran atención agarrando titulares, pero evita usar demasiadas fuentes únicas personalizadas para áreas más pequeñas de textura, copia y párrafos. Es mejor mantener esas tipografías realmente expresivas y hermosas a la máxima legibilidad, haciéndolas más grandes en usarlas para titulares. Estudia nuevas formas populares y emergentes de mostrar información allí tantas formas emergentes mostrar un menú. Lo que antes era popular era el menú de hamburguesas en el diseño de la aplicación móvil o del sitio web. Se trata de un ícono sencillo, que expandió un menú deslizante. Esto fue agradable y proporcionó al usuario un fácil acceso a un menú sin ocupar demasiado espacio en la pantalla de la aplicación del horno superior. Pero con los teléfonos cada vez más grandes, el usuario ahora tiene que tomar su figura ir hasta la parte superior de su teléfono para acceder a este menú de hamburguesas. Ahora los menús de estante en la parte inferior tienden a ser preferidos por los usuarios. Estas pequeñas evoluciones y tú yo o diseño de interfaz de usuario de una aplicación móvil, por ejemplo, son pequeñas cosas que debes tener en cuenta. Si estás interesado en perfeccionar el diseño digital, necesitamos empezar a pensar primero en Mobile. No hace mucho tiempo, pensamos en la versión de escritorio de un sitio web, y luego nos dimos cuenta de cómo se adaptaría mejor a una pantalla móvil más pequeña. Bueno, tiempos han cambiado, y ahora tenemos que cambiar esa mentalidad. Una buena forma estándar de diseñar ahora es diseñar primero en tamaños más pequeños y luego trabajar a su manera hasta tamaños más grandes. Entonces, por ejemplo, comenzar con una versión móvil de un sitio web, y luego necesitas averiguar cómo se expandirá cuando está en un navegador en una tableta? Y luego, finalmente, quieres ver cómo se ve en una pantalla de escritorio más grande. Lo mismo aplica a los boletines por correo electrónico. Cómo ves un correo electrónico en tu aplicación de correo electrónico de iPhone, por ejemplo, se ve muy diferente a cómo ves ese correo electrónico en tu escritorio. Las imágenes se airan mucho más pequeñas de lo que esperas cuando se ven en tu teléfono. Y es la mejor práctica tener eso en cuenta a la hora de crear cualquier imagen de diseño digital. Y esto lleva a un diseño receptivo. ¿ Qué es el diseño responsive? Es simplemente cómo responde el sitio web cuando se muestra en diferentes tamaños de navegador. En ocasiones los elementos se colapsaron para facilitar la visualización en un dispositivo móvil. A veces los elementos no se muestran en un dispositivo móvil cuando se convierte a un tamaño más pequeño, como una foto, por ejemplo. Todas estas opciones son importantes para que entiendas a la hora de diseñar tanto para tamaños más grandes como para tamaños más pequeños y algo que tú y tu desarrollador conviertan en equipo. 6. Diseño para accesibilidad: necesitamos pensar en la accesibilidad a aquellos espectadores con necesidades especiales. Esto es mucho más importante de lo que te das cuenta, y algo que puedes asegurarte de que suceda por cualquier cosa que diseñes. El Web o dispositivo móvil está pensando en la persiana de color Al crear tus paletas de colores . Piensa en los que pueden ser daltónicos. No confíes totalmente en el color para comunicar el siguiente paso o llamar a la acción. Pero por ejemplo, por eso tenemos dos botones aquí. Si tuviéramos que sumar otros indicadores que este botón es importante presionar, como engrosar la base apretada están agregando un borde especial. Podría ser otro indicador para ayudar al usuario que tal vez no vea ese color rojo brillante. No, es lo siguiente que hay que hacer. Un buen truco para ver si esto funciona es hacer tu diseño totalmente en blanco y negro por un tiempo para ver si puedes navegar por tu sitio web como solo blanco y negro, igual que lo harías si fuera una versión a todo color. También tenemos que pensar en las personas con discapacidad visual. Lo mismo vale para asegurarte de que haya suficiente contraste con tus colores y elementos. Bajo contraste, tal vez más difícil para aquellos con deficiencias visuales ver y navegar por su sitio web. Diseñar formas es un buen ejemplo. A 1,000,000. Seguro que tienes suficiente contraste en tu diseño cuando nos gusta ahorrar espacio siempre que sea posible. En ocasiones ponemos la etiqueta o el nombre en la burbuja de entrada. Por razones de contraste, es más fácil leer si la etiqueta se coloca encima o fuera de la burbuja. El siguiente ítem es algo que tal vez más para el desarrollador o el codificador, pero asegurándose de que tus imágenes tengan descripciones alternas o descripciones alternativas para que su lector Web audible pueda hablar la descripción de lo que es la foto. Por lo que no se pierden el impacto de los visuales. Otra en la que pensar es también asegurarse de que puede navegar por su sitio web usando una sola mano, por ejemplo, asegurándose de que puede usar el botón de pestaña para moverse por su sitio web. Simplemente usando un teclado. Si están en un teléfono, asegúrate de que los botones y las acciones no estén demasiado separados entre sí. Por ejemplo, el sistema de menús se puede utilizar acceso a usar una mano o una figura porque está en la parte inferior de la pantalla También están las personas con discapacidad auditiva. Si utilizas algún tipo de imágenes o video, asegúrate de que los subtextos estén disponibles. Además, asegúrate de que el audio no sea una experiencia requerida en tu experiencia digital de diseñador. Con excepciones especiales, por supuesto, hay mucho más que podría hacer para que las experiencias de diseño digital sean accesibles para el usuario. Y es genial tenerlos en cuenta. Asegúrate de que tu código o desarrollador sea traído a estas discusiones desde el principio para que puedan implementar muchos de estos. 7. Teoría de diseño digital: Hablamos de varios aspectos en los que pensar a la hora de diseñar para sitios web de redes sociales. Experiencias móviles más. Pero ¿qué pasa con los diseños digitales estáticos como campañas de email, carteleras digitales, iconos, diapositivas de power point? Cualquier libro cubre todos estos diferentes artículos. Atrapa al usuario en una situación diferente. Las carteleras digitales atrapan a la gente conduciendo rápido de sus autos y sus distraídos con un enfoque muy limitado. Y la clave para un diseño de cartelera digital sólido y carteleras de impresión es hacer algo legible en cinco segundos. Puedes utilizar fondos y gráficos sencillos para que este proceso sea rápido y fácil para ellos. Evitar los números. No mucha gente puede anotar números telefónicos mientras manejan, pero pueden recordar un simple tu l o sitio web. ¿ Y qué pasa con las cubiertas de libros E? ¿ Has intentado encontrar un libro electrónico en Amazon últimamente? ¿ Sabes cuántas portadas de libros diferentes miraste al intentar encontrar un libro? Sugiero visitar amazon dot com y mirar los libros o libros e. Observe lo rápido que se desplaza por estas cubiertas, que las cubiertas captan su ojo cubiertas brillantes amarillas, las que tienen una foto convincente. Tenemos que tener en cuenta dónde y cómo el espectador primero cubrirá libro temas complejos aire difícil de digerir como lo son cuando se puede recoger físicamente un libro en la librería, por lo que las portadas digitales tienden a ser más simples en la naturaleza. ¿ Estás notando un tema con simplicidad con proyectos de diseño digital? Seguro que sí. Tienes que pensar en tu situación de visor para cada proyecto digital diferente. Por ejemplo, campañas de correo electrónico. Pueden ver esto en su computadora de escritorio y ver una bonita grande imagen de alta resolución. Y ese mismo correo electrónico podría verse en su navegador móvil en la imagen es diminuto y tiene un bajo impacto. Si está demasiado ocupado, tenemos que ponernos en los zapatos del espectador y probar nuestros diseños y diferentes situaciones. El diseño de impresión parece fácil ahora, ya que solo hay una forma impresa final de la que preocuparse. Pero con el diseño digital, hay un cambio mental que tiene que suceder. Tenemos que pensar en los muchos dispositivos diferentes en los que la gente temerá tu contenido. Tengo una pequeña tarea para ti. Estudia tu en caja este mes. Mantente atento a las campañas de email que capten tu atención, no solo la gráfica, sino pensar en todo el asunto. Incluso la línea de asunto del correo electrónico a veces gráficos y flechas e incluso emojis puede ayudarlo a sobresalir en su bandeja de entrada. Tan molestos como a veces parecen, son efectivos. ¿ Y una campaña te impulsa a dar click a través de cuál es el objetivo principal de cualquier campaña de email ? Está impulsando a los usuarios a ese único objetivo que podría ser comprar un producto o hacer que la gente se entusiasme por un próximo anuncio de servicio. Los que encuentro más efectivos simplifican el mensaje tanto como sea posible. En lugar de hablar de dos actividades realizadas o de dos eventos principales como el boletín de correo electrónico, ¿tenderían a estar hiperenfocados en ese objetivo de un usuario? Utilizan una sola imagen arriba y muy poco texto de copiadora corporal, pero un gran clic a través de botón o un gran llamado clientes de acción. A veces, una vez que hablas de una cosa grande, pero tienden a querer que te aprietes también un montón de cosas ya porque estás enviando un email a todos sus contactos. Quieren ser eficientes, pero los correos electrónicos que convierten a los mejores tienen un solo enfoque. Trata de educar al cliente sobre este hecho y practicarlo en nuestros propios diseños de campaña. Los boletines son un poco diferentes, y ahí es cuando podría ser más elaborado con información. Y esto es con todas las cosas diseñadas pero sé consistente con tu branding y tener campañas digitales conectadas. También, con todos los proyectos digitales, necesitamos mantener esa consistencia de broma. No es necesario que cada plantilla digital sea un cortador de galletas, pero asegúrate de usar colores similares a lo largo de tus campañas ya que los espectadores pueden ver tu campaña en diferentes lugares, llevándolos lentamente a un embudo que los convertirá más a una venta. Por ejemplo, podrían correr a través de un anuncio de Facebook. Se inscriben para más información, y después reciben una campaña por correo electrónico. También podrían ver un anuncio de display en un sitio web de noticias y luego hacer clic en una página de destino. Y luego hacen clic fuera. Pero luego son retardados por una campaña en redes sociales en Instagram. Tener branding y colores consistentes puede ayudarles a reconocer el rastro y más allá del proceso del embudo de ventas. Quería asegurarme de mencionar las rejillas lo que es genial de los proyectos de diseño digital, ya que podrían ser similares en naturaleza para imprimir proyectos de diseño y el hecho de que ambos puedan utilizar el sistema de cuadrícula en su beneficio. Rides aire fantásticas guías que nos ayudan a bloquear contenido importante y su diseño. Nos pueden ayudar a encontrar la colocación correcta de una cara de la parte principal de un logotipo y una red social diseñada. Por ejemplo, podrían proporcionar puntera de orientación trabajando con diseños web complejos y diseños de APP móviles. Cuando estás lidiando con productos digitales, también estás lidiando con píxeles. A veces es agradable tener una cuadrícula para conocer tus márgenes del mismo ancho. Por todos lados están las canaletas entre las columnas de un sitio web o incluso lo son. Los botones de una aplicación móvil están alineados con espaciado y alineación similares. Hay muchos sistemas de rejilla diferentes que puedes utilizar en los productos de Detroit. Por ejemplo, diseño de sitios web móviles tiene una cuadrícula estándar de cuatro columnas, pero un sitio web puede tener una cuadrícula de columnas Gullit estándar de 12 que puede ayudarte a encontrar el espaciado correcto entre fotos, columnas y mawr. Con el icono AP Design Apple creó esta maravillosa cuadrícula basada en los principios de la relación dorada . Nos ayuda a descubrir la colocación adecuada de los elementos para crear convincente. Fácil de encontrar iconos de la aplicación Si se utiliza correctamente, puedes usar una cuadrícula modular boxeador para ayudarte a bloquear Una campaña de email son una portada de libro e para ayudarte a encontrar un equilibrio entre los elementos de diseño. Hay mucho que pensar a la hora de diseñar proyectos digitales, pero al final, algunas de las mismas bases básicas de diseño, como la tipografía adecuada, anillo de foto y diseño verdadero en el espacio digital está bien. Hemos agregado elementos que nos preocupan ahora, como el tamaño de visualización de una pantalla, la distancia a una resolución de pantalla y cómo se renderiza el tipo en la pantalla. Pero al final, son esos principios básicos de diseño los que pueden ayudarte a crear proyectos digitales convincentes . Ahora nos tomamos un tiempo para profundizar en la fuerte teoría del diseño digital. Afrontemos muchos proyectos que se consideran una gran parte del espacio de diseño digital, como campañas de redes sociales, YouTube, miniaturas, miniaturas, portadas de libros e, campañas de email, un sitio web móvil, icono de diseño, aplicación de diseño, diseño de iconos, post instagram quién y más. Entonces sigamos adelante y empecemos con alguna aplicación práctica 8. Proyecto miniatura de YouTube: Bienvenido a Adobe Photo Shop. Vamos a estar haciendo para nuestro primer proyecto, una miniatura de YouTube. Entonces, como saben, hablamos un poco de esto en las secciones de teoría, pero YouTube dobló clavos. Y para ser simple, no muy complejo, sino una muy, muy atencion agarrando. Aquí es cuando usamos colores de contraste realmente alto. Usamos disparos de personas. Usamos cosas diferentes para realmente ayudar a captar la atención de la gente en esa miniatura muy, muy diminuta. Y cualquiera que esté en YouTube o trabaje para alguien en YouTube o quiera tener un cliente donde trabaje y ¿tubas miniaturas como parte de tu trabajo? Te darás cuenta de lo importante que es hacer estas atencion agarrando miniaturas y hacerlo una manera que haga un gráfico convincente. Entonces vamos a hacer este ejemplo aquí mismo. Tenemos unas miniaturas de YouTube que iban a hacer en esta sección. Vamos a caminar a trabajar en este 1er 1 primero, y requiere sólo tres imágenes. Agarré todas mis imágenes de pecs als dot com. También hay ceniza virgen y un par de otros picos obedecen, pero voy a estar usando estas imágenes y siéntete libre, ya que esto es más empezando a entrar en nivel intermedio para usar tus propias fotos de manera similar, pero ponerle tu propio giro para que no tengas que usar estas fotos. Pero si quieres un enlace a ellos, están en la guía de recursos. Solo vamos a usar a imágenes para este 1er 1 En su mayoría va a ser un foco en la tipografía. Lo cual es una especie de gran titular es regalar 10,000 dólares en 24 horas. Un aviso de titular muy corto. No estamos poniendo todo el título del video, y solo hubo realmente seleccionando lo que va a llamar la atención de la gente. Esto nos dará la oportunidad de hacer realmente la tipografía de alto impacto y más grande y realmente emparejar bien junto con la foto principal. Entonces aquí va a estar nuestra foto principal. Este es nuestro chico de YouTube. Quién es por supuesto, me inventé YouTuber ficticio. Entonces conseguí esto en píxeles, pero lo vamos a usar como nuestros ficticios chicos de YouTube van a estar regalando siendo muy generosos y regalando 10.000 dólares. Entonces primero necesitamos un tipo de aislar y esta es una clase intermedia, así que voy a ir más allá de cosas de nivel intermedio. Por lo que necesitamos aislar a este personaje. Así es que necesitamos aislar a esta persona. Entonces hay un par de trucos. Estoy usando Photoshopped 2020 cuando estoy filmando ahora mismo. Entonces hay un par de tramposos que podemos dio Solo podríamos ir a seleccionar un tema que sea la forma más rápida que siempre voy a eso. Esto salió en las versiones de 2019, así que si tienes un 2018 o anterior, no vas a poder tener eso. Pero mira qué bellamente ese corte eso eso que ahorra tanto tiempo. Otra razón fue actualizar tu software no es mala idea. Cuando comienzas a hacer proyectos de nivel intermedio y trabajo de cliente remunerado, se paga por sí mismo. Entonces tenemos aislado a este hombre. Lo que puedo hacer es que hay un par de cosas que sólo podría hacer una copia y pegar, y tengo a este hombre aquí mismo. Podríamos traerlo a la otra zona, o podemos hacer una máscara flagrante. Entonces va a playa maestro de capas justo aquí abajo, y eso hace un poco mejor trabajo. Lo que me encanta de capas Mass es que puedo entrar y puedo soltar la máscara de capas para poder hacer clic derecho y deshabilitar mi máscara de capas, y podré recuperar mi foto original. Por lo que me gusta poder hacer esto. Se llama edición no destructiva para los que ya saben o para los que no saben. Entonces puedo hacer clic derecho, y puedo habilitar de nuevo la máscara de capa para conseguir mi cosecha, y van a estar recortando muchas cosas usando máscara de capas en lugar de solo copiar y pegar, porque siento que nunca quiero ir volver a algo Cuando usé la masa de capas. Siempre puedo volver a la foto original, y eso es lo que tiene de genial. De verdad, Ahorros son tu tiempo cuando haces otros pasos, esa es una forma de cortarlo. Por supuesto, si no tuviste la nueva versión, probablemente terminarás haciéndolo por esta. El fondo es bastante simple donde podría simplemente hacer la varita mágica, herramienta y seleccionar o aún mejor, puedo conseguir la herramienta de selección rápida y aumentar el tamaño de mi pincel para herramienta de selección rápida y solo hacer eso y luego me tengo que ir espalda y mano. Selecciona eso o utiliza la herramienta de selección. Muchas formas diferentes de catapultar objetos definitivamente estaban practicando todos aquellos más tarde en el curso, así que vamos a mantenerlo simple. Mantengamos esto rápido. Bueno, vamos a seguir adelante y hacer click derecho en una masa capaz o en capas que hicimos. Y llevémoslo a nuestra plantilla para que puedas acceder a esta plantilla. Es un recurso descargable es parte de esta clase. Cada proyecto tendrá algún tipo de plantilla que podrías abrir y usar, por lo que las cosas ya están dimensionando de la forma en que necesitas Teoh y puedes empezar a diseñar. Pero para hacer esto acabo de hacer un documento de 12 80 por 7 20 píxeles, y seguí adelante y lo creé en 300 dp. Resoluciono porque siento que cuando hago imágenes digitales, sobre todo en YouTube y Facebook con redes sociales, es mejor diseñar y ese formato de mayor resolución. Entonces es uno más bajo porque nunca se sabe cuándo podría necesitar usar los gráficos o algo un poco más grande, y siempre reducen el tamaño del archivo para usted si es necesario. Entonces no es gran cosa con el tamaño de archivo aquí porque hacen todo eso por ti automáticamente con el servidor. Por lo que me gusta mantener las cosas en la resolución más alta que algunas. Por eso estoy haciendo una buena resolución 300. Una frontera roja. Esto es sólo tener una frontera en casi todos los proyectos. Sólo para que no mantenga las cosas cerca del borde. Esto no es obligatorio por YouTube, pero esto es obligatorio por mí porque me gusta mantener las cosas bonitas y limpias en las fronteras. No hay tipo ni texto en el borde rojo. Pero puedes tener fotos sangradas a ella. Simplemente no incluyas ojos o elementos importantes. No quieres poner eso tan cerca del borde. Se siente ansioso. Eso es solo una práctica de diseño útil para mantener las cosas dentro del margen. De acuerdo, así que aquí está nuestra plantilla. Voy a seguir adelante y sacar nuestro panel de capas aquí. todos modos puedes tener tus ventanas arreglando. No tienes que copiar mi sistema de ventanas, pero solo hacer las que solo utilizo en mi propio flujo de trabajo personal. Y en el nivel intermedio, estás empezando a averiguar qué tipo de tablero quiero, qué ventanas quiero tener abiertas para que puedas empezar a personalizar tu propio dashboard . Entonces aquí están las tres capas que tenemos. Tenemos una capa de texto. ¿ Irías y apagarías eso? Realmente no necesitamos eso por ahora mismo. Y tenemos nuestro margen, que eran para seguir solo un poco más. Y tenemos estas guías en las que tengo mis gobernantes. Entonces si no tienes a tus gobernantes puestos y realmente vamos a necesitar a nuestros gobernantes aquí en, hacemos Social Media Post solo tienes que subir a ver y luego tener tu muestra extra Si quieres que las guías estén encendidas y tus gobernantes, si quieres la reglas para estar en, por supuesto, puedes hacer clic y arrastrar desde tus reglas para crear tu propia guía. Simplemente haga clic aquí y arrastre para poder crear esos. Entonces vamos a traer aquí a nuestro hombre buscando drag antes de que lo reduzca en tamaño. Voy a hacer algo un poco especial. Yo En este momento no es una capa inteligente, y me gustaría hacerle una capa inteligente porque cuando yo si no es una capa inteligente y lo reduzco en tamaño, y luego las hago más grandes de nuevo. Decidí hacer una más grande otra vez por alguna otra razón. Se comió pixel, pero si la hago una capa inteligente, mantendrá intacta esa resolución original de la foto en todo momento. Entonces cuando estás trabajando con fotos, si puedes mantenerlo en capas inteligentes todo el tiempo que puedas, a veces tienes que hacerlo. Rass intenta editar una foto en profundidad. Pero si pudieras seguir adelante y hacer click derecho y convertirla en una capa inteligente por aquí en el lado derecho de esta capa a la derecha, haz click y consigue una cabra y conviértala a objeto inteligente. Entonces ahora esto se va a convertir en un objeto inteligente que puede decir por ese pequeño, uh, icono de ahí mismo. Vamos a hacer esto a casi todas las fotos hasta que tengamos que Rast surgirlas para editarlas. Entonces ahora mismo puedo reducir el tamaño de él. Podría hacerlo muy diminuto y lo que es genial. Si no fuera un objeto inteligente y yo los hiciera más grandes, se desdibujaría. Pero ahora mantiene la resolución incluso cuando lo hago más grande o más pequeño, así que eso es tan útil en términos de flujo de trabajo y tener una atmósfera de edición no destructiva . Entonces vamos a posicionarlo de la manera adecuada. No queremos tenerlos tan grandes que sea como, Wow, está ahí fuera, hombre. Es agradable tener un poco de cuello y algunos hombros, pero tampoco queremos alejarnos. Empezamos a perder ese impacto emocional. Entonces, cuando te alejas así, realmente estás empezando. No estás conectando tanto con su rostro y sus ojos, y ya tiene anteojos puestos, lo cual es un poco una barrera emocional. Por lo que quieres especie de zoom un poco más que esto, para que puedas. Yo quiero tener este bonito punto medio donde está. Estás acercando tu conexión con esta cara, pero tampoco es abrumador, y tienes mucho espacio para texto. Adelante y cosechar tiempo aquí. A partir de ahora, siempre podemos arreglarnos más tarde, así que sigamos adelante y aplicamos un bonito fondo de alto contraste. Entonces vamos a hacer un bonito color oscuro y rico. Va a hacer nuestras muestreas. A ver si no podemos hacer un color azul púrpura. Solo tenemos que entrar en mis muestras y conseguir mi herramienta de cubo de pintura Solo haciendo una nueva capa y solo voy a ir por delante de pop en una nueva capa y bajarlo. Entonces aquí es donde voy a desactivar los márgenes solo para que pueda aclarar todo por mí. También voy a desconectar mis extras, que serán mis guías no necesitan. También hay un atajo de teclado para eso. Sólo necesito una imagen clara para ahora mismo. Vamos a sumar nuestro tipo. Entonces, ¿qué es un bonito color de cortesía al azul? ¿ Cuál tiene el color de contraste más alto que se te ocurra al azul? Si miras el color rueda amarilla, eso va a salir tanto como sea posible. Entonces eso es exactamente lo que vamos a utilizar esta combinación azul y amarillo para los colores de alto impacto de contraste más alto. Por lo que no quieres usar esto para todo y diseño. Pero para YouTube, todo se trata de la atención. Todo se trata de agarrar tu atención, así que lo vamos a usar aquí. Entonces seleccionemos un bonito color amarillo que no entraría en nuestras muestreas y amarillos. podemos hacer todo tipo de cosas. Consigamos nuestra tipografía. Simplemente voy a seguir adelante y cargarla y estoy usando. Ahora mismo es un tipo o es una fuente llamada fieldwork, y está en la fuente dhobi. Por lo que si tienes la suscripción a adobe, tienes acceso al spot de forma gratuita. Siéntase libre de usar otra cara gratuita y de tipo de código abierto que obtienes de las fuentes de Google. Google Fonts tiene uno llamado ferrocarril, que está muy cerca. Entonces si no tienes la suscripción a adobe, siéntete libre de ir a las fuentes de Google y usar el ferrocarril u otra tipografía simple de arena Sarah. Entonces voy a seguir adelante y cargar estos. Esto va a ser sencillo. Copiar y pegar. Voy a poner cada línea en su propio jugador tipo. 9. Proyecto miniatura de YouTube - 2: Entonces voy a seguir adelante y romper esto un poco más. Yo quiero que sea una tipografía apilada. Entonces lo que podría incluso hacer es simplemente cortar esto, crear una nueva capa de texto. Y hay que tener esto como palabras separadas que aquí es donde realmente necesitamos pensar ¿Cómo trabajamos con nuestras tipografías? ¿ Cómo los organizamos de diferentes maneras? Entonces regalando, Vamos a ver si no podemos ponernos eso apilados cuando podría hacer ¿La minúscula se ve suave? Y eso me gusta. Pero realmente queremos tener este alto impacto emocional. Estoy regalando 10.000 dólares en 24 horas. Entonces hagamos una mayúscula. Todas las mayúsculas son todas mayúsculas. Voy a bajar aquí al panel de mi personaje y solo seguir adelante y hacerlo todo gorra y tuve seguir adelante y hacer eso por estos dos. Entonces Bueno, al menos estamos empezando a hacer algunos avances en cuanto a cómo queremos arreglarlo. Entonces hagámoslo regalando. Queremos asegurarnos de que las cosas estén apretadas como un titular, pero no queremos que sea demasiado apretado porque eso es abrumador. Pero cuando lo tengo lo suficientemente apretado donde se siente como si fuera una frase headliner y así con el en 24 horas, podríamos hacer que todo esto mayúscula esté bien, pero luego empieza dedo del pie tropezar entre sí y ser una sensación como un titular mucho más largo. Entonces en realidad voy a tomar la decisión de tomar eso mantener esa minúscula y un poco más pequeña y tal vez hacer una especie de alineación diferente. Entonces solo tipo de bloqueo o tipografía al igual que hacemos con muchos otros proyectos. Y así es a donde vamos, OK, tenemos que romper este titular porque hay cuatro líneas y todo me está gritando. Todo está un poco demasiado ansioso. decir, Esdecir,es un contraste casi demasiado alto, Así que una cosa que podemos hacer es que podemos usar el contraste con su color y tipo. Entonces una cosa que podría hacer es seguir adelante y hacer de este blanco que solo haciendo blanco ese tipo y luego los 10.000 dólares realmente sobresale. Por lo que te das cuenta de cómo ese titular automáticamente lee un poco mejor. Lo rompe por la mitad. Por lo que regalar pausa $10,000 en 24 horas. hecho de que cambiemos el color, realmente ayuda a hacerlo un poco menos abrumador. Pero también le ayuda a leer mejor porque está roto. Por lo que usando el contraste con el tamaño del peso, este es una especie de uno de esos factores en acción. Es una cosa que es realmente popular hacer es el tipo de capa y fotos. Entonces una cosa que podemos hacer es traer todo este tipo. Asegúrate de que está por debajo ¿Es capa tipo de ver si no podemos encontrar la oportunidad de tener una carta o de ir detrás de ellas solo para agregar un poco el look en capas? No tiene que ser todas las letras porque eso haría difícil de leer. Pero tal vez el G G es una letra muy fuerte, y la mayor parte del impacto o la legibilidad de la G está en el lado derecho de la G. Así que creo que podemos darnos el lujo de tener un poco cubiertos y entonces podemos simplemente algo vivo esto como tal. Y una cosa que me gusta hacer es tener algo de alineación. Entonces si no tengo a un linista a la izquierda. Yo quiero tenerlo a la derecha para que podamos seguir adelante y hacer eso un poco más grande para que lado derecho estas letras estén alineadas. Y entonces podríamos incluso hacer los 10,000 de esa manera a Aiken Seleccionar los tres de estos sólo van a hacer una alineación correcta. Tan solo asegúrate de que todo sea la línea a la derecha, y aquí es cuando necesitamos estallar en nuestros márgenes y salir bien. ¿ Vamos por encima de los márgenes? Se puede un poco. Está bien. No lo es. No es una regla. Es solo para ayudar Guía útil. Entonces puedes mantenerlo así, o voy a ver si no puedo alejar ligeramente estas cosas del margen para que se quede adentro y luego hablas. También podemos usar rejillas para perder mucho las rejillas en este curso más adelante. Entonces estamos consiguiendo el diseño básico. Tenemos que tener algún tipo de fondo porque ahora mismo es un color sólido. Destaca, no funciona, pero ¿qué podemos hacer para que esta sea aún más una foto intrigante? Hay muchas cosas que podemos hacer. Entonces estamos regalando dinero en lo que atraiga a la gente de que el dinero lo vea bien? Pero no hagamos que sea totalmente abrumador. Hagamos un bonito elemento de fondo con billetes de dólar. Entonces tengo este billete y vamos a usar esta foto aquí mismo, y la voy a llevar al fondo. Se lo va a pegar y voy a hacer click derecho, y voy a asegurarme de crear un objeto inteligente. Entonces cuando reduzco en tamaño y lo traigo de vuelta más grande, no se va a poner borrosa o tener la resolución reducida el único problema y esto es solo un problema práctico cuando haces algo que un objeto inteligente es, sí retiene esa resolución, que es lo que quieres, pero hace que el tamaño del archivo sea súper enorme. Por lo que si no tienes una computadora nueva, a veces tener 10 objetos inteligentes que son fotos realmente puede ralentizar tu computadora. Ese es el único inconveniente es que sí aumenta el tamaño de tu archivo de tu documento Photoshopped. Entonces vamos a enmarcar esto. Adelante y trae su capa todo el camino de vuelta. Estaba tratando de enmarcar esto. Nosotros queremos que el sea visible para que la gente pueda decir Eso es un dólar y tenemos que repasar esto para que solo podamos reducir la opacidad y, ya sabes, ya sabes,está bien. Tratemos de hacer un modo de mezcla y vamos a usar cargas de mezcla. También mucho. Este curso, intentemos encontrar uno que lo mezcla que también le guarde ese azul rico. Entonces solo vamos a pasar por estos y encontrar lo que creemos que sería lo mejor. Eso es que la superposición tiene una bonita pistola moderna, casi le da una especie de tono púrpura, que es muy moderno, solo una especie de ciclismo a través de éstas para encontrar una. Nos vamos a quedar con la superposición para el modo de fusión para esto, y quiero un poco ajustar el fondo en este momento. Um, solo quiero agregarle un poco más morado. Era una especie de agregar un poco más púrpura a eso. Entonces lo que podemos hacer es ahora mismo tenemos los antecedentes interfiriendo con el tipo. Podemos agregar una sombra de gota o podemos mantenerla limpia y simplemente poco a poco se redujo la transparencia, ese fondo y solo las áreas donde se superpone al tipo. Entonces Hagamos eso usando máscaras. Por lo que tengo arte Dollar lo seleccionó. Voy a añadir una máscara de capas para hacer esto mucho en la clase. Entonces en la máscara de capas, voy a pintar con el pincel. Y con la mayoría de la masa de capas cuando borro o añado a la máscara de capas, me gusta pintar con un cepillo redondo suave. Ah, ronda dura. Es sólo un poco de software poco realista y da ese bonito look emplumado. Por lo que estoy usando un cepillo redondo suave por lo general les gusta usar un bonito cepillo grande para tener más de un desvanecimiento realista. Y vamos a pintar es si aún no lo sabes. Si tienes una mascota de estratificación, haz que se elija la masa de capas, no la capa principal. Por lo que la máscara de capas Cuando usas negro, puedes pintar un objeto. Entonces voy a pintar de lejos esto dondequiera que pinte de negro en la máscara de capas y se puede ver el maskell de capas aquí mismo donde pinto al negro, y puedo recuperarlo cambiándolo dedo del pie blanco y pintando de nuevo para que puedas ganarlo vuelta por blanco y luego borrarlo es nuestra eliminación. Es el negro. Entonces lo vamos a hacer aquí con el negro donde vas a reducir la transparencia de nuestro cepillo suave y simplemente un poco de sutilmente deshacerse de algo de ese fondo para que no compita con el tipo. No queremos hacer eso. Lo último que queremos hacer, incluso podríamos desvanecernos un poco aquí hacia abajo. Por lo que realmente, realmente te enfocas en el tipo Mrs Más de un elemento de fondo. Entonces una cosa que podemos hacer aquí es que podemos añadir un pop de color. Entonces en este momento, sólo tenemos un fondo de color sólido. Pero lo que realmente es popular ahora es tener ese fondo de color sólido pero agregar un rico modo de mezcla o color encima. Entonces vamos a agregar una nueva capa, y esto va a ser una capa encima de todo. Entonces vamos a añadir una nueva capa, y vamos a seguir consiguiendo ese mismo cepillo redondo suave. Vamos a hacerlo bastante grande. Entonces hagámoslo bastante grande. Prueba 1000 o así. Eso probablemente sea bueno. Y esto es lo que vamos a hacer. Vamos a pintar un poco de calidez ahora mismo. Tenemos un montón de cool pasando. Tenemos muchos morados y azules. Y si hacemos esto Casi puesta del sol, especie de. Tengo en la parte superior izquierda, así que tengo seleccionada nuestra nueva capa en blanco, y solo voy a llamar a este resaltado y solo voy a dar clic. Podría seguir adelante y seleccionar un bonito color cálido atardecer. Podría hacer naranja. Haces una especie de color rosado y sigamos adelante y solo haz clic una vez. Y ahora mismo es realmente fuerte, y eso está bien, porque eso es lo que mezcla modos o cuatro. Vamos a hacer la superposición o el aligerar 11 de esas para ver qué luce mejor. Hay superposición pero casi hace que la piel se vea un poco para leer. Entonces vamos a probar el aligerar Así que el rayo va a tener este efecto bonito, casi un efecto de cinta de filtro de instagram a esto, Y así es exactamente como se crean los filtros de Instagram es mediante el uso de modos de mezcla y colores encima de las cosas. Vuelve a hacer click una vez, pero no queremos exagerar. Solo queremos agregar un poco de calidez por ahí. También podríamos hacerlo a sus gafas de sol, Así que si queremos reducir un poco esto. No pudimos agregar un poco de color atardecer a las gafas de sol. Calienta un poco esos. Por supuesto, si tuviera esto en una capa separada, Aiken simplemente apaga eso en una y reduzca la opacidad. Si creo que es demasiado fuerte, un montón de cosas que podríamos hacer así que es antes se ve genial. Pero esto le agrega un poco de riqueza. Y vamos a hacer esto mucho cuando se trata de fotografía y sacar puestas de sol, mawr y hacer algunas cosas así más adelante, no podemos agregar un poco de sombra gota. No nos va a matar. No soy un gran fan de las sombras de gota fuertes. A mí me gustan las sombras de gota muy claras. Entonces digamos que quiero agregar sombras de gota a todo el Así la forma más rápida de hacerlo desde la perspectiva del flujo de trabajo. Adelante y agréguelo, cómo me gusta en el 1er 1 Así que solo estoy en mi panel de estilo de capa, y solo voy a tener un look realmente bonito. Qué poco están moviendo las asas en esas Solo una pequeña sombra de gota realmente agradable. Voy a decir esto como un estilo. Entonces voy a decir esto por aquí. Nuevo estilo. Mira aquí y voy a decir esto. Ha caído sombra YouTube y voy a incluir afectos de capa. No tienes que ni idea de opciones de mezcla porque no la estoy usando. Mira OK ahora para poder acceder a eso, podría ir al panel de mi estilo justo aquí del panel de mi estilo, y te desplazas hacia abajo para usar el mío se cargará, y puedo seleccionar todos estos y aplicar la misma sombra de gota. Entonces es sólo una especie de ahorro de tiempo. Si quiero agregar una sombra de gota a todo, y no tengo ganas de ir a cada capa y agregar la misma sombra de gota. Puedes usar estilos de carácter para acelerar fácilmente ese flujo de trabajo. Y eso es exactamente de lo que trata esta clase es mejorar y acelerar tu flujo de trabajo y encontrar formas de hacer las cosas más rápido y mejor. 10. Proyecto miniatura de YouTube - 3: Entonces agreguemos algunos toques finales. Podemos añadir un poco de sombra de gota para asegurarnos de que su cabeza proyecte un poco de sombra sobre el G, solía añadir un poco de ese efecto en capas. Simplemente haciendo una simple sombra de gota y saquemos la distancia y te voy a desabrochar luz escolar porque no quiero que mi otro tiro de gota se vea afectado. Entonces yo solo estoy haciendo clic en eso y encontrar el ángulo correcto de donde está echado justo por ahí sería perfecto. Sombra de gota muy espiral. No mucha capacidad. Lo suficiente para darle un poco de ese look en capas. Poca riqueza. Y por último, hay un par de cosas que tenemos que hacer. En primer lugar, necesitamos hacer una prueba de visibilidad, por lo que las pruebas de habilidad visibles se alejan bastante. Entonces hagamos el 50% y esta es una especie de forma realista de enmarcar tus cosas porque quieres hacer pruebas de visibilidad. Se puede obtener una imagen realista de cómo el espectador va a ver su documento digital . Entonces en este momento este es probablemente un tamaño de miniatura de sierra realista que verás en una pantalla de escritorio y podríamos alejar incluso a Mawr para hacer una visita. Prueba de habilidad. Entonces, ¿puedo leerlo? Sí, el tipo es muy claro. Podía ver las anteojos del hombre. Yo podría hacer las señales del dólar y tú podrías hacer un paso más e ir al 25% e ir. ¿ Todavía lo puedo leer? Si la miniatura era más pequeña, ¿todavía puedo leerla? Sí, puedo. Se revisa todas las cajas para que pase todas mis pruebas, Así que estoy listo para ponerme un poco más serio sobre prepararme para exportarlo. Han pasado unos 20 minutos, y eso es sobre el tiempo que quieres poder hacer una miniatura de YouTube en su toma cualquiera 20 minutos. Tienes que encontrar formas de acelerar tu proceso de juntar las cosas porque queremos ser rápidos, eficientes y hacer un buen trabajo. Entonces eso es lo que el diseñador intermedio a avanzado necesita empezar a hacer es moverse rápido y conseguir que las ideas salgan para que puedas cargar, ya sabes, por tu hora de trabajo por una miniatura y no recargar y tomar cinco horas para hacer lo que se debe hacer muy rápidamente para el video. Por lo que ahora mismo tenemos este rico, colorido fondo. Tenemos este tipo blanco amarillo rico, de alto contraste pasando. Una cosa que podemos hacer es como muchos de ustedes dos personas lo hacen. Esto es que van a hacer su foto o la foto principal escala de grises para que la tipografía tenga una oportunidad de salir realmente. Vamos a probar eso. Aquí tenemos nuestra capa aquí. Vamos a subir a ver si no podemos hacer este blanco y negro. Entonces solo voy a bajar y te darás cuenta cuando tengas una capa inteligente encendida o un objeto inteligente en una foto. Es genial para dimensionarlo. Pero cuando necesitas hacer ediciones, sí lo hace un poco difícil es cuando voy su imagen. Todavía puedo hacerlo gris habilidad yendo al blanco y negro. Pero pierdo un poco de mi de saturar un par de opciones diferentes. Si quieres tener esas opciones, vas a tener que rast surgirlo para obtener un clic derecho y vas a tener que rast surgir la capa. Eso no significa que no puedas No tienes la capacidad de escalarlo hacia arriba y hacia abajo como lo hiciste antes. Es decir, todavía se puede, pero empieza a perder su calidad y su todo. Pero eso es algo que creo que aún podría hacerlo en blanco y negro sin tener que hacer nada. Yo sólo podría estar saturado un par de maneras diferentes. Voy a ir a la opción en blanco y negro y sólo hacerlo ahí. Entonces te diste cuenta de ese tipo de tono abajo y sacaste arriba los 10,000 el amarillo en los 10,000 para que puedas tenerlo a todo color. Podrías tener un blanco y negro. Voy a hacer clic en este hombre, y voy a afilar un poco. Entonces sólo voy a bajar y voy a afilar y sólo conseguir un afilado en él una muesca solo para un poco más crujiente esa imagen. Entonces creo que hay una cosa que podríamos hacer para que esto sea aún mejor. Entonces si tienes otro tipo de foto, a veces estás atascado el cliente o tú. Si estás haciendo tus propias miniaturas de YouTube, estás atascado con una foto en particular. Solo tienes un conjunto de fotos pero como diseñadores siempre nos empujaban a hacer mejores y mejores cosas. Entonces, ¿qué podría hacer esto incluso Morvan alto, Alto impacto, miniatura de YouTube? Bueno, todos nos conectamos con los rostros de las personas, aire, genial tener en sus caras sonrientes. A muy buenos rostros emocionales como rostros enojados son realmente buenos. Rostros neutros o no. Pero y si tuviéramos una expresión facial aún más exagerada como sí, como una emoción al igual que este tipo, Este tipo de aquí, Mira esa cara. Si lo pusiéramos en una miniatura de YouTube, realmente agarraría bastante a la gente. Por supuesto, eres limitado. A veces si tienes que usar al dueño del canal de YouTube, quien hizo el video, pero solo tipo de mostrarte tipo de esa psicología emocional detrás de qué fotos elegir y qué convertir mejor y qué. Es un diseño más efectivo y digital. Entonces aislemos a este tipo. Veamos cómo puede hacer eso. Veamos si no podemos hacer nuestro práctico dandy selecto tema. Veamos qué hace. Me encanta esta herramienta. Una de las mayores razones por las que debes actualizar a 2019 si puedes pagarlo. Algunas personas no pueden Eso está bien. Vamos a hacer lo mismo. Nosotros sólo vamos a hacer una máscara de capa y conseguirlo. Probablemente podríamos recortarlo un poco. No voy a necesitar todo ese cielo. Estábamos consiguiendo nuestra herramienta de cultivo en recortarlo y sigamos adelante y traerlo. Entonces esta va a ser una segunda versión. Vamos a tener dos versiones diferentes. Tengamos dos versiones diferentes, Así que voy a ir a nuestro tablero de arte, Podría estar aquí arriba. Simplemente voy a dar clic en la herramienta de movimiento. Y tengo mi herramienta de tablero de arte y voy a estar agregando un tablero de arte, así que va a seguir adelante y dar clic y seguir adelante y dar clic en la adición. Se va a agregar un nuevo tablero de arte y voy a copiar y pegar lo que teníamos antes, Así que quiero tener dos versiones diferentes para exportar. Por lo que podía hacer se llamaba una prueba de división de ser. Para que pueda probar una imagen fuera una miniatura para ver cómo se convierte el video, y que podría probar la otra fuera. Eso se llama un ser split probando tu básicamente diciendo cuál funciona lo mejor todo un tablero de arte uno podríamos copiar a tablero de arte a Así que acabo de seleccionar son pobres. Y yo sólo copié voy a ir a tablero de arte, también. Y sólo voy a pegar, así que parece que ya nos agregó un tablero de arte. Entonces ese es un paso. Ahora sé que no tenemos que hacerlo. Eso es lindo. Entonces siguió adelante y copió el tablero de arte también. Por lo que ahora puede funcionar en ambos. Entonces aún tengo a nuestro hombre saltando Tráelo y eliminemos a nuestro hombre y a nuestro punto culminante, porque sólo tendremos que ver de eso más adelante. Y veamos si no podemos simplemente pegar a este tipo. Y por supuesto que queremos, ¿verdad? Haga clic aquí en la capa y haga que un objeto inteligente se convierta en objetos inteligentes, y ahora podemos moverlo, escalarlo sin problema. Entonces, ¿dónde va a estar? Es posible que necesitemos acercar para este. ¿ Dónde va a ser la mejor manera de ponerlo con tipo? Entonces lo que queremos hacer y esto es sólo una especie de psicología del diseño común es que queremos tener globos oculares frente al tipo porque como humanos, miramos los globos oculares de las personas y nos interesa lo que están mirando. Entonces si te enfrentas a los globos oculares hacia el tipo, ayuda a conectarte con el tipo. Entonces lo vamos a mover para que sus globos oculares estén enfrentados siempre lo puedan reflejar si tuviéramos que hacerlo. Pero probemos un arreglo de tipo diferente. Entonces voy a seleccionar todo mi tipo, moverlo y ver si no encuentro un mejor arreglo. Entonces voy a tener que hacerlo mucho más pequeño. Entonces aquí está una especie de la nueva recorte un arreglo. Tenemos la longitud completa del brazo. Si fuéramos a cortarle el brazo, se ve más enojado de lo que lo hace excitado. Por lo que hay que pensar en cómo se obtiene una cosecha. ¿ Qué obtienes incluir en la foto para agregar ese impacto emocional? Entonces vamos a reorganizar un poco el tipo para que probablemente pueda perforar por el final y la G y podríamos moverlo aquí para asegurarnos de que dar sea aún legible. Entonces la derecha del final y la izquierda del G, esas letras siguen legibles y vamos a hacer un arreglo diferente en alineación, y tal vez necesitemos hacer las cosas un poco más pequeñas y eso está bien. Me gustaría tener esa última cubierta cero solo un poquito, pero no tanto solo un poquito para que se vea, capa. Pero realmente queremos asegurarnos de que 10.000 dólares sean agradables y claros, y en 24 horas podemos cambiar nuestros márgenes para asegurarnos de que estamos haciendo un buen trabajo con eso . Y nosotros lo estamos. Añadamos un poco de sombra de gota a este tipo también, porque queremos asegurarnos de que esté lanzando. Ve cómo esa sombra está lanzando sobre el G, igual que eso está realmente asentado. Pero hace que se sienta más vivo. Se siente como si realmente estuviera conectando con la paz que podríamos hacer. Si queremos ser realmente fantasiosos, en cambio podemos dibujar tu propia sombra así que vamos a crear una nueva se llamaba The Shadow, y podemos dibujar nuestras propias sombras. Entonces hagamos una especie de color oscuro, solo un color negro o neutro. Consigue un pequeño cepillo redondo suave y podemos pintar en nuestra sombra aquí para el hombre. Podríamos hacer esto un poco más realista de lo que pueden los estilos de capa, porque podemos pintarlo como nos guste y luego reducir un poco la capacidad. Entonces ya sabes, cualquiera que sea el control que quieras tener sobre tus sombras de gota. Siempre puedes volver a entrar, recortar tus sombras en cualquier momento, y podríamos sentarnos ahí y alegrar esa foto y afilar. Pero creo que estamos en un punto de parada aquí, así que tenemos dos versiones diferentes. ¿ Cuál crees que se convierte mejor? El de la izquierda son el de la derecha, y así la derecha agarra más mi atención porque hay más de una respuesta emocional del hombre. Pero el de la izquierda es agradable, también, también, si estás tratando de construir una marca personal en YouTube porque tienes esta bonita, clara zoom en la cara Inter conociendo al creador de YouTube al tener algo facial reconocimiento repetido en esta miniaturas. Entonces estamos empezando a meternos en el marketing en el lado empresarial de las cosas, pero es genial. Es un diseñador para estar al tanto de esto, sobre todo aquí en intermedio, queriendo ser un diseñador avanzado de nivel palanca pensando en psicología del diseño, pensando en lo que se convierte mejor y pensando en cómo va a realmente esto ser utilizado por empresas, clientes y tú mismo es un paso realmente importante para hacerte no sólo un principiante sino un excelente diseño. 11. Proyecto miniatura de YouTube doble exposición: Sigamos adelante. Vamos a hacer esto un poco más rápido esta vez. Vamos a hacer otra miniatura de YouTube. Este es el efecto de doble exposición. Entonces digamos que queremos hacer un Tú estabas trabajando para alguien o nosotros personalmente quiere publicar videos de YouTube sobre hacer ah tutorial y photo shop. Entonces esto es para un video tutorial sobre hacer efecto de doble exposición. Incluso vamos a hacer eso, afectarnos a nosotros mismos para crear miniaturas pensadas que sería un poco divertido y necesito hacerlo Abriendo aquí una nueva plantilla fresca y vamos a usar a las fotos para esto. Vamos a usar a nuestra chica, y vamos a usar nuestro globo de aire caliente, y vamos a superponer esos y usar modos de mezcla para crear ese efecto de doble exposición . Entonces sigamos adelante y traigamos nuestras fotos y estamos a hacer click derecho. Y vamos a hacer lo que hemos hecho en la miniatura pasada. Y vamos a asegurarnos de que sea un objeto inteligente. Asegúrate de que sea un objeto inteligente. Está bien clicado. Objeto inteligente. Voy a traerlo. Por lo que ahora tenemos el máximo control sobre la resolución. No va a desenfocar un paso tan esencial que solía no hacer e incorporé eso mi flujo de trabajo no hace mucho tiempo. Y ha sido un salvavidas cuando necesito hacer la foto más grande después de haberla hecho más pequeña . Entonces en este momento solo estoy enmarcando la foto, ya sabes, sólo un poco de ver dónde me gustaría tenerla. Por lo que el objeto inteligente del que no tengo que preocuparme, siempre podría hacerlo más grande, más pequeño después. Lo mismo con esto. ¿ Qué es desbloquearlo, verdad? Haga clic en convertir a objeto inteligente y vamos a solo lo estoy copiando y pegando, y podemos seguir adelante y presionar enter y traerle la mano, y realmente quiero acercarle mucho. Yo quiero que el cielo sea capaz de llegar lo más lejos que pueda, pero quizá no pueda llegar hasta todo el camino. Consigue la talla que me gusta. Eso está bien porque tenemos un par de herramientas realmente geniales, conscientes de contenido que van a poder llenar y extender esta foto un poco para nosotros. Entonces podría incluso hacer eso solo para que podamos practicar un poco algunas de estas herramientas conscientes de contenido . Entonces solo enmarcar esto y las guías realmente me están ayudando a enmarcar esto también. Y estoy pensando en una especie de cabeza y cómo está dividida y sólo tratar de pensar a dónde irá el tipo está bien, vamos a estar teniendo una frase de tres palabras y también vamos a estar teniendo un icono de la tienda de fotos . Por lo que hay que pensar en el tipo. De lo que estoy componiendo, este es el tipo es la parte más importante de la miniatura. Por más que la imagen nos agarra, el tipo es lo que vende el video. Entonces empecemos a superponer un poco estos. Voy a llevar nuestro globo de aire caliente encima, y así es como funciona el efecto de doble exposición. Todo se trata de mezclar modos. Entonces voy a estar subiendo a mi panel de modo de mezcla por aquí para el globo de aire caliente, y voy a recorrer en bicicleta por estos y ya tengo en mente el que tengo que usar . Vamos a terminar en pantalla, así que te das cuenta de cómo la pantalla le da ese tipo de vibra realmente genial. Y quiero llevar aún más este fin. Entonces arreglemos esto como nos gusta. Estamos viendo el globo aerostático y la chica. También seleccionemos ambas capas y vamos a traerlo un poco más en un tiro más apretado . Yo quiero tener un poco más de una conexión emocional con la chica, así que solo tratar de ver donde puedo arreglar es hacerla un poco más grande. Y así ahora lo que queremos hacer es no necesitamos todo este exceso de blanco. Queremos ver un poco más del fondo del cielo. Entonces voy a seleccionar nuestro globo de aire caliente y vamos a hacer una máscara de capas teniendo Larry Mask y voy a pintar en Wanna remove? Por lo que queremos una pintura puesta con un cepillo redondo suave. Smith, Bonito y grande, Agradable y grande. A lo mejor 300. Vamos a pintar con negros que va a quitar cualquier cosa para ser un poco más grande. A lo mejor 400. Simplemente vamos a eliminar lentamente. Asegúrate de que mis capacidades estén al 100% y solo estamos sacando más del cielo en ciertas áreas así como así. Y si lo estropeamos y lo exageramos, no es gran cosa. Causa debilitar dedo del pie switchback blanco y entra y tráelo de vuelta. Por lo que es una combinación de voltear entre el blanco y el negro y de ir y venir. Y esto es exactamente por lo que estamos usando objetos inteligentes. Porque ahora quiero reducir. De verdad quiero mostrar más del globo y la chica cuando tengo la parte superior del azul siendo mostrada. Entonces ahora tenemos Eso no es gran cosa porque no podíamos reducir esto sin un tema. Entonces solo voy a cosechar esto un poco diferente. Y a veces las fotos no se estiran bien todo el camino como esto no lo haría. Esto tiene un buen fondo grande con el que trabajar. A veces no te voy a cortar un poco esto. Cortando esta imagen de fondo. Vamos a fingir que esta imagen no se estiró hasta el final, y necesitamos de alguna manera estirarla a través. Lo que solía hacer es duplicar el fondo y reflejarlo y golpearlo ahí arriba para obtener una especie de look sin fisuras. Pero eso no siempre es práctico. Ahora que tenemos herramientas conscientes del contenido, hace que sea mucho más fácil el servicio. Voy a dibujar una caja aquí, tener mi fondo seleccionado, voy a hacer algún contenido consciente relleno. Voy a subir a editar, Voy a ir al contenido consciente fill. Por lo que edita, relleno consciente de contenido. Nos va a preguntar dónde queremos una muestra esto para que básicamente se replica. Voy a duplicar muestra con lo que está en verde. Se va a duplicar en el cuarto fin de semana blanco, borrar ciertas partes si no queremos que cierta nube se interponga o no queremos que se muestree la nube. Siempre podemos cepillarlo. Haga clic en Aceptar, y automáticamente va a poblar con lo que piensa. Es bueno probar algo de esa zona y crear a este tipo así. Como pudiste ver, contenido consciente y contenido, las herramientas de Phil no son perfectas. Podría ver este pequeño tipo de mirada distorsionada, y fácilmente podemos parchear eso un par de maneras. Tengo nuestro objeto seleccionado. Cuando lo haces, las herramientas de clon tienen la herramienta de clon que puede muestrear y clonar. O podría hacer la herramienta de pincel de sanación puntual y pintada. El problema con eso de tener capas inteligentes es cuando tienes capas inteligentes encendidas, no te permite hacer esto. No te permite editar la capa directamente porque sigue siendo un objeto inteligente, por lo que tendrás que hacer clic derecho y tendrás que rast surgir la capa. Entonces ya hice eso, así que rast me levanto la capa. Ahora es solo cualquier foto vieja que podamos editar y hacer. Entonces esa es una limitación a las capas inteligentes cuando comienzas a entrar en la fase de edición para que pudiéramos hacer la herramienta de clon en esta camarilla de muestra y clonarla fuera, se incluyeron. O podrías hacer esta herramienta de pincel de sanación puntual, que está justo aquí arriba. Herramienta de cepillo de curación puntual. Y tú también puedes hacerlo de esa manera . Pero normalmente encuentro más control con la herramienta de clon con cosas como esa. Entonces está clonado la parte superior de la cosa y solo tienes que hacer click en eso y no parece que hicimos nada, ¿verdad? Vamos a alejarnos. Es hora de agregar tipografía. Me siento bastante bien con la imagen de fondo, así que tenemos esa, um, capa de globo superior. Está en pantalla, sólo una especie de revisión, y nosotros hicimos el efecto de doble exposición. Entonces seguí adelante y precargé algún texto de muestra todo este aire en diferentes líneas para que podamos tener el máximo control sobre cómo arreglamos el tipo. Entonces vamos a tratar de averiguar dónde sería lo que sería un buen tamaño para el tipo. Hagamos todo un poco más grande. También queremos hacer espacio para un icono de la tienda de fotos. En algún lugar de ahí abajo, arreglemos en lugar de tratar de hacer el look de capa y ponernos todos locos. Este es realmente el punto focal de la foto. Queremos mantener el tipo y la foto cerca, pero no queremos que todo interfiera. Vamos a tener un bonito look limpio con esto. Vamos a tener un look más tradicional con esto es. Bueno, la última fue esta tipografía san serif muy audaz, gruesa. Vamos por una Sarah más elegante de tipografía, y tengo un tipo de en mente que quiero probar. Entonces conseguí un doble clic en esto y ver si no puedo conseguir una cara gorda de Brill. Podría simplemente escribirlo en una B están ahí está. Esta es otra cara de tipo adobe, pero también hay varias alternativas en las fuentes de Google. Si no tienes acceso a la suscripción Ah, las fuentes adobe, las fuentes adobe, que obtienes de forma gratuita con cualquier suscripción a adobe creative cloud donde puede usar estilos de carácter para peinarlos rápidamente. Pero como solo hay tres, solo voy a hacer manualmente los tres. Entonces, ¿cómo vamos a conseguir una multa? Pero queremos encajar estos juntos como una pieza de rompecabezas. Entonces busquemos un buen arreglo. Entonces tienen estos dobles efs pasando aquí, Así que me pregunto si podríamos meter eso en esta pequeña área abierta. Entonces notaste que no lo estoy haciendo demasiado apretado, y no estoy teniendo estos grandes vacíos. Entonces si tuviera veo a muchos estudiantes hacer esto, tendremos grandes brechas, pero no se siente muy conectada como una frase unificada. Por lo que queremos asegurarnos de que cerramos un poco la brecha. Simplemente encontrar formas de alinear las cosas y meter las cosas y ver si eso funciona tendría algún espaciado, pero no tanto que no parezca una sola unidad. Entonces vamos a traer toda esta unidad y encontremos un buen arreglo. E incluso podemos traer esto ya que esto no tiene nada que vaya más allá de la línea de base. Entonces esa es tu línea de base. Cualquier cosa que baña abajo. Entonces esta es tu línea de base. Tienes la P que baja abajo. Pero no tienes eso en estos en el doble, así que podemos sentirnos libres de mover eso en cualquier posición que nos guste. Podríamos hacer una especie de, ah, arreglo apilado así. Y adelante, hacer nuestras Pruebas de visibilidad ascienden al 50%. ¿ Puedo leerlo? Ya sabes, ¿necesito cortarme las cosas un poquito? Estoy usando mis teclas de flecha para mojar ligeramente las cosas a la izquierda y a la derecha. Simplemente me parece más fácil usar mis teclas de flecha por solo hacer movimientos muy pequeños y notar. Todavía no estamos usando la grilla. Eso está bien. Vamos a usar mucho lo grande. Pero cuando se trata de este tipo de miniaturas, sabes que la cuadrícula es genial de usar, pero lleva mucho tiempo y realmente tienes que formular eso. Por lo que a veces es bonito diseño específico del globo ocular del dedo del pie, y algunos la cuadrícula realmente será útil. Añadamos una ligera gota. Sombra aquí está agregando esa ligera sombra de gota para agregar un poco de profundidad. Y ahora necesitamos un elemento más para hacer esto completo. Y ya terminamos con nuestra miniatura. Por lo que necesitamos un pequeño icono de la tienda de fotos. Entonces vamos a por el nuestro. Quebec para ver. Asegurémonos de los extras que estás mostrando su dragger. Asegúrese de que las capas de margen en la parte superior. Entonces solo hazte una idea. ¿ Hay algo fuera de ella? ¿ Podemos como que cambiamos todo? Y también podemos ser capaces de encontrar una bonita colocación para nuestro icono de la tienda de fotos. Entonces voy a traer un PNG que encontré en Google justo el tipo de tu icono de la tienda de fotos estándar Creative Commons PNG. Y a veces podría encontrarlo con un fondo blanco. Pero tu diseñador intermedio, podría perforar ese fondo blanco y encontrar este ícono. No hay problema para encontrar estos iconos. Están por todas partes, así que solo lo voy a activar. Vamos a encontrar la colocación correcta o los márgenes realmente nos van a ayudar a guiar la colocación de nuestro ícono. Entonces ahora podemos hablar. Márgenes ALOF. De acuerdo, así que esa es una buena colocación. Márgenes tipo de nos ayudaron a averiguarlo. Me encantaría hacer una sombra de gota realmente dramática con el ícono. Sigamos adelante y hagamos sombra caída y especie de ver qué podemos hacer aquí. Voy a hacer una distancia muy amplia. Por lo que parece que está echado lejos sobre el fondo, y voy a hacer un poco de desenfoque aquí con el tamaño. Y una vez más, mi capacidad no es súper fuerte porque eso no se ve muy bien. Pero cuando lo reduciste, como que le da un aspecto más realista click en. OK, entonces tenemos ese bonito look de especie de una sombra descolorida lejana para el ícono, y esencialmente estamos terminados con éste mucho más rápido que el 1er 1 Así que pudimos hacer eso muy rápidamente. Entonces hagamos una prueba de visibilidad más antes de exportar. Ahí está. Vamos a seguir adelante y practicar la exportación y podemos pasar al siguiente proyecto iba a ir exportación de archivos. ¿ Vas a hacer una exportación? As Y así esta es una nueva forma desde 2019 y creo que 2000 2020 versión de photoshop también tiene. Es decir, estoy usando 2020 pero creo que también hizo esto para la versión 2019. Si no ves esta configuración de archivos de exportación de la misma manera, aún tienes las mismas opciones. Simplemente está arreglado o se ve un poco diferente. Obtienes una bonita vista previa esta vez donde las versiones anteriores de Photoshopped no te dieron una vista previa realmente bonita. Entonces esto es agradable. Podemos previsualizar, asegurarnos de que no tengamos nada por los lados saliendo y podemos seguir adelante y comprobar en el tamaño es Todo se ve realmente bien y queremos hacer un J. Peck. Entonces vamos a subir aquí a la configuración de archivos. Queremos hacer una clavija J y asegurarnos de que la calidad sea del 100% porque YouTube siempre va reducir el tamaño de la fuerza si es necesario. ¿ A qué se va a exportar? Y si bien esto es por supuesto, todo lo que hagamos en esta clase va a ser un modo RGB. Eso todas las plantillas que suministre y todos los nuevos documentos van a crear todos van a ser un modo RGB. Por lo que solo para asegurarnos de que es look rgb en exportación y ahí estás tú. Las miniaturas de tubo que se crearon en unos 45 minutos fueron capaces de batir un par de versiones diferentes de estas miniaturas. Por lo que ojalá te pongas lo suficientemente rápido y rápido como para poder batir juntos algo que se ve así terminado en unos 20 minutos. eso quieres filmar para hacer una miniatura de YouTube de muy alta calidad con imágenes que ya se suministran. ¿ Quieres poder crear eso de forma rápida y eficiente para que puedas cobrar tu dinero y ganar tanto dinero como sea posible o crear tanto contenido como sea posible, pero también mantener alta la calidad. Entonces llegamos a estudiar un poco las miniaturas de YouTube. Por lo que a continuación vamos a armar toda una campaña de redes sociales y marketing digital. Por lo que esto va a incluir Instagram Facebook. También vamos a estar haciendo anuncios de display también, así que vamos a tener esta campaña unificada. Esto se basa en proyectos de clientes reales que hice. Tenía un cliente por más de 10 años, e hice todos sus artículos de redes sociales y marketing digital, y este es exactamente el tipo de cosas que haríamos. Está basado en un trabajo de cliente real que he hecho en los últimos 10 años, así que vamos a estar saltando a eso siguiente 12. Proyecto de campaña en redes sociales: usted. Ahora vamos a conquistar toda una campaña en redes sociales y también algunos anuncios de display digital también. Y este es un trabajo muy común para que un diseñador gráfico haga. Y es por eso que realmente quería tener un enfoque especial en este tipo de proyectos y hacer que todos los diferentes tamaños sean los tamaños más populares involucrados. Entonces tengo esta empresa ficticia empresa llamada Travel Loop que creé, y tengo especie de este pedacito de un tablero de marca, o supongo, al menos algunos activos de marca, como un logo en un lema y un par de diferentes relojes de colores. Yo quería proporcionarle esto. Para que no tuviste que sentarte ahí y llegar a tu propia empresa. Ya tenemos uno fuera de la caja para usar para nuestra campaña. Por lo que son una agencia de viajes, y les gusta reservar localizaciones exóticas, por lo que tienen un especial, exótico de gama alta, um, tipo de sensación al tipo de paquetes de viaje que ofrecen. Entonces de eso se va a tratar exactamente nuestra campaña. Es un poco de conciencia de marca, y va a haber un poco de descuento temporal y algunos de los anuncios. Pero vamos a hacer una especie de campaña genérica en Facebook y también algunas de las cosas que van a necesitar para su perfil de negocio y perfiles de redes sociales. Por lo que puedes descargar esto como recurso descargable está en esta clase. Se llama Travel Loop logo file dot ai. Es un archivo ilustrador, y quería hablar un poco de bibliotecas. Entonces aquí está su panel de biblioteca. Por lo que si tienes una suscripción a Adobe creative Cloud, puedes subir ciertos archivos a la nube, que son tus bibliotecas. Podrías acceder a esto en tu ventana e ir por las bibliotecas del dedo del pie, y podrías arrastrar ciertos elementos hacia adentro. Y luego cuando estes haciendo estallar a la tienda de fotos, puedes sacar ese elemento. Algunos te van a mostrar cómo usar esto. No todos tendrán acceso a la suscripción de Adobe, pero para quienes sí lo hagan, es un TSA Nice acelera tu flujo de trabajo cuando estás tratando de conseguir archivos de ilustrador a photoshop, y viceversa. Entonces digamos que quiero que se guarden algunos de estos logotipos. Puedo arrastrar esto hasta mi biblioteca, y lo va a guardar como gráfico, y también puedo hacer las muestra de color también. Entonces si quisiera agregar estas dos muestreas a mi biblioteca y recordarlas cuando estoy en la tienda de fotos , excepto para bajar aquí a mi en la ventana de mis bibliotecas y dar clic en el signo de adición y vamos a añadir el color de relleno, selecciona esto y nota cómo el color de relleno cambió por aquí y agregó, Esta es una buena manera de agregar muestras. Sé capaz de tirar arriba en el diseño de cualquier otro programa de Adobe, y podrás tener las mismas muestras de color en todas partes. Realmente ayuda cuando estás haciendo grandes campañas de marca y campañas de marketing que abarcan múltiples programas de adobe. Pero si no tienes eso, está bien. Todavía podemos hacer algunas otras formas de meter cosas ahí dentro. Voy a seguir adelante y guardar este logotipo. Va a estar arrastrando algunos de estos activos por encima porque puede que necesite un diferente un par de arreglos diferentes. Ahora mismo tenemos uno. Es por eso que haces esto. Hago logotipos y a todo color, pero también tengo una versión todo en blanco que podría funcionar sobre un fondo oscuro y ya verás cuando hagamos nuestras campañas en redes sociales. Cómo tenemos. Podríamos tener un montón de diferentes tipos de fondo trabajo de dedo con un montón de diferentes tamaños. Por lo que es agradable tener un logo que sea muy flexible, sencillo. Se puede adaptar a cualquier fondo de color. Entonces por eso cuando sí enseño diseño de logotipos, por eso la simplicidad importa. De verdad te vas a enterar aquí cuando vamos a hacer algo. De verdad, agrega Tiny. También vamos a hacer algunas adiciones más grandes a. Entonces, ¿qué va Arrastrar unos cuantos estos activos? Bueno, así que digamos que no tuve acceso a Theodore Be creative cloud. Por lo que no tuve acceso a este sistema de bibliotecas porque todo esto está almacenado en el Adobe Cloud. Siempre puedo distraer sobre mis logotipos, Así que tengo que arrastrar esto a Adobe Photo Shop, y va a seguir adelante. Si viene de ilustrado una tienda de fotos. Va a ser un objeto inteligente vectorial, lo cual es realmente genial, porque va a ser capaz de escalar más grande y escalar más pequeño sin perder la resolución. Entonces eso es un realmente, realmente bueno mantener eso como un objeto inteligente vectorial, porque vamos a estar aplicándonos a una tonelada de tamaños diferentes. Entonces esta es la plantilla que puedes descargar. Al igual que con todos los proyectos de esta clase, puedes descargar una plantilla. Ya tiene tamaño para ti y con tablas de arte. Por lo que podrás tener todo el tamaño está aquí para ti. Entonces primero vamos a empezar con lo más fácil, que es la foto del perfil de Facebook. Entonces esa es la pequeña púa que se sienta junto a la página de negocios en la página de negocios. Por lo que esto será probablemente lo más fácil de hacer. Vamos a volver a Illustrator. Vamos a ver qué elementos de marca tenemos que podrían funcionar. Ahora, este es nuestro logo. Entonces hay que tener un debes tomar un logo que sea tipografía pesada y muy horizontal y tratar adaptarla a un tamaño cuadrado. Entonces este es el tamaño cuadrado al que necesitamos adaptarlo eso. ¿ Cómo hacemos eso? De ninguna manera vamos a poder encajar todo el tipo en la foto del perfil. Se va a ver demasiado pequeño, demasiado horrible. Al igual que esto. Podríamos dividirlo, dividir el logo para que esté apilado y hacerlo un poco más grande y tenerlo apilado Esa es una opción. O podríamos tomar un elemento de marca y sacarlo en su lugar como una especie de icono. Entonces eso es exactamente lo que vamos a hacer. Vamos a aislar. Se va a copiar este logotipo, y vamos a aislar estos pequeños anillos, porque eso es una especie de aspecto único de este logo y marca. Por lo que realmente vamos a enfatizar que esto se trata un poco de branding así como diseño. Entonces voy a traer esos bucles y ponerlos aquí, y podemos hacer un bonito fondo de alto contraste. Entonces sólo vamos a hacer una especie de agradable con colores más amplios en desde su biblioteca. Entonces aquí está mi panel de biblioteca. Esto va a traer esas muestra de color donde puedes distraerlo como una caja sólida de Illustrator y solo toma la herramienta cuentagotas. Voy a agregar una nueva capa y pagó herramienta de cubo. Y así como así, se nos ocurrió una pequeña foto de perfil de Facebook. Ese tipo de charlas explica o tipo de realmente luce ese detalle único y profundo de branding. Necesitamos realmente encontrar alguna fotografía increíble para este proyecto. Y ojalá el cliente te suministre algo de fotografía personalizada. Pero si no, siempre puedes comprar eso o confinar fotos libres para usar. Entonces vamos a hacer justamente eso por este proyecto. Vamos a ir al punto com de Peck sal y vamos a teclear. Simplemente vamos a intentar tipear en viajes. Vamos a ver como se sienten realmente las imágenes Se conectan con la marca. Por lo que esta es una agencia de viajes de gama alta. Reservan localizaciones exóticas. Realmente queremos un wow ellos con el tipo de ubicaciones que solo sueñas visitar porque sienten que son costosas. Sienten como si estuvieran fuera del alcance. Pero queremos que esté al alcance de la gente. Queremos que la gente vea estas fotos y diga, quiero estar ahí. Esa es una ubicación realmente única. Entonces no queremos hacer nada genérico como el avión volando, porque no creo que la gente realmente se conecte con eso. Entonces realmente estamos buscando esa imagen con la que realmente podamos resuenar. Esta es una especie de foto de viaje genérica, y he usado esta en el pasado, pero es Podría estar en cualquier lugar. Es sólo una estación de tren. No es esta ubicación increíble, única, así que esto es un poco más de lo que estoy hablando. Esa es una ubicación muy única con la montaña allá senderismo, están haciendo algo un poco fuera de alcance son un poco fuera de lo común. Esta sería una buena foto de usar porque es muy personal. Tienes a la persona ahí mismo. Es una conexión muy emocional. Ella me está mirando a mí. Se siente muy natural y orgánico. Por lo que esa sería otra opción para campaña específica. Fotos como este funcionan muy bien, pero me falta a la persona. De verdad quiero ponerme en los zapatos de viajero cuando estoy mirando a AD. Por lo que realmente me gustaría encontrar tomas que tengan a una persona haciendo algo de fondo y no sólo un tiro hermoso y por qué este está bien. Es una ubicación muy única, probablemente lo más probable en Europa. Yo como que no me conecto con la persona. En primer lugar, está un poco borrosa. Ella no es el punto focal de la foto y ella nos da la espalda así que sólo se siente ah poco desconectada, así que sólo un poco de pasar por el proceso de cuando selecciono fotos tipo de lo que estoy pensando . Ahora éste es más o menos exactamente lo que busco. Tiene a esta mujer. Ella sí tiene nuestro turno de espaldas hacia ella, pero tiene es muy único. Pose vestido muy único. Es como que lo compensa. También tenemos esta maravillosa oportunidad de crear algunos anuncios verticales con esto porque es muy alto. Y me gusta encontrar una mezcla de fotos verticales y horizontales porque vamos a tener una mezcla Ah, publicidad vertical y horizontal y publicaciones en redes sociales. Por lo que es agradable tener variedad con el recorte de tus fotos. Y esto es muy alto y grandioso y emocionante y único. Exactamente lo que la empresa, el tipo de cosas son la empresa estará reservando para nuestros clientes. Entonces definitivamente esa es una que voy a estar descargando. Este es otro que vamos a estar usando. Y la coloración se puede cambiar un poco. Podemos hacer eso en Adobe Photo Shop. De verdad quiero sacar color más vibrante en esto, Pero eso está bien porque ahora somos diseñadores intermedios y podemos agregar puesta de sol y todo tipo de cosas para realmente hacer que esto salga un poco más. Pero yo Lo que me encanta de esta foto es que tiene un montón de antecedentes con los que trabajar. Por lo que podríamos poner un titular o un tipo encima de esto y tener mucho espacio t tener diferentes elementos de diseño. Entonces es solo un trabajo fotográfico realmente bonito con mucho espacio. Entonces vamos a estar usando esa, y puedes encontrar todas estas solo escribiendo y viajando en píxeles y siéntete libre de usar diferentes fotos. Tengo enlaces a las fotos, las cuatro principales que vamos a estar usando para esta campaña. Podrías encontrar que en la guía de recursos todos los enlaces, pero siéntete libre de usar diferentes fotos. Si quieres desafiarte un poco más en este proyecto, este es otro ejemplo de una foto. Pensarías, Oh, cómo eso realmente me llama la atención. Ahí hay una persona. Están haciendo algo exótico y emocionante, pero no hay un montón de espalda. No hay antecedentes para ello. Es este tipo de cielo y es agua. Esta persona podría estar en una piscina realmente agradable en algún lugar y no lo sabríamos. Por lo que no tiene del todo esa atención agarrando mirada a ella. Y aquí hay otro ejemplo de una foto que tiene la ubicación que tiene una persona en ella, pero ella le da la espalda. Ella sí tiene este lindo movimiento expresivo con sus manos, pero yo simplemente no estoy resonando ni conectando con él. Yo sólo siento que ella sólo está posando. No está auténticamente comprometida con el fondo ni con la foto. Ella sólo está posando, así que como que queremos evitar esas fotos donde simplemente parece que están tratando de conseguir una buena foto. Se quiere conseguir a los donde están haciendo algo ahí. Ahí se están riendo con amigos. En realidad están en medio de una caminata. Ya sabes, este tipo de tomas de acción son mucho mejores que estas tomas tipo pose para ¿Qué estabas buscando? 13. Proyecto de campaña en redes sociales - 2: tienes varias fotos impresionantes que hemos seleccionado de pixels dot com que podemos usar para nuestra campaña tipo de algunos entornos realmente wow con gente en cada uno de ellos. Entonces podemos conectarnos y resonar con esas personas. Entonces lo siguiente que vamos a hacer es la foto de portada de Facebook. Por lo que las fotos de portada iban a ser bastante fáciles a menos que tengan una promoción específica que quieran promover. Pero vamos a ir a hacer un simple logo y una foto y tal vez algunos pequeños elementos de marca. Vamos a tratar de averiguar cómo extender un poco esta marca. Entonces encontremos aquí nuestra foto para nuestra foto de portada. Esta va a ser más página principal de negocios. Pensé que nos quedaríamos con este. Por ahora. Es bonito y ancho, hendiduras muy horizontales nos van a dar mucho espacio para recortar esto realmente Bueno, eso es lo que puedo hacer es que puedo arrastrar esta foto a la tienda de fotos, y cuando arrastras una imagen dentro , va a automáticamente convertirse en un objeto inteligente, lo cual es realmente bueno para nosotros porque queremos poder escalar esto hacia arriba y hacia abajo sin perder ninguna resolución. Entonces solo podemos hacer esto, meterlo en este tablero de arte y centro de prensa en particular. También hay otra forma de llevar a la fotografía, y él podría hacer eso usando contenedores en contenedores o justo aquí en tu barra de herramientas tenía que cambiar mi espacio de trabajo para poder encontrarlo. Pero ahí está. Ahí hay contenedores. Podemos hacer un pequeño contenedor aquí estirándose a través, y luego podemos arrastrar su foto de esa manera, y se va a poblar automáticamente en el contenedor y fue genial eso es que no tienes que sentarte ahí y tomar esta gigantesca foto y seguir dimensionándolos hacia abajo. Se poblan automáticamente en ese contenedor en particular. Entonces, sólo otra forma, otra forma de despellejar a un gato. Entonces encontremos el recorte correcto para esto es cuando probablemente necesitemos acercar y realmente tener una idea de cómo se debe recortar esto para que estés notando que se ve un poco pixelado. Esta es una imagen digital, y es un tamaño particular, y siempre puedes comprobar el tamaño de nuestro tablero seleccionando el título que se acerca a tu herramienta de movimiento. Podrás ver el tamaño, Así que esto es solo 828 pixels por 315 pixels. Ese no es un tamaño muy grande, así que naturalmente vas a ver ah, poquito de picos, euforia. No es nada malo, pero cuando estás acostumbrado a trabajar con diseño de impresión y todo es súper nítido, irás. Oye, está borroso. Y eso es normal cuando estás trabajando con tallas así de pequeñas. Por lo que actualmente está en un contenedor así puedo hacer doble clic en cualquier contenedor y poder cambiar esto a mi gusto. Queremos realmente traer a la gente a la foto, así que queremos tal vez hacer un alineamiento central con Hiss Body. Queremos tener algún bonito cielo despejado para poder colocar nuestro logo en. Entonces vamos a entrar en illustrator, o puedes entrar en tu panel de bibliotecas o lo voy a hacer al revés y simplemente arrastrarlo desde Adobe Illustrator. Por lo que tenemos varios artículos diferentes que podríamos traer. Nosotros yo podríamos hacer el todo blanco Vamos a seguir adelante y probar esto así que es realmente tipo de trabajar con tus variaciones de logo y averiguar cuál va a funcionar mejor para que pudiéramos hacer un blanco sólido hacer un poco de sombra gota, pero no es va a ser súper fuerte. Entonces vamos a ver si podemos probar una versión a todo color y ver si realmente sale lo suficiente contra el cielo. Y si no, tenemos tienda de fotos. Siempre podemos editar la foto para hacer lo que necesitamos que haga. Tenemos un logo a todo color y el naranja se pierde un poco en el cielo, pero eso no es gran cosa. Entonces una cosa que quiero empezar a hacer es pensar un poco en rejillas y guías y chasping y formas. Podemos asegurarnos fácilmente de que encontremos el punto central, como queremos asegurarnos de que esto ahora esté centrado en el documento. Entonces tengo estas guías encendidas, lo cual podría ser realmente útil. Así que asegúrese de tener sus guías en un movimiento esto alrededor. Me está dando indicaciones de dónde está alineado en el centro, y tengo esa pequeña indicación aquí mismo. Es una especie de complemento en su lugar para mí, y eso es súper útil. Para encender eso, ve a ver y asegúrate de que snap esté encendido y asegúrate de que tu Zahran extra también, por lo que eso te ayudará con un poco de alineación en lugar de tener que romper la rejilla y meterte todos con eso, automáticamente tipo de encontrar ese punto de alineación central. Entonces hagamos doble click en este contenedor y veamos si no podemos conseguir un mejor cultivo aquí. Podríamos incluso pintar en un color más claro, más amplio. Esa es una forma más rápida y fácil de hacerlo. Por lo que sólo estoy consiguiendo un cepillo redondo suave. Pero mis cepillos generales hacen redondo suave lo hacen agradable y grande. Iba a pintar un poco de blanco en una nueva capa, así que solo creando una nueva capa van a estar pintando de blanco alrededor del logo. Pero eso se ve horrible, pero eso no es gran cosa, porque podemos usar un modo de mezcla en esa capa para un tipo de suavizar y mezclar eso o simplemente reducir la capacidad. Sólo necesito un poco de blanco detrás de ese logo. También puedes agregar estilos de capa y hacer un resplandor externo. Pero siento que tengo más control cuando como que agrego una capa de blancura, por lo que ese tipo de ayuda a que salga, sobre todo en el cielo naranja y naranja. Entonces esto necesita algo. Hagamos una prueba de visibilidad. Alejemos el zoom a alrededor del 100%. Entonces me gusta la foto. Se extiende la distancia realmente bien. Y hay algo de lo que hay que estar al tanto cuando se trata de móviles ver esto y la versión móvil de Facebook y esa es la zona segura para móviles. Voy a sacar mi panel de capas para que puedas ver de qué me refiero. Para tener esta caja fuerte móvil aquí, voy a arrastrar esa capa encima de ella para poder ver dónde está eso. Aquí es donde se derrumba en vista móvil. Por lo que recorta los lados izquierdo y derecho. Por lo que siempre hay que estar al tanto de no poner ningún texto en los lados izquierdo y derecho porque no se va a ver en la vista móvil. Entonces si tienes mucho texto en la imagen de portada de tu página de negocios, necesitas mantenerlo ahí en el centro para que puedas hablar todo eso encendido y apagado para especie de darte una guía. Entonces agreguemos otro elemento de marca porque estamos perdiendo gente aquí. Vamos a conseguir algo en esos lados izquierdo y derecho que pueda derramarse al centro y realmente llevar a la gente a los colores y al tema de la marca. Entonces una cosa que podemos hacer es tener estos círculos. Un poco de parte de la marca es un círculo. Tomemos esa forma circular y expandamos eso un poco y lo usemos como elemento de fondo . Entonces lo que voy a hacer es que me voy a llevar ambas. Empecemos con el azul. Simplemente voy a hacer que sea un poco de un elemento que se derrama hacia un lado. Nada demasiado grande solo agrega un poco de pop de algo que pasa ahí en el documento . Y también queremos tal vez conseguir algo de ese hermoso fondo brilló por aquí para que solo podamos reducir la transparencia de estas capas tipo de dejar un poco de ello detrás de la guerra. Podemos mirar sus modos de mezcla para ver si eso tiene un poco de mejor sensación, pero parece que estos fueron bastante duros. La luz dura se ve bastante interesante, pero es muy dura. Por lo que tal vez solo quieras hacer una reducción de capacidad. Justo, dejemos que ese fondo continúe y se avergüence de detenerlo y tener un color sólido. Cuando tienes un fondo tan hermoso así como ese, agregamos solo un poco de elemento. Y Poppy podría hacer esto con cualquier otro elemento de diseño. Entonces esa es sólo una especie de tu primera foto de portada de Facebook sencilla para este proyecto. Ahora vamos a empezar a pensar en marketing y publicidad. Esto va a ser un anuncios de Facebook de pago y hay algunas restricciones con los anuncios de Facebook de pago. En primer lugar, ahí, ahora mismo, uh, durante esta filmación, por supuesto, el tamaño siempre podría cambiar. Pero ahora mismo son 1200 pixeles por 628 así que es muy ver es muy horizontal. Entonces, una vez más, tenemos que buscar una foto que vaya a ser horizontal amigable, y necesitamos mantener el texto del dedo del pie menos del 20% del anuncio total, por lo que rechazarán tu anuncio si tienes demasiado texto en él. Y recuerda, un anuncio de Facebook también tiene un título y copia corporal que va con él en el post para que no tengas que sentir que necesitas meter todas las palabras en el anuncio de Facebook. Es realmente una ayuda visual que complementa el texto que va con el post. Entonces, estar pensando en eso. Trata de no meter demasiado texto en un anuncio de Facebook. Sé que es muy tentador, y necesitas educar a los clientes si quieren que pongas un montón ahí que no está permitido. dedo del pie tiene más del 20% de la superficie total. Sé texto. Estamos teniendo eso en cuenta cuando hacemos nuestro primer anuncio pagado de Facebook. 14. Proyecto de campaña en redes sociales - 3: primer lugar, al hacer y agregar muchas veces, la foto es la parte más importante del anuncio, seguida del titular y el siguiente, El llamado a la Acción. Entonces muchas veces, cuando estoy lluvia de ideas como hacer un anuncio de pago, empezaré con una foto que quiero usar y luego construiré encima de eso porque siempre va. La foto me ayudará a enmarcar mi titular y mi tipo. Entonces vamos a liderar con la foto. Tienes varias opciones aquí, y todas tienen una especie de propósito realmente único Cuando yo cuando las encontré y quería usar realmente esta, sé que esto es vertical, y vamos a usar esto para una historia de instagram más adelante. Pero creo que todavía puedo usar esto como una gran opción. Entonces voy a arrastrar esta foto a la derecha en Photoshopped o usar un contenedor. Encontremos una manera de recortar esto. Me encantaría que pudiera recorrer todo el camino a través de la pantalla. Entonces en términos de cultivo, podemos tenerla ahí, o podemos mostrar más de este maravilloso cielo. Entonces voy a recortar esto lo más apretado posible. Siempre podemos acercar la foto más adelante a medida que empezamos a desarrollarla. Entonces, ¿cuál es la siguiente cosa importante con un anuncio? Y quiero asegurarme de que traigo mi margen. Este es nuestro margen. Puedes activar esto a menudo solo para asegurarte cuando añadimos tipografía y añadimos un llamado a la acción que nada extiende nada. Ese es el texto se extiende al margen. Así que siéntase libre de activar y desactivar eso como una guía útil de ayuda. Por lo que ahora el titular. Por lo que ya tenemos cabeza. Tengo un titular escogido. Um, el cliente lo suministró, o el cliente ficticio lo proveería para usted. Y el titular es Tu exótica aventura espera eso. Fue un poco agradable lanzar la palabra exótico, ya que eso es una especie de lo que nuestra marca está construida. Entonces voy a seguir adelante y agregar la tipografía solo voy a hacer cuadro de texto pegarlo en. Entonces ahí vamos. Te espera tu exótica aventura, y necesitamos encontrar una manera de que esta tipografía destaque por encima de la foto. Hay cajas que podemos ponerlo detrás hay sombras de gota que podemos usar, pero realmente quiero no quitarle la foto agregando cajas grandes, blocky o cualquier cosa que ayude al destaque. Entonces una cosa que podemos hacer es hacer que la tipografía sea bonita y audaz. Entonces ahora mismo voy a seguir adelante y hacer doble clic en la tipografía. Y ahora mismo está puesta en luz. Se trata de ferrocarril, que es una fuente gratuita que puedes descargar en fuentes de Google. Hagamos de esto una espera audaz bajar Lo audaz y lo más audaz en el ferrocarril es y parece que aquí arriba y mirarlo de alguna manera se puso las fuentes un poco fuera de orden y realmente negro va a ser aún más audaz que extra audaz. Entonces el negro es siempre tu tipo más grueso, uh, uh, cara apretada. Espera, Así que vamos a seleccionar Negro Por alguna razón, está fuera de orden en mi lista, pero eso está bien, porque sé que el negro es el más audaz. Entonces vamos a ver cómo podemos apilar este debilitar. Apila esto en una alineación izquierda a la derecha, y tenemos una especie de esta pared de ladrillo que realmente puede ayudar a que la tipografía destaque. Eso es una cosa que podemos tener un lindo llamado a la acción por la derecha. Esa es una opción. Pero ahora quiero empezar a traer algunos otros elementos de diseño. Entonces yo como que sé qué espacio tengo para el titular. Necesitamos tener el logo. Entonces vamos a traer el logo. Y ya tenemos eso desde aquí arriba y lo que realmente quiero hacer, Lo que puede ser requerido por el cliente es usar el logo con el tagline. Tenemos el lema aquí. Por lo que ese tipo de ayuda a traer esa palabra exótica y atarla a la campaña. Entonces vamos a ver qué podemos hacer con todo el color. Es posible que el color completo no funcione. Entonces déjame ver si no puedo hacer un color blanco sólido por esto. Tenemos una foto muy detallada, no estoy seguro de que el color sólido realmente va a funcionar ahí. Entonces, vamos a traer eso. Y esto puede necesitar un poco de fondo, y no necesita ser súper grande solo lo suficiente para ver el logotipo y tener algún reconocimiento de marca . Entonces sigamos con el tema del círculo que hemos tenido. Sólo voy a mantener pulsada opción y arrastrar para hacer una copia y la estoy trayendo a este tablero de arte . Y veamos si no podemos usar esto como un gran fondo sobre la foto así como eso. Y creo que como sí tenemos un fondo azul, podríamos incluso ser capaces de escapar con un logotipo a todo color. Y lo que podríamos necesitar hacer es traer nuestro semi a todo color. Entonces notaste cómo teníamos muchas opciones diferentes aquí, así que tenemos un solo color a todo color. También tenemos esta otra opción que tiene color pero también tiene blanco en ella, que sea agradable tener opciones. Creo que eso va a funcionar lo mejor. Es por ello que tienes muchas versiones diferentes de tu logo, por lo que podrías tener la máxima flexibilidad con tus opciones cuando realmente empieces a usarlas . Por lo que podría necesitar hacer el círculo un poco más grande. No quiero que ocupe mucho espacio porque es una foto tan hermosa. No queremos quitarle la foto. Definitivamente queremos que la gente sea capaz de reconocer la marca. Los nombres solo estaban haciendo algún posicionamiento. Podríamos alterar su margen. Asegúrate de que estamos a salvo ahí y va a estar chasqueando porque tengo guías sobre esto podría estar chasqueando para que me ayude a luchar contra una posición. Por lo que sí necesitamos un llamado a la acción también. Entonces tenemos un titular, un logotipo, y ahora necesitamos un ¿Entonces qué? ¿ Cuáles son tan qué? Eres exótico Aventura espera libro ahora Aprendido Mawr. Ya sabes, muchas veces con anuncios de Facebook de pago, puedes poner un botón no en la foto sino justo debajo de la foto. Por lo que a veces tu llamado a la acción en realidad no tiene que estar en la foto. Podría ser parte del anuncio, un anuncio total. Entonces, estar pensando en eso también. Por lo que en este caso, el botón va a estar debajo de la foto, por lo que no necesitamos tener un libro ahora llamado Botón de Acción, porque al hacer clic en agregar y Facebook, clic en la foto. Hace que la foto sea más grande, pero en realidad no te lleva a la página de aterrizaje. Eso es lo que hace el botón de abajo para que vamos a dejar que eso exista fuera de la foto, además Queremos asegurarnos de que tenemos menos del 20% del área total del anuncio no retomado por texto, y creo que así es aquí. Entonces ahora todo lo que tenemos que hacer es trabajar en nuestro titular y estaremos prácticamente listos para salir. Me encantaría equilibrar un poco esto, sobre todo del lado derecho. Me pregunto si podemos traer solo manteniendo la opción y arrastrar nuestra pequeña naranja en círculo es agregar un poco de equilibrio en ese lado derecho y hacer cumplir los colores de la marca y los activos de la marca. Entonces, hagamos que nuestro titular finalicen. De lo que noté es que me gusta me gusta el tipo blanco. Realmente aparece aquí abajo, pero como que se desvanece aquí, así que casi me pregunto si podemos encontrar una oportunidad para tal vez acercar un poco más en ella y apilar de esta manera, pero casi me pregunto si no podemos hacer una especie de poquito de filo dentado todo el camino hacia abajo. Y eso podría funcionar, pero como que se lee entrecortado. Tu exótica aventura te espera en cuatro líneas. A lo mejor podemos simplificar esto de alguna manera en tres líneas Así que tal vez tu aventura exótica te espera así. Podríamos seguir adelante y arrastrar eso hacia abajo, y es muy legible encima de ella, y también enfoca tu ojo en ella y el tipo de la misma época y los reúne . Pero probablemente sólo necesitemos agregar un poco de sombras de gota. Simplemente voy a hacer doble clic en mis estilos de capa y solo añadir un poco de sombra de gota, muy sutil, Podría no tener ninguna distancia en absoluto, podría expandir el tamaño y luego aumentar la capacidad. Y así ahora podríamos tener una oportunidad de solo asegurarnos de que tengamos equilibrio y su anuncio. Entonces en este momento tenemos un anuncio pesado muy izquierdo. Tenemos este logo, este fondo azul muy fuerte y la tipografía todo en el lado izquierdo. Entonces creo que necesitamos equilibrar un poco eso. Tratamos de hacer eso con este círculo único, pero falta algo a la derecha. Entonces veamos si no podemos desplazar nuestra tipografía hacia la derecha y que los titulares comiencen a leer alrededor de su área corporal. Por lo que ahora tiene un poco mejor equilibrio. Fluye de arriba a izquierda hacia arriba derecha, lo cual es una lectura natural de cómo la gente lee y digiere información y agrega. Por lo que me siento muy feliz por este anuncio pagado. También podemos hacer otra opción de un papá paga. Va a ser fácil agregar que vamos a seguir adelante y dar click en el tablero de arte. Nos va a dar la oportunidad de agregar el mismo tamaño justo al lado. Vamos a hacer una segunda opción solo con el mismo arreglo titular, pero con una foto diferente. Tener opciones. 15. Proyecto de campaña en redes sociales - 4: prueba una foto diferente por completo, y vas adelante y traes esta dentro del hombre en el océano. Tratemos de encontrarle un bonito espacio de cultivo. Puede que no lo sepamos hasta que empecemos a traer algunos de los otros elementos, pero realmente quiero tener un enfoque central en el hombre. Vamos a traer el mismo titular y queremos ser consistentes con su titular. Si lo tenemos apilado o algo así desigual, una especie de alineación desigual a la izquierda. Tenemos que mantenernos consistentes con eso a lo largo de la mayoría para campaña. Por lo que queremos mantener el titular sobre el mismo tipo y ser consistentes, Así que hay muchas áreas diferentes. Teoh trabaja con éste también. Entonces sigamos adelante. Y esto podría ser fácil, porque ya estamos empezando a establecer formas de incorporar la marca en el logotipo. Entonces solo estamos arrastrando sobre duplicando en este punto y también este pequeño elemento naranja . Queremos asegurarnos de que eso sea consistente. Entonces cuanto más hagamos esto y vamos a estar haciendo muchos tamaños diferentes, va a ir más rápido y rápido y más rápido con cada uno que hagamos posicionándolo un poco a la parte superior derecha, porque ahí tenemos este tipo de área en blanco. Queremos mantener ahí el barco ahí mismo. Y una cosa que podemos hacer ya que esto es tan oscuro aquí abajo, incluso podemos sacar uno de nuestros colores de marca aquí y realmente resaltar o usar contraste para sacar una palabra. Entonces en este caso, voy a sacar la palabra exótico. Y yo iba a traer nuestro color naranja, Así que notan cómo eso realmente ayuda a que el titular salga un poco agregando contraste, así que tenemos esa oportunidad de hacer eso. Entonces voy a aprovechar eso en cualquier momento que podamos sumar y traer contraste en sería excelente. Te das cuenta de cómo la e aquí y yo voy a acercar se solapa este pequeño tablero de aquí. Lo que eso hace no sólo es que integre el titular con una foto, sino que provoca un poco de tensión, lo cual es un poco bueno tener ese tipo de superposición ahí tipo de integración en lugar de simplemente estar totalmente por sí mismo y aislado, lo estamos trayendo aquí mismo y solo teniendo un poco de efecto superpuesto. Entonces una cosa que falta aquí es que la foto es genial. Es hermoso, pero realmente le falta la vibración y la saturación y el color. Entonces vamos a añadir eso en nosotros mismos porque podemos hacerlo aquí en una tienda de fotos. Entonces una cosa que quiero hacer y quiero poder hacer algunas ediciones. Por lo que ajustes de imagen. Y si eres bastante bueno en la edición de fotos, estarás justo en casa. Iré despacio, algo así. Algunas de las cosas que paso primero que tiene mayor impacto es la exposición. Por lo que no tienes que ajustar es mucho tiene impactos enormes fue ajustes muy pequeños. Entonces voy a aumentar y sólo como que tenía un poco de brillo a la foto. No tienes que hacer ningún offset y las correcciones gamma realmente agradables cuando trabajas con fotos en blanco y negro . Pero en este caso, creo que vamos a conseguir un palo con uno. Por lo que solo miren ese ajuste muy pequeño que hicimos. Y a mí sólo me gusta pasar por mi panel de ajustes. Siguiente es la vibración, así que podría agregar un poco de esa vibración. Esto va a agregar un poco de saturación iba a sacar especie de su color de tono más cálido . Entonces te das cuenta de cómo era eso antes de agregar un poco de color a una piel, un poco de color para sibar ambiente, solo un poco de saturación, Pero no queremos sobresaturados, porque eso está empezando a parecer muy falso. Parece que tiene un bronceado falso puesto. Por lo que queremos ser muy cuidadosos con la saturación. Simplemente súbelo solo un poquito para ayudarnos. Entonces una cosa que quiero hacer con estas fotos, quiero afilar solo un poquito. Y me gusta hacer esto con algunas con algunas fotos. Simplemente ve afilar a la vez, solo agrega esa pequeña crujiente extra a la foto. Y así una cosa que quiero hacer es y cuando añadas un poco de una especie de color cálido atardecer aquí arriba en el cielo Así que voy a crear una nueva capa y hacer lo que hemos hecho antes y conseguir nuestro cepillo suave lo haga bastante grande. Eso es tal vez un poco más grande que eso, tal vez 1000 píxeles y queremos que ocurra un bonito, vibrante color naranja puesta de sol naranja pasando, y solo vamos a dar clic una vez en la parte superior de aquí, y vamos a ir a nuestro modo de mezcla y suavizar eso. A lo mejor las luces de pin. Un par de esos podrían funcionar bien, pantalla parece ser la más brillante y la más ligera. Solo estamos agregando un poco de pop de color ahí para que puedas ver antes y después después como puedes ver cómo le agregamos un poco más de riqueza a la foto. Hay mucho más que podemos hacer con esto. Podríamos hacer esquivar y quemar para especie de sacar ciertas áreas del agua también. Pero para esto, creo que estamos bastante bien. Contamos con dos opciones diferentes para anuncios. Tenemos una cosa más que hacer, y prácticamente terminamos con Facebook. Vamos a una publicación impulsada por Facebook. Siguiente para la publicación impulsada por Facebook. Vamos a hacer algo un poco diferente. Vamos a estar poniendo un poco de nuestra promo en esta. Parece tener un 20% de descuento en todas las reservas, y vamos a tratar de incorporar ese texto y hacer algo un poco más promocional y tradicional. Entonces volvamos a nuestras elecciones fotográficas. Ten un par de buenas opciones aquí, pero quiero traer una imagen totalmente diferente que antes no hemos usado. Podríamos encontrar diferentes formas de recortar esto, así que realmente queremos ver la grandeza de las montañas. Así que vamos a asegurarnos de alejarnos y conseguir un bonito recorte apretado. Y también queremos poner el logo en los cielos. Creo que este tipo tiene suficiente contraste para caber el logo ahí arriba para que podamos llevar ese final. A lo mejor es a todo color. A ver. ¿ Tenemos a todo color todavía con el eslogan? Todavía no, pero podríamos entrar en nuestro documento ilustrador y conseguir un color completo con el lema y traer eso. Entonces ya vamos a tener que hacer algún rayo al fondo para que eso pueda destacarse porque eso simplemente no es alto contraste con la naranja contra las nubes para ser lo suficientemente legible, y eso está bien, porque vamos a poder hacer eso juntos. Entonces vamos a conseguir nuestra oferta en, y tenemos esta maravillosa oportunidad de agregar oferta burbuja aquí mismo. Entonces sigamos con su tema de la burbuja. Mantenga pulsada la opción y traiga esto. Aquí podría ser donde vive oferta y tengo nuestra oferta ya cargada aquí y especie de algún tipo por defecto. Es 20% de descuento en todas las reservas. Entonces veamos si no puedo traer esto y hacer una buena alineación a la izquierda me va a romper. Entonces una cosa que quiero hacer es empezar a usar el contraste con nuestra oferta. Entonces lo más importante de este bloque de tipografía es el 20% de descuento, por lo que podríamos hacer eso. Agrega contraste de dos maneras diferentes. Débilitarlo audaz. Entonces sigamos adelante y sigamos con nuestro ferrocarril que hemos estado usando. Hagamos un audaz o negro y notarás con el ferrocarril que no soy un gran fan de cómo funcionan los números en el ferrocarril. Eso está bien. Si no te gusta cómo se ven los números en cierto tipo de tipografía. Puedes usar una tipografía similar para los números, así que voy a usar una arena abierta, que también es una fuente descargable gratis en fuentes de Google, y voy a hacer lo más audaz posible. Tan extra audaz. No tienen un negro que está bien. Usa extra negrita y agrega contraste sacando nuestro color de marca naranja. Por lo que notaste al instante que rompe todo ese titular. Hagamos también este ferrocarril, y también puedes usar estilos de carácter si quieres mantener tamaños similares. El único problema con el uso de estilos de personajes con redes sociales es que tienes tantos tamaños diferentes. Sería difícil manejar todos los diferentes estilos de personajes que necesitarás, así que solo estoy haciendo tipo de todo a mano con cada anuncio. Y así tenemos este tipo pequeño, que es un talento, y creo que es un buen tamaño de jerarquía de tipo notado. Aquí tenemos algo más grande de lo que va a más pequeño. mí me gusta agregar un poco de línea divisoria visual aquí, así que hagamos una línea con la herramienta de rectángulo va a hacer que una línea sea bastante delgada. Basta con agregar un poco de una ruptura visual de las cajas tipo. Cambiemos eso hacia abajo, tengamos un poco más de espaciado entre los personajes, veamos chasqueando por mí y averiguando cuál es la misma distancia entre aquí y aquí. me ahorra mucho tiempo, así que ahora mismo es solo una línea llana y se ve genial. Pero quiero agregar un poco de desvanecimiento a esta línea. Entonces voy a conseguir mi herramienta de borrador. O incluso puedes agregar una masa de estratificación que podría incluso ser más lógica. Añadamos una máscara de capas, obtenemos nuestro negro y pavimentamos eso con un cepillo suave. Siempre hay que encontrar formas no destructivas de editar cuando puedas. Entonces estoy en mi masa de estratificación y solo voy a dar clic una vez que se desvaneció un poco, solo algo así como agregar un poco de emoción ahí. Así que agreguemos más contraste haciendo que el off todas las reservas sea un poco más pequeño y el 20% un poco más grande. Y también podemos trabajar en el recorte de su foto. Nosotros consumimos en un poco. No quiero perder la grandeza y la genialidad de las montañas. Tenemos que tener cuidado con lo grande que podríamos hacerla, pero definitivamente queremos acercarnos y conectarnos emocionalmente con la mujer tanto como podamos . Entonces aquí está el tema que necesitamos arreglar con el logo Vamos a iluminar un poco el cielo para que podamos añadir una sombra de gota. Pero eso sólo va a parecer demasiado oscuro. Y trato de evitar sombras caídas si absolutamente tengo que hacerlo. Entonces tomemos la foto del cielo, y podríamos hacer lo mismo que hacíamos antes. Agrega una capa de pintura sobre un poco de blanco para iluminar todo. Bonito cepillo suave alrededor tipo de paté en la parte superior. Podemos cribir esto hacia atrás para que no se vea tan fuerte, y como que ayuda con el cielo. Podríamos tomar la herramienta de borrador, asegurarnos de que las montañas no sean un problema. Y hagamos una ronda suave va a asegurarnos de que recuperemos la vitalidad de las montañas. Otra cosa que puedes hacer es que podrías tomar la herramienta de clon y clonar en algunos cielos y encenderlos un oleaje, muchas opciones diferentes que puedes hacer. Pero creo que por ahora, hacer lo conseguimos ir rápido con facilidad porque sabes que nos están pagando por proyecto aquí , así que no podemos pasar demasiado tiempo en algo. Hagamos la oferta un poquito más grande. Entonces ahora tenemos una oferta, cual es genial porque vamos a estar usando la misma oferta en otras campañas de redes sociales y anuncios de display que vamos a estar haciendo, así que va a hacer todo mucho más fácil. Pudimos hacer un par de cosas diferentes aquí que harán mucho más fácil el resto del proyecto. 16. Proyecto de campaña en las redes sociales - Instagram: manera tener nuestra campaña de Facebook, y es momento de hacer instagram siguiente. Entonces tenemos un montón de uno que vamos a hacer aquí. Y lo que es maravilloso es que tenemos un montón de cosas ya establecidas. Vamos a poder copiar y pegar y pedir prestado de nuestra campaña publicitaria de Facebook y traerlo en instagram y batir esto mucho más rápido de lo que crees. Entonces hablemos un poco de Instagram. Entonces, ¿en qué se diferencia Instagram a Facebook? Por lo que instagram es más foto pesada. Let se basa mucho menos en el texto, por lo que tenemos que pensar en eso al pasar a instagram. Además, instagram tiende a ser un poco más personal, especialmente post o potenciado post. Queremos ser lo más auténticos posible. No lo queremos. Yeso ofrece en todas partes y dejarlo realmente genérico. Es sólo una plataforma diferente, y vive de manera diferente. Por lo que hay que pensar en mensajes más orgánicos, auténticos y también en comprometerse con el espectador. Entonces en lugar de solo decir aquí por mis cosas, tienes que entablar una conversación con ellos, así que incitarles a etiquetarte o a publicar una experiencia. Entonces eso es exactamente lo que vamos a hacer con nuestra publicación INSTAGRAM. Este será un puesto potenciado. No necesariamente es un anuncio pagado, pero se apagará pero se apagarácomo un anuncio pagado. Pero como es un post, va a existir en la página de negocios son la página de la empresa, y luego simplemente como que la impulsas a otros seguidores. Entonces vamos a hacer esto un poco diferente. Vamos a usar una foto diferente para especie de mantener con esa autenticidad de Instagram. Entonces vamos a recorrer nuestras fotos. Y hay uno que tenía en mente para éste. Es éste de aquí. Se lo va a hacer un poco más grande o seguir adelante y arrastrarlo. Entonces lo que me gusta de esta foto es que tiene esta experiencia de ustedes. Entonces tiene una foto de su mirando al recinto ferial o alguna ubicación exótica de fondos, y lo tiene Parece que eres tú el que está tomando la foto. Ahí tiene esta conexión personal con ella. Creo que eso funciona muy bien, y creo que eso va a funcionar un poco mejor para Instagram. Entonces, como siempre, puedes desactivar el texto y el margen lo haría siempre que lo necesites. Y añadamos aquí nuestro ah tema diferente. Entonces vamos a hacer alguna tipografía y texto diferentes aquí. Entonces en lugar de poner nuestra oferta es poner nuestro logo o poner nuestro eslogan. Lo que vamos a hacer es que le vamos a pedir a la gente que publique ah, algunos comentarios. Entonces va a ser cuál es tu momento de viaje favorito del 2020? Entonces se acerca el fin de los años cuando estoy filmando esto. Entonces pensé que sería una campaña muy sensible al tiempo. Cuál es tu momento de viaje favorito en 2020 y comenta a continuación. Por lo que nuestro llamado a la acción es comentario a continuación, y tenemos nuestro logotipo. Entonces esto no es vender algo tanto. Es como está, conciencia de marca. Entonces voy a traer nuestra copia genérica, y vamos a tratar de trabajar en un diseño tipográfico dinámico realmente agradable para esto. Entonces aquí está el texto que vamos a usar para este post. ¿ Cuál es tu momento de viaje favorito en 2020 comentario a continuación? Por lo que también queremos hacer espacio para el logotipo. Ya que no vamos a estar publicitando nada, definitivamente necesitamos marcarlo, para que la gente sepa que somos nosotros. Entonces voy a pedir prestado uno de estos logotipos y de verdad, tal vez un todo blanco, pero tal vez el blanco con el color y podría funcionar mejor. Ver, cómo funciona eso Es una bonita zona oscura aquí abajo será una gran oportunidad. Perfecto. Y no queremos que sea grande y obvio que esta es una empresa que queremos hablar primero del momento de viaje. No queremos decir, Hey, Hey, somos una gran empresa de publicidad. Queremos tratar de ser más orgánicos y auténticos con la gente, Así que va a ser todo sobre este titular. Entonces, ¿cuál es tu momento de viaje favorito? Una vez más, vamos a pedir prestadas algunas cosas aquí. Vamos a pedir prestado nuestro pequeño círculo de esta copiando y pegando nuestro círculo en este tablero de arte . Entonces vamos a conseguir nuestro típico ferrocarril que tenemos aquí. Dice dónde los estilos de carácter pueden ser muy prácticos. Si quieres seguir adelante y ponerte eso para esto, tenemos un ferrocarril. negro sería lo que hemos estado usando. ¿ Qué? Rompamos esto. ¿ Cuál es tu momento de viaje favorito? Entonces así es como se rompe cuando lo lees. Es una forma más natural de romper el titular. Entonces, ¿cuál es tu momento de viaje favorito en 2020? Me encantaría poder descomponer más esto. Tenemos mucha habitación aquí. Hagamos eso un poco más pequeño. Entonces aquí es donde tenemos titular. Es un poco más largo, y aquí es donde el contraste puede volver a ayudarnos mucho. Tenemos que romper esto. Este es demasiado tipo pesado todos juntos. Entonces una forma en que podríamos hacer eso es hacer contraste con el peso. Entonces, ¿cuál es la parte más importante de esta frase? ¿ Cuál es tu momento de viaje favorito en 2020? Bueno, para mí, lo leí como momento de viaje en 2020 siendo la parte más importante de titular. Entonces, ¿vamos a hacer una carta cuál es tu favorita? Espera, hagamos esa luz y notemos cómo automáticamente tipo de corte ese titular y la mitad y hace que sea más fácil de leer. Y también hagamos 2020. Hagamos que sean arenas abiertas porque me gusta la forma en que hacen su guiso de números extra audaz. Y hagamos ese contraste con el naranja. Entonces estamos haciendo dos niveles de contraste aquí tenemos contraste con peso y contraste con tipo. Entonces hagamos esto solo un poco más pequeño, un poco más grande. Y también podemos apretar el espaciado aquí entre algunas de estas líneas. Entonces solo voy a resaltar esta línea y bueno ir a mi panel de caracteres y apretar el dejar aquí mismo para apretar un poco el dejar. Ahora mismo está en 20. A ver cómo luce el 18 solo apretar eso un poco. Hagamos también eso lo mismo. Por lo que necesitamos tener este comentario a continuación, y realmente queremos que este material salga como un botón de llamada a Acción. Entonces una forma en que podemos hacer eso es quizás por una caja naranja. Entonces vamos a conseguir nuestra herramienta de rectángulo y hacer una caja naranja. Sube a nuestro relleno y haz nuestra naranja y llevemos esto a continuación. Una vez más, necesitamos hacer de este tipo consistente aquí. Entonces una cosa que podríamos hacer comentario abajo es agradable tener una flecha. Ya ves que con carrusel instagram posts carrusel donde te piden con una pequeña flecha para deslizar. Nosotros vamos a hacer lo mismo aquí. Vamos a hacer un poco de flecha hacia abajo. Por lo que la mejor manera de hacer flechas o cualquier tipo de iconos que siento es un ilustrador de adobe. Tengo más control y Adobe Illustrator. Entonces vamos a hacer una flecha muy rápida y soy ilustrador de adobe. Déjame ver si no puedo hacer eso un poco más grande para ti. Por lo que en Illustrator ahora voy a conseguir la herramienta pin. Y me voy a asegurar que el show grid esté encendido porque es mucho más fácil hacer cosas incluso simétricas con la cuadrícula. Y vamos a hacer un chasquido a la grilla. Entonces snap to grid y lo que va lleva mapa. Dos oficinas puntuales han roto una rejilla encendida. Va a hacer de crear una flecha una cincha. Vamos a ir y dar click aquí. Se va automáticamente tipo de chasquido de dos puntos y vamos a hacer esto cuando hagamos diseño de iconos y un par de lecciones, sacar nuestro pin de trazo encendido. Hagamos de eso un bonito grosor y lo que también es alrededor de las tapas. Por lo que tiene, como un bonito rodeado. Estamos haciendo tanto redondo cap como round join para darle un aspecto bonito, redondeado, creando una era sencilla. Podríamos hacer mucho trabajo de iconos e iconografía más adelante. En el curso, que siempre es divertido y emocionante. Hay flecha simple. No hagámoslo tanto tiempo. Se está haciendo un poco más corto. Vamos a engrosar el trazo. Y así como así, tenemos una flecha lista para salir. Podemos seleccionar esto y quiero hacerlo blanco. Yo creo que sí. Sigamos adelante y cambiemos eso ahora antes de arrastrarlo. Entonces así como así, somos capaces de crear nuestra propia flecha. Lo que me gusta hacer es crear muchos iconos de uso común y mantener un archivo de ilustrador alrededor. Por lo que siempre puedo este dragón una flecha cuando lo necesito arrastrando una casilla de verificación o una marca de verificación. Y también una cosa que podemos hacer es agregar movimiento, dedo del pie todo esto, y quizá queramos agregar un poco de sombra gota a este dedo del pie, ayudarlo a salir, pero no súper fuerte. Entonces vamos a reducir bastante la opacidad en eso y vamos a añadir un poco de ángulo a esto porque ahora mismo se ve bien. Pero y si tomáramos todos estos elementos y solo angularlo un poco, solo para agregar un poco de movimiento y emoción al titular. Simplemente se ve un poco más dinámico de esa manera, y el comentario de abajo no necesita hacerse cargo. Podría ser un poco más pequeño. El titular es lo más importante podríamos también revertir los colores para ver si eso funciona. Bueno, bien también. ¿ Haría una prueba de visibilidad para ver cómo se ve a distancia? ¿ Cuál es tu momento de viaje favorito en 2020 comentario a continuación? Y Aiken leyó claramente el logotipo. Creo que esta es una publicación mucho más atractiva que funcionará mucho mejor en Instagram de lo que lo haría en Facebook. Porque Instagram, hay que incitar a la gente a compartir post hacer algo. Siempre ten una acción con cualquier post INSTAGRAM para hacer deslizar hacia arriba, hacer algo. Comentario. Hashtag Hay todo tipo de cosas que funcionaron mucho mejor en Instagram cuando llama a que la gente interactúe con tu post 17. Proyecto de campaña en redes sociales - Instagram 2 2: siguiente es el punto culminante de la historia. Entonces si no sabes lo que es un punto culminante de la historia en Instagram, son estas pequeñas burbujas donde puedes resaltar las historias publicadas previamente. Vamos a estar hablando de cómo crear esa imagen en particular para seguir ahí. Entonces esto es un círculo estándar y esto es solo un En realidad vas a estar exportando esto como una pinza J cuadrada y lo recortará en un círculo para que no tengas que exportar como círculo. Entonces tengo esto Puedes alternar esto a menudo para especie de ver donde eventualmente va a ser corrupto. Entonces esto va a ser bastante fácil donde hacer una historia de instagram que va a hablar del porcentaje de descuento, así que eso va a ser una historia de Instagram publicitaria va a ser 20% de descuento en todas las reservas, así que esto podría ser realmente, realmente fácil de armar, Y podríamos hacer de esta una caja sólida que sangra todo el camino hasta el borde y convertirla en nuestro color azul completo . Y podemos platicar o recortar aquí, especie de ver dónde va a estar. Entonces voy a bloquear esta capa de a mi icono de candado. Bloquearlo para que pueda mover libremente el tipo. Cómo me gustaría. Entonces así es como se vería. Iba en esa pequeña burbuja aquí en Instagram que, ves, podría ser muy pequeña. Entonces no podemos poner la huella pequeña ni nada loco, así que tiene que ser lo más grande que podamos, para que pueda ser lo más legible que podamos. Podrías desactivar eso. Y luego, así como así, creamos un punto culminante de historia que exportarías. Esto es como una clavija J. Automáticamente recortará todo por ti y lo aplicará en el círculo. Entonces ahora hagamos una historia de instagram. Eso va a ser lo que ahorremos aquí. Por lo que 20% de descuento en todas las reservas. Entonces lo que es maravilloso de esto es que ya tenemos algunas grandes ideas, y así quiero hablar de los Instagram. Entonces, como puedes ver, cuando haces un instagram pagado o una historia promovida, en realidad tienes un deslizar hacia arriba para más información opción aquí abajo. Eso indica esta caja gris en la parte inferior. Aquí es donde estará esa opción. Por lo que ningún tipo de fotos realmente no se verán. Se cubrirá con esta caja negra. Entonces tengo esto ahí en la plantilla que no necesitas exportar. No exporte con él. Pero está ahí sólo para un tipo de mostrarte dónde estará ese pequeño botón de deslizamiento hacia arriba en tu historia. Entonces tomemos esa maravillosa foto que tenemos aquí y copiemos. Esta fue una foto muy vertical. Por lo que será funciona perfectamente para el tamaño de la historia de instagram. Mira lo bonito que se ve ya. Simplemente voy a recortar esto un poco más, porque no creo que necesitemos esa parte superior. Así que sólo un poco más caer su foto un poco mejor. Y lo voy a traer detrás de esa capa. El deslizar hacia arribapara aprender más. Queremos asegurarnos de tener eso en cuenta al recortar nuestra foto. Por lo que queremos tener nuestra promoción y nuestro logo. Definitivamente vamos a necesitar hacer un poco de trabajo fotográfico para asegurarnos de que eso salga por encima del fondo. Entonces hagámoslo. Ya que definitivamente queremos tener el logo arriba en la parte superior, creo que ahí es un buen equilibrio. Veamos qué podemos hacer para tal vez agregar una nueva capa y simplemente pintar sobre un poco de blanco o podemos hacer una muestra aquí del cielo y queremos seguir adelante y traer nuestra oferta. Ya tenemos nuestra oferta puesta aquí y Facebook, por lo que esta podría ser una situación muy sencilla de copiar y pegar. No tengamos esa burbuja por ahora. A ver si podemos intentar salirnos con la suya poniéndola solo a ella. Ella tiene suficiente contraste donde creo que el tipo será legible 20% de descuento en todas las reservas. Y me pregunto si un alineamiento central podría funcionar un poco mejor aquí y entonces podemos tener . No creas que necesitamos la línea. Lo que voy a querer hacer es tener un mando. Entonces, ¿qué haces? 20% de descuento en reservas? ¿ Ahora qué? Tenemos que tener un llamado a la acción. Entonces vamos a ah, tener un deslizar hacia arriba para más opción. Pero vamos a guiarlos así. Vamos a seguir adelante y tener un pequeño botón que les vaya a decir exactamente qué hacer. Y vamos a hacer un poco transparente para poder ver ese hermoso fondo. Entonces lo único que no me gusta de esto si te alejas. Es muy pesado de fondo. Tienes mucho texto compitiendo aquí, así que me pregunto si no podemos mover el titular un poco por encima de aquí para especie de equilibrar el logo o equilibrar d diseñar un poco mejor. Eso puede significar que necesitamos hacer que este blanco destaque sobre el fondo. Por lo que un montón de arreglos diferentes que podemos hacer aquí con esto. Creo que esto está bastante cerca. Probablemente necesitemos sacar esto un poco más porque odiaría que Teoh pierda ese titular ahí, así que tendremos que trabajar un poco en eso. Pero por solo por ahora y por lo que estamos haciendo, creo que es un buen comienzo. Esto es lo que hice originalmente, un poco diferente. Yo sí me quedé con el naranja, pero el deslizamiento hacia arriba para reservar. Pero creo que eso funciona muy bien. Podemos agregar diferentes diapositivas y nuestra historia y difundir esto y hacer diferentes fotos y y y y cambiar la foto por cada una y tener eso. También podemos agregar un video video es muy atractivo cuando se trata de historias de instagram, y eso es algo que puedes crear en una fecha posterior. No voy a hacer el anuncio de pago de Instagram ni la publicación de retrato estándar, pero solo quiero ir a través de los tamaños en la plantilla para ti. Va a haber 10 80 por 10. 80 y el poste de retrato estándar. Este es prácticamente el tamaño más grande con el que puedes salirte con la tuya para un post. No tienes que hacer una plaza en Instagram. En realidad puedes hacer una publicación más larga, y esto realmente maximiza la visibilidad de tu post en la fuente de noticias porque te da un poco más de longitud ahí en la parte inferior. Entonces piensa en eso. Al armar tu post de instagram, no tienes que estar atascado con el 10 80 por 10 80. Incluso puedes hacer un 10 80 bay 13 50 si estás haciendo un post estándar regular. Entonces lo que es genial de esto es que tenemos mucho de esto ya establecido, así que si queríamos una especie de volver atrás, puedo copiar todo aquí y luego traerlo de nuevo y ya tengo un anuncio de pago listo para ir porque ya lo he dimensionado . Y así ya hemos desarrollado la plantilla básica avanzando para todas las campañas de redes sociales que puedan pasar a Twitter. Y todas estas otras opciones simplemente se iban a quedar con Instagram y Facebook para esta clase. Podríamos pasar 10 horas solo en campañas de redes sociales. Yo quería pasar a lo último cuando se trata de nuestra campaña en redes sociales es hacer anuncios digitales. Entonces mientras hablaba de los anuncios digitales de la sección de teoría o esas pequeñas cosas que ves en sitios web, tal vez lo veas. Y tú eres Pandora. Alimenta a todos estos diferentes lugares. Eran estas adiciones estáticas tipo de pop up o existen dentro de los blogs y los nuevos sitios. Esto es en lo que vamos a trabajar a continuación. Hice mucho de esto por el trabajo del cliente. Nosotros armamos mucho de ello. Vamos a hacer todas las que veas aquí, y aquí es donde podríamos ponernos realmente diminutos. Vamos a hacer algunos anuncios de display para móviles que son súper duper, duper minúsculo. Algunos son sólo 50 píxeles y bombo. Esto es que realmente nos vamos a empujar como diseñador para intentar capturar el dedo del pie esta increíble campaña y reducirla a este tamaño pequeñito, pequeñito, pequeñito, pequeñito, pequeñito. Aquí es donde va a ser un reto como diseñador. Pero eso es lo que estamos aquí para hacer juntos algunas cosas más desafiantes. Entonces te veré allí a continuación. 18. Proyecto de campaña en redes sociales: Display Ads: ofreciendo anuncios de display. Puedes descargar esta plantilla y el curso para poder trabajar a mi lado, y ya tienes todas estas tablas de arte de tamaño. Una vez más, puedes hacer click sobre estos y ver cuál es el tamaño. Estas son las pantallas más utilizadas en tamaños, así que pensé que en realidad hay cientos de diferentes tamaños de pantalla fuera. Pero una vez que hagas una horizontal y una vertical y también un cuadrado, tendrás las plantillas para hacer cualquier tamaño imaginable. Entonces por eso vamos a estar haciendo estas tallas hoy. Y yo quería hablar de tallas. Por lo que estoy haciendo clic en esta tabla de clasificación móvil, que es un anuncio de display móvil que verás en la parte inferior de APS o en la parte inferior de los sitios web móviles . Y quiero hablar de tamaño, así 320 con por 50 pixeles de altura. Entonces cuando estás diseñando estos, tienes que pensar en lo diminutos que son. Por lo que recuerdas en la sección de teoría del diseño, donde hablamos de lo diminuto que es en una pantalla de teléfono. Por lo que tenemos que exhibir esto con la intencionalidad en mente. Muy fuerte llamado de alto contraste a botones de acción elementos de diseño muy obvios no estaban haciendo nada sutil aquí. Todo va a ser súper obvio y fácil de encontrar. Va a ser un poco diferente a hacer un anuncio impreso. Entonces para la primera campaña, vamos a hacer un anuncio de display. Básicamente vamos a hacer este Post potenciado por Facebook. Pero ya que Facebook tiene ese maravilloso botón que agregan debajo de la foto en un post display anuncios no tienen nada de eso. Los anuncios de display son simplemente estáticos. En ocasiones pueden tener animación, pero son solo una imagen. Por lo que hay que tener el botón para enviarlos a la página de aterrizaje o a la promoción. Tienes que tener ese botón de llamada a la acción que dice dar click aquí reservar ahora. Entonces eso es lo que vamos a hacer con esto. Vamos a adaptar esto, pegarlo aquí mismo en la plaza. Agrega, como puedes ver, la diferencia de tamaño es increíble. Es sólo qué, 200 por 300 píxeles para un anuncio cuadrado estándar. Realmente vamos a tener dedo del pie reducir el tamaño aquí de muchos de nuestros elementos. Entonces hay un elemento más que vamos a querer meter en esto, y ese va a ser ese llamado a la acción Va a ser libro ahora, así que vamos a tener que traer un libro ahora. Botón. Entonces eso está bien, porque solo podemos hacer nuestro rectángulo. Y entonces, ¿qué es una buena llamada acción para un anuncio de display? Entonces reservar ahora podría ser un poco mejor que hacer clic aquí porque está teniendo una acción definida . Por lo que da click aquí. Es decir, siempre te decimos que siempre ves cosas por click aquí y todo esto, pero es bueno tener una acción más deliberada. Entonces reserva ahora es un poco diferente a por ahora. Es un poco diferente a hacer clic aquí. Vamos a hacer libro ahora como un llamado a la acción. Por lo que necesitamos ahora incorporar un nuevo elemento a esto y notar lo pixelado que se ve. No te preocupes. Esta sigue siendo una imagen de alta resolución que tenemos aquí porque ver cómo tenemos todavía icono . Sabemos que es una imagen de alta resolución, pero sólo porque el tamaño es tan pequeño, todo va a verse un poco pixelado. Vamos a bajarla un poco, Maurin esto para que podamos tener más trabajo con el dedo del cielo. También queremos hacer algo realmente rápido y hacer un resplandor externo en esto solo para poco de ayuda que salga en el fondo. Hay algo realmente rápido que no tienes mucho tiempo a la hora de hacer estas campañas en redes sociales para hacer todo a medida. Entonces el libro. Ahora hagámoslo un poquito más pequeño, pero no demasiado pequeño. Esta es nuestra parte más importante del anuncio. Sube todo esto y luego apilar esto para que vean la oferta y luego vean el botón para hacer clic más, y podemos tener este sangrado fuera de las páginas. Mantener pulsado el turno es tener ese botón sangrar y podemos ajustar. Este círculo es tal que no tenemos mucho espacio para la foto hasta wow gente, pero con anuncios de display, realmente se trata de la oferta que les estás dando. Entonces esto es una especie de arreglo rápido para la primera plaza. Agregar. Será la base de todo lo que hagamos. Y ahora que tenemos un cuadrado en un extremo en rectángulo de línea, es sólo un poco más ancho. Pero tiene la misma altura, así que lo que podemos hacer es copiar y pegar fácilmente todos estos elementos y tienes un poco más ancho, así que solo ajustas los elementos. Puedes agregar un poco más de la foto ahí dentro, por lo que es fácil, una fácil copiar y pegar. Cuando estés haciendo estas campañas, hagamos algo un poco diferente para nuestro gran rascacielos, tan grandes rascacielos o 300 por 600 píxeles. Todavía no es enorme, pero si miras en un sitio web, realmente tiene la oportunidad de agarrar a la gente mucho más que como un anuncio de clasificación o un anuncio cuadrado. Tenemos este maravilloso espacio vertical. Entonces lo hicimos. Hicimos eso más recientemente para la historia de Instagram. Entonces ahora que tenemos eso, sigamos adelante y lo usemos. Entonces ahora que tenemos ese anuncio, solo necesitamos ajustar un poco más la foto. Y en lugar de deslizar el libro, ese va a ser nuestro libro ahora. Y así, convertimos esa historia de instagram en un anuncio de clasificación o rascacielos, y podemos hacer que ese contraste aún más alto. Me pregunto si Blue podría funcionar un poco mejor, como si ese tipo de brote un poco más. Podemos hacer de esto esa naranja otra vez. Entonces hay algunos pequeños retoques que estamos haciendo. No es copia exacta. Hagamos eso un poco más blanco. Tenemos que ser lo más obvios posible con sus anuncios realmente diminutos. No estamos fastidiando en absoluto con facilidad. Podríamos incluso hacer una máscara de capas aquí, y voy a conseguir mi herramienta Grady int y tengo un blanco y negro. Entonces al igual que pintar con un pincel, estoy haciendo una herramienta radiante sobre una máscara de capas. Pero me pregunto si podría simplemente desvanecerme un poco la parte superior , espárela así y luego traer un fondo que coincida. Entonces sólo preguntándose cómo se vería eso eso como que traería más énfasis en el logotipo. También nos da la oportunidad de hacerlo un poco más grande. Entonces ahora que tenemos ese rascacielos hecho, y ahora probablemente sea el momento de que una de las cosas más difíciles de hacer en las redes sociales y exhibir. anuncio está haciendo las tablas de clasificación, pero luego trabajando tu camino hacia abajo hasta los pequeños anuncios de banner y la tabla de clasificación móvil. Entonces vamos a conseguir una foto diferente porque ninguna de nuestras fotos realmente iba a funcionar en un espacio tan diminuto. Entonces vamos a traer aquí los elementos absolutos necesarios. No vamos a poder usar todo para eso que usamos en los espacios más grandes, así que las cosas se van a reducir. Entonces llegamos a hacer un logo. Eso es lindo y grande. Tenemos 20% de descuento en reservas que tenemos que utilizar. No vamos a ser capaces de apretar en la letra pequeña. Eso podría ser para la página de aterrizaje a la que acuden más tarde. Entonces eso está bien. Necesitamos tener ahora un libro llamado Acción. Y usemos déjame seguir adelante y eliminar esto. Déjame usar tipo de esto parece que ya es el color que me gusta. Te das cuenta de lo rápido que se dice arrastrar y soltar algunos de estos elementos después de que nos pusimos ahí y tuvimos que trabajar la habitación. Entonces esto es lo más importante. Entonces, ¿cómo podemos arreglar esto? Entonces creo que apilarlo, eso no va a funcionar. Entonces vamos a tener que extender esto horizontalmente bastante. Entonces una cosa que podemos hacer es que el libro ahora se destaque por su cuenta aquí afuera. Haz de eso un color sólido, un poco más grande, así como esto. Y veamos si no podemos hacer de esto un arreglo de tipo horizontal así y en realidad podríamos incluso tener espacio para la letra pequeña, créanlo o no. Pero tenemos que trabajar en una foto en alguna parte porque no vamos a capturar a la gente con su aburrida oferta. Nos queda una más que no hemos usado, y noté que esto tiene una presentación muy horizontal. Entonces vamos a traer a nuestro pequeño buzo. Tenemos que hacerlo donde podamos ver lo que está haciendo, que en realidad está buceando. Y esta va a ser la parte difícil porque lo vamos a hacer bastante pequeño. También queremos quedarnos con las montañas porque todo se trata de esa exótica ubicación. Hagamos que se ajuste muy bien entre estos diferentes elementos Aquí. Podemos acercarnos a éste, y siempre podemos desvanecerlo. Podemos hacer una máscara leering, pintar con negro a especie de desvanecerse que en así así, tenemos el logo bonito y grande. Siempre podemos si sentimos que las fotos son demasiado pequeñas, podemos hacer esto un poco más pequeño. Escribirlo, poder llevar a nuestro hombre un poco más de frente y centro. Entonces esa es la parte difícil, y se pone un poquito más difícil. Entonces ahora tenemos que tomar esto y hacer que sea la mitad del tamaño. Y esto es para lo que no tenemos espacio. Vamos a perder algo de espacio horizontal para que no tengamos espacio para poner este botón en el frente central. Por lo que los botones van a tener que apilarse debajo de la oferta y aún tenemos que incorporar el logotipo. Podría hacer un diminuto pero más pequeño pero no demasiado. Y podríamos traer a nuestro tipo, y esto es con lo que terminamos. Por lo que notan cómo es la diferencia entre estos dos. Tenía que desplazar el botón libro ahora debajo. No tenemos espacio para la impresión pequeña porque a 500 por solo 60 pixeles de altura, simplemente no tienes espacio para la impresión pequeña hace solo una cosa que tienes que eliminar. Teníamos que tener un arreglo diferente para el botón, y cuatro, me adelanté e hice el anuncio móvil, y te das cuenta es más o menos lo mismo es el anuncio de banner de arriba. Yo sólo tenía que eliminar la foto, y esas son las concesiones que haces. Es realmente difícil tener una foto de alto impacto en algo que solo es de 300 por 50 píxeles. Entonces esas son las concesiones que tienes que hacer lentamente. Todavía conserva el branding. Todavía hay los mismos colores y tema involucrados. Se puede ver todos estos, todos estos aire temático. Se puede decir que son parte de la misma campaña. Cuando alguien ve un display desde esta empresa y ven el post de pago en redes sociales, van a conectar a los dos y van a empezar a construir ese reconocimiento de marca que es tan importante bajarlos a la parte de ventas finales a convertirlos en un cliente. Y si puedes hacer eso como diseñador gráfico y pensar en todo el panorama de marketing y poder hacer gráficos que conviertan bien y que nuestra temática y que tengan branding, vas a poder cobrar más ansiosos de poder ser un más deseo eficiente. Por lo que quería pasar por esto. Sé que esto fue un poco tedioso. El vistazo a cada toda la campaña que acabamos de crear juntos hicimos esto todo desde cero es una empresa y campaña muy realista para la que tendrías un cliente. No es esta marca realmente genial, moderna. Es un tipo de empresa muy realista para la que trabajas, y me gusta ser lo más realista posible porque quiero que mis alumnos tengan éxito y 2 16 así que a continuación tenemos aún más proyectos que abordar, pero estamos terminando este. Tan contenta de verte por este. Toma un poco de descanso y te veré en el próximo proyecto. Tengo un poco de reto estudiantil para ustedes chicos, así que quiero que pasen por el mismo proceso por el que pasamos. Si quieres pasar por la clase y usar las mismas fotos en el mismo logo, por favor siéntete libre de hacerlo. Pero quiero que hagas un proyecto especial con tu propia marca única. Yo quiero que te anuncies y un par de diferentes campañas en redes sociales. Siéntete libre de hacer algunos anuncios de display, pero realmente quiero ver definitivamente una foto de portada de Facebook. Me gustaría ver un anuncio de Facebook pagado y al menos una publicación de instagram de ti. Te amo para que seas tan creativo. Exprésate con tu propia marca personal. Sea lo que sea que vendas, sean los servicios que vendas de tu diseñador gráfico o un diseñador Web, quiero que tus colores de personalidad y tema de marca salgan en los proyectos estudiantiles. 19. Consejos para crecer tus seguidores en Instagram: Tengo más de 25 mil seguidores en Instagram y estoy en el espacio de diseño, específicamente en el espacio de diseño gráfico. Y quería mostrarles algunos consejos y trucos sobre cómo crecer en Instagram, hacer crecer su diseño gráfico o perfil de diseño. Lo mejor que puedes hacer es prueba y error para averiguar qué tipos de publicaciones y videos son realmente mejor cuando voy a repasar algunas de mis publicaciones con mejor rendimiento y hablar sobre por qué estaban bien y por qué algunos otros ya terminamos. Entonces hablemos de, hablemos de lo bueno. Hablemos de cuál fue la publicación con mejor desempeño de los últimos cinco años de publicación en Instagram. Y ese va a ser este de aquí. Tiene 5,268 “me gusta” y 65 comentarios. Y lo que es es un poste de carrusel, por lo que puedes tener hasta diez diapositivas de post carrusel. Todos mis cinco primeros realizados con los postes son diapositivas de carrusel. No son reales, así que tengo un par de reglas que funcionaron bien. Pero en su mayoría es un formato que no es de video. Y lo que el gran truco es, es que la mayoría de estos son altamente educativos y lo suficientemente informativos donde la gente marcará como favorito y lo guardará. Y luego, de repente, el algoritmo de Instagram comenzará a servir tus publicaciones a más personas porque lo están viendo como valioso y lo están guardando y marcándolo, eso es lo más cosa importante. Entonces, como puedes ver, simplemente muy lleno de información, probablemente la mayor parte de cualquiera de mis publicaciones que he hecho solo trato de brindar toneladas y toneladas de información en un solo lugar así que no tienen que sentarse ahí y ser alimentados con cuchara estos pequeños pedacitos de información. Pueden tener un post donde puedan obtener todo sobre ese tema en particular. Y por supuesto al final intentar hacer algún tipo de taponamiento al final. Pero trato de no anunciarme demasiado en estas publicaciones informativas. Quiero que no sea autopromocional porque eso derrotaría el punto de tratar de conseguir que esto sea compartible y marcable de libro. Entonces, veamos las percepciones sobre esto. Este es un número grande y no sé si alguna vez podré vencer a este número. Espero que algún día lo haga. Pero 359.000 personas alcanzaron en este caso. Ese es un número enorme, eso es casi medio millón de personas con un pequeño post sobre diseño de maquetación. Pero fue tan informativo que la gente lo compartió y no fue demasiado promocional. Entonces sintieron que podían compartirlo con su público y no sentir que estaban compartiendo y agregándome o anunciándome. Entonces lo que me gusta mirar son las visitas de perfil. Así que hubo casi 3 mil visitas de perfil como 3 mil personas, pueden venir a ver mis otras cosas y ver mis otros trabajos. Tenemos 12,220 marcadores. Santo moly, eso es mucha gente que guarda esto para después. Eso significa que estoy esta publicación está en algún lugar lista guardada de alguien y siempre pueden volver a ella más tarde. Esa es la métrica más importante de todo es Bookmark. Después va a compartido, luego va a comentarios, luego va a me gusta. Las acciones siempre hacen subir esos números más altos para ti. Entonces veamos esto por un minuto. De las 383,000 impresiones. 212 es de casa, 160 era de explore, y solo, solo 4.500 son de hashtags, lo que significa que los hashtags pueden ser agradables para darte tal vez un 5% más de compromiso y exposición, pero los hashtags son solo relevancia y sigo utilizándolos. Sigo escogiendo alguna buena mezcla de hashtags que sean populares y tal vez no tan populares. Pero honestamente es solo, es solo del cinco al 10% de mi exposición total en Instagram. Sigamos adelante. Veamos qué más era popular y qué era impopular. Porque creo que podemos aprender mucho más de lo que era impopular que a veces podemos de lo popular. Entonces otro popular es muy, muy similar. Y está justo aquí. Es muy similar. Es un carrusel, es un paquete altamente informativo. Este fue sobre la anatomía de la tipografía. Puedes ver que la primera diapositiva está absolutamente empaquetada, aún legible, aún legible. No me gustaría poner más aquí ya que probablemente empezará a volverse ilegible. Pero a medida que te deslizas, todo está lleno de información. Es educativo, es compartible, no es promocional. No estoy presumiendo solo un proyecto. Y creo que eso es lo que funcionó con éste también. Así que mira este emparejamiento de fuentes. Yo sólo pongo, eso es sólo una diapositiva de diez. Entonces es como tener diez post empacados en uno cuando haces un post tenso como carrusel. Y de hecho he visto a otros creadores principales compartir que publicaciones de carrusel tienen un mejor rendimiento que los reales. Para ellos, dicen mucho, el video hace genial, pero no estoy viendo video haciendo realmente genial para mí. Eso es algo en lo que pensar. Entonces, veamos los insights para este. No tan emocionante como el último, pero aún así llegó casi un cuarto de millón de personas. Esa es una increíble cantidad de alcance que simplemente no tenía antes de empezar a publicar estos carrusel la información que publicaré . Y verás que compartir es enorme. Cuando llego a ese tipo de referencia de 500 acciones, ahí es cuando realmente explota y consigue los cientos de miles de espectadores. Y en realidad no, quiero decir, los me gusta son agradables, pero solo los ignoro y los comentarios por supuesto, son muy importantes. Pero realmente comparte y marcadores. Eso es lo que realmente, realmente me preocupa propuso que lo considere un ir viral. Así que sigamos adelante. Hay otro post de carrusel informativo que funcionó bien. Si nos fijamos en las percepciones sobre este, sigue siendo bastante sólido con 30,000 personas alcanzadas, no tan buenas como las otras, pero aún así muchos marcadores. Esto es lo mismo que pensé que el color realmente tiende a atraer a la gente cuando publico sobre el color, este no funcionó tan bien. Y realmente no puedo decirte por qué. Yo soy sobre todo porque quiero decir, es paquete de información, pero tal vez simplemente no es tan denso como los otros. Entonces tal vez por eso no funcionó tan bien. Mucho de esto es un poco más tipo de cosas de nivel de entrada. Este gráfico aunque solo, creo que hace un año publiqué esta psicología del color de la carta de colores. Una vez más, súper densa con información que por sí sola es súper, súper bien también, porque es tan densa pero a la vez legible. Cuando hago listas, esas suelen ir muy bien. Entonces esta es una recomendación de a quién seguir y diseño gráfico, y este fue un post sólido. Echemos un vistazo a los insights. 38,000 alcanzan, Eso es bastante bueno. 21 o casi 2,200 marcadores, no compartidos tanto como el otro en términos de comparar estas dos métricas. Entonces no es tan compartible, pero creo que el libro marcable es realmente bueno porque tienen 2020, 200 personas tienen esto en algún lugar guardado donde puedan regresar y verlo más tarde. Seguirán volviendo a mi perfil. Eso es lo que queremos cuando intentamos crecer en la cuenta de Instagram. Por lo que estas listas tienden a funcionar muy bien. Una vez más, hay un tema con cada uno de estos y esa es esta densidad. Está muy densamente repleto de gran información sobre otra que le fue bien ya que esa listada bien, y hago esto mucho. Si tengo algo que tiene éxito, lo intento una y otra vez hasta que ya no tenga éxito. Así que lo intenté de nuevo con la lista. Um, hice diseño de logo. Déjame ver si puedo encontrarla. Aquí está el del diseño de logotipos. No fue tan exitoso porque diseño gráfico es un tema más grande que el diseño de logotipos. El diseño de logotipos es un subconjunto o un subtema del diseño gráfico. Entonces, obviamente, cuanto más amplios sean tus temas, más alcance, alcance potencial e intereses puedas tener. Entonces otro post fuerte, una vez más, pacto informativo fueron los libros de diseño gráfico que recomendé. Pero en vez de simplemente decir aquí hay un libro, lo recomiendo. Tenía una pequeña propaganda que hablaba de por qué recomendaba el libro. Y pensé que a esto le fue muy bien. Me dio la oportunidad de anunciar mi librito sin ser súper promocional. Así que es un poco la forma de escabullirse esa promoción sin que parezca un anuncio. Pero también tuve estas otras grandes recomendaciones porque me sale esta pregunta que me hacen mucho los alumnos es ¿qué libros de diseño gráfico recomiendo? Y también pude etiquetar a algunos de los creadores. Sigo a muchos de los creadores de los libros. Y pude etiquetarlos y pudieron volver a comentar. Y algunas de estas personas son nombres de diseño gráfico bastante grandes. Y también pude conseguirlos en mis comentarios porque pude etiquetarlos porque les recomendé sus libros. Entonces eso es algo que hacer es recomendar algo que un creador haya hecho. Etiquetarlos, ojalá que respondan a tu publicación o interactúen con tu publicación de alguna manera. Entonces otra que decidí hacer, esta idea para este post y mucho post realmente bueno provienen de ideas que, de preguntas. Me sale mucho de la gente una y otra vez. Una de esas preguntas es, ¿cuánto tiempo se tarda completar proyectos, diseñar proyectos? Entonces decidí hacer esta infografía. Tomó alrededor de 2 h para armarlo. Pero creo que valió la pena la inversión de 2 h porque el alcance que obtuve con esta publicación en Facebook fue bastante bueno. En Facebook realmente obtuvo una muy buena respuesta sobre esto porque Facebook tiende a amar realmente la publicación llena de información Instagram. A ellos también les encanta. Pero Facebook aún más. Echemos un vistazo a las ideas sobre este. Esto tiene 45 mil alcanzados y el 73% no me estaba siguiendo. Entonces eso es, ese es un gran porcentaje. Quieres que más personas no te sigan, mirando tu contenido para que puedan convertirse en seguidores. Ese es un aspecto muy importante. Entonces quiero cambiar de marcha. He hablado mucho sobre publicaciones de carrusel y publicaciones de una sola imagen. Quiero hablar un poco de reales. Todo el mundo ha estado diciendo lo increíbles que son los reales, lo increíble que es el video. Y en algunos casos eso es cierto, pero no lo he experimentado tanto. Lo bueno de los reales, si haces suficientes reales, te invitarán a formar parte del programa de bonos. Donde el programa de bonos reales donde te pagan por jugada real. Y los primeros cien dólares es súper fácil de conseguir porque solo necesitas alrededor de 30 mil lugares reales. Pero después de eso empieza a ponerse muy duro y necesitas como millones solo para conseguir cien dólares extra. Por lo que soy capaz de generar al menos $100 publicando tres o cuatro reales al mes. Entonces me parece que vale la pena hacerlas. Pero aun así, no los encuentro exitosos en cuanto a llegar a más personas. Entonces echemos un vistazo a algunos de los que tuvieron más éxito. Entonces esta era una psicología del color, cual tomé ese gráfico y pude recorrer diferentes cosas sobre el color. Simplemente básicamente recorre ese gráfico, pero con un video y un real Y eso tendía a hacerlo bien, Tenía alrededor de 12 mil reproducciones. mí me pareció bastante fuerte. Aquí hay muchas muertes. Muchas cosas donde publico cosas personales sobre ir de excursión o mis vacaciones. Y a esos simplemente no les va bien porque no están relacionados con mi tema de diseño gráfico. Son muy personales. Es como lo que publicaría un influencer. No me considero un influencer donde se publique sobre mi estilo de vida. Simplemente no les va bien. Y entonces quiero hacer esos posts porque son poco divertidos e interesantes y un descanso del diseño gráfico. Pero me estoy alejando de mi nicho. Me estoy alejando de mi tema y a ellos no les va nada bien. Entonces a éste le fue muy bien. Pude crear este póster y lo pedí y de hecho lo tengo a la venta si quieres conseguirlo en la sociedad seis. Pero pude desplegar esto, tomarle algunas fotos. Y a pesar de que esto es un poco como una publicidad de producto por alguna razón realmente resonó con la gente y tenía algunas opiniones bastante buenas al respecto. Así que creo que tenía 17, 17 o 15 mil, 15 mil vistas. Y luego hay algunos que pensé que serían buenos Affinity Designer, que es una alternativa a Adobe, salió con esta nueva actualización de software soft big. Y así hablé de todo lo que había nuevo en él. Simplemente no le fue bien porque, ya sabes, es una especie de software secundario. Aunque me encanta el software Affinity, la mayoría de mis alumnos, la mayor parte de mi audiencia usa Adobe y simplemente no conectó con la mayoría de mi audiencia. Y tengo que tratar de averiguarlo, y tengo que tratar de recordarme a mí mismo para conectar más con la mayoría de lo que le gusta a mi público, aunque disfruto publicando sobre estas otras cosas, Eso es sobre ello. No hay nada más realmente significativo. No tengo recargas con más de 20,000 vistas. Y si lo hago, te diré cómo lo hice si alguna vez lo consigo algún día. Pero ahora mismo estoy más enfocado en lo que está funcionando, que es el post del carrusel. Entonces obviamente mi cuando hago publicidad y hago una publicidad directa, obvio que estoy vendiendo algo. esos nunca les va bien y esos les va bien si quieres impulsar el post y hacer algo de dinero pagado para seguir impulsando el post. Pero si solo buscas seguidores orgánicos, nunca hace bien hacer publicaciones dedicadas directas que anuncie. Entonces lo que he hecho últimamente es hacer mis publicaciones informativas y al final, voy a anunciar. Y eso hace mucho mejor que esto donde es solo promedio, solo un agregado directo. La gente ve que están como, no me interesa, siguen adelante y no se involucran con el puesto. No le va muy bien. Entonces este solo tiene 174 likes y el alcance es probablemente bajo en comparación con lo que te estaba mostrando. Entonces lo que me gusta hacer es Stealth, supongo que lo llamas publicidad sigilosa, donde la empacas un poco en algún lugar al final de algo. O tienes que descargarles un PDF y luego al final estás vendiendo algo. Ese es otro método además de regalar algo gratis. Y entonces tienes un pequeño enchufe al final después de habérselas dado eso. También otro, de verdad tengo que hablarte de esto. Yo, publiqué algunas cosas sobre cripto, y también publiqué algunas cosas sobre algunas nuevas tendencias emergentes que son muy polémicas. Una fue esta cripto que en realidad perdí muchos seguidores cuando publiqué esto porque mucha gente está como, bueno, me encanta el cripto y soy seguidor y no puedo creer que no eras un creyente en el cripto y perdí a mucha gente de esa manera. Entonces tengo que recordar, bien, a mitad de mi audiencia le encanta el cripto, la mitad de ellos lo odian. No puedo publicar algo que diga que estoy a favor de algo y esperar que el público lo respete a menos que sea algo en lo que realmente creo y esto es algo que no sé. Estoy en la barda. no debería haber publicado algo tan fuerte. Pero otra cosa que hice fue M, arte generado por IA. Experimenté con mid journey e hice un post sobre solo explorar mi proceso de generación de AIR. Y tuve que mucha de mi audiencia se enojó mucho, muy. Y cuando miró mi gráfico sin seguir y mi siguiente gráfico, verás que esta enorme caída de gente en realidad perdió más seguidores ese día de los que yo la gané porque hablé de un tema polémico. Y a mucha gente le ofende que AIR se haga cargo de artistas realmente trabajadores. Y tengo algunas conversaciones increíbles, una gran cantidad de conversaciones increíbles con personas que me conocen y saben que no estoy en contra de nadie ni por nada que haya sido bueno y que me hayan tenido algunos de los mejores engagement con este post, pero también tuvo mucha gente y sígueme. Y así solo tengo que tener cuidado al elegir temas en los que creo al 100% y no como medio y medio, sobre todo cuando son polémicos. Este que empacé con información Se trata de un proyecto de logotipo que vale $100 o 10,000? Y la respuesta está determinada por el valor. Y en realidad tomé esto de otro libro que escribí y acabo de empacar esta cosa con muchos ejemplos realmente buenos. Y pensé que iba a ir bien, pero esto publicado no funciona tan bien como un poco decepcionado porque pasé mucho tiempo en ello. Y una de las cosas que me doy cuenta es la diferencia entre las publicaciones que tuvieron mucho éxito en esta es, esta es muy, muy palabra pesada. No es tan visual, no tiene tantos gráficos de información que tenga algunos Pero creo que eso fue desalentador en el formato de Instagram que creo que fue un poco pesado de dos palabras. Entonces, después de un miembro, ¿ hay alguna manera descomponer mis gráficos y hacerlos más visuales y crear infografías a partir de párrafos? Y creo que eso nos hubiera ayudado a hacerlo mejor. Entonces otra cosa es involucrar a tu audiencia. Entonces tienes marcadores y acciones, que es realmente lo que ayuda a que el post se vuelva viral. Desafortunadamente, los comentarios no ayudan tanto como pensarías, pero es realmente bueno para tu audiencia actual interactuar contigo y te relacionarías con ellos. Así que de vez en cuando voy a hacer una publicación base conversacional para romper un poco todas esas publicaciones base informativas en cualquier tipo de publicaciones promocionales que haga. Esto era justo en lo que debería enfocarme a continuación. Y esto tenía más comentarios que nada, no nada de lo que publiqué, pero tenía muchos, muchos comentarios y compromiso realmente buenos. El Cartero antes que él súper bien, pero me siento muy bien. Obtuve un poco más rápido todas sugerencias geniales de la gente y la dirección y pude tener conversaciones con cada persona, siempre volver a cada comentario a menos que su spam, eso siempre ayuda al algoritmo. Tal vez no tanto como esperaba, pero aún así ayuda comentar cada comentario corazón, cada comentario realmente, realmente comprometerse. Así que una vez más, aquí hay un post que pensé que funcionaría muy bien porque pasé horas en este post. Son momentos importantes y la historia del diseño gráfico moderno. Y pasé horas investigando esto y obteniendo gráficos y juntándolo todo y simplemente no funcionó tan bien. Y estoy pensando una vez más, es la palabra pesadez de ella. Necesitaba encontrar una manera de desglosar esto en infografías es demasiado. Esto es cuando esa información empaca densamente cosa de la que estaba hablando antes, puedes ir por la borda en ella. Y este es un buen ejemplo porque pensé que esto no es genial. Entonces lo que hice es que tomé todo ese trabajo y lo puse en mis cursos y la gente puede usarlo. No se desperdició. No lo era, esta creatividad no estaba bien, desperdiciada. Esta publicación no se desperdició. Estaba triste y lo hago tan bien en Instagram. Entonces este podría ser un poco difícil de escuchar porque pensé que publicar parte de mi trabajo personal obtendría la mayor cantidad de vistas porque oye, gente está interesada en mi trabajo. Cuando me enteré es que no es tanto el caso. Y creo que ese es el caso de muchos creadores. Algunos creadores tienen estilos realmente únicos y la gente realmente los amaba y se los comía. Estaba experimentando con 3D. Decidí publicar mi trabajo. Y tú solo, acabo de obtener números de compromiso muy, muy bajos con casi cada vez que acabo de publicar trabajo porque no había mucho en eso. A ver si puedo encontrar otro. Quiero decir, no hay mucho que hacer. Aquí hay algunos trabajos que te pueden gustar. Podrías comentar y decir, Oh, me gusta o ¿cómo lo creaste? Pero no hay mucho compromiso o razón para responder a un proyecto a menos que te guste abrumadoramente. Simplemente siento que no es compartible. Quiero decir, si es un proyecto increíble de primera categoría, tal vez sea compartible. Y aún así os animo a que publiquen su trabajo porque todavía puede hacerlo muy bien si publican su trabajo. Pero simplemente no pienses que esa es la única forma de publicar proyectos de diseño es simplemente publicar tu trabajo y eso es todo. Tienes que publicar publicaciones informativas para que puedas establecerte, establecerte como un experto calificado. Y esa es una manera realmente genial de encontrar exposición al posible trabajo del cliente es publicar una variedad de cosas, averiguar qué funciona para ti. Y soy un firme creyente de publicar información y simplemente solidificarse un poco como un experto en la materia. Y esa es probablemente la mejor manera de establecerte como un profesional y conseguir ese trabajo extra de cliente. Pero también mezclar algunos proyectos personales ahí dentro también. Pero no trates a Instagram como un portafolio. Tienes un portafolio, ya sea en Behance o en tu propio sitio web. Um, y es posible que tengas una cuenta separada que solo publique tu trabajo. Pero si realmente buscas hacer crecer una audiencia y crecer como profesional. Haz una mezcla, haz una mezcla de educación y algunas ideas sobre la industria y cosas a tener en cuenta y ese tipo de publicaciones. Porque creo que te irá muy bien con esos. Entonces no lo han hecho. Solo quería compartir contigo algunas ideas para que puedas hacer trampa un poco y llegar a los cinco años de trabajo que hice al publicar lo que funcionó, lo que no funcionó. Y tipo de toma eso y úsalo para hacer crecer tu propio Instagram para que M TikTok y todas estas otras cosas también. Quiero decir, cualquier tipo de plataforma de redes sociales. Creo que muchos de estos carteles, pero también en Facebook, y a algunos les fue mejor en Facebook y a algunos de ellos les fue mejor en Instagram. Y eres bueno para ir a averiguar cuáles van mejor a través del tiempo. Pero solo quería grabar un video rápido que haya compartido algunas ideas más. Tratando de crear videos que te ayuden a monetizar o ayudarte a crecer profesionalmente con tus habilidades de diseño. Así que ojalá hayas disfrutado este video y avísame si quieres que cree más así, un poco más detrás de la cortina, detrás de escena de cómo he crecido en los últimos años y cómo puedes crecer tú mismo. 20. Desafío de diseño estudioso: ahora es el momento de la siguiente debido al reto de diseño. Esta vez, tu tarea será crear una campaña cohesiva en redes sociales consistente en al menos dos publicaciones diferentes. Los anuncios de pago son anuncios digitales. Esto podría ser para la historia de Facebook, instagram e Instagram. Miniatura de video de YouTube Cualquier cosa que tenga presencia digital en línea en la plataforma de redes sociales . Si quieres hacer una suite completa de tamaños o publicar en diferentes plataformas, siéntete libre de hacerlo. Pero sólo se requieren dos para presentar un proyecto para este reto. Tendrás varias semanas para armar tu campaña. Puedes publicarlo en los grupos de Facebook para que envíes comentarios, o puedes publicarlo en las Q y A. Son secciones de proyecto de tu clase actual que estás tomando o simplemente envíame un mensaje de tu trabajo. 21. Gifs animados en Photoshop: Entonces, ¿qué pasa con la animación? Los GIF son anuncios animados de display. Vamos a aprender a hacer eso en Adobe Photoshopped hoy. Vamos a crear esta animación GIF para una exhibición en vamos a tomar nuestro gran anuncio de rascacielos, que será de 300 por 600 píxeles. Y vamos a hacer esto animado para que podamos agregar un poco de animación a nuestros anuncios. Y además, puedes hacer GIFs animados para anuncios de Facebook también y otras plataformas de redes sociales no solo para anuncios de display. Entonces vamos a seguir adelante y empezar aquí. Entonces estoy tomando los elementos básicos de marca que ya hemos desarrollado con nuestra otra campaña de marketing digital , y vamos a adaptar todo eso para crear un poco de plantilla que ustedes puedan descargar. Voy a seguir adelante y cambiar a la plantilla. Se llama plantilla GIF animada, y van a ser los 300 pixeles y con por 600 pixeles y altura, anuncio rascacielos y ya tienen algunos de los archivos del logo y algunos del tipógrafo aquí, vamos a animar todo este dedo ya no darle la sensación estática, pero para especie de atrapar a los espectadores Atención cuando están desplazándose por su sitio de noticias , pueden tener un poco de animación y siempre ayuda a tener animación en video tanto como puedas, si es posible. Por lo tanto, siéntase libre de abrir la plantilla o crear la suya propia. Si quieres crear el mismo gráfico todo por ti mismo sin usar la plantilla, vas a archivo nuevo. Simplemente vas a hacer un 300 por 600. Por supuesto, puedes hacer cualquier anuncio de tamaño que pueda dio y resolución. Voy a mantenerlo en 300. Por ahora, si el tamaño de archivo es un gran problema dondequiera que esté colocando su anuncio, siempre puede reducir eso a 72 pero tres cientos. Bien. Si es que tienes un poco de espacio de movimiento con tus requisitos de tamaño de archivo. El modo de color siempre será RGB, y eso es más o menos todo. Simplemente vamos a seguir adelante y hacer clic, OK, y va a crear una plantilla simple para ti, y yo solo como que arrastré estos en estos aires solo archivos muy simples y asegurarme de que nombres todas tus capas. Entonces voy a seguir adelante y nombrar aquí todas las capas porque cuando empecemos a animar cada una de estas capas. Es realmente agradable tener estos titulados. Entonces, ¿cómo hacemos la tienda de fotos animadas? No parece haber un montón de opciones aquí para animar. Lo que tenemos que hacer es abrir una ventana completamente nueva. Vamos a subir a nuestro panel de opciones de ventana y sacar los paneles de la línea de tiempo van a seguir adelante y seguir dedo del pie línea de tiempo de la ventana. Esa es la clave para empezar con la animación y crear regalos. Esta va a ser nuestra línea de tiempo. Simplemente vamos a dar clic en la opción crear línea de tiempo de video. También hay una capacidad de crear una animación de fotogramas. Vamos a hacer una cronología de video. Entonces lo que va a hacer va a tomar cada una de nuestras capas en nuestro panel de capas, y le va a dar una línea de tiempo a través de una línea de tiempo predeterminada, por lo que notarás que cada capa coincide así que tenemos una capa de caja naranja y luego naranja caja una capa de logotipo y luego una capa de logotipo, y notarás cómo selecciono las capas. En la línea de tiempo. Seleccionará automáticamente las capas en el panel de capas. Entonces vamos a editar cada una de estas una por una y crear una animación diferente para cada capa para darle un efecto dinámico. Entonces si alguna vez has hecho una edición de video antes, estarás justo en casa, si alguna vez has jugado alrededor y después de efectos, va a ser una configuración muy similar, pero justo mucho más simplista en photoshop. Entonces hagamos algo muy sencillo para que podamos hablar de lo que se llama animación de fotogramas clave . Entonces hagamos algo sencillo con esta tipografía. Nos gustaría que esta tipografía se desvaneciera lentamente de cero opacidad a 100% opacidad. Al igual que el simple regalo aquí mismo. Simplemente queremos llegar a desvanecerse lentamente de 0 a 100. Entonces vamos a ir a buscar esa capa. Por lo que lo tienes seleccionado yoga en la playa. Entonces aquí está nuestra capa justo aquí. Por supuesto, puedes cambiar el tamaño de esto por defecto. Está bastante apretado, así que suele ser así, pero me gusta tenerlo bonito y abierto. Entonces yoga en la playa. Entonces lo que vamos a hacer es que son sólo una flecha pequeña y vamos a derrumbarla. Nuestro propio colapso lo y un bien que se le den varias opciones diferentes. Has transformado la opacidad, estilo y el texto warp el que vamos a meter con su opacidad cuando cambie de 0 a 100. Entonces lo que queremos hacer es que queremos establecer fotogramas clave para cada una de las animaciones. Por el momento, Opacidad. Bueno, cuando vaya y haga clic en el cronómetro aquí mismo, solo haga clic en ese ícono y va a seguir adelante y configurar un marco clave para usted. Por lo que este primer pequeño triángulo amarillo será tu marco clave. Entonces eso va a marcar el tono para la animación. Entonces lo que queremos hacer es añadir un fotograma clave más para que pudiéramos simplemente movernos y esto va a ser segundo. Entonces esto es de un segundo dos segundos, tres segundos, cuatro segundos. Digamos que queremos tomar alrededor de un segundo para desvanecerlo. Entonces vamos a ir aquí a esta zona y hay dos formas en que podemos hacer esto. Podemos sentarnos ahí y dar click en esto aquí para agregar un fotograma clave, y podemos movernos y queríamos quizá hacer otra animación de opacidad o transparencia. Podemos seguir agregando marcos clave dependiendo de lo que queramos hacer. Pero queremos hacer esto de manera muy sencilla. Entonces aquí está nuestro primer marco clave. Entonces, cuando seleccionemos nuestro primer cuadro crujiente, vamos a seguir adelante y establecer el nivel de opacidad. Entonces vamos a volver a nuestro panel de capas aquí mismo en la opacidad y trabajando para reducirnos todo el camino a cero. Por lo que desaparece. Y esto es lo genial de las animaciones de fotogramas clave. Entonces este es el primer marco clave, y esto de aquí está arrastrando mi pequeña opción por aquí. Mi línea de tiempo y yo podemos seleccionar el segundo fotograma clave y seguir adelante y establecer 100% de opacidad. Entonces lo que tenemos es un 0% y luego por aquí tenemos el 100%. Entonces lo que pasa es que las tiendas de fotos van a llenar el entre de los marcos clave, toda esta área entre los marcos clave, y va a desvanecerse lentamente el envío. Por lo que pasa de un fotograma clave a otro y transiciona la animación para poder ver cómo aparece repentinamente la tipografía en la pantalla. Entonces hagamos lo mismo con nuestro artículo 20%. Entonces sigamos adelante y un colapso esta flecha aquí y tendremos la opción de establecer un marco clave para la opacidad. Así que están justo aquí. Al inicio mismo de la animación, vamos a dar click en la opacidad, fueran a hacer lo mismo que se agrega automáticamente nuestro primer fotograma clave. Quiero asegurarme de que el fotograma clave esté establecido en opacidad cero, así que va a desaparecer, y queríamos un poco de desvanecerse justo alrededor de esta zona, así que tiene una nueva o línea de tiempo para que pudiéramos sentarnos ahí y agregar un nuevo fotograma K. Pero si vas adelante y vuelves a cambiar la opacidad al 100% automáticamente agregará un fotograma clave para ti si cambias la opacidad en otro momento. Entonces van y lo hacen al 100%. Ve cómo me agregó automáticamente un marco clave, así no tengo que sentarme ahí y agregar manualmente el segundo fotograma clave. Entonces vamos a ver cómo esa mirada estaba arrastrando esto a través cuando se podía ver que ambos se desvanecieron. Lo que realmente quiero hacer es no haberme escalonado para que no se desvanecen en todo el mismo tiempo, pero están escalonados y vienen en momentos diferentes. Eso es muy fácil, con uno o 20% ya que es más tarde en bajar la lectura. Visualmente, queríamos spade en último, Así que todo lo que tienes que hacer es cambiar tus fotogramas clave por tal vez 1/2 2do o así, y ahora tipo de reproducirlo. Eso se desvanece, y luego va a golpear ese fotograma clave, y luego el segundo va a desvanecerse así, y puedes seguir agregando fotogramas clave para cambiarnos tanto como quieras. Entonces si quiero desplazarme por aquí, cambiar la opacidad de nuevo a cero y luego desplázate por aquí y cámbiala de nuevo al 100% puedes ver cómo puedes agregar tantos fotogramas clave como quieras Tim Bergen dentro y fuera y dentro y fuera . Pero sólo tenemos que hacerlo esa vez. De acuerdo, entonces esos dos ahora están animados. Veamos qué podemos hacer con el logo. Más tengo que, realidad, en lugar de simplemente cambiar la opacidad, trabajar un cambio con la posición, subamos a nuestra capa de logotipo y un colapso. Eso y nos va a dar algunas opciones diferentes porque es un objeto. No es tipografía, así que su objeto. Entonces va a tener algunas opciones de marco clave diferentes para nosotros. Por lo que queremos establecer el marco clave de posición. Entonces antes de hacer opacidad, esta vez, vamos a hacer las posiciones o a dar click en nuestro cronómetro para cargar nuestro primer fotograma clave. Estamos justo aquí al inicio de la animación, así que ahí está nuestro primer fotograma clave. Y entonces, ¿dónde queremos que haga esto? ¿ Queremos que se deslice de izquierda a derecha, derecha a izquierda. Hagámoslo ir de arriba a abajo. Entonces voy a acercarme aquí. Lo que voy a hacer es este es nuestro primer fotograma clave y nuestra animación. Lo vamos a deslizar para que desaparezca. Voy a mover esto. Sigamos adelante y creemos un nuevo marco clave. En lugar de ir aquí y hacer clic en un nuevo marco clave. Puedo cambiar la posición. Vamos adelante y hagamos nuestras teclas abajo o mi flecha abajo y la voy a volver a poner justo en posición exactamente donde quiero que termine. Te sueltas. Va a crear automáticamente un marco clave para mí. Entonces veamos cómo se ve eso desde este marco clave hasta este armazón de mal gusto. Veamos la animación porque deslízate lentamente en posición. Y como dije antes, podríamos quedarlo así para siempre. O podríamos añadir un nuevo marco clave y vamos a ver, digamos que queremos sacarlo, solo tratando de mostrarte lo que todo lo que puedes hacer, por lo que automáticamente creará un fotograma clave. Volvamos para que baje. Después se desliza solo para una especie de mostrarte lo que puedes hacer. Y puede seguir creando marcos clave y seguir animando este logotipo tanto como quieras. Pero no puedes simplemente seleccionar el marco clave y eliminarlo para eliminarlo. Entonces lo mismo va con su tipografía. No queremos que todo suceda a la vez. Nosotros como que queremos tambalear un poco esto. Queremos nuestro logo en lugar de simplemente bajar la opacidad total. Es realmente agradable. Si también se desvaneció en un oleaje. Creo que tendría un aspecto mucho más pulido que simplemente bajando aleatoriamente a plena capacidad para que puedas crear múltiples capas aquí, así que tenemos una línea de tiempo de posición que tenemos, pero también podemos hacerlo opacidad también. Entonces vamos a dar click en nuestro cronómetro. Nunca primero marco clave, que queremos seguir adelante y ponerlo a cero. Pasemos en la línea de tiempo cuando baje hasta su posición final. Queríamos ser opacidad total. Entonces con opacidad seleccionada, vamos a subir aquí, cambiar 200% y vamos a ver cómo va esa animación. Y en cualquier momento que quieras una vista previa, una animación, puedes hacer clic aquí atrás todo el camino de regreso al principio. Vaya al primer cuadro y luego adelante y haga clic en jugar, Vamos a jugarlo para nosotros. Y si quieres verlo continuamente, bucle. Entonces solo no tener que seguir lo estamos lloriqueando y jugando. Se puede bajar a esta pequeña configuración. Puedes seleccionar la reproducción en bucle, y siempre que llegue al final de la animación total, empezará de nuevo automáticamente para que no tengas que seguir retrocediendo principalmente y previsualizándola . Tipo de verlo un par de veces y ver cómo te gusta la animación. Entonces una cosa que quiero hacer es que quiero sacar un poco más la animación del hombre porque estoy viendo esto y todo sale en pantalla muy rápidamente dentro del 1er 2do y realmente quiero escalonar esto más allá. Adelante y pausemos. Vamos a volver a nuestra capa del 20%, desplazarnos hacia abajo, volver a nuestra capa del 20%, y vamos a sacar esto un poco más de tiempo. Por lo que llevándolo más allá en la línea de tiempo. Lo mismo con esto. Tenemos los fundidos duran más, por lo que se tarda más en desvanecerse. De acuerdo, así que ahora veamos cómo se ve ese juego de prensa. Eso tarda un poco demasiado en desvanecerse. Entonces sólo hay que apretar el desvanecimiento ahí. Pero mantenerlo comenzando en una posición posterior. Por lo que el 20% necesita ser más tarde, y luego el yoga en la playa necesita entrar primero. Ahí vamos. Entonces tenemos esos tres animados que hemos hecho posición. Nosotros no opacidad. Veamos qué más podemos hacer. Todavía tenemos todos los paquetes de viaje, capa de capa que podemos hacer para que podamos un colapso que haga clic en opacidad. Va a traer eso de vuelta al primer marco clave del dragger cerebral de vuelta. Eso va a ser una opacidad cero, y vamos a ir por aquí y seguir adelante y hacerlo 100% de opacidad. Pero vamos a hacer que esto dure. Eso queremos porque eso está más abajo en la legibilidad. Entonces quieres leer, tener yoga en la playa que el 20% y luego ese último. Entonces veamos cómo se ve todo. Volvamos atrás y jugémoslo para que caiga hacia abajo que se desvanezca. Perfecto. Genial. Entonces todo se ha ido desvaneciendo lentamente. Entonces ahora lo que queremos agregar es una bonita imagen de fondo que poco a poco acercará ya que todos estos otros elementos también se están acercando. 22. Gifs animados en Photoshop en Photoshop en Photoshop: fotos: Por lo que encontré esto en pixels dot com. Acabo de escribir yoga y encontré la primera foto de yoga que pude encontrar. Parece que está en la playa. Adelante y tomemos éste. Solo voy a copiar esto y pegarlo en nuestro GIF animado. Y lo que quiero hacer es dar click derecho en la capa de fotos. Acabo de arrastrar y quiero convertirlo en un objeto inteligente porque voy a estar cambiando bastante el tamaño y no quiero que se borre o pixelen. Entonces voy a convertir a objeto Inteligente y seguir adelante y titulo foto. Vamos a seguir adelante y a medida de qué tamaño Queremos que sea en el punto de partida. Entonces vamos a tratar de encontrar un buen recorte para ella, y vamos a acercarla. Entonces hagámosla un poco más pequeña al principio, como un tiro de cuerpo completo. ¿ Y qué es dragger? Bajar hacia abajo en el sistema de capas. Y vamos a traer toda nuestra tipografía hasta arriba la animación todavía va a seguir siendo la misma en la tiempo. Aunque lo mueva hacia arriba, sigue siendo conseguir un desvanecimiento de la misma manera. Entonces no te preocupes por perder eso. Basta con seguir adelante y enmarcarla perfectamente justo ahí. Por lo que queremos que se amplíe lentamente durante todo este proceso. Entonces es bueno o foto aquí abajo en nuestra línea de tiempo. De acuerdo, así que aquí está nuestra foto. Adelante. Parece que comienza más tarde en la línea de tiempo, justo de la forma en que tipo de agregamos esa foto en. Arrastremos toda esta capa hasta el principio de los tiempos, una vez y fuera coincide con todos los demás. Y vamos a acercarla lentamente. Bueno, va a ser la opción de transformación. Entonces vamos a seguir adelante y dar click en el cronómetro. Vamos a conseguir nuestros primeros fotogramas clave desde el principio. Entonces ahora vamos a movernos y especie de ver cómo queremos moverla. Entonces vamos a un poco de esto es como tipo de escala hacia fuera nuestro zoom hacia fuera. Supongo que diría en las líneas de tiempo que vamos a alejarnos para poder ver el final de la tiempo. Y toda esta animación durará cinco segundos. Entonces hagámoslo parado al final mismo. Hagamos que ella siempre tenga algún tipo de movimiento, y son para la foto. Entonces lo que vamos a hacer ahora es que la vamos a hacer un poco más grande y un zoom en la mujer Lentamente a medida que termina el anuncio, igual que ese clic entrar. Se va a sumar automáticamente en un marco clave para mí. Entonces vamos a ver cómo se ve eso. Sólo volviendo cosas atrás. Amén. Todo se carga. Sigue acercándola. Siempre hay algo de animación, y luego termina ahí mismo. Eso se ve realmente bien. Podríamos ir y hacer click en jugar en cualquier momento y ver cómo luce eso. Entonces digamos que queremos hacerlo más corto o más largo. Entonces es cuando se puede tener control sobre la longitud. Entonces ahora mismo esto son cinco segundos y puedes arrastrar cualquier cosa por más tiempo. Entonces digamos que queremos que todo lo demás se desvanezca, y queremos que solo la foto continúe con el dedo del pie por último otro segundo o así. Podemos hacer eso simplemente arrastrando esa parte más a la línea de tiempo. Podríamos arrastrar todo lo demás y hacerlo más grande también. Podría hacer que todo sea seis segundos también. Y también puedes hacerlo más corto. Y simplemente no te dejes saber que hay otra opción para animar fotos. Voy a seguir adelante y mostrarte eso aquí mismo, así que en cualquier momento que tengas una foto, te va a dar una opción aquí mismo. ¿ Ves esta pequeña flecha al final? Vamos a dar click en eso. Yo iba a tener este movimiento tú para tener una opción de menú desplegable. Ahora mismo es por costumbre, que es lo que acabamos de hacer. Acabamos de hacer una versión personalizada. Hicimos una transformación, pero también hay algunas construidas en unas. Entonces digamos que queremos hacer zoom, que es exactamente lo que acabamos de hacer. Haz clic en Zoom, y automáticamente va a hacer una especie de esa animación para ti y configurar los cuadros crujientes . Pero como que me gusta hacerlo manualmente, porque siento que tengo un poco más de control y hago clic atrás y no hago movimiento luego volver. O podría volver al panel de historia y volver todo a cómo lo tenía. Correcto. Así que vamos a hacer que nuestro cuadro de línea de tiempo sea un poco más corto y jugar esto una y otra vez en bucle, así que tenemos nuestros pequeños ajustes aquí. Tengo esto en la reproducción de bucle. Entonces vamos a ver cómo va la longitud ISS porque queremos que este sea un GIF repetido. Volvamos al principio y juguemos. Como que veo cómo nos gusta la longitud. Todo se desvanece. Ahí vas. Es un poco largo. Algunas escuelas lo acortan en un segundo curso, podría tener algunos GIFs animados que duran 20 segundos, y siguen teniendo otra foto que se desvanece. Entonces digamos que queremos hacer eso. Digamos que tenemos este GIF animado. Eso es genial. Y si queremos deslizarnos en otra oferta en el mismo GIF animado que empieza a ponerse un poco complicado y largo y no se convierte también. Yo solo quiero mostrarte como harías eso. Entonces vamos a traer una segunda foto. Tengo una foto similar usada en la campaña anterior que va a acercar su prensa enter. Llamemos a esta foto para así ahora ¿qué pasa desde el momento? Por supuesto, podemos arrastrar esta foto pop en cualquier momento pero vamos a arrastrársela a papá, ¿ verdad? Dónde están otro tipo de promoción está terminando. Entonces tenemos esto pasando, entra y luego va a golpear este punto, y luego de repente, y luego de repente, esta foto va a venir por supuesto, podemos colapsar esto, y en podemos colapsar esto, lugar de simplemente venir abruptamente en, podemos tener que sea una transición más suave o desvanecerse. Es lo que podríamos hacer una diapositiva este poco y así hay un poquito de una superposición que vamos a hacer en opacidad. Voy a dar click aquí en nuestro marco clave. Va a ser cero va a salir aquí, tener este desvanecimiento en cuando eso termine y que el SPEEA lo pase al 100%. Entonces, mira lo que pasa. Entonces tenemos nuestra animación entra, vuela, vuela, entonces tienes son lentamente esta otra imagen cargando en la parte superior lentamente, igual que eso es sólo una transición más suave, porque yo hice la opacidad. Y entonces ahora podemos trabajar en un conjunto entero de tipografía aquí. Entonces digamos que queremos traer este libro ahora otra vez, sigamos adelante y duplicemos nuestro libro. Ahora vamos a tener este ser libro ahora también. Ahora es un libro, también está justo aquí. Voy a deslizar esto y hacer que este se desvanezca. Entonces hagamos una opacidad en este. Esto se está complicando más. Pudo haber terminado ahí mismo en esa primera serie. Lo hicimos, así que eso va a ser un 0% de opacidad. Y luego vamos a tener esto descolorido bastante rápido. Ahí vamos. También queremos asegurarnos en nuestro sistema de capas que tengamos la tipografía por encima de las fotos . Sólo voy a arrastrar esto hacia arriba, y en nuestra línea de tiempo, automáticamente va a hacer eso por nosotros. Por lo que sigue usando tu sistema de capas para conseguir que las capas se ordenen. Ahora tenemos un botón de libro abajo. Por supuesto, podemos tener más complejo un conjunto completamente nuevo, una oferta completamente nueva aquí con tipografía, pero solo vamos a tratar de mantenerlo sencillo. Entonces volvamos a ver cómo se ve todo. Es quien sea mujer que se desvanece en nuestro logo o tipografía cargando lentamente de arriba a abajo. Y tenemos otra foto que poco a poco se desvanecerá debido a la vista previa. Esto es ahora mismo, esta es nuestra longitud de vista previa. Entonces cuando llegue a este punto vea especie de la diferencia entre el gris claro y el rayo oscuro. Una vez que llegue a este punto, volverá a iniciar el bucle del dedo del pie. Entonces lo que queremos hacer es que solo queremos arrastrar esta barra de vista previa hasta el final de su animación. Entonces ahora cuando volvamos a la vista previa, va a jugar todo el camino. Intentemos eso otra vez, y lentamente debería desvanecerse en perfecto para que podamos tener otra tipografía entre, y luego puede volver al principio. Maravilloso. Por lo que ahí la ISS. Es bastante fácil animar las cosas cuando tipo de sabes cómo desvanecerse. Cambia la posición que puedes hacer, ah pan en fotografía mucho lo que puedes hacer aquí. Entonces sigamos adelante y terminemos esto y aprendamos a exportar este y el mejor formato posible. Por lo que estamos listos para exportar esto y probarlo en un navegador. Entonces esto es lo que vamos a hacer para exportar 23. Gifs animados en Photoshop en Photoshop - exportar gIFS: por lo que la mejor manera de exportar un regalo es ir a la exportación de archivos y un legado web más seguro. Entonces vamos a ir archivo Exportar más seguro Web Legacy Esto nos va a dar muchas más opciones, la Web más segura que las otras opciones de exportación. Entonces es decir para Web, y notarás que puede tardar unos minutos para esta carga del dedo Lo que está haciendo, sus componentes, amontonando todas las imágenes que componen el regalo juntas y dándote las opciones para exportar esos imágenes por lo que notarás el tamaño del archivo justo aquí abajo, verás 4.4 megabytes. Conozco muchas plataformas de redes sociales y medios de comunicación que tienen GIF animados como tipo de opción para ti. ellos les gustaría mantener bajo ocho megabytes, así que es un poco agradable mantener un archivo de regalo por debajo de ocho megabytes, pero cada plataforma va a tener sus propios requisitos. Entonces solo fue antes de hacer el regalo, solo ve tipo del tamaño del regalo que necesitas hacer. Y también si va a haber algún requisito de tamaño porque siempre hay formas en que puedes reducir la calidad para reducir el tamaño del archivo según sea necesario. Pero ahora mismo, ese es un tamaño de archivo bastante aceptable, y parece que tardará un poco menos de un segundo en cargarse en un normal de 56.6 kilobytes . Conexión a Internet. Aquí hay un par de cosas que podemos hacer en cuanto a opciones. A mí me gusta hacer el regalo 1 28 dithered dice tipo de va a ser optimizado. Y cuanto mayor sea el número, mayor será la cantidad de colores que tengas disponibles para ti. Entonces si bajas los colores, si querías reducir los colores a dos, puedes. Y eso no va a ser de mucha ayuda. Entonces, cuantos más colores tengas, una más detallada será, pero también cuanto mayor sea el tamaño del archivo, por lo que notarás cuando haga 16 colores. Observe cómo se redujo a la mitad el tamaño del archivo. Entonces si alguna vez tuviste que reducir el tamaño del archivo, esa es una forma de hacerlo. Y la mayor parte de esto, nos vamos a ir por defecto. Por lo que trabajando un do incluyendo transparencia. Todo esto es una especie de impagos elecciones. No vamos a llegar a profundidad todas estas diferentes opciones. Vamos a mantenerlo por defecto, así que sigamos adelante y exportemos. Todo lo que vamos a tener que hacer es hacer clic en Guardar, guardar en el escritorio. Deja todo eso tal como está. Adelante y guárdalo. Una vez más. Va a tomar un minuto o dos. Entonces ahí está, 5.6 megabytes. Contamos con la plantilla de regalo. Entonces si haces doble clic en él, claro que voy a manzana. Podrás ver todas las diferentes imágenes que componen tu regalo. Como puedes ver, hay más de 130 fotogramas 140 solo para conformar esa animación de seis segundos. Entonces, ¿cómo previsualizamos la animación? Lo mejor que puedes hacer es arrastrarlo a cualquier navegador que tengas. Entonces eso va a arrastrar esto a mi Déjame probar Firefox. Voy a arrastrarlo a mi navegador Firefox, y va a poder previsualizar para ello. Y ahí está. Y es aquí cuando podemos cambiar el tamaño y el tiempo. Realmente podemos juzgar que sea como, OK, puedo ver esto 10 veces y repetir y ver si me gustó el ritmo. Si necesito hacer algo más largo y sólo estábamos haciendo una muestra muy sencilla. Lo que podría hacer es dejar arriba esa primera oferta por otro segundo adicional o dos. A lo mejor no fue suficiente. A ver, ahora mismo, queremos poder leerlo. Da click en el libro ahora, así que solo queremos asegurarnos antes de ir a esa segunda oferta, si incluso queremos tener una segunda oferta, queremos frenar eso solo un poquito. Entonces volvamos a la tienda de fotos, conseguir nuestra línea de tiempo fue Adelante y quitar. Diga, ni siquiera queremos tener ese set. Chicos quieren tipo de mostrarte un ejemplo. Entonces tenemos que hacer es una especie de borrar esa capa. Lo borrará de la línea de tiempo. Es como si nunca existiera. Ahora hagamos que todo sea un poco más largo. Sé que estamos yendo hacia atrás y lo que dijimos, vamos a que se extienda a cinco segundos. Saquamos la foto. Saquemos esa línea de tiempo de animación fotográfica aquí y tratemos de exportar. Podemos practicar es bueno para la práctica, así que hagamos un legado web más seguro. Por supuesto, tardará un buen minuto en tipo de compilar todo para ti. Entonces si sientes que tiene este ícono de carga para siempre, no te preocupes. No creo que tu computadora se congelara. Simplemente toma mucho tiempo para Photoshopped compilar esas 140 fotos diferentes para exportar . Entonces practiquemos la exportación de nuevo. Tan solo ten esto un regalo. Probemos colores altos 5 56 K cuatro megabytes. Eso parece razonable. Y también aquí abajo tienes esta opciones de animación es opciones de bucle. Puedes tenerlo solo carga una vez. No tienes que tener este bucle una y otra vez si no quieres, podrías ponerlo aquí mismo cuando lo exportes. Simplemente puedes hacer que suceda una vez donde puedas hacer que suceda y bucle para siempre. Por lo que vamos a continuar con nuestra opción loop para siempre o a hacer click en hecho. Entonces aquí está nuestra última en acción. Ahí está. No tenemos que tener un bucle una y otra vez, y solo podemos tenerlo loop o tenerlo que reproduzca una vez y luego termina para que podamos hacer eso simplemente yendo en nuestra configuración de exportación y tenerlo solo reproduzca una vez en lugar de solo ir una y otra vez y otra vez. Yo sólo quería hacer el que repite tomado, ver tipo de nuestra animación en acción cuando se podía hacer una variedad tan amplia de efectos diferentes . Simplemente no tienes que trabajar con fotos y teclear. Puedes tener todo tipo de hechos suceden con regalos, pero solo quería mostrarte lo básico cómo cargar la línea de tiempo, cómo trabajar el dedo del pie con marcos clave, cómo trabajar con lo muy básico Así puedes seguir empujando esto aún más y añadir efectos y añadir diferentes capas. Puedes tener más de 50 capas. Si realmente querías tener ah, regalo complicado y tener cosas brillantes entrando tienen efectos metálicos. Hay todo tipo de cosas que puedes dio, pero esto es lo básico para que pienses y para que empieces a crear y saber hacer GIFs animados Y el recurso descargable es que voy a estar proporcionando algunos archivos para ti. Entonces si haces clic en GIF animado en archivo de tienda federal, esta es la plantilla con la que vas a querer empezar. Eso sólo un poco tiene los elementos básicos, no tiene nada animado todavía, y este es el ejemplo final, estoy incluyendo mi archivo final de la tienda de fotos para que puedas abrir esto. Podrías echar un vistazo a las capas y cómo tengo todo configurado solo para ver todos los pasos que pasaron en la clase. Si quisiéramos mirar un archivo de la tienda de fotos y tipo de ver cómo se hizo, también tengo el regalo final que puedes arrastrar para que puedas especie de ver cómo funciona eso. Entonces ahora es el momento de tu tarea. Quiero que creas un GIF animado si quieres. Si eliges aceptar el proyecto, quiero que crees uno muy sencillo. Podría ser del mismo tamaño. Si quieres. Puedes usar la misma plantilla, pero quiero que quizá pruebes diferente foto. Yo quiero que tal vez pruebes diferente promoción, solo tipo de agitar un poco y ver qué le puedes agregar para que sea aún mejor que la que hicimos en la clase. 24. EXTRA: creación GIFS a partir de videos: agregó video bono. Quería mostrarte cómo importar un video y crear marcos y un regalo de esa manera a partir de un video ya producido. Por lo que pasé al dot com de Peck sal o a un video de Google Pixels, y me trajo a esta página web donde puedo descargar formatos de video muy sencillos y son videoclips. Y encontré a este de este hombre tipo de desplazamiento, y pensé que puedo encontrar un lugar donde eso pueda bucear de forma muy natural con cómo se mueve el pulgar hacia arriba. Entonces vamos a traer eso a Photoshopped. Simplemente tengo un documento sencillo abierto 1000 por 1000 pixeles o el formato que quieras hacer. Pero no importa porque va a crear su propio documento al importar el video . Entonces esto es lo que vamos a hacer para importar el video Vamos a ir a archivo, ir todo el camino hacia abajo a importar, y vamos a importar fotogramas de video, capas de dedo, y vamos a seguir adelante y seleccionar el video que descargamos desplazándose a través de los teléfonos inteligentes. Voy a hacer doble clic en él y nos va a permitir importar el video. Entonces si hago clic en OK, vamos a recibir una advertencia. ¿ Qué va a decir? Esto producirá un documento grande y posiblemente llevará mucho tiempo. No necesitamos importar todo este video. Solo necesitamos crear un pequeño bucle. Por lo que sólo queremos cosechar esto un poco de alguna manera. Entonces aquí hay una especie de línea de tiempo. Podemos iniciar este regalo en cualquier momento, así que empecemos cuando tenga el pulgar justo en la parte superior. Y este es el final y puede conducir esto por aquí. Entonces este es el comienzo. Tiene esta foto uno. Veamos por dónde esa parada cuando tiene el dedo en toppers Pulgar encima, se desplaza ¿Qué ha pasado? Scroll Una vez más y hagamos que detenga un paseo por aquí. Por lo que está empezando tipo de inicio y final tipo de en la misma posición. Entonces como que tengo nuestros puntos de inicio y final yendo. Arrastre esto justo aquí. Entonces esta es nuestra pequeña área. Va a empezar aquí, desplazarse una vez, desplazarse dos veces hacia el principio. Entonces esa es una especie de la pequeña muestra de este video más grande vamos a crear un regalo a partir de que va a dar click en OK, Va a cargar automáticamente todos estos en el marco de tiempo para nosotros. Y si no ves la ventana del marco de tiempo, pop up, pop up, sólo tienes que subir a la ventana y hacer clic en el marco de tiempo. Y así de esa manera, creó todos estos marcos diferentes para nosotros. Y sigamos adelante y pinchemos. Tenemos todo encendido para siempre, así que va a dar un bucle para siempre sobre él y vamos a hacer clic en jugar. Por lo que ahí está, desplazándose lentamente por su pantalla, y se bucea, y podría bucear para siempre y para siempre y para siempre. Y podría exportar esto de la manera similar a la que hicimos antes de que pudiéramos, para ir al archivo Export Segura Web. Y aquí nos vamos. Siempre podemos cambiar el tamaño de nuestra imagen aquí abajo, podemos cambiar nuestras animaciones de bucle. No nos hemos puesto para siempre, y sigamos adelante. Se trata de 24 megabytes. Es bastante alto. Siempre podemos cambiar nuestros colores hacia abajo 128 y vamos a ver cómo eso afecta el tamaño del archivo de aire y ver si podríamos reducir un poco eso. Toma un poco de tiempo porque tiene que hacerlo todo en todos los fotogramas y eso sí redujo un poco la resolución. No mucho, pero siempre puede cambiar esto hacia abajo y especie de reducir algo de eso. Esas opciones para tipo de obtener un tamaño de archivo más bajo. Por supuesto, va a degradar la calidad. Entonces hacemos click en Done, y acabamos de crear nuestro primer GIF animado a partir de un video. Te da esto arrastrándolo a un navegador, y ahí está, desplazándose. Por supuesto, no tenemos que hacer que el tamaño de la pantalla sea tan grande. Así de grande fue la resolución en el video. Lo importamos automáticamente adaptado a ese tamaño. Podemos subir a la imagen. Podemos bajar al tamaño de la imagen y podemos reducir esto, y el tamaño no pincharía aquí abajo para encajar, también. Y podríamos hacer un tamaño mucho más pequeño para esto. Así que sólo una especie de hacer un tamaño pre seleccionado haga clic en ok y vamos a conseguir una rebaja cada fotograma a esa resolución. Entonces ahora cuando vayamos a exportarlo, será la mitad, o si no 1/3 del tamaño para que no ocupe toda la pantalla. Por lo tanto, digamos que queremos cambiar esto del modo fotograma al modo de línea de tiempo. Línea de tiempo es la que teníamos antes, donde podemos controlarla como un editor de video. Y este es el modo de cuadro donde no todo lo es en un marco diferente. Todo lo que tienes que hacer es bajar justo aquí a este ícono. Vamos a seguir adelante y hacer clic en él, y lo va a convertir al formato de línea de tiempo de video, que es lo que teníamos antes. Da click en eso, y así podrás ver todas estas diferentes capas individuales. Entonces lo que es genial de esto es que podemos agregar tipografía encima de esta animación. Entonces si me desplazo aquí abajo, veamos cómo se ve la animación. Podría seguir adelante e ir a esta capa superior creada nueva carpeta si quisiera llamar a este tipo y vamos a crear otra nueva capa y en realidad hagamos de eso un jugador de tipo. Entonces sigamos adelante y obtengamos nuestra herramienta de tipo. Entonces si queremos tener tipo y ahí también, podríamos hacerlo un poco más grande. Y veamos si no podemos encontrar nuestro tipo y podríamos poner todas estas capas en sus propias carpetas. No tipo de estropear todo pero vamos a hacer tipo y podemos agregar son hola un colapsado que tenemos Hola, está colapsado eso y luego podemos traer esto a la animación. Entonces ahora podría hacer lo que hicimos antes, pero ahora tenemos este fondo de video animado también que podemos usar. En lugar de tener su propia imagen desvanecerse, podemos usar un fondo de video así que solo tipo de mostrarte cómo traer videos como gráficos de fondo así como acercar las fotos. Entonces sé que eso fue un poco tirado a ti. Siéntase libre de volver a ver eso un par de veces. Yo quería incluir definitivamente cómo incorporar video porque eso es una gran parte de los regalos . Es tener algún tipo de video o yo más antecedentes pasando y poder poner tu tipo encima de eso, Un botón click now, todo ese tipo de cosas. Podríamos hacer algunos anuncios realmente geniales con él. Digamos que queremos agregar un poco de animación rápida a este tipo que viene junto con el fondo de video y bajar a nuestra bajada ese tipo de reproductor fotográfico debilitar, ir a transformar y vamos a establecer el primer fotograma clave, así que ese es el primer marco clave. Simplemente muévete poco a poco hará que suba y abajo prensa, entra a la escuela por un poco. Gastar en la dirección opuesta económicamente, tenía un marco clave. Presionar entrar y está seguir adelante. Puedes hacer todo lo que quieras con esto. Volvamos a neutro para que cuando bucle, no tenga ningún salto de ningún marco. Entonces veamos cómo se ve eso, sólo como ir de ida y vuelta. podía ver cuántos fotogramas clave se necesita para hacer ese poco de animación de texto , pero también se puede desvanecer. Podrías hacer muchas cosas aquí. 25. Proyecto de portada del libro electrónico: Bienvenido de nuevo a Adobe Photo Shop hoy mismo. Vamos a estar hablando de portadas de libros e. Vamos a estar haciendo el que veas aquí mismo. Se va a llamar la casita de campo en la ciudad y vamos a hacer un poco de una obra de teatro en una casita diminuta que existen entre estos grandes rascacielos intentaban contar una historia. Estamos tratando de obligar a la gente a hacer clic en él ya que se puede ver un Amazonas, Hay toneladas y toneladas de portadas de libros e y él lo consiguió. Crea uno que sea de alto contraste, convincente, pero también describe un poco del libro dentro también. Entonces es un poco un reto porque estamos pensando en todos estos aspectos diferentes a la hora de crear el layout para nuestro libro e. Con este proyecto en particular, tenemos un gran reto porque vamos a estar mezclando muchos temas de diseño diferentes juntos. Entonces vamos a tener un compuesto de varias fotos diferentes. Entonces tenemos la casa y los edificios. Nos van a modificar modificando y creando nuestro propio cielo integrando alguna fotografía en la nube y creando nuestro propio fondo. Y luego vamos a estar haciendo algún trabajo con tipografía, así que vamos a estar creando el título. Pero también vamos a hacer algo un poco extra especial, y te voy a mostrar cómo hacer letras de mano para seguir adelante y llevar un poco de personalidad a nuestro titular para que puedas ver aquí mismo con las palabras poco lo vamos a hacer dos diferentes formas en las que te voy a mostrar cómo digitalizar estas cosas. Primero lo vamos a hacer y procrear y mostrarte cómo traer eso. Pero también lo vamos a dibujar con un bolígrafo y papel y te voy a mostrar cómo tomar una foto. Trae eso a la tienda de fotos, iluminando todo para que podamos agarrar sólo ese texto en particular y traerlo y hacer que parezca que es parte del titular. Entonces son un par de cosas diferentes que vamos a estar haciendo en este proyecto. Entonces sigamos adelante y empecemos. Vas a necesitar descargar un par de fotos. Pero si quieres usar diferentes fotos y hacer una portada de libro diferente para tu reto de diseño o tu proyecto de estudiante, siéntete libre y hay tres fotos que vamos a estar usando para nuestro proyecto. Vamos a esta casita que esa fue bastante fácil de aislar y cortar. Tenemos algunas nubes estándar puedes usar cualquier foto de nube que quieras y también el edificio, que vamos a estar duplicando y poniendo a ambos lados de la cabaña. Por lo que quiero que descargues y abras la plantilla de portada de libro E. Y hay un par de variación de tamaño diferente para portadas de un libro. Pero el más estándar y el que Amazon lo usa al tamaño recomendado es de 2560 píxeles de altura por 600 píxeles e ingenio. Y eso es una especie del tamaño estándar. Y en el chico de los recursos descargables, hay un par de grandes artículos que puse ahí que hablan de los tamaños de diferentes portadas de libros e . Entonces, como se puede ver, varían, pero no dramáticamente. Por lo que las cubiertas de libros Kindle e de Amazon, que es lo que vamos a estar haciendo para este proyecto es 15 63 por 2500. Pero la portada del libro Apple E es 1600 por lo que no estás viendo enormes diferencias en los tamaños generales . Por lo general hay una relación estándar, y puede seguir adelante y tener acceso a esto yendo al para entrar aquí, hay una relación de 1 a 6. Entonces por cada 1000 pixeles, Ah, el otro lado debería ser 1600. Entonces esa es una especie de su relación estándar para un libro e. Y ahí es donde se nos ocurrió este rango aquí. Entonces si necesitabas ponerlo en múltiples lugares, podrías hacer este tamaño. Pero entonces sólo se ajustaría 50 píxeles o 100 píxeles, y se escondería ahí con lo que es fácil de adaptar si necesitara guardarlo para otras diferentes plataformas de libros e . Entonces tengo aquí nuestro pequeño templo, y solo lo hablo fuera de todo el texto y todavía tengo nuestros márgenes encendidos. Y traje en especie de nuestro título genérico porque sabemos que necesitamos trabajar esto aquí de alguna manera. Entonces lo que queremos hacer es que quiero empezar a trabajar en la fotografía y luego encontrar la manera de que ese titular se entremezcle con la fotografía. Entonces sigamos adelante y saquemos nuestras fotos. Vamos a traer a nuestro dragón de la casa ahí para que lo haga un objeto inteligente. Y si no lo hace? Dragon es un objeto inteligente. Simplemente puedes hacer clic derecho y convertirlo a objeto inteligente y para que podamos escalarlo hacia arriba y hacia abajo sin perder nuestra resolución. Iba a traer estos como una especie de ideas ásperas. No tendrá estos lindos edificios grandes como adelantando a esta diminuta casita. Y me gustaría tener quizá 21 a cada lado. Entonces lo que queremos hacer es ir adelante y eliminar primero este fondo para que podamos hacerlo haciéndolo un poco más pequeño y veamos algunas de nuestras herramientas de selección. Si solo podemos hacerlo realmente fácilmente con la herramienta de varita mágica, hay un trabajo bastante bueno en seleccionar todo. Entonces ahora vamos a ir a seleccionar, vamos a seleccionar lo inverso porque ahora mismo está seleccionando el cielo. Pero quiero seleccionar el edificio. Entonces acabo de hacer un inverso y luego vamos a agregar son máscara de capas y seguir adelante y enmascarar ese edificio. Entonces ahora puedo duplicar esto manteniendo presionada la opción y arrastrando, y queremos hacer el otro lado también. Por lo que ahora necesitamos tener una sensación de tamaño. Podríamos necesitar que los dos sean un poco más grandes. Por lo que seleccionar ambas capas, conseguir algo dramático que realmente queríamos ser dramáticos fue a ser una casita diminuta con estos grandes edificios asumiendo el poder. Esto es bastante fácil, cortar y hacer, usar máscaras y traer nuestras pequeñas imágenes aquí. Hasta ahora, podríamos incluso hacer lo mismo con House porque me gusta crear mi propio fondo de cielo que pudiéramos hacer lo mismo. Hagamos sólo la herramienta de varita mágica. Estos son fondos realmente simples, y voy a seguir adelante, enmascarar eso para seleccionar inverso, y quiero una máscara. La casa y también podemos seleccionar aquí nuestra máscara de capa y pintar con negro para deshacernos de cualquier cosa extra que no cortó. Y probablemente no queremos la antena. Creo que eso distrae un poco. Entonces solo estoy consiguiendo mi herramienta de selección y solo voy a enmascarar eso. Se va a pintar con Black y deshacerse de eso. No creo que eso sea muy atractivo. Entonces ahora tenemos la base para nuestros edificios y queremos poder conseguir un cielo aquí. Entonces por ahora mismo, voy a desactivar un margen porque está en el camino y distraer, y quiero sacar mi nombre por encima. Podríamos necesitar tener una barra de contraste alto para que el nombre salga porque no quiero que el nombre esté en la parte superior y que este titular realmente largo vaya aquí abajo en el medio. Yo quiero poder separar a esos dos para mantenerlo lo más limpio posible. Entonces eso no es realmente gran cosa. Probablemente podríamos subir esto y simplemente poner este tipo en una barra de alto contraste. Se va a conseguir la herramienta de rectángulo y dibujar una barra simple y poner nuestro nombre en el frente. Sé que eventualmente será blanco, y vamos a tener que encontrar a la tipografía y un poco solo estaban haciendo algún bloqueo básico de su diseño, consiguiendo que la idea vaya. Y así el mayor reto a este va a ser hacer nuestro layout tipo. ¿ Y cuál es la mejor manera de arreglar todas estas palabras diferentes y apretadas? Vamos a seguir adelante y sumar o fondos. Conocemos de qué color podemos necesitar para hacer la tipografía. Entonces sigamos adelante y hagamos. Nuestros fondos van a bajar hasta el fondo, va a agregar una nueva capa va a ser nuestra capa de fondo. Podría sacar mis capas aquí para que lo veas un poco mejor. Y quiero hacer un cielo azul bonito, vívido. Entonces cuando estoy seleccionando mis colores, no quiero nada demasiado oscuro, pero no quiero que me guste nada. necesario leer la tipografía encima de esto, así que necesitamos que sea lo suficientemente ligera para que tal vez alguna tipografía oscura pueda estar encima de esto. Entonces es una especie de azul claro, y lo que es genial de esto es que podemos ligereza y oscuridad para que casi pueda tener como un efecto de cielo radiante. Y lo podemos hacer usando la edición no destructiva agregando una nueva capa encima y haciendo nuestro esquivar y quemar. O podríamos hacer esquivar y quemar directamente en la capa si quisiéramos. Pero me parece un poco mejor la edición no destructiva para el flujo de trabajo, entonces ¿vamos a hacer eso? Voy a crear una nueva capa. Estas van a ser mis sombras y reflejos. Y voy a subir a editar y bajar a llenar. Y lo hemos hecho un par de veces en algunas de las clases de photoshop. Entonces si ya lo has hecho, genial. Pero no lo hemos hecho antes. Este es tipo de proceso. Entonces subimos a editar Phil, y solo vamos a hacer un contenido de 50% gris Vamos a dar clic en OK y vamos a poner esta cobertura de 50% gris en esta nueva capa que creamos o va a un paso más. Esto es algo que tienes que memorizar. Vamos a subir a nuestros modos de fusión para esta capa y lo dijimos para superponer. Va a parecer que las capas no están ahí. Pero vamos a pintar sobre reflejos y sombras usando la herramienta de pincel y pintando sobre con negro y con blanco, vamos a poder tener reflejos y sombras al cielo. Y lo que es genial de esto es que podemos activar y desactivar esto y tener el fondo intacto. Si alguna vez quisiéramos volver y decir Bueno, me metí la pata en esa zona. No es gran cosa. Simplemente me gusta hacerlo de esa manera en lugar de simplemente hacer esquivar y quemar directamente en la capa porque simplemente me da más flexibilidad para volver atrás en el tiempo si decido cambiar algo. Entonces lo que voy a hacer es tomar blanco, conseguir un buen pincel Brit, grande, suave, grande, suave, redondo. A lo mejor no tan grande. A lo mejor alrededor de 1000. Y podría necesitar traer de vuelta la opacidad sobre eso un poco. Al igual que un poco está agregando algo de cielo haciendo un poco más ligero en ciertas áreas. Y entonces también podemos sacar el negro y para sacar sombras de negro habrá sombras agregando un poco de sombras ahí abajo donde no necesitamos poner tipo ahí parado un poco de fondo. Y si no nos gusta lo que hicimos porque creamos una nueva capa, siempre podemos apagar eso y empezar de nuevo. Entonces eso es lo genial de agregar esa nueva capa en lugar de editar, editar esa capa directamente. Si yo fuera a hacer el esquivar la herramienta de quemar justo en esta capa, así que quemar, Eso es todo. Estoy atascado. Realmente no puedo volver atrás y deshacerlo 26. Proyecto de portada de libro electrónico: sombras: Bueno, vamos a traer nuestra última foto. Entonces vamos a traer nuestra última foto. Tenemos algunas nubes genéricas que vamos a integrar aquí. Vamos a usar modos de mezcla y masas de capas para una especie de mezcla eso en. Vamos a traer eso todo el camino de vuelta al fondo más allá de todo el tipo, y vamos a hacer un poco de estratificación Massive. Pero Adil máscara aireadora y ver cuántas veces uso mucho la masa de capas. Simplemente voy a agarrar la herramienta Grady int. Yo sólo tengo un dedo del pie negro estándar blanco Grady int Y al igual que pintar con masas de capas con los pinceles negro y blanco, podríamos hacer lo mismo con resplandor. Es sólo una especie de hacer un bonito desvanecido cuando lo hacemos en la otra dirección. Ahí vamos. Entonces sólo hacer un buen Vaid que podría ser capaz de reducir un poco la opacidad. Sólo para que no sea tan fuerte arriba en la cima que se apoye de la paz. Entonces una cosa que quería hacer antes de empezar a tipo de terminar la tipografía, ya que quiero agregar algo así como casi como una obra de teatro. Por lo que tienes un fondo de juego para ir a una obra de teatro. Y tienen, ya sabes, edificios cortados de cartón o cortados de harían y casi parece que arrojaban una sombra en el telón de fondo durante una obra de teatro. Y yo como que quería tener un aspecto y estilo similares a eso. Por lo que tenemos algunas sombras de gota muy oscuras que se están lanzando en la parte posterior de este cielo. Entonces vamos a dibujar eso a mano. Entonces en lugar de solo seleccionar una capa en hacer una sombra de gota, vamos a crear y dibujar nuestra propia sombra de gota Ir a crear una nueva capa Llamar a esta sombra de gota Vamos a arrastrar por aquí detrás de todo menos el cielo Mantenerlo por encima del cielo, y vamos a conseguir su herramienta cuentagotas y vamos a muestrear Este color azul probablemente por aquí lo va a probar. Entonces voy a hacer doble clic en mi muestra y sólo voy a bajarla un poco para agregarle un poco de oscuridad. Y me voy a llevar mi suave cepillo redondo aquí mismo. Vamos a hacer que no sea tan grande. Alrededor de 400 o así. Sólo vamos a pintar nuestras sombras aún hacen que parezca que está lanzando sobre un telón de fondo como lo verías en una obra de teatro que sólo vamos a dibujar que podría necesitar tener pincel de fabricante un poco más pequeño. Podríamos ver cómo al instante están agregando sombras pintando. Tengo mis ojos en su propia capa lo mismo con house, y puede que necesite hacer mi pincel un poquito más pequeño. Entonces no es tan grande sombra estaban dibujando. Yo sólo pensé que agregaba un poco de carácter, casi como esto se armó como un conjunto para una obra de teatro al libro para que sea un poco más niño como un poco más juguetón. Por qué estamos haciendo esto y puede que no arroje una sombra en la parte superior tanto. Pero ya sabes, eso sería fácil sólo de especie de nuestra carrera. Voy a volver otra vez y sólo hacer un poco de sombra más oscura, y podría que sólo esté haciendo control Z o mando Z para retroceder un paso en mi historia si no me gusta como lo estoy dibujando. Es una especie de atajo agradable para señor solo Comando Z. Estoy en un Mac, así que solo agregando más sombras en ciertas áreas que creo que podrían necesitarlo. Y ahí vamos. Podemos aligerar esto toda una puja, así que eso es una especie de lleno a la sombra. Entonces solo estoy activando y apagando eso. Redujamos un poco la opacidad en eso, así que no es tan dura y realmente estamos llegando. Entonces trabajemos en la tipografía de esto. Averigamos cuáles son las palabras más importantes. ¿ Cuáles son las palabras que queremos destacar? Queremos traer alguna tipografía manuscrita para al menos una de las palabras y las palabras que pensé que serían una palabra realmente divertida. Para hacer un guión tipo escrito a mano sería la palabra poco y todo lo demás podría ser esta base tipo Sarah tradicional realmente agradable. Entonces, antes de empezar a trabajar con el otro tipo, sigamos adelante y metamos nuestra carta escrita a mano aquí porque el resto del titular se va a construir alrededor de esa pequeña letra escrita a mano. Entonces voy a ir a mi escritorio, donde tengo todos mis lápices y marcadores para crear la palabra manita escrita de dos maneras diferentes. Entonces lo primero que voy a hacer es ir a mi escritorio donde tengo lápices y marcadores de colores y voy a escribir a mano la palabra poco en formato de guión. Entonces solo voy a estar escribiendo una especie de letras y marcadores y solo en un avión. En realidad es un trozo de papel de computadora. Es un trozo de papel de computadora totalmente blanco. Es muy importante que uses una especie de blanco puro porque va a ser mucho más fácil tomar una foto y llevarla a Photoshopped para integrarla como una carta escrita digital. Entonces aquí es lo que pude dibujar sólo una especie de con una mezcla de marcador y lápiz de color , y quería usar del color rojo ahí dentro para especie de tener un pop contra el azul. Entonces lo que voy a hacer es tomarme una foto y tomé dos fotos diferentes. Se puede ver algo así como la iluminación es un poco diferente, pero se quiere tratar de tomar una foto. Y acabo de hacer esto con mi iPhone con luz directa. Por lo que quieres tener luz directa encima de tu imagen porque no vas a sacar ninguna de esas sombras del papel. Y naturalmente, si cogiste el papel y él lo movió, van a haber pequeños divots naturales en el papel que van a crear sombras. Y eso está bien, porque podemos llevar eso a Adobe Photo Shop y aligerarlo bastante para poder deshacernos de todas esas sombras para poder aislar fácilmente las letras. Entonces traje esta foto a la tienda de fotos y ¿cómo vamos a poder aislar esto? Porque en este momento, simplemente parece que va a ser muy duro dedo del pie levantar uno de estos del papel y hacer que parezca que estaba escrito en el cielo azul. Entonces hay un par de cosas que podemos hacer. Vamos a necesitar de manera significativa Brighton y deshacernos de todos estos pequeños divots y sombras y en el papel que se crea de forma natural. Entonces vamos a los ajustes de imagen. Lo primero que vamos a hacer es ir al brillo y el contraste. Vamos a intentar las cosas. Vamos a tratar de alegrarlo un poco, pero no quieres sobre Brighton porque entonces comienzas a perder parte de la calidad del tipo escrito a mano. Entonces sólo vamos a un poco de brillo, y luego lo que realmente ayuda es ajustar el contraste. Entonces estamos en lugar de disminuir el contraste, vamos a aumentar el contraste se podría ver estos pequeños divots desaparecen lentamente y todo el lettering realmente saltando. Entonces esto siempre está haciendo y hay que tener cuidado con el brillo. Podría ver cómo está empezando a desaparecer aquí mismo cuando aumente demasiado el brillo . Entonces vamos a tratar de encontrar lo justo lo suficiente y dar click en, OK, Y eso podría ser suficiente solo para hacer un poco de brillo y contraste. Siempre hay exposición, que es otra forma de deshacerse de ese trasfondo. Pero mira, la exposición va a ser un poco dramática. A ver cómo va a quitar lentamente o letras. Vamos a dejar eso en paz. Sólo vamos a hacer el brillo y el contraste. Creo que eso es suficiente para poder sacar a este tipo de aquí. Entonces estoy viendo todas estas diferentes opciones de letras, y estoy tratando de averiguar cuál se vería mejor en la portada. Y al dibujar estos, me doy cuenta de los más gruesos que vamos a traducir un poco mejor. Entonces cuando lo estés haciendo, vas a estar poniendo esto en un fondo de color diferente. Es mejor hacer tipo muy grueso porque la cosa delgada en realidad trató de cortar ese tipo delgado , y simplemente no destaca lo suficiente para el título. Entonces esto me voy a quedar con este estilo de marcador más grueso. Entonces todo lo que nos levantamos a hacer es conseguir la herramienta de lasso poligonal. Se va a aislar esto en una copia y traerlo a nuestro diseño. Entonces aquí está. Entonces ahora necesitamos recortar todo el fondo restante, así que hay un par de formas en las que podemos hacer esto. Podríamos hacerlo a mano consiguiendo la herramienta de selección mágica y cortándola lentamente pieza por pieza, así como esto. Bueno, entonces nos quedamos con estas pequeñas partes blancas en las letras adentro, y eso se vería un poco raro porque se supone que tenemos azul entrando por ahí . No se supone que sea blanco, porque se supone que esto parezca que está dibujado sobre el fondo azul, entonces ¿Cómo nos deshacemos de este pequeño punto de luz dentro? Probemos esto otra vez. De acuerdo, Entonces lo que vamos a hacer ahora ya que sólo tenemos la herramienta mágica o cualquier herramienta de selección, vamos a seguir adelante y dar click en cualquier parte del fondo blanco, Y en lugar de seleccionar todo vamos a hacer un pequeño truco estamos vamos a subir a seleccionar y vamos a seleccionar similares. Por lo que va a seleccionar una selección de color similar a lo que hacemos seleccionado. Entonces va a seleccionar todo el blanco. Y así te das cuenta de lo mágicamente que selecciona todos los píxeles blancos para nosotros. Incluso algunos de los píxeles que están dentro del trazo. Vamos a seguir adelante y borrar eso, o podemos hacer una máscara. Así que selecciona inverso y enmascarar. O podríamos simplemente cortarlo. Y ahí está nuestra tipografía escrita a mano. Podemos traerlo aquí, y hay un par de cosas que podemos hacer para un tipo de cambio de color porque quiero tener alguna clase de letras rosas, como viste en el inicio de la conferencia tipo de algo para que coincida con este tema rosado. Entonces lo que podemos hacer es que podríamos duplicar, hacer clic, clic, clic y hacer un estilo de capa en una superposición de color. Pero notan que perdemos mucho de los trazos naturales. Entonces si sigo adelante y desenredo esto, verás estos lindos, naturales tipo de pinceladas. Y la superposición de color simplemente destruirá totalmente eso. Queremos mantenerlo lo más escrito a mano posible. Entonces en lugar de simplemente hacer una superposición de color, vamos a subir y hacer ajustes, y vamos a bajar a matiz y saturación. Entonces con Hugh van a añadir poco a poco un poco más de rosa a ese curso debilitado. Haz de esto cualquier color que queramos. Podemos hacerlo verde, azul claro. Pero creo que por alto contraste, creo que el rosa no del todo el rosa caliente pero sólo un poco de rosa realmente iría un largo camino fuera curso. Podemos agregarle saturación, y podríamos ajustar lista como cualquier otra capa. Entonces voy a hacer clic derecho en esto y voy a convertirlo en un objeto inteligente porque quiero hacerlo un poco más pequeño. Pero entonces quiero poder hacerlo más grande si es necesario. Entonces me voy a convertir en un objeto inteligente. Ahora soy libre de hacerlo cada vez más pequeño y descubrir formas de integrar esto en el titular. Entonces ya no necesitamos poco. Entonces sigamos adelante y deshacernos de eso. Pero ahora tenemos nuestra pequeña tipografía. Podríamos intentar encontrar el ángulo correcto para esto. Entonces esa es una forma de traer a mano la tipografía escrita. Esto fue en un trozo de papel y le tomó una foto y fue capaz de digitalizarlo muy fácilmente. Entonces lo vamos a probar de otra manera, porque realmente estamos explorando diferentes formas de traer la tipografía escrita a mano. Ahora voy a dirigirme a una aplicación llamada Procreate, que es un sketch digital de la manzana de recon. Cualquier cosa imaginable, incluida la tipografía. Entonces vamos a bosquejar esto usando procreate ahora. Nos vemos ahí en un minuto. 27. Lettering a mano y Procreate: Entonces estoy en la app de procreate ahora mismo. Simplemente voy a crear un nuevo documento y tengo seleccionado el color rojo. Como pensé que sólo sacaríamos el mismo rojo. A lo mejor puedo seguir adelante y hacerlo tan leve rosa para que no tengamos que hacerle un montón de modificaciones de color. Y el tipo de pincel que estoy usando, Puedes usar todos estos diferentes tipos de pinceles. Voy a hacer un pincel de caligrafía. Se llama el cepillo de esquisto. Y lo que me encanta de los pinceles de esquisto acaba de conseguirle esta bonita textura. Eso se ve muy, muy bonito. Entonces aquí mismo podemos cambiar la opacidad de la misma. Queremos tener una opacidad completa, y también podemos cambiar el tamaño del pincel. ¿ Quién podría convertirlo en un trazo bastante grande y grueso si quisiéramos saber qué me encanta de la procreate? Tiene un aspecto realmente natural, así que eso se ve realmente auténtico y parece algo que estoy haciendo en un trozo de papel. Entonces veremos cómo se compara con el rial, lápiz y papel que acabamos de hacer. Entonces intentemos El dibujo son pequeñitos así que un poquito demasiado grandes. Así que vamos a conseguir el tamaño correcto sólo tipo de hacer un movimiento suave. Y a medida que lo hacemos, podemos aumentar el grosor. Vamos a hacer muchos ejemplos diferentes. Vamos a traerlo. ¿ Todo es una hoja un poco más grande? Yo estoy haciendo un poco de inclinación porque así es como quiero que la tipografía final esté en ella así presión también en tu pluma. Entonces si presiono más fuerte, va a hacer como un grueso. Y si presioné más ligero, va a hacer más ligero. Me encanta la procreación para todo tipo de cosas. Vamos a reducir, um, um, versiones más delgados, haciendo un movimiento suave con nuestras letras. Al igual que eso, podemos traer esto en un par de cosas que necesitamos hacer primero y procreate van a ir a mis capas, que podría estar justo aquí arriba y te darás cuenta de este pequeño color de fondo. Sólo voy a desenredar eso y notarás que el fondo desaparecerá por completo. Esto es bueno. No tenemos que hacer todo ese paso que teníamos que hacer cuando trajimos una foto. No tenemos que hacer nada de eso. Ya está en un formato de fondo transparente PNG. Eso es fantástico. Entonces ahora lo vamos a exportar como PNG para que podamos mantener ese fondo transparente. Vamos a subir aquí a exportar, a compartir, a compartir, así que exportar compartir, y vamos a compartir como PNG va a estar exportando, y voy a seguir adelante y enviarme un correo electrónico y te veré de vuelta en la tienda de fotos. Tengo R, P y G, y lo traje a Adobe Photo Shop. Y mira lo mucho más fácil que es hacer esto porque no tenemos que aislar ninguno del fondo blanco . No tenemos que aumentar el brillo. Está justo aquí. PNG fondo transparente, listo para ir tanto más eficiente. Y me encantan todas las diferentes opciones de pincel. No he procreado. Prefiero procreate sobre alfiler y papel. Pero ya sabes, hay muchas maneras diferentes en las que podemos hacer esto. Incluso está la tercera opción de tener una tableta wakame, y las tabletas wakame podrían ser tan baratas como $100 podría ponerlo justo en la tienda de fotos y usar las herramientas de cepillo con la tableta wakame y dibujar las letras de mano derecha en Photoshopped . Esa es otra opción que puedes hacer está bien, toda la fototienda no tiene del todo los pinceles de aspecto orgánico que tiene procreate. Entonces sigamos adelante y agarramos el que creemos que tiene el mejor contraste o mejor grosor o , ya sabes, presentación. Para que pudiera agarrar este de abajo aquí no pasó mucho tiempo en estos. Tengo otro set donde sí pasé un poco más de tiempo en esos. Entonces solo voy a copiar eso de esta capa y traerlo a nuestro documento. Y así como eso, ya está listo para salir. Entonces aquí está nuestra mano escrita una. Voy a hablar de todo eso. Voy a traer a éste y llamar a éste procrear, y podemos angularlo y añadir un poco de sombra. Entonces hay un poco de cara apretada escrita a mano Esa era amplia End era de lo que acabamos de escribir en, ya sabes, cinco minutos o menos. Y ten otra que hice cuando pasé un poco más de tiempo con ella. A mí me gusta este tipo de más inclinado. Mira, solo depende de cuál crees que funcionaría mejor para esto. Por lo que tenemos dos tipos diferentes. Tenemos uno, y luego tenemos dos. Entonces, cualquiera que pienses que funcionaría mejor para este diseño en particular. Y por supuesto, tenemos la que hicimos la mano escrita, una que trajimos en un oleaje, que probablemente podamos aligerar un poco eso, usando algunos filtros para especie de coincidir con el mismo look de nuestra mano tipo escrito. Entonces ahora lo que tenemos que hacer es trabajar en la tipografía y tratar de averiguar el mejor arreglo y también resaltar realmente esto como la palabra principal de titulares. Vamos a hacer eso a continuación. Averigamos cuál es la palabra más importante aquí. Entonces el no es una palabra muy importante. Entonces lo que quiero hacer es que eso naturalmente sea un poco más pequeño, y quiero que sea un talento porque creo que parece muy bien con la tipografía escrita inclinada . Entonces consigo un doble click y vamos a querer intentar hacer una tipografía serif porque creo que si hicimos un Sand Saref, se veía un poco demasiado moderno y blocky y ya que tenemos esta bonita, maravillosa tipografía manuscrita, tenemos este fondo configurado como una obra de teatro. Pensé que seríamos más juguetones con nuestras opciones de tipo y ser un poco más tradicionales con son una tipografía serif. Entonces escojamos una tipografía serif. Había uno que ya tenía en mente, y se llama Adoni, que he usado mucho y otros cursos. Entonces se llama Madani, pero podrías usar la tipografía serif que te guste, y vamos a tratar de quedarnos con un libro o, en este caso, un libro en cursiva porque queremos que esto sea el metálico. Entonces sólo tenemos eso establecido Vamos a seguir adelante y hacer esto. Pero Dhoni, hagamos que todo coincida. Aquí tenemos un par de opciones diferentes, de las cuales uno podría quedar bien. Hagamos un viejo estilo audaz y veamos cómo se ve eso. Hagamos el resto en el no es una palabra muy importante una vez más. Por lo que casi me pregunto si podemos eliminar esto y simplemente bajar un estilo tipo similar, hacerlo tal vez un poquito más grande. Y luego tenemos City, que vamos a hacer que padonia hinche libro de estilo viejo que ahora tenemos esto como minúsculas y me hace preguntarme. Tenemos este poco es minúscula. Tenemos esas minúsculas. Me pregunto si podemos tener un poco de contraste con nuestro titular haciendo de estas todas las gorras al menos estas dos gorras todas. Entonces vamos a ver si no podemos ir a nuestro panel de personajes. Este click en son todas las gorras hacen que sea mucho más fácil para nosotros y tipo de ajuste. El tamaño Ciudad es una palabra bastante importante, así que mantengamos eso un poco más grande. Aflojemos el espaciado aquí o la corriente entre estos dos personajes. Entonces solo voy a ir a añadir un poco más de seguimiento. Establece eso en 100 y solo un poco se afloja ese tipo. Qué es respirar y lo mismo para Cottage. Veamos si no podemos hacer que ese respire ni siquiera mawr y hacer que eso sea un poco más pequeño para el contraste. Igual que eso. Y seguí adelante e hice este tipo de color azul oscuro porque pensé que cuando lo hice negro cambia al negro. Entonces tenemos esto en negro. Pero lo que yo pensaba que hacía el azul oscuro así que eso es negro. Y entonces esto es una especie de azul oscuro. Ayuda a tipo de emparejarse con ese fondo azul porque está en la misma familia de colores. Tenemos este azul más oscuro, y luego tienes este azul más claro y pensé que jugaba lo suavizó un poco en lugar de ser tan duro. Entonces ahora la parte dura está ajustando todo esto y a la manera correcta. Y aquí es cuando podemos empezar a especie de tal vez pensar en nuestros márgenes. A ver si no podemos conseguir nuestro margen todo el camino hasta la cima. No creo que vamos a tener ningún problema con margen aquí porque su tipo va a estar tan lejos. Simplemente tipo de ajustar el tipo. Y me encantaría que el tipo fuera un poco más vertical de alguna manera, porque tenemos este bonito claro espacio aquí abajo que podemos usar. A mí me gustó tener ciudad allá abajo, quizá apretando un poco el espaciado. A lo mejor sólo hacer 50 en lugar de 100 podría hacerlo un poco más grande. De verdad. Aprovecha eso. Ese espacio y bienes raíces 28. Proyecto de portada de libro electrónico: exportación: solo oliver elementos un poco porque creo que queremos poner más énfasis en la cabaña. Y es exactamente por eso que creamos Smart Layer para que podamos hacerlos más grandes sin ningún problema. Por lo que de verdad quiero quizá traer un poco más de énfasis en la casa. Por supuesto, eso puede significar que necesitamos hacer los edificios un poco más grandes también y ponerlos a lado solo un poquito para que puedas ver un pequeño indicio del edificio. Pero no es el foco principal de la portada del libro así como así, y eso le dará a nuestra tipografía una oportunidad dedo del pie tipo de relleno en esa zona un poco. Ahí vamos. Entonces creo que me gusta un poco mejor el equilibrio de eso. Siento que es menos énfasis en los edificios grandes y un poco más de énfasis en la casita de campo, y nos da la oportunidad de que nuestro titular esté bien cuadrado aquí. Entonces lo que voy a hacer es pasar algún tiempo asegurándome de que esto tenga la alineación correcta, y aquí es cuando podríamos poner una cuadrícula y podemos algo así alinearla en la cuadrícula. Queremos asegurarnos de que todo este tipo esté alineado al centro de acuerdo a la paz general. Por lo que tengo mis guías inteligentes encendidas. Ahí va a poder decírmelo. ¿ Ves esa larga línea rosa que me va a decir que es centro alineado con la pieza con el documento general en vez de tener que romper la cuadrícula? A veces consigues ese poco de ayuda ahí. También podemos añadir un poco de sombra de gota a nuestro tipo escrito a mano. Hay un poco de sombra de gota, solo un poquito que podías ver puedes exagerar solo muy, muy, muy, muy apretado. Si eso es solo una pequeña dimensión de capa, sigamos adelante en la posición de que estaba usando mis teclas de flecha para encontrar la posición pequeña correcta , simplemente metiéndola ahí mismo en ese poco espacio extra. Y ahí está nuestra pequeña portada de libro que creamos. Entonces ahora necesitamos hacer una cosa más, que es hacer mi nombre y vamos a seguir adelante y hacer eso pero Dhoni a tipo de seguir con todo o comparo y hacer de esta una tipografia san serif para que solo pudiéramos escoger Helvetica solo para tener algo rápido y fácil. Y vayamos a nuestro panel de personajes. Pongamos un poco amplio por qué está enfrentando años. Por lo que el 666 para nuestro seguimiento. Y hagámoslo en todas las gorras porque no tenemos huecos grandes, anchos con letras minúsculas. Siempre queremos hacer eso con letras mayúsculas que tienden a verse mucho mejor que amplio espaciado entre minúsculas está ahí Ahí está nuestro nombre. Probablemente podríamos hacer esto mucho. Pasa otra hora tipo de colores finos de afinación. Podríamos incluso cambiar el color de tipo de esto y tipo de limpieza que hasta un poco. Incluso podemos añadir una chimenea y en todo tipo de efectos extra a nuestro edificio si quisiéramos . Pero por solo hacer una rápida portada de libro e, creo que lo hicimos bastante bien aquí. Entonces ahora lo último que tenemos que hacer es exportar esto Así que una exportación. Esta es la versión final que hice antes de filmar la clase. Simplemente vamos a usar esto como ejemplo y vamos a exportar esto como un JPEG. Por lo que va a ir a exportar archivo ya que y algunos de ellos tienen requisitos como Amazon. No quieres subir algo de más de 50 megabytes de tamaño, así que eso son solo algunos requisitos de tamaño de archivo. Vas a tener que tener en cuenta a la hora de exportar esto. Bueno, queremos hacer la más alta calidad que podamos. Entonces hagamos un J Peg 1600 por 25 60 nosotros. Es un modo RGB. Todo lo que hacemos en esta clase es digital, así que va a ser un modo B de carne RG, y eso es todo. Vamos a exportarlo y vamos a ver qué tamaño tiene el archivo y ver cómo se ve para los tamaños de archivo . Sólo cuatro megabytes. Entonces eso es fantástico. Por lo que podemos subir esto y conseguirlo en una portada de Kindle e book, y lo tenemos hecho, y hacer los ajustes para algunos de los otros tamaños en ese artículo será muy fácil. Entonces en este caso hicimos un 1600. Eso sería muy fácil, porque eso es sólo 100 pixeles más alto. Por lo que solo entras en tu documento, irías al tamaño de lienzo y solo ajustas el lienzo. Entonces digamos que va a cambiar a 1600 por 2400. Entonces ahora solo hacemos 2400 va a ser un poco más corto en tamaño. Adelante y proceda. Ya puedes ver que va a seguir adelante y cambiar el tamaño del lienzo. No mucho. Tenemos que ajustarnos aquí. Sólo tenemos que sólo un poquito de la tipografía. Pero simplemente acabamos de perder un poco de cielo y no es gran cosa. Y luego volvemos a pasar por el proceso de exportación para que puedas usar esto como plantilla básica para trabajar en todos esos diferentes tamaños que necesitarás. Y como te darás cuenta que no lo son. No varían dramáticamente de mi tipo de portada de libro Dos personas tipo de portada. Entonces ahí vamos. Acabamos de hacer una tapadera entera juntos. Me encantó cómo pudimos aprender a digitalizar la tipografía de dos maneras diferentes . Por supuesto, también está la tableta wakame, que no cubrimos, pero solo conectarías tu tablet wakame y sacarías tu cepillo, y simplemente cepillarías igual que no procrearías. Pero ella simplemente pincharía directamente en el documento de Photoshopped. Por lo que muchas maneras diferentes de conseguir tu tipografía escrita a mano y destello en proyectos. Es una cosa súper popular de hacer porque agrega este maravilloso toque rico a tus diseños . 29. Crear recursos digitales dibujados a mano en Procreate: Por lo que estamos en la APP procreate ahora mismo donde es un boceto digital cursos AP en un montón de opciones diferentes para esbozar digitalmente activos. Quién puede usar una tableta wakame y programar directamente en la tienda de fotos usando sus pinceles y Photoshopped. O ya puedes tener una herramienta como procreate que tiene una gama aún más amplia de pinceles de aspecto más orgánico que puedes usar para digitalizar activos. De eso se trata exactamente esta sección. Es poder dar un paso más allá y entrar en mucho detalle sobre cómo crear estos activos orgánicos dibujados a mano y llevarlos a la tienda de fotos o ilustrador para crear campañas de aspecto realmente aseado que utilizan este más orgánico, dibujado a mano mirar como especie de ver algunos ejemplos de alguna de esa inacción. Vamos a hacer algunas letras de mano. Vamos a dibujar una especie de barras horizontales en las que podemos poner contenido promocional. También vamos a hacer una serie de flechas que vamos a poder usar Teoh en todo tipo de activos, así que voy a ir y empezar. Aquí es donde estamos ahora mismo y procrear. Este es el que ya he creado y se podía ver he usado tal vez cinco o seis pinceles diferentes y he creado una amplia variedad de diferentes pinceles pintados. Por supuesto, también vamos a repasar cómo podríamos dibujarlo a mano y traerlo al igual que es una especie de lecciones anteriores que hice cuando trajimos alguna tipografía. Va a ser un proceso muy similar, pero empecemos con procreate y tipo de uso de algunos otros pinceles para especie de mostrarte cómo puedes traer algunos de estos activos. Y lo grandioso de la procreación. Lo que más me gusta de ello es que cuando creas estos activos, puedes deshacerte del fondo blanco exportado como P y G con un fondo transparente . Y no tienes que ir a la tienda de fotos y tratar de quitar el fondo blanco como lo haces. Si dibujaras a mano activos en bolígrafo y papel, tendrías que tomarte una foto de ella, trayendo a la tienda de fotos y quitarte esa página blanca o ese fondo. En este caso, ese es un paso que no tenemos que hacer. Ya está listo para salir, y voy a pasar por ese proceso, así que vayamos a la galería un nuevo documento, y queremos asegurarnos de que ese documento sea realmente grande, porque esto se va a exportar como archivo de Photoshopped y eventualmente va a B, p y G. Por lo que queremos asegurarnos de que sea lo más grande que podamos conseguir porque cuando realmente queremos que estos sean lo más alta resolución para que puedan estirarse lo más grandes que puedan sin ser distorsionados. Por lo que llegué a ir por este 4000 por 4000 todo el camino al fondo. Esa es unaplaza bastante buena, bonita, plaza bastante buena, bonita, Candace a la que podemos usar. Esto es 4000 por 4000 y vamos a empezar. Entonces una de las primeras cosas que quiero hacer es conseguir el color correcto y lo que me gusta hacer con estas flechas y tiene ganas de hacerlo una especie de color gris claro o gris oscuro. Uh, entonces no quiero tener mucho color para ellos, porque en show fotográfico podemos cambiarnos por el color que quisiéramos. Por lo que quiero que tipo de mantenerlo de un color neutro. Entonces vamos a ver si no podemos conseguir una especie de gris claro o un gris oscuro recogiendo una especie de gris oscuro aquí para mi paleta de historia justo ahí abajo en la rueda de colores. Y quiero asegurarme de conseguir todo ajustado con mi pincel. Entonces voy a ir por aquí a mi lado izquierdo. Tengo que cambiar el tamaño del pincel, y cada pincel va a tener su propio cambio. Entonces una vez que cambie un pincel, podría volver aquí y cambiar el tamaño, dependiendo de cuáles sean las características del pincel. Y luego voy a bajar y asegurarme de que estemos al 100% en ventana de capacidad de pincel en cualquier decoloración que esté pasando. Y esto es lo que vamos a hacer. Procreate tiene capas, lo que hace que sea realmente fácil exportar porque, digamos que crea un par de capas diferentes. Puedo exportar este archivo a photoshop, y va a retener todas las capas. Por lo que es genial ya que controlo 20 flechas cada una en su propia capa. Y cuando lo traiga a Photoshopped, ya tendré todo en su propia capa y separado, cual es super, súper práctico. Eso lo vamos a tener en cuenta cuando hagamos eso. Alguna vez quisiste liderar una capa simplemente va a deslizarse hacia la derecha Eliminar diapositiva a la derecha. Eliminar. No vamos a entrar demasiado en profundidad sobre el entrenamiento porque ustedes podrían estar usando una aplicación diferente en lugar de procreate. Entonces lo que voy a hacer es estudiar flechas en Google y, um, tal vez estudié um, algunos paquetes de recursos que están a la venta en línea que incluyen gráficos de época, gráficos vectoriales aero. Simplemente tratando de hacerse una idea de algunas formas diferentes que son populares con las flechas. Y también estoy pensando en mis propias redes sociales en campaña. A mí me gustaría tener algunas flechas apuntando a un botón de llamada a la acción, y no quiero que sea recto todo el tiempo. A mí me gustaría tener algunos bucles, algunos giros, tal vez hasta un círculo que va hasta el final. 3 60 Vamos a una amplia variedad de flechas. Entonces veamos con qué pincel vamos a empezar. Hay unos pinceles realmente geniales tanto en el pensamiento e como también en el dibujo. Entonces estos aires tipo de las dos categorías de las que vamos a sacar en términos de hacer nuestras flechas . Entonces sigamos adelante y empecemos con este, y tengo procreate cinco que le agregaron un montón de nuevas corridas impresionantes. Entonces si lo tienes, es una actualización gratuita para conseguir los cinco. Entonces voy a hacer esto. Este pincel de aquí, vamos a empezar. Por supuesto, solo haces un par de pinceles y como que te das cuenta cuando haces ese tamaño un poco más pequeño, solo vamos a practicar con flechas. No estoy seguro de cómo van a salir estos aire porque los estoy haciendo en vivo, pero ya tengo un set que puedes descargar. Y el recurso descargable es que vamos a utilizar para elaborar juntos nuestra campaña en redes sociales . Vamos a elaborar esa tienda de fotos, así que solo estoy creando algunas flechas genéricas para ahora mismo. Y si no te gusta, gusta, siempre puede simplemente volver atrás, pulsar este botón, volver al principio. Se va a tomar un poco de fideos alrededor para encontrar el estilo correcto de thes. Algunos van a ser gruesos, otros vamos a estar delgados. Entonces una cosa en la que quiero pensar cuando estoy haciendo esto es cada vez que creo una nueva flecha, um, no tienes que hacer esto, pero te ahorrará mucho tiempo es ir adelante y ir a tus capas y agregar una nueva capa por cada flecha que hagas. Entonces cuando lo exportas como archivo Photoshopped, no tienes que sentarte ahí y cortar y pegar cada uno. Ya está en su propia capa. Sólo hay que recordar que eso va a ser un ahorro de tiempo. No tienes que hacer eso si solo quieres bosquejar todo en una capa y volver atrás y tipo de usar la herramienta de lazo para aislar una y sacarla de ahí puedes. Entonces si creé esa para seguir así como así, Así que cuando esté listo para crear una nueva capa nueva y estoy listo para probar otro pincel. Entonces vamos a probar Eagle Hawk para que cada uno vaya a tener su propio estilo diferente. Se puede ver que éste tiene más de la acuarela de tinta. Fíjate en ello. Una vez más, no estoy recordando hacer mis capas, sino solo con fines de demostración. Pero crea esa nueva capa con cada nuevo pincel. Hagamos uno que sea un poco rizado aquí. Volvamos a nuestros pinceles y cada nuevo dicho que hago todo se ve un poco diferente . De acuerdo, así que probemos otro pincel. Probemos Blackburn, donde está aire todos dibujando pinceles así que van a ser muy estilísticos. Y ver que el pincel es mucho más grande que los otros. Tiene que reducir el tamaño fresco. De acuerdo, así que vamos a probar diferentes pinceles. Vamos a pensar y probar un poco más de un cepillo limpio. Vamos a probar fue probado tinta seca. ¿ Ves cómo se ve eso? Es más recto. No tiene del todo el golpe más grueso o delgado. Es algo así como un tipo parejo de look tipo de más de una línea de modelo. Eso será interesante. Muy bien, cambiemos a Marker. Eso es realmente grueso. Rápido, crea también algunas flechas más delgadas. En algún momento, quieres tener otro héroe realmente estilístico que se mueva tan inca que se ve muy destruido. Tiene mucho carácter a ella. Echemos un vistazo a ese pincel. También puedes personalizar los pinceles. Si te metes en pinceles, haz clic en él. Hay muchas cosas que puedes cambiar Con esto puedes cambiar el espaciado, la racionalización, todo esto realmente puede cambiar las características de tu pincel. No quiero ir demasiado en detalle con ese poco. Es una especie de dejarlo por defecto solo para obtener algunos pinceles simples que podrían tener un mucho más distorsionado, destruido, aspecto mucho más distorsionado, destruido, que podría ser realmente genial para, como un anuncio juvenil basado en la ciudad. Entonces solo hay un par de flechas diferentes. Hagamos un par más. Probemos con Mercurio. Es un poco más delgado. Esa es la piel. Tu alternativa. Yo quería intentarlo. Yo quiero probar unos gruesos. Entonces, una vez que nunca conoció la situación, situación y tipo de flecha que desencadenó una necesidad. Por lo que es agradable crear una especie de variedad bastante grande. No estoy creando una capa para cada una solo para poder cortar un show te el proceso un poco mejor. Pero estaría creando una nueva capa para cada héroe 30. Crear recursos digitales dibujados a mano en Procreate 2: Entonces ahora que tenemos toda una serie de flechas terminadas, estamos listos para exportar esto. Entonces una cosa que queremos hacer, que es diferente a si estás en una tableta wakame, podrías destruir todo esto justo en la tienda de fotos usando capas. Y podrías angustiarte por el fondo transparente. En este caso, tenemos este fondo blanco que viene por defecto, lo que queremos deshacernos de eso. Entonces vamos a entrar en nuestro panel de capas, vamos a ir hasta el fondo, y hay algo llamado color de fondo que tiene un relleno en él. Todo lo que tenemos que hacer es esta diversión Marque la casilla. Y ahora todo es transparente, lo cual es fantástico. Eso es exactamente lo que queremos y cómo queremos exportarlo. No necesitamos tener un fondo blanco para quitarlo más adelante. Entonces ahora vamos a exportar esto, vamos a ir a nuestra útil herramienta de configuración aquí. Vamos a ir a compartir, y queremos compartirlo como un archivo de Photoshopped. PSD. Y voy a seguir adelante y mandar esto a mi unidad de Google y ponerlo en mi escritorio. Y te veré en Adobe Photoshopped Y antes de entrar en photoshop, queremos crear un par de otros activos diferentes que podemos utilizar como parte de nuestros activos de branding que funcionan en la necesidad de crear nuestra campaña. Por lo que creamos una serie de flechas. Lo que me encantaría hacer a continuación es crear un alfabeto porque quiero deletrear en nuestra propia tipografía única , tu propia fuente única. Supongo que se podría decir que quiero construir eso usando una serie de letras para crear un titular para que se vea único. Interesante. Y dale ese pincel de detalle. Mira, Entonces vamos a crear que vamos a abrir un nuevo documento de la misma manera que estamos haciendo 4000 por 4000. Haz algo un poco diferente. Vamos a crear una cuadrícula, porque cuando tengas 26 letras del alfabeto teniendo una cuadrícula, realmente nos va a ayudar a alinear nuestra fuente que vamos a estar creando junto con la línea de base y también las líneas de altura de tope superior, se nos va a ayudar realmente a alinear toda nuestra carta. Por lo que están un poco cerca del mismo tamaño. Entonces vamos a hacer eso yendo a la configuración yendo al lienzo y luego simplemente haga clic en guía de dibujo. Se va a agregar algunas cuadrículas por defecto. Puedes seguir editando guía de dibujo y podemos cambiar el tamaño de la cuadrícula, reducirla un poco, por lo que podría tener un par de líneas de cuadrícula más para nosotros y ponernos hecho. Entonces ahora tenemos nuestro tipo de plantillas configuradas aquí, Así que vamos a usar tipo de negro. Vamos a mantener nuestro color neutro. Y vamos a escoger un bonito pincel que creemos que se vería realmente bien para ese tipo de rotulador para cepillado a mano, pintado a mano tipo de campo crudo, robusto. ¿ Querrías que esta sea una marca útil, robusta? Queremos elegir un tipo de pincel en particular que creemos que haría bien. Por supuesto, podríamos simplemente cepillarnos unas cuantas veces para ver cuál nos gusta. Este es Halcón Águila. A mí me gusta esto en este 10 oso on. A mí me gusta mucho la forma en que se ve. Entonces vamos a seguir adelante y probar esa. Empecemos con la letra. A. Queremos tener una especie de atractivo rotulador grueso a esto, así que siéntete libre de volver, inténtalo de nuevo hasta conseguir algo que te guste. Entonces hay una carta y se podría ver que me quedo en las cuatro cajas sólo para que todo sea mayormente sale de la línea base y la altura del tope, pero no por mucho. Todo se va a retener en su mayoría en cuatro casillas del guión. Entonces vamos a crear una nueva capa. Esa es la letra una letra B. De acuerdo, vamos a probar la letra C y así sucesivamente. Entonces un B, C D E f. Y luego intentemos G trabajando por nuestras cartas aquí y siéntete libre de hacer una pausa y estudiar letras porque hay tantas maneras diferentes de dibujar. De acuerdo, hay tantas maneras diferentes de hacer diferentes elementos, y podríamos hacerlo bien de esa manera. O podríamos hacerlo bien de esta manera donde la pierna de la K sale de la pierna en la parte superior, de muchas maneras diferentes. Para ello, para tipo de estudio tipografía y tipo de averiguar qué orientación te gusta de la K solo Google K y luego Google la siguiente letra y simplemente estudiar diferentes tipos y personajes. H i J, K y L, con ese gran aspecto de marcador grueso y bajar no tiene que estar uniformemente espaciado. decir, Esdecir,es bonito si puedes espaciar todas estas uniformemente, pero al final, todas van a ser capas separadas, y puedes moverlas por todas partes en una tienda de fotos. El trato más grande es asegurarse de que tengan un tamaño similar. Entonces si esto se queda dentro de cuatro cajas, queremos asegurarnos de que la J se quede con él cuatro cajas. Entonces podría necesitar modificarlo un poco porque las letras se están haciendo más grandes. Pero cuando estás en la tienda de fotos, podrías hacer cualquier cosa. Esta también es una tipografía muy ruda, así que está bien si se pone un poco más grande, más pequeño. Es posible que desee desarrollar un rotulador de pincel personalizado que sea muy conciso. Y así usa que esas rejillas para mantener esas más concisas que lo que estoy haciendo con mi conjunto particular. Y es posible que algunos de los personajes necesiten tener una mayor prisa para tener la sensación de que estás deseando ir por, así que siéntete libre de cambiar el tamaño de tu pincel. Te va a llevar un par de veces conseguir una letra derecha, y me gusta hacer un trazo continuo, hacer otro trazo. Se ve un poco más parejo cuando simplemente continúas y él no se detiene en el camino. Entonces si yo fuera a hacer eso, tú y yo paramos a mitad de camino y traté de seguir haciendo el pincel para que sea perfecto. No tiene ese flujo natural que tendría un golpe continuo. Entonces solo haz un golpe continuo bajar. Pero todos estos serían en capas separadas. Entonces lo que queremos hacer por el bien de sólo enseñar la clase lo y hacer cada una de las capas, Pero se puede ver como cada uno tendría su propia capa que b 26 capas, haríamos lo mismo que hacíamos antes estaban listos para exportar y tipo de ver cómo se ven estos en acción. Queremos seguir adelante y apagar el fondo, así que todo es transparente. No te preocupes por la grilla que no va a exportar con nosotros. Y queremos ir a ajustes compartir. Y queremos ese archivo de la tienda de fotos. Voy a ir a compartir esto, ponerlo, abrirlo en tienda de fotos y ver qué tenemos. Y hay una cosa más que quiero desarrollar. Tengo flechas. Tengo una especie de algunos personajes para hacer un titular personalizado, pero lo último que quiero hacer es tener algún tipo de trazo de pincel para poner ah promoción o un fin de acción llamado o algún tipo de botón o caja. Por lo que quiero crear algo similar a esto. ¿ Ves este tipo de derrame cerebral? Esto se creó no solo usando un pincel y cepillándose y haciéndose, sino que se crea con una combinación de un par de pinceles diferentes y también una combinación de un par de transparencias diferentes y unos tonos de diferentes colores para crear este efecto más rico casi un efecto dorado. Entonces vamos a tratar de emular esto y hacer algo así. Entonces al igual que lo hicimos antes, vamos a crear un archivo muy grande. Por lo que 4000 por 4000 y queremos conseguir una especie de pincel de oro. Por supuesto, color no importa mucho, porque podemos cambiar eso en cualquier momento, y va a ser Photoshopped, Así que me centraría en el color que te gustaría dio. Por lo general, los colores Richard más oscuros funcionan mejor porque puedes cambiarlos fácilmente a cualquier color en la tienda de fotos. Pero vamos a tratar de emular ese efecto dorado que alguna escuela escogió, una especie de oro neutro y le agregaremos un poco de negro para darle más de un efecto dorado . Y vayamos a nuestros pinceles de dibujo. Probemos el mismo que hemos estado usando. Liger, prueba este de aquí y vamos a hacer una especie de swoosh. Simplemente queremos tener un par de activos de marca que podamos traer, para que pudiera ponerle tipografía. Podríamos ponerle un titular y un par de cosas que me gusta hacer para que esto sea más rico. Por supuesto, podrías poner esto en cada capa. Si solo quiero tener ese activo ahí, ya terminé. Por lo que crearía una nueva capa y la probaría con otra. Y cuando podrías traer esto como un archivo de Photoshopped en capas, tienes a todos ellos unos pequeños pinceles separados que puedes usar para todo tipo de situaciones diferentes . Entonces hagamos lo mismo volviendo y haciendo algo más ligero. Por supuesto, tengo el lápiz de manzana para que puedas presionar tu lápiz para crear diferentes pinceles, chupar y presionar muy fuerte o comprimir muy suave y tener, como, un bonito cepillo suave. Entonces eso es realmente útil. Tener el lápiz de manzana sería capaz de hacer eso cuando quiero hacer es quiero agregar diferente color. Ya sabes, esto podría agregar un solo color para crear ese efecto rico. Necesitamos crearlo usando múltiples colores. Entonces lo que voy a hacer es subir este color y sacarle un poco del gris y convertirlo más en un Hugh puro. Y también puedo reducir la transparencia del pincel. Entonces justo aquí abajo. Por lo que no está lleno de color. Vamos a seguir cambiando de color o a lo largo del volante para algo así de rico. Mira, claro, en cualquier momento sientes que realmente no estoy sintiendo eso. Simplemente obtienes esa herramienta de borrador, hazla un gran tamaño de pincel y solo inténtalo de nuevo. Y podría ser que necesitamos cambiar o pinceles. Vamos a probar Eagle Hawk, y cuando lo hagas, reduzca el sonido transparente, algunos de estos así Digamos que reduje la transparencia a 70 o así y tengo un tamaño de pincel bastante grande que podrías dibujar. Una vez que va a ser aún más grande tamaño de pincel, podrías dibujar unos y luego volver a dibujar sobre él, y puede especie de ver esa mirada en capas da con la transparencia da un pincel más natural, como se fue la pincelada arriba y abajo y arriba y abajo en lugar de solo un gran piso, algo así como el que ves arriba arriba. Es un cepillo plano grande. El de la parte inferior luce un poco más orgánico con la forma en que se traza el pincel. Mire, Dr. Blackburn, eso parece uno bonito, grande, grande, grueso. Y vamos a reducir la transparencia y aumentar el tamaño del pincel para que podamos bajar una vez, dos veces podemos cambiar un poco de color, solo como agregar reflejos. Entonces volviendo al ejemplo que creé para que puedas ver cómo incluso en la parte inferior de aquí podía ver cómo eso era todo un pincel de otro por completo, y él podía ver cuántos colores diferentes y pequeños pincelazos que se necesitaban para crear esto. Entonces vamos a exportar esto de la misma manera que lo hicimos antes. Y vas a poder descargar todos los archivos que creamos hoy. Simplemente voy a ir a ajustes y vas a exportar como archivo de Photoshopped y podrás tener todo esto. Una cosa genial que podrías hacer es tomar este ejemplo. Fui a color dot adobe dot com, y pude encontrar una plantilla realmente bonita para una marca en la que estaba trabajando. Y puedes crear diferentes pinceles y puedes probar los colores aquí. Todo lo que tengo que hacer es tomar mi dedo y sostener, y podré probar el color y luego cepillarlo con él. Entonces digamos que quiero hacer esto, ¿eh? Color aquí mismo podría tomar un pincel tipo de hacer diferentes colores de pincel que podría usar sus activos de marca más adelante. Y traje esto como foto. Podrías simplemente eliminar esta foto en cualquier momento yendo a tu capa y eliminando esa foto y luego exportando tus activos de esa manera. Por lo que es realmente genial crear estos activos de marca. Puedes traer una foto de tus colores y simplemente ponerle el dedo encima. Sosténgalo y degustará ese color. Y él podría cepillarse con él para que puedas ver todas estas cosas realmente aseadas que podías saber. Podría llevarme estos pinceles. Te voy a mostrar un ejemplo de lo que puedes hacer con un activo como este. Por lo que ahora tenemos todo sobre activos crear. Voy a hacer un show más te este tipo de hacer un arco iris ir y conseguir que el fondo apareciera ahí arriba. Entonces esa es una cosa que podría hacer. Podrías tener todo un arco iris de rayas de aspecto acuarela y gráficos. Entonces ahora que tenemos todos nuestros activos estaban listos para subirse a photoshop, echar un vistazo a lo que tenemos y vamos a aprender a tomar estos activos y ponerlos a usar en una campaña real. 31. Uso de nuestros recursos dibujados a mano para un proyecto de redes sociales: Ahora que tengo mis archivos de Photoshopped listos para traer una tienda de fotos, veamos cómo se ve todo. Por lo que en la Guía de Recursos, la guía de recursos descargable, tienes una sección de sesión de boceto digital fue gwen doble clic que todos estos aire disponibles para ti. Entonces lo tienes justo fuera de la caja. Podemos ayudar a crear la campaña de redes sociales que vamos a hacer muy rápido. Ya vas a tener esos activos. O si quieres traer tus propios activos haciendo el mismo método que hice con la tablet wakame o con una app de procreate o bocetos a mano. Eso también se puede hacer. Esto es lo que hicimos en las clases. Consigue un poco de una versión ligeramente diferente, un poco más cruda y brushy que tipo de la que hice en la clase. Pero verás que todos se exportan como diferentes capas separadas. Tenía que volver atrás y nombrar cada capa, pero lo podías ver todo ahí. Y lo que es genial de esto es que puedo arrastrar y soltar y crear todo tipo de titulares con esto para poder arrastrarlos y crear palabras diferentes con él. Por lo que quiero crear una campaña en redes sociales que diga de ninguna manera. 20% de descuento tiene un 20% de botón de acción llamado. Muy simplista. No estamos hablando de un gran titular largo aquí, y eso es bueno. Queremos mantener nuestros titulares un poco cortos y breves. Entonces lo que quiero hacer es que quiero crear las palabras, no, no, y luego crear las palabras de distancia y que sean dos palabras separadas. Entonces esto es fácil. Podrías simplemente crear las palabras, así que no. Y puedes superponerlos un poco, también. Y como son capas separadas que pueden tener este aspecto limpio, solapado si quería llevemos el final de top. Nos estamos manteniendo separados y luego tenemos camino. Entonces sigamos adelante y tomemos las cartas que necesitamos W A y entonces por qué no vamos a necesitar nada más. Podemos borrar eso por ahora. Y ya sabes, no digas este expediente causa en toda la carrera todo. Pero sólo soy una especie de titular de elaboración sólo tratando de simplificarlo. Siempre puedes volver atrás y usar ese mismo conjunto para construir todo tipo de titulares diferentes. Entonces de ninguna manera. Tengamos una velocidad por debajo sólo una especie de arreglar la tipografía de una manera atractiva. Entonces de ninguna manera. Por supuesto, podemos angular eso y cambiar todo eso a medida que trabajamos en ello para que nuestro titular esté listo. Encontremos algunas fotos convincentes que podamos usar. Esto va a ser publicidad 20% de descuento. Podría ser para una marca de moda. Podría ser para una marca de alimentos. Vamos a hacer algo así como un millennial juvenil o adiciones focalizadas en la Gen Z. Queremos ser muy frescos cuando te unas paletas de colores realmente bonitas aquí. Entonces fui a pixels dot com, y me hubiera encontrado un par de fotos creo que se verían muy bien con esto. Va a haber uno. Vamos a crear nuestro tamaño de instagram empezará con Instagram, pero esto realmente podría ser para cualquier cosa. Entonces vamos a archivar nuevo. Esto podría ser para activos de marca. Una tarjeta de visita no siempre tiene que ser algo digital estos activos o simplemente un bien como cualquier otro activo que puedas adquirir. Esto es principalmente tipo en resolución 10 80 por 10 80 300 porque nos gusta tener esa bonita alta resolución y seguir adelante y dar click en Crear. Eso es primero traer nuestra foto buena copia o foto y pegarla en, y vamos a asegurarnos de que hacemos clic derecho y convertimos a objeto inteligente, así que debilita tamaño y que no se distorsione. Podríamos dimensionar eso, embargo quisiéramos sin distorsión. Entonces vamos a recortarla. Vamos a tener una linda conexión emocional con ella, así que no tengamos que ser para alejarnos así. ¿ Qué es realmente acercar su cara? Presione enter y traigamos nuestro titular es copiar mis capas y traerlo. Podemos angularlo un poco y enmarcarlo. Y una cosa que quiero hacer es que quiero hacer todas estas blancas. Entonces una cosa que quiero hacer es seguir adelante y volver a su letra de mano y vamos a conseguirlo de alguna manera, y tal vez vas a tener que ir y enmarcar esto. Quiero poder unirme al no y unirme al camino como una sola capa. Entonces quiero asegurarme de que estoy muy contenta con cómo es esto. Dispáralo y haces un pequeño atajo de comando, Comando E. Y voy a poder fusionar las capas o puedes hacer clic derecho en capas fusionadas. Entonces ahora saber es su propia palabra. Y ahora el camino va a ser sus propias palabras. Yo estoy haciendo mando EADS. Un peso rápido surgió capas. Por lo que ahora tienen estas unas capas separadas. Simplemente voy a hacer doble clic en estos y hacer una superposición de color y simplemente hacer blanco. Y mientras estoy aquí, me encantaría añadir una ligera sombra de gota. Por lo que realmente tipo de destaca contra la foto. Vamos a hacer un buen tamaño y opacidad. Podría hacer lo mismo por la superposición sin color. Haz un poco de sombra de gota para salir contra el fondo. Entonces ahora podemos un poco de lío con la posición, y con esto, podemos hacer click derecho ahora, y podemos convertir eso en un objeto inteligente para que podamos seguir manipulando y siempre volver atrás con nuestras opciones de tamaño. Entonces aquí vamos. Y ahora tratemos de inculparla. Puede debilitarse, Acercar un poco más en la cara. Estaba tratando de enmarcar que la tipografía vaya alrededor de su rostro y enmarcarlo. Y hasta podemos angular un poco esto para darle un pop dinámico así como este. Podemos incluso superponer esto un poco para que veas cómo el tipo de marcador lo pasa. Y necesitamos tener nuestro llamado a la acción. Entonces tenemos algunas cosas que podríamos hacer por una acción fría. Podríamos hacer un simple botón de alto contraste. En este caso, naranja amarillento será bastante alto. El contraste estaba creando un nuevo botón. Bajemos a una herramienta de rectángulo y creemos un botón simple. Bueno, parece que no tiene un derrame cerebral. Perfecto. Y solo vamos a hacer una herramienta de tipo y teclear 20% de descuento y negro 20%. Uh, y yo sólo voy a hacer ese negro sólo tratando de ser alto contraste aquí. Por eso estoy eligiendo estos colores. Y estamos tratando de ser brillantes, divertidos, funky, tener un vivo juvenil todo una vez más, una sombra gota será de mucha ayuda aquí. Un buen tamaño de tamaño borroso y una buena cantidad de capacidad. Podemos una vez más tipo de ángulo esta la dirección opuesta a tipo de crear tensión. Por lo que tienes este tipo de dirección diagonal en esta dirección diagonal que crea tensión , que es buena tensión visual. Entonces lo que sería genial es tener una pequeña flecha que también apunte al 20% de descuento. Por lo que tenemos algunas flechas de las que podemos elegir. Este es un conjunto un poco diferente al que creé en la clase hace apenas unos minutos . Pero, ya sabes, tuve un poco más de tiempo para separar las capas y cortar todo esto para que puedas ser capaz de abrir esto y usarlo tú mismo para cualquier cosa que quieras. Tienes un libre de usar esto en proyectos comerciales de pago si quieres. Entonces voy a seleccionar la flecha creo que funcionaría muy bien aquí. Seleccionemos este bonito, grueso o tal vez uno con este mundo dinámico. A lo mejor este de aquí y podría usar ese de abajo un poco más tarde. Hagamos lo mismo que hacíamos antes. Hagamos una superposición de color y una sombra de gota y también haga clic derecho. Y podemos convertir un objeto inteligente para que podamos escalarlo todo tipo de tamaños sin perderlo , perdiendo la resolución o está perdiendo la calidad. Y aquí es donde podemos solapar cosas para crear un efecto en capas. Y una cosa que sería realmente genial para este anuncio es algún tratamiento a la foto, porque en este momento es solo a todo color. Es exactamente como descargado de la página web. Pero qué pasaría si creáramos una nueva capa encima y agregáramos un modo de mezcla y pusiéramos un poco de, ah, trabajo de color de pincel aquí para que podamos tener especie de este interesante color casi como filtro de Instagram agregado a ella sin que sea un filtro de instagram pero un poco más estilizado. Entonces voy a crear una capa que va a estar encima de ella, y va a ser una especie de donde van a existir el modo de mezcla. Por lo que queremos bajar a su modo de mezcla aquí arriba y ponerlo en marcha. Prueba la luz suave. Vamos a conseguir un cepillo redondo agradable, grande y suave, súper grande, tal vez hasta 2000 o así vamos a asegurarnos de que sea un suave alrededor. No queremos nada duro. Queremos que sea emplumado. Simplemente vamos a dar clic quiere ver cómo se ve esto, y vamos a conseguir un bonito pop de color y un color bonito y moderno, que podría ser querido ser demasiado rosado Phillips a un poco de rojo para ello. Y como ves el efecto me voy a morder, hunde esta imagen de vista previa. De verdad click en la esquina superior venta pinceles más grandes y también disputamos fuera o modo de mezcla para ver. A lo mejor la luz suave no era la que queríamos solo una especie de refresca un poco la imagen . Entonces ahí vamos. Ese es un gran modo de mezcla que pantalla. Entonces tiene ese set a pantalla. Lo que podríamos hacer es crear otro y seguir estratificando esto. Entonces vamos a crear en lugar de ese color, vamos a hacer un color más fresco, tal vez un morado claro, sin embargo su pincel haga clic aquí abajo en la parte inferior. ¿ Verdad? Mira aquí abajo, en el fondo, ¿verdad? Y por supuesto, podemos bajar un poco esto y podríamos poner esa pantalla. Esto agrega un poco de color a la foto, así que esto es lo que teníamos antes. Toggled está apagado. Es genial. Es una gran imagen esta imagen se vería bien en blanco y negro también, pero con un poco de pop de color solo le agrega un poco de toque moderno. Y siempre podía tomar mi carrera o herramienta, limpiar cualquier borde. Eso o no se ve bien. Y ahí está nuestra primera iteración de nuestras campañas. Tenemos algunas letras personalizadas, pincel acostumbrado. Tenemos un poco llamado acción. Incluso podemos agregar nuestra marca realmente rápidamente. Entonces digamos que tenemos un logo. No tenemos libertades para esto, pero podríamos simplemente ponernos, ya sabes, ya sabes, este tipo de sitio web de moda genérica dot com, Pero solo estamos queriendo una especie de lugar donde tendríamos un logo que tendríamos diseñado. Lo pusimos probablemente en la parte superior izquierda, o lo pondríamos podría estar aquí abajo en la parte inferior derecha? Todo va a depender de lo que creemos que sería más efectivo. Ambas van a ser buenas colocaciones porque aquí hay una especie de área vacía agradable, y podemos cambiar la tipografía en eso también. Ahora mismo es camarada, pero podríamos hacer algo aún más genérico. Esto es realmente solo relleno apretado por ahora, habría logo oficial ahí para que la gente supiera de qué marca es esta, y eso probablemente necesitaría soltar sombra así. Entonces otra cosa que podemos hacer es una especie de cambiar esto un poco hacia arriba. Mierdas, Todo esto arriba. Tenemos esas dos opciones de colocación y tal vez inferior derecha podría funcionar un poco mejor porque lo lanzas, eliges, pones tu idea, lanzas lo que estás vendiendo y luego presentas tu logo en el fondo. Es como que le da un golpe más natural. A pesar de que sí tenía ese bonito espacio allá arriba, sólo podría subir un poco mis activos para aprovechar ese inmueble de aquí arriba . Entonces ahí vamos. Eso fue sólo una especie de mi proceso de pensamiento y cómo tipo de crear estas imágenes altas y altamente dinámicas de tu gente de agarrar. Esta es una especie de la última que hice antes. Vamos a hacer un par de diferentes ahora que tenemos el titular en la flecha ya establecida Weaken, cambiar la foto y crear toda una campaña cohesiva de esta manera 32. Uso de nuestros recursos dibujados a mano para un proyecto de redes sociales - 2 2: Entonces ten otra foto que quiero probar. Es un poco más de alta moda. ¿ Quién ha arrastrado eso y ver qué podemos hacer ahora que tenemos todo preparado? ¿ Estas dos mujeres se abrazan? Hagamos una emotiva Vamos a tener una vista recortada agradable, apretada. Podríamos arrastrar esto hacia abajo en su sistema de capas, pero también eliminar nuestras otras fotos para que podamos mantener el tamaño de nuestro archivo hacia abajo. Entonces vamos a reorganizar un poco esto para que podamos tener esto mejor arreglado en cuanto a la tipografía. No, no queremos el por qué salir en nuestras noticias. Entonces aquí mismo, como que lo ves en su nariz. Es simplemente incómodo. Van a tener cuidado donde estás letras tierras. Tiene que quedar bien todo el camino. Es lo que podríamos hacer es posicionar así de bajo? Ten un B aquí mismo. Incluso podrías hacer eso más grande. Y tenemos guías inteligentes encendidas, así que no va a estropear si seguimos cambiando el tamaño en eso. Esta podría ser una instancia donde la parte superior derecha vea esta bonita área abierta aquí Esa es una gran manera, Teoh Un gran lugar para poner un logo o algún otro activo allí. Es un pequeño lugar perfecto. A ver si no podemos plantear esto y nos vendría bien una flecha diferente porque tenemos un sentimiento diferente con esta foto. Entonces vamos a conseguir una flecha más simple. Voy a ir a nuestras flechas y es realmente gruesa, gruesa que me ha gustado mucho. Entonces sigamos adelante y llevemos este en Skopje. Pégala en. Hagamos el tipo de tratamiento que le hemos estado haciendo. Podríamos incluso crear un estilo de capa y aplicar el mismo estilo. Pero vamos a seguir adelante y sólo hacer esto manualmente. Clic derecho. Vamos a crear un objetos inteligentes. Si modificamos , estará bien. Entonces aquí hay una época mucho más gruesa, que creo que simplifica un poco la flecha. Haz que la flecha sea un poco más pequeña. No queremos competir con el titular nunca, y una cosa que podemos hacer es que esta Arrow es una especie de perderse. Es así como podríamos cambiar de color con los activos con los que empezamos. Un color negro, lo trajo a Photoshopped, lo convirtió en un color blanco, pero ahora podríamos hacerlo de cualquier color. Queremos hacer una superposición de color. Yo quiero que sea de color amarillo. Y vamos a iluminar ese amarillo, sólo un poco brotando en un color amarillo un poco más brillante. Toma su llamada. El tipo de acciones se aseguran de que tengamos el posicionamiento adecuado para eso. Entonces ahora mismo tenemos el mismo tipo de superposición, o supongo que en este caso sería un modo de mezcla de pantalla en algunos de estos colores en los que pintamos . Podemos tener un perfil completamente nuevo porque lo hicimos en base a la otra foto, que podamos decidir eliminar uno. Y me gusta el morado del costado ahí. Eso se ve realmente bonito. Vamos a crear otro. Que sea una pantalla. Vamos a mantenerlo con colores frescos. Es algo así como realmente agradable es un color fresco. Las fotos van a hacer un pincel. Lo tengo en el 2000. Es un suave alrededor. Hagamos click en el exterior, y eso es realmente intenso. Pero eso no es problema, porque tenemos opacidad. Podríamos simplemente reducir un poco la opacidad sobre eso, y le da un aspecto fotográfico realmente moderno. Pero esos colores fríos como que vienen, y tienes un poco de morado leve calidez ahí y tienes algo de frescor en la parte superior izquierda. Este tipo de le agrega una sensación más moderna. Podemos reducir. Ahora que eso está en un fondo bonito, limpio no necesitamos que la sombra de gota sea bastante tan intensa es va a reducir eso Intenta usar sombras de gota solo cuando realmente necesito estar realmente suelta, sombras de gota suaves No me gusta usar sombras de gota muy duras, duras porque podría hacerla parecer anticuada muy fácilmente. Entonces otra cosa que podríamos hacer como última cosa es que podemos agregar una máscara leering al por qué y simplemente una especie de pintura encima. Entonces parece que el por qué está interactuando con la mujer. Vamos a bajar aquí y añadir una máscara de capas y toda mi máscara de leering Voy a pintar con negro y sólo voy a quitar un poco de la misa de capas solo parece que está interactuando un poco con el tipo. Y ahí está nuestra versión moderna de esto que estamos usando tipo de son letras crudas, cepilladas a mano. Sigamos adelante y solo hagamos un par de ideas más y entonces realmente podemos tener una campaña completa esta vez. Vamos a lograrlo, tener mucho movimiento a Va a ser para una marca atlética. Se está haciendo un poco más grande. Muy bien, aquí. De verdad queremos mostrarla en Motion Cropper ahí mismo en el centro. Por ahora, es dragger todo el camino por debajo, y ya no necesitamos esa otra foto. ¿ Quieres ahorrar espacio en tamaño de archivo? Entonces quiero hacer lo que hice antes con la cola del por qué, y quiero poder tenerla realmente interactuar con el tipo e incluso tener tal vez su pie viniendo por la O del no y tener camino aquí abajo. Por lo que es una especie de orientación diferente del tipo. Vamos a dimensionar esto para que pueda tener una buena posición para poner a Theo afuera ahí. Su página web aquí abajo. Y siempre podemos mover nuestro llamado a la acción a algún lugar justo aquí. Entonces hagámoslo están estratiendo masa para esto. Vamos a entrar, tenía una máscara de capas, dolor con negro, adelante y pinta esto, y mejor aún, podría ser capaz de hacer nuestro tobillo un poco mejor Así que vamos a hacer nuestro tobillo arriba. Es un poco más delgado, en más fácil de superponer. De acuerdo, entonces ahora ella está interactuando con eso. Podemos tener el Por qué interactuar también. Por lo que ya tuve mi Larry Mass del proyecto anterior. Nosotros sólo vamos a completar esa máscara. Entonces ahora se siente como si realmente estuviera saltando dentro y fuera de eso, ¿ no? Así que vamos a añadir nuestra pequeña flecha divertida de nuevo dentro. Es bueno o flechas y trae esa flecha divertida, floopy porque este es un tipo de anuncio muy divertido, floopy. ¿ Qué está pasando la energía? Y hagamos algo aún más divertido con esto. Entonces en este momento solo tienes un bloque, solo un rectángulo. Tomemos los pinceles que creamos y llevemos eso, y en cambio tenemos algunas soluciones de pintura. Aquí. Consigamos ese top one. Con toda la textura agradable podríamos traernos en rotar. Podría ser una especie de se llaman raya de acción, si se podría tener un ir arriba así, y podríamos hacer de esto un color diferente. Entonces solo consigue un doble clic y al hacer una superposición de color y adapta ese mismo amarillo que hemos estado usando. Tengo un toque de naranja. Es drop shadow solo haciendo el mismo tratamiento en todas estas capas. Y podemos hacer de esa una cara de tipo diferente porque tenemos esta tipografía muy descriptiva para el titular. Y para este anuncio, como que quiero hacerlo un poco más sencillo. Entonces cambiemos la tipografía por algo muy, muy sencillo. Entonces sólo haciendo esto, este de aquí, no quiero competir con algunas de las cosas dinámicas que tenemos pasando y sigamos haciendo este paso más. Entonces ahora mismo tenemos nuestro salto y vamos a ver si no podemos subirla un poco e incluso acercarle todo un poco. Contamos con guías inteligentes sobre todo o deberíamos. Entonces si lo hacemos más grande, no va a cambiar tanto la resolución. Entonces una cosa que quiero hacer es algo con este sitio web. No está saliendo lo suficiente, solo como que tienen mucho fondo de alto contraste pasando, así que necesitamos poder conseguir que eso salga. Una cosa que podríamos hacer es que podríamos tomar nuestros swooshes de pintura lo que sea. Tomemos el otro, solo como que le demos un fondo para descansar sobre dos para que pueda salir entre ese fondo. Entonces sólo bajando eso todo el camino usando todos los activos que creamos. Y hagamos un contraste con el amarillo. Entonces, ¿qué sería una especie de opuesto en el color voluntad a amarillo? Lo más probable es que sea un color fresco, como un azul o incluso mejor, como un bonito azul claro y suave entre verde. Esto es sólo práctica y práctica, tipo de saber qué colores elegir y tipo de estudio de la teoría del color Un poco siempre ayuda a averiguarlo. Por lo que incluso podríamos cambiar el modo de mezcla en esto. O podemos reducir la capacidad para que su pierna, aún se podía ver su pierna saltando. No quiero perder la pierna. Sólo necesitábamos un poco de un área de contraste más alto para detener nuestro logo. Eso no sería sólo tipo así. Sería un logotipo oficial. Simplemente lo mantendremos así por ahora. Siempre podemos encontrar algo mejor de tipografía después, pero necesito que sea más grueso que eso. Simplemente no contento con la salud en ese IHS. Pero aquí tiene un 20% de descuento. De ninguna manera. Tenemos una cosa que realmente puede hacer este Pappas y tal vez algún tratamiento a la foto. Entonces vamos a añadir un tipo de efectos similares que lo que hicimos antes. Entonces veamos si no podemos arrastrar a la mujer por debajo de lo que teníamos antes. Teníamos un par de opciones diferentes aquí. Esa clase de azul. Teníamos una especie de púrpura viniendo de un costado, que se ve bien. Y ese tipo de rosa que viene casi hace que parezca un subconjunto, ¿ no? A mí me gusta bastante eso. Entonces puede mantener eso como iss Esta es la versión final que sólo pasar un par de minutos más con él y especie de lo que hacía antes cuando estaba planeando la clase. Esto es una especie de lo que se me ocurrió. Entonces es como se ve la final. Entonces, hasta el momento tenemos tres grandes campañas son tres grandes imágenes ya producidas para nuestra campaña. Hicimos todo esto bastante rápido. Dentro de 45 minutos a una hora, creamos la exportación de activos dibujados a mano de esos. Tenemos a los listos para usar como P y G's con sin alrededor de un fondo blanco ni nada pudieron usar estos activos. Y puedes usar las flechas, los pinceles, letras de mano. Podrías hacer esto para crear todo tipo de activos de marca, no solo para digital. Esto realmente puede ser para cualquier tipo de marca cualquier cosa que quieras hacer. 33. Digitalización de bocetos: configuración: por lo que hoy vamos a hacer algo extra especial. Entonces ya digitalizamos algunas letras que escribimos. Escribimos mano pudimos traer eso. Vamos a llevar eso un paso más allá, y vamos a hacer una ilustración completa todo desde un dibujo a lápiz de mano. Entonces este es el dibujo a lápiz de mano que creé justo el otro día, sentado a la mesa con mi hijo de cinco años. Algo así consiguió algunas ideas de él, y creamos esta criatura monstruo alienígena realmente única. Y pensé que tenía una estructura de líneas lo suficientemente simple que podrá fácilmente subir este vector y crear una ilustración a todo color. Entonces eso es exactamente lo que vamos a hacer hoy. Vamos a seguir todo este proceso para que veas cómo está conformado por cuatro etapas diferentes de Por supuesto, la etapa de dibujo es la primera, y necesitamos traer nuestra foto que nos hacemos cargo de boceto y poder alegrar eso . Por lo que tenemos un boceto agradable y limpio que podemos hacer nuestra herramienta de pin sobre. Y, por supuesto, vamos a llevar esa foto a Adobe Illustrator, y vamos a poder rastrear sobre eso, usando las herramientas de pin y un par de otras herramientas diferentes. Vamos a pensar en esas líneas para que sea una ilustración realmente fuerte. Y luego finalmente, vamos a poder colorear nuestra ilustración. Entonces, empecemos. Te veré en Adobe Photo Shop. Entonces aquí está el boceto original para bosquejar esto con un lápiz número dos y le tomó una foto junto a mi ventana. Y esto es sólo en papel de computadora estándar, papel impresora. Nada demasiado elegante, Nada demasiado caro, Algo que puedes encontrar fácilmente en tu oficina en casa. Y aquí está. Entonces esto obviamente es realmente oscuro, y necesitamos poder alegrarlo bastante. Nos vamos a llevar nuestro más tarde vamos a hacer lo que hicimos con el tipógrafo. Simplemente ibas a agregar un poco de brillo y ajustar el contraste. Vamos a subir a ajustes de imagen, brillo y contraste, y vamos a poder alegrar esto. Fuimos a desaparecer todos esos pequeños divots y textura. No queremos que eso se interponga, y también vamos a aumentar el contraste. Entonces en su mayor parte, Pero es un gran trabajo en especie de deshacerse de ese fondo gris lo iluminó bastante . Entonces traemos esto. Adobe Illustrator tendrá un bonito dibujo a lápiz limpio para trazar. Entonces solo voy a decir esto como una clavija J y traérselo a Adobe Illustrator. Solo estoy arrastrando esto a Adobe Illustrator y tendría que hacerlo un poco más pequeño. Tengo apenas un documento de 8.5 por 11 pulgadas que podrías hacer en un documento de cuatro. Simplemente tipo de su documento estándar. Estamos haciendo un RGB. Todo en esta clase de diseño digital siempre será un RGB. Entonces queremos seguir adelante y colocarlo encima aquí mismo en el centro, y queremos reducir la opacidad sobre él. Entonces iré a mi transparencia, sólo voy a reducir la opacidad para que pueda ver las líneas, pero no va a interferir conmigo. ¿ Determinando qué? ¿ Qué es un pin para alinear y qué es un boceto original? Entonces sólo un poco de reducción de la opacidad. Voy a bloquear esta capa para que no se mueva accidentalmente. Voy a crear mi capa encima. Por lo que aquí llegamos a sumergirnos en la herramienta pin. Esperemos que ya estén familiarizados con los muy básicos de la herramienta pin. Y como esto es una especie de curso más de nivel intermedio, Así que vamos a agarrar esa herramienta de lápiz aquí en Adobe Illustrator y vamos a usar una combinación de unas pocas herramientas para tipo de crear tipo de hacer que sea un poco más fácil para nosotros crear esta línea. dibujo realmente puede comenzar en cualquier lugar. A mí me gusta empezar en algunos de los lugares más duros primero y luego hacer algunos de los lugares más sencillos voy a empezar tipo de en el tipo de aquí en esta área para que pueda tipo de entrar y hacer la herramienta de pin por aquí y especie de completar esta primera forma primero. Y entonces podríamos trabajar en los ojos. Entonces saquemos esa herramienta de bolígrafo, y vamos a sacar nuestro panel de trazos. Queremos un trazo de tamaño bastante decente, pero no tan grueso que no pueda ver los matices del trazo. Voy a ver qué espera un golpe de 0.5 puntos. Parece que va a empezar justo aquí y acaba de conseguir un clic y mantenga pulsado. Asegúrate de que la sensación esté apagada. Esa es probablemente una buena manera de empezar. Si has tomado mi masterclass de diseño gráfico, hacemos algunas hojas de trabajo de trazado impresionantes donde realmente llegamos a practicar muchas de estas formas complejas. Y no tengas miedo de acercar una cantidad dramática. Eso es lo que tienes que hacer para especie de obtener la forma de herramienta de pasador correcta. Caballos podrían probablemente podría volver con la herramienta de curvatura. Si tienes artículos perfectamente redondos que tienden a funcionar un poco mejor, siempre podemos volver atrás. No me gusta ser perfeccionista cuando estoy haciendo la forma básica. Siempre puedo volver atrás y ser perfeccionista un poco más tarde. Entonces solo haciendo el esquema básico. Mirando hacia atrás en mi punto de anclaje original, consigue un punto bonito, afilado y se dio cuenta No es perfecto, ya sabes, tipo de tomar algunas libertades con cómo estoy dibujando, y no tiene por qué ser exactamente como mi boceto, mis bocetos, solo un ejemplo para mí. No va a ser perfectamente exacto. Es posible que quiera hacer una elección de diseño diferente a la hora de esto. Al igual que para esto, quizá quiera hacer muy pequeños pelos saliendo de los genes y tal vez mantenerlo sencillo. Ya sabes, no tiene por qué ser exactamente lo que hice. Eso es lo genial de esto. Es a pesar de que lo esbozaste, eso no tiene por qué ser una entrega perfecta. Asegúrate de usar tu comando, Z. Si te metes la cabeza y necesitas volver atrás en el tiempo, solo hace la vida mucho más fácil que tener que entrar en tu panel de historia. Entonces Comando Z retrocede un paso que quizá necesite encontrar también, en esa pequeña zona más adelante. Pero eso es más tarde. De acuerdo, voy a volver atrás y completar mi forma. Y ahí vamos. Tenemos nuestro primer esbozo hecho. Podemos volver con nuestra herramienta de selección directa y poder manipular algunas de ellas. Hazlo un poco mejor. En ocasiones tienes que añadir punto de anclaje para obtener la curva que te gusta, o puedes obtener esa cobertura o herramienta y ajustar las curvas un poco mejor con la herramienta de curvatura. No tengas miedo de la herramienta de curvatura para especie de conseguir lo correcto, y me encanta la cobertura o herramienta para Adivina qué curvas y formas redondeadas realmente redondas al igual que tenemos aquí. Y a veces ayuda agregar punto de anclaje para suavizar, realmente redondearlo. Ahora mismo. Estoy usando la herramienta de cobertura. Observe cómo, agregó algunos puntos de anclaje, y suavizó bastante esa zona. Debería tomar un poco de puntos de anclaje para hacer un círculo perfecto. También podríamos usar la herramienta constructor de formas e hicimos un contorno de círculo y nos unimos a las líneas. Ese es otro pequeño tramposo que podrías hacer. Y también me di la vuelta por las esquinas en varios de estos pequeños picos. No quiero que sean demasiado puntiagudos, así que te das cuenta de cómo tienen estos puntos realmente agudos. Hay una forma de que podamos hacer eso. Convertimos esto en una ronda. Únete aquí abajo en su panel de trazos en ese tipo de suaviza. Entonces eso es antes que eso es después. Me gusta el look suavizado que podrías llevar que incluso un paso más allá conseguir son herramienta de selección directa , y puedes ir adelante y tirar y hacer algunas esquinas redondeadas. De esa manera, si quieres un tipo de ilustración realmente redondeada, que veas cómo ese tipo de redondeó los puntos ahí todos para nosotros solo lo hizo todo al mismo tiempo, 34. Digitalización de bocetos de digitalización: trazado de herramientas de bolígrafo: Entonces ahí está nuestra primera forma. Entonces sigamos adelante y hagamos nuestro ojo. Eso va a ser lo más fácil sólo voy a hacer una herramienta de labios y estamos casi terminados con el ojo o al menos con el exterior del ojo. Tenemos una más pequeña, escucho. Y también quiero crear otro punto culminante aquí. Horno. Yo No teníamos eso en la ilustración porque era difícil hacer eso con un lápiz. Sólo tenías que dejar ese blanco. Entonces sólo voy a hacer eso aquí. Esto es un poco de sombra, y estaremos agregando sombras y reflejos usando diferentes colores un poco más adelante en la ilustración, te voy a mostrar una manera rápida. Así que voy a presionar p por la herramienta pin y hacer clic arriba arriba, y sólo vamos a hacer una especie de ir por la mitad de esto porque vamos a usar la herramienta de ancho para expandir esto. Entonces tengo un simple trazo todo el camino. Voy a conseguir la herramienta de ancho aquí mismo con herramienta, y voy a hacer clic y mantener ahí mismo en el medio. Y así fue lo rápido que fue. Era mucho más rápido hacer una forma de luna o era más gruesa en un lado y más delgada y el otro mediante el uso de la herramienta de pluma. Y vamos a hacer lo mismo con la ceja. Haga clic en un lado solo de una manera muy rápida. Simplemente haciendo justo ahí en el medio con la herramienta haciendo click en el medio y simplemente expandiéndola para ver lo fácil que fue. Y eso podría asegurarse de que mi gorra se rodeara y podría tener un tipo redondo de esquinas pasando. Por lo que le da un bonitoacabado redondeado, acabado redondeado, así que vamos a seguir adelante y empezar a revertir estos hacia fuera. Entonces la boca, la boca iba a ser bastante fácil a lo que pudiéramos hacer y pinchar aquí arriba. Tan solo tienes las herramientas de pin. Bien. Vuelve a recuperar mi derrame cerebral. Ahí vamos. Pecho P para alfiler. Yo sólo podría hacer esto a mitad de camino. También utilizó la herramienta de curvatura aquí para especie de crear la boca y tirarla hacia abajo. Pero sólo vamos a hacer la herramienta de pasador. Me gustó un poco alrededor de eso. Entonces Y consigue mi herramienta de selección directa. Voy a hacer doble clic en esto en vez de hacer todas las esquinas a la vez. Yo sólo voy a hacer esquina 11 haciendo doble clic y ahora tengo acceso a una esquina que rodea esos dos bordes. Y tenemos la boca así como así Y sigamos haciendo los dientes. Y así son los dientes o bastante cerca. Simplemente voy a mantener presionada la opción drag y solo reflejar esto va a objetar. Transformar y reflexionar. Simplemente va a ser mucho más fácil. Y los dientes serán del mismo tamaño, que serán agradables y quieren asegurarse de que esos aire también redondeados. Entonces voy a seleccionar ambas de estas herramientas de selección directa alrededor de los puntos en esos dientes . Acabo de ir alrededor de los puntos en la parte inferior. Ahí vamos. Entonces ahora la lengua vuelve por ahí, voy a rastrear sobre esto lo mejor que pueda. Eso terminará siendo una forma sólida. Entonces ahora voy a hacer eso. Voy a hacer lo que empiezo a hacer es si tienes detalles finos como los pantalones. Primero trazé el exterior y completé la forma para poder convertir eso en un color y tener una película encima muy fácilmente. No regresan y solo hacen líneas individuales para hacer los detalles, así que eso es una especie de truco. Te ayudará cuando empecemos a colorear los ojos o colorear la ilustración, y podrías hacerlo con logotipos y símbolos y todo tipo de cosas. Por eso quería tipo de revisión esto. Este pequeño acento aquí, esto probablemente va a ser una sombra bajo el labio, y esto va a ser otro con trampa de herramientas ahí mismo. Entonces tenemos el esquema básico yendo en una cantata Gle fuera de nuestra cosa solo tipo de ver cómo va . Vamos a engrosar esos golpes mucho más después. Entonces pasemos a los pantalones. Yo voy a hacer los pantalones. Hagamos P para pin y solo rastreemos el contorno. El contorno básico de los pantalones. mí me gusta dar click cuando tienes una esquina como hacemos click en el ápice y luego bajamos y ustedes chicos serán todos diferentes niveles de la herramienta pin. Estarás en un nivel básico suficiente para usarlo, pero este es un gran proyecto de práctica. Tengo una clavija J descargable del boceto que podrías hacer esto junto conmigo si quisieras . Y me encantaría verte cambiar al monstruo incluso un poquito, ya sabes, una sonrisa diferente o algo diferente. Y para esto puedo ser un poco más liberal. Entonces en lugar de tener que rastrear todo esto perfectamente, solo puedo venir aquí porque esto eventualmente va a ser un relleno. Algunos retroceden y completan mi forma. No tenemos que estar tan preocupados por la parte superior del pantalón, así que está bien si hay superposición que se eliminará en una fecha posterior. Entonces volvamos a entrar y rellenar cualquier otro artículo aquí. Esto probablemente podría ser una herramienta de rectángulo redondeado para el cinturón. Empuja eso y luego dale la vuelta. Y estas no tienen que ser formas completas. Estos congestionan ser líneas abiertas. De acuerdo, Podemos decidir agregar detalles. Siempre los podemos quitar más tarde si sentimos que los detalles son demasiado complicados. Entonces si tenemos este tipo de fondo que queremos hacer, podemos hacerlo. Entonces ahora probablemente la parte más difícil es hacer las piernas porque aquí hay muchos pequeños detalles . Entonces, una vez más, voy a tratar de trazar la forma general y luego volver y hacer estos pequeños detalles. Hará que sea mucho más fácil colorear los ojos. Entonces esa será una forma completa aquí mismo. Y si necesitamos volver a entrar y hacer un detalle como las garras, lo que es genial de estos pies es que puedo copiar, pegar y reflexionar porque van a estar bastante cerca. No tengo que hacer los pies dos veces si no quiero. Eso se ve un poco funky. Entonces sólo volviendo aquí, déjame ver si no puedo redondear todo. Lo mismo con los pantalones. Si quería volver atrás y conseguir que la herramienta de selección directa redondeara todo a un poco, eso sólo se ve un poco mejor. Y también necesitamos volver a los trazos de línea individuales para esto. Genial. Entonces ahora veamos si no podemos copiar y pegar esa pierna y reflejarla, ahorrarnos un poquito de tiempo. Podría necesitar inclinarlo un poco más hacia abajo y luego cambiar el pie. Entonces eso no es problema. Tenemos la herramienta de selección directa y le vamos a cambiar el pie aquí. Está bien, así que ahí está nuestra ilustración lo que está desactivando nuestro dibujo original o podemos desbloquearlo y arrastrarlo sobre él. Yo como que hago un poco de comparación lado a lado. Entonces hay comparación lado a lado. No creo que nos perdiéramos demasiado, y creo que estamos bien. Voy a seguir adelante y poner este resaltado toda la forma, y voy a poner esto en el frente. Por lo que queremos poner esto delante del pantalón porque cuando se trata de un Phil sólido, no queremos que se muestre esa línea. Por lo que yo sólo podría haber traido todo eso al frente. Y eso ayudará cuando empecemos a sacrificar, surjan. Así que adelante y espesar el trazo. Por lo que es una ilustración realmente fuerte y se puede ver realmente buena desde la distancia. Entonces vamos a hacer eso a continuación 35. Digitalización de bocetos: coloración: Saquemos nuestro panel de trazos y engrosemos nuestras líneas aquí y podemos seguir adelante y deslizarlo por justo por ahora. Y tenemos que averiguar cuál va a ser el grosor correcto y no todo va a tener el mismo tamaño de trazo. Es posible que necesitemos entrar y aflojar parte del grosor en algunos de ellos. Entonces sigamos aquí. No veo qué tan grueso, así que hay un grosor de cinco puntos, y eso podría ser un poco demasiado grueso. Entonces veamos cómo lucen cuatro. Cuatro puntos y a veces no se podía dividir la diferencia y hacer 3.5 era tipo de encontrar el espesor correcto. Y con algunos de estos que podrían necesitar aflojar el tamaño, algunos de los trazos de acento podrían no necesitar ser tan gruesos. Estoy bastante contento con el grosor y los pequeños detalles aquí. Ahora va a ser hora de cull. Levántate este tipo Y por supuesto, podemos tener golpes más gruesos. Podemos eliminar algunas de estas complejidades, Así que si quisiéramos tener sólo una línea aquí para indicar los pantalones, podemos hacerlo. Haz que esos tengan el mismo grosor. Se trataba de simplificar la ilustración. ¿ Crees que eso podría verse un poco mejor? A veces esos detalles se pierden y cuando se alejan. Entonces por eso me decidí a eliminar eso. Y ahí es cuando tal vez necesites que te guste el detalle. Me preguntaba si debería haber incluido eso. Y creo que si elimino la costura en el pantalón, simplificará un poco más la ilustración. Y esto es especialmente cierto cuando se trata de icono. El diseño es A veces, ya sabes, esos pequeños detalles simplemente no están destinados a ser, y a veces sólo lo convierte en una mejor ilustración cuando es más simplificado. Por lo que ahora estamos listos para agregar color. Entonces vamos a agregar color a nuestro pequeñito, y va a ser muy fácil porque tenemos unas cuantas formas terminadas. Entonces todo lo que tenemos que hacer es agregar un relleno a algunas de estas formas. Entonces voy a seguir adelante y quizá escoja un color verde aquí. Podría estar trayendo un poco de amarillo tipo de cálido podría hacer algunos colores diferentes sobre lo que hice en mi ilustración anterior. Así que vamos a asegurarnos de mover capas arriba y abajo, considerando ahí vamos Así que simplemente moviendo capas de arriba a abajo y haciendo mi pequeño atajo de teclado , que es comando corchetes izquierdo y derecho, puedo subir fácilmente las cosas y abajo. No tengo que entrar en el sistema de capas y sentarme aquí y tratar de un colapso eso y tratar de descifrar todo eso. Hagamos eso blanco. Eso va a ser fácil. Es en eso al revés dentro de la boca, trabajando quiero hacer tal vez como un gris tipo de gris medio para el interior de la boca, tal vez incluso más ligero que eso. Queremos tener algún color dentro de la boca, tal vez un ligero tipo de tonalidad rosada. Y hagamos que la lengua sea un poco más vibrante de un rosa. No queremos que se lea, porque eso empieza a volverse realmente loco. Entonces retrocedamos el rojo hacer una especie de rosa para la lengua y los dientes podrían ser blancos también. Está haciendo esos blancos tipo de clic. Todos estos son objetos llenos que nos van a hacer la vida realmente fácil, y podría ajustar ese color aquí, lo haga un poco más oscuro. Ahora tenemos esto como un golpe cumplido. Por lo que va a ser fácil agregar un color de gen. Se quiere agregar un color jean bastante realista, por lo que le agrega un poco de gris tardío ahí mismo. Y este es un relleno para que incluso podamos cambiar. Puedo conseguir la muestra de herramienta cuentagotas que obtienen el mismo Phil que el pantalón. Pero haga doble clic en la muestra y la haga un poco más oscura, ligeramente más clara, solo para agregar un poco de contraste con tonos y colores. Nada grande. Y esta hebilla de cinturón, supongo que quieres llamarla una construida, ya sabes, que podría ser amarilla. Perfecto. Y luego nos dieron los pies. Eso sólo va a conseguir la muestra de herramienta cuentagotas o verde y tenemos nuestros pies y luego la cláusula puede permanecer blanca. Podrían estar de blanco roto lo que quieras hacer por eso. Entonces mira lo rápido que pudimos colorear a este tipo. Tenemos algo básico de coloración plana, los tonos individuales. Lo que vamos a hacer ahora es subir un nivel más, y vamos a añadir una sensación de reflejos y sombras dibujando en algunos reflejos manualmente y sombras y usando colores más oscuros del color del color base. Entonces, vamos a acercar. Vamos a crear un sentido de lo más destacado. Tenemos que determinar de qué lado va a ser sombras y de qué lado va a ser más destacado, tendrás naturalmente la sombra en el ojo que podemos hacer una especie de azul claro. Por lo que ahí está su destaque. Y así ahora sabemos que las sombras ahí van a haber a la derecha y los reflejos van a estar a la izquierda porque esto es una especie de sombra proyectada en el globo ocular, y así solo usaremos eso como nuestra determinación. Entonces si los reflejos van a estar aquí arriba fue Probemos un poco más destacado aquí, así que va a estar del lado izquierdo, y las sombras van a estar a la derecha. Vamos a hacer el mismo tipo de trucos con la herramienta de ancho que hicimos antes para crear una sombra fácil o resaltar en este caso, llevemos nuestra herramienta cuentagotas. Es muestra los mismos rellenos verdes exactos sacan el trazo, trabajando un doble clic o un Phil verde, y sólo vamos a aligerarlo lo suficiente para ser una sombra. Entonces ese es el original. Eso sería lo más destacado quiero decir, discúlpame. Destacar. Haga clic en. OK, puede que tengamos que entrar y hacer nuestro trazo con herramienta otra vez en eso. Eso no es gran cosa y algo así como tipo de gorras redondeadas ahí. Entonces, así como así, pudimos crear un pequeño destaque realmente aseado. Entonces hagamos un punto culminante por la izquierda de él. Entonces aquí hay otro pequeño truco con el con herramientas solo tipo de dibujar esto. Yo quiero poder abordar algunos de estos pequeños picos aquí en el en lo más destacado. Así que sólo una especie de dibujó un trazo en todo el camino. Ese tipo de siguió el contorno de esa zona. Y una vez más, voy a conseguir eso con herramienta, y como que voy a expandirlo. A lo mejor en algún lugar del medio nos expandimos un poco Y mira qué instantáneo es ese resaltado Y eso bonito, muy rápido. Haz lo mismo con los pantalones eran solo puedes dibujar algunos de estos p para herramienta pin. Podríamos incluso simplemente hacer una pequeña herramienta dibujada a mano ahí, y luego podríamos conseguir la herramienta con para fácilmente tipo de expandir esa forma, conseguir la herramienta cuentagotas. O podemos tomar muestras. Adelante, doble clic en este reloj. cualquier momento que me gusta muestrear muestras, solo puedo hacer doble clic, obtener la información, copiar ese código hexadecimal, y luego traerlo aquí. De esa manera, no tengo que rehacer el trazo en eso. Si hago la herramienta cuentagotas, esto va a ser un punto culminante. Entonces eso va a ser más ligero. Y así ahora es Ah, queremos hacer tal vez uno en este pie, también. Entonces es cuando se pone un poco complicado. Entonces esto es lo que vamos a hacer. Vamos a conseguir su herramienta de pin. Vamos a rastrear lo que creemos que sería un área muy buena destacada. Así que sólo un poco alrededor de este pie, y voy a ser liberal con esto. No me voy a preocupar tanto, porque eso va a ser recortado. Entonces ahí es donde quiero lo más destacado. Vamos a seguir adelante y que sea el doble click de color. Hazlo un poco más ligero. Ese será nuestro color más destacado. Y entonces, ¿cómo recortamos esto? Esto es lo que vamos a hacer. Vamos a copiar el pie. Vamos a copiar la forma que acabamos de crear un pegarlo por aquí. estaría usando la herramienta de constructor de formas para una especie de recortar esto. Entonces no necesito el golpe en eso. Entonces solo voy a agarrar ambos elementos, hacer nuestra forma, constructor, herramienta, mantener la opción con signo de resta. Y quiero poder restar esa zona en esa zona. Y luego nos acaba de quedar con la porción más destacada. Ya no necesitamos eso. Podemos arrastrar esto hacia arriba. Debe caber perfectamente overtop justo ahí. Por supuesto, hacemos puede que tenga que tomar la herramienta pin y hacer algunos ajustes menores. Entonces, ¿así es como se puede en un punto culminante cuando también tienen todos estos trazos ? Este no era un objeto lleno. Esto es algo que creamos desde cero. Pero hay un poco de destaque de pie y también tenemos este pequeño trazo aquí que sería fácil de poner en la parte superior porque es un trazo separado. Entonces veamos esa pequeña de ahí. Entonces vamos a enviar esto hacia atrás y sistema de capas comando corchete izquierdo. Envíalo todo el camino de vuelta para que esa pequeña línea se ponga en la cima. Así que usa esa herramienta de constructor de formas para ayudarte para que no tengas que sentarte ahí y trazar alrededor de todos esos trazos. Eso podría ser un poco molesto. Por lo que ahí está nuestro punto culminante en su pie, así que tenemos destacados hechos. Hagamos unas sombras. Hagamos la sombra en este pie usando el mismo método. Entonces sombras nos van a echar del lado derecho y seguir adelante y traerlo de vuelta en un sistema de capas. Entonces y consigue ese trazo encima de él. Y, por supuesto, sólo tenemos que volver. Y tal vez no sea perfecto, pero así es como estoy haciendo esos reflejos y sombras, y podríamos hacer una sombra más aquí. Podríamos incluso solo Duplin. Podríamos simplemente dibujar sombra bajando. Entonces, ¿qué? Que solo vamos a hacer esto bajo sombra de paja tipo de ir por la pierna del pantalón, y podrías aplicar el mismo método logo del dedo del pie, diseño y símbolos e iconos. Por eso estoy como que quiero revisar esto como una ilustración más complicada, que puedas estar preparada para hacer, um, cualquier cosa, cualquier cosa, verdad. Entonces está haciendo eso un poco más oscuro. No necesito el derrame cerebral. Envíalo hacia atrás en el sistema de capas, Do do do do do lo haga hay un punto culminante. Podemos incluso añadir un punto culminante del otro lado, pero creo que vamos a estar bien a menos que queramos duplicar esto. Reflejar. A ver cómo se ve eso de este lado. Podría ser un poco demasiado. No quieres tener demasiadas sombras y reflejos, pero veamos qué tenemos aquí. Vamos a probar ese color. Probablemente solo debería tener una muestra por aquí, así que no tengo que sentarme ahí y eliminar. Elimina eso cada vez. El negro probablemente tendría que rehacer la herramienta de ancho aquí podría ser un poco mucho, pero creo que funciona. Ahí hay un poco de destello o sombra. Tenemos reflejos y sombras agregadas, tenemos especie de alguna dimensión a nuestro pequeñito. Aquí te dejamos un pequeño monstruo cada vez que quieras llamarlo. Entonces ahí vamos. Tenemos una ilustración vectorial total directamente de un dibujo para que puedas ver el dibujo original y pudieras ver todos los pasos que seguimos para hacerla de después de la ilustración, y así es como luce la final. Ahora puedes exportar esto, hazlo ícono. Se puede hacer un poco de ilustración para algo mayor. Es todo vector rised, ojalá se divirtiera. Este fue uno totalmente fondo, pero puedes aplicar muchas habilidades que aprendiste aquí para subir vector cualquier boceto dibujado a mano , logo, símbolos, iconos, ilustraciones y más. 36. BONUS - herramienta de Puppet de marionetas: por lo que tiene una pequeña conferencia de bonificación. Quería hablar de la herramienta de títeres, que es totalmente nueva para la versión 2019 de Adobe Illustrator. Entonces si tienes una versión anterior, no tendrás acceso a esta herramienta. Pero definitivamente quería sacarlo a la luz para quienes sí tienen acceso a esta herramienta. Entonces este es el que creamos en la clase. Y esta es la versión que creé antes de filmar la clase cuando se me ocurrió ideas y conceptos, y lo que hace la herramienta de títeres es que crea ciertos pinpoints que podrías manipular. Y se puede animar un poco esto para conseguir diferentes posiciones. Um, por ciertas partes de tu personaje. Entonces así es como se ve la herramienta de títeres. Está justo aquí en el fondo. Puedes acceder a eso si no lo ves en tu barra de herramientas. Podría simplemente dar clic aquí y ver si puedes encontrarlo. Va a parecer un pequeño alfiler, así que vamos a seleccionar nuestro objeto. Habríamos agrupado a este tipo. Tan solo asegúrate de que esté agrupado y consiga nuestra herramienta de warp de marionetas, y va a crear varios puntos aquí para nosotros para que podamos mover estos y manipular estos puntos para especie de cambio y mover un poco su cuerpo. Por lo que quizá podamos estar abajo antena Hiss. Podríamos poner un punto aquí mismo para doblarlo así. Se podía ver una especie de cómo realmente puede cambiar tipo de las características de él un poco . Entonces tomemos esta pierna. Parece que está saltando o saltando. No tenía brazos porque eso sería un poco más fácil de animar con brazos. Pero todo tipo de cosas que podemos hacer con esto solo quería tipo de mostrar y demostrar tipo de lo que podrías hacer con esto la herramienta de warp de marionetas. Y si quieres eliminar un punto determinado, lo resalta y luego simplemente lo eliminas. Si desea agregar un punto, haga clic. Funciona mucho como la Grady, It Mesh Tool y la herramienta de ingrediente de forma libre 37. Proyecto de diseño del conjunto del icono: cuadrícula y configuración: Por lo que ahora es el momento de crear un icono completo y cohesivo Set. Vamos a crear conjunto de iconos que pertenezca juntos Fuimos a crear este conjunto que ves aquí mismo vamos a hacer todo esto en Adobe Illustrator. Entonces hablemos de rejillas por solo un poquito. Cuando se trata de diseño de iconos y el tipo de conjunto de iconos que estamos creando, estos iconos no se van a utilizar en la tienda APP. También vamos a hacer un icono de app un poco más tarde para la tienda APP. Pero estos iconos aéreos que podrían ser utilizados para sitios web para aplicaciones digitales, cualquier cosa que requiera un icono pequeño, um 16 por 16 píxeles todo el camino hasta 128 por 128 icono de tamaño. Por lo que estos van a ser tus iconos que utilizas para tu interfaz de usuario en todo tipo de aplicaciones digitales, sitios web, móviles, APS y más. Por lo que necesitamos asegurarnos de que los iconos van a ser lo suficientemente pequeños como para trabajar a un tamaño tan pequeño. Entonces, durante todo este proceso, vamos a estar alejándonos, asegurándonos de que realmente podamos entender lo que está diciendo el ícono. y necesitan ser súper simples porque vienen iconos y muchos tamaños diferentes que podrían. Necesitan estar en 16 por 16 píxeles, que es muy, muy diminuto, y necesitan poder lucir muy bien también en los grandes 256 por 256 píxeles. Por lo que necesitan existir en todos estos diferentes tamaños y espacios. Por lo que lo mejor es tener el logotipo más simplificado. Es posible, y uno que también es muy flexible. Y me gusta usar rejillas cuando hago mis juegos de iconos. Y eso se debe a que te da una guía para poder adaptar este ícono y asegurarte de que tenga el bonito borde a su alrededor, que cada ícono tenga el mismo espaciado, y simplemente te da una buena base en la que basar tu diseño. Además, también te ayuda cuando te estás haciendo formas métricas como guía y diferentes líneas para tipo de ayuda te guían a crear muchas de estas diferentes formas e iconos. Entonces esto es una cuadrícula, y así es como estoy creando la cuadrícula. Se basa en la relación Fibonacci, y lo que haces es crear una especie de cuadrado y luego crear un círculo dentro de ese cuadrado y luego dentro de los confines de ese círculo, crear otro cuadrado y luego poner un círculo dentro de eso. Y también tienes estas tres o cuatro divi Ah, líneas diagonales y horizontales y verticales que lo atraviesan también. Ese también tipo de ayuda te guía. Así que tienes algunas cosas diferentes es una especie de rápido mostrarte cómo creé esto realmente rápidamente para ti tienes una bonita plantilla donde todo esto ya se ha hecho para ti, así que no tienes que preocuparte por ello. Pero quería mostrarles cómo se construyó esto para que puedan entender cómo se armó la cuadrícula. Por lo que antes de empezar, quería mostrarles este increíble recurso descargable. Es ah grid tipo de plantilla de cuadrícula para ti, donde creé esa cuadrícula detallada. Y tengo esto espaciado en la cuadrícula para ti y tengo esto espaciado afuera va a haber 16 iconos diferentes, así que tienes 16 cajas diferentes. Pero esta es una gran plantilla y una gran guía para que trabajes. Para que no sientas que solo estás diseñando un ícono y un gran documento abierto que tienes un buen tamaño y conoces los bordes del ícono y tipo de algunas de tus restricciones con el ícono con el conjunto que creé antes, cuando estaba venir con conceptos para el curso, que hay un tema a este íconos que estamos creando y ese tema será un trazo similar . Espera. Por lo que hay un peso de trazo similar a lo largo de todos estos diferentes iconos. No difieren mucho. Son todas fuentes de tres puntos. Espere, Mayor. Eran todos iguales. Y así está ese tema consistente que recorre el icono. De modo que cuando se usan juntos como un conjunto o cuando se usan en la aplicación o en una aplicación móvil , podrás ver el branding consistente y el tema consistente a lo largo de todo. Eso es realmente importante pensar cuando estás haciendo tu propio conjunto único de iconos. Entonces si quisieras trabajar conmigo a través de estos iconos básicos, vamos a pasar por un montón de herramientas y trucos para tratar de que estos iconos se hagan rápidamente y sobre todo haciendo algún trabajo de cuadrícula. Entonces hagamos algunas cosas muy rápidas para que nuestros programas de ilustradores se pongan en marcha para que podamos hacer esto lo más fácil posible de trabajar a través de este proceso. Entonces lo primero que tenemos que hacer es ir a ilustrador buena una preferencia e ir a general, y vamos a asegurarnos de que nuestra escala, esquinas y escala, trazos y efecto estén marcados. Eso es muy importante cuando escalamos estos iconos más y más pequeños, que no tengamos ningún cambio en nuestro trazo. Por lo que nuestro golpe se mantendrá consistente sin importar el tamaño que sea. Entonces eso es realmente importante hacer. Otra cosa que queremos haber hecho como asegurarnos de que se muestren nuestras rejillas. Hay un pequeño atajo de teclado. Voy a estar usando mucho a lo largo de esta sección del curso. Es su cita de comando, y se puede cambiar a menudo en las rejillas. Si quieres hacerlo manualmente, solo tienes que ir a ver y bajar a mostrar cuadrícula, y se encenderá la cuadrícula por ti. Y si alguna vez quisiste editar tu cuadrícula para que se parezca mucho a la mía, debería. Toda la plantilla debe guardar automáticamente la cuadrícula para ti, así como esto. Pero si no, te mostraré cómo tengo esta configuración. Vamos a bajar dos unidades y rejilla, y así es como puedes cambiar tipo de coloración y todo de tu cuadrícula. Entonces aquí están tus opciones de cuadrícula. Justo aquí abajo. Yo lo tengo. Teoh 32 pixels por cada caja. Ese es el tipo de icono que vamos a estar haciendo. Eso va a ser lo que se llama nuestro tamaño base. Por lo que los iconos necesitan venir en todos los sabores de diferentes tamaños. Supongo que se puede llamar, y me gusta recoger el tamaño basado, que está todo en el lado más pequeño, por lo que siempre se puede escalar fácilmente. Por lo que nuestra base tamiza 32 píxeles por 32 píxeles. Entonces así de grande es este particular cada una de estas cuadrículas. 32 píxeles y luego dentro tienes subdivisiones y tienes 34 subdivisiones que parecen funcionar mejor a la hora de tener un montón de pequeñas opciones cuando se partió una cuadrícula. Esta es una especie de las opciones que tengo en mis rejillas y unidades. Puedes cambiar el color si el gris es un poco demasiado fuerte y está afectando tu capacidad de ver tu diseño, puedes cambiar el color. Y por último, hablemos de la plantilla. Entonces tengo unas cuantas capas aquí teniendo un zoom hacia fuera. Entonces como que ves todas estas juntas. Y así tenemos un lugar para las rejillas que ella puede activar y apagar en cualquier momento. Por lo que siempre puedes asegurarte de que, um realmente puedes ver tus iconos sin nada de eso arenilla. A veces realmente ayuda desactivar eso para ver cómo se ven realmente tus iconos y tener algún ícono de muestra. Entonces estos son los íconos de muestra. Voy a dejar estos aquí para que veas cómo he construido todos estos. Entonces cuando te mueves por toda la clase y te vas, ¿cómo volvió a hacer eso? Puedes volver atrás y mirar mis trazos crudos, y aquí es donde van a ir tus iconos. Entonces esta es la capa que vas a tener. A mí me gusta mantener mis rejillas cerradas para que no mueva accidentalmente esas por ahí. Así que tienen mi icono gridlock. Y aquí es donde vas a estar viviendo durante la próxima hora. 38. Proyecto de diseño conjunto con íconos: empezar: Por lo que vamos abajo son rápido poco lista de cheques de todo lo que necesitamos tener configurado. Sé que es un poco tedioso, pero se va a poner muy divertido. Una vez que tengamos todo configurado. Una cosa más que queremos hacer, Vamos a subir a ver. Y por ahora nos vamos a asegurar. Bueno, guías inteligentes son agradables tener en eso es eso tiene que ser una guía útil. Pero además de que snap to grid es realmente bueno. Esto podría ayudar a chasquear nuestros pequeños puntos y son trazos y trazos de lápiz a los puntos de la cuadrícula. Por lo que nos va a ayudar a hacer un tipo geométrico muy bueno de iconos donde todo se encaja. Por lo que vamos a estar tocando snap to grid off, on y off. No lo vamos a tener encendido todo el tiempo porque podrían ser algunos ajustes que necesitamos hacer donde necesitamos tenerlo apagado. Pero por ahora, vamos a asegurarnos de que snap to grid esté encendido, y así estamos listos para hacer nuestro primer ícono. Entonces vamos a ir a nuestra primera pequeña zona aquí y revisarla. Entonces ya que tenemos snap to grid encendido y déjame seguir adelante y conseguir un buen golpe en marcha para que pudiéramos asegurarnos de que todo sea consistente. Entonces desde que me he roto, de acuerdo, se puede ver cómo todo se está chasqueando bien, y hace todo este proceso. Puedo hacer click a través de esto muy rápido, y no tengo que sentarme ahí y asegurarme de que lo hago perfectamente. El tipo de computadora lo hace por mí. Primer ícono va a ser este pequeño sobre íconos fueron para empezar muy fácil y poco a poco ponerse un poco más difícil. Voy a cambiar esto de un trazo de tres a un de 1.5 puntos. Espere. Creo que eso se verá un poco mejor después de hacer algo de práctica. Y por ahora solo voy a asegurarme de que mis gorras redondas estén encendidas y mi unión redonda esté encendida solo para darle a las cosas una gorra más suave a su alrededor, gorra en un borde liso. Por lo que está rota. Un gran encendido. Esto será bastante fácil. Entonces solo voy a conseguir mi herramienta de rectángulo. Podría incluso a caja de paja aquí mismo sobre la rejilla, conseguir mi herramienta pin p para Penn y ha dibujado un triángulo, y entonces incluso puedo colapsar esto. Y entonces lo que es genial de la cuadrícula es que nos da una guía del espaciado alrededor de la parte superior de la parte inferior para que pueda ajustar esto y asegurarme de que tengo la misma cantidad de espaciado entre la superior y la inferior, y la cuadrícula es realmente genial para eso. Entonces tal vez estás pensando en dónde no estás siguiendo esas líneas diagonales perfectamente, eso está bien. No está destinado a ser los únicos lugares en los que se pueden poner trazos. Simplemente se entiende como una guía de tipo para espaciamientos. No te sientas como oh, solo tengo que usar estos ángulos particulares. No en absoluto. Solo está ahí para que ayudes a asegurarte de tener un espaciado similar. Entonces 12345678 y luego ocho y luego tenemos algún espaciado similar en los lados. Y así, así como así, voy a alternar mi capa de rejilla. Tenemos un pequeño ícono, súper simple, y me gusta especie de los bordes redondeados a ella en los trazos más gruesos. Entonces cuando me alejo, todavía puedo ver realmente ese ícono porque va a existir en un ambiente muy pequeño , así que esa fue una práctica un poco agradable. Pasemos a algo un poco más desafiante. Entonces tenemos este pequeño lápiz que queremos hacer a continuación, que eso sea bastante sencillo. Y primero hagámoslo vertical. mí me gusta hacer las cosas verticales y luego girarlas de lado 45 grados, así que hay que conseguir aquí el espesor correcto. Por lo que tres cajas a cada lado. También queremos hacer el punto del lápiz, y queremos dibujar uno. También met get son herramienta de selección directa y asegúrese de que sea parejo. Por eso tenemos la grilla para ayudarnos a averiguarlo. Entonces P para Pin, voy a seguir adelante y dibujar un poco de ah, y esto podría ser un poco estilizado. Entonces en lugar de solo completar la forma, voy a dejar un poco de área en blanco ahí a especie de estilizado el bolígrafo solo para que no parezca solo un montón de formas geométricas. Pero juntos hay un poco de estilo ahí. Vamos a dibujar un poco de nuestro Inc justo ahí y hacer que sea un relleno, y hay o lápiz Lo que conducimos. Vamos a dimensionar esto. A lo mejor haremos una muesca, un poco más delgada moviéndola hacia abajo dos veces. No queremos engordar, así que creo que eso se ve bastante bien, como es que tienen un pequeño truco. Si quieres girar las cosas perfectamente en ciertos ángulos, como ángulos de 45 grados, solo tienes que seleccionar tu objeto. Vamos a seguir adelante y agruparlo y en lugar de solo gastarlo y tratar de adivinar o subir a transformarse y tratar de girarlo de esa manera, podrías mantener pulsado el botón de turno cuando tenía esta pequeña herramienta de giro, y va a haga clic automáticamente en él a ángulos de 45 grados, lo cual es super duper útil. Por lo que solo manteniendo pulsado el botón de cambio y cambiando esto, tenemos nuestro lápiz perfecto y listo para salir Cuando alejamos el zoom. Eso se ve realmente bien. Vamos a alternar los iconos de oferta para echarle un vistazo y volver a encenderlo. Entonces hagamos nuestro siguiente ícono. Esto será un poco divertido. Vamos a hacer ese mismo turno y rotar truco. Tenemos solo una sencilla herramienta de elipse y fue tomar nuestras herramientas cuentagotas para asegurarnos de que tengamos trazos consistentes. Tan solo quieres asegurarte de que todos nuestros golpes sean 1.5. A veces cuando haces algo más pequeño, cambiará el trazo. Pero solo asegúrate de que todo tipo de permanezca consistente con el golpe. ¿ Y sabes qué? Podría ser capaz de hacer ese golpe un poco más pequeño, y esto es sólo algo con lo que vas a tener que experimentar. Entonces en lugar de un punto por tal vez 1.2 thes aire, sólo pequeños cambios. Pero no lo quiero tan grueso que no puedas ver los detalles. Podríamos necesitar hacer el círculo un poco más pequeño. Entonces eso no es gran cosa. Está manteniendo pulsado el turno y tipo de clics en su lugar dos manchas. Y entonces podría ponerme mis rayos de sol y esto es lo que voy a hacer. Voy a hacer esto, hijo top sunray primero y luego sólo mantenga presionada opción y arrástrela. Entonces solo duplicándolo, tráelo aquí abajo y esto es lo que voy a hacer. Podría necesitar hacer clic en esto una vez más, Así que ahora tienen tres espacios en todo el camino. Da clic a este Ford una vez, y voy a hacer un pequeño truco aquí. Lo que voy a hacer es que voy a copiar, y tú solo podrías hacer tu copia de atajo de teclado, y vamos a pegar en su lugar. Vamos a subir aquí y pegar en su lugar. ¿ Qué pasa? Para memorizar ese atajo, vamos a pegar esto en su lugar, y luego vamos a aguantar. Por lo que hizo una copia. Sostenga el turno. Y al igual que ese boom. Tenemos nuestras pequeñas copias. Entonces sólo vamos a seguir haciendo eso. Sostenga el turno, haga clic en él y una vez más. Mira hacia arriba. Y tenemos nuestro ícono hijo así como así. Entonces hablemos un poco para asegurarnos de que se vea bien a distancia. Y una vez más, sólo tendremos que asegurarnos de que los trazos sean consistentes. Siempre podemos simplemente tomar la herramienta cuentagotas, asegurarnos de que todos se adapten al mismo trazo. Entonces ahí está nuestro ícono de hijo. Pasemos a un ícono de imagen. Pero éste será aún más fácil porque podríamos destruir todo tipo de centrado en la cuadrícula. No puedo imaginar hacer esto sin rejillas. Simplemente lo haría mucho más arduo. Dibujemos nuestras cimas de montaña y diga pinchando derecho en su lugar la montaña no tiene que ser exactamente lo que tenía antes. Y vamos por nuestra herramienta de labios y dibujemos, hijo. Pude ver qué tan rápido podría batir un set Nikon encendido. Hay un pequeño icono de imagen. Podríamos incluso hacer eso un poco más amplio porque queríamos ir un poco al borde porque se trata de un inmueble muy pequeño. Por lo que queremos poder maximizar su uso, así que sólo asegurarnos de que lo usamos. No queremos tocarlo hasta el borde porque tenemos un bonito margen. Queremos evitar poner muchas cosas en el margen. Entonces solo quiero hacer lo más cerca que pueda, pero aún teniendo espacio para respirar mi ícono. Y tal vez necesite hacer eso de nuevo en un círculo perfecto. Ahí está su icono de imagen Ahora vamos a hacer un reloj, así que hagamos un simple círculo con un broche de presión. Agradable muy bien en su lugar para nosotros. Y esto será fácil porque sólo vamos a conseguir la herramienta pin y hacer un simple tiempo de la cara del reloj . Entonces uno va a ser más corto que el otro y podemos hacer eso dramático. Entonces vamos a hacer uno más más alto. Entonces creo que lo más difícil del diseño de iconos no es la creación de ellos, sino la idea detrás de ellos donde consiguen un look como, ¿Cómo vas a simplificar unas cosas complejas como amistad o comunicación o bases de datos ? ¿ Cómo vas a tomar una especie de, ah pensamiento abstracto y hacer una Nikon fuera de él? Esa es la parte más difícil del diseño de iconos que va. De acuerdo, así que tengo un reloj. ¿ Cómo puedo simplificar ese reloj tanto como sea posible para que pueda evitar tener muchos detalles y líneas aquí para estos este conjunto de iconos en particular. Entonces ese es un tipo de reto más grande. Y sé que llegaremos a eso con algunos de estos iconos más complejos de este tipo de icono de micrófono. Ya sabes, muchas veces todas las fuentes de fotos de Google y miraré los micrófonos y me iré OK, ¿cuáles son los elementos más sencillos de este micrófono? Ya sabes, tenemos la base redonda. Tenemos el stand, tenemos tal vez un botón de encendido todos los demás detalles pueden quitar y derretirse. Simplemente estamos tratando de conseguir el elemento más básico y forma básica, y a veces encontrar una foto de ese objeto realmente ayuda o haciendo estudio de otros conjuntos de iconos que tienen temas similares en ellos. Hagamos esta estrella y luna a continuación. 39. Proyecto de diseño conjunto del Icon 3: Por lo que tenemos una estrella y un icono de luna. Entonces parece que con esto, podría ser capaz de hacer un poco de tramposo. Va a escoger un punto aquí, especie de hacer una forma de media luna y tal vez no tener que ir todo el camino hasta el borde. Pero solo podría conseguir mi herramienta de selección directa y arreglarlo. Esto va a chasquear el en lugares Bueno, la esquina redondeada. Entonces eso va a romperse en su lugar. Puedo obtener mi herramienta de ancho aquí y hacer clic y arrastrar para especie de crear una forma de luna. Y lo que necesitaré hacer es, ya que esto sigue siendo un solo golpe, quiero hacer un tipo de camino delineado así. Entonces voy a necesitar ir a camino. Voy a necesitar delinear mi trazo para que pueda tomar mi herramienta cuentagotas y adaptar eso mismo. O en realidad sé lo que es. Es 1.2 y luego quitarle cualquier tipo de relleno. Entonces ese tipo de era una forma rápida de hacer un esbozo. Podría hacer esto un poco más pequeño ahora que lo tengo contornos y luego estrellas aire fácil porque tenemos una herramienta estrella, por lo que eso sólo va a azotar algunas estrellas haciendo varios tamaños. Podemos hacer de estos un relleno porque el trazo esto va a ser demasiado grueso para ver los detalles del trazo, por lo que podría necesitar hacerlos un poco más grandes. Entonces pasemos al micrófono. Entonces es cuando hablé antes de cómo tenemos que simplificar objetos complejos y hacerlos simples posible mediante el uso de trazos simples. No queremos tener muchos detalles en el micrófono, pero con tan solo un par de trazos en una línea, pudimos comunicar efectivamente que eso es un micrófono. Por lo que mientras puedas distinguir el ícono, esa es la parte más importante de todo esto. Entonces vamos a ver si puedo hacer un rectángulo redondeado y seguir adelante y conseguir que nuestra pastilla en forma vaya cuando me encontré. Hazlo con el grosor correcto y también vamos a llevarlo hasta las tapas. Aprovecha una inmobiliaria aquí porque vamos a necesitar poner nuestro stand. Entonces veamos cómo, cuánto tiempo necesitamos para hacer el estrado. Ya veremos si eso va a funcionar. Asegúrate a tu alrededor. Todavía están encendidas las gorras. Estoy haciendo mis atajos de teclado. Entonces lo que estoy haciendo es seleccionar V, que es tu herramienta de movimiento tipo de un seleccionar y luego ir y seleccionar mi bolígrafo para no tener que seguir subiendo ahí y seleccionándolo. Y a es sus herramientas de selección directa. Esto es un poco agradable tener a mano esos atajos de teclado. Entonces vamos a crear algún tipo de ronda y queremos que esto se vea tres d de una manera o no. Tres D, pero al menos me gusta alrededor para que pudiéramos tomar la herramienta de pasador y dibujar una forma aquí. Pero entonces se parece más a una pastilla en un poco menos como un micrófono para que pudiéramos tomar nuestra herramienta de curvatura click justo aquí en el medio, click abajo para hacer eso redondeado, y podríamos mover eso hacia arriba y luego lo único que quedaba para hacer un pequeño botón de encendido. Entonces sólo nos va a gustar una pequeña línea que atraviesa tal vez ni siquiera la haga tan gruesa. Y lo que podríamos hacer con esto no es que todo tiene que ser esta forma redondeada. Lo que podríamos hacer es simplemente conseguir una herramienta de rectángulo y dibujar sobre dos cajas y simplemente convertirlo en un relleno para que no tenga los bordes redondeados. Este tipo de le da un poco más de contraste. Entonces está nuestro pequeño icono de micrófono rápido, y si alguna vez queremos hacer esto más pequeño, podemos hacer clic en él hacia abajo uno. Y a veces hay que hacer clic hacia abajo para asegurarte de que se quede, incluso sólo comparando el grosor del trazo que tenía antes. Este es el icono anterior. Es un poco más gordo, ¿no? Entonces vamos a ver si no podemos hacer clic en eso una vez y volver a tal vez un poco de una presentación más gorda , y eso podría necesitar ser empujado un poco hacia arriba. Por lo que eso tiene dos puntos. A ver si no podemos alrededor de eso un poquito y ¡voila! Tenemos un icono bastante bueno ahí. Agradable para desactivar las rejillas y especie de ver cómo se ve nuestro conjunto de iconos. Entonces ahí está lo que tenemos. Todo se ve bien en la parrilla. A veces cuando veo las cosas a distancia, veré algunos errores para que la luna. A lo mejor necesito moverlo un poco más hacia el centro, y eso es todo. Entonces sigamos adelante. Tenemos una batería al lado, por lo que la batería y vamos a llegar poco a poco más complejos con el tipo de objetos que estaban haciendo así pueden aprender a simplificar formas complejas. Y creo que lo más grande es asegurarnos de que no hagamos las cosas demasiado dramáticas. Por lo que no queremos crear una batería que sea un poco demasiado gruesa porque pierde su batería. Es genial mirar las fotos de la batería. Son más delgados. Ya sabes, esto es genial para especie de tener eso en cuenta como nosotros como hacemos esto juntos, vamos a dar la vuelta a las esquinas en eso. Y las baterías siempre tienen esa cosita al final de un extremo. Ese tipo de had indica que es una batería, así que probablemente podríamos hacer eso con un relleno. No tenemos que hacer un trazo para eso, así que hagamos un rectángulo redondeado. No tienes que usar trazos para cada objeto. En ocasiones puedes salirte con la tuya con solo usar un relleno. Vamos a hacer eso. En este caso, sólo queremos indicar un poco de la batería. Por lo que este es uno de esos casos en los que necesitas podría necesitar desconectarte. Colocar a la cuadrícula no lo es. Todo se va a conformar perfectamente a esta rejilla que es un poco demasiado gruesa para la batería. Entonces lo que podemos hacer es esto Apagar rápidamente, ajustar a la cuadrícula o puedes usar el atajo de teclado. Entonces solo apagarlo para que llegue me permite quizá hacer un punto medio personalizado. Por lo que no es demasiado grueso y no es demasiado delgado, y eso puede activarlo rápidamente. Entonces no sientas que tienes que tener snap to grid y todo tiene que ajustarse a la grilla . Por favor siéntete libre. Nunca sientas como si estuvieras en caja en esa grilla y te metieras a ella todo el tiempo. Pasaba lo mismo. Trae uno en la parte inferior y queremos seguir adelante y añadir especie de jugo. Ya sabes como tipo de ves tu iPhone o algo cargando. Y es una especie de 1/3 del camino cobrado. Vas a tener este jugo aquí. Entonces lo que vamos a hacer aquí es paja un simple. Phil, Haz que sea un Phil y consigue nuestra cobertura o herramienta. Vamos a dos puntos diferentes para hacer que parezca una ola Vamos a dar clic abajo en un punto y arriba en el otro. Va a crear nuestra ola. Entonces es una especie de nuestro jugo. Supongo que podrías llamarlo, y luego necesitamos un elemento más. Necesitamos algún tipo de relámpago para especie de indicar que se trata de un elemento de batería de carga . Es sólo ese ícono extra que ayuda a describir qué es esto que esto realmente podría ser cualquier cosa en este punto, como que parece una batería. Pero creo que el relámpago realmente, realmente ayudará a comunicar eso de manera efectiva para que pudiéramos hacer un relleno para esto. Vamos a hacer un relámpago, así que voy a hacer clic sobre un lado, hacer clic sobre, algo así como hacer un poco del mar. Hace bien. Podría necesitar hacer esto bastante largo click por aquí. Siempre podemos cambiar esto después de que lo hagamos y ahí está nuestro rayo. Toma nuestra herramienta de selección directa. Podemos tomar este curso de chasquear a la grilla, así que nos va a dar un montón de opciones aquí. Hagamos que eso vaya recto y chasquemos de esta manera. Hacer que se rompa en los mismos ángulos. Esto podría llevar un poco de trabajo para cortar un fideos con esto. Y esto también es cuando tal vez apagando salmulos. No es una idea horrible si quieres especie de sintonizar realmente fina nuestra selección de relámpagos. De acuerdo, eso ya es suficiente por ahora. Es bonito y grueso. La gente va a poder ver eso. Entonces voy a volver a encender snap to grid. Ahí está nuestro rayo. Puedo aunque quiera que coincida perfectamente con lo que hice antes. Yo sólo puedo reflejarlo. Será bonito si alisé los bordes porque todo tiene una especie de borde liso a ella. Todos estos bordes están alisados, por lo que no queremos que sea 22 redondeado porque queremos tener algún contraste. Pero vamos sólo alrededor de estos cada vez tan ligeramente así que sólo un poco de curva en esas curvas. Oye, ahí está nuestra batería, y ésta va a ser súper simple. que ya hemos hecho algunos iconos complejos, aquí va a ser donde vamos a llegar a usar bastante la cuadrícula. Entonces vamos a dar clic aquí abajo, y sólo vamos a estar usando nuestra grilla aquí. No vamos a ir todo el camino ahí abajo, porque eso sería un poco demasiado dramático de un estrecho. Por lo que solo vamos a dar clic a un par de puntos arriba tal vez justo aquí. Aquí es donde estamos usando ¿Es la relación Fibonacci para tipo de determinar dónde estamos haciendo clic aquí y obtener nuestro 1.2 trazo o el que quieras usar? No tienes que usar lo que estoy usando, y luego queremos asegurarnos de que tenemos nuestras gorras redondeadas puestas. Y es que Podemos hacer la selección directa. Si queremos que sea más una flecha dramática. Podemos tener que se ajuste así como así. O podemos hacer que sea un relleno. Muchas opciones aquí para flechas. 40. Proyecto de diseño conjunto con íconos: 4: y creo que quiero hacer la etiqueta un poco más apretada arriba, y eso no es gran cosa. Haga clic sobre dos veces, haga clic sobre el doble de su tipo de haciéndolo más conciso. A mí me parece un poco gordo, y eso está bien porque sólo podemos traerlo por una muesca y traerlo por una muesca. M saca esto a la luz. Entonces teníamos un pequeño margen y espaciado aquí, todo el camino alrededor del ícono. Simplemente asegurándome de que mi espaciado sea uniforme en todo. Ahí está nuestra pequeña etiqueta. Hagamos un pequeño círculo rápido de Phil ahí mismo en el medio, y también queremos dibujar esta pequeña etiqueta de círculo. Entonces sólo vamos a hacer esto. Esto podría ser cuando despegamos la rejilla, porque podría no hacer un bonito círculo para nosotros en la cuadrícula. A veces es un poco estricto con eso. Este podría ser uno de esos raros casos en los que utilizas un trazo ligeramente menos grueso. Entonces en lugar de la 1.5, tal vez podamos salirnos con la suya haciendo un 0.75 porque esa pequeña cuerda no se supone que sea súper gruesa. Creo que va a superar la etiqueta de lo hicimos el mismo grosor estaba consiguiendo una herramienta de selección directa en ajustar esto. De acuerdo, entonces ahora necesitamos signos de un dólar. Obtenemos nuestra herramienta de tipo y hacemos nuestro signo de dólar o la divisa que quieras usar para esto. Y ahí está nuestro pequeño signo de dólar, y yo solo uso ¿qué tipo de letra? miríada pro de Didi. Pero tengo un trazo grueso aquí, así que está dando esta bonita, consistente, um, um, esquinas redondeadas sobre ella. Esa es esta miríada pro. Asegurémonos de que esto sea bonito y grueso para que podamos ver el signo del dólar. Cuando alejamos el zoom. Va a ser una etiqueta de venta para probablemente tienda de comercio electrónico. Queremos asegurarnos de que la gente pueda verlo bien, y aquí tiene algún mismo espacio. Tiene a tres espaciados aquí y tienen unos tres espaciados ahí, también. Y con esta paz general, veamos si no puedo derribarla una talla más. Hazlo tenemos suficiente margen por ahí porque si lo haces en iconos como este cuando lo guardas , no va a tener algo de ese bonito margen por encima. Cuando lo integres en un sitio web o tú yo entorno quieres construir en tan solo un poquito de margen alrededor de cada ícono. De acuerdo, sigamos adelante. Tenemos un símbolo de lugar ahora, así que esto es realmente básico. Todo clica en su lugar tan bien que podrías hacer este ícono en un minuto. Pero la parte más difícil, es averiguar cómo hacer la idea del ícono del juego, las ideas de la parte difícil sobre esto. Entonces para esto, estos son los elementos más básicos de un botón de reproducción. Tenemos el círculo, y tenemos el triángulo real que indica que es un botón de reproducción. Entonces tomamos algunos botones de juego complicados y simplemente le hicimos un simple es posible despojándolo de todo y simplemente enfocándonos en lo que Onley cosas que ayudan a comunicar cuál es el ícono. Y ese es el gran truco. Vamos a encogerlo hacia abajo una muesca para que el clip de papel este será un poco más complicado. Y este podría ser un caso en el que nos despeguemos el chasquido a la grilla. Entonces esto es Ah, vamos a empezar algo así en la parte inferior. Siempre podemos hacerlo más pequeño después. Lo que voy a hacer es que voy a empezar tipo de en este punto justo aquí del clip a tal vez justo aquí, y también quiero asegurarme de tener el grosor correcto. Entonces, vamos a ver. No queremos ser demasiado gruesos, así que tal vez justo aquí. Y así el para la primera ronda dando vueltas por fuera, creo que snap degrada va a estar bien. Pero cuando rodeemos, estaremos dando vueltas por aquí y regresando adentro y cortándolo continuando continuando. Si lo hago con snap to grid, empieza a ver una especie de extraña rareza pasando porque no va a volver al punto original. Se va por dentro, así que apaguemos, chasqueemos a la grilla por solo un poquito y veamos qué podemos hacer. Escuchar hacer clic atrás en mi punto de anclaje original. A ver si no puedo hacer click en el mismo punto es el otro lado y podría necesitar darme aún más espacio ahí mismo, y podríamos volver atrás y cambiarlo más tarde si no es perfecto. Entonces creo que vamos a envolver una vez más si miras una foto de un clip de papel y eso es exactamente lo que hice es rastrear una foto de clip, así que esta es la foto del clip de papel. Solía tener una idea de cómo funciona exactamente esto. No se me ocurrió nada más por arte de magia. Tenía que mirar uno y estudiar uno e ir. ¿ Cuántas veces se envuelve? Entonces cambiemos o acariciemos con. Asegúrate de que es el trazo con lo que necesitamos, y podemos volver a entrar con la herramienta de curvatura y realmente redondear estas esquinas un poco mejor. Sí, no te preocupes por snap to grid con este. Esto sería difícil de hacer con la severidad del snap a rejilla, así que sólo cambiar mis asas, así que sólo cambiar mis asas, asegurarme de que tenga un punto de alrededor suave, así que a veces hay que traer eso. Iban a estar un poco mejor. No es perfecto, pero creo que para este ejemplo, iremos con él y digamos que quiero. Asegurémonos de que esto esté alineado en el centro, y podría necesitar traer uno de estos clips hacia abajo. Entonces vamos a bajar esto. Puedo volver a encender mi snap a grid, o puedes usar el atajo de teclado, sea cual sea tu sabor. Y digamos cuando tipo de ángulo, porque ahora mismo mira hacia arriba y hacia abajo. Hablemos de todo eso. Eso se ve bien, Pero ¿y si añadiéramos un poquito de un ángulo de 45 grados? Y ciertos iconos en el conjunto pueden tener ese mismo ángulo? No todos ellos, sino los que son realmente altos. A veces es agradable tener ese ángulo con ellos, por lo que no sienten que se están estirando todo el camino hasta la parte superior de la parte inferior. Cuando haces unas diagonales, mantén pulsado el turno a su vez, como que ayuda a extenderlo un poco más. Incluso puedo hacerlo un poco más grande porque lo estoy poniendo en un espacio diferente amore diagonal espacio. Y entonces sólo asegúrate de que siempre me estoy quedando consistente con el golpe y hay o clip de papel . Entonces esta es una especie de, Ah, diferente porque aquí tenemos dos elementos de cruce diferentes. Entonces vamos a usar esta herramienta constructor de formas para construir esta llave porque si miras una imagen de una llave real, tiene un montón de cosas en ella. Pero necesitamos despojarnos de todo eso y simplemente enfocarnos en esa forma principal del interior de donde se pone la llave en la tuerca para apretarla. Entonces eso es lo que realmente necesitamos comunicarnos es ese divot? Entonces vamos a estar creando eso y usando la herramienta constructor de formas para cortarlo. Entonces esto es lo que vamos a hacer. Vamos a construir una llave inglesa como relleno y no un trazo. Vamos a hacer el cuerpo de los ricos, y vamos a hacerlo aún así, dos cajas a cada lado. Hagamos un gran círculo viejo aquí para nuestra parte redondeada de la llave y hagamos otro en la parte inferior, y se ve un poco ridículo ahora mismo, pero vamos a cortar esa forma de perno. Entonces hagamos esa forma de perno. Vamos a dibujar en Blanco para que pueda ver dónde está. Dibujemos. Es como que tiene tipo de baja casi como una casa, casi como casa inversa así. Y vamos a copiar pasta. Vamos a hacer turno, y tengo que rotar hasta que me lo dé la vuelta, y lo voy a poner justo aquí. Entonces ahora como que creó una llave muy arcaica. Podría necesitar seleccionar todo y encogerlo hacia abajo para que no se vea tan estirado de todo lo seleccionado. Y ahí está nuestra llave básica y podemos ajustar esto agregar más grosor a nuestra llave. Y ahora, la herramienta constructor de formas que vamos a conseguir la herramienta de pilar de forma va a cortar esto. Voy a aguantar la opción. Entonces consigo el signo negativo, Saca eso de ahí y mantén presionada Opción Poblala y no voy a aguantar nada . Y aún tengo seleccionada la herramienta constructor de formas. Y voy a unirme a todos estos juntos porque vamos a hacer que sea un derrame cerebral, Así que únete a todo. Yo solo quiero asegurarme de que esos tops e inferiores estén recortados, así que sólo tenemos la llave restante y sigamos adelante y que sea nuestro mismo trazo que hemos estado usando a lo largo de todo nuestro documento. Entonces está nuestra llave lo suficientemente simple, Pero sigamos adelante y angulemos. Esto iba a hacer un turno y hacer un lindo 40. Todo va como que va por ese ángulo de 45 grados y solo quiero hacerlo un poco más grueso. Por lo que tipo de partidos. Ve cómo tiene un espaciado uniforme en la cuadrícula. Entonces hagamos nuestro pequeño destornillador simplificado. Entonces mira una imagen de un destornillador. Tipo de Piensa en lo básico de lo que compone un destornillador. Lo que realmente define un destornillador. Entonces, en primer lugar, tenemos esto realmente largo. Es posible que necesitemos sacarlo del camino para que tú hagas lo mismo y lo diseñaste arriba y abajo. Por lo que tienen esta parte realmente larga, media. Eso es un relleno, y tiene este pequeño punto al final. Entonces eso no es gran cosa, porque sólo podríamos tomar en un punto y sacarlo a la luz. Igual que eso. Podemos incluso dar la vuelta de estos rincones ligeramente y luego también tenemos un mango que tiende a tener siempre tipo de borde redondeado a ella. Y sigamos adelante y saquemos eso un poco más. No queremos que se redondee. Queremos hacer de esto un trazo, así que no es un sólido porque tenemos trazos y casi todo lo que tenemos. Entonces, por lo menos le acaricies una vez en esta imagen, y no creo que vaya a ser tan grueso, y esta es una de esas situaciones en las que vamos a tener que apagar, chasquear a rejilla para obtener el tamaño adecuado para ello. Y queremos volver a encenderlo, Consigue su herramienta pin. Hagamos como un pequeño elemento, porque la mayoría de las llaves que veo tienen algún tipo de color de dos tonos en el mango o algún tipo de diseño en el mango. Entonces eso va a comunicar que son bastante flacos cuando te ves un destornillador. Entonces vamos a unirnos a esto, agruparlo juntos. Nos vamos a asegurar que snap to grid esté encendido para que podamos ponerlo en un ángulo perfecto de 45 grados al otro lado. Por lo que sosteniendo el turno, traerlo, trayendo a este tipo la superposición del dedo del pie y bajémoslo abajo. Y aquí es donde necesito cambiar. El tamaño es un poco porque no quiero que el mango interfiera porque eso parece realmente complicado. Entonces tratemos de hacer que sólo este elemento atraviese. Y eso no es gran cosa, porque puedo desarreglarme y llevar a este tipo un poco más alto y llevarlo a este punto para ver el círculo aquí. Voy a dibujar un círculo o simplemente poner un círculo en mi software de edición de video editado para que puedas ver el círculo que ayuda a definir dónde terminan estos objetos. Entonces tienes el final del punto aquí y el final de la llave inglesa. Es por eso que tener esta pequeña rejilla es realmente agradable de saber, asegúrate de que todo tipo de tiene incluso parpadeos. De acuerdo, así que creo que casi terminamos con ese ícono. Hagamos tipo de icono. Esta va a ser la base de nuestro icono de la aplicación del sistema operativo. Entonces vamos a hacer un icono de Apple Store para una aplicación y se va a ver un poco así. Esta es la inspiración que tuve para esto es muy simple, música simplificada deejay tipo de aburrido. Por lo que tienes diferentes niveles de volumen y algunas perillas diferentes que puedes girar los niveles de volumen que puedes girar. Entonces lo que hice es que estudié diferentes iconos que comunicaban este tema similar. Pero también como que eché un vistazo a las manijas de ciertos instrumentos y equipos D J y voy bien, ¿ qué es el tipo de tema general aquí? Tipo de estos mangos y botones tipo de una combinación de los dos ayudan a comunicar que es algún tipo de música relacionada Icahn, nuestro icono de control de volumen. Por lo que esta debe ser una herramienta de rectángulo relativamente sencilla, redondeada. Y esto es genial porque tiene tres artículos iguales, así que solo puedes duplicarlo. Entonces sigamos adelante y hagamos nuestro primer control de volumen. Tengo la herramienta de pasador solo va a bajar todo el camino, y vamos a hacer nuestro mismo grosor que hemos estado haciendo. Y sólo vamos a dibujar nuestro poco esto podría hacer un rectángulo redondeado y hacer nuestro botón de control de volumen . Y también queremos asegurarnos de que nos hemos roto. Acordado por ahora mismo, Hacer que me sienta hacer eso un poco más grueso. Por lo que se parece más a un control de servicio pesado, como en hacer una forma de píldora. Y hagámoslo un poco más corto. Entonces solo estamos bloqueando las cosas. Y lo que es genial de este es que solo puedo duplicarlo dos veces. Observe cómo estoy haciendo el mismo espaciado, tener una barra aquí barra, y luego dos espacios entre esos podríamos tener diferentes niveles de volumen, por lo que demuestra que se puede controlar esto. No son botones estáticos tienen algún tipo diferente de relaciones de espaciado entre todo . Y tal vez necesitemos mover esto hacia arriba más allá de ese pequeño punto cuadrado para que podamos tener espacio para poner los controles. Esta será una caja sencilla, por lo que estaremos hasta el margen ahí. Tenemos tres aquí. A ver si podría hacer tres. ¿ Están dos aquí? Sí, tal vez tenga que mencionarlo, porque a veces un derrame cerebral traerá la distancia un poco diferente. Entonces hagamos las herramientas de Ellipse. Haz tres botones diferentes. Todo esto es bastante sencillo en este punto, y ahí están los mismos fundamentos de ello, por lo que podemos especie de cambiar lo suave para ver cuando alejamos el zoom. ¿ Cómo se ve? Tipo de icono cr establecido lentamente en desarrollo. Cuando te acercas, como que pierdes la perspectiva. Como que piensas que es torpe y grueso, y no se ve muy bien. Pero cuando vuelves a los niveles de que la gente realmente va a verlos, empiezan a parecer más realistas y empiezan a verse un poco más limpios y mejores. No tienen esos trazos de tronco grueso e, así que por favor haga una prueba de visibilidad y aleje sus iconos se sentirá mucho mejor ellos una vez que ponga cierta distancia entre usted y los iconos. Y así con esto, ahora que lo estoy viendo a distancia, contrario veo un poco más de margen alrededor de cada ícono, así que solo quiero agregar un poco aquí. Entonces tal vez haga clic hacia abajo una vez que esté sosteniendo todo y lo demás, manteniendo pulsado el botón de cambio y está haciendo clic hacia abajo una vez perfecto. 41. Proyecto de diseño conjunto con íconos: 5: burbuja de comunicación, así que eso va a ser sencillo. Es si no podemos llenar esto juntos, y sólo vamos a necesitar crear este tipo de burbuja que baja sólo mirando. Entonces lo que voy a hacer aquí es que sólo voy a ir a towpath. Estoy delineando el esbozo del trazo porque quiero poder deshacerme de esta sección aquí por lo que podría necesitar incluso dibujar, apagar el snap a rejilla. Y yo solo soy solo quiero rápidamente tipo de carrera de esta porción Es crear cualquier forma coloreada, seleccionando todo consiguiendo nuestra forma, herramienta constructor. A mí me dieron un puñetazo todo eso. Y yo también quisiera unirme a estos juntos. Por lo que sólo uniendo a esos juntos como una sola unidad. Y por supuesto, necesitamos del por qué adaptó el morado. Es conseguir eso. Entonces eso ahora es llenar. Por lo que sólo hay que tener eso en cuenta. Pero ese es el mismo golpe que vamos a necesitar. Y luego hagamos las tres burbujas porque eso indica conversación. No tenía policía. El pequeño ordenar tres círculos. Creo que lo pierde un poco. De qué iss Así que buscando espaciado similar y tratando de conseguir el tamaño adecuado aquí para un poco de burbujas de conversación, que uno fuera lo suficientemente simple. Sólo nos quedan cuatro más para ir. Tenemos esta pequeña copa definida, su top creador de la lupa. Por lo que me gusta mirar fotos de lupas. Incluso hice una clase donde paso por el diseño de iconos, y esto es Hicimos una versión más elaborada donde teníamos muchos detalles al mango. Pero en este caso, tenemos que simplificarlo para que coincida con su conjunto de iconos. Por lo que necesitamos simplificar un mango de lupa, incluso Mawr. Entonces al estudiar mangos, me estoy dando cuenta de un tema donde tenía este pequeño círculo más pequeño casi sobre el tallo. Y luego tienes una especie de rectángulo más largo para la base. Entonces creo que es este pequeño detalle. No es un detalle muy complicado, este pequeño de aquí, pero creo que como que se ve un poco más pulido que solo una recta, ya sabes, sabes, porque eso podría ser algo con lo que vuelas burbujas o algo. Y agregando ese pequeño detalle hace que se vea un poco más como una lupa, y podemos seguir adelante y seleccionar todo esto y mantener pulsado el turno, girarlo 45 grados y usó las esquinas del tamaño para nosotros. Ahí vamos. Suficientemente simple en una casa. Entonces esto es vamos a usar la herramienta constructor de formas para construir una casita. Entonces vamos a conseguir una herramienta de rectángulo y solo estamos haciendo formas sólidas o básicamente construyendo la casa primero con un Phil sólido. Entonces esto es lo que quiero hacer. Nosotros queremos hacerlo. Ah, una bonita puerta aquí, lo suficientemente grande donde podemos ver como que es la puerta. Hagamos un color blanco para que podamos ver qué está pasando. Hazlo buen grosor y vamos a hacer nuestra forma. Herramienta más antigua. Juntemos estas formas primero y luego mantengamos pulsada Opción o probablemente seleccionaría la puerta ahora y mantén pulsada la opción. Vamos a darle un puñetazo a eso. Y entonces esto es lo genial de tener esa herramienta de selección directa de poder dar la vuelta a la esquina. Entonces tengo seleccionada mi herramienta de selección directa que va a tirar hacia abajo en esto y redondear todas las esquinas al mismo tiempo para agregar ese pequeño efecto redondeado y vamos a querer hacer un trazo. Dos. Entonces adaptemos o acariciemos eso. Tenemos justo aquí y hay un icono de casita. Podríamos hacer el techo un poco más grande. Podemos asegurarnos de que esté un poco incluso en la cuadrícula, para que no parezca demasiado pesado de fondo. Ya veremos si no podemos hacer que se adapte a esa plaza de ahí mismo. Perfecto. Entonces se está adaptando a esa plaza. Por lo que ahí está nuestro icono de la Casa. Esta es algo así como una situación de tipo avión de papel. Entonces vamos a ver si puedo incluso simplemente hacer esto en la esquina justo fuera del bate, porque parece que solo va a ser triángulos demasiado simples y creó eso con bastante rapidez . Sólo asegúrate de que esté un poco alineado en esta rejilla, come mejor. Y creo que este click se destaca un poco más, y éste definitivamente pudo haber sido uno donde probablemente debería haberlo hecho recto para poder asegurarme de mis triángulos o incluso y luego girarlo. Pero lo que sea que queramos hacer, estoy tratando de trabajar a través de estos rápidamente. De acuerdo, entonces este de ahí es éste va a ser un poco de truco. Entonces este es tu ícono y poner en un mapa para indicar un lugar en el mapa. Esto es lo que tengo que hacer con este. Voy a dibujar círculo simple y vamos a conseguir la herramienta de curvatura. Simplemente voy a seleccionar este punto inferior y tirarlo hacia abajo. Cuando haces doble clic usando la herramienta de curvatura, puedes cambiarla de vuelta a una esquina afilada. Y yo solo tengo las herramientas de curvatura que solo estoy ojeando entre estos dos. Eso es exactamente lo que voy a hacer aquí para darle un punto afilado. Y luego voy a tomarlo y especie de suavizar un poco más el círculo, agregando dos puntos aquí solo para que sea más un círculo redondo. Al igual que eso, creamos ese ícono. Y vamos a asegurarnos de que lo hagamos tal vez un poco más grande, tener un margen similar en la parte superior de la parte inferior. Y luego hacemos nuestro pequeño círculo por dentro y ahí está nuestro pequeño ícono y creo que tenemos uno más. ¿ Es éste el último? De acuerdo, de acuerdo, así que éste es agradable y sencillo. Esto es sólo un navegador. Y así al mirar navegadores. Sé que estoy en un Mac, así que se ve un poco diferente, pero sentí que estos tres pequeños íconos realmente ayudaron a mostrar cómo es un navegador típico. Tienes algunas opciones en la parte superior del puerto, y esto es una descarga desde el botón o icono del navegador, por lo que la descarga está asociada a flechas. Entonces es por eso que como que incluí las flechas ahí dentro también. Dibujemos una bonita ventana grande del navegador. Tráelo abajo. Por lo que estos dos descansan en esa línea de rejilla ahí mismo. Y vamos a asegurarnos de que tenemos el grosor correcto y trazar una línea a través. Espero que esto no sea exagerado para ti, pero pensé que preferiría tener demasiada instrucción sobre esto que no suficiente. Sé que estamos haciendo mucho aquí, así que ahí está. Por lo que ahora necesitamos hacer nuestros tres círculos que podrían llenar. Esta podría ser una de esas situaciones de despegue de la cuadrícula para que podamos alinearnos. Ahí hay mejor. 12 tres lo vuelven a encender y luego una flecha para que esto se construya igual que hicimos la herramienta Builder de forma de casa unió a los juntos, y luego podemos obtener nuestra herramienta de selección directa esquinas redondeadas. Si queremos que sea un derrame cerebral o no. Y hay o ventana del navegador, vamos a apagar todo para ver cómo se ve todo. Y déjame asegurarme de que eso es un poco más pequeño, porque eso es un poco más grande en comparación con los otros iconos cuando asegúrate de que todos los iconos son consistentes con el margen y el borde, por lo que todos podrían parecer que son el mismo conjunto. Así que solo haciendo pequeños ajustes a cualquier cosa que vea que pueda necesitar hacerse más pequeño o más grande, solo para asegurarse de que todos tengan espaciado consistente tirado. Entonces ahí está. Acabamos de hacer todo eso juntos. Probablemente lo que en aproximadamente una hora más o menos, tenemos un conjunto completo de iconos. Lo que vamos a cubrir es un par de cosas más. En primer lugar, queremos presentar estos de una manera agradable, y también queremos exportar thes como un par de versiones diferentes. No sería capaz de exportar el 16 por 16 que queremos ser también para hacer todos estos tamaños diferentes , exportándolo todo el camino hasta 100 28 o 256 por 256 y Hay una manera realmente rápida, barata de hacer esa muy buena manera de hacer eso Adobe ilustrador, y lo cubriremos a continuación. 42. Proyecto de diseño conjunto con íconos: 6: antes de llegar a la parte divertida y poner a Grady INTs y realmente presentar esto de una manera realmente estilística. Lo que vamos a hacer es exportar los iconos básicos. Por supuesto, puedes agregar un dedo del pie de color diferente todo esto realmente rápidamente, Así que sigamos adelante y vamos a nuestras capas. Y tenemos la grilla. Esta parte Talbot off. Sigamos adelante y toggle offer grid command quotation. Entonces ahora estamos viendo todos nuestros iconos crudos, y ahora nos quedamos con lo que estamos haciendo, y podemos cambiar los colores en todos estos. Por lo que algunos de estos aires llenan algunos de estos golpes de aire. Entonces si te sientes feliz con esto, adelante y guarda este documento ilustrador. Este será tu documento original, así que guárdalo porque va a mantener intactos todos los trazos. Esto es solo Si quieres cambiar el color antes de exportar, vamos a subirte a la ruta del objeto. Adelante, delineemos el trazo porque queremos poder cambiar todo crear un relleno básicamente para todos esos trazos para que pudiéramos cambiar y manipular fácilmente el color. Entonces cambiemos el color en todos estos podemos darle una bofetada a una herramienta radiante de guitarra realmente genial, radiante de guitarra realmente genial, radiante. Y digamos que subimos a nuestras muestreas y seleccionamos un int Grady realmente cool. Estaba haciendo un poco de púrpura a azul, radiante, radiante, y puedo llevarme a Argh! Herramienta radiante. O mejor aún, sólo vamos a unirlos con forma, Builder Tool. Podría convertirse en parte de eso. De acuerdo, así que intentemos eso otra vez. Tan sólo tenía que arreglar a ese pequeñito aquí, seleccionarlo a todos conseguir nuestra herramienta radiante. Hagámoslo Podríamos hacer una radio. Podríamos hacer un lineal, radiante, solo tipo de tirarlo. Entonces tenemos todo eliminado, pero nuestros iconos básicos y estamos listos para exportar esto. Por lo que hay algo llamado exportación de activos y podrías encontrar eso en tu panel de ventana. Va a estar justo aquí abajo. Exportación de activos. Tan solo asegúrate de que esa ventana esté abierta. No me uso esto antes en una clase on. Solo quiero asegurarnos de que repasemos esto lentamente, así que te va a dar muchas opciones diferentes para exportar, por lo que va a exportar cada uno de estos artículos. Entonces lo que necesitamos hacer es arrastrar estos al panel de exportación. Entonces digamos que queremos arrastrar nuestro pequeño icono sobre debilitar, traerlo aquí, arrastrarlo hasta aquí. Va a crear un activo. Pero te das cuenta de que creó dos activos diferentes. Nosotros queremos unirlos. Entonces lo que vas a necesitar hacer es solo hacer clic derecho y agrupar todos estos o usar el atajo de teclado y agrupar todos estos juntos. Por lo que cuando lo arrastras, se crean como un solo elemento. Entonces solo voy a pasar, sólo asegúrate de que estos aire todos agrupados podría seleccionarlos todos, arrastrarlos sobre y a nuestras exportaciones. Asegúrate de que eso se elimine, y crearán iconos para los 16. Son 16 activos diferentes aquí mismo que podemos exportar. Entonces lo que es genial de esta exportación de activos va a hacer cada una y todas estas formas diferentes tenemos escalas diferentes, así que la escala una X va a ser de 32 por 32 píxeles porque así de grande creé esta plantilla. Los cuadrados de plantilla eran de 32 por 32 píxeles de tamaño. Entonces eso es lo mucho que va a exportar ese ícono. Entonces vamos a hacer Eso va a ser una vez aquí una vez. Y vamos a hacer esto como p y G's porque queremos tener ese fondo transparente. Entonces todos estos van a ser P y G. Lo que es genial de esto es que tenemos un 32 por 32 pero digamos que queremos tener un 64 por 64. Todo lo que tenemos que hacer es hacerlo dos x, que es el doble de su tamaño base o tamaños de base. 32 2 X sería 64 tres x sería 128 y así sucesivamente. Podría hacer un cuatro x cinco X Si quieres conseguir estos todo el camino hasta 512 que algunos Mis conceptos, ya sabes, hacen eso. Así que sólo tipo de hacer los tamaños básicos. Puedes ir más pequeño. Por lo que hay un 16 por 16 y así eso sería de media talla. Por lo que la mitad de la que sería nuestro tamaño base, que es 32 por 3er 2 será 16 por 16. Entonces sólo haciendo una especie de uno a tres y un 30.5 Y si quiero agregar uno que sea click , agréguelo y vamos a hacer esto cuatro veces, así que serán cuatro veces son tamaño basado. Por lo que cuatro veces 32 128 en realidad ser 256. Entonces eso sería bueno. Danos 256 pixel por 256 pixel icon y también estoy incluyendo se llamó SPG. SPG es sinónimo de gráfico vectorial escalable. Entonces esta es la nueva forma de trabajar tipo con iconos y navegadores porque lo bueno esto es que lo mantiene en vector. Entonces en lugar de exportar como PNG, que es solo una imagen, es una imagen ráster que puede comer en píxeles. Cuando trabajas con él, un SPG puedes usar un icono y un navegador en un conserva sus cualidades factoriales para que puedas animarlo. Puedes usarlo mucho, Ah, Ah, al hacer trabajo web, y básicamente es un bloque de código XML, que realmente no necesitas saber demasiado sobre eso. Pero solo sepan que esto es una especie de ah, formato que a la gente realmente, realmente les encanta ver descubrir el futuro de iconos formatos a la gente si de verdad quieres ver un SPG. Entonces cuando haga clic en este, va a exportar todos estos 16 iconos como S. P. G, y también va a hacer todos mis P y G. Así es hacer click en exportar y ver qué pasa. Entonces así es como se ve. Me ha dado varias carpetas diferentes, Así que este es el tamaño más pequeño de 16 por 16 píxeles. Como se puede ver wowser, eso es diminuto. Pero ahora ves por qué necesitamos simplificar nuestros iconos tanto como sea posible porque mira este formato muy pequeño y el sí, hay momentos en los que necesitas un estado de 16 por seis. También tenemos nuestro más grande, que es cuatro X por lo 256 por 256. Y así es como se va a ver en mi pantalla a ese tamaño en particular. Se puede ver lo pequeños que son estos, y ese es en realidad uno de los más grandes y luego formato de vector svg. Podrías arrastrar estos a ilustrador, y son vectoriales para que no sea una imagen. Todavía tengo control sobre el derrame cerebral. Es realmente impresionante tener ese entorno vectorial incluso puedes arrastrar estos dentro de Adobe X D , que es un programa de diseño Web. Puedes traer uno de estos S P G, y va a poder ser manipulado y ser vector. Entonces si hago zoom en esto, se podría ver cómo tengo control sobre todo. Tan solo un grupo lo. Yo estoy en Adobe X'd. Vamos a estar en este programa un poco más tarde. Por lo que ahí lo tienes. Somos capaces de crear los 16 iconos bastante rápidamente fueron capaces de exportarlos y todos los formatos que la mayoría de la gente necesita para diseños de iconos, incluyendo el formato Vector escalable, o SPG. Y por último, pongamos un poco de pulido a nuestros iconos. Queremos poder presentar nuestros iconos de una manera divertida en nuestro portafolio, a nuestros clientes y a nuestros amigos y colegas. Por lo que vamos a añadir un poco de ponche de color y añadir un poco de fondo radiante 43. Proyecto de diseño del conjunto del icono: agrega color: añadir un poco de pizazz a nuestra presentación. Voy a abrir un nuevo documento, y voy a hacer esto un poco más grande. Sólo hagámoslo 1920 por 10. 80 que es tu típico tamaño Web manteniendo todo un modo RGB, simplemente haciendo un documento más grande para que podamos exportar esto como un tamaño de resolución mayor. Entonces una cosa que quiero hacer es añadir un fondo de ingrediente realmente divertido y un cuadrado demasiado fuerte, lo que es un relleno. Y lo que voy a hacer es ir a la nueva herramienta aquí, que es el Caridi int freeform Grady en. Y se podría hacer lo mismo con las mallas radiantes de mensajes, que está justo aquí. Esa es la herramienta más antigua. Esta es una herramienta un poco más nueva para justo aquí en tu panel radiante, y voy a dar clic en forma libre Grady en. Va a crear diferentes puntos de luz para mí, y sólo voy a hacer clic y averiguar lo que creo que sería una especie de combinación ordenada . Entonces voy a hacer un poco de colores fríos. Hagamos que aparezca un color oscuro, oscuro, fresco y hagamos algo así de tonos cálidos por aquí, así que tengo este color cálido y fresco mezclándose. Hagamos un poco más de naranja de este lado. Yo estaba tratando de hacer un moderno color Grady int, y tengo uno que ya he creado aquí mismo, y voy a poder darte esto es una descarga para que solo puedas poner este fondo justo ahí si no tienes el herramienta de nivelación de forma libre, si solo quieres tener un fondo realmente fresco, radiante para usar, así que seguiré adelante y te proporcionaré este para ti. Y sigamos adelante y hagamos un poco menos nuestro tablero de arte. Es un poco, Ah, horizontal. Entonces sólo estoy un poco tomada. El instrumento de tablero de arte ha traído el granulado que creé antes. A mí me gusta el pequeño pop brillante un poco mejor, pero sólo quiero mostrarte como funcionó eso. Entonces bloqueemos esta capa y hagamos una nueva capa para poner sus iconos en la parte superior. Entonces volvamos a sus iconos. Aquí hay por todos los iconos y vamos a traerlo. Y ya que tenemos camino de escala en. En nuestra selección general, tenemos esquinas de escala y trazos y efectos de escala. Cuando hago esto más grande, todo debe mantenerse intacto y verse genial. Entonces voy a poner mucho margen aquí para que realmente pueda lucir el fondo así como así . Por lo que tenemos trazos y rellenos representados aquí. Entonces si yo sólo cambiara el camino o el trazo, sólo cambiaría algunos de los elementos. Entonces lo que vamos a tener que hacer es que vamos a tener que hacer algunas cosas. Adelante y vayamos a escribir y bajamos a crear contornos y eso creará contornos en ese pequeño signo de dólar y luego vamos a ir al camino. Ahí va a delinear el trazo. Estamos delineando el trazo, estos iconos finales de aire y vamos a seguir adelante y hacer un blanco Va a hacer que el relleno sea blanco. Entonces todo este aire lleno ahora están todos blancos y podemos agregar un poco de un dedo del pie de sombra gota , Adol Pops, vamos a seleccionar todo. Vamos a añadir una ligera sombra de gota y no queremos que sean demasiado fuertes. Por lo que queremos tener una opacidad muy ligera. Entonces intentemos 22. Vamos incluso a probar 11. Tan solo un poco de sombra de gota para darles algo de profundidad. Y yo solo tengo un poco de desenfoque en un poco de un offset que solo agrega un poco de pop de color ahí. Y también puedes hacer Grady Inst a estos también. Entonces sigamos adelante y quitemos la sombra de gota y pongamos esos. Simplemente haz de esto un desbloquear este. Vamos a hacer esto un negro, tal vez que sea un ligero gris claro y voy a añadir un poco codicioso int todos estos. Entonces voy a agrupar estos juntos es un objeto, y voy a ir a buscar mi herramienta Grady int son una muestra Grady int. ¿ Cuál es este pick one por defecto? Señora Escogió este negro por Grey, y cambiémoslos. Hagámoslo un color realmente brillante, vívido. Hagamos como un verde a un azul verde a un azul y tal vez ajustemos eso para que no sea tan vívido. Verde y un poco de naranja a ella. Llévala a Grady una herramienta. Podríamos cambiar el ángulo en esto como un 45 grados que tipo de va en diagonal a través, y hay una especie de forma de abofetear en un tipo realmente ordenado de transición de color en sus iconos. Por lo que muchas formas diferentes podemos presentar nuestros iconos y añadirles color. Podemos agregar color a estos y exportarlos de la misma manera que hicimos la exportación de activos s antes no recortar para exportar iconos grises negros lisos. Podemos agregar color a estos y exportarlos de la misma manera exacta. Por lo que ojalá hayan disfrutado de esta sección. Yo quería realmente pasar un buen rato en la creación de iconos porque creo que es algo que es una herramienta que realmente va a ser necesaria, algo que los diseñadores gráficos realmente podrían tener la tarea de hacer o tener trabajo con los clientes. Y cuando empecemos a pensar en el desarrollo Web y el diseño de APP, realmente va a ser útil poder hacer tus propios iconos. Sus iconos podrían ser caros de comprar. Podrían ser difíciles de igualar tu estilo de la página web. Por lo que poder personalizar y crear tu propio conjunto de iconos para el uso de ah sitio web o una aplicación móvil es tan crucial 44. ¡BONUS probaciones de usuarios con 5 años de edad!: Entonces cuando señalo una Nikon, quiero que me digas lo que crees que significa. ¿ De acuerdo? Al igual que lo que es y lo que crees que te está diciendo a dio. Está bien. ¿ Qué es eso? 1er 1 Eso significa Wow. ¿ Qué crees que sea? ¿ Masculino? Varonil. De acuerdo, ¿ entonces crees que ya es un sobre? Está bien. ¿ Qué crees que es un auto de pintura? Está bien. ¿ Qué crees que uno es un bando? Está bien. ¿ Qué opinas? Ese es un cuadro de montañas al sol, así que fotografía es. ¿ Pensarías que clase IHS oclock Lo sabías de inmediato en casa? Porque ¿cómo sabías que era un reloj? Porque tenía un círculo. Y yo Te re visto números en ella. Pero, ¿qué? Esas líneas dentro del círculo que me ayudaron a saber que es un reloj. Sí. Sí. OK. ¿ Y ese que es mediodía en estrellas y para que duermas? ¿ Cuál es esa? A diferencia de tu teléfono, sabías que era así que ¿cómo sabías que era un micrófono? Porque tengo porque como ver en plática que se puede decir cosas, tener el canto como puede soportar. El superior tiene un soporte. Está bien. ¿ Qué crees que esa unidad que sería esa es Can te puede gustar una lata de refresco. ¿ Sabes cómo se ve una batería? Sí. ¿ Crees que parece una batería con el Sí, es una mala Tal vez podríamos trabajar en esa. ¿ Qué crees que sea esa? Pero eso al hacer clic en él en un juego va derecho al juego, derecho a trabajar u óvalo en el costado. ¿ Qué queda dice jugar? Sí. Está bien. Entonces, ¿qué opinas? Ese está abajo la tarjeta y así una vez dársela a alguien que quiera que les dé dinero en U quiere dar dinero. El pueblo tenía. Y él le está dando eso porque porque él quiere todavía por Okay. ¿ Qué, como los trabajos? De acuerdo, ¿qué opinas? Esa unicidad. Ahí es donde se hace clic en él. Tengo razón en que quieres que se vaya? Está bien. Está bien. Entonces es un botón de reproducción de video. ¿ Qué opinas que IHS que es un clip de cinta? Clip de papel. Está bien. ¿ Cuál es éste? Esa son herramientas. Herramientas. De acuerdo, entonces, como ajustes o herramientas. ¿ Qué opinas? ¿ Esa unicidad? Ah, lo empujas hacia abajo y el sonido de más bajo lo empujas hacia fuera. El sonido es alto. Yo era como el control de volumen. Sí. Está bien. ¿ Cuál es éste? Eso significaría juego consciente Dio sus vendidos. ¿ Quién? ¿ Quién tiene? Eso no significa algo. ¿ Qué significa? ¿ Qué opinas de mí? Y eso significa que tengo que tienen una pregunta. Tengo una pregunta. Está bien. ¿ Qué opinas? Esa unicidad. Um, encuentro gas. Sí. Maga, signo vidrio. Ah, tiene casa. ¿ Qué crees que significa la casa cuando estás en un juego o algo así? ¿ Qué significa la casa? La casa significa que son niños, así que no puedes jugar ese juego. ¿ De acuerdo? Está bien. ¿ Qué opinas? Ese IHS ¿Qué? ¿ Por qué? Llegaste tú. Entonces al estar en un trozo de pintura, tú haces eso, que lo vuelas y se va un poco de dinero. ¿ Cómo es así? Al igual que un avión de papel. Está bien. ¿ Qué significa esto? ¿ Qué opinas? Ese IHS. ¿ Qué aspecto tiene? Parece una gota de lluvia al revés nuestra gota de lluvia al revés. Está bien. Para qué crees que se utiliza cuando lo ves. ¿ Alguna vez has visto eso antes? No en un mapa. ¿ Ahora? No. Está bien. ¿ Qué crees que esto significa cuando haces clic en él? Es en Desde que escribes esto algo que tienes que hacer. Bueno, impresionante. Muchas gracias por contarme cómo te sientes acerca de estos iconos. Y eso me ayuda a entender cómo la gente ve los iconos simplificados, pero aún así puede reconocer los íconos mismos. Entonces gracias, Liam. Sí, cinco. 45. Ícono de App Store - Introducción: Por lo que para esta sección de la clase, vamos a desarrollar desde cero un icono de la tienda de aplicaciones de Apple para una aplicación de iPhone. Entonces vamos a tomar el ícono que hicimos anteriormente que fue despojado y sencillo. Nos vamos a llevar esto para hacerlo para ocho aplicaciones D j. Por lo que esta manzana produjo sonidos de deejay. Se puede mezclar música, todo tipo de cosas. Va a ser una aplicación basada en música. Entonces pensé que tomaríamos esta versión muy, muy simplificada y haríamos una versión muy pulida, gama alta porque ellos con la Apple App store y también APS en tu iPhone y tu iPad, te darás cuenta de que tienes mucho más capacidad de agregar efectos y colores para realmente captar la atención del usuario y para conseguir que descarguen tu app. Podría ser un poco más grande, un poco más elaborado resplandor usado, colores, todo tipo de cosas. Entonces vamos a crear un icono mucho más detallado desde un punto de vista gráfico. Entonces aquí está la plantilla que puedes descargar que creó para vosotros chicos para que este proceso sea un poco más fácil. Hay varios tamaños diferentes en los que debes pensar cuando estás desarrollando un icono de APP , y necesitas tener esta versión grande y gigantesca para que la tienda de APP muestre tu aplicación en un tamaño más grande. Pero también tienes los tamaños más pequeños que debes tener en cuenta para el ícono real de la aplicación. Podría arrestar en el escritorio de tu iPhone, así que hay unos pequeños íconos que ves. Ah, una es para la pantalla retina, que será de 1 80 por 1 80 Y luego tienes un par de tamaños diferentes, dependiendo de qué teléfono estén usando, porque hay más de un solo iPhone. Entonces vamos a estar haciendo todos estos tamaños, pero vamos a empezar con el más grande y trabajar nuestro camino hasta el más pequeño. Entonces una cosa de la que quería hablar es una especie de cómo se muestra tu app en la tienda APP y cómo realmente es importante poder conseguir que la gente descargue tu app y los atraiga para que un vistazo. Por lo que te darás cuenta. La mayoría de estas son formas geométricas básicas, pero muchas veces verán APS de aspecto más elaborado, brillante también, por lo que puedes especie de que es genial tipo de salto alto en la tienda APP y tipo de echar un vistazo a lo que es popular. Echa un vistazo a los colores que se están utilizando. Notarás mucha variedad de colores brillantes y vívidos. Notarás cada vez más detalles con facilidad, en comparación con solo tu conjunto de iconos regular que hicimos antes. Estos son mucho más elaborados, así que sigamos adelante y vamos a mirar y con más detalle algunos de estos APS y cómo son efectivos. Así que mira este Grady int uno justo aquí. Por lo que ves, tiene sus ingredientes de superposición. Es muy sencillo, pero con la calificación y realmente tipo de me seduce a hacer clic en ella también. Y de una cosa que debemos tener en cuenta es que no estás seguro si alguien va a estar en modo oscuro o no. Y este es el modo oscuro donde todo tiene un fondo negro, muy popular hasta tarde. Pero algunas personas no tienen su modo oscuro encendido, y tienen un fondo blanco, por lo que tu APP necesita verse bien sobre un fondo oscuro, un fondo blanco. También hay que pensar en el fondo de pantalla de los usuarios también. Podrán tener un fondo muy brillante, vívido. ¿ Cómo destaca tu app entre un mar de muchos fondos de pantalla diferentes? Ahí es cuando llegaremos a las pruebas al final del diseño, y echaremos un vistazo y veremos cómo se ve en todo tipo de fondos para asegurarnos de que Apple que destacar en todos los entornos. Entonces solo algunas cosas en las que pensar cuando estás buscando crear tu diseño. Entonces hablemos de esta plantilla. Tengo un par de capas diferentes en esta plantilla que te va a ayudar a guiarte a través de este proceso. Tengo esta capa llamada info, y podría ser capaz de hablar todo eso a menudo en. Simplemente tipo de muestra los tamaños de cada tablero de corazón también tienen este recorte causa lo que va a pasar es que vamos a diseñar todo el camino hasta el punto del icono de la APP, y apple le agregará automáticamente la curva, por lo que no necesitas para agregar esa curva a tu diseño final. Vas a exportarlo todo el camino hasta el borde. Por lo que esta es una gran manera de especie de recorte de prueba, que hará un poco más adelante en el curso, y esta también es la cuadrícula. Entonces solo estoy hablando de unos cuantos estos fuera. Entonces esta es tu capa de cuadrícula. Esta es esa cuadrícula de proporción dorada que solíamos hacer son diseño de iconos más pequeños. Vamos a aplicar la misma cuadrícula a este icono de la tienda de aplicaciones más grande. Entonces lo que queremos hacer para platicar a lo largo de esta otra capa de iconos de aplicación, esta es la final con la que vamos a terminar en la parte inferior. Y decidí incluirlo para que puedas ver todas las diferentes capas que usé para crearlo. Vamos a recrear esto juntos, y va a estar inspirado en este ícono muy sencillo, plano, plano, básico. Entonces tenemos una idea de lo que vamos a estar haciendo. Estaremos haciendo los tres que vamos a hacer que tipo de ingrediente de oro también estaban usando alto contraste. Por lo que tenemos este oro encima de este color realmente oscuro, negro profundo, y tenemos un montón de luces y sombras y reflejos y profundidad a esto que es muy diferente al conjunto de iconos que acabamos de completar. Y eso es a propósito, porque quería hacer uno muy detallado y todo ya que acabamos de pasar mucho tiempo haciendo muy sencillos. Vamos a practicar agregando muchos pequeños detalles aquí y también texturas. Se nota un poco de textura en el fondo. Realmente ayuda a hacerla estallar. Entonces empecemos primero con una de hagamos una de nuestras palancas de palanca aquí y luego vamos a hacer algunas de las perillas. Aquí vamos a hacer nuestras palancas de volumen o control. Entonces va a hacer algunas formas básicas y no voy a usar la cuadrícula para ahora mismo. Vamos a hacer eso cuando realmente nos metamos en el dimensionamiento. Entonces hagamos una herramienta de rectángulo redondeado. Crea eso. Hagámoslo una buena forma de píldora. Y lo que queremos hacer es escoger un oro radiante realmente bonito, y no voy a hacer que creas uno desde cero o descargues uno. Voy a ver si no podemos salirnos con la suya con el paquete radiante predeterminado que viene con Adobe Illustrator. Vamos a ir a nuestro panel de Swatch y ver qué tenemos aquí. Podemos cargar muestras adicionales bajando a tu biblioteca bajando a Grady INTs y hay una llamada medallas y vamos a tratar de escoger solo de estas. Por supuesto, podemos personalizarlo un poco. Entonces aquí está nuestro metal. Grady INTs. A ver si no podemos encontrar un metal radiante realmente bueno. Queremos crear tipo de ese efecto barra de oro. Vamos a dar click a éste aquí mismo. Se llama El Latón Pulido, y lo que vamos a hacer es que vamos a conseguir una herramienta radiante y hagamos un radiante hacia abajo. Creo que vamos a ir con la radio radiante. Entonces va a ser un radial de latón, y solo vamos a seguir adelante y crear una radio radiante, y queremos crear una sensación de reflejos. Entonces por eso elegimos como su radio porque parece que viene una luz. La fuente de luz está bajando e irradiando y creando sombras. Entonces hagámoslo un poco más de un botón complicado. Vamos a duplicar esto, y sólo vamos a dibujar una caja, sólo se cortaron en este sombrero y medio. Entonces la forma más fácil de hacer eso es hacer este diferentes colores y puedo ver lo que estoy haciendo es usar la forma, herramienta pilar y simplemente salir de esa capa superior. Entonces ahora nos quedamos con el fondo Podría deslizarse eso hacia arriba. Y así es como vamos a poder agregar un poco de dimensión a nuestro botón. Entonces vamos a tomar la misma radio Grady int que tenemos, y no podemos ver si podemos conseguir algunos colores oscuros que empiecen aquí. Es posible que tengas que ir por el camino opuesto así como así, para agregar una sensación de profundidad con nuestro botón. Entonces, ya sabes, ¿tiene un poquito de destellos aquí? Pero llega a ser mucho más oscuro que el de arriba. Está creando lo que parece una capa texturizada. Entonces hagamos lo mismo con un objeto alargado. Aquí, la porción del deslizador obtiene el rectángulo redondeado. Siempre podemos conseguir que el dimensionamiento se haga más tarde. O hagámoslo una pastilla, aumentando mis esquinas para que sea un relleno. Envíalo a la parte de atrás, arregla el pecado a espaldas. Vamos a hacer lo mismo y tomar una herramienta Grady int. Y hagámoslo irradiar desde el centro. Y siempre podemos ir a nuestros escenarios y Argh! Radiante! Es bueno y haga clic hacia abajo, romper ingrediente y realmente afinó esto. Podríamos hacer de ella una transición más apretada. Hagamos nuestro radiante radial justo aquí. Por lo que ahora parece que la fuente de luz viene por aquí. Entonces lo que queremos hacer es añadir más profundidad a esto. Entonces ahora mismo sabemos que queremos poner esto sobre un fondo negro. Así que sigamos adelante y creemos un fondo negro negro trasero. Podemos ver cómo se ve algo de esto. Estaba haciendo una oscura Vamos a hacer como un poco de una oscura, totalmente oscura, pero una luz, gris oscuro y vamos a tener Esta es una capa separada. Entonces vamos a cortarlo y pegarlo en una nueva capa y ponerlo en el fondo. Esto sólo nos ayudará a ver cómo se va a quedar con el oro. Entonces, bloqueemos esa capa y volvamos a esta capa. Ya veremos cómo se ve eso. Podemos agregar aún más profundidad y dimensión. Solo estoy encogiendo un poco ese botón porque tenemos que encajar tres de esos diales aquí. Entonces vamos a esto lo que podemos hacer de nuevo. Podemos agregar otra capa de profundidad a esto. Por lo que tenemos especie de algunas formas planas simples. Añadamos otra capa en el exterior y le agreguemos ingrediente para que parezca que tiene esta sensación metálica de tres D. Ruta de objeto. Y vamos a compensar el camino para que esto pudiera compensar el camino y vamos a seguir adelante y click en previsualizaciones. Vamos a ver cómo tipo de compagina el camino. Toma la misma forma y la aumenta. También puedes disminuirlo haciendo un signo de resta, y él también lo puede disminuir. Entonces lo vamos a aumentar. No hagamos un signo negativo y sólo vamos a hacer un poquito. Esto es realmente solo agregar un poco de golpe a su alrededor. Entonces intentemos e intentemos duplicar eso porque creo que necesita ser un poco más grueso. Y así que ahora mismo tiene el mismo Grady y aplicado, así que no lo puedes ver. Pero y si fuéramos por la otra dirección con su int Grady y así notamos cómo es una especie de creación de una sensación de profundidad y pudiéramos hacer lo mismo con nuestra forma de píldora a un camino desplazamiento por la misma cantidad. Tal vez incluso hacerlo más pequeño, tal vez tres. Y esto hace lo contrario, radiante. Entonces si va a bajar, intentemos subir. Entonces note cómo eso es agregar un poco de profundidad y forma a eso. 46. Ícono de la App Store - efectos de barras doradas: Entonces una cosa para realmente aumentar el nous realista de esto es agregar un poco de sombra aquí abajo porque este botón naturalmente va a estar arrojando una sombra hacia abajo. Vamos a añadir un poco de botón escucha, asegúrate de chasquear una cuadrícula y chasquear. Dos píxeles están apagados. No queremos tener nada de eso. Estamos haciendo toda esta costumbre. Eso va a ser como nuestra sombra. Podemos incluso caer hacer la herramienta cuentagotas. Podemos dejar caer algunos de estos colores más claros. Entonces si dejamos caer ese color y simplemente lo oscurecería, quién cambiaría un poco la dirección del mismo y alejaría para poder ver cómo se agrega. Cuanto más alejas, más ves esa sombra de aspecto realista para concebir. ¿ Cómo se juntan lentamente los botones? Añadamos aún más realismo aquí. Voy a tomar esta forma interna principal que tenemos aquí para el slider, y le voy a añadir una sombra de gota muy pequeña. Entonces solo voy a subirte a efecto para hacer una sombra de gota y iba a dar click en vista previa y se va a lanzar más de una sombra de gota ahí podemos traer eso de vuelta un poco. Podríamos hacer una transparencia también. Podríamos hacer una superposición. Entonces multiplica va a dejar entrar algo de esa luz. Entonces va a parecer que también está haciendo la sombra en la sombra. Simplemente se ve un poco más realista. Entonces vamos a duplicar esto. Eso será fácil. Agruparlo juntos, mantenga pulsado, opción y mantenga pulsada la opción. Y esto es cuando estallar en esa cuadrícula podría ser muy útil para encontrar el espaciado correcto entre todos estos. Entonces tratemos de encontrar aquí el espaciado adecuado para esto. Y también podríamos asegurarnos de que haya incluso espaciado entre los tres subiendo son alineados y haciendo un centro de distribución horizontal. Y pongámoslo a esta línea de arriba aquí para que pudiéramos tener mucho espacio para poner nuestras perillas de caja y volumen. Vamos a hacer eso a continuación, Así que vamos a seleccionar nuestro botón y su sombra. ¿ Qué es agrupar esos juntos? Y una especie de bajarlo un poco más, probablemente haga mis teclas abajo o mi flecha abajo y siga adelante y cambie las posiciones de estos encendedores consiga nuestra pequeña caja de perillas de volumen lista para ir. Entonces sólo vamos a alrededor de ella herramienta rectángulo y tipo de acabado tipo de obtener el espaciado correcto para esto es Bueno, vamos a seguir adelante y hacer que sea un trazo. Vamos a mantener eso un derrame cerebral y aún tenemos a nuestra pequeña Grady aquí que creamos. Entonces vamos a estar creando una serie de capas puntera agregando profundidad y dimensión a esta pequeña barra de volumen. Entonces, ¿quieres mostrarte cómo creé este efecto aquí mismo? Entonces esta es una especie de caja y cómo creó este efecto biselado, y todo lo que hice fue hacer camino, trazo de contorno. Entonces dibujé este rectángulo simple, redondeado, y acabo de hacer trayectoria de desplazamiento un par de veces y luego expandí esa forma hacia fuera y luego hice opuesto radiante, lo opuesto radiante, Así que se podía ver cómo los INT Grady iban en forma diferente direcciones. Por lo que parece que está biselado, tiene esa doble apariencia, y luego esta de vuelta. Acabo de hacer una especie de mejora de carrera y también. Por lo que casi tienes cuatro pequeñas capas diferentes aquí que todas se unen para crear este efecto. Entonces Cuando alejas el zoom, se ve biselado. Y así queremos agregar un poco de textura a esto es Wells fue una especie de deslizamiento todos estos sobre lo que hay en un bonito, oscuro, rico fondo marrón a esto. Entonces sólo vamos a asegurarnos de que este es un bonito relleno de un marrón oscuro escogiendo un marrón oscuro, sinuoso hacia atrás en un sistema de capas comando soporte izquierdo y también hizo una sombra de gota aquí en la última capa. Por lo que tipo de lanzar esta sombra de gota a ella, por lo que como que le da un aspecto más estratificado, un oleaje. Queremos agregar un poco de la textura usando círculos para que se vea como ese material de metal rallado que ves en algún equipo de sonido. Y así vamos a crear una textura simple, justo hasta aquí arriba, sólo vamos a ir a una parte de puerto diferente del tablero de arte, y voy a crear una serie de círculos son realmente solo un círculo. Vamos a hacer un patrón con ello. Entonces para hacer un patrón, vamos a selector, objeto, buen patrón de objeto, y sólo vamos a ir a hacer. Entonces podrías haber hecho patrones antes, pero entonces esto podría ser nuevo para algunos de ustedes y no nuevo para otros. Entonces fue con el patrón y hacer y aquí hay tipo de panel de opción. Entonces ahora mismo están todos anidados juntos, y vamos a poner algo de espaciado horizontal y verticalmente de cada círculo. Y lo vamos a hacer aumentando el ancho y la altura. Entonces escucha. Prueba 12 y 12. Eso agregó un poco de espacio, pero en lugar de que todos estuvieran alineados era hacer una especie de entorno de azulejo o un patrón de azulejo para que pudiéramos hacer un par de diferentes. Pero veamos cómo se ve ese ladrillo por fila. Vamos a quedarnos con ladrillo de ladrillo por fila, y eso es más o menos todo lo que necesitamos para el patrón. Podríamos querer cambiar un poco el color del patrón, así que es un poco de marrón más claro, y destaca sobre ese Phil. Y si alguna vez queremos salvar un patrón, solo subimos aquí, también. Ahorra o dos hechos en este caso, quien lo hizo lo va a agregar automáticamente a nuestro panel de muestras. Por lo que todo el camino aquí en muestras, tenemos nuestro patrón guardado. Vayamos aquí abajo. Ya no vamos a necesitar ese punto. Nosotros ya patrón de manera. Esto es lo que vamos a hacer que se ponga un poco de distancia porque nuestro icono nunca va a estar viendo tan cerca. Entonces es una especie de verlo desde la distancia, y vamos a conseguir una nueva capa aquí arriba, y vamos a hacer clic en su muestra y convertirla en un patrón. Entonces sigamos adelante y enviemos esto hacia atrás al sistema de capas. Entonces está justo detrás de todo lo que hay, y se podía ver cómo se ve un poco de, ah, textura rallada. Ahí tipo de le da un poco de un ambiente rico y tener un par de círculos de diferentes tamaños . Si alguna vez quisiste cambiar, tu patrón que tenemos que hacer es hacer doble clic en una muestra, y te permitiré cambiar el tamaño y el espaciado. Y cuando digas que la muestra recoge aquí y haz clic en Listo, sobrescribirá la forma o el patrón. Si quieres hacer un nuevo patrón, solo tienes que hacer click. Guarda una copia para que puedas tener el original y luego guarde tus cambios un oleaje. Entonces si querías hacer ese círculo un poco más grande, así es como lo haces. Entonces cancelemos y tengamos un par de tamaños diferentes que creó. Creo que la más realista va a ser así de pequeñito. Eso se ve bastante bien desde una distancia uno justo ahí. Entonces tenemos una forma más grande y una más pequeña y luego una especie de forma media. Entonces lo que pensemos se vería bien de esta distancia en términos de textura. Entonces eso es perfecto. Eso es sobre el tamaño correcto para darme el tipo de textura que necesito, pero no tan diminuta que casi parece que está mal, así que justo ahí está perfecto. 47. Ícono de la App Store - dialógica dorada: tres diales diferentes saltaron nuestra herramienta de labios, Hacer un dial en este ya tipo de tiene el Grady y estoy buscando Si vas a nuestro panel radiante, creo que acabo de seleccionar una de estas radio de oro por defecto, no la de oro. Creo que sí. El de latón, el de latón opaco. Y lo que hice es apretar la conexión en esto, así que eso le dio una especie de esa transición más nítida que le da ese aspecto metálico realmente brillante . Entonces se ve esa transición muy, muy apretada ahí de estos dos tipos de superposición para ver así. Y tal vez tengamos que hacer esto una vez sumemos un par más tarde. Entonces esta es una especie de nuestra base de nuestro botón. Vamos a seguir con la capa de dedo esta encima de la otra, y podríamos hacer lo mismo con el desplazamiento de trayectoria. Ir a camino, offset. Queremos hacer un negativo esta vez. Negativo 12. Y ahora vamos a hacer un opuesto, radiante. Y luego vamos a hacer una especie de botón en el medio, y podemos hacer esto o radial. Entonces hagámoslo una radio y hagamos que parezca que la fuente de luz viene desde arriba. Al igual que la fuente de luz viene de arriba aquí arriba. Podríamos necesitar cambiar algunas de estas cosas aquí. Adelante y aflojemos esto. Ahí vamos, haciendo que se vea un poco de tres D. Y lo que también ayudaría es agregar un trazo muy delgado a esto. Eso también es ingrediente. Entonces solo estamos apilando estos codiciosos INT uno encima del otro para darle ese aspecto en capas y ellos iban a agregar Hacer eso realmente flaco y agregar una sombra gota a esto , agregando profundidad y dimensión con todo lo que tratamos de hacer y vamos a aligerarlo un poco . Y podríamos incluso añadir una sombra de gota a esta espalda también. Por lo que esta es una forma muy trasera. Va a haber lanzando unas sombras realmente profundas. Hagamos un lindo desenfoque. Es una buena distancia. Hagámoslo agradable y oscuro, así como así. ¿ Ves esa bonita sombra de caída profunda? A lo mejor no del todo como oscuridad al 66%. Esto agregando una perilla ahí. Queremos asegurarnos de que todos estos aire estén alineados, así que subamos a nuestro panel de línea hagamos todas nuestras alineaciones centrales y hay o dial. Tal vez sólo necesitemos cambiar el ángulo. Entonces eso es que Grady int Linus golpeando a Maurin el centro justo ahí, Es posible que necesites simplemente mover un poco las asas. Podrías hacer eso ahí mismo en la línea, así como así. Perfecto. Y ahí está nuestro dialecto final y ver cómo está conformado por un par de capas diferentes. Nos dieron un trazo en este botón de resaltado interior. Tenemos este radiante muy apretado aquí mismo en un int Grady más suelto en el exterior con una sombra de gota. Por lo que esto será fácil de replicar. Está creando tres de esos puntos. Girar los diales. Asegurémonos de que haya un espaciado igual entre todos ellos. Otra oportunidad de sacar nuestra grilla y especie de ver cómo todo está apretando. Y queremos que este sea un tipo redondeado de icono fue Ir adelante y agregar son prueba de recorte aquí para ver cómo se recorta, y con esto lo hice donde podrías cambiarlo a cualquier color. Entonces si quieres hacerlo blanco, podrías ver cómo va a recortar un poco mejor. Sabemos todo lo que no se va a mostrar. Entonces esa es una gran manera de tipo de probar nuestra aplicación y están dimensionando de ella. Así que bloqueemos esa capa de cultivo y luego vamos a volver a nuestro ícono, y vamos a un tipo de solo asegurarnos de que tengamos los márgenes correctos y el espaciado entre todo. Entonces voy a agrupar todos estos objetos principales, así que vamos a tener este. Este los está agrupando a todos para que pueda empezar a cambiarlos. Todo esto va a ser una unidad. Entonces haciendo un poco de una prueba de distancia aquí para ver si no puedo subir un poco esto y usar tu grilla. Si quieres tener estas líneas en la parte superior justo ahí, mira esa línea cruzando. Puedes tener esto en la parte inferior, pero como quieras hacer, podríamos hacerlo un poco más grande. Pero mira cómo empieza a meterse un poco en la curva ahí. No queremos tener. No tendremos mucho. Bonito margen. Al igual que como todos los iconos que diseñamos queremos asegurarnos de que haya algún margen alrededor de todos los elementos, para que no se vea demasiado apretado. Por lo que en realidad podría incluso sacar esto un par de muescas sólo para algo así como alejarlo de ese rincón. Y siempre hay la oportunidad de seleccionar todo y hacerlo un poco más pequeño. Entonces sólo hay un poquito de ese margen. Adelante y apaguemos esa grilla. Adelante y borra estos iconos y hay un par de cosas más que queremos dio. Por lo que queremos agregar textura y tal vez un borde dorado también. Añadamos una herramienta de borde dorado tan redondeado rectángulo y vamos a crear ingrediente aquí. Vamos a desumir tu pequeño lineal Grady int vamos a crear ese mismo efecto de burbuja en capas eran para hacer de esto un trazo, y vamos a mantener nuestra capa de prueba de recorte encendida. Por lo que sabemos tipo de dónde va a estar el APS final. Cultivos. Entonces sabemos hacer cuánto hay que estar viniendo aquí y escuchar la frontera. Aumentemos nuestro peso, aumentando el peso Oh, y también necesitamos dedo del pie cambiar los ángulos para que coincidan justo ahí, las esquinas y vamos a añadir otra capa aquí, Así que vamos a saber un poco complicado, pero este es un icono bastante complicado. Vamos a desactivar la visibilidad y estamos recortando, y vamos a crear otra capa haciendo una trayectoria de desplazamiento de ruta. Y así lo va a compensar negativamente. Y nos vamos a llevar a Argh! Radiante. Mantenlo igual, pero solo revertir rumbo. Entonces en lugar de 44 grados negativos, vamos a hacer unos 44 grados positivos, y le va a dar ese efecto diabólico. Entonces cuando activamos el cultivo son las pruebas de cómo se va a recortar en la final . Llegamos a ver cómo se ve y parece que eso va a estar escondido. Por lo que sólo necesitamos ajustarlo. Llevemos este en el interior para que lo veas cuando se recorta así como así. Está bien. Y ahora podemos hablar. Mucho son capa de recorte, Ve cómo se ve. Por lo que se ve un poco estratificada porque tiene sus dos tonos frente a Grady InTs. Por lo que se le da ese efecto duplicado. Entonces una cosa que es importante tener en cuenta es que necesitamos que todo vaya a la esquina. Esto va a ser recortado por Apple, pero no vamos a extender todo fuera de la esquina de todos modos, así que vamos a seleccionar el camino que es el camino en el exterior. Entonces hagámoslo más grande todo el camino fue hacer el trazo más grande. Por lo que se extiende todo el camino hacia fuera y puedes bajar aquí y tenerlo el alineamiento, el trazo hacia el exterior. Entonces solo será por fuera. Entonces está cubriendo todos esos rincones para nosotros. Y podríamos hablar a lo largo de ese cultivo que prueba el recorte para ver cómo se verá al final. Trae eso, trae eso, trae esto y nos estamos perdiendo algunas cosas aquí. Lo que me encantaría hacer es agregar aún más textura al fondo y agregar algunos pops de color relámpago. Entonces lo que voy a hacer es que voy a desbloquear esta capa trasera aquí. Entonces esta capa aquí mismo y voy a copiar eso, ponla en el frente y le voy a añadir un poco de nuestra textura de círculo. Es agregar un poco de textura justo aquí y ver qué tipo de tamaño necesitamos aquí. A lo mejor ese medio de ahí y así no queremos que sea todo el camino al otro lado. Queremos tener algo de luz viniendo por aquí. Vamos a hacer un modo de mezcla. Vamos a hacer una quemadura de color, asegurarnos de que sea 100% de opacidad. Y entonces lo que vamos a hacer ahora es que vamos a añadir pequeños pops de luz. Y así es como lo vamos a hacer. Vamos a conseguir nuestra herramienta de labios, círculo de paja. Hagámoslo blanco. Bueno, primavera todo el camino en la capa superior. Ya sabes, vamos a hacer un modo de fusión de superposición y tiene un mezclado para crear una especie de pop de luz, y no lo vamos a tener al 100%. Vamos a reducir eso. Sólo queremos un poco de pop una luz aquí mismo en la esquina. Vamos a mandar eso al revés detrás de ese 1er 1 Solo queremos hacer un tipo de luz de fondo, y queremos desenfocarlo porque ahora mismo, si lo miras, hagámoslo al 100%. Si miras, sólo parece un foco de atención. Entonces vamos a desenfocar esto un poco subiendo a blurb ir a simplemente hacer un desenfoque gaussiano está difuminándolo un poco. De acuerdo, así que ahora como que veo fuera, te da un poco de foco de atención. Podríamos incluso agregar un poco de color a esto, tal vez ver si agregar oro podría ayudar. Eso es agregar una pequeña racha de luz ahí. Ya que tenemos este pequeño círculo blanco ¿cuándo podría ponerlo por aquí para agregar casi un poco brillo sobre brillo de luz? Y simplemente no lo hemos podido hacer superposición. Tenemos modo de mezcla de superposición, agrega un poco de pop de color, y solo podríamos quizás reducir la opacidad en eso solo un poquito. Solo queremos un poco de brillo, solo agregando un poco de destellos y toques finales, y ya casi terminamos. 48. Ícono de la App Store - exportación: Ahora que terminamos una vez desactiva algunas de estas capas extra. Ya no necesitamos esta capa de recorte de prueba. Esta es una especie de la capa final que necesitamos. Así que tener todo esto es por diseño final de app y vamos a darle una prueba antes de que se adaptara a estos tamaños más pequeños. Vamos a darle una prueba exportándolo y lo vamos a poner como PNG. Ese va a ser el formato universal para esto. Iba a mantenerlo en un alto 300 peopie me resolución y dar click en. OK, así que hay este sitio web realmente genial llamado el icono de la aplicación Tester, vamos a ir aquí a la página principal. Tengo el enlace a esto y la guía de recursos para esta sección, y va a poder aplicar nuestro icono de aplicación a una variedad de lugares para que pudiéramos ver cómo se ve. Entonces bajamos aquí y solo arrastras tu icono y aquí acabamos de exportar son 10. 20 por 10 20 p y G, veamos cómo se ve solo una especie de hacerse una idea de cómo se va a quedar en la final. Y así es como se va a ver en una amplia variedad de fondos. Entonces siento que realmente aparece en todo tipo de fondos diferentes, incluso en la oscuridad, porque tenemos muchos colores brillantes y reflejos ahí dentro que lo ayudan a sobresalir sobre un fondo negro. Nos vamos a desplazar hacia abajo y tipo de ver cómo se ve en la tienda APP. Y nos da una buena idea de cómo se va a ver y qué podría hacer hasta ahora que lo estoy viendo ahora que lo estoy viendo a un poco de distancia. Lo que me gustaría dio es tal vez engrosar un poco la frontera y asegurarme de que sólo un poco se recorte de la manera correcta. Entonces solo necesito ajustar eso un poco, hacer que los bordes sean más gruesos y pasar por un poco más y tal vez hacer esto un poco más pequeño. Por lo que es bueno poder probar esto, ver cómo se cultiva y cómo se ve algo así, y podemos agarrar todos estos dados un poco más de margen. Pensó que era un poco demasiado apretado, así que es genial poder probarlo Así que puedes ver estos poco los ajustes que vas a tener que hacer con Go Adelante, adapta todo esto a las tallas más pequeñas. Y cuando adaptamos todo esto, si aún tenemos todos estos trazos y cosas puestas, solo queremos asegurarnos de que estamos en preferencias generales. Y tenemos nuestras esquinas de escala y trazos de escala y efectos en para que los caminos no se distorsionen. Nosotros lo hacemos más pequeño. Entonces ahora adaptemos esto a tamaños aún más pequeños que va a necesitar la tienda APP. Podríamos incluso hacer como un chasquido de dos puntos o chascar a rejilla. Entonces va a chasquear desde las esquinas correctas. Vamos a hacer eso por los otros dos. Puede exportar thes como PNG cuando alguna vez estés listo. Entonces exportación de archivos como y hay un PNG, vamos a asegurarnos de dar click en usar tableros de arte vamos a exportar como PNG. También puedes hacer esto como exportación de activos también. Si vas a estar haciendo muchos de estos, podrías hacerlo como exportación de activos, o puedes hacerlo con la plantilla donde ya los tienes dimensionados para ti, y puedes exportarlos como PNG y solo asegurarte de que solo tienes que hacer clic en los predeterminados. Entonces aquí está nuestro ícono final. Así es como se ve el archivo, y así es como se va a ver en la tienda APP. Entonces estoy bastante contenta con cómo se ve eso y solo, ya sabes, tal vez algunos pequeños ajustes que podría hacer. Pero ese es el proceso básico de crear y exportar una app apple. Icahn. Y esto fue un poco más detallado, un poco más complejo, con todas esas capas, baile y reflejos y y podría haber sido un poco demasiado complejo de un proyecto para abordar por que es todas estas capas. Pero quería un poco mostrarte cómo funciona este proceso, porque creo que es bueno saber como hacer esto, sobre todo cuando estás trabajando desarrolladores y desarrolladores web, y van a necesitar especie de los gráficos y la branding para esto. Se puede decir, Hey, yo podría hacer un icono de aplicación. Ya sabes, ya he pasado por ese proceso antes, así que ahí está. Me divertí con este 49. Página de aterrizaje web en Adobe Xd: empezar: bienvenido a la sección Diseño y diseño Web, y la sección tendrá la tarea de crear una página de aterrizaje corta y rápida para un cliente en el espacio de citas online. Nos proporcionaron algunos archivos básicos de logotipos y elementos de marca. Los usuarios harán clic a través en una red social o mostrarán en para llegar a esta página de destino. Donde es nuestro trabajo son los diseñadores gráficos llevar el branding consistente a esta página de aterrizaje y crear un bonito diseño limpio para este proyecto. Como diseñadores gráficos, nuestro principal trabajo es rallar el sistema visual de branding para este sitio web. Nuestro trabajo no es codificar el proyecto, aunque algunos diseñadores también serán los encargados de codificar y desarrollar. Vamos a asumir para este proyecto hay un desarrollador que tomará nuestros activos, codificará el sitio web, o usamos una empresa como Squarespace para adaptar la plantilla que está bastante cerca están diseñadas para hacerlo realidad. Esta sección se centrará principalmente en el diseño y el diseño, lado de las cosas, ahí algunos elementos básicos que necesitaremos para la sencilla página de aterrizaje. En primer lugar, necesitamos agarrar a los usuarios cuando aterricen por primera vez en la página con algo convincente. Necesitamos tener algún tipo de acción llamada o tener un botón de registro que los envíe al sitio web principal de la Web para inscribirse. Y por último tendrá que mostrar el video promocional en la página en algún lugar. La marca que creé para este proyecto se llama Buscando Amor. Será un sitio web genérico de citas que sigue un típico proceso de tres pasos. Podrás descargar el recurso en el curso para que puedas tener todos los activos básicos que necesitaremos para construir la página de aterrizaje. Por último, para este proyecto en particular se estará utilizando un programa llamado Adobe X'd para armar todo esto en un layout e incluso mostrar al cliente un marco de alambre viable en el que puedan aprobar el diseño. Y podemos trasladar este proceso al codificador o desarrollador. También puedes crear esto usando Adobe Illustrator y Photoshop sin ningún problema. Adobe X'd es actualmente totalmente gratuito de descargar, y te proporcionaré que Lincoln la Guía de Recursos. O simplemente puede simplemente descargar Google Adobe X'd yendo a aprender brevemente lo básico del programa para que pueda mostrarte cómo es mucho más fácil armar diseños y conceptos de sitios web usando Adobe X'd. Entonces empecemos echando un vistazo a nuestros activos de marca y Adobe Illustrator Illustrator , puedes descargar este archivo. Como dije antes y solo tengo algunos activos básicos aquí, vamos a estar recreando algunos de estos para que podamos pasar por el proceso de cómo trabajar con ilustraciones y cómo tipo de crear estos todos pertenecen formas que son muy populares hoy en el mundo del diseño. Vamos a estar usando esto en el diseño general de sitios web. Entonces lo que quiero hacer es que tipo de crear algunas paletas de colores y crear alguna tipografía que podamos usar. Ya lo puedes ver aquí, pero vamos a un tipo de proceso de pensamiento a través de algunas de esas cosas. Vamos a suponer que este cliente ya nos ha suministrado el logo y alguna marca muy básica. Pero nos toca realmente hacer que eso cobre vida en forma de página de aterrizaje de un sitio web. También notaste que algunos de estos iconos podrían ser algo familiares. Vamos a estar usando algunos de estos iconos en el diseño de nuestro sitio web, pero este también es el pacto de iconos quediseñamos, así que vamos a poder trabajar con esos archivos que exportamos o archivos ilustradores para poderdarle vida a este ícono diseñamos, así que vamos a poder trabajar con esos archivos que exportamos o archivos ilustradores para poder dedo del pie en Adobe X'd. Entonces si el cliente ya te ha suministrado una paleta de colores fantástica, eso es una cosa menos que tienes que hacer es un diseñador gráfico. Pero como diseñadores o trabajo principal es crear el sistema visual o el sistema de diseño para muchas cosas diferentes con branding en muchas veces, eso significa el logotipo, la paleta de colores, los iconos. Entonces todo esto son cosas que hay en nuestra, uh, corte. Estas son cosas que el diseñador gráfico es realmente responsable de menos así el recubrimiento y más así este tipo de cosas. Entonces te voy a mostrar cómo creó todas estas cosas. Por supuesto, creamos el conjunto de iconos antes. Por lo que tenemos todos los establecidos y algunos de la tipografía. Ya sabes, podemos llegar a una tipografía de titular agradable y llegar a alguna copia de cuerpo agradable o de sub línea que podamos usar, que es lo que hicimos aquí. Encontré esta tipografía en fuentes de Google, así que vamos a ir y brincar allí muy rápido. Entonces con nuestras tipografías, si esto no está ya establecido. Ah, bueno, lo que me gusta hacer es a veces que un titular adaptado tipo cara que ya está en un logo sea usado como titular principal de vez en cuando, solo una especie de especial sacando el tema y branding de eso ya está en el logo. En este caso, es una cara apretada llamada Pacific. Ah, y lo encontré en las fuentes de Google, y lo que quería hacer es que buscaba una muy suave ya que estamos hablando de amor y encontrar amor y suavidad, y algo así que quería divertirme, ilustrativo, brillante, vibrante, tono joya de color a todo esto. Por lo que quería encontrar una tipografía que pudiera coincidir con eso. Y así una tipografía de script es exactamente lo que estaba buscando. Pero necesito encontrar el correcto. No quiero guionar cara eso es a lo tradicional. Entonces solo en las fuentes de Google y estoy usando fuentes de Google porque no todo el mundo tiene suscripción de fuentes Theodore B. Si tienes la nube de adobe creative, tienes esa suscripción. Pero muchos de mis alumnos no tienen eso, así que estoy usando algo más de código abierto y gratuito para que todos lo usen. Entonces me quedo con las fuentes de Google para este proyecto. Entonces sigamos adelante y lo estrechemos por tipo. Por lo que definitivamente queremos ver si no podemos encontrar escritura a mano espacio o exhibición. Por lo que algunos de esos son los tres que se acercaban y débiles. A mí me gustaría agradable, audaz, enfermo para que realmente podamos cambiar el grosor. Para poder estrechar hacia abajo son la cara apretada. Por lo que muchos de estos aires realmente tradicionales, y algunos de ellos son realmente difíciles de leer. Ese es el único tema con los guiones escritos a mano es. A veces son muy difíciles de leer, y queremos tener una tipografía bonita y limpia que también sea gruesa. Por lo que seguí adelante y asenté en uno llamado Pacífico. Ah, aquí mismo y luego Railway es una fuente de Google muy flexible que tiene muchos pesos diferentes a ella. Entonces vamos a usar eso para que todos nuestros body copy y sub titulares tengan una opción de Sarah de arena limpia porque no queremos usar en exceso tu tipografía de script. Simplemente queremos usarlo con moderación. A lo mejor sólo en el titular principal en la parte superior, y eso es todo. A lo mejor podríamos usarlo en otra pequeña zona. No usamos en exceso una tipografía de script como esta. Entonces ahora que tipo de establecemos esto, queremos especie de mirar los colores. Y mucho de esto es difícil de establecer aisladamente. En ocasiones se necesita trabajar en otro tipo de proyectos con la marca para averiguar cómo adaptar la marca. Por lo que a veces puede que descubra tipografías después de empezar a diseñar y diseñar el sitio web para averiguar qué funciona para que no tengas que descifrar las tipografías antes de empezar. En ocasiones podrías empezar a diseñar el diseño básico del diseño Web y luego averiguar qué tipo de letra podría funcionar mejor. Teniendo en cuenta qué ilustraciones utilizas y fuiste maquetación. Tienes pero para hablar de cómo desarrollé esta paleta de colores. Puedes pasar a color dot adobe dot com y encontrar algo de inspiración en la rueda de color, o incluso puedes subir a explorar. Si conoce una tendencia en particular, se puede tipear eso en y pasar por ella. En realidad hay una tendencia también, así que sé que quiero quedarme con algún tipo de tono joya. Por lo que sólo estoy consiguiendo algo de inspiración aquí para la paleta de colores, simplemente escribiendo tonos de joya y tratando de obtener algunas ideas. Algunos colores realmente brillantes, vibrantes que me recuerdan el amor y el romance, e incluso puedes armar un tablero de marca. Descargué fotos de pixels dot com y otros sitios web gratuitos para tratar de armar un tablero de marca que tuviera algunos de estos colores que busco para que pudiera tomar la herramienta cuentagotas y muestrear y crear una paleta de colores cohesiva. Entonces solo tipo de mostrarte esos procesos básicos de cómo se le ocurrió estos colores. No sólo se me metieron en la cabeza. Tenía que hacer algunas investigaciones. Tenía que estudiar. Tenía que armar un tablero de marca, tenía que ir a buscar algunos colores de tendencia para tratar de averiguar este color final. Palín. Entonces este palacio de color es en realidad una captura de pantalla de Adobe X'd, donde tenemos todos los códigos hex, qué códigos hex es lo que necesitamos para el diseño Web en cuanto al color. Entonces acabo de tomar una captura de pantalla de eso para que puedas conseguir fácilmente la herramienta cuentagotas y muestrear eso a medida que creamos Thies esta ilustración, que vamos a hacer a continuación 50. Página de aterrizaje web en Adobe Xd: ilustraciones: Por lo que queremos usar una foto real. Bueno, definitivamente usas una foto real para agarrar a la gente. Pero me encantaría usar esta ilustración cuando hablo de nuestro proceso de tres pasos. Y yo quería un poco traer esto como un estilo general. Muy sencillo, Diseño plano, muy tendencia en este momento. Y las formas aire realmente tendencia ahora mismo. Por lo que quería hablar de esto como, ah opción de estilo y hablar de cómo armé esto. Entonces lo que voy a hacer va a deslizar esto. Tienes acceso a ella si no tienes ganas de hacer este paso. Pero como diseñadores, esto es parte de tu trabajo llegar a este tipo de trabajos para que podamos dibujar a mano esos personajes o tener un poco de un barato para hacer todo este proceso un poco más rápido porque tenemos mucho que llegar. Hay un sitio web llamado humanos dot com, así que es humano, pero con tres A's diferentes en él, y proporcionaré el enlace en la guía de recursos y tienen una biblioteca de algunos maravillosos activos vectoriales. En realidad hay s V GS, que es una forma diferente de vector. Pero sigue siendo un archivo vectorial, y puedes descargarlos y los puedes adaptar como quieras. Y son gratuitos para uso comercial y personal, lo cual es fantástico en nuestro caso. Por lo que aquí están algunos de los básicos. Déjame ver si no puedo deslizar esto, puedes ver un poco mejor, así que vienen en un par de formatos diferentes. Podrías poner un iPad o ah, ya sabes, cualquier tipo de pantalla ahí. Se puede agregar que en un ilustrador, se pueden adaptar los colores de la ropa. Puedes cambiar todo lo que quieras de este tipo de personas. Entonces hay un par de personas que pensé que se verían realmente bien. Yo quería tener una especie de lo que viste donde dos personas se están juntando con sus manos , como si estuvieran queriendo encontrar un fósforo. Entonces encontré a dos de ellos y los traje a Adobe Illustrator. Aquí están los dos. Ahí hay uno. Ahí hay dos. Sólo voy a copiar a estos dos tipos y traerlos, y vamos a tener que cambiar la orientación de ellos también, lo cual no es gran cosa. Podríamos dar la vuelta a uno, así que tomémosla y simplemente voltearla. Transformar, reflexionar. Yo quiero que sus manos se junten, como si estuvieran encontrando amor. Por lo que la posición de estos aire ya es grande. Y otro pequeño truco es que podemos conseguir nuestra herramienta de marionetas Si tienes una versión más reciente de Illustrator e incluso puedes transformar, encuentra diferentes puntos sobre él para transformar, y tal vez tengas que borrar ciertos puntos y Adam donde quieras a que se vayan. Entonces si quieres cambiarlo un poco, podría ser un poco incómodo trabajar con él. Pero ¿alguna vez has querido discambiar una porción de quien puedas? Entonces queremos ponerlos en forma, y queremos que salgan de la forma para darle un aspecto en capas. Así que vamos a crear nuestra pequeña ob forma larga aquí. Vamos a bajar aquí, y todo lo que voy a hacer es conseguir la herramienta Ellipse, dibujarla, y sólo vamos a tomar la herramienta de curvatura, y vamos a escoger un punto y sacarlo. Por lo que tenemos seleccionada la herramienta de curvatura. Va a hacer clic y hacer un punto de anclaje y empujarlo hacia fuera. Y como que al instante creamos ese tipo de forma todo oblonga que es muy popular. Podrías tomarlo y crear todo tipo de formas geniales. Todo lo que hice fue suyo. Toma el taburete Labios y añade algunos puntos de anclaje con la herramienta de curvatura. Entonces eso es todo lo que es. El herramienta Elipse con un par de un par de puntos de herramienta de curvatura lesión. Es así como muchas de estas personas crean o muchos diseñadores crean estas formas oblongas. Podrías verlo en todos los tamaños diferentes, creará una pareja para este sitio web en particular. Entonces eso fue bastante sencillo. Entonces vamos a crear y establecer el tono para esta ilustración. Llevemos esto a la parte de atrás. Queremos posicionar estos donde hay un pie o adelante, o algo tipo de salir de la forma tipo de hace que parezca que los están juntos como uno por ilustración artesanal. Entonces los colores vamos a hacer nuestro color de fondo hecho, y entonces tal vez necesitemos cambiar ese naranja porque el naranja y el amor no lo sé. El naranja no es realmente parte de nuestra paleta de colores. Lo que podríamos fácilmente en grupo thes y cambiar los colores. Pero hagamos el fondo primero tenemos una nueva herramienta y, ah, creo que es 2000 19. Salieron con esto con el panel de muestras de ingredientes de Adobe Illustrator. Tenemos algo llamado Forma libre, Grady it. Podemos hacer click en esto, y va a crear varios puntos diferentes al igual que la herramienta de urdimbre de marionetas de alguna manera. Y puedes crear varios puntos de luz diferentes, y normalmente puedes tomar un punto. Consigue la herramienta cuentagotas y muestra de nuestra paleta de colores. Cosas diferentes. Entonces sólo tipo de muestreo. Definitivamente como ese morado oscuro ahí dentro. Y me encantaría conseguir una especie de versión más ligera de eso. Por lo que es casi como una bonita transición de color de este tipo púrpura profundo al rosa más claro y es un tipo de transiciones realmente muy bien. Entonces eso solo se compone de tres puntos a lo largo de la línea, y me gusta tener este brillo en la parte inferior tipo de le da un bonito aspecto moderno, pero si no tuvieras esa herramienta, aún podrías conseguir ese mismo Grady, en efecto yendo y haciendo clic en tu herramienta de malla y haciéndolo de la misma manera con la herramienta de malla. Entonces digamos que estamos usando la herramienta de malla. Harás click de todos modos aquí para crear diferentes puntos de luz y haciendo doble clic en este o haciendo doble clic en este reloj. Puedes cambiarlo de esa manera a Es un poco más preciso y preciso. Puedes crear una gran cantidad de tres imágenes D haciendo reflejos y sombras con la gran herramienta de malla . Definitivamente es más complicado y más rico de una herramienta. Pero si necesitas crear algo rápido que Grady y si tienes una versión nup fechada de Illustrator hay herramientas de calificación de forma libre definitivamente más rápido como. Y podemos crear varias versiones diferentes de esto si queremos poner esto sobre un fondo blanco y tener el fondo desvanecido. Entonces hagamos esto blanco. Podríamos tener el tipo de forma desvanecida así por lo que parece que la ilustración se está mezclando con el fondo. Entonces esa es otra opción que podríamos hacer. Podría tomar este pequeño mango y expandir un poco ese blanco. Se podía ver que podía poner eso sobre un fondo blanco. Parece que las ilustraciones se mezclan en el fondo, pero podríamos hacerlo en otra fecha. Volvamos a lo que teníamos que ver. Eso se ve. Cambiemos de naranja porque no está funcionando bien en absoluto. Con nuestra bonita paleta de colores tonificados joya, vamos a desarreglarnos estos podrían tener un grupo. Soy bastante grupo de monjas, Um, Um, hasta que pude tener acceso sólo al suéter. Entonces necesito que ONU agrupe eso una vez más. Sólo necesito la naranja, y podría hacer un pequeño truco. Puedo cambiar individualmente estos tres objetos vectoriales diferentes, o puedo subir a editar colores y simplemente hacer un poco de truco yendo a ajustar el balance de color. Y también hay re ilustración de color, que irá por aquí en un minuto, llegar a hacer click en convertir, click en vista previa, y podemos cambiar todas estas al mismo tiempo. Podríamos hacerlo rojo para el amor, sólo una especie de forma rápida de cambiar de color. Y me gusta un color más rosado para esto porque tipo de va con nuestro tema un poco mejor, así que podría hacer lo mismo con ella. También hay algo en el mismo sistema de menús. Así que sube a editar y colorea. Podemos volver a colorear la obra de arte, así que va a seleccionar todo lo que es naranja aquí, y podemos cambiar totalmente el color. Entonces este es el color actual, ese naranja oscuro en la manga, y podemos cambiar esto y podríamos simplemente bajar. El listado es una especie del color más claro, por lo que se puede volver a colorear ilustraciones de esa manera también. Por lo que muchas maneras diferentes podemos hacer esto, hacer que eso sea un poco más ligero. Y ahí vamos. Simplemente re color que también podemos hacer los pantalones si queremos. Pero sólo vamos a dejar eso, como está. También podemos añadir una sombra de gota muy pequeña o mantenerla plana. Entonces si queremos mantenerlo un diseño total plano, podemos mantenerlo de esta manera. También podemos agrupar esto y simplemente crear una ligera sombra de gota, o aún mejor, solo agruparlos como individuos para que podamos tener un poco más de control si vamos a usar estas ilustraciones de nuevo en otro lugar. Entonces voy a seleccionar ambos y añadir la pequeña sombra de gota más pequeña, sutil se va a estilo ojos sombra gota y solo quiero agregar una pequeña . Por lo que te das cuenta de que no tiene mucho desenfoque, y la opacidad es muy poca. Por lo que esto le agrega un poco de ese pop tridimensional. Podríamos hacer lo mismo con nuestro círculo. Podemos hacer que esto salga un poco más a la distancia del objeto y tal vez sólo añadir un poco de desenfoque. Entonces nada grande. Podemos mantenerlo plano si quisiéramos, o podemos añadir un poco de sombra de gota. Entonces esa es una especie del proceso básico de cómo creé el trabajo gráfico para terminar usando. Tengo esto en su propio tablero de arte. Entonces cuando sí exporto esto, puedo exportar esto como PNG, y hay una forma aún más fácil si estás usando otros programas de adobe para armar tu diseño cada usando adobe illustrator para hacer un diseño Web, solo traer esto derecho en. Ya estás listo. Vamos a estar usando Adobe X T, y va a ser muy fácil traer este activo porque sólo vamos a copiarlo y pegarlo en Adobe X'd cuando estemos listos. Por lo que ahora tenemos algunos activos básicos con los que trabajar. Tenemos el conjunto de diseño de iconos que creamos antes en la clase, y ahí se piensa que varios de estos podrían ser muy útiles para este sitio web. Y tienen un estilo agradable, limpio, limpio, plano el cual funcionará muy bien con la marca que tenemos. Así que sólo tomé esos iconos y apenas empecé a traerlos para usarlos. Y una vez más, si usas otro diseño de producto de adobe, tu diseño Web que obtienes es copiar los iconos y pegarlos en donde estés diseñando. 51. Adobe Xd: curso crash: por lo que quería mostrarles con qué vamos a terminar los pies al final del proyecto. Entonces esto es una especie de fueron animando. Solo estamos haciendo un click a través donde podemos mostrar al cliente cómo las cosas vuelan o animan. Podríamos mostrarles lo que sucede al hacer clic en un botón en particular como el botón de ver video o lo que sucede cuando hacen clic en el botón de inicio del proceso ahora. Entonces queríamos mostrar al cliente cómo Ah, el usuario fluye por la página de aterrizaje y así es como lo vamos a hacer. Es por ello que utilicé Adobe X'd para hacer Diseño Web porque no solo está diseñado para esto, y es muy fácil crear formas y texto, también es muy fácil establecer nuestros colores y nuestros códigos hex. También es muy fácil establecer nuestros estilos de personaje, así que estamos estableciendo un titular o estableciendo lo grande que es. El tamaño de punto empezaba a establecer esa jerarquía de tipo Web aquí mismo en el programa . Es muy fácil exportar eso para el desarrollador. Vamos a abrir un nuevo documento y tienen algunos tamaños Web construidos. Y por supuesto, siempre podemos hacer la versión para iPhone. Pero se supone que esto es una especie de página de aterrizaje de escritorio. Vamos a dar click en la Web 1920 por 10 80. Eso va a ser una especie de tamaño de ventana estándar de navegador de escritorio de alta resolución. Y este es el tamaño básico. Entonces voy a hacer un rápido curso de choque de 10 minutos en Adobe X'd para aquellos que aún no han estado en este programa. Este es un nuevo programa para algunos de ustedes chicos. Si ya has estado en Adobe X T y has hecho un proyecto conmigo en una clase imparto una clase donde enseño Adobe X'd y detalle hacemos un diseño de app móvil. Si has tomado esa clase conmigo o ya tienes experiencia previa en Adobe X'd, siéntete libre de omitir esta lección en particular y entrar en la sección de diseño de esta. Entonces bienvenido a Adobe X'd. Si tu marca nueva, este curso acelerado de 10 minutos te dará justo lo que necesitas para que hagamos un layout básico juntos. Entonces seguimos adelante y abrimos el nuevo documento. Tenemos un tablero de arte de 1920 esto se llama tablero de arte, y puedes crear muchas tablas de arte diferentes. Y aquí es donde va a funcionar con éste cuando empecemos. Entonces este es una especie del nombre de tu tablero de arte. Puedes cambiarle el nombre Página principal y Adobe X'd vive con tablero de arte. Entonces vamos a terminar creando montones de diferentes tableros de arte y eventualmente conectarlos a todos . Entonces si estás acostumbrado a los programas de adobe, van a estar muy acostumbrados a Adobe X'd. Notarás lo simple que las interfaces de usuario U. I. I. R de adobe Extinct es un programa muy sencillo. No hay una tonelada de herramientas para aprender o descifrar en comparación con ilustrador o Photoshop. Entonces tienes algunas formas básicas aquí en tu barra de herramientas que creas y creas cuadrados y círculos, elipses, todo tipo de formas diferentes. ¿ Hay bastante estándar a la hora de hacer diseños Web, Web building y Web y notarás por defecto, agrega este borde. Entonces si usted por aquí a la derecha aquí, es especie de su panel de propiedades, nuestra área de propiedades, y por defecto hace un borde para que podamos unconectar la frontera. Si quieres y luego solo tienes el relleno y luego solo haz un relleno. Entonces al igual que Adobe Illustrator photo Shop, es bastante sencillo. Una vez que tipo de dominado un par de esos otros programas, por lo que obtienes nuestra herramienta de movimiento selecto. Ambos iban a quitar la frontera y luego agregar un relleno. ¿ Estos aires solo eran formas básicas? Podrían moverse el uno al otro. Hagamos de eso un color ligeramente diferente. Y hay curso, un sistema de capas y Adobe X'd también, y puedes bajar las capas. Es un poco más difícil de encontrar. Um, si bajas aquí a este pequeño ícono que parece que son capas, haz click en eso y luego podrás ver todas las diferentes capas. Aquí bajamos a las formas, podrás especie de reordenarlas en el sistema de capas. Si quiero bajar el triángulo en el sistema Larry y simplemente arrastrarlo hacia abajo, puedes bajar y podrías hacerlo por todos los elementos, solo imágenes, formas o texto. Así es como llegas al sistema de capas aquí en Adobe X'd, pero vamos a usar algunos atajos para cambiar las capas aquí, tú para hacer mi comando corchete izquierdo y corchete derecho para moverlo arriba y atrás. Entonces, igual que cualquier otro programa de Adobe, podrías ser capaz de simplemente cambiar las capas. Y también hay una herramienta de pin en Adobe X'd, y funciona muy similar a la fototienda e ilustrador. Por lo que solo tienes que hacer clic y podrás crear todo tipo de formas diferentes, al igual que dio hicimos un ilustrador y podrías cambiar el borde, lo que cambiará el trazo. Entonces la frontera es básicamente tu trazo, y podría cambiar el tamaño justo debajo. Entonces hagámoslo un trazo muy grueso. Y también puedes cambiar las tapas al igual que lo harías en el panel de trazos y en Adobe Illustrator. Se puede hacer eso aquí abajo. Esta es una especie de cómo cambias tu gorra. Por lo que necesitamos una bonita gorra redonda y tenemos unas bonitas gorras redondeadas fuera del borde de nuestro trazo. Ponte parejo a una sombra. Entonces cambiemos el relleno algo brillante, y podríamos agregar una gota destrozada a este objeto con solo hacer clic en la sombra, y va a tener algunos botones de entrada. El X va a ser tu X e Y van a ser la distancia del objeto, y B va a ser tu borrosa. Entonces si tienes cero desenfoque, va a ser una sombra plana. Y para cambiar la transparencia de una sombra, hay que hacer doble clic en esta capa. Y aquí es donde se cambia la transparencia. Entonces si lo quiero muy fuerte, puedo escribir un número. Y también puedes cambiar el color de la sombra. Por lo que es ligeramente diferente a ilustrador y foto shop. De alguna manera, ese tipo de condensa todo en un solo panel en este panel de apariencia en lugar de tener un panel de trazos separado en todas estas cosas. Tan solo como todo condensado justo aquí para ti, que puedas hacer rápidamente algunos efectos. Así que volvamos a nuestro tablero de arte y solo creemos algunas formas básicas y creemos una barra superior aquí en el borde de clic y luego solo mirando una barra y digamos que queremos agregar un logotipo en la parte superior. Entonces lo que vamos a hacer, podrías traer cualquier activo arrastrándolo desde tu escritorio y cargándolo al espacio abierto y ajustando la imagen si quieres traer un activo vectorial. Entonces digamos que queremos traer nuestro logo. Voy a tomar este archivo del logotipo y me voy a llevar el blanco porque va a aparecer mejor sobre una frontera. Y sólo voy a copiar. Y si lo pegas aquí, automáticamente lo va a traer. Si quieres hacerlo más grande, mantén pulsado el turno y arrástralo para hacerlo más grande. Podemos copiar y pegar objetos extremos, o puedes arrastrarlos. Y si son objetos vectoriales, siguen siendo vector, lo cual es realmente bonito. Entonces digamos que queremos crear un sistema de menús rápido. Tienen una herramienta tipo igual que cualquier otra herramienta. Vamos a seguir escribiendo en muchos uno, y queremos hacerlo más grande. Entonces estamos aquí en nuestro panel de texto cuando sólo vamos a hacer eso un poco más grande, vamos a llenarlo, hacerlo blanco, y podríamos cambiar todo tipo de cosas. Podemos cambiar el espaciado entre los personajes. Podríamos cambiar la delantera o el espaciado entre las líneas. Un par de opciones de alineación diferentes Hay todas gorras. Hay un sub script, todo lo que verías en un área de texto normal. Entonces digamos que quiero tener cuatro elementos de menú diferentes puedo hacer el largo camino y copiar y pegar o hacerlo un Knop sh en drag y crear para, como, como, esto y luego tipo de Maine y nos encontramos con el espaciado. O hay algo realmente genial que tengan un adobe x t que no tengan otros programas de adobe, y eso es algo llamado la grilla de repetición. Así que voy a hacer clic en esta herramienta de repetición de cuadrícula aquí mismo para repetir cuadrícula, y voy a poder expandir esto hacia fuera, y va a copiarlo una y otra vez, igual que un patrón. Entonces 123 Sigamos adelante y hagamos cinco. ¿ Por qué no? Y antes de desagrupar la cuadrícula o hacer algo así, tienen un área donde se puede ajustar el espaciado o relleno o canalón. Supongo que se podría decir cambiar la canaleta en estos también, para que pueda tenerlo extendiendo todo el camino. Fue genial acerca de esto es que puedo cambiar el tamaño de fuente en este 1er 1 Lo cambiará globalmente. Entonces si no haría todos estos más pequeños, solo hago 22 y los hizo a todos más pequeños. Y es realmente genial porque podrías hacerlo horizontalmente o puedes arrastrarlo verticalmente, y ahora puedes crear tantas rosas que ganó también. Por lo que esto es perfecto para crear y diseño de múltiples columnas, y queremos que las columnas sean del mismo tamaño. Entonces digamos que aquí tenemos una caja. Tendríamos un diseño de tres columnas. Hagamos un Phil gris claro, y queremos hacer algunas esquinas redondeadas en esto para que se vea bonito y liso. Tenemos lo mismo que tenemos un ilustrado. La herramienta de esquina redondeada iba alrededor de las esquinas. Y digamos que quiero repetir esto tres veces, click en repetir cuadrícula y repetirlo así. Y entonces puedo volver atrás y extender las canaletas hacia fuera. Y tengo un diseño de cuadrícula de tres columnas así como así, y notarás que tengo guías inteligentes en Está encendido por defecto. Me va a ayudar a encontrar el punto central de los documentos o justo ahí estaría el punto central También te dice los tamaños de píxel en la parte superior en la parte inferior. Entonces te diste cuenta de cómo cambian las zonas rosadas cuando lo saco arriba y abajo. Y también se puede ver el píxel, nosotros Ah, canaleta a la izquierda y a la derecha también. Por lo que es muy, muy útil tipo de conocer tu tamaño de tu documento general en términos de píxeles de esa manera. Entonces, ¿qué? Sam, estoy listo para un poco desarreglado esto. Estoy listo para moverlas en diferentes formas y tamaños. Simplemente puedo ir con el dedo de la grilla desarreglada, y ahora son activos individuales y puedo cambiarlos. Y no cambian globalmente allí sus propios activos individuales. Entonces esa es probablemente una de las razones más fuertes y mejores para usar Adobe X'd. ¿ Esa es la herramienta de rejilla de repetición? Podrías hacer Diseño web? Súper duper rápido tu sistema. Digamos que queremos cambiar la canaleta Slack que dentro y en grupo la grilla, y ahora son individuales en los activos del menú. Entonces si quería hacer uno un poco más grande, puedo seleccionar éste y hacerlo Helvetica negrita y tener que sea un tipo diferente de sistema de menús y también con iconos. Podemos tomar un ritmo de copia Nikon ese ícono justo aquí, e incluso podemos cambiar el color del dedo del pie blanco. Entonces tenemos esto aquí donde puedes tener InTs Grady y Adobe X'd. Ahora que ese no era el caso antes. Pero ahora se puede argumentar para crear una forma básica. Ve a llenar y notarás que tienes una opción desplegable al hacer clic en tus relojes de doble clickers para que puedan hacer un color sólido, una radio o un radiante lineal. Entonces si quieres hacer un radiante lineal, puedes y también puedes cambiar la dirección de esto también. Entonces lo que queremos hacer con su ícono que tenemos en él guardó automáticamente los pequeños INTs Grady que tengo aquí. Queremos que eso aparezca. Iconos blancos eran para seleccionar nuestro icono en este interruptor remoto, el radiante a un color sólido, y ahí está su icono blanco. Y así, para las rejillas, lo que quieres hacer es seleccionar el tablero de arte superior, y cuando selecciones el nombre del tablero de arte superior, vas a tener un tipo extra de área de opciones aquí mismo en tu lado derecho. Va a ser grilla fría. Podemos hacer click en cuadrícula, y nos va a dar un diseño de rejilla de 12 columnas estándar con tipo de tu canalón estándar, y puedes cambiar la canaleta con para que puedas hacer que la canaleta con mucho más dramática o puedes apretarla y te das no tienen solo el diseño de columnas. También tienes un módulo cuadrado estándar modular. Supongo que podrías decir grilla donde solo tienes los cuadrados, lo cual podría ser útil cuando estás haciendo detalles de diseño muy finos. Pero me voy a quedar con ese diseño de 12 columnas. puede cambiar el color para que no sea el fuerte, por lo que puede seguir diseñando y no tener que interfiera con nada para apagarlo, seleccionar el nombre y simplemente desclip cred. Podríamos simplemente arrastrar una foto aquí mismo y luego redimensionarla mirando alrededor de las esquinas. Si solo quieres dar la vuelta de una esquina, sostén pulsado. Opta la tecla de opción, y solo podrías hacer una esquina a la vez para que puedas traer una foto así, donde podamos hacerlo en un contenedor el cual todo lo que debes hacer es crear una forma. Entonces digamos que tenemos la herramienta de bolígrafo y queremos crear una especie de, ah raro ob clasificadores de forma larga creando una forma, nada demasiado elegante. Podríamos volver atrás y editar las asas si quisiéramos. Entonces digamos que queremos arrastrarlo a ese tipo de forma extraña. Entonces lo que vamos a hacer es arrastrar la foto a cualquier forma, y tiene una cosecha para nosotros, lo cual es un poco agradable. Podrías hacer doble clic en la imagen para cambiar la posición o hacer clic fuera y cambiar toda la forma al mismo tiempo para poder traer fotos. De esa manera, podrías traer a un hombre usando cajas estándar. Podrías hacer esto. Puedes crear una cuadrícula de repetición, tener un diseño de imagen de tres columnas, y pueden arrastrar fotos justo en Boom. Y cuando crees una cuadrícula de repetición, pondrá la misma imagen en todas ellas. O puedes unde agrupar la cuadrícula y el ahora sus cajas individuales, y puedes cambiarlas para poder ver lo fácil que es usar Adobe X'd. Y ahora son elementos de caja individuales, y podemos agregar tipo y hablando de tipo tenemos una herramienta de tipo estándar. Podemos hacer click y arrastrar y crear un cuadro de área tipo si queremos tener mucha luz de tipo diferente . Entonces digamos que aquí tenemos mucho tipo. Hacemos nuestro cuadro de texto, pero tenemos nuestro cuadro de área tipo que podemos colapsar y hacer columnas de información. También puedes simplemente hacer clic en lugar de hacer clic y arrastrar para crear un texto de área. Boxeadores como este, podemos hacer click una vez y crear solo una línea de tipo. Entonces titular va aquí. Esto es genial para titulares, y luego podrías tomar este pequeño elemento y puede hacerlo más grande. O podrías hacerlo más grande aquí o hacer lo que yo hago. Y hay un poco de atajo que Ideo, que es desplazamiento de comando derecha e izquierda mayor que en menos de señales es Cat me ayuda a cambiar. Es solo atajo de teclado. Eso son titulares. Por lo que tienes dos cuerpo de tipo diferente de la herramienta de área de tipo. Entonces solo tienes una caja de tipo estándar también para titulares. Si quieres hacer manualmente saltos de línea en los titulares, puedes y puedes ir por aquí y cambiar el espaciado. Cambiando eso a 99 y alinearlo Así tienes tus herramientas de línea que son realmente buenas. Ayudarte a encajar en la cuadrícula. Entonces este es el muy, muy, muy básico de Adobe X'd. No es nada. Nada a Berlian son emocionantes. Vamos a estar haciendo un diseño realmente pulido aquí en un minuto. Pero quería dar a los que nunca han estado en Adobe X'd, ah, ah, la oportunidad de aprender algo de lo básico que hablaremos de los activos y crear son diferentes activos y también nuestros estilos de personaje y componentes y colores. Hablaremos de esa guerra en el proyecto, pero esto es lo básico. Entonces digamos que queremos crear una segunda página, que así sea como hacen clic en Menú uno y van a ir a una página diferente. Lo que vas a hacer es que vamos a usar la herramienta de tablero de arte, que es una de sus últimas herramientas que quedan para usar y solo tienes que hacer clic en la herramienta de tablero de arte. Y van a poder hacer clic y arrastrar y crear el tamaño que quieras, o puedes hacer doble clic cerca. Si hace doble clic, se copiará el mismo tamaño de tablero de arte doble clic o simplemente haga clic una vez y podemos crear tantos como quieras. Puedes crear todo tipo de sub páginas diferentes de tu diseño, y luego puedes enlazar todas estas. Eventualmente, eso va a ser en modo prototipo. No vamos a tocar esto en la sección muy básica va a hacer eso. Cuando lo hagamos, nuestro proyecto podrá hacer eso también con activos. Vamos a hablar de activos en el proyecto donde podemos vincularnos globalmente, crear estilos globales, colores globales. Entonces si cambias un color aquí, los cambiará en todas las tablas de arte al mismo tiempo. Entonces esa es una herramienta muy útil de Adobe X'd. Entonces ahora que hemos cubierto lo básico, vamos a meternos en nuestro proyecto. 52. Página de aterrizaje web en Adobe Xd: empezar: por lo que tengo un titular que vamos a estar usando para la página de aterrizaje. También tenemos este botón de video de reloj que de alguna manera necesitamos incorporar en esta mitad superior del diseño. Entonces empecemos a traer algunos de nuestros colores. Entonces tenemos nuestros colores por aquí que podemos agregar y estamos en el panel de activos, así que se llega a los activos haciendo clic aquí abajo en los activos iban a dar clic en los activos, y vamos a vincular algunos de estos activos. Vamos a traer todas nuestras paletas de colores que desarrollamos un ilustrador de adobe y solo vamos a conseguir un doble clic en nuestra muestra y agarrar ese código hexadecimal y traer el código hexadecimal o aún mejor, hacer eso uno por uno para todos esos. O podemos simplemente copiar pegar esto aquí y digamos que estos aire ya las muestreas. Entonces déjame simplemente crear vidas. Relojes de estos es conseguir la herramienta cuentagotas que estamos despegando de la frontera. Sólo vamos a tener un Phil regular. Por lo que todos estos sus vidas vigila y ve la herramienta cuentagotas para muestrear. Um, lo voy a poner en algún tipo de orden de color basado en el tono que son, podría seleccionar todos estos. Esto es lo que realmente es genial. Por lo que todas mis diferentes muestras seleccionadas que pueden hacer clic en este cartel de edición. Se va introduciendo automáticamente todos los códigos hexagonales aquí para nosotros. Todo lo que tenía que hacer es conseguir solo crear una muestra y luego dar click en agregar, y puedes agregarla a la lista. Entonces digamos que creo un nuevo color. Mike, quiero un color diferente para esto. Hagámoslo, Ah, otro tono más oscuro de azul. Entonces digamos que uno agregue esto que tendré que hacer es tener este seleccionado click en add, y lo vas a agregar a tus estilos globales para que siempre tengas acceso a tu paladar. O puedes hacer clic derecho y eliminarlo si ya no quieres ese color. Por lo que somos un poco más amplios trayendo nuestros activos lentamente. Entonces pensé, lo que hacemos es tener un fondo realmente brillante, vívido, vívido, colorido. De verdad quiero agarrar a la gente. No quiero usar un montón de blanco aquí porque realmente quiero agarrar a la gente y tener pasión y amor y montones de morados de puente profundo pasando. Entonces vamos a conseguir nuestra herramienta cuadrada y solo crear un fondo. Vamos a Click the Border y lo que podríamos hacer es tener nuestras paletas de colores aquí que podríamos seleccionar. Podríamos mandar esto todo el camino a la parte de atrás. Queremos probablemente hacer nuestro tipo blanco. Podríamos incluso agregar eso como un color blanco solo para que pueda seleccionar fácilmente ese color. No tenemos que ir hasta aquí. Este relojes. ¿ Y si le agregamos un ligero radiante a esta causa? Ahora mismo, es sólo un solo color plano. ¿ Y si seleccionamos a Phil y subimos aquí y en lugar de color sólido, hagamos un radio Grady int y plomo selector de colores. Entonces para el color superior que quería ser son de color muy brillante, vívido. Y luego por aquí, me gustaría que fuera nuestro color más profundo. Se va a tomar este correcto o el que va a estar por aquí y simplemente hacerlo un poco más oscuro, así como así, para crear una especie de ambiente rico así. Entonces sólo tenemos una radio, granulada va en nuestro tablero de arte, y ahora vamos a seguir adelante y a poner todo el texto básico dispuesto porque no quiero hacer demasiados gráficos hasta que averigüemos el texto, que es el número uno lo más importante con el diseño de maquetación y la web es conseguir ese texto en la posición correcta y el tamaño correcto primero. Entonces podemos sumar todas sus fotos e ilustraciones, así que nos falta nuestro logo. Entonces como aprendimos, podríamos simplemente copiadora logo en formato vectorial en Illustrator y justo y simplemente pegarlo justo en, queremos encontrar el tamaño adecuado para un logotipo, y es posible que necesites mantener pulsado el turno para que se escale dimensionalmente. Yo quiero asegurarme de que tengamos buen margen. No queremos tener un demasiado apretado o demasiado cerca del borde, así que vamos a tratar de encontrar su margen derecho, y es aquí cuando cambiar de ing en nuestras rejillas va a ser una gran idea. Entonces, seleccionar nuestros tableros de arte podría un interruptor en la cuadrícula. Este es nuestro estándar de 12 columnas. Disposición típica, ya ves. Así que voy a mantener esa canaleta predeterminada estándar empezar a encontrar formas de tipo de sacudir todo esto juntos, así que siéntete libre de activar eso tanto como quieras. Las rejillas realmente te ayudan a encontrar eso correcto. Posicionamiento. Adelante y agreguemos el sistema de menús. Vamos a hacer eso usando herramientas de reinicio de cuadrícula. Vamos a conseguir su herramienta tipo. Qué hacer menú Una vez que este es el elemento de menú uno, es texto muy grande, así que solo voy a reducir el tamaño. Podríamos ir y probar 22 puntos, y a veces esta es una ventana bastante grande del navegador. Esto es como 1920 píxeles, por lo que a veces es agradable hacer zoom para obtener una mejor perspectiva de tamaño. Vamos a traer eso. Entonces eso es tamaño de 22 puntos y voy a decir que quiero conseguirlo perfecto. Entonces usemos nuestro ferrocarril y vamos en lugar de una luz. Hagamos un ferrocarril medio y digamos que quiero repetir esto En lugar de tener que copiar y pegar, voy a usar nuestra herramienta de repito cuadrícula, pincha en repetir cuadrícula y vamos a arrastrarla y crear 12 Hagamos cuatro elementos de menú. ¿ Qué es eso un espaciado agradable. Entre ellos había 2 50 píxeles de espaciado, y podemos,por supuesto, por supuesto, hablar a lo largo de nuestra cuadrícula para encontrar la colocación correcta de nuestro menú. Como que lo tengas encima de pasar el rato por aquí. Yo quería un poco de chocar, pero quería ir más allá de esa canaleta. También nos arrastró para encontrar el punto central entre el logotipo y el tipo, y ahí está, ahí mismo, simplemente arrastrando hasta que tipo de clics en. Por lo que está nuestra disposición básica del menú. Dirá ¿Quieres tener algún tipo de líneas divisorias diagonales? Vamos a crear eso. Usando una herramienta de línea, iba a crear una línea muy simple para la que podríamos necesitar acercar. Esto está creando una línea recta simple. Podrías mantener presionada la tecla de turno para crear una línea agradable, simple, perfectamente recta. Hagamos una bonita gorra rodeada a eso y que sea nuestro color blanco. O podríamos hacerlo una especie de color blanco apagado tan amable de nuestro morado claro. No lo será si lo has hecho blanco. Competiría con el tipo, pero si lo hacemos un poco de ellos, un blanco apagado que coincide con el fondo, es un poco más ligero. No compite tanto, así que alejándose. Podría necesitar hacer eso. Vickers. Hagámoslo un peso de cuatro tiempos o incluso un tres. Podemos utilizar la herramienta de repetición de cuadrícula aquí otra vez para especie de salvarnos teniendo una copia. Todo esto, vamos a necesitar tres líneas divisorias. Y cambiemos la canaleta en esto también justo por ahí y podemos desarreglarnos la rejilla, y ahora son tratados como pequeños elementos individuales. Podríamos cambiar el espaciado aquí para que porque ahora mismo es igual espaciado entre cada uno . Pero nuestro tipo es un poco más largo. Entonces vamos a agrupar la grilla aquí. Y sólo voy a desplazar unos cuantos de estos elementos juntos para que no tengamos tanto espaciado. En realidad somos solo nuestras ideas, realmente conseguir el diseño en marcha para que no tengamos que ponernos tan técnicos. En este punto, realmente podemos conseguir que el diseño se apruebe primero, y luego podemos ponernos realmente técnicos sobre el espaciado y los píxeles y todo eso. Entonces agreguemos un pequeño ícono al hogar porque tenemos eso disponible. Y creo que los iconos y las indicaciones visuales siempre son útiles cuando se trata de dedo solo tener texto plano o tener un taco visual o icono con él siempre ayuda. Entonces vamos a conseguir nuestro ícono de casa. Adelante y hagamos esto blanco porque sabemos que queremos tenerlo blanco. Hagamos una muestra blanca. Entonces ahora cuando lo copio y lo pegue, ya es el color que nos gusta y solo lo voy a hacer más pequeño. Entonces vamos a traer nuestro ícono. Se está haciendo un poco más pequeño y chupar juntos justo por ahí. Ahora tenemos un pequeño icono de casa. Contamos con nuestro menú. Mira lo rápido que esto se está uniendo. Vamos a seguir adelante y hacer una pausa y vamos a hacer la foto a continuación. 53. Página de aterrizaje sitio web en Adobe Xd: fotos: antes de traer la foto. Hagamos una cosa más. Vamos a crear un Pero aquí vamos a querer tener un video de botón de reloj así que no queremos hacerlo más grande que el titular. El titular suele ser primero, hay haciéndolo un poco más pequeño. Las palabras empezaban a establecer alguna jerarquía de tipos, y podemos guardar todos estos y nuestros estilos de carácter cuando todos terminemos con la primera página . Por lo que cuando creamos todas las demás páginas, podemos adaptar fácilmente nuestros estilos y tamaños de personaje. Crea un botón. Simplemente vamos a conseguir una herramienta de rectángulo, crear un botón. Vamos a mandar esto hacia atrás en el sistema de capas y hagámoslo un color de alto contraste. Entonces si lo hiciéramos de este color claro que sale bastante bien. Pero está en la misma familia de colores, y así no tiene tanto contraste. Entonces tratemos de hacer este color melocotón que podría tener mucho contraste ahí. Vamos a tener que cambiar tal vez el tipo para que ese botón realmente, de verdad me salga. Realmente queremos que la gente vea el video. Hagamos algunas bonitas esquinas redondeadas a esto. No queremos nada demasiado dramático. A lo mejor una pastilla en forma podría funcionar o simplemente hacer alguna leve causa. De lo que fue popular se trata esto. En el pasado, me dan click fuera de la frontera, y ahora estamos empezando a ver más gente. Usted bordes rectos o pastilla. Tan dramático o no, ya no estás viendo a mucha gente usando eso entre forma de píldora. Entonces, o vayamos dramáticos o todo el camino. Entonces veremos qué estilo va a funcionar cuando empecemos a integrar algunas de las otras ilustraciones. Y podría ser el estilo redondeado funcionará. Pero hagámoslo solo por ahora. Queremos que esto sea agradable y audaz, o sabes que la espera podría funcionar bastante bien. Entonces hagamos que el botón sea un poco más pequeño. Entonces sólo tómalo ambos elementos. Incluso puedes agrupar elementos Estoy agrupando este botón creado. No hice la herramienta de área de tipo porque el tipo muy herramientas va a actuar de manera diferente cuando trato cambiar el tamaño del botón. Entonces ahora puedo hacer eso para cambiar el tamaño o puedo tomar ambos elementos y simplemente mantener pulsado turno para que escalen dimensionalmente. Por lo que desarrollamos una especie de tipo de letra que podemos usar para el titular entonces. Entonces veamos cómo es Pacifica. Y aquí es cuando tenemos que tener mucho cuidado aquí. Entonces es muy apretado. Entonces, aflojemos el espaciado entre los personajes de aquí en nuestro panel de texto. Y lo que estoy encontrando aquí es que hay mucha competencia entre el logo y el titular , así que podemos o hacer solo una palabra coincidiendo con el titular de Pacific Oh, y hacer el resto de cara apretada muy simple. O podemos tomar nuestra tipográfica ferroviaria y simplemente usar más de un avión. más gruesa, Caramás gruesa, apretada. Espera. Nunca quieres competir. Nunca se quiere tener elementos peleando entre sí. Entonces si usamos extra negrita y luego apretamos nuevamente el espaciado, así que digamos que sí. A lo mejor 104 Algún buen espaciado que lo hace menos competitivo con los combates, porque esa es una parte muy fuerte del logo. No queremos competir con ella, o se puede hacer una palabra esa Pacific. Ah, si puedes hacer que funcione. Pero por ahora mismo, vamos a mantenerlo simple. Podría haber otra oportunidad para que trabajemos en ese Pacífico. Ah, no se requiere. Pero es un activo u otro tipo de letra que hemos elegido que podemos usar. Entonces vamos a traer una ilustración o una foto o algún tipo de elemento lo que quiero traer ya que tenemos esta burbuja realmente genial pensé que sería necesario traer esa burbuja. Y aquí hay una especie de refinada que ya tiene con el tipo de algunos colores que me gustan Y, sabes, acabamos de crear eso usando adobe illustrator. Lo que puedo hacer es copiarlo y pegarlo, y quiero hacerlo grande tipo de convertirlo en un elemento de fondo aquí, y solo lo voy a enviar hacia atrás en el sistema de capas para comando corchete izquierdo. Envíalo de vuelta todo el camino de vuelta aquí. Entonces solo quiero algo así resaltar realmente el logotipo, pero también el titular. Y así realmente destaca entre este Grady int C. Así que es capaz de tipo de definirlo realmente. Quiero traer una foto de gente enamorada, algún tipo de foto para atar todos estos elementos juntos y como que quiero usar esa misma forma redondeada. Entonces voy a ser ilustrador. Y siempre que tengas forma libre Grady int herramientas y estás usando ese tipo de efectos especiales e ilustrador a veces cuando copias y pegas para dar forma en su no se va a permitir usarlo como contenedor de fotos como podemos otras formas que crean en Adobe X 'd Vamos a hacer este tipo de forma más de avión y es un poco de forma diferente. Entonces estamos teniendo que Diferentes formas no eran sólo copiar, pegar la misma forma. Sólo voy a copiar esto. Es de un color sólido, no hay efectos en él, y vamos a poder usar esto como contenedor. Entonces tomemos la foto que ya escogí en píxeles y la arrastraré justo dentro, y va a seguir adelante y recortarla para mí, y puedo hacer doble clic en esto y tipo de cambio. El tipo de posicionamiento tiene un tiro más apretado en los tortolitos. No necesitamos las montañas tanto como necesitamos a la gente. Ese es el punto de conexión emocional justo ahí. Ahora podemos hacer click en esto y tipo de arrastrarlo aquí mismo. Me encantaría que estos dedos se superpongan de alguna manera. Ahora tenemos estas formas superpuestas, y podemos añadir sombra a esa capa a la capa de fotos. Si quisiéramos. Hagámoslo como una distancia más amplia para que puedas verlo. Está en mi sección de sombras para que sea un poco de sombra ahí, así que hay una especie de lo básico dando forma. Hagamos de esto una foto más ajustada, y también podemos cambiar un poco la forma aquí. Poco flexibilidad con eso ahora, como cómo se desangra este tipo de sangra Así parece que es continuo en lugar de solo como tener este sangrado perfectamente en forma de cultivo. Sangrarlo tipo de le da este aspecto continuo. Entonces este botón, no estoy convencido de que el negro sea la elección de color correcta porque tienes estos hermosos Hughes es colores de tono joya, thes colores atardecer, y tienes este negro y simplemente se ve aburrido. Veamos si no podemos encontrar un buen color que vaya a quedar bien en el Melocotón y además complementar algo del morado. Bajemos por nuestra lista. Aquí tenemos este morado profundo que podría funcionar muy bien, así como eso y también los iconos los usan. Los iconos son fantásticos. Las formas de agregar puntos de contacto adicionales para los usuarios son indicaciones visuales para los usuarios. Entonces ver video. Simplemente pasamos a tener ahora fantástico pequeño icono de juego aquí y seguimos cambiando ese dedo todo blanco, porque creo que va a estar continuamente en todo blanco. Hagámoslo del color morado que ya tenemos, y creo que eso realmente ayuda a sacarlo. También podemos agregar un poco de sombra a nuestro botón aquí, hacer un poco desenfoque la pequeña dimensión de nuestro botón. También podemos hacer lo mismo a nuestro tipo. Y cambiémoslo a cero y solo tengamos un poco de desenfoque en eso. Nada grande, nada enorme. También podríamos cambiar la opacidad de cualquier objeto. Entonces digamos que pensamos que eso es demasiado fuerte. Podemos cambiar el en la apariencia. Seleccionamos el objeto. Podríamos cambiar la apariencia, la opacidad en cualquier momento para hacerla menos fuerte. Pero queremos reducir la capacidad, este pequeño, cambios sutiles. Por supuesto, necesitamos alternar en nuestra red de vez en cuando y especie de ver cómo todo se está alineando . Entonces lo hay. Se está uniendo. Debilitar agrupar estos elementos juntos, podemos enviarlos alrededor, cambiar el tamaño. Es una gran página de aterrizaje. Tenemos un llamado a la acción. Tenemos una jerarquía de tipos clara. El llamado a la acción dará clic en un video el cual aparecerá para que puedan ver un video y obtener una buena introducción del proceso y del sitio web. Y eso es realmente lo que queremos hacer es llevarlo al video porque el video se convierte realmente bien. Entonces en cualquier momento podemos conseguir video en la parte superior de un sitio web, el mejor video siempre se convierte realmente bien porque si puedes contestar tantas preguntas con un simple video de un minuto en lugar de tipo y fotos, puede tomar muchas páginas para explicar lo que fácilmente podrías explicar en video. Por lo que el video es realmente importante para este diseño. Es el principal motor de este diseño 54. Página de aterrizaje web en Adobe Xd: detalles de la página de aterrizaje: tener en nuestra página de aterrizaje. tenemos que describir su proceso también en texto. No sólo tener el video y eso es todo. También necesitamos un botón de registro a Necesitamos poder conseguir que la gente vaya al sitio web principal realmente puedan iniciar sesión y crear una cuenta. Entonces una cosa que queremos hacer es que este sea scroll herbal porque ahora mismo es solo la mitad superior de la página están por encima del pliegue, como la gente de la industria lo llama y queremos extender esto hacia abajo. Entonces vamos a seleccionar el tablero de arte. El nombre nos va a dar la oportunidad de extender esto. Va a ser capaz de duplicar el tamaño y tenerlo Scroll. Podríamos hacer sitios web de paralaje. De esta manera puedes hacer que se desplace todo el camino hasta la parte inferior. Se podría ver este ejemplo aquí mismo de tipo de uno en el que tipo de ustedes se puede desplazar todo el camino hacia abajo, así que sólo vamos a necesitar probablemente duplicar la página porque queremos tener una sección de sobre el proceso y luego un botón. Por lo que no necesitamos tener nada demasiado tiempo. Entonces vamos a sumar un poco de nuestro proceso aquí. Y tenemos algunos iconos que podemos usar para ayudarnos a explicar el proceso. Y tenemos nuestra impresionante pequeña ilustración que queremos como agregar. Eso es como un poco de sabor. Tomemos el que hice antes. Es una especie de colores un poco más claros porque cuando lo pongo sobre el fondo blanco, creo que se mezcla en muy bien. Entonces sólo voy a traer esto encima. Puedo copiarlo y pegarlo justo en Adobe X'd. Y tenemos una bonita ilustración, realmente ayudó a dibujar a los usuarios en lo que voy a hacer. Se llegó a hacer turno de mando. Estoy sosteniendo el mando y el turno y luego arrastrando. Si arrastras un elemento de varias capas o agrupado desde Illustrator y no mantienes esas teclas, les cambiará el tamaño un poco funky. Por lo tanto, basta con hacer desplazamiento de comando y luego arrastrar lo hará dimensionalmente si se trata de un objeto de múltiples capas en Illustrator. Por lo que ahora necesitamos tener un diseño de tres columnas. Tenemos un proceso de tres pasos que tenemos que hacer, hay que explicar. Entonces sigamos adelante y creemos nuestro diseño de tres columnas. Pero una cosa que quería hacer primero es seguir adelante y copiar esto. Quítate la sombra y traigamos nuestro morado profundo y necesito tener un titular aquí. Entonces hagamos nuestro proceso y estamos empezando a desarrollar que la jerarquía visual y las jerarquías de tipo es exactamente lo que estamos haciendo. Estamos estableciendo de qué tamaño de fuente necesitamos para un titular. De qué tamaño de fuente necesitamos para el siguiente título. Y lo estamos haciendo ahora mismo. Entonces, no vamos a competir con el titular principal. Hagamos un lindo, um, medio, tal vez hasta una luz. Es hacer una luz y hacer un poco más pequeño. No necesitamos que sea del mismo tamaño que sus titulares principales. Entonces este es nuestro H uno, nuestro titular principal. Esto probablemente podría ser Rh dos, que es el titular de las cosas después del titular principal, por lo que establece esa jerarquía de tipos. De acuerdo, así que hagamos nuestro diseño de tres columnas. Entonces creo que me gustaría tener iconos con círculos en él, así que necesitamos crear nuestros elementos tipo y una forma en que pudiéramos hacer esto es que podríamos hacer repito grilla y hacerla más fácil en nosotros mismos. Entonces vamos a probar eso. Tenemos nuestro un pequeño ícono aquí, un tipo herramienta de área tipo herramientas. Vamos a dar click y arrastrar a sobre el área que queremos tener iba a escribir en nuestro texto. A lo mejor es H dos. Tomemos un H tres y tengamos un titular aquí. Por lo que tomar la prueba es el titular principal de esta columna. Hagamos eso aún más pequeño. Entonces hagámoslo. Vamos a probar algunas tallas aquí. Probemos 45. Probemos 45. Probemos una alineación central y necesitamos establecer alguna copia corporal o algunas copias de párrafo , así que esta será tu P. Si estás acostumbrado a codificar en CSS, esta será tu P o tu copia principal del cuerpo. Por lo que queremos hacer. Esto puede ser un gris claro, y queremos hacerlo significativamente más pequeño. Va a ser tu más pequeño, algunos de tu tipo más pequeño en la página web. Va a ser una especie de lo que leerías párrafo cálido, y vamos a colapsar el espaciado en eso. No necesitamos tanto espaciado y Ajustemos nuestra columna. Por lo que estamos empezando a establecer aún más ese parque tipo. Tenemos un H uno y H dos y H tres ya en copia de párrafo. Porque este tipo talla, creo que es 33. Eso es bastante grande. Ya veremos si no podemos hacerlo 25 y luego colapsó eso Así que sólo probando algunos tamaños fuera del tamaño correcto. Hacer la línea central. Tienes algunas opciones de alineación aquí arriba cuando selecciona múltiples objetos a una línea central. Y hagamos nuestra útil herramienta de rejilla de repetición dandy. Repita esto dos veces. 12 colapsan las columnas. Entonces, vamos a meter sus iconos dentro. Por lo que para tomar la prueba. Estaba mirando los iconos que desarrollamos en la clase y estaba pensando en unos que realmente ayudarían a complementar el ítem. Por lo que el primer paso es hacer una prueba. Entonces, ¿qué? Creo que prueba. Pienso en un lápiz, algo así. Entonces lo que voy a hacer es que voy a hacer la vida realmente fácil para mí. Entonces voy a asegurarme de que voy a ir al camino. Voy a delinear el trazo en esto porque cuando lo traemos sin el trazo, delinear. Te vas a ir a poder seguir cambiando el trazo en Adobe X'd, pero solo hace que el re dimensionamiento sea un poco difícil. Entonces solo estoy delineando el trazo. Consigue una copia. Haz eso blanco. Por supuesto, ya tengo esto para ti en esta guía. Estamos haciendo todas estas blancas para que fácilmente pudiera traerlo. Hagamos esa copia en blanco y peguémosla para tomar la prueba. Arrástralo justo aquí. Vamos a hacer lo mismo y encontrar iconos para la siguiente etapa. Entonces necesitamos encontrar el ícono para la segunda etapa, cuál es? Buscan en la etapa de la base de datos, así que ah, la lupa funcionaría solo a la perfección para eso. Copiémoslo y peguémoslo. Y luego, por último, inicia una conversación que sería tu pequeña burbuja de habla Micklewhite, Copiar y Pegar. No me importaría hacer esto un poco más viejo, así que vamos a ver si no puedo encender una luz. Hagamos que ese regular solo un poco de miedo de que no se vaya a ver muy bien desde distancia. Entonces hagámoslo y vamos a hacer sólo algunos pequeños ajustes de tipo. Hagamos de eso un 40. Tan solo establecer su tipo son claves. Ahora es cuando lo hacemos así. Entonces estamos empezando a que algo vaya aquí. Déjame ver si puedo agregar un poco más de contraste que va a sacar esto. Hacemos nuestra grilla, asegurarnos de que todo esté alineado perfecto. Y vamos a añadir un poco de pop de color aquí abajo. Podríamos simplemente copiar y pegar disco radiante, bajando abajo. Se está haciendo un poco más ligero. Podríamos hacerlo de este color o de este color sólo tipo de traer un poco de color que continuaría. O eso sería un pie de página. Había tenido alguna información de contacto de pie de página ahí, y me gusta especie de este look redondeado. Y es una especie de tema continuo continuo a lo largo de todo esto. Entonces no tengamos bordes rectos aquí. Casi me pregunto si podemos angular esto sólo un poquito. Por lo que solo en ángulo esta parte superior, expandiéndola solo un poquito de ángulo. ¿ Qué lo iguala con el spot en uno? Sólo un poco de ángulo. Nada demasiado emocionante. Algo para sacudir ese look perfecto de cuadrícula sólo una especie de darle un poco de blancos y tal vez ir a la vuelta de la esquina sólo un poco más en esto. Así que sólo tipo de ver el diseño general y capaz de tomar algunas decisiones más de diseño ahora que estoy viendo todo juntos asegurándome de que tengamos suficiente margen para todo nuestro tipo. Entonces aquí es con lo que terminamos muy rápidamente pudimos armar todo esto. Tenemos un menú, tenemos una foto, un titular. Tenemos algún tipo Harkey establecido, y ahora podemos empezar a armar todo. Entonces tenemos todo el color configurado, y ahora queremos seguir adelante y configurar nuestro tipo Arche para que no lo hayamos configurado. Entonces, ¿cómo lo guardamos para que cuando empecemos a crear otras páginas, sea muy fácil hacer clic y obtener el mismo tamaño exacto en cada página. Entonces lo que queremos hacer es tener estilos de carácter aquí. Vamos a añadir esto de la misma manera que hicimos nuestros activos o activos de color. Entonces digamos que queremos guardar esto. Tendríamos que ese titular fuera exactamente como es. Vamos a destacar ese titular y dar click en añadir a estilos de personaje y lo va a sumar ferrocarril 107 puntos. Entonces si tengo otra tipografía, puedo dar click en ella. Automáticamente lo hará del mismo tamaño para que podamos volver a titulo este. A mí me gusta hacer H uno. Ese va a ser tu gran titular, H uno. Entonces ahora necesitamos su edad a la que va a ser creyente proceso uno justo aquí. Vamos a añadir eso. Y luego tenemos un H tres, que se hace un poco más pequeño, que está justo aquí. Entonces voy a destacar eso y en ello. Y eso va a ser H tres. Entonces solo estamos estableciendo esto para que cuando hagamos otras páginas, tengamos todo esto establecido. Cuando el desarrollador quiera saber de qué tamaño tipo de letra usar para h dos, puedes decirle todo esto. Podrías decirle los códigos hexagonales. Podrías decirle también las tallas. De las tipografías. Esta es nuestra copia corporal aquí mismo. Entonces vamos a tener esa llamada que p para párrafo, básicamente tu copia corporal y diseño de impresión, pero diseño Web la Collopy. Tengo algún tipo de parque muy básico. Él puede seguir adelante, seguir adelante con aún más. Pero creo que esto es probablemente un buen comienzo. Tenemos nuestros colores. Tenemos establecida nuestra jerarquía de tipos. Incluso tenemos componentes que llegarán a continuación, que es guardar iconos y vincularlos a todos. Para que no tengas que sentarte ahí y cambiar cada ícono. Si quieres cambiar el color de un icono, lo cambiará globalmente. Llegaremos a eso a continuación. Y una cosa que realmente queremos asegurarnos de que sumamos, es nuestra acción final llamada. Nuestra primera acción llamada es Ver un video, pero queremos convertirlos a un cliente. Por lo que necesitamos tener nuestra última llamada al Botón de Acción y va a ser inicio. El proceso ahora era creador Button. Tomemos hasta el mismo que tenemos aquí. Hazlo a través de la parte inferior aquí. Esta es una especie de donde estamos vendiendo, teniendo o vendiendo lenguaje aquí. Y cambiemos sus antecedentes a porque no quiero que esto compita. Entonces hagamos una radio. Grady en por este colapso es un poco. Demos click en Phil y hagamos una radio Grady Int. Y usemos un par de sus colores. Aquí, llévate su herramienta cuentagotas veríamos si no podemos probar ese melocotón, sino también probar un color Richard más oscuro especie de conseguir un poco radiante para ayudar a salir. Y ahora podemos cambiar bastante el color de tu botón. Yo estoy decidiendo quedarme con mi tipo, son clave y pegarme con H dos. Cómo es. Lo haces un poco más pequeño. Esto podría ser un que podríamos ahorrar. Este es el tipo de botón un oleaje. Entonces si queremos agregar, este es un estilo de carácter y decir llamado Acción o botón. Entonces cambiemos esto de nuevo a su morado de alto contraste, así como así. Entonces terminamos haciendo el texto un poco más pequeño, y eso está bien. Entonces aquí está nuestra página web final. Tengo todo bloqueado que necesitábamos para el cliente. Es nuestra página de aterrizaje básica. Lo que también quiero mostrar al cliente es lo que sucede al hacer clic en ver el video y también lo que sucede al hacer clic en el inicio. El proceso ahora botón, porque muchos de estos botones terminarán yendo a la página web principal. Se trata de una página de destino, por lo que queremos mostrarles qué sucede cuando sucede ese proceso y también cómo se ven las páginas de destino. Entonces esto es lo que vamos a terminar creando. Vamos a terminar creando un par de páginas diferentes, así que esta será una especie de tu pantalla pop up de video, y esto será lo que pase cuando hagas para iniciar el proceso. Ahora vamos a ir al modo prototipo y adobe X T. que el cliente pueda tener un tipo de sitio web de prueba riel clickable para que puedan ver qué están diseñados, realmente se parece al final. 55. Página de aterrizaje sitio web en Adobe Xd: Pop up up up: primer enfoque en lo que va a pasar cuando den clic en el inicio El proceso. Ahora va a haber una pequeña caja pop up y van a poder llenar alguna información muy básica y dar click en Regístrate para que puedan iniciar ese proceso. Entonces lo que queremos hacer como queremos duplicar este tablero de arte Así que vamos a subir en la parte superior y seleccionar el nombre que vamos a copiar. Sólo hazlo un comando, ver, Y luego un comando V pegar y estamos creando una copia. Pongamos un poco de espacio entre los dos, y lo que vamos a hacer es crear la página de aterrizaje, ya que se vería como después de presionar el botón. Entonces queremos que una cosa que queremos hacer es que queremos tener todo esto desmayado y queremos tener una pequeña caja pop up que aparece aquí mismo. Entonces una forma de gris esto es que vamos a tomar la herramienta cuadrada, hagámosla blanca. Y hay algo llamado desenfoque de fondo aquí mismo. Entonces vamos a hacer clic en este desenfoque de fondo, y tiene un desenfoque, todo detrás de él, y puede cambiar algunos de estos ajustes para hacerlo más brillante o para hacerlo más desenfocar o hacerlo más oscuro, nosotros lo van a hacer un poco más oscuro donde van a conseguir una pequeña caja pop up. Entonces eso es lo que vamos a diseñar ahora es una pequeña caja pop up aquí mismo. Y hagámoslo ese mismo ingrediente que teníamos antes. Por lo que incluso podemos tomar la misma plaza que teníamos antes. Y solo usa eso y ajústala de nuevo a su plaza. Eso nos salvará de tener que hacer eso, Grady. Y de nuevo, claro que podemos dar click y cambiar el Grady en un poco. Aquí, que sea un lineal. Podemos redondear los bordes aquí de una pequeña caja pop up. Yo quería poner algo de nuestro tipo aquí primero. Entonces, ¿qué va a ser tipo de click en esto? ¿ Cuál va a ser el titular principal aquí? Contamos con nuestro tipo de titular principal. Podríamos simplemente copiar y pegar esto o tomamos nuestra herramienta de tipo. Asegúrate de tener nuestros estilos h one de carácter cuando podemos adaptar el mismo titular que nuestra portada . Entonces tecleemos aquí nuestro texto. El amor está a la vuelta de la esquina. Centremos eso alineemos y colapsemos el espaciado. Y si necesitamos hacer un tamaño diferente para esto, no tenemos que usar un Chuan. Podemos crear un tamaño diferente para esto si pensamos que es un poco demasiado grande y podríamos hacer un nuevo estilo de personaje si quieres. Si quieres tenerlo sea un tamaño de titular de cuadro pop up puedes tener todo. Por lo general, al final de una página web, tendrás 20 o 30 estilos de personajes diferentes, todos de la diferente calidad para él. Entonces tipo de botón, tipo de botón grande, así que no sientas que estás atascado con solo 81 H dos h tres y párrafo. Haces todo tipo de estilos de personajes diferentes. El amor está a la vuelta de la esquina y tener un poco de sombra ligera aquí. También vamos a tener un botón de apuntar. Vamos a crear un botón de inicio de sesión justo aquí. Hagámoslo ese color melocotón para que coincida con algo que hicimos antes. A lo mejor es una redondez muy leve a la misma, no mucho en absoluto. Apenas un poquito y van a necesitar llenar algo así que va a ser una forma muy sencilla de dos objetos. Hagamos que nuestra copia corporal seleccionada P, y solo queremos hacer un poco de relleno de burbuja y una herramienta de rectángulo. Esto puede ser una forma de píldora si queremos que sea así. Y recuerda cuando hablamos de la usabilidad y la sección de teoría, la sección Teoría del Diseño Digital. Hay una accesibilidad menos de lo que hablamos de cómo algunas personas ponen el nombre dentro de la burbuja. Pero es mucho más fácil para personas especiales con formas muy cortas poder tener el nombre anterior. Entonces vamos a hacer justamente eso. Acabas de duplicar este nombre, y probablemente el correo electrónico sería dos cosas muy importantes para obtener de ellos. Añadamos un poco de pizazz a este botón estaba haciendo un poco más ancho. Va a ser una caja pop up, así que vamos primero adulto X. Podríamos hacerlo fácilmente usando la herramienta de línea. Amplíe y dibuje Simple X. Eso va a ser un blanco, y va a tener una especie de gorra alrededor y convertirla en un tamaño bonito, grande, grueso. Hagámoslo ocho o nueve. Se va a copiar y pegar y reflejado se están moviendo hacia el otro lado, creando una X simple podría hacer diseño de iconos y un Doobie X'd. No es del todo tan bueno como ilustrador, pero es posible porque tienes una herramienta de bolígrafo y tienes tipo de estas herramientas básicas de trazo y forma fue creando un tipo X simple de los son mismos redondeados, estilo en forma de píldora que hemos estado usando Grupo que juntos como elemento. Y vamos a asegurarnos de que esto también es incluso tener lo mismo en cada lado. Traigamos a nuestros personajes. Entonces vamos a Adobe Illustrator. Vamos a desarreglarlos. Ya son personajes individuales, así que vamos a traer uno a la vez lanzándola. La gente parece que corre el uno hacia el otro, queriendo conocer, queriendo juntarse, amantes que están separados. Entonces es una especie de contar un poquito de una historia ese tipo de juntarse. Me encantaría poder interactuar un poco algunos de estos, así que tal vez tener una pierna, salir o la mano superponer algo, algo para agregar un poco de interés visual así. Y digamos que queremos agregar un poco de fondo porque tenemos este tipo de gráfico que es algo genial, este pequeño fondo redondeado. Hagamos lo mismo. Pero aquí abajo, vamos a hacer la herramienta de pin para éste. Simplemente estamos creando tipo de esas formas bien, aparecen formas redondeadas. Y hagamos de eso un color más claro. A lo mejor este color, y enviarlo hacia atrás en los sistemas de estratificación. Agregando un poco de papa, Papa color y pizazz ahí algún tipo de interés visual. Trata de no hacer que parezca demasiado ocupado para algo pequeño. Y ahí vamos. Tenemos nuestra pequeña caja pop up donde se pueden inscribir y como que tenemos nuestra primera página desarrollada, y eventualmente vamos a vincular estos se meten demasiado en el prototipado porque se puede complicar un poco más. Y realmente estás tratando de establecer el tono y el sistema de diseño aquí para todos. Y cuando te metes en U X, tú diseño y resulta que doy una clase sobre eso donde creamos 50 tableros de arte diferentes y los vinculamos todos juntos y hacemos tipo de este sitio web totalmente funcional, se aleja un poco de la gráfica diseño y un poco más en el lado del diseño de tu eres tú X experiencia de usuario. Entonces solo quiero tener cuidado de no cruzar demasiado hacia el desarrollo Web. Pero sí queremos hablar de crear otras páginas y vincularlas. Entonces vamos a hablar de lo básico a la hora de vincular las cosas. No vamos a llegar a profundidad en este curso en particular. Por lo que tenemos dos sitios web diferentes. ¿ Cómo los conectamos? Entonces lo que vamos a hacer es que vamos a cambiar. Hemos estado en modo diseño todo este tiempo. Vamos a cambiar por los cuatro por primera vez al modo prototipo. Entonces estamos cambiando al prototipo Mo simplemente cambiándolo justo arriba en la parte superior. Y ahora vamos a poder vincular a estos dos juntos. Entonces lo que puedes hacer es hacer click en tablero de arte y puedes Lincoln toda la página web sobre. Entonces si hago clic en cualquier parte de esta página, solo va a cargar automáticamente la siguiente página. Pero lo que quiero hacer es tenerlo vinculado a un solo botón. Por lo que cuando se desplazan hacia abajo en la página web, hacen clic en este botón, irá a este módulo pop up. Entonces esto es lo que vamos a hacer es que vamos a seleccionar sólo el botón y nos va a dar este pequeño indicador de flecha que vamos a poder hacer click y arrastrar hacia cualquier parte de este tablero de piezas. Entonces eso va a cargar esta página a continuación. Entonces vamos a ver cómo se ve eso. Y puedes dar click en tu conexión aquí en cualquier momento y a la derecha, tu discutible. Vea qué tipo de conexión es. Tienes un par de opciones diferentes. Un tap es básicamente un click, por lo que hacen clic en cualquier lugar de ese botón justo ahí en el botón. Si hacen clic en tap, se cargará. El siguiente arrastre de pantalla va a ser más para ábside móvil. ¿ Dónde vas a estar arrastrando un elemento? Entonces no vas a usar eso tanto para esto. Por lo que prácticamente tienes tap y hay un par de acciones que podrían tener lugar. Ahí hay auto animate, que tipo de le da una sensación más animada. Hay superposición, que tipo de simplemente lo mezcla, y hay transición que simplemente lo transitará, y vamos a probar algunos de estos. Pero quiero probar auto animate para éste, así que tenemos tap, que básicamente es click auto animate, que animará la siguiente página entrando. Esta es una especie de cómo transita entre cada página, cómo se ve. Y podrías cambiar la duración del tiempo que tarda en pasar de uno a otro. Entonces solo voy a hacer un segundo por ahora, especie de ver cómo se ve eso y eso es todo. Entonces para probar esto, vamos a presionar el botón de reproducción aquí arriba. Va a jugar nuestro sitio web básicamente. Entonces voy a dar click derecho en la parte superior de mi tablero de arte. Quiero empezar aquí mismo, dar click en play, click en play, y aquí está nuestra vista previa de nuestra página web. Adelante, hazlo todo a pantalla completa. Eso es lo que se va a ver cuando lleguemos a la página. Podríamos desplazarnos hacia abajo, vamos a hacer el resto de nuestro tablero de arte y digamos que queremos hacer click en. Tenemos este enlace ahora, así que cuando la tenga de vuelta, notarás que está vinculado. Empecemos el proceso ahora, y va a aparecer nuestra caja. Entonces ahora el único tema es que esto no se vincula atrás, así que no puedo hacer nada. Estoy atascado. Quiero poder hacer click en eso y volver a la pantalla anterior. Eso no es problema en absoluto, porque podemos hacer click en esta pantalla. Traigamos aquí nuestra X y tenemos la oportunidad de hacer esa flechaita. ¿ A dónde vas a llevar esa flecha? Arrástrelo derecho de nuevo a este tablero de arte. Vamos a hacer lo mismo, el clic o toque en él. Va a hacer auto animate y podría tardar un segundo en transitar hacia el otro lado. Y eso es todo. Entonces ahora que presionamos play, vamos a volver a nuestro primer tablero de arte y presionar play scroll hacia abajo click en inicio Proceso ahora va a pasar a ese próximo dartboard, y luego solo vamos a hacer clic en esto y Scott una transición de vuelta dedo del pie nuestras tablas de arte anteriores. Realmente se puede ver cómo se puede enlazar sitios web y crear una especie de un poco de una experiencia interactiva. Esto no codifica el sitio web, pero te da un gran ejemplo de cómo podría verse cuando está recubierto 56. Página de aterrizaje web en Adobe Xd: modo prototipo: Entonces lo que quiero hacer es mostrarte cómo crear esto. Por lo que tienes esos dos pequeños círculos que se juntan cuando se ponen por primera vez en la página Web , Es tipo de muestra al desarrollador qué tipo de animación estás buscando. Entonces vamos a hacer eso ahora mismo. Lo que vamos a hacer es copiar y pegar este tablero de arte. Tengo que volver al diseño. Es así como podemos trabajar con tableros de arte. Y vamos a copiar esta primera página de aterrizaje y pegarla. Voy a pegar y ponerlo aquí mismo. Tenemos una copia de esto. Entonces esto es lo que vamos a hacer. Vamos a llamar a esta llamada de animación. Esta página de inicio es realmente agradable nombrar a sus tableros de arte y llamar a esta llamada a nuestro registro. Entonces cuando tipo de esto nos ayuda mucho cuando los nombramos. Entonces esto es lo que vamos a hacer. Entonces cómo funciona auto animate mientras toma la primera pantalla, y cuando la conectas a la segunda pantalla y tienes auto animate entre las dos pantallas, tomará el estado del 1er 1 y lentamente animado para llevarlo al estado de la 2do 1 Entonces, por ejemplo, digamos que muevo lo triste. Quiero que yo quiera que esto se deslice y podría necesitar que Teoh cambie la parte superior aquí de estos. Y digamos que quiero que esto se deslice. Por lo que podría necesitar poner un poco más de espacio entre mis tableros de arte, y quiero que esto se deslice. Entonces quiero que esto se deslice dentro y se deslice hacia fuera. Podríamos incluso hacer el logo, también, pero mantengamos esto muy sencillo. Entonces todo lo que hice fue deslizar esos dos elementos y se van a juntar de esta manera. Entonces volvamos a nuestro modo prototipo, y eso los vincula juntos. Vamos a vincular este tablero de arte todo el camino para el 2do 1 Vamos a hacer un par de cosas diferentes aquí. Entonces en lugar de tap, ahora tenemos algo llamado Tiempo. Entonces, ¿qué pasa con tap? Tengo que hacer clic en la página Web para poder conseguir que la transición suceda, pero si hacemos tiempo, va a suceder automáticamente después de que ocurra cierta cantidad de tiempo. Entonces digamos que sí tap. ¿ Y tú auto animarías? Adelante y juguemos. Vamos a dar click en este tablero de arte y jugar. No va a empezar automáticamente a animar. Tengo que hacer clic y luego anima. Entonces para cambiar eso quiero bajar al tiempo y vamos a tener cierta cantidad de tiempo suceda. Por lo que el retraso podría ser sólo parciales muy pequeños de un segundo 2.4. Y podía jugar con los ajustes y acostumbrarse a tipo de cómo funciona la longitud y la duración. mí me gusta tener una larga duración agradable porque hace que la animación sea más larga y la hace más dramática. Entonces voy a escribir en 1.5 segundos y tienes diferentes opciones de flexibilización. Nos hemos chasqueado, aliviando esa flexibilización. Es sólo la forma en que funciona el tipo de animación. Se puede chasquear un poco. Puede ser rob escuela, dejarla en el chasquido por defecto. Entonces ahora que lo tenemos a tiempo, auto animate, veamos cómo se ve. Vamos a dar click en eso y jugar Lo hizo automáticamente, y tenía este bonito rebote a ella, ¿no? Entonces supongo que eso es lo que hace el snap. Por lo que has chasqueado. Entonces conseguimos un lugar en el que entra, especie de retrocede un poco de ese punto final. Entonces ahí vamos. Y ahora podríamos desplazarnos hacia abajo y todo sigue ligado porque ahora va a ir a ese próximo dartboard, y luego podemos cerrarlo y volver al tablero de arte original. Y en cualquier momento que quiera volver a ver eso, solo tienes que dar click en play. Podría ver la animación diapositiva en. Fue una gran manera de tipo de animación de espectáculo con tus diseños también. Entonces no todo es solo estático. Entonces tenemos una última cosa que hacer, Y eso es lo que pasa cuando haces click en el reloj. Ahora video que hacer. Lo que vamos a hacer es copiar esta página principal y vamos a pegarla, y vamos a sacarla a la luz. Top es lo que quiero hacer es mostrar caminos diferentes. Por lo que ahora mismo pueden hacer clic en el video del reloj ahora y subirán aquí. Son ellos Click son el proceso de inicio ahora y bajan por aquí. Por lo que tipo de empezar a configurar este flujo de usuario y se complica cuando se empieza a hacer como un diseño de aplicación móvil. Se podía ver lo complicado que es ese flujo de usuarios. Pero me gusta que tipo de tenerlo configurado de esta manera. Por lo que se puede decir, Bueno, el usuario puede ir por este camino donde puede ir por un camino diferente de esta manera. Simplemente estás colocando ahora las tablas de arte y fácil de digerir para ti para que puedas realizar un seguimiento de todas las diferentes formas y pasadas que los usuarios pueden ir. Entonces digamos que este es el video de reloj uno. Entonces solo vamos a copiar y pegar este tipo de área oscurecida, que no tenga que volver a hacerlo. También podríamos probablemente traer nuestro botón A little X y querer tener una pequeña caja pop up . Entonces solo vamos a crear. Voy a volver al diseño para que podamos recuperar una especie de nuestros elementos, quiere una especie de cuadrado blanco, tal vez alguna ligera redondez a ella. Hagamos un tipo de sombra de gota que muestra lo que sucede cuando cargan el video. Nosotros queremos tener algún tipo de X, para que pudieran No, um, cómo salir de esa caja, Volver atrás o cerrarla y vamos a traer. Hagamos un contenedor. Entonces solo estoy haciendo una plaza que va a ser muy rápida y arcaica. No va a ser nada emocionante desde el punto de vista del diseño. Tenemos una plaza y vamos a arrastrar en una foto. Tenemos nuestras fotos pretenden que este es nuestro video ven captura de pantalla. Podría pasar mucho tiempo en esto, pero simplemente mostrándote lo básico. Con este proyecto, ahí está nuestra Xbox. Podríamos incluso hacer un pequeño reproductor de video solo para mostrar un ejemplo de cómo serían los controles para que pudiéramos hacer esto y convertirlo en una pastilla. ¿ Qué dicen que es de este color y mirando? Acercar. Hacer que una pastilla en forma de despegar la frontera. Podríamos duplicar eso. Hazlo de un color ligeramente diferente, haz que parezca que se está moviendo. El reproductor de video. Tenemos un pequeño dial de control aquí, tal vez fuera de la sombra. Es algo real, simple, e incluso hay formas en que puedes animar eso también, para que puedas deslizarlo y cambia de color para que parezca que realmente te estás deslizando a lo largo del reproductor de vídeo. Eso definitivamente son técnicas más avanzadas. Incluso podrías poner aquí una fecha u hora por el tiempo que dura el video o por cuánto tiempo ha pasado desde que empezó el video. Pero por ahora, solo estamos haciendo alguna configuración básica. Agrupemos esto juntos, haciendo un poco más pequeño, tal vez, y ponerlo hasta arriba. Entonces ahora vamos a vincular esto juntos. Volvamos atrás y modo prototipo. Da click en nuestra página principal cuando hacen clic en este botón aquí abajo, se van del dedo del pie. Ir a esta página, haciendo clic sobre y para transiciones. Solo vamos a hacer un toque porque va a ser un click, y vamos a mantenerlo encendido auto animate y eso es todo. Vamos a hacer que la duración sea mucho más corta porque queremos que el video pueda aparecer inmediato. Entonces vamos a probar nuestra página web. Aquí tenemos cuatro estados diferentes. Está bien. Acerque esto. Tenemos un poco de animación que sucede automáticamente en una transición temporal. Todo entra. Esta es nuestra página principal. Entonces pueden o hacer clic en el reloj ahora video subiría a la parte superior o hacer clic en el proceso de inicio. Ahora tenemos todo ligado. Tablero de arte y hacemos click en el botón de reproducción. Todo vuela adentro. Se ve realmente bien. Veamos el video. Genial. Digamos que quiero cerrarlo. Fantástico. Esa X ya está ligada porque copiamos esa X. Recuerda, copiamos la salida copiará también la transición. Entonces cuando copié esa X y la coloqué aquí arriba, tendría una copia para la transición de vuelta a la página principal. Volvamos a intentarlo una vez más. Echa un vistazo a lo que armamos y probablemente ¿qué? Alrededor de una hora y 15 minutos vamos a armar todo esto. No está mal. Inicia el proceso. Ahora. El amor está a la vuelta de la esquina. Está bien, ciérrelo. Desplácese hacia arriba. Mira el video. Va a aparecer. Y podía hacer lo mismo. Y podría ir a otra página. Mismo proceso. Simplemente haces una transición de tap en solo este botón, y iría a una página de registro, o puedes ir a nuestra página de procesos. Es decir, podrías hacer lo que quieras con esto. Esto es sólo lo muy, muy básico que quería mostrarte y presentarte a Adobe X'd. Quería mostrarte cómo tipo de creación de la jerarquía de tipos y cómo trajiste colores. Sólo hay otra cosa que quiero repasar es una especie de bono, y lo haremos a continuación. 57. EXTRA: estilos globales: una cosa más. De lo que quería hablar. Way habló de colores. Hablamos de estilos de personajes. Hay una cosa más. Componentes fríos, que podrían ser realmente geniales porque se puede seleccionar un componente. Digamos que es un icono. Y digamos que tienes 20 tableros de arte diferentes, cualquiera que cambie el color de ese icono en lugar de tener que seleccionar los 20 iconos de tablero de arte y cambiar el color. Podrías simplemente cambiarlo en tu componente, y lo cambia globalmente. Entonces es igual que los estilos globales. Entonces, por ejemplo, este botón de inicio. Por lo que tenemos este botón de inicio en cada pantalla. Entonces digamos que queremos cambiar el color de ese botón de inicio. Lo que quiero hacer. Volvamos al diseño y quiero dar click derecho y quiero dar click en Hacer un Componente, o puede ir aquí a este letrero de adición y traerlo para que pudieras ver su ícono de casita . Entonces ahora es un componente, así que en cualquier momento quiero sacar la casa en cualquier otro lugar. Entonces digamos aquí puedo dar click en componente. Tengo mi pequeño componente aquí, aquí mismo, así que Digamos que quiero cambiar el color en ambos. Todos tienen que ver. Vayamos a cualquiera de estos componentes y cambiemos el color. Entonces digamos que lo hago melocotón. Entonces ahora es melocotón. Pero ahora todo tengo que cambiar el otro. Están todos los otros 20 los van ahora que es un componente y cargado como un tipo vinculado de estilo global. También cambió. Aquí está bien, lo cual es realmente bonito. Entonces, ¿qué tipo de construcción estos fuera? Estás recibiendo un montón de cosas diferentes. cualquier momento que tengas un algo que se va a repetir en múltiples páginas, adelante y hazlo un componente. Entonces si lo cambias todo nuestro si solo cambias uno de esos, lo cambiará globalmente. Hagamos un ejemplo más. Entonces digamos que hago de este logotipo un componente para que solo pueda subir aquí en ello como componente. Llame a este logotipo. Entonces si hago todos mis componentes y duplique el tablero de arte, así que digamos que duplique este tablero de arte para crear una animación, así que voy por aquí y estoy duplicando el tablero de arte. Se copiará automáticamente sobre sus componentes. Entonces ahora si cambio esto, digamos que quiero cambiarlo por otra cosa. Entonces, ¿quieres cambiarlo a Peach? También lo cambiará automáticamente en el otro. Entonces es agradable cuando estás haciendo tu página principal. Si quieres configurar algún ícono conectado global como este, es genial hacerlo y tu primera página de inicio. Entonces, cuando copies y comienzas a hacer animaciones e maquillajes cosas que sabes, va a ser fácil cambiar las cosas globales. Porque imagina si tuvieras 30 tableros de arte una vez tan agradable usar esos componentes, um, como un estilo global, así que solo amable, un poco extra. Yo quería como que me pasara. Entonces aquí está nuestro diseño final, todo vinculado y listo para salir. Esto fue realmente, realmente, muy divertido. Pasaremos una buena hora y 1/2 con el otro, tal vez hasta cerca de dos horas para hacer este proyecto. Una gran introducción al diseño de maquetación de sitios web, y tienes que introducir Adobe X D, que es un activo realmente agradable para agregar a tu conjunto de habilidades de diseño gráfico. Es un gran software tener y saber que es una habilidad de alta demanda para poder hacer esto . Y el siguiente paso sería exportar todos estos a un desarrollador. Envía esto a un cliente para su aprobación para que en realidad podamos conseguir algunas de estas cosas listas para ser recubiertas. 58. Exportación de recursos de Adobe Xd: manera exportar todo esto fuera, así que hay un montón de cosas diferentes que podríamos hacer aquí se puede ahorrar. Si eres parte de la nube creativa, puedes guardarla como parte de tu nube, y puedes invitar a otras personas a editarla, invitar a otras personas a verla. Entonces eso es realmente bonito. Si estás trabajando con otro diseñador, otro desarrollador que también tiene Adobe Extra, podrías compartir archivos con mucha facilidad y mostrarles el fotograma en vivo que también puedes grabar. Si haces click en esta obra, hay un botón de grabación para que pueda grabar mi animación si quisiera o todo mi proceso para poder seguir aquí, dar click en reproducir, click en reproducir, y luego puedo dar click en grabar y luego dar clic en off y me podría tomar un video de mí trabajando a través de todo. Esa es una gran manera de mostrar a los clientes tipo del proceso general para que puedas grabar tu video . Puedes compartirlo con el desarrollador. Se puede ver cómo se vería esto en un sitio web móvil. Si haces clic en lo único del móvil, primero tienes que configurar algunas cosas, así que tienes que conectar un ni os o un dispositivo android a X'd. Entonces hay una app de adobe x'd que puedes descargar en tu teléfono, y luego puedes ponerlo todo configurado para que puedas compartir documentos con tu teléfono y ver cómo ven las cosas en tu teléfono móvil, lo cual es realmente, realmente caramelo . Entonces digamos que quieres compartir activos con el desarrollador y también códigos hexagonales e información de topografía . Hay un botón de compartir justo aquí hasta 1/3 1 sobre es en realidad un botón más nuevo para las versiones más nuevas . O simplemente asegúrate de tener la versión actualizada de Adobe X'd y podrás ver esto . Por lo que esto está en las versiones más nuevas de Adobe X T tienen el botón compartir. Aparte de eso, fue por aquí en esta sección, así que solo ve a compartir su podría tener este nuevo panel que llega del lado derecho, y vamos a estar creando un enlace que podamos compartir con un desarrollador o con un cliente, un montón de cosas diferentes que podemos compartir aquí. Entonces todo lo que tienes que hacer es bajar a la configuración de vista, y hay un par de versiones diferentes que podemos enviarles son un par de enlaces diferentes que podemos crear. Una es una revisión de diseño donde pueden dar comentarios sobre retroalimentación del diseño y también del flujo, lo cual es muy útil. Ah, desarrollo. Aquí es donde se llega a estar enviando todo el tipo de información CSS. Entonces los códigos hex y la presentación de tipografía y otros elementos, que va a ser un poco más como lo mostramos antes donde grabas un video. Pero en este caso, podrán caminar por toda tu presentación si no te has vinculado. Y, por supuesto, pruebas de usuario, lo cual es fantástico para probar tu sitio web si tienes un sitio web más completamente conectado . Entonces vamos a hacer desarrollo. Queremos compartir esto con alguien más que nos va a estar ayudando. Codifique esto. Entonces, hagamos click en desarrollo, y queremos seguir adelante y dar click en activos descargables. Tenemos 13 activos que forman parte de este diseño, y podríamos requerir una contraseña si quisiéramos. Pero vamos a seguir adelante y crear un enlace y va a tardar unos minutos. Aquí estamos. Tenemos el enlace justo aquí podemos guardarlo o copiarlo o ir directo a él y el enlace se va a abrir. Y esto también lo que te acabo de mostrar sólo está disponible para suscriptor de Adobe. Por lo que si eres suscriptor a Adobe Creative Cloud, estarás para tener esta opción. Adobe acaba de cerrar recientemente esta opción a personas que no son suscriptores. Entonces solo ten eso en cuenta ya que estás exportando las otras dos formas que te voy a mostrar para exportar están abiertas a todos los usuarios. Entonces si vas aquí abajo a los corchetes aquí abajo a la izquierda, este icono o a la derecha, podrás ver todos los activos aquí. Por lo que también exportó algunos de los activos que trajimos, como nuestra foto o ilustración en su fondo. También trajo todos los colores utilizados y son capaces de mostrar el código hexadecimal también. Y además, nuestros estilos de personaje se airan aquí por lo que podrás tener esos todos si tuviéramos que titular estos lo cubrirá es que como el título. Por lo que el desarrollador sabrá si es un 20 cada uno a párrafo lo que sea. Son cuatro y tenemos algunas interacciones también, pero podrían revisar las diferentes interacciones. También hace un comentario aquí en la sección de comentarios y banderín para que pudieran. El desarrollador puede ir. Oye, tengo una pregunta sobre esta animación. Cómo o cómo esto necesita vincularse y no tienes que sentarte ahí y ponerte al teléfono. Simplemente podría comunicarse a través de este enlace compartido, y también pueden seleccionar activos. Pueden mantener pulsado, desplazar y seleccionar todos los activos, y pueden descargar esto y podrían tener acceso a estos activos. Y ahí vamos. Hay un par de formas diferentes de exportar y compartir nuestros archivos desde Adobe X'd. Está en otro programa. Que diga que será ilustrador. Algo que podemos hacer para sacarle esto a Adobe X T y esto no es perfecto, pero esta es solo una forma de hacerlo o tomar nuestro tablero de arte, y sólo vamos a ir a exportar archivos y vamos a ir a los seleccionados como gansos SV o simplemente conseguir nuestro diseño de la página principal como un SPG, que es un formato vectorial escalable. Entonces va a haber un formato vectorial. Vamos a salvarlo tal y como está Y adelante, exportar. Vamos a llevar nuestro arrastre eso a Adobe Illustrator, y va a tardar mucho tiempo en renderizar. Eso está bien. Podría tardar hasta cinco minutos. Así que sé paciente. Incluso mi computadora de arriba de la línea tarda un tiempo en conseguirlo para prepararlo. Entonces así es como se ve cuando te subes a él. No es perfecto. No va a pasar perfectamente por encima. Pero vamos a Clic derecho. Vamos a soltar la máscara de recorte que hizo quien quizá tenga que hacer eso unas cuantas veces cuando May necesite en grupo. Entonces a la derecha, click en grupo Y sí tienes acceso a algunos de los elementos principales aquí. Entonces si querías traerlo a un ilustrador W para seguir editándolo o para poder exportar estos archivos eventualmente a un desarrollador, esta manera puedes No lo va a traer a la perfección. Déjenme en grupo este grupo que no tipo de hacer eso correctamente. De acuerdo, como los iconos y el tipo y otros elementos pasan por bastante bien. Pero hay algo en los contenedores que no siempre vienen también. Pero todo lo demás es bastante bueno. Estos botones eran los mismos, e incluso podía tener acceso a las esquinas redondeadas, así que eso es bastante impresionante. 59. Introducción a la creación de un sitio web de Wordpress: podemos diseñar una página web y Photoshopped y Adobe X'd. Hay muchas maneras geniales de diseñar el branding y el layout y la idea de un sitio web . Pero ¿y si no vamos a tener un cliente que tenga un presupuesto limitado o estás haciendo un paquete de branding para ellos y vienen a ti y te dicen que me encantaría un pequeño sitio web o kit? ¿ Haces diseño de sitios web y mucha chatarra de diseñadores dicen, Bueno, ya sabes, tengo que trabajar con el desarrollador. No sé codificar. No me siento cómodo con eso. Bueno, quiero que esta sección te haga sentir cómodo agregando un poco de diseño Web a tus activos de habilidades. Y poder ofrecer eso a los clientes en esta sección te va a preparar para poder empezar a ofrecer servicios de diseño Web como parte de tus paquetes de branding o conjunto de habilidades individuales . No vamos a ir súper en profundidad, que va a ser una sección de dos horas, y serán un curso posterior que irá más a fondo con nosotros. Pero de verdad quiero que empecéis y que os pongáis a pensar en cómo funciona todo este proceso. Entonces, ¿a dónde vas para construir un sitio web sin saber en conocimiento de codificación ahí. Entonces fuera de la caja el software es como wicks dot com y squarespace dot com, eso podría ser capaz de ser estos bonitos. Lo que ves es lo que obtienes editores, que son básicamente drag drop. Se pueden agregar módulos. Es muy fácil. T construir un sitio web completo construir fuera sin conocer ningún idioma de codificación detallado. Hay una lista realmente grande de algunas grandes opciones para la construcción Web. Hay uno nuevo llamado Web Flow, que han escuchado mucho sobre y que les encantaría un futuro que algún tiempo después. Pero por ahora, me voy a centrar en los dos más populares fuera de la caja. Lo que ves es lo que obtienes. Los editores son sistemas de gestión de contenidos. Eso va a ser WordPress. Eso va a ser lo más conocido con tu base de clientes. También va a ser el más conocido con tus compañeros. WordPress es el CMS más grande o sistema de gestión de contenidos que hay por ahí, y vamos a usar eso y también hay una alternativa llamada squarespace, que es maravillosa porque tipo de tiene la solución todo en uno y las plantillas aire realmente no tan mal. Realmente han mejorado su diseño de plantillas. Prefiero squarespace a lo largo de semanas, cualquier día solo por las opciones de plantilla. Por lo que en los próximos minutos, voy a hablar de los conceptos básicos de cómo funciona Web alojado nombre de dominio y cómo instalar tipo de WordPress. Entonces esto va a ser para la gente que nunca lo había hecho antes. Si ya tienes algunos dólares de WordPress y experiencia o ya tienes wordpress instalado en hosting planeado Gran. Adelante, salta esta lección y pasa a la siguiente. Entonces, ¿cómo se empieza con un sitio web wordpress Y una de las razones por las que también elegí sitio web ya que realizaba una encuesta con todos mis alumnos anteriores y estudiantes actuales, y ustedes chicos eligieron abrumadoramente WordPress como su editor de elección en Website Builder. Por lo que va a haber tres componentes principales que necesitas para construir un sitio web del cliente o un sitio web personal . El 1er 1 es el nombre de dominio. Cada sitio web necesita un nombre de dominio profesional. No estamos hablando de w w dot squarespace dot com slash duh duh duda. Queremos un nombre de dominio profesional Chris muy limpio. Hago trabajo de diseño dot com Lindsay marsh design dot com Siempre muy simple. A nombres de dominio Necesitamos comprar esos. Esto es básicamente o tu u R L. No fueron a ir Daddy y escribirlo entre Go daddy dot com, que es un plan de hosting realmente popular, y también puedes comprar nombres de dominio también. Entonces digamos que quiero el diseño de Lindsay Marsh. Veamos cuánto cuesta y comprarías como artículo separado. Por lo que para 11 99 podría tener Lindsay marsh design dot com desde mi página web. Si estás haciendo trabajo de cliente, tratarías de pelear un gran tu l trabajo con el cliente en averiguar qué es lo que estás enfermo será muy importante cuando hagas trabajo de página de aterrizaje. Cuando estás haciendo publicidad de pago para asegurarte de que tienes lo más corto, más conciso, eres posible de Ella. Por lo que tenemos ese primer componente que cada sitio web necesita es ese nombre de dominio, y necesitamos vincular ese nombre de dominio a una cuenta de hosting. Por lo que la cuenta de hosting va a ser el lugar donde almacene todos sus archivos y todos su sitio web y almacenará la instalación de WordPress. Por lo que el host es realmente tipo de todo lo que reúne todo tu sitio web para que tu nombre de dominio eventualmente se vincule a tu cuenta de hosting. Por lo que es genial conseguir una cuenta de hosting decente para este caso o para este ejemplo he usado Go Daddy en el pasado por más de 10 años. Muy barato, muy asequible. Podrás comprar tu nombre de dominio y estás hospedando cuenta todo en un solo sitio web, lo cual es muy conveniente. Por lo que está contento e ir a hosting. Y tengo una lista de un par de otras grandes alternativas y la razón por la que me gusta Go Daddy y Blue Hostess. Algunas de estas son más grandes, y tienen más soporte, pero también agregan un widget de instalación automática de WordPress, donde puedes instalar automáticamente WordPress en tu cuenta de hosting para que no tengas que pasar por el proceso manual de instalar WordPress por su cuenta, que es hace que todo sea un poco más simple. Entonces queremos hacer Digamos que queremos hacer Alojamiento Web, y por supuesto, hay muchas opciones diferentes. Va a depender de lo que su cliente pueda permitirse. De lo que puedes permitirte. Cualquiera que sea el propósito del sitio web no es, son opciones muy, muy baratas. Por lo que por 5 99 al mes, obtengo una página web. Eso es todo lo que necesito. Solo necesito 100 gigabytes de almacenamiento y menos. Voy a estar ejecutando un sitio web basado en video y mira, hasta consigo un dominio gratis así que ni siquiera tengo que pagar por el dominio, probablemente por el primer año. Entonces eso es muy bonito. Eso puede agrupar esos juntos cuando compras un hosting y un nombre de dominio al mismo tiempo, tienes una oportunidad de enlazar ese nombre de dominio a esa cuenta de hosting. Por lo que es importante tipo de vinculación a esos entre sí. Y una vez que te inscribes en estas realmente grandes plataformas de hospedaje Web, hacen que sea muy intuitivo y muy fácil para ti seguir todos estos pasos. Por lo que cuando te inscribes en una cuenta de hosting, generalmente tienes algo llamado panel C o panel de control o un lugar podemos iniciar sesión en tu cuenta de hosting específica y generalmente tener algo llamado AP populares o secciones APS o add ons. Vas a querer dar click en WordPress. Va a pasar por el proceso de instalación para ti. Lo hacen muy intuitivo, te lo prometo. Y tendrás WordPress instalado en tu plan de hosting. Entonces tenemos los tres elementos que necesitamos. Necesitamos un gran tu l. tenemos un nombre de dominio. Teníamos un gran plan de hosting, y también hemos instalado WordPress en ese plan de hosting. Y así nuestro nombre de dominio está vinculado de nuevo a nuestro plan de hosting, y tenemos wordpress instalado, por lo que todo está tipo de configurado y listo para que saltemos a WordPress y aprendamos a poner eso en marcha. 60. Lección Crash de Wordpress: si esta es tu primera vez, esta lección está diseñada solo para ti. Vamos a caminar a través de los mismos conceptos básicos de WordPress. Las páginas del tablero y todo lo que ves aquí en el tablero en el sistema de menús. Si lo eres, ya tienes algún nivel de confort con para la prensa, y estás aquí solo para aprender a usar L un mentor o para construir una página Web para clientes . Entonces adelante y salta la siguiente lección o dos. Esto es para aquellos que realmente quieren caminar a través de los mismos conceptos básicos de WordPress. Entonces siéntete libre de saltarte esto. Si esto es demasiado básico para ti, generalmente lo primero que ves cuando te metes en el tablero es el dashboard, que te dará noticias actualizadas y te avisará si necesitas actualizar tu wordpress, vamos a bajar tipo de estos lista de artículos y tipo de repasar los fundamentos de lo que hacen y de dónde entran en juego. Entonces lo primero que verás es post. Así que post es básicamente el bloque en que cada sitio web de wordpress tiene así que pensar en post como Blawg post. Entonces aquí es donde construirías tu post, y luego podrás agregar tus blogs a tu sitio web más adelante. Esto es separado de las páginas, por lo que las páginas tendrán su propio pequeño elemento I y opción de menú y publicar o de manera diferente allí solo para publicación de bloque. Y tienen una forma diferente de editarlos. Entonces si alguna vez quieres editar algo, solo resalta una opción diferente y entra a editar y podrás ir a un editor. También podrías añadir nuevos carteles Wells. Podría construir una lista de diferentes postes en bloque, y se puede configurar para liberarlos en diferentes fechas también. Y luego tenemos nuestra sección de medios. Entonces esto va a ser donde si necesitas subir un video directamente para fueron oprimidos o directamente a tu cuenta de hosting, esta es una gran manera de hacerlo. Simplemente puedes hacer click en, agregar nuevo, y puedes agregar nuevo video y todo lo que necesites. Entonces digamos que queremos sumar. Cargar este video que queremos utilizar para el sitio web. Eventualmente puedes subirlo aquí y ponerlo título. Entonces digamos que tenemos esta imagen que cargamos Y a veces cuando estás construyendo un sitio web, va a llamar a un enlace. Ah, a ello en su servidor. Y aquí es donde puedes encontrar el enlace justo aquí abajo. Esto será para más adelante. Entonces, no te preocupes demasiado por esto. Te mostraré cómo hacer esto de nuevo. Llegaremos a construir la página web? Pero sí, Aquí es donde subes todas las fotos y medios que necesitas así páginas. Aquí es donde realmente vas a vivir. Esta va a ser la opción más utilizada disponible porque así es como estás construyendo las diferentes páginas de tu sitio web. Tu contacta tu sobre nosotros preguntas frecuentes, tu galería, todo este tipo de páginas separadas. Aquí es donde se llega a estar construyendo los que se pueden agregar nuevos y también se puede dar click en editar. Y va a ser un um muy simple, tengo la nueva versión de WordPress, y así se ve un poco diferente a lo que tienes. Tan solo asegúrate de actualizar tu versión de lo que estamos presentando. Totalmente gratis. Usemos el editor estándar. Esto esta cosa nueva, realmente no lo he explorado demasiado todavía, pero es otro tipo de editor constructor. No vamos a estar usando eso. Adelante y haga clic en nuevo editor estándar. Haga clic en. OK, entonces esto es muy estándar Editor. Si sabes usar Microsoft Word que vas a estar muy en casa con esto, puedes agregar fotos, eliminarlas. Este es el constructor Web muy básico que no vamos a usar, el que está integrado en WordPress. Vamos a usar eso aún mejor. Terreno Muy avanzado. Una llamada L A mentor y vamos a repasar eso y un poco. Podrías guardar y actualizar tu página, y puedes crear nuevas páginas agregando nuevas. Estamos volviendo a sus páginas aquí. Entonces este es el tipo de donde viven tus páginas. Estas son las páginas que podemos agregar a nuestro sistema de menús más adelante por el camino los comentarios son solo para el blog y la gestión de los comentarios que tienes muchas veces cuando estás haciendo sitios web de clientes, ni siquiera tengo comentarios habilitados. Por lo que normalmente esto no es algo de qué preocuparse por las formas ninja. Esto es algo extra. Añadí para mi cliente, porque como que estoy usando esto como ejemplo para mi clase, pero no necesitas tener nada de esto. Ah, en cualquier momento que instales un enchufe, es posible que veas opciones extra habitación actitud en tu sistema. Y este es solo uno de esos. Este es el constructor de forma extra que agregué como un enchufe. Y hablando de enchufes, el que vamos a estar usando a lo largo de esta clase se llama Element o y hay una versión gratuita y lo repasaré un poco más tarde. Entonces, saltemos las plantillas porque estas dos están conectadas entre sí. Entonces vayamos a la apariencia del dedo del pie. Por lo que aquí es donde probablemente oíste hablar de descargar temas. Aquí es donde instalarías un tema que obtienes de Internet, y tengo un gran recurso descargable que enumera, um, um, grandes opciones de tema si estás queriendo hacer algo que no sea lo elemental que usamos en la clase, solo tipo de dispararte algunas grandes plantillas pagadas y gratuitas que seleccioné en base ciertos diseños que pensé que eran realmente buenos, si solo quieres explorar eso, pero tienen una nueva llamada 2020 y este es el predeterminado que tiene WordPress. Nos vamos a asegurar que eso esté activado. Si no está activado, solo pasas el cursor sobre un tema y podrías activarlo. Y adaptará automáticamente el estilo de ese tema cuando lo actives. Por lo que podría activar esto y activará ese tema, o puedo activar éste. Vuelve a mi 2020 y activado, pero puedes descargar, y aquí es donde instalas cualquier tema que agarres de Internet. Sólo tienes que ir a sumar nuevas aquí arriba e instalar el último tema. Incluso podrías buscar temas dentro del sistema WordPress para que puedas buscar temas si conoces un nombre. Entonces si alguna vez quieres personalizar un tema, baja aquí para personalizar. A veces los temas tienen su propio tipo de elemento de menú que se agrega después de instalarlo. Necesario para pasar por eso, o algunos tienen esta opción donde puedes editar colores específicos. Y estoy pasando por esto rápido porque a medida que construimos nuestro sitio web, vamos a poder ir a través de todos estos diferentes elementos de video y usar lo que necesitamos para usar bien, así que plug ins probablemente has oído hablar de enchufes. Hay muchos geniales que puedes descargar para poder agregar y realmente rebosar tu página web. Muchos de ellos se basan en torno a la seguridad al dedo gordo del pie. Agrega seguridad adicional a tu sitio web de WordPress porque podrían meterse fácilmente si no lo mantienes actualizado. También hay unos en los enchufes S CEO que te permiten agregar opciones adicionales de S CEO. Hay unos para analítica. Entonces aquí es donde agregarías un enchufe que encontrarías en línea. Simplemente subiría a igual que tú lo harías temas. Y agregaría nuevo aquí mismo. Entonces si alguna vez quisieras pasarnos a un cliente, aquí es donde agregarías un usuario. O tal vez el cliente tiene un gerente de marketing que va a estar haciendo todas las actualizaciones ya sea que estás haciendo las actualizaciones o los clientes que hacen las actualizaciones. Aquí es donde agregarías un nuevo usuario, y yo solo estoy bloqueando alguna información porque este es un sitio web de cliente real se basan en cuenta de WordPress cliente real que estoy usando, así que solo difuminando algunos nombres. Pero ella seguiría adelante y agregaría nuevos y les darías el papel de administrador. Y hay un par de roles diferentes que puedes asignar a los clientes si quieres darles el control total para que se hagan cargo del sitio web una vez que hayas terminado de diseñarlo. Entonces este es el mismísimo, muy básico del sistema WordPress. Y ahora que como que hemos superado lo básico y estás familiarizado con al menos lo que hacen algunos de estos artículos a la izquierda, vamos a asegurarnos de descargar er elemental y empezar con eso. Eso lo vamos a hacer en la siguiente lección. 61. Introducción a la complemento del elemento elementor: Entonces en esta lección, vamos a aprender un poco sobre el constructor de páginas que vamos a utilizar para esto. Este es el constructor de páginas más popular para WordPress. Entonces, ¿qué es un constructor de páginas? Por lo que un constructor de facturas de página te ayuda. Es un add on para un plug in que puedes instalar en tu WordPress, y te ayudará a construir páginas y una moda un poco más detallada que es mucho más en profundidad. Como pudiste ver en el video de la página web, eres capaz de agregar un montón de cosas. ¿ Y qué tiene de genial este constructor? Está al día. Se mantiene al día con las tendencias, y la maravillosa opción al respecto es que hay una versión gratuita que puedes usar, y eso es exactamente lo que vamos a usar para esta clase. Hay muchas opciones premium que puedes comprar, pero en este caso, vamos a tratar de salir adelante sin solo usar la versión gratuita de Element. O así lo vamos a descargar, y ni siquiera tienes que descargarlo en el sitio Web. Pero solo quería mostrarles el sitio web y también los precios. La versión premium viene en todo tipo de campanas y silbatos. Vamos a encontrar la manera de solucionar eso, así que no te preocupes. Pero si te gusta gustarte esto y estás haciendo un par de proyectos de clientes pagados y sí quieres empezar a actualizar a plantillas construidas que ya hicieron por ti, entonces esto es algo que puedes perseguir. Pero no tienes que perseguir eso para esta clase. Entonces estamos en enchufes. Es técnicamente, es un plug in, y vamos a ir a añadir nuevo, y vamos a subir aquí a buscar en las palabras clave elemento. O y ahí está, el primero con aquí. Ya no he instalado, pero normalmente conseguirías desinstalar ahora, botón yendo, click en instalar. Se instalará automáticamente. Si quieres ver tus enchufes instalados, adelante y pulsa aquí arriba la parte superior y obtienes una lista de todos tus enchufes instalados. Tan solo asegúrate de activarlo. Una vez que actives el elemento o enchufes, lo será. Tienes que añadir nuevas opciones a tu elemento de sistema de menús o y plantillas. Entonces esto es cuando pasas el cursor sobre el elemento, o obtendrás un menú desplegable con un par de opciones diferentes que puedes configurar. Y luego también tienes plantillas, que se podría decir, con las que se podría decir,no vamos a meternos demasiado. Las plantillas realmente solo iban a meterse con esta opción aquí mismo. Por lo que está activado. Entonces ahora es parte del constructor de páginas. Entonces cuando construyamos, las páginas podrán utilizar Element o como nuestro constructor de páginas. Entonces se va y da click en páginas y lo primero que quiero hacer si los que se saltaron la última lección porque ya están un poco familiarizados con WordPress. Para los que se saltó eso, bajamos a temas de aparición, y nos limitamos a asegurarnos de que la versión 2020, que es gratuita, venga por defecto. Con la última versión de WordPress. Fuimos adelante y nos aseguramos de que este fuera el tema activo. Entonces ahora vamos a volver a subir a las páginas y que esto podría ser un poco complicado. Si eres completamente nuevo en esto, vamos a subir a las páginas y vamos a estar construyendo nuestra página web aquí para que todos tengan una portada de inicio, y eso es lo que va a ser nuestra página principal que vamos a construir hoy, y yo soy te va a mostrar rápidamente lo que vamos a hacer en esta sección del curso. Entonces voy a refrescar estos previsualizaciones. Ya puedes ver qué vamos a construir toda esta pequeña página de aterrizaje de un sitio web. Entonces vamos a tener una sección superior aquí arriba. Vamos a tener una especie de fondo de video. Tendríamos botón activo. También vamos a poder Teoh, crear un par de columnas, tener algunos click through button, y luego aquí abajo, vamos a poder hacer mostrarte como hacer un poco de animación para agregar un poco de pop a tus diseños y también hacer imágenes de fondo y todo ese jazz. Esto es lo que vamos a poder construir con elemento o sistema. Entonces, ¿cómo empezamos a usar elemento o no podemos pasar por ahí. No nos está dando una opción para empezar. Vamos a tener que ir por páginas y dar click en nuestra página principal. Entonces vamos a editar nuestra página principal, y hay una opción poco rápida aquí. Si no quieres tener que hacer click en editar, ve todo el camino hasta aquí para editar con elemento. O así vamos a hacer eso. Entonces va a sacar ese elemento o sistema aquí que va a sobrescribir nuestra portada. Entonces esto ya está construido a partir de cosas con las que estaba experimentando. Entonces déjame seguir adelante y empezar una nueva página de inicio fresca y volveré enseguida. Vamos a añadir una nueva página que podemos editar agregando una nueva página y no vamos a añadir un título. Supongo que podríamos hacer una página entera. Linguine guarda un borrador, retrocede dos páginas y ve si está listado. Este es nuestro borrador. Vamos a usar esto ahora. Vamos a ir a editar es una nueva página fresca, y vamos a dar clic en Editar con Element, o va a volar todo este nuevo constructor de páginas para nosotros. Entonces eso estaba cargando el enchufe. Por lo que bienvenido al elemento. O así este es el plug in. Esto es lo que parece. Es así como vamos a estar construyendo nuestras páginas en esta sección de la clase. Entonces una cosa que queremos hacer es ahora mismo que está cargando parte del tema. Entonces esto es lo que pasa con este constructor web es para la versión gratuita. No tienes forma de agregar una opción de menú. Es lo que tenemos que hacer es tener un híbrido de nuestro tema, que es el tema 2020. Eso es por defecto por WordPress que instalamos. ¿ Estamos activados? Esa va a ser esta parte superior. Entonces aquí es donde se pone un poco complejo. Pero sólo quédate conmigo. Por lo que tenemos. Esta es la página web terminada. Y así la barra superior con el logotipo y el sistema de menús es importada de nuestro tema de nuestro 2020 wordpress tema. Todo por debajo va a ser desde elemento o así elemento hacia la construcción de esas partes medias de las páginas para nosotros y para el WordPress. Steve está cargado en la parte superior. Lo mismo para el pie de página. Entonces todo esto se construye con elemento o, y este pie de página inferior se carga desde la plantilla. Entonces si alguna vez queremos terminar en el pie de página inferior o en el menú muy superior Barra del sistema, vamos a editar eso a través del panel de WordPress y los ajustes de temas. Si queremos editar algo que estamos construyendo en el medio, eso va a ser elemento o y siempre podría cambiar esto bajando a tus opciones de fondo aquí y haces click en ajustes. Va a haber algo llamado diseño de página, y aquí es donde puedes cargar todo este final. Entonces por defecto va a cargar el sistema top many y el pie de página inferior del tema y todo en el medio va a ser elemento. O puedes hacer elemento o lienzo, que despejará ese menú temático superior y pie de página y simplemente te dará un lienzo en blanco de elemento terse. Si no quieres que te traiga nada, podrías construir desde cero sin que nada se traiga del tema El tema de WordPress para solo saber que puedes llegar a eso yendo a la configuración y yendo al diseño de página. Volvamos a nuestra configuración. Eliminemos el título para que tengamos el diseño de página por defecto, y queremos simplemente hacer clic en toggle this, también. Sí, va a seguir adelante para ocultar el título para nosotros y para el diseño de página. Vamos a hacer L. Un mentor, ancho completo así elemento o lleno con va a poder hacer de esta barra superior un poco más delgada y así podrías ver cómo se traen la parte superior y la inferior desde el tema y esta es la parte media. Ese elemento er va a estar a cargo de la sección de saliva. Entonces si quieres cambiar el menú, no hacemos ese elemento, o vamos a salir de nuevo hacia el dashboard para cambiar el menú. Entonces empecemos por lo más alto. Por lo que la parte superior va a ser esto. Entonces esto no se va a hacer un elemento o si tienes elementos o pro. Hay algunas opciones de menú donde puedes agregar un menú aquí sin usar el tema de WordPress . Pero para la versión gratuita, lo vamos a hacer desde el tema. Entonces sigamos adelante y volvamos a nuestro panel de control. Entonces volvemos al tablero, El nuevo sistema y lo que queremos hacer es que queremos editar el tema que tenemos. Vamos a bajar a la apariencia y a los temas. Y recuerda, cuando establezcamos este tema del 2020, vamos a poder personalizarlo. Y aquí es donde se puede sumar lo local arriba arriba. Entonces vamos a bajar a citar identidad, y vamos a añadir un logotipo, y tengo el logotipo disponible como recurso descargable. Así que adelante y descarga ese zip. Entra en tu carpeta Zip y podrás ver esta sección y poder ver todos estos archivos disponibles para ti para que no tengas que volver atrás y crear todos estos desde cero. Puedes enchufarlo y aprender conmigo o poner tu propio logo ahí. Adelante y añade tu logo. Asegúrate de que sea una resolución decente y queremos asegurarnos de que revisamos el logotipo de retina porque eso ayuda a t tomar resoluciones más grandes y mostrar eso cuando tienes una buena retina, pantalla de alta resolución. Entonces eso es tan fácil como eso. Podemos seguir adelante y añadir el logotipo. Ahora queremos poder ir a los colores, y tenemos una marca aquí. Entonces esta es una marca que previamente desarrollamos toda una campaña en redes sociales y tuvimos algunos elementos de branding a partir de eso. Entonces tenemos estos dos colores, estos dos colores hexagonales que vamos a tratar de utilizar a lo largo de nuestro sitio web, y queremos que sea consistente, por lo que queremos que las opciones de menú por aquí adapten ya sea el naranja o el azul. Y me imaginé que Azul va a estar más asociado con enlaces, Pero también va a ser un poco más alto contraste con el blanco y ser tener un poco mejor legibilidad. Entonces así es como editamos el minuto, que va a estar en la parte superior derecha Aquí hay una especie de las opciones de menú aquí. También hay colores a los que puedes cambiar el tema de color y para cambiar los enlaces u R L arriba en la parte superior. Vas a tener este pequeño slider y te das cuenta de cómo cambia a medida que deslice esto. Por lo que esto es aplicar color personalizado para enlaces, botones e imágenes de características. Entonces queremos seguir adelante y cambiar eso a nuestro color azul. Entonces ahora coincide con nuestro logo y para hacer el menú y en realidad agregar qué páginas van a estar en su conflicto U abajo en muchos. También hay una opción de menú de vuelta en el tablero, pero también puedes hacerlo aquí mismo para que podamos configurar diferentes elementos del menú. Por lo que este es nuestro menú principal. Puedes crear un mini nuevo si quieres tener uno abajo en el pie de página, y puedes configurar las diferentes muchas ubicaciones. Entonces ahora mismo, el menú horizontal de escritorio que va a ser tu top. Tenemos ese set a primario. Entonces digamos que queremos editar esto así que solo estoy dando click a través de dos mini Primaria, que es la única que tengo configurada. Ya tengo algo de esto ya configuré estas air diferentes páginas que creé en el área de páginas donde puedes agregar nuevas páginas al sitio web. Tenemos un hogar, una galería, servicios, servicios, estos todos vamos a ser click a través de clicable a través. Entonces puedes agregarlo artículo para que podamos agregar, Digamos, portafolio que no tenemos. Por lo que podríamos simplemente agregar eso a nuestro sistema de menús. Y ahora tenemos un nuevo elemento de menú, y puedes moverlos por ahí para que puedas tener un orden diferente. Y digamos que tendríamos un menú desplegable. Entonces hablemos de menú desplegable. Entonces digamos que queremos pasar el ratón sobre el contacto sí, y no tendríamos muchos menús desplegables sobre eso, así que lo que hacer es tomar una página principal y arrastrarla cortado de un poco hacia adentro, y va a crear un enlace anidado. Entonces este es tu enlace de padres y este es tu enlace de hijos. Por lo que fue ingerido. Y ahora cuando vuelvo, contáctanos, tenemos un menú desplegable, así que así de fácil es crear menús desplegables. Si no quieres que este sea un menú desplegable, lo desliza hacia fuera y cambia el orden. Entonces así es como editas los menús. También hay otra forma de editar las noticias. Si salimos de este tema personalizado tema, vamos a volver aquí. También puedes conseguir bajar a la apariencia y bajar a los menús aquí. También podrás editar menús aquí de la misma manera. Podrás tener un poco más de opciones cuando lo hagas de esta manera, a diferencia de pasar por el tema personalizado. Lo mismo aquí podemos, um, sumar, añadirlos. Entonces digamos que tenemos unas preguntas frecuentes. Podemos agregar que lo va a agregar justo aquí a nuestro sistema de menús, y podemos cambiar el orden. Podemos quitarlo para que podamos quitar éste Así que digamos que quiero agregar un enlace personalizado No quiero agregar solo vinculado a mi propia página web. Quiero un enlace a otro lugar. Puedes hacer click en enlaces personalizados, y podríamos hacer prueba aquí mismo. Podríamos tener el Cisco a google dot com para una prueba y agregar al menú. Entonces si alguna vez quisieras agregar una página que tuviera una personalizada vinculada a ella, puedes y podría simplemente eliminarla. Entonces para opciones más detalladas, pasas por el panel de apariencia y menús en lugar de pasar por los temas personalizados . Entonces siempre hay un par de formas diferentes de editar las cosas, y somos prensa, que puede hacer que parezca un poco complicado. Pero una vez que pases por este proceso una o dos veces, te familiarizarás con él. No parecerá tan complicado. Entonces si alguna vez quieres hacer tu menú superior, así es como lo haces. Si quieres cambiar tu logo, así es como lo haces. Entonces todo lo demás que vamos a estar haciendo se va a construir con el sistema de tour Element. Volvamos a nuestras páginas ahora que personalizamos tu menú y agregamos nuestro logotipo iban a bajar a nuestra prueba y vamos a ir a editar con Element, o va a volver a cargar esa misma página. Y ahí vamos. Tenemos todo actualizado. Y ahora vamos a aprender todo sobre cómo construir elementos por todos lados y construir todo y agregar video. 62. Sitio web de Wordpress - video encabezado: para pensar en el lado del diseño de las cosas donde todo ha sido técnico. Es así como consigues esta configuración. Hablemos de nuestra página web planeada. Entonces tenía un plan para esto. Se trata de una empresa de viajes. Realmente necesitamos agarrar a la gente de los anuncios pagados. La gente va a venir de los anuncios de redes sociales y de los anuncios de pago. Entonces necesitamos agarrarlo con un bonito visual para que pudiéramos tener un cuadro maravilloso, estático, dinámico con algún texto tal vez que vuela o podríamos hacer algo mejor. Video, video, video a la gente le encanta el movimiento. A la gente le encanta el video. De verdad se conectan, y los agarra. Entonces lo que quería hacer es hacer un video de fondo en lugar de un carrusel de banners giratorio. Veamos si pudiéramos hacer de esta parte superior de video y superponer una llamada a la acción Botón y un poco de titular. Entonces, ¿cómo hacemos eso? Usar elemento o así lo que queremos hacer es lo primero que queremos. Dragón es una intersección. Por lo que esta intersección es una especie de su defecto. Espere en un contenedor y agregue diferentes columnas. Vamos a añadir en una intersección justo aquí arrastrar widget en. Es bueno crear un contenedor de columna predeterminado, pero también va a tener bien este contenedor externo, pero luego también está contenido dentro de un contenedor padre. Entonces este es el contenedor de sección padre, y creó este tipo de diseño de dos columnas para nosotros. Entonces lo que queremos hacer es añadir ese video de movimiento al fondo de este contenedor principal . Queremos tener un video de fondo pasando por esta zona. Podríamos volver aquí y agregar un video, pero cuando agregas un video, no puedes poner las cosas encima del video. Entonces, por ejemplo, si en una sección de video aquí y agrego el video aquí, no me va a permitir añadir otra intersección. Dentro lo va a hacer en la parte superior para que no podamos hacerlo de esa manera. Entonces por eso vamos a crear una intersección y agregar un fondo al contenedor principal principal . Vamos a hacer clic en el contenedor principal de padres, y vamos a añadir el video de fondo en lugar de una imagen de fondo. Por lo que queremos asegurarnos en lugar de caja que esta sección principal esté ajustada a lleno, por lo que eso va a estirar todo hacia el exterior. Entonces ahora agreguemos nuestro video. Vamos a ir al estilo, vamos a ir a fondo y nos va a dar un par de opciones. Clásico es un color sólido. Podríamos agregar un fondo Grady it. Podemos agregar, Ah, presentación de diapositivas que atraviesa o en este caso, vamos a añadir un video para que puedas copiar y pegar nuestro enlace de YouTube que tenemos. O podemos hospedar el video en nuestra propia página web también y hospedarse de forma nativa. Entonces, ¿dónde encontramos este enlace? Eso lo vamos a encontrar en la sección de medios de su tablero. Entonces volvamos a nuestro panel de control, dónde ir a nuestras opciones, este pequeño menú de hamburguesas, y vamos a poder volver a nuestros tableros y va a hacer click derecho abrir nuestro panel contra que estamos de vuelta y nuestro dashboard wordpress. Vamos a ir a esa sección de medios que revisamos antes, y solo voy a subir un video, y tengo esto disponible para ti como recurso descargable. Si abres esa carpeta zip que te di para esta sección de la clase, podrás ver dónde tienes ese video para ti. Se iba a agregar un nuevo video, solo tipo de mostrarte el proceso y notar el tamaño de archivo pequeño. No quieres usar video de cuatro K ni nada que sea súper grande porque quieres que tus tiempos de carga sean razonables. Esta es una buena baja resolución. Simplemente se va a usar como video de fondo. Entonces voy a seguir adelante y subir eso y ya lo tengo subido aquí. Si haces click en una vez que termine de subir, solo, uh adelante, da click en el video y va a haber un pequeño área de enlace de copia justo aquí abajo. Este es el enlace que te están pidiendo. Acabas de obtener una copia, ese enlace vuelve a tu elemento o y ahora vamos a volver a nuestra sección principal y ahí están los enlaces o simplemente van a ritmo ese enlace ahí dentro y se podría ver automáticamente empieza a cargar el video de movimiento . Puedes tener cierta hora de inicio o a tiempo con tu video. Se puede jugar a la vez o bucle. Entonces voy a dar clic en No, para jugar una vez porque quería continuar el Lupin Lupin Luke porque es una especie de fondo más decorativo, atención agarrando imagen. Por lo que también puedes excluir esto de la vista móvil. Si por alguna razón no quieres verlo en el móvil, puedes excluir elementos específicos para que no se carguen en una versión móvil del sitio web. Además, hay un retroceso de fondo. Esto es genial para las personas que siguen aquí. Por alguna razón, tienen videos desactivados o auto play en videos. Se quiere tener una imagen de fondo que funcionaría igual de bien. En ocasiones abrirán el video y tomarán una captura de pantalla y usarán eso como especie de mi imagen de fondo de respaldo. Y así allá vamos. Tenemos nuestra pequeña imagen de fondo añadida. Entonces digamos que queremos cambiar el tamaño de toda esta sección y mostrar y revelar más video. Siempre podemos cambiar nuestro relleno, así que estoy aquí en el mismo. He estado en el mismo área de sección de edición de sección principal todo el tiempo de pasar a avanzada, y podemos agregar un poco de relleno para que eso extienda horas. Tendríamos un área de visualización de mayor impacto. Podemos simplemente agregar un poco más de relleno. Podemos ajustar eso en cualquier momento. Entonces ese es nuestro contenedor principal. Entonces a tipo de revisión, tenemos nuestro contenedor principal. Lo tenemos el contenido en completo con y no en caja. Y tenemos nuestro en el fondo. Tenemos nuestro video, así que estamos usando videos, un fondo, e hicimos nuestra configuración de esa manera. Este es nuestro principal contenedor padre, y tenemos estos otro contenedor aquí, Otra sección. Este es un contenedor hijo anidado y va a existir dentro de este contenedor padre. Y esto está trabajando en un llamado botón de acción a la derecha y un titular a la izquierda. Tenemos este valor predeterminado a la cuadrícula de columnas. Por supuesto, podemos agregar columnas a eso lo hará un poco más tarde. Pero lo que queremos hacer es volver a nuestra sección principal, que está aquí mismo. Adelante y haga clic, y podemos conseguir todos nuestros diferentes artículos y elementos que podemos cargar. El primero que queremos hacer es agregar un encabezamiento. Entonces está en un rumbo a esta cajita aquí mismo arrastró eso, y ahora vamos a querer conseguir un llamado botones de acción. Tenemos un botón para volver a conectar a ese titular y realmente tener algo más conciso junto con la imagen de fondo móvil. ¿ Fue Glenn cambio o tipo? Eres exótico. Aquí comienzan las vacaciones. Realmente vamos a necesitar dedo del pie. Hacer pop este tipo contra ese fondo de movimiento. Sigamos adelante y cambiemos nuestro estilo aquí. Estilo Amarin justo aquí en el cuadro de texto. Y vamos a asegurarnos de que nuestro color de texto sea blanco y podríamos hacerlo un poco más grande también, yendo a la tipografía y cambiando el tamaño. También puedes cambiar un poco la altura de la línea para que no la quieras demasiado apretada y no quieras que los huecos estén demasiado separados. Querías sentirte realmente como si fuera un titular. También puedes cambiar un espaciado entre letras, pero con letras minúsculas como tener mucho cuidado y o mantenerlo en cero o un poco negativo. No me gusta tener amplios huecos porque empieza a parecer un poco poco poco profesional. El colapso escolar que de nuevo al cero predeterminado. Podríamos incluso hacer este viejo un poco más grande e incluso podemos hacer una sombra de gota sobre esto está bien, así que sombra tecnológica. Definitivamente queremos algo que lo ayude a elevarse por encima de ese video de movimiento. Nos vamos a un poco de sombra tecnológica, muy pequeña. Podríamos hacer doble clic en esto para hacerlo muy evidente o no. Entonces solo para que le guste una sutil sombra de gota. No vamos a tener demasiado de un desenfoque en. Fue un poco borrosa. Simplemente ayuda a que realmente se levante por encima del video. Y me gusta liderar con el Senado Vamos adelante y liderar con un capital. Podríamos mantener todo lo demás en minúsculas. Por lo que tenemos este botón de llamada a la acción que realmente necesita mucha ayuda. Entonces sigamos adelante y pongamos aquí algunos colores de marca y tipografía. Por lo que solo pinchando aquí en el botón, va a tener algunas opciones que puedes editar. Entonces reservar ahora será nuestro tipo de llamado a la acción, y queremos asegurarnos de que esta es la línea central, por lo que está en el centro alineado con el párrafo. También podemos centrar alinear esta tipografía también. Entonces hagámoslo. Si bien estamos aquí, estamos por aquí y contentos y sólo vamos al centro. Alinear eso. Por lo que ambos van a ser de línea central. Volvamos a donde Button. Cambiemos el color. También podríamos añadir un pequeño icono aquí, que tiendo a preferir la iconografía junto con los botones porque ayuda a proporcionar una ayuda visual junto con el botón. Ya veremos si podemos agregar un pequeño ícono y él puede subir y spg también miembro. Cuando creamos algunos iconos SPG antes en la clase, puedes subir una Nikon y puede habilitarlos, y podemos hacer los iconos de esa manera. Pero para este caso, vamos a usar unos iconos predeterminados de la biblioteca de iconos. Vamos a encontrar un ícono que va a conectar con libro ahora. Entonces para mí, es una marca de verificación. Algún tipo de indicación de esto es el siguiente paso en el proceso. Hagamos esta casilla de verificación. Por supuesto, puedes insertar cualquier tipo de nombre para buscar uno. Entonces ahora tenemos un pequeño ícono a la derecha, lo cual es bonito, y puedes cambiar el espaciado de iconos y convertirlo en un hueco más amplio. No me gusta ensanchar la brecha que podrías poner un antes o un después, pero me gusta antes Eso depende de ti y cuáles son tus necesidades. Hagamos un botón grande o incluso un botón extra grande, y podemos seguir adelante y poner nuestro enlace aquí o debilitar las opciones de do link. Podemos abrirnos en una nueva ventana. Hay muchas opciones diferentes que puedes agregar a donde sea que esto sea bueno para ir para que puedas agregar tu enlace. Vamos a pasar al estilo para que podamos cambiar un poco de tipografía aquí. Hagamos la tipografía un poco más grande justo ahí. Cambiemos el color del texto. Entonces aquí es donde queremos traer nuestros códigos hex porque queremos tener ese azul y esa naranja. Entonces tengo este documento de marca que confinó en la sección de redes sociales de la clase . Eso va a ser útil para luchar contra estos códigos hexagonales. Por lo que el 1er 1 es azul. Vamos a hacer doble clic en eso. Tenemos este código hexadecimal justo aquí abajo. En primer lugar, consigue una copia y pega eso, y para que pueda guardar estos códigos hex que no tienen que seguir ingresando los de Vamos a añadir nuestro color naranja. No tienes que volver a hacer eso nunca más. ¿ Qué ya ha agregado ahí dentro? De acuerdo, entonces queremos hacer el botón. Podemos hacer azul el botón o hacer el botón naranja. ¿ Cuál va a salir más en este tipo de un poco de fondo de video ocupado? Y mi conjetura es que va a ser naranja, porque si haces azul y eso es por lo mecanografiado el fondo. Entonces, mantengamos eso blanco. Vayamos al color de fondo. Entonces ese es el impuesto. Vayamos a fondo. También lo haría Orange Workout o Azul. ¿ Cuál de verdad les saldría a ustedes si incluso podemos hacer texto naranja sobre azul? Todo el contraste no va a ser tan vibrante. Siento que en algunos casos, sobre todo con la primera parte, tienes azul sobre azul con el fondo. Estoy pensando que el naranja en general podría ser una especie de color más llamativo de atención. Vamos a quedárselo a naranja. Entonces ahora lo siguiente que tenemos que hacer es ganar qué tipo de centro alinear estos dos porque ahora mismo esto está posicionado en la parte superior y esto está como posicionado. Me encantaría que esto bajara un poco. Lo que queremos hacer es cambiar este botón para que nos dé la oportunidad de posicionar este botón, Ver este pequeño botón de edición, Vamos a poder hacer click y arrastrarlo hacia abajo. Realmente podemos moverlo a donde queramos. Sigamos adelante y pinchemos justo aquí. Aquí. Y esto es sólo una opción con un botón. Por ahora, realmente no se puede hacer clic en esto y tomar el texto. El tipo de Texas en su propio contenedor. Por lo que esto es una especie de cosa especial que puedes hacer con el posicionamiento de botones. Adelante y actualicemos aquí nuestra página web para que podamos seguir adelante y guardar lo que tenemos aquí. También puedes guardar como borrador o guardar como plantilla también. Si quieres. Todavía no estás listo para publicarlo. 63. Sitio web de Wordpress : creación de otras secciones: Entonces esto es lo que espero crear. Es solo el cuadro naranja de mayor contraste después del video que solo tendrá un punto de venta del cliente, que es la agencia de viajes más valorada en 2020 con un pequeño icono de cinco estrellas. Porque me encanta usar iconos junto con cualquier tipo solo para especie de realmente tengo un visual con texto. Esta es una especie de la barra de alto contraste que quiero crear. Entonces vamos a hacer eso en nuestra propia caja nueva. Por lo que queremos arrastrar ese final aquí. Vamos a volver a nuestros elementos aquí que podemos arrastrar. Entonces lo que vamos a hacer es arrastrar en un rumbo justo aquí con el rumbo de aquí, y vamos a seguir adelante y teclear todo lo que tenemos comida. La mejor agencia de viajes en 2020. Lo que vamos a hacer es ir a esta sección principal. No vamos a hacer el texto. Vamos a ir al principal, al segundo nuevo miembro de caja de sección. Cómo teníamos una sección principal aquí arriba. Esta es una sección principal aquí abajo, y queremos agregar un fondo de color sólido. Vamos a ir al tipo de fondo estilo, y solo queremos hacer un relleno clásico de un solo color. Vamos a bajar. Ya tenemos nuestra marca naranja. Vamos a enredar eso. Incluso podemos añadir una imagen de fondo en lugar de solo un color sólido. Podríamos hacer otro video, aunque no tienes que videos espalda con espalda. Vayamos a avanzar y especie de colapso esto un poco. No queremos demasiado relleno. Solo estamos ajustando o acolchando aquí justo por ahí. Por lo que ahora podemos volver a nuestro cuadro de texto DoubleClick. Y por supuesto, podemos cambiar esto peor. Configuración de los encabezados de la cabeza. Por lo que H uno H dos y párrafo es un poco agradable porque podrías ir justo aquí al contenido y hacer todo tipo de similar. El tamaño es queremos asegurarnos de que esté alineado en el centro y con estilo. Queremos asegurarnos de que sea blanco. Quizás podríamos hacerlo un poquito más pequeño justo por ahí. No queremos dominar los titulares, así que no queremos tener esto porque ahora es lo mismo, dice Size es el titular. Entonces digamos nuestros titulares h dos. ¿ Y si hiciéramos este titular H R es H uno. ¿ Y qué si hiciéramos este h dos? Acabamos de hacer un poco más pequeño, por lo que no trata de competir con el máximo curso. Siempre podemos volver a permanecer sección y ajustar la Patty. Entonces esto es todo lo que tenemos que hacer es solo que tenemos que hacer click derecho en esta casita de aquí arriba y vamos a poder agregar una nueva columna. Entonces ahora tenemos un diseño de dos columnas, pero no quiero que las estrellas superen esto. Entonces esto es lo que vamos a hacer. Vamos a necesitar cambiar el porcentaje que esta columna está retomando. Entonces lo que queremos hacer es querer arrastrar en algo especial. Creo que se llama Star Rating. En realidad tienen un pequeño widget que puedes usar para las estrellas. Arrastre ese extremo. Esto podría ser un poco de calificación estelar aquí. Podríamos hacer eso un poco más grande, darle un estilo de cinco estrellas, hacer un poco más grande, tener un poco más espaciado, y queremos cambiar el color a azul solo para añadir ese pop de contraste realmente alto. Entonces ahora queremos cambiar las columnas porque ahora mismo tienes esto y esto juntos, queremos que tipo de cambio como se ve eso. Queremos reducir el tamaño de columna aquí de esta columna y aumentar el tamaño de columna de esta que hacer es queremos hacer. Esta puede ser una columna del 70% con y la otra del 1 al 30% vamos a dar click en esta, y vamos a ir por las estrellas y por llamarlo con Let's Make it 30 Y por aquí queremos hacer la columna con 70 así que va a cambiarla automáticamente si hay sólo dos columnas, por lo que hay una especie de nuestro diseño de dos columnas. Podemos, por supuesto, hacer esto más pequeño. Se va a dar click en esto. Podemos hacerlo 20% y tal vez alinémoslo a la izquierda. Así es como se ve en la vista previa, y aquí es donde podemos cambiar algunas cosas alrededor. Entonces si sentimos que el libro de botones naranja ahora, um, interactúa demasiado con el mismo botón naranja aquí, podemos cambiar ligeramente el sombreado aquí. Hazlo más ligero. Encuentra alguna manera de diferenciar a los dos o a menos que queramos conectar los dos con colores, eso también es bueno. Por lo que sólo tratarde previsualizar cada etapa de este sitio web e intentar tomar buenas decisiones de diseño a medida que trabajamos a través del diseño Web. Entonces es cuando necesitamos empezar a pensar en el móvil y,ya sabes, ya sabes, móvil a veces viene primero, Así que sigamos adelante y empecemos a ver cómo funciona esto en Mobile porque estamos consiguiendo todo esto configurado en el escritorio y eso es genial. Pero, ¿cómo se ve en un dispositivo móvil o en una tableta? Es increíblemente importante estar siempre comprobando eso a lo largo de todo este proceso. Entonces, bajemos a eso. Una pequeña opción aquí abajo en la parte inferior llamada Moods Responsive. Se va a dar click en que nos va a tener una vista previa por defecto. Su inconveniente al escritorio, pero podemos configurarlo para tablet para que pueda ver cómo se ve. Una tableta. Podemos editar todo este asunto y el modo tablet, o podríamos mantenerlo en el móvil. Y cuando volvamos a aquí, podemos continuar hasta el final de la página web solo con esta vista, que es realmente increíble. Ese es uno de los grandes beneficios para el elemento o es poder previsualizar en todos los modos con bastante facilidad. Entonces veamos cómo se ve en la vista móvil, y vamos a tener que volver atrás y retocar para asegurarnos de que se vea bien en absoluto. Tres. Entonces probemos primero la tableta para que la tableta se vea bastante bien. Podría necesitar quizás colapsar el tamaño de esta tipografía. A lo mejor justo ahí, ya sabes que tal vez podríamos hacer los botones un poco más pequeños. Hay pequeños ajustes que podemos hacer para que se vea bien. Entonces creo que se ve genial y tablet. Se ve genial. Y escritorios todavía, A pesar de que hicimos el tipo un poco más pequeño, vamos a probar el móvil. Ese tipo realmente empieza a abrumar. Tenemos como que tenemos nuestro menú aquí en el que podemos dar click. Entonces aquí está nuestro pequeño menú bajó muchos que solo serán como un menú de hamburguesas viajar hacia abajo y las estrellas realmente no están haciendo un buen trabajo aquí. Probablemente necesite estar alineado en el centro. Phyllis es asegurarse de que esos centro de aire alineados Volvamos a la línea de centro de contenido la estrella . Entonces eso se ve mejor. Parece que nuestro botón aquí se solapa con la sección, por lo que son pequeños ajustes que necesitamos hacer. Ya veremos cómo se ve en el escritorio ahora que hicimos cambios todavía se ve bien en el escritorio. Entonces quizá necesitemos reducir el relleno aquí y no haber sacado esto un poco . Cosa en Mobile se va a quedar bien en los escritorios. Entonces hay algunos trucos para los que podemos usar para mostrar cosas móviles donde podemos excluir algo determinado con lo que estamos teniendo problemas y hacer algo más en el móvil. En este caso, si voy al modo responsive y voy a Mobile, tenemos un poco de problemas cuando se trata de este botón tipo de superposición a la zona votada mejor ahora. Entonces lo que podríamos hacer es hacer clic en el botón o realmente dar click en la mejor agencia votada aquí mismo, y podemos excluirlo para vista móvil. Bajamos a responsive. Podríamos ocultarlo solo en el móvil, tan avanzado, receptivo, y podemos ocultarlo en el móvil para que ni siquiera esté ahí. Entonces lo que podríamos querer hacer es ocultar esta sección, bajar a responsive y escondernos en el móvil, para que esa sección entera no se vea, y podemos seguir agregando las otras secciones, y también podemos crear un nuevo sección aquí, y es sólo podría existir en el móvil. Entonces si queremos tener un tipo de arreglo diferente, lo que podríamos hacer es crear una nueva sección, ocultarla en tipo de muertes y escondernos en tablet, y solo tenerla en móvil, para que puedas cambiar cosas alrededor y tipo de hacer su propio móvil personalizado hacia fuera. Si tienes un elemento que se ve justa tarea en el escritorio, quieres mantenerlo de esa manera. Siempre podrías tener una especie de sección diferente solo para la versión móvil. Entonces así es como lo haces brevemente. Por supuesto, puedo entrar en más detalle en mucho de esto, así que volvamos a la versión de escritorio. Ahí vamos. Entonces creo que se ve genial y móvil. Gran escritorio. Creo que si eliminamos esa sección y agregamos una nueva sección que funciona solo para móvil, creo que podemos conseguir que esa pequeña sección del dedo del pie también funcione. Por lo que necesitamos hacer esto a medida que pasamos por la página web, seguir previsualizando en los tres modos. Tiene que quedar genial en los tres. Y si no, podemos modificar una sección para que funcione en solo mostrar en el dispositivo móvil. Por lo tanto, sumemos nuestra siguiente sección. Esto es lo que se va a ver. Desplácese hacia abajo. Vamos a hacer que esto suceda aquí mismo. Queremos tener una especie de titular llamado Action Button y vamos a crear este pequeño gráfico que va a deslizarse desde la derecha y animarse igual que lo hizo la versión top. Entonces, construyámoslo a cabo. Añadiría una nueva sección, regresaría aquí a su módulo, y vamos a añadir una intersección aquí mismo. Nos va a crear una cuadrícula de dos columnas, y una va a ser una caja apretada editor tipo Dragon Scott, un editor tipo dragón, en esta caja. También vamos a necesitar algo más, también. Entonces si cambiara este tipo, cambia todo el tipo. No nos deja aislar a un tipo y convertirlo en titular. Cambiará todo el tipo de esa caja. Entonces lo que vamos a hacer es tener rumbo y arrastrarlo justo encima de esta caja. Entonces lo que vamos a hacer es que tenemos aquí nuestra sección principal, y tenemos nuestras dos columnas izquierda y derecha. Y lo que hicimos es que acabamos de agregar un encabezado encima de este cuadro, y ahora tenemos que boxear a la izquierda y una casilla a los derechos que alguna vez encabezamos y copia corporal . Y esta será nuestra foto que eventualmente se sumará. No quiero usar este color melocotón predeterminado. Entonces voy a subir aquí a esta sección principal aquí arriba y ha cambiado el fondo. Dos blancos. Ahí vamos. Entonces ahora tenemos un fondo blanco y sigamos adelante y sumamos en el tipo, y luego podemos ajustar en un poco el estilo tipográfico. Entonces voy a seguir adelante y añadir el tipo y volveré enseguida 64. Sitio web de Wordpress: crea nuestra característica de Instagram: Entonces todo se trata de estar en lugares exóticos y desear que fueras tú quien tomara esa foto de instagram. Entonces es hacer ese sueño. En cambio, Instagram cuenta tu así que sólo haciendo un poco de derechos de autor, un poco de narración. Entonces, solo ajustemos eso Obviamente, Blue no va a funcionar. Entonces ajustemos nuestro tipo. Podríamos hacer en Orange, o podríamos hacer un azul o podemos hacer un gris y que sea neutral. Eso depende realmente de ti. Si sentimos que estamos más de usar el color, podríamos apegarnos a un gris oscuro neutro, que podría funcionar porque creo que como que neutraliza todo ese color que funciona palo a un color de marca. Entonces sólo vamos a ver cómo se ve eso. Sigamos con el color de marca por ahora. Si necesitamos hacerlo neutro porque hay demasiados colores que compiten, podríamos hacerlo más tarde. También hagamos esto un poco más pequeño. Ver cómo se ve H cuatro h cuatro. Y también hagamos de este el párrafo para que vaya al contenido que sea tipo de párrafo, y podemos ir a estilo y ajustar el tamaño de esto como camisas legibles en todos los formatos quiere tratar de hacer 16. Entonces hagámoslo neutral ahora que lo estoy pensando y viendo. Hagámoslo en gris neutro y hagámoslo un poquito más grande. C H tres h tres. Funciona bastante bien. Así que haz tu sueño, instagram cuente el tuyo. Hagamos incluso largos estos dos párrafos. Eso es sólo gobbledygook por ahora, pero creo que eso va a funcionar. Entonces digamos que aquí tenemos mucho relleno. Tenemos un montón de relleno extra aquí. Nosotros queremos especie de cerrar la brecha aquí. Demos click en nuestra imagen principal aquí y veamos si no podemos cambiar algo del relleno. Veamos qué hace cero a su alrededor y margen cero. Ahí vamos, así que como que lo trae un poco, y siempre podríamos cambiar nuestras columnas. Recuerda, podemos dar click a las izquierdas aquí y hacer columna con Hacer este 40% para que tengamos un poco más. Tenemos 60% de este lado, así que es entre el 100%. Por lo que está dividido para maquillar al 100% así 40% 60%. Siento que la imagen debería ser un poco más lucida. Vamos a tener una columna del 60% con para presumir de su foto. Entonces vamos a crear nuestra pequeña imagen de Instagram. Tomó par con este titular. Entonces te voy a ver en la tienda de fotos. Por lo que estoy aquí en Adobe Photo Shop y tendrás acceso a esta plantilla que adapté desde otra plantilla. Pero quería adaptarlo a este sitio web en particular. Pero podrás tener este archivo exacto de Photoshopped. Puedes trabajar conmigo. No tienes que recrear todo el instagram desde cero. Pero ahora eres diseñador bastante experimentado, así que puedes hacer esto fácilmente y recrear los iconos de instagram y todo. Tienes todas las herramientas que necesitas para volver a crearlo desde cero, pero aquí ya está hecho por ti. Adelante, reemplace algunas de estas imágenes. Entonces vamos a quedarnos con esa. Entonces aquí mismo tengo esto como máscara de recorte. Entonces solo vamos a hacer clic derecho y soltar la máscara de recorte. Elimina esa foto y tenemos una especie de solo una caja genial aquí, y sólo vamos a traer otra foto. Tengo No tienes que usar ninguno de estos que estoy usando. Simplemente adelante y trae eso. También podrías traerlo como contenedor. Entonces si quieres hacer un contenedor aquí arriba creando un contenedor aquí arriba usando esta herramienta contenedor de herramientas, podrías hacer eso y arrastrar tu imagen hacia adentro. Eso te hará la vida mucho más fácil. Por lo que fui aquí a mi contenedor, dando click en el lado derecho para poder tener control sobre esta imagen en particular. Queremos tener un empate emocional para el espectador, así que vamos a acercar un poco. Voy a arrastrar esto arriba y tipo de gastarlo un poco aquí, algo así como dado un poco de pop dinámico. ¿ Quieres ver ambas fotos? Tenemos mucho espacio tallado para esto así podríamos cortar una figura cómo queremos arreglar esto, y podríamos seguir adelante y recortar. Esto está bien, no necesitamos tanto espacio. Es cosecha que un poco justo aquí. No tenemos demasiado espacio en blanco porque va a agregar mucho relleno natural. Siempre podríamos agregar relleno en nuestro contenedor. Así que hagamos lo suficiente para conseguir ese poco de una sombra de gota que muestra la prensa enter y solo tipo de mostrarte cómo traer activos cuando estás construyendo diseños web. Por lo que queremos exportar. Este es un P y G. Queremos poner esto sobre un fondo de color. Queremos asegurarnos de que no pase nada en segundo plano. Entonces voy a seguir adelante y exportar esto como PNG. Bajemos a PNG. No queremos que sea tan grande. Entonces si tenemos un 1919 de 20 píxeles de ancho de un escritorio y ese es probablemente el mayor usuario que vamos a tener, estamos usando sólo la mitad de ese tamaño. Así que digamos digamos 1000 1000 pixeles. Iba a ajustarlo automáticamente para nosotros, así que sigamos adelante y traerlo como imagen. Entonces vamos a nuestros elementos y vamos a arrastrar en un sencillo widget de imagen. Ahora vamos a dar clic aquí para elegir imagen, y vamos a subirla a nuestros medios, y ya tengo una creada a partir de una versión anterior, así que voy a dar clic aquí y es dar click en Insertar Media y se va a actualizar para nosotros. Esos limeys arriba un poco mejor. Entonces sigamos adelante y pinchemos en nuestro contenedor principal izquierdo. No sólo el titular, sino toda esta columna de la izquierda, y sólo vamos a desvincular esto y sólo queremos poner un poco de relleno en la parte superior para que algo así lo alinee con la foto. Podríamos hacer nuestra imagen un poco más grande, así que ahora mismo la tenemos por 10 24 por 10 24. Pero siempre podemos cambiar el tamaño en cualquier momento que queramos y también la alineación. También lo vincula hacia arriba también. Entonces lo que quiero hacer es añadir esa misma animación. Volvamos a lo grande porque quiero tener demasiado de un hueco aquí abajo. decir, Esdecir,solo depende de cuánto tipo quieras tener abajo en esta zona. Entonces hagamos esa misma animación donde este pequeño bloque se desliza hacia la derecha, así que vamos a Avanzado Motion afecta. Podríamos hacer un desvanecido en asumir un rebote. Sigamos con nuestra diapositiva adentro, deslízate hacia la derecha y podemos tener esta diapositiva hacia la izquierda. Por lo que con sólo hacer clic en esta columna efectos de movimiento avanzados, Vamos a deslizarnos hacia la izquierda. Vamos a tener esto retrasado un poco, por lo que la imagen se retrasa ligeramente a la derecha, Así que los efectos de emoción. Vamos a retrasarlo sólo por cinco medio segundo. No quiero demasiado retraso, Vale, Vale, así que actualicemos y veamos qué tenemos hasta ahora para esto. Haga clic en los cambios de vista previa y veamos cómo se carga. Y además, si tiendes a tener problemas con el tiempo de carga, quieres asegurarte de optimizar la exportación. Entonces digamos que esto es creo que son 800 kilobytes, que es bastante grande, pero es de alta resolución. Vemos lo que es. 863. Siempre se podría exportar de manera diferente hacia fuera una tienda de fotos. Si el tamaño es una preocupación o el tiempo de carga es una preocupación. Es goto file export en lugar de solo exportar, como se puede decir para Web, y te va a dar un poco más de control sobre la reducción del tamaño del archivo. Entonces si nos alejamos, seleccionamos PNG ocho curso. Podríamos cambiar su tamaño de imagen hacia abajo 1200 que lo reducirán. Entonces ahora esto está por debajo de los 319 k así que pudimos reducir el tamaño del archivo en un 60%. Entonces hay y hay alguna reducción de calidad que se obtiene cuando se hace eso. Pero es que es todo de ustedes. Tan solo necesitas asegurarte de que todo esté cargado correctamente. Intenté otro. Computadoras. ¿ Cómo? ¿ Con qué rapidez se carga? Si tienes problemas para cargar, revisa tu video, revisa tu video, asegúrate de que no esté requiriendo demasiados datos y lo mismo con las fotos Esta optimización de fotos para la Web y asegurándote de que tu tiempo de carga sea una prioridad. Adelante y hagamos nuestra prueba aquí. Aquí tienes tu prueba desplazándose hacia abajo. Adelante y refresca eso una vez más, así que todo tipo de deslizarse hacia adentro. Se ve bien. Podemos retrasar un poco eso. Podemos tener un traer más lento y lento. Vamos a tener un retraso adicional por un segundo y tener un retraso aquí por dos segundos. O tal vez 1500. Un segundo y 1/2. Veamos cómo solo estamos probando las cosas y viendo cómo se actualizan las cosas. Ahí vamos. Bonito, hermoso. Por lo que ahora estamos listos para la siguiente sección cuando hagas sitios web cuando tengas un área grande. Entonces digamos que esto es muy blanco. Entonces tenemos mucho color aquí arriba. Estamos usando nuestros colores. Tenemos mucho blanco aquí abajo, y en este caso podríamos incluso cambiar uno de estos dos azules. Hagámoslo realmente rápido, porque estoy viendo que esto va. ¿ Sabes qué? Realmente necesitamos un poco de azul aquí. Entonces cambiemos esta barra a azul, que es diferente a cuando originalmente planeé entrar en estilo para ir a nuestro contenedor, ir al estilo y hagamos nuestro azul de marca. Y entonces sólo necesitamos cambiar este dedo del pie naranja, las estrellas o naranja. Aquí vamos. Entonces ahora, ¿qué hacemos con la siguiente sección? Por lo que tenemos esta gran área blanca. Lo que me gusta hacer es tener mucho contraste, sobre todo después de tener una gran área blanca 65. Sitio web de Wordpress - 3 la composición de 3 columna: Ya que tenemos la fuerte barra azul, vamos a añadir una sección naranja aquí abajo donde los fondos todo naranja para agregar un poco de ese contraste blanco y negro donde tienes un fondo de alto contraste. Después tienes una luz y luego tienes un color alto y como que realmente sacude el diseño en lugar de hacer sólo otra área blanca con tres iconos. Vamos a sacudir nuestros antecedentes. Es lo que queremos hacer. Queremos agregar una nueva sección. Entonces lo que queremos hacer es en una sección de tres columnas, queremos agregar tres iconos, tres secciones de párrafo de cuerpo y queremos agregar un fondo fresco que va a coincidir con nuestra naranja. Entonces lo que vamos a hacer es que vamos a traer en nuestra intersección, y por defecto lo es también. Entonces hagámoslo tres para ir aquí mismo, y vamos a añadir unas nuevas columnas. Voy a añadir tres columnas. Así que hice clic aquí mismo en esta fila. Ahí es donde estamos agregando la tercera columna. Entonces lo que queremos hacer es volver a nuestros elementos aquí y arrastrar en algunas cosas, así que queremos tener una Nikon, Así que vamos a hacer una imagen aquí mismo en medio de la caja fueron arrastrarla ahí mismo. También vamos a querer tener un encabezado, algún tipo de título al mismo. Entonces hagamos un encabezamiento justo debajo, y luego queremos hacer por último, un cuadro de texto. Vamos a escribir editor de texto justo debajo. Asegúrate de conseguirlo en la caja correcta. Vamos a hacer uno, y luego podremos duplicar esto para poder ahorrar tiempo y edición. Entonces lo primero que queremos hacer es cambiar nuestra imagen. Yo quiero tener tres iconos que usamos para esto para que simplemente no podamos tener tipo aburrido. Podríamos tener algún tipo de imagen que vaya junto con ella. Por lo que tengo estos como descargables. Recurso es que se puede subir. Tengo los tres de estos es los tres iconos que creamos antes en la clase. Basta con dar click en su imagen. Adelante y encontremos esos. Hagámoslo primero. Adelante. Contesta eso en. Cambiemos tu rumbo. Hagamos el fondo porque lo que quiero hacer es poder encontrar el estilo tipo correcto . Y si pongo el fondo, podré encontrar el contraste adecuado para el tipo. Entonces sumemos nuestros antecedentes es su sección principal, igual que hicimos en el principio mismo. Estamos dando click en nuestra sección principal y vamos a ir al estilo. Vamos a agregar una imagen por lo que haremos click en clásico Podría hacer una imagen. Ya tenía esto montado, pero está en azul. Entonces vamos a hacer esto juntos y Photoshopped usando naranja en su lugar. Por lo que tenemos nuestro color naranja de nuestro paquete de marca donde va a asegurarse de que tengamos ese código X disponible. Vamos a ir a la tienda de fotos y vamos a usar esta imagen aquí mismo. Puedes usar cualquier imagen que quieras. Esto es sólo una foto de fondo. Podría ser cualquier foto de viaje que quieras. Vamos a seguir adelante y cambiar esto así que voy a hacerlo. A veces es más fácil. Simplemente puedes hacer una herramienta de bucker de pintura en tu código hexadecimal o haces algo aún más fácil. Basta con hacer un cuadrado e ilustrador y simplemente arrástrelo sobre la parte superior. Y queremos cambiar estos. Quieres poner esta foto en la parte superior y no haríamos unos modos de mezcla. Vamos a bajar todo el camino para encontrar cuál creemos que se vería bien y aún así retener la naranja. No queremos que se vea lavado. No queremos que no se vea como el color de marca. Por lo que muchas veces la luminosidad funciona muy bien. Y luego simplemente reduciremos la capacidad aquí para que pudiéramos ver tipo arriba, así como así. Y ahora realmente no lo necesitamos. Bastante es grande, pero eso está bien porque podemos recortarlo como fuimos allí. Pero escucha recortar un poco de este tipo hacia fuera, y también queremos reducir el tamaño del archivo. Entonces vamos a reducir el tamaño de la imagen. Por lo que imagen tamaño 6000. Ese es un tamaño de alta resolución bastante grande. Entonces esto sólo va a ser un tamaño de fondo. Entonces vamos a ver si no podemos salirnos con la suya el 2000. Y como esto es un trasfondo, no estoy tan preocupado por la calidad. Iba a exportar archivo web más seguro y podríamos hacerlo en un poco de menor calidad. Asegúrate de que esté en P y G, o en este caso, supongo que podríamos hacer J peg simplemente porque no necesitamos nada para ser transparentes. Entonces hagamos un J. Paige que siempre sea un poco menor en tamaño de archivo. Podríamos reducir un poco la calidad para bajarla y luego seguir adelante y dar click en Guardar. Ahora podemos seguir adelante y subirlo, y tengo el azul. Por lo tanto, también pones el naranja en el archivo descargable para que puedas seguir adelante y tener esto hecho por ti inserta. Y ahora podríamos poner ahí a White. Podríamos empezar a hacer nuestro texto cerca de una línea central. Hagámoslo de cuatro años. No necesitamos que esto sea demasiado grande. Hagámoslo en color de texto de estilo blanco. Acostúmbrate de verdad a todo esto después de hacerlo 70 veces. Entonces cambiemos el relleno aquí en esto no es mucho relleno aquí. Vamos a condensar que iba a subir a avanzado. Encendido cero primero dijo nuestros márgenes cero solo tipo de traer eso un poco más . Lo mismo para esto. Podemos hacer click en el contenedor principal tipo de conjunto un relleno cero. Realmente lo va a apretar, pero eso está bien, porque podríamos ajustar eso. Quién sabe cómo cambiar el relleno en este contenedor grande y también en el contenedor de sección principal , así que siéntete libre. Si no estás obteniendo los resultados que necesitas, asegúrate de ir a tu contenedor principal y revisa tu palmadita allí también. Entonces, ¿qué estoy viendo aquí? Cambiemos la posición de la imagen porque no está viendo realmente nada en la imagen del valor. Entonces es ir y seleccionar nuestra imagen de fondo aquí, y podríamos cambiar la posición. Haz un centro a la izquierda o, si lo haces fijo, va a hacer pobre de un estilo paralaje. Entonces, cuando te desplazas hacia abajo, puedes ver como son las imágenes estáticas. Se podría ver más de la imagen de esta manera. Así que acabo de ir a Attachment y Major estaba en Scroll fijo. Y como estoy haciendo esto, me estoy dando cuenta de que es realmente difícil de ver en el naranja, y realmente creo que mi idea original con el azul podría funcionar mejor, pero eso no es problema, porque puedo cambiarlo puesto en azul. Eso se ve mucho mejor, creo, en mi opinión personal, déjame simplemente ajustar el relleno a un poco más de espacio para respirar, volver atrás y ajustarme porque realmente quiero ver esa foto genial. Entonces una cosa que podemos hacer es que tenemos esto. Podríamos hacer eso de nuevo. Dragón, un dragón fotográfico, un encabezado. O podríamos duplicar toda esta caja. Entonces eso es lo que vamos a hacer es hacer click arriba de la parte superior, que va a ser toda esta caja, click derecho, duplicar, click derecho, duplicar, y luego eliminar todos estos fue derecho. Haga clic en eliminar derecho Haga clic en borrar. Y ahora todo lo que tenemos que hacer es reemplazar nuestras imágenes y reemplazar el texto de Oliver. Y luego terminamos con nuestra pequeña cosa de tres columnas. Va a fluir así como así. Entonces, ¿cómo podemos agregar un poco? Y parece que esto está un poco apagado. Parece ver cómo eso no está en la misma línea. Bueno, es un icono de ajustador ligeramente Así que estoy aquí con estilo en mi solo por mi imagen, solo tipo de asegurarme de que todo se alinee. Entonces simplemente cambiando los látigos ir y cambiar el ancho de este estilo de imagen. Yo quiero asegurarme de que todo eso se alinea bastante bien. También cambió el rumbo a nuestra naranja. Quién podría necesitar hacer un tono más claro, y eso está bien. Vas a tener instancias donde necesitas tenerlo en un fondo más oscuro. Es por eso que, en tu branding, tienes múltiples tonos de naranja, no solo un tono de naranja como nosotros. Tienes múltiples tonos, así que lo que podríamos hacer es salvar la sombra, agregar eso justo sobre que son perfectos. Pensé que eso añadía un poco más de contraste, pero aun así no fue abrumador. Entonces sigamos adelante y guardemos esto y veamos cómo se ve en vista previa en vivo. Entonces aquí está todo tipo de entrar. Tus exóticas vacaciones comienzan aquí. Se puede dar click a otro enlace a la mejor agencia de viajes. Haz tuya tu cuenta INSTAGRAM. Estaría bien si tuviéramos un poco de animación cuando nos desplazamos por aquí, así que volvamos y hagamos un poco de animación en estas cajas. Estoy dando click en esta caja principal, no sólo en la imagen única, sino en toda la cajita principal aquí, y vamos a ir a la misma cosa. Hemos estado haciendo efectos de movimiento avanzados. ¿ Qué tiene este tobogán a la izquierda? Hagamos que esta diapositiva se deslice hacia arriba y luego que ésta sea como la dirección opuesta , diapositiva y derechos. Es ligero y luz izquierda y derecha y se desliza hacia arriba. Entonces vamos a ver cómo se ve eso. Y ahí va. Todo eso se ve muy bien, y tenemos este tipo de desplazamiento promedio de paralaje del fondo que se ve realmente bien. Y podría incluso cambiar eso. Revertir eso de nuevo a naranja ya que no habríamos volteado azul. No es gran cosa. Vuelve arriba y cambia estos, y ahora tenemos ese naranja más claro. Casi me pregunto si podemos agregar en lugar de que estos sean del mismo color exacto, podríamos cambiar tu botón para que no esté compitiendo con la barra. Cámbiala a nuestros colores azules más claros para ver cómo es un tono ligeramente diferente, pero sigue en la misma familia. Creo que eso se ve mucho mejor, así que ahí vamos. Sigamos adelante y lo veamos una vez más. Este es nuestro último tipo de prueba aquí. Hay una cosa más que creo que realmente podríamos adherir y siento que falta algún tipo de estructura aquí, como si tuviera que haber algún tipo de barra divisoria en algún lugar dividiendo tipo de estos tres elementos hacia arriba. Entonces agreguemos una barra dividida a esto. Entonces todo lo que tenemos que hacer es volver aquí a divider. Vamos a deslizar divisor justo entre aquí. Podríamos cambiar nuestra línea aquí a cualquier cosa que queramos que sea. Por lo que quería probar algo con curvas. Entonces intentemos curvado, y podríamos cambiar el ancho para que no vaya todo el camino a través del centro. Alinearlo, ir al estilo. Podríamos hacer ese cambio blanco. El peso y el grosor y cambiar el tamaño era agregar un poco de un borde ahí, agregar un poco más de una cantidad o reducirlo sólo un poco de espacio algo. Lo que se reduce que un poco solo agrega un poco de área divisoria ahí que puede agregar eso a los otros dos también. Incluso podemos hacer clic derecho, duplicar y distraer todo clic derecho duplicar en Dragon justo encima. Creo que eso se ve bastante bien. Creo que sólo hay que añadir esta es la final cuando creé antes de filmar la clase. Por lo que quiero asegurarme de que hagamos ese último paso para poder mostrarte cómo hacer un botón de llamada a la acción . Entonces para esto y no, no creo que necesitemos tanto texto. Ahora tendríamos un botón de acción llamado, que es realmente bonito. Subamos aquí y solo hagamos. Ahí hay un botón. Lo tenía justo aquí. Cuando quiero hacer es centrar alinearlo, haciendo un icono medio agregado que creo que coincidiría realmente bien. Hagamos una flecha. Me hago un poco más grande al ir y cambiar los colores de esto. Y ahí vamos. Lo tenemos todo listo para nosotros. 66. Sitio web de Wordpress - diseño responsivo: Ahora es el momento de probar esto. Agregamos. Nuestro botón de llamada a la acción aquí ajustó el relleno en esto para tener el espaciado agradable aquí. Entonces sigamos adelante y probarlo. Vayamos al estado de ánimo receptivo. Veamos cómo se ve en la tableta. El top se ve muy bien. El pequeño bar se ve muy bien. Esto podría necesitar un poco de relleno aquí. Esto probablemente podría reducirse en tamaño. A lo mejor como un poco de relleno añadido entre las columnas. Adelante y hagamos algunos de estos ajustes. A lo mejor este tipo no necesita ser tan grande, por lo que podríamos encontrar un número que funcione. Entonces tal vez 22 o tal vez algo entre ese 30. Cambia el ancho de ese icono para que coincida con los demás, igual que pequeños ajustes que podríamos hacer. Veamos de qué podríamos hacer. Llámalo. Entonces hagamos esto Principal padre aquí Super puede ajustar el relleno para tener un poco más espaciado Cada poco estos aire tienen estos aire anidados también, así que tenemos esta columna principal, pero también tenemos estos también, cada columna individual. Demos click en la columna de la izquierda. Sí, y ahora eso se ve un poco mejor en, uh, ese escritorio también podemos cambiar. Esto está bien, para agregar algo de relleno. Vamos avanza desvinculado eso y hagamos algo de relleno izquierdo. Ahí vamos. Por lo que solo haciendo algunos ligeros ajustes a la vista móvil. Entonces volvamos al escritorio. Asegúrese de que no había nada realmente comprometer drásticamente. Todo se ve muy bien. Se ve genial. Tablet se ve bien. Y aquí está el gran pateador. ¿ Cómo se ve? Y móvil. Por lo que excluimos eso. Entonces eso va a ser genial fuera. Entonces solo vamos a tener tus vacaciones exóticas empieza aquí reservar ahora, Así que tienes algunos ajustes que necesitamos hacer. Eso va a ser algo difícil. Es el equilibrio ¿Cómo se ve el escritorio? No ha mirado en la tablet y tener, es que se ve en móvil. Y podría ser que esta cuadrícula de tres columnas no colapse muy bien cuando la reduce a móvil. Y eso está bien. Podrías tener podrías excluir toda esta sección haciendo clic aquí, bajando a responsive y ocultándolo en el móvil. Te escondes en el móvil , ni siquiera se mostrará. Podrías agregar una nueva sección que es de apenas cuatro móviles y podría ocultarla en la tablet de escritorio , y es solo para ti. Va a ser un poco más fácil de leer, así que hay mucho en lo que pensar a la hora de diseñar un sitio web, y esto es sólo lo básico. Esta es solo la versión gratuita fuera de la caja de Element o y simplemente usando los widgets predeterminados . Esto no es nada que cuando te inscribes para un conteo pro, haya plantillas pre hechas para ti. Pueden arrastrar y soltar y cambiar las cosas. No tienes que construirlo desde cero. Una vez que actualicemos, podríamos volver a nuestro menú desplegable de hamburguesas aquí, y podemos ir a salir del tablero, volver a nuestro panel de WordPress, volver a nuestras páginas. Y ahora sabemos que esta prueba, que ahora es la que era nuestra página principal, ya está disponible. Y si alguna vez quieres volver atrás y editarlo, solo tienes que ir por aquí y dar click en editar con Element tour para que puedas crear nuevas páginas y tener todas ellas enlazadas y crear lo mismo con el elemento. O así digamos que queremos editar nuestra página de galería. Se puede editar aquel que no había agregado con Element Tornado para pasar por el mismo proceso. Por supuesto que podrías guardar plantillas aquí, para que no tengas que empezar de nuevo desde cero, pero quizá quieras hacer algo un poco diferente galería. Entonces una vez más, ese título se está mostrando, así que volvemos por este proceso de nuevo. Bajamos a la configuración, podríamos ocultar el título, obtener la página predeterminada con elemento o ancho completo. Va a cambiar a lo que hicimos antes. Entonces así configuró la página para empezar, y debería darte un nuevo comienzo. Entonces aquí estamos en la página final. Estamos todos terminados. Esta es sólo la página principal. Todavía necesitamos enlazar todas las demás páginas. Hay enlaces de ancla que puedes hacer para que sea más un sitio web de estilo paralaje. Hay mucho más trabajo del dedo del pie, prensa y tanto más al elemento, o es difícil hacerlo en tan solo una pequeña sección de una clase mucho más grande. Entonces lo que podría hacer es hacer un proceso completo . Trabajaremos a través de todo el proceso de la página web, ya sabes, atenderemos un proyecto de 15 horas. Si ustedes estaban interesados, por favor avíseme. Me encantaría enseñar algo así. Vamos más a fondo. Pero quería presentarles a todo el mundo esto para mostrarles lo fácil que es hacer su propio trabajo personalizado. Y lo mismo se puede aplicar a Squarespace to Wickes toe web flow. Todos tienen un constructor similar. No van a funcionar todos exactamente igual. Pero los conceptos se airean ahí. Y mientras sepas diseñar correctamente para la Web, podrás tener en mente todas las mismas cosas por las que pasamos. Incluso si decides no usar wordpress o decides usar otra cosa, ojalá la sección siga siendo útil. Por lo que ya no te intimida agregando diseño Web a tu habilidad. Ambientado como diseñador gráfico,