Transcripciones
1. Introducción a la la gestión de proyectos de diseño web: bienvenido a mi curso sobre cómo manejar del proyecto de diseño. Ahora en las partituras, voy a compartir con ustedes todo mi proceso fuera haciendo un proyecto de diseño Web desde tomar a los clientes breves traducir esos escritos e inspiraciones de clientes en diseño real. Cómo experimento realmente con diferentes tipos de letra, diferentes colores. Cómo mi diseño voss dio forma y cambió drásticamente después de obtener feedbag de los clientes. Cómo puedes obtener retroalimentación de otros diseñadores y usarlos para mejorar tu diseño y cómo te vas del dedo del pie. Colabora con tus desarrolladores cómo te vas del dedo del pie. En realidad despliega tu proyecto a tu cliente servicios postventa y mucho fuera de cosas. Por lo que hay mucha información valiosa información escondida dentro de esta clase. Entonces si estás confundido acerca de cómo, en realidad funciona todo el proceso off Web design y cómo puedes completar eso con éxito desde los clientes, Briefs toe realmente otorgó un diseño de página de aterrizaje, cual hice en mi último proyecto. Te voy a compartir dos ejemplos fuera de mis últimos proyectos en esta clase o curso así, si tienes alguna pregunta, este es un curso de enfoque práctico No te voy a enseñar diseño. Esto se trata de todo el proceso que uso se va a mejorar Cómo miras el diseño, cómo te vas dedo del pie Toma tu diseño en remolque Una dirección específica. Por lo que hay mucho fuera se pueden decir técnicas que uso. Voy a compartir con ustedes. Espero que disfruten de las anotaciones. Si tienes alguna pregunta, siempre
puedes preguntarme o empezar una discusión. Espero verte pronto dentro de las escuelas.
2. Interpretar el informe del cliente con ejemplos de el mundo real: en esta lección de este redo, voy a hablar de clientes Especificaciones para un proyecto de diseño Web o lo que usted llama clientes breve para un proyecto de diseño Web. Voy a compartir con ustedes un breve de vida real que recibí como hacia hace tres meses . Hace poco hice este proyecto. Fue una página de aterrizaje para Nick responsivamente. Gran diseño para ah ah ah, Iris o colección de textos, Servicio o textos. El derecho está en Estados Unidos, y voy a compartir con ustedes cómo en realidad,ya
sabes, ya
sabes, conseguir dedo del pie este cliente breve Hoy realmente lo leí. Cómo realmente señalas cosas diferentes y lo que tenemos que considerar al leer clasificaciones breves de clientes y clientes. Por lo que guardo mayormente cosas en una carpeta llamada Client Specs. Entonces cuando lo abro, se
puede ver aquí son diferentes recursos ¿Es re fuentes las cuales son enviadas por cliente. Ya estaban trabajando en algo que era este diseño, y ya
lohan lo desarrollado. Entonces no quería que tuviera un marco de alambre. Entonces cuando ya tienen algo, ¿alguna forma está fuera de su idea? Entiendo que esto es en realidad que querían construir así que no les
dije, ya
sabes, que el dedo del pie dibuja marco de alambre mayormente. Lo que hago es dejar que dibujen marco de barra. Entonces si me enviaron algo como esto, les envío email de vuelta y les digo que ¿Qué buscas? Entonces lo que realmente quiero ser así que déjame mostrarte un ejemplo. De acuerdo, entonces aquí tenemos otra página de aterrizaje, que hice el año pasado. Página de aterrizaje de Vmc. Y si lo miras o aquí puedes ver aquí tenemos perros de muelle de documentos plying, y esta es en realidad su página de aterrizaje. Este es en realidad su breve. Y este es el boceto que obtuve de ellos, así que les dije eso. ¿ Qué buscas? Qué tipode página de aterrizaje. Estás buscando cuerpos en tu mente. Entonces dibujan algo así. Aquí tenemos logo call, botón de
llamada. Entonces tenemos esta imagen escuchará casa asequible y fácil de usar. Formulario de señalización digital por aquí. Alguna información por aquí industrias estos productos pueden funcionar y cosas por el estilo. Videos de deber. Y este es un número telefónico y ah, ahí, dirija algo así. Entonces esto es lo que realmente hago les digo que dibujen algo para que yo pueda ustedes saber, ellos pueden hacer eso en cualquier palabra o cualquier software. El aburrido punto de poder. Sea cual sea el uso, pueden dibujar algo así y me lo pueden enviar. Estos son todos el recurso diferente es que obtuve de ellos. Esta es en realidad la página de aterrizaje, que te voy a mostrar. Se trata de estas otras especificaciones. Dos o tres cosas que deben tener tu breve debe tener glaseado es lo que en realidad quieren . Segundo es cuál es su competencia. Para que puedas ver Sky Kit. Me aseguraron que estos son este es un sitio web fuera de sus competidores. Entonces me aseguraron que ¿qué? En realidad advirtieron Qué son diferentes Puedes decir características fuera de su producto. Um, estos son diferentes, Se
puede decir usos fuera de su producto. Y eso es también estos son este es en realidad el breve. Por lo que este breve era muy pequeño. Pero si les muestro el reciente que acabo de abrir aquí, este es un dolor muy grande, que tiene nueve páginas de largo. Y la razón es que ya estaban trabajando en algo que es este modelo de trabajo. Por lo que querían integrar esta forma, que en realidad es una forma de encuesta en remolque, el diseño que estaban haciendo. Y creo que esto la persona que desarrolló esta waas alguien diferente y, ah, yo, que yo era diseñador. Y también lo voy a preparar en remolque concedido para Mitt porque ahora estoy trabajando con un desarrollador, Así que eran diferentes. Por lo que este fue citado por otra persona. No sé quién fue ese. Entonces eso hay pocas especificaciones más que puedas ver. Mueve esto por aquí. Mueve esto por aquí. Y si nos fijamos en este, estaban ahí estaban mucho fuera de especificaciones diferentes como esta es su competencia. Entonces me mostraron que esto es una competencia y ver lo que tienen en su
versión móvil . Entonces tuve que buscar abrir mi dispositivo móvil y ver por qué pasa en realidad estos enlaces y qué significaban realmente. Por lo que tienes que leer la documentación de tus clientes de disco de especificaciones especificamente, palabra por palabra. Tienes que notar todo lo que te están diciendo. Tienes que saber abajo. Puedes usar el papel y papel malo emparejado a lápiz y puedes ver aquí Tenemos diferentes secciones para escritorio. Entonces este es mi cliente de, como, dos o tres, creo que hace más de cuatro o cinco años. Este es el único cliente para el que trabajo. No tomo muchos proyectos de diseño en estos días, así que puedes ver qué Aquí. Oye, es muy específico sobre las cosas que me gustan. Necesitamos algo encabezado en este encabezado de lo que necesitamos. Esta es la siguiente sección de la que tuvimos esta escuchar y leer testimonios reales de desgravación fiscal donde vamos a tener algún tipo de thes reproductores de audio html cinco reproductores de audio. Por lo que esta especificación, este documento es en realidad sobre el diseño y el desarrollo fuera del discurso, ni sólo un diseño. Entonces estoy en realidad se puede decir, Jack Off altera casi. He dejado desarrollo Web y se lo he dado a una persona que es más experiencia y más . Se puede decir exportar en cordones y más rápido que yo. Por lo que me mantuve mi mantenerme solo en justo a la tarea de diseño. Y realmente me encantó diseñar. Disfrútalo. Yo yo cuando me metí en algún problema de acuerdo, verdad ya sabes, sueños. Mi energía, mucho con mucho discurso,
así que trato de abstenerme de eso. Por lo que estas son todas las diferentes especificaciones. Incluso me aseguraron algunos guiones ahí. Scripts de Google que querían a Toby cargado con su paralaje de página con números. Había algunas secciones, videos de
YouTube, y había algunas secciones que no estaban incluidas ahí. Especificaciones están ahí página ya construida o aquí, Déjame mostrarte si la tengo abierta por aquí en alguna parte. No. Está bien. Por lo que para el móvil, tenían diferentes, um, diferentes especificaciones. Entonces como lo llamamos, lo
llamamos diseño adoptivo. Entonces en un dispositivo móvil, tu diseño, tus cosas, van a cambiar. Y se van a representar de manera diferente cuando estés en tu versión de escritorio. Por lo que la versión de escritorio y las versiones móviles no eran lo mismo. Te voy a mostrar en un minuto. Esto es lo último que se puede ver. Um, esto es lo que realmente desarrollamos. Por lo que esta es una versión final desarrollada fuera del mismo sitio web, por lo que puedes ver este es el encabezado. Basta con mirarlo. Voy dedo del pie,
cámbialo dedo del pie. Um, eso es un Así que voy a cambiarlo a dedo trasero normal. Se puede ver que esta es la versión de escritorio. Déjame mostrarte eso. Aquí tenemos el número de teléfono en la parte superior, y luego tenemos esta carga. Consigue un análisis de texto libre de impuestos, y al hacer clic en este botón, esta granja se va de pie. Asegúrese de que se muestra por aquí, y puede usar eso y seguir adelante. Sigue sintiéndolo. Y cosas así se están moviendo a la siguiente fase. Ahora, cuando te mueves a esta, um, versión
receptiva, puedes ver u escuchar todo esto cambia. No tenemos ningún número telefónico por aquí, y tenemos un Addo y después del adulto, tenemos este formulario para sentir y el número de teléfono se está pegando en la parte inferior. Entonces si te mueves así, puedes ver el número completo se va a pegar en la parte inferior. Y esto es en realidad lo que los clientes necesitaban a partir de sus especificaciones. Querían dedo del pie pegar su número de teléfono por aquí, así que había dos o tres cosas que eran realmente importantes del dedo la línea número uno está en toda
esta área completa o la primera vez que algunos usuarios ven ahí. Página web. Deben ver esta forma por aquí para que en la parte inferior se pueda ver la forma Saray. Estaban realmente orgullosos de hacerlo, así que querían mostrárselo a todos. Entonces el segundo fue este número telefónico y ah, pocas otras cosas. Al igual que tenían estos testimonios, testimonio
de audio. Realmente querían que fueran,ya
sabes, ya
sabes, jugables
con precisión, fácilmente accesibles o cosas por el estilo. Además, querían que se cargara muy rápido. Había tres o cuatro requisitos que eran realmente necesarios, y realmente no quieren parecerse a sus competidores. Entonces este es el problema más difícil. Cuando un diseñador intenta inspirarse o trata de ver la competencia, intentan dedo del pie 10, crean un diseño que está muy cerca de la competencia. Y esto va a, ya
sabes, parecer una copia fuera de su competencia. No queremos lucir así. Así que intenta leer a tus clientes breve palabra por palabra, ni abajo diferentes puntos. Voy a recapitular lo que en realidad quería que hicieras en el breve del cliente, y luego lo que ibas a hacer es dejar que tu cliente dibuje sus viles marcos. Tienes que saber lo que en realidad significaban. Cuáles son las partes más importantes de ahí. Su breve. Entonces todas estas son cosas diferentes, lo que quieren lograr. Este es uno de ellos. Creo que no quiero que esta conferencia Toby vaya demasiado tiempo. Entonces pasemos a la siguiente lección donde les voy a mostrar cuál es en realidad mi diseño calentamiento y lo que realmente hago, cómo obtengo la inspiración, usando la inspiración de mis competidores y lo que realmente hago en esta cara. Entonces pasemos a la siguiente lección.
3. Cómo dirigir el diseño del sitio web de competidores: ahora en este video, voy a contar cómo vamos a mirar a sus competidores, a sus clientes, a
sus computadoras y a qué son diferentes. Puedes mismo sugerencias de diseño o direcciones de diseño. Vas a agarrar de su página web de sus diseños. ¿ Y qué vas a hacer en tu diseño? Formar? Entonces por paso, Cuando entendí a los clientes breves, el segundo paso que di es visito este sitio web que es centro de desgravación fiscal dot org y se
puede ver esta es su forma apenas pop up. Y esto es casi lo mismo que habíamos desarrollado. Para que puedas ver personal y llenes este formulario y obtienes evaluación gratuita. Por lo que esta es sólo una forma de paso. Lo que teníamos en realidad es un formulario de encuesta de varios pasos. Entonces si trato de cerrarlo, puedes ver que volveré. Entonces en general, lo que siento es azul en la parte superior, que es azul oscuro, que es profesionalismo del dedo del pie dama, que son realmente profesionales. El notado fuera cosas serias de negocios. Entonces por aquí, que es azul muy pálido, un azul celeste claro que es amable invitando. Entonces me están mostrando que están realmente tranquilos y están invitando a los realmente quieren que yo
llene conseguir una crítica gratis. Y esto pero Y se puede ver esto es realmente naranja oscuro, que realmente no me gusta. Este es de color muy afilado, tal vez solo para atraer la atención agarrada. Y cuando nos preocupaba en pantalla Muy pocas palabras por aquí son número móvil. Apenas se puede hacer clic en este número de móvil, no todo el texto. Y, um, por aquí desde aquí, muy genético. Se puede ver yo callos no muy profesional mirando aquí otra vez, iconos
muy genéricos. No puedo distinguir la distancia entre estos rubros y este estos cuatro rasgos o lo que tengamos. Entonces otra vez, han visto algo parecido a éste. Escucha a Richard o a quien tengan. Después tienen tres videos por aquí, y se puede ver que algo está cambiando a lo largo de las líneas. Que es que se puede ver. Se puede ver toda esta línea azul o esta sección azul o aquí, que está demostrando que se trata de una sección nueva, pero en la parte superior, no tiene nada como esto. Entonces esto es como si trato de
juzgarlo, es muy, ya
sabes, no de aspecto profesional. No tiene equipo visual. Apenas diferentes secciones combinadas juntas. Entonces este es todo su diseño. Además, están mostrando muchas caras por aquí solo para quitarle la confianza al usuario o al visitante . Entonces en realidad es Ah, un efecto psicológico, un efecto psicológico,
que es de hecho, un hecho real que cuando ves caras, vas a ser más laxo. Que esto es Ah, este sitio web te va a ayudar. Entonces después de conseguir unas cuantas direcciones de diseño o cosas de su sitio web de computadoras, voy a hablar con mi desarrollador y voy a asegurarme de que fácilmente pueda llamarlo y hey, no tenga ningún problema. Por lo que tengo que decidir mi sistema de rejilla. Por ejemplo, si mi desarrollador está usando bootstrap, tengo que estar usando el mismo bootstraps del sistema de cuadrícula, para que pueda fácilmente canjear eso. Entonces estas son las pocas cosas que yo, ya
sabes, obtengo de la computadora. Y luego platiqué con mi desarrollador y le muestro que estas son las especificaciones. Así es como vamos del dedo del pie Ah, termina este producto o este proyecto y esta página de aterrizaje serás es será ¿Cuáles son tus preguntas? Entonces si tienen algunas preguntas ahí dentro, mente que pregunten a ciegas sobre esto o aquello y que vamos de pie hacer todas estas preguntas antes de empezar nada. Entonces así es como en realidad obtengo diferentes direcciones de diseño. ¿ En realidad estoy a prueba? ¿ Qué? En realidad, la palabra fuera de su computadora. ¿ Cuáles son las indicaciones de diseño que busca mi cliente? Por qué, en
realidad, en realidad piensan que esto es lo que quieren. Entonces, ¿por qué es eso? Porque es muy acogedor. Muestra muchas caras. Tiene un botón de revisión gratuito, que es muy prominente por aquí. Estas son todas las cosas diferentes. Entonces esto es en realidad lo que vamos a implementar en nuestro diseño. Muy grande. Siguiente, Botón de atención
muy grande cangrejo. Pocas caras. Entonces para que sea ojos humanos y todas estas cosas diferentes. Entonces espero que hayas entendido lo que realmente necesitas hacer cuando miras un
sitio web de la competencia . Pasemos a la siguiente lección y veamos algunas cosas más sobre los proyectos de diseño web y
cómo manejarlos.
4. Cómo hago un facturo de mis clientes de diseño web: en este video, te
voy a mostrar algunos consejos prácticos, reales de la vida real y cómo en realidad construyo a mis clientes y te voy a mostrar mi reciente factura para algunos fuera de ti. Esa factura podría ser mucho para algunos fuera de ti. Podría ser muy, muy menos dependiendo de dónde realmente en qué mercado se encuentre. En realidad, si estás en USA, eso podría parecer una factura muy baja de todos modos. Entonces el primer paso que te voy a dar como cuando siempre estás facturando a tus clientes pero normalmente lo hago es construirlos para trabajo de diseño y desarrollo por separado. Entonces cuando terminé su diseño o cuando preparo mi factura, tengo que demostrar que este es el costo para tu diseño. Normalmente cobro dólares de 300 a 500 a veces 700 por diseñar un solo Babbage para una página de
aterrizaje. Si la longitud es mucho, normalmente cobro 500 en promedio es 500 dólares por diseñar una sola perra de aterrizaje. Por lo que aquí te dejamos algunos consejos. Número uno ¿Cuántos días vas a destinar dedo del pie ese diseño? Entonces si estás cobrando $500 el 1er 3 días diseño y luego cuatro. A continuación trato de afinarlos. Pero antes de mis refinamientos finales, en realidad
le muestro mi diseño a mi cliente. Porque si intentas seguir adelante, ya
sabes, mejorar tus diseños y hacer mucho fuera simple y más pequeño solo significaba espaciamientos y todo. Pero tu cliente en realidad rechaza ese diseño, y dice Ella dice que no es por eso lo que buscaba. Tienes que cambiar muchas cosas o él. Por lo que esto va a desperdiciar sus 1er 44 días libres de trabajo. Entonces, antes de que tus refinamientos finales muestren, una vez que estás diseñado para tu cliente y a veces lo que hago es que acabo de diseñar la primera cabeza aparte del diseño y mostrarlos o obligados a secciones fuera de su diseño y
mostrarles que esta es la dirección en la que voy. Y esto es genial. Esto se ve genial. Por lo que sigo moviéndome y creando más secciones. Entonces si creo que el declive está, ya
sabes, preocupado por mi cabeza y esto es que esto esto no está mirando lo que realmente queremos. Por lo que me detuve ahí y trato de crear otro equipo para el diseño. Entonces todo esto se trata de construir tu trabajo y cómo te vas dedo del pie no pierdas el tiempo ahora. Dos cosas que tengo tú mismo puedes vivir en mi vida,
que es, que es, cada vez que estás tratando con un nuevo cliente y un clima de confianza es tu viejo cliente que las cosas van de pie van muy diferentes. Entonces cuando estás hablando con tu nuevo cliente son clientes muy nuevos, van a hablar mucho de costos que esto es muy costoso. Um, ¿
puedes atracar el curso de cosas así? Pero cuando tienes un cliente de confianza que saben que esta persona puede hacer esto o es un experto en sus ojos, eres un experto. Entonces vas a tener. Ah, comportamiento fuera un poco de persona fría y un poco de calor. Entonces, para clase social, les
vamos a montar correos como Hola, Charlie, ¿cómo estás? Espero que su equipo lo esté haciendo muy bien. Voy con el dedo del pie, mostrarte algunas fuera de las cosas o actualizaciones que estoy haciendo en este momento. Estas son mis actualizaciones y esto se va de pie. Tómate como 15 días más. Por lo que sólo cuatro o cinco líneas que son muy oscuras no se muestran y les cuentan historias simplemente muy directas y un poco fuera de bienvenida en el inicio. O tal vez al final, eso es todo muy directo. Un poco cool. Ah, un poco caliente. Y eso es todo esto va dedo del ritmo de trabajo. Pero con un cliente nuevo, Cuando se tiene un cliente muy nuevo, hay
que ser muy cálido, muy acogedor. Tienes que empatizar con su problema. Sea lo que sea
que tengan, hay que decirles que esto se puede resolver así. Puedes obtener más correos electrónicos, puedes conseguir más clientes. Se va a correr rápido, cosas así y mostrarles que hay valor trabajando con hay mucho valor si faltan trabajar contigo. Entonces estas son todas las cosas y no, les voy a mostrar mi factura y esta es la factura. Y este es el proyecto de vuelta Texas Halldor calma 12 octubre landing page design plus desarrollo para plus optimización. Por lo que cada vez que hago algo, trato de pensar que este es mi propio proyecto. Mi propia página web y trato de dar el producto final en la forma más perfecta. Entonces, cualquiera que sea la forma o forma más beneficiosa o perfecta fuera de ese proyecto, trato de entregar eso para que puedas ver landing Page design 500 según la página de aterrizaje con el I frames 1000. Entonces en realidad trataron de cambiar algunas cosas. Por lo que agregué a $50. Entonces cuando les propuse por primera vez el pan les digo que les voy a cobrar 1500 dólares por el cortejo y diseño fuera de este proyecto. Pero al final, el cambio pocas cosas. Así que agregué algo te costó el pelo, y terminé, como, $300 por aquí. Tan total son 1800 los cuales ya han aparecido, y ya he reinstalado. De todos modos, eso está en la historia. Entonces, um, así es como en realidad trato con mis clientes, los
construyo eso espero que los pasos que van a funcionar para ti, y te van a ayudar en la construcción de tu último negocio de diseño web gratuito. O si estás dirigiendo una firma de software o estás haciendo, um, algo de freelancing, esto te va a ayudar de verdad así que pasemos a la siguiente lección y veamos qué más
tengo para ti. Entonces lloremos y digamos algo más de magia.
5. Cómo obtener la dirección de diseño de cualquier proyecto de diseño web: en este video, vamos a hablar de la pregunta más difícil. Cuando inicias nuestro diseño, estás casi ciego. Tienes que decidir en qué dirección va a ir este diseño. Entonces les voy a dar algunos consejos y ángulo para mostrarles a ustedes dos de mis diseños. Eso como realmente conseguí mi dirección de diseño y cómo realmente deseaba técnica. Yo uso dedo del pie, ya
sabes, superar este problema. Entonces ayunar es que tratar de describir cada proyecto de diseño en pocas palabras, asociar palabras con que esos podrían ser objetivos o palabras similares. Entonces en caso de que fuera mi último proyecto, que fue Aiyar s o empresa tributaria, esa empresa de adhesión es básicamente abogados. Entonces son serios. Se aburren. Están seguros de que quieren representar a su granja. Ser profesional y seguro es porque la mayoría de las veces cuando los usuarios llegan a cualquier sitio web, realmente
necesitan ayuda. Por lo que quieren algo de seguridad. Necesitan algo de seguridad. De igual manera, en contraste con eso, voy a mostrar mi diseño, que es un poco diferente, que más tarde es una empresa multimedia. Y usé estas pocas palabras como acogedor, acogedor, creativo multimedia. Entonces realmente queríamos. Por lo que estas son dos direcciones de diseño diferentes para dos proyectos diferentes. Voy a mostrarles a ambos fuera de estos proyectos y cómo en realidad conformaron estos tableros. Entonces, empecemos con éste, que es multimedia, el de abajo. Creativo, multimedia, acogedor y acogedor. Entonces este es un diseño claro. Y lo hice en cuatro para comprar porque acabamos de tener de una página. Entonces aquí tenemos. Vamos a acercar. Vale, Entonces, como puedes ver, um, todo
el diseño es Ah, la cara tailandesa, los colores. Son un bastante creativo. Están un poco, puede decir, dando la bienvenida al espectáculo, algún efecto multimedia tipo off. Mira la tipográfica. Se ve la selección de tifus, todo está igualando a todo el equipo. Entonces esta va a ser toda la dirección de diseño que puedes ver por aquí. Aquí tenemos pocas características de las que tenemos más colores o cabello. Entonces estoy usando un montón de colores diferentes por aquí en, y de igual manera, se
puede ver aquí otra vez tenemos un video, esta barra multimedia encendida, y luego tenemos de nuevo unos colores o pelo, pocas líneas, líneas de barras y cosas así. Por lo que se usan muchos colores por aquí. Ah, bien. Codicioso int para que azul vea un knish Color azul claro Die face es un poco Puedes decir arena
humanista Saref tiene algún toque humano en ella. Por lo que estas son en realidad las direcciones de diseño. Entonces por qué hice eso Porque era un letrero digital. Ege y correcto se originan O así waas va a mostrar algunas imágenes para tus clientes Cuando la visita, tu bar, tu hospital, tu colegio Quizás hayas visto diferentes pantallas pantallas de TV donde obtienes información sobre esa empresa o cómo suceden las cosas diferentes o aquí. Entonces esta es una dirección de diseño. Entonces esto se trató de este acogedor, acogedor, creativo y multimedia. No, te
voy a mostrar el segundo ejemplo. Entonces veamos que ahora aquí está el segundo diseño y esta dirección de diseño es totalmente diferente. Se trata de seguridad. Se trata de seguridad. Se trata de ayudar a obtener ayuda de estos profesionales para que puedan ver su tagline, que es el que dice que hemos ayudado a 300 mil más a nivel nacional a obtener desgravaciones fiscales. ¿ Ahora qué? Esta línea tenía transmite lo que transmite este texto copia. Dice que somos profesionales. Estamos confiados y atrevidos en lo que hacemos. Tenemos ah mucha experiencia fuera Así que estarías más seguro con nosotros Hacer negocios se están consiguiendo textualmente de nosotros. Serás Te sentirás seguro seguro porque somos expertos, sabemos lo que hacemos. Entonces este tagline y el impuesto relativo En realidad me mostraron la dirección del diseño. Entonces fui con esto. Se puede ver el fondo es oscuro verdoso azulado claro carpa azul apagado y en su mayoría
color verde . Y también para este botón teníamos algo que es Ah, verdoso color verde muy claro cuando encima de esto Ah, pero te voy a mostrar la página real para que te des la idea de qué color estoy
hablando . Entonces veamos lo que citaba la página real Page Waas. Ahora, este es el resultado final Y tú Lo que quería mostrarte es este botón. Entonces si tienes más de palabra puedes ver en la sombra jazz está encadenada y este botón gira pantalla Ahora ¿por qué este botón gira pantalla? Porque mi cliente en mi cliente breve cuando les hice preguntas ¿Qué es lo que quieren con esto? Pero y así es que debe ponerse verde. Entonces para conseguir al usuario algún alivio de que estoy a salvo y lo estoy. Qué de lo que intento hacer es una acción segura. Por lo que se trata de un waas de color ámbar amarillento para atraer al usuario y este waas dedo del pie siente al usuario un poco seguro Más seguro con esta empresa Ahora en general, si miras esta tipografía, está un poco apagado. Se puede decir Eddie, se
puede ver que tenemos bordes. Se trata de una tipográfica geométrica basada en círculos perfectos, casi perfectos y cosas así. Entonces debido a que esta firma waas profesional, era un impuesto de texto de ah solido o se puede decir profesional audaz, negocios
serios. Entonces usé este tipo off Lo sentimos, este tipo de tifus tifus De igual manera se puede ver tenemos mucho espacio en blanco y colores púrpura muy oscuro Color púrpura azulado porque muestra que sabemos lo que estábamos haciendo. Tenemos Estamos tomando una postura toro de que sabemos lo que estamos haciendo. Entonces esto es muy limpio, muy minimalista. Um verde se puede ver este rumbo verde oscuro. También muestra seguridad y vigilancia. Entonces estas son en realidad mis direcciones de diseño Cuando empecé este diseño, voy a compartir contigo un montón de tips y en realidad, esto va a ser un muy pequeño se puede decir viaje fuera de lo que corre en mi mente y lo que hago cuando yo diseñar un sitio web o página de aterrizaje. Por lo que está un poco apagado como conocimientos prácticos. No está relacionado dedo del pie, ya
sabes, aprender una herramienta o diseñar en sí mismo. Entonces espero que este video te ayude mucho en tu próximo diseño de lo que harás algo. Algunos. La técnica similar, como lo hice, como asociar palabras con tus diseños y elegir al equipo fuera de tu
dirección de diseño y diseño de acuerdo a eso y esas palabras. Entonces pasemos a la siguiente lección.
6. Cómo mejorar tu diseño con comentarios: hay un problema con muchos diseñadores, que es que tienden a trabajar solos. Piensan que saben todo sobre el diseño, les
dejan diseñar y que hacen el trabajo en su propia herramienta y están en su viejo mundo imaginativo. Ahora aquí está tu mística más grande, que es que tienes que depender de otras dos o tres mentes para conseguir un diseño de gran aspecto . Si miras B, haas o dribble o cualquier sitio web, si miras un trabajo creativo o diseño fuera de un equipo como tres o cuatro diseñadores o tres o cuatro personas, te sorprenderás de la calidad y la dirección fuera de ese diseño. Entonces te voy a dar un consejo de tu vida, que es siempre obtener retroalimentación de tu cliente. No intentes con el dedo del pie. Ya sabes, creo que no saben nada de diseño. No saben cosas de su producto. Ellos saben cosas de lo que votan con sus clientes. Eso intenta obtener comentarios de tus clientes lo antes posible. Muéstrales el Haider que he diseñado estas pocas secciones para secciones Stroh fuera de tu lado
rap cómo se ven. ¿ Cuáles son tus ideas sobre ese segundo dip? Es goto cualquier diseñador ya sea que sea tu amigo o familia o cualquiera que sepa un poco sobre el diseño y consiga su opinión dedo del pie dos mentes siempre son mejores que una. Tienes que obtener algunos comentarios de diferentes personas. Tienes que cambiar la perspectiva en tus diseños Web o lo que sea que estés diseñando. Tienes que sacar las ideas de otras personas de que qué crees que le falta a este diseño. Entonces si le estás preguntando a un diseñador, vas a preguntarle. ¿ De qué crees que falta este diseño? ¿ Qué? ¿ Qué crees que se puede mejorar? Por lo que desde cliente, puedes preguntarles eso. Cuáles son sus pensamientos sobre el inicial el diseño inicial. Por lo que te darán algunos comentarios. Entonces les voy a mostrar mi caso. Estudiar ¿Qué pasó conmigo en mi último proyecto? También te voy a mostrar el rediseño fuera de mi página web donde le pregunté a mi
hermano menor , también es un tú un diseñador, y ahora mismo está trabajando en una firma de software. Entonces le pregunté que ¿Qué opinas de este diseño? ¿ Qué crees que falta en este diseño? Y me dice un consejo muy grande. Te voy a dar un secreto, que es el diseño es una historia. Tienes que construir una historia. Tienes que mostrar tu diseño en una granja de cuentos, y tienes que hacerlo interesante. Entonces me voy de pie, te
digo que cuáles son los efectos de tener las opiniones fuera de otras personas o de tus clientes sobre tu diseño y cómo va a mejorar. Entonces déjame mostrarte primer ejemplo Ahora, este es el primer diseño que hice para mi cliente. Entonces tú este es en realidad el mismo diseño del que hablamos. Se puede ver el fondo, muchas caras. En su mayoría se ven falsos. Um, mismo rumbo. Parece todo. El botón estaba muy oscuro. Um, y pensé que esto es de aspecto muy profesional porque el botón está oscuro y
va a llamar la atención. Es oscuro, pero sobre un fondo claro. Pero mi cliente dijo que eso obligó a esta imagen en el fondo. Estos rostros, se ven muy poco realistas. Por lo que se ven falsos. Entonces tenemos que cambiar nuestra dirección. También, si recuerdas que nuestra competencia, que era nuestros competidores Sitio web waas. También muy similar a éste. Apenas el intercambio de color que tienen algunos por Bill color azulado y éste tiene pantalla. Entonces dije OK, así que me voy dedo del pie toma tu retroalimentación de diseño y voy a mejorar en eso. Y luego traté de cambiar el color de fondo y usar el mismo fondo. Un nuevo trasfondo me aseguró cuál era éste y otra vez mostré este y este anuncio Ok, Um ¿por qué? El botón es tan negro. Queremos tener algo verde o tal vez hacer mayormente en los colores seguros propios, como mostrar seguridad. De acuerdo, ¿entonces qué? Yo sí dije Ok, eso anotó voy a mejorar en eso para que puedas ver Verás cómo este diseño cambia
totalmente a este. Por lo que puedes ver ahora está buscando crear. Entonces siempre que estés diseñando algo probado dedo del pie, pregúntale a otros. ¿ Qué opinas de ese diseño? Ahora se puede ver que este es casi el mismo diseño. Si miras esto,
esto se ve realmente débil en esto no muestra una personalidad audaz, confiada. Pero si miras esta pantalla, nace, confía en
que lo sea. Se ve profesional. Agarra la atención del usuario. Transmitió el mensaje de una manera poderosa. Hemos ayudado a 300 mil más a nivel nacional a obtener desgravaciones fiscales. Entonces es así como cuando estás trabajando con dos o tty mentes, tu diseño realmente cambia y cambia su forma y forma y crea un diseño muy bonito. Cuando usted cuando obtenga comentarios de sus clientes, cuando obtenga comentarios de otros sus diseñadores, sus colaboradores, esto va a suceder. Tu diseño siempre va dedo del pie a mejorar. Ahora te voy a mostrar el segundo diseño que obtuve retroalimentación de mi hermano. Inicialmente trabajé con él junto con él que cómo se puede mejorar este diseño. Entonces te voy a mostrar antes y después,
y tú decidirás que estoy equivocado o soy verdad sobre el uso de dos o tres mentes para cada diseño. Ahora bien, este es el segundo ejemplo del que hablaba. Entonces este es en realidad el diseño final. Y si te muestro cómo en realidad empecé este diseño, vas a estar, ya
sabes, sorprendido. Entonces si miras este diseño. Ups. Entonces déjame mostrarte. Entonces aquí tenemos este diseño y se puede ver este es el diseño final para mi nueva página web. Mis cursos tuvieron esta característica en estos muchos lugares. ¿ Por qué tomar mis cursos? Nuestros alumnos están diciendo sobre el instructor. Empieza a aprender ahora ponte en contacto. Y esta es la comida. Por lo que puedes ver este es el diseño final. Y si te muestro el con el que empecé Y cuando consiga mi puedes decir retroalimentación de mi hermano. Cambió totalmente y cambió el diseño. Se puede decir dirección de diseño. Entonces les voy a mostrar cómo era mi diseño anterior. Ahora este es el diseño con el que empecé. Entonces empecé a crear algo como esto. Y esto fue un botón. Este es un diseño totalmente diferente. Por lo que se puede ver que estos son números diferentes. Por qué tomar mis cursos como aparecen en todos estos iconos estaban en color Lo que los estudiantes están diciendo Waas algo como esto. Un diseño totalmente diferente. Esto es con lo que empecé. Esta es mi introducción sobre el instructor. Y aquí está la comida er Así que puedes ver esto es aunque es un buen diseño. Pero hay muchos problemas como se puede ver por aquí. Aquí. Ah, sobre el sector. Yo sólo tengo mi imagen. Mi hermano lo dijo La retroalimentación que obtuve de él es que necesitas mostrar tu interacción con los alumnos. ¿ Has tomado alguna conferencia o algún taller? ¿ Ha dado o proporcionado algunos talleres en algún lugar le dije que sí. Y él dijo: Prueba el dedo del pie, pon unas fotos ahí parados con tus alumnos. Entonces en esta sección, dijo:
Intenta, Intenta, ya
sabes, que sea mawr simple. Esto es Ah, hay mucha atención fuera de este lado de la derecha que para este. Dijo que estos son en colores. Están exigiendo mucha atención. Prueba dedo del pie, sometiéndolos. Prueba dedo del pie, minimiza la atención por aquí. Entonces los volví a todos demasiado negros y blancos o grises también, um, lo principal
la idea principal que obtuve de él waas Ese diseño es una historia. Dijo que esta,
uh, uh, esta imagen de esta ilustración de la derecha, se ve bastante genérica. No parece que, um es muy emotivo o se está apegando con tus alumnos. Entonces lo que hice fue para la primera iteración. Déjame mostrarte lo probable que avance mi diseño. Entonces fui a este. Entonces aquí yo realmente Jane, el diseño de esto se puede ver ahora están en cuatro cajas por aquí. Ah, un poco cambiante. Aquí, aquí tenemos todo en grises. Ah, un poco más de limpieza limpia por aquí. Trato de quitar pocos de la Puedes decir algunos de los testimonios de aquí en adelante. Entonces piensa que este waas otra vez. Lo mismo. Aumenté el espacio en blanco por aquí para hacerlo más especioso. Y luego con la retroalimentación de mis hermanos, toda
la dirección del diseño cambia. Dijo que quiero usar esta ilustración específica. Yo había comprado esta ilustración. Estas no son ilustraciones gratuitas. Descargué éste y éste para que no pruebo dedo del pie, ya
sabes, uso ilustraciones gratuitas Tiendo a usar, um rezadas o ALS premium. Tienen más calidad. Dijo que esto me parece un poco más interesante así de ruidoso. Este es en realidad su diseño. Empezó. Dije:
OK, OK, intenta trabajar en mi diseño. ¿ Cuáles son tus pensamientos? ¿ Trabaja? Harvard. Se inicia este diseño. Dijo que voy a hacer algo así. Por lo que empezó con este encabezado. Y ah, cuanto conseguí lo que realmente está sucediendo en la mente de mi hermano, traté de cambiar mi diseño y dejarme mostrarles el final. Ups. Um así aquí tenemos el diseño final. Alejar el zoom. De acuerdo, entonces aquí tenemos el diseño final. Y si miras este diseño, esto está totalmente cambiado. Es el tifus. Dijo que hay que mejorar tu tipografia. Por lo que trato de usar esta prueba de esbirro que realmente me encanta. Y también este es día de borrador, que también es un fuerte premium que he comprado. Estos son ambos fuerza premium son ambos diferentes eso trato de usarlos. Entonces probé dedo del pie conseguir más colores en ellos los cuales para mi marca colores azul y naranja. Por lo que trato de poner que los usan por aquí en la ilustración. Entonces, ¿qué? Dijo que Waas lo usó como historia. Por lo que agregué algunas ilustraciones más. Los elementos de diseño Amore puntera lo hacen más humanizado. No sólo cajas y gravados y colores. Traté de usar otra ilustración de la misma serie de ciudad y la puse por aquí haciendo que pareciera solo a mis alumnos. Y luego traté de simplemente pelear haciendo cuatro críticas así. Entonces se puede ver esto es que brilla sobre instructor. Intento usar otras imágenes también. Al igual que este de aquí, éste donde estoy parado con mi taller en Lums, Lahore en otra ciudad. Y ah, aquí está mi, um las mismas secciones que probé dedo del pie crear una nueva aquí otra vez, una ilustración se agrega de nuevo, se edita
una ilustración ellos. Así que prueba dedo del pie, prueba dedo del pie, consigue algunos giros en mis historias Traté de cambiar el diseño cambió ilustraciones, cambié una cara de corbata en base a los comentarios de mi hermano. Entonces es realmente,
realmente importante que obtengas retroalimentación de otros diseñadores. Um uh, otros diseñadores senior o cualquiera si son como tú o tu jefe de producto o cualquiera si tienen alguna experiencia. Todo el mundo tiene una experiencia diferente en diseño, por lo que podrían tratar de darte algunos consejos que van a mejorar tu diseño. Espero que hayan disfrutado de esta lección. No quiero que quisiera que fuera muy largo. Pero este es un tema muy importante el cual es obtener retroalimentación y cómo vas a mejorar en esa retroalimentación. Entonces déjame mostrarte la segunda página. Se puede ver que esto también es, um, viniendo del mismo equipo del lado derecho. Ah, y una cosa más. En realidad le pregunté a un diseñador más, que se refiere a melt, que es y él era diseñador, muy gran diseñador y trabajando con empresas muy grandes y cosas por el estilo. Traté de obtener también su retroalimentación sobre este diseño. Se quedó asombrado con este diseño, que no esperaba, pero dijo que puedes mejorar tu pie de página y cabecera. Tenía pocas preguntas en mi mente, así que le pregunté en ese correo electrónico y él me respondió muy bien en y con mucho detalle. Entonces todo eso se trata de obtener retroalimentación y cómo puedes mejorar tus diseños en base a esa retroalimentación, espero que hayas aprendido mucho de consejos útiles en este video. Nos vemos pronto. En el siguiente
7. Robar de tus inspiraciones con éxito sin copiar: en este video, voy a hablar de un problema que muchos diseñadores tienen, y así es como puedes usar inspiraciones o tu sitio web de competidores o diseñar ideas fuera otros sitios web en tu propio diseño. Cómo vas a implementarlos ahora. El truco es que no necesitas copiarlos. Tienes que aprender de ellos cómo han usado espaciado, cómo han usado diferentes tipos de letra, cómo han usado diferentes colores, cómo han usado de manera diferente hacia fuera. Por lo que vas a obtener direcciones de diseño y consejos de ese diseño o de tus inspiraciones. No trates de robarles. Si realmente quieres dedo del pie, sé diseñador exitoso. Trata de robar a muchos. Entonces si tienes tres o cuatro sitios web diferentes, trata de aprender sus direcciones de diseño y obtener consejos y puedes ver equipos que quiero que mi sitio web Toby vaya en esta dirección. Entonces este es el truco para tu éxito robando tus inspiraciones de diseño, así que voy a compartir contigo mi reciente experiencia. Este curso es realmente práctico, así que voy a compartir con ustedes ejemplos reales off. Oh, diseño nuestro todo me acerco a diferentes problemas de diseño y cómo realmente uso inspiraciones en diferentes en mis diseños. Entonces veamos este ejemplo. Ya te he mostrado este sitio web el cual va a ser mi próximo diseño reciente para mi página web. Se acerca tal vez dos meses Próximos dos meses de todas formas. Por lo que aquí tenemos el diseño y puedes ver verás este diseño. Este es todo el diseño. De acuerdo, Así que tienes ya te he mostrado una vez este diseño y ahora te voy a mostrar. Vamos a volver del dedo del pie la parte superior por aquí y te voy a mostrar cómo en realidad esto ¿cuál es la inspiración o para este diseño? ¿ Cuál es la inspiración que utilicé? Entonces vayamos a ese sitio web inspirador. Entonces aquí hay un sitio web llamado Fondo de Diseñador en Realmente me encanta este diseño. Esta es la inspiración para mi diseño de tallas VEP. ¿ Crees que tengo algo corporativo desde aquí? Si miras de cerca, verás que no he copiado nada desde aquí. Se puede ver este diseño es totalmente diferente que se puede ver el contenido es diferente. encabezamientos son diferentes y ah, un montón de geniales y empate cara se mezcla mucho fuera Se puede ver por aquí. Por lo que este es todo el diseño fuera de este sitio web. De acuerdo, Así que ahora si miras esta sección por aquí y la comida o puedes ver tengo a Dios pocas ideas fuera, como dividir mi pie de página en dos porciones como esta por aquí y déjame mostrarte cómo
lo hice . Entonces si voy a la comida por aquí, esperanzas así que vamos como esta. Y te voy a mostrar el pie de Y si vas al pie de página, puedes ver que está dividido en dos secciones y usé ah! ¡ Ah! Sobregastos gráficos pesados. Uh, una cosa más. Si miras de cerca el tifus está por aquí. Déjame mostrarte. De acuerdo, así que vamos a ver. El Dreyfus superior es el encabezado de cabecera por aquí. Ya puedes ver si miras esta tipografía y podría enfrentarte a Will. Vista local sentirá alguna similitud en esta combinación off tifus es así que vamos
a cambiar muy rápido para que puedas sentir esa misma dirección, un poco fuera de similitud en este diseño. De acuerdo, Entonces ves algo para que puedas ver este tifus, que es mi escondite. Es como 70% similar y futuro puesto de tifus que han utilizado. Entonces lo segundo que notarás es mucho espacio libre en blanco por aquí. Entonces de igual manera, si miras por aquí, verás mucho espacio en blanco. Son encabezamientos están en esta dirección en dirección vertical. Pero las mentes están en dirección horizontal. Se puede ver así porque no tengo demasiado contenido para disparar. De acuerdo, así es en realidad como capté algo de inspiración. Además, verás que algunos fuera de los asesinos como tú pueden ver este oscuro, un color azul pálido y este afilado, este color verde afilado. Yo lo he tomado prestado desde aquí. Entonces si miras este logo extranjero de diseñador, no
es del mismo color. No copié este valor de color o valor decimal Hexi, pero está cerrado del dedo del pie esta combinación. Por lo que tenemos azul y verde casi azul y verde. O aquí también. Por lo que tenemos fondo azul oscuro y verde. aquí tenemos contraste negro oscuro, azulado y amarillo de nuevo se puede ver la pantalla o aquí y si nos movemos al fondo, se
puede ver de nuevo. Tenemos el fondo azulado inicio. Entonces la línea de fondo aquí es que Intenta sacar al equipo de ese diseño. No intentes copiarlo como puedes ver esta sección por aquí. Es muy similar a su pie. Nuestro pelo que tenemos, que es como Dios, actualizaciones
ocasionales en noticias. Tienen algo como esto, pero el mío es un poco diferente. Añadí alguna ilustración por aquí y también moví mi partida fuera de esta sección. Y tengo Puedes decir que he mostrado estas técnicas de diseño de maquetación off, invadiendo otras secciones en detalle en mi clase de diseño de capas fuera de curso. Si estás interesado en mejorar tus habilidades de diseño de capas, puedes tomar eso de todos modos, Así que aquí hay algunos cambios. Como te he mostrado. Yo lo he hecho. Necesitas reunir diferentes ideas de diseño. Pígalos. Podrás ver, cambiarlos a los tuyos o adoptarlos a tu propio diseño. No debe parecer una copia de ese diseño. Y si miras el pie de página por aquí, puedes ver que no se parece a éste. Pero si miras de cerca, puedes ver aquí tenemos texto, y aquí tenemos términos muy pequeños política de privacidad o cosas por el estilo. Ahora, si miras mi diseño, tiene cosas similares están aquí. Entonces si puedes ver si lo muevo por aquí Política de privacidad, política de
cookies, algunas cosas similares pasando por aquí. Por lo que no es copilar su diseño, Pero probar el dedo del pie se puede decir conseguir ideas y usarlas en su propio diseño consiguiendo ah sensación
similar. Y se puede decir combinaciones similares de tifus. Um, fuera de ese diseño. Uso de espacio similar de Dwight. Entonces estas son todas las cintas que les he mostrado en esta lección. Si tienes alguna pregunta, siempre
puedes preguntarme, pasemos a la siguiente lección.
8. Selección de tipos de tipografía para tu proyecto de diseño web: Siempre que empiezo a diseñar mis proyectos de sitio web o mis diseños de laboratorio móvil, siempre
empiezo con unas elecciones de cara de empate. Entonces el primer paso que voy a dar es que voy a seleccionar los tiefest son la fuerza que
voy a usar en mi diseño ahora. Ya tienes la dirección de diseño desde tus inspiraciones, que hemos comentado en las lecciones anteriores, y las vas a utilizar para seleccionar tu tifus. Entonces si tu proyecto el profesional serio, audaz, audaz,
confiado podrías ir con tipo geométrico o dramático fuera de los teléfonos sensoriales o tifus es si eres proyecto está más relacionado con emocional o acogedor o tranquilo tiefest te quieren usar de lo que vas a tener algunas características sensibles humanistas, curvas
Mawr en tu tiefest. Te voy a mostrar. Los ejemplos adoran 40 así que el siguiente está más fuera de los diseñadores, incluso yo. En ocasiones pensamos que hay que combinar dos tipos de letra porque va a demostrar que conocemos sobre diseños. No hay vergüenza en usar una sola cara de inmersión en tu diseño. Se va a Lourdes más rápido cuando vas a usar solo un tiefest en tu diseño. Se va a Lourdes rápido porque sólo tenemos un tiefest. A lo mejor usaremos tablero o regular o cursiva tres veces diferentes formas de ese tiefest. Una cosa más es que siempre que estés decidiendo usar tifus, asegúrate de seleccionar un tifus que sea premium. Tienes que comprarlo y usarlo. Se van dedo del pie siempre brillan en tus diseños. He empezado a usarlos en proyectos de mi cliente en mis propios proyectos, y te voy a mostrar el ejemplo de cómo experimento con Start experimentando con Diverse Is y combinaciones y cómo termino usando diferentes teléfonos o tifus es para mi proyectos. Entonces veamos esos ejemplos ahora. Ahora este es el patio de recreo que utilicé para seleccionar tifus es para mi abordé la página de
aterrizaje de escisión , que te mostré, y así es como, en realidad un inicio combinando diferentes defensas, elegí el texto real o contenido real y un párrafo y un encabezamiento y empiezo a utilizar para seleccionar el tifus. Antiguo rubro porque va a captar mucha atención, es el primer punto de atención para nuestros usuarios. Entonces para seleccionar tifus para párrafos tiendo a usar algo que sea más legible, más legible. Entonces estas otras cosas que te vas dedo del pie tienen en tu mente para que puedas ver esto en esta combinación. Seleccioné este alimento nuestras arenas para mi rumbo y es hap regular, que es uno de mis Ford favoritos. Para párrafos te van a combinar con mucho tifus es así que este es este otoño mi primera combinación. Intento usarlo en el primer diseño. Yo lo hice. Entonces para el 2do 1 usé inter. Entonces, pues si miras todos estos, son un poco serios. Ellos son, Ah, gran profesional. Se puede ver este. Este es el Inter. Es muy grave. No avion tipo apagado, ya
sabes, Sabes que no muestra ninguna emoción s Oh, esto es muy llano tipo off ya Helvetica tipo off sensorial ford o die puños. Y en la parte inferior, estoy usando rubí, que está un poco apagado Hacer tifus mágicos. Se puede ver si se mira de cerca, se
verá que esto está construido sobre alguna geométrica at tiene algún um, se
puede decir Ah, letras
perfectas. Entonces no perfectamente dramático, pero tiene algunos indicios geométricos. Por lo que estas son las dos caras de morir. Esta es la segunda combinación. Entonces sigo tratando diferentes combinaciones de las que trato de usar texto carmesí, que es la tipografía de teléfono Satya con algún sentido que si dios baja aquí, que no me gustó, Así que rechacé este. En realidad. Mi cliente Ah, quería tener algo como esto, pero no pensé que fuera una buena idea. Entonces éste Otro activo, y
grotesco Extra audaz con as arriba puedes ver un paso es fácil de combinar con el Señor de las tipografías fuera de forma. Por lo que realmente me encanta esta es otra cinta Intenta usar un sap y creo que lo arreglará con muchas defensas fuera. De igual manera, este Pero para mí fue evita ancho, tipo apagado por primera Muli Mouly y ah, volvió a
ser tipografía dramática Y tiene algo raro para ello. Entonces era amplia Así que no me gustó ese tipo de estilo Y además Nieto, no
pertenece, ya
sabes, ya
sabes,a la selección. Por lo que lo rechacé del lado izquierdo. Se puede ver que he seleccionado la escala de tipografía. Entonces si no sabes qué tipo de escala facial es, es lo grande que serán los diferentes pasos fuera del tifus. Y he hablado mucho al respecto en mi clase de tipografía. O por supuesto que puedes tomar eso si quieres dedo del pie aprender sobre esto. Por lo que selecciono cuál es el tamaño más grande, más
pequeño, más pequeño y diferente tiefest antes de saltar a mis diseños. Uh, aquí tenemos. Vale, Así que en el último aquí solo hay una sola cara de die que es Marcher Mártir es una cara de die premium Y es un tipo geométrico off tiefest sensible Puedes ver por aquí estaba ahí
círculos perfectos Y me encanta esto porque era muy potente, muy aburrido en serio y eso acabo de seleccionar este marcher, Esto es negro. Esto es Ah, muy alberca. Creo que usamos tablero extra en el rubro en lugar de negro Negro es tomar. Y para mi texto usé libro tiefest sábado regular Así que si vas a regular, puedes ver Ah, este es un ford muy oscuro oscuro o aquí significa que tiene mucho color apagado dentro. Entonces si alejas el zoom. Ya verás que estos textos por aquí se ven muy ligeros por su grosor aquí. Si lo miras, aguanta aquí. Se ve muy toma. Entonces lo que hice es que pensé que va a ser muy toma. Por lo que me cambié de dedo el otro muere puños Ford, que es libro. Por lo que seleccioné este libro y se ve bastante bien en el diseño final. Y déjame mostrarte cómo en realidad empecé mi diseño. Entonces empecé esto. Se puede ver esta es la primera sección que empecé a construir y empecé a usar con la sensación Sands junto con Recep. Ese fue mi primer intento, Pero menos arenas tenían algunas curvas. Algún humanista, sensible, amable tacto a ella. Entonces yo al final, se
me cayó. Y seleccioné esta Ah, marcher en lugar de ella. Entonces déjame ver si lo tenemos aquí tenemos unas características de fiesta o lo que sea. Entonces este es el Así es como juego con diferentes tipos de letra y los combino en mi se puede ver la intuición y ah, um se puede decir sentido de selección de tipografía. Yo no uso ninguna regla. Simplemente sigo usando diferentes tipos de letra, que creo que se ven muy bien. Por ejemplo, esto alimenta nuestras arenas y esto es miradas felices creadas. Y si nos movemos aquí, aquí otra vez, éste entra Se veía genial para los encabezados. Um y creo que también puedes combinar indistintamente como si mueves esto por aquí
y te mueves por aquí, puedes ver el maquillaje. Un par perfecto por aquí. Entonces entra y está arriba. Se ven bien. Entonces si intentas experimentar antes de sumergirte en el diseño, creo que eso es mejor. Entonces así es como en realidad selecciono mis tipos de letra. Ahora te voy a mostrar el diseño real que puedes ver. Aquí tenemos este tifus trabajando crear. Se trata de Marcher Bull. Este es libro. Este es libro y este es de nuevo libro. Entonces así es como se ve realmente genial en situaciones diferentes y diferentes. Y se puede ver así es como se ve el diseño real. Ahora aquí hay otro diseño que ya has visto. Estos son dos de mis últimos proyectos, que estoy trabajando desde el pasado, como seis meses. Y aquí puedes ver esta cara de corbata tiene es San Serif y tiene un
poco ah, un poco de estilo sería clásico un poco clásico, un poco apagado. Se puede parecer, um, curvas y ah toque humanista a ella porque es más clásico. No es Morgan Sensory para Así que si seleccionas este, este es corrientes de aire. Estos son ambos premium para uno es muy popular. Minion Pro Ford y realmente me encanta este tiefest. Y entonces éste es borrador. Entonces si miramos de cerca, verás cuáles son las diferentes características para esta tipografía. Y tenemos cada uno está inclinado por aquí. Por lo que es un poco básicamente clásico Tiefest es viejo. El tifus es Entonces tenemos esto. Si miras de cerca esta, uh, arena Sedef que es un gran morgan, puedes ver que es un poco Ah, teléfono
alto. Tan alto tiefest Así es más alto y esto es más corto. Por lo que esta es de nuevo una técnica de contraste. A veces uso yo si tienes tipo de teléfono muy amplio, muy, que está en, um en forma fuera de un rectángulo o más vital que los otros fuertes como te he mostrado antes. Después intentas usar un cuatro o tipo de letra elegante o delgado con él. Esto es diferente. Técnicas combinadas. Podrás aprender más sobre ellas en mi curso de tipografía de todos modos, así que puedes ver estos dos los combino porque esto es, uh, este es un sitio web creativo para diseñadores. La mayoría de la gente que busca diseño, van a venir por aquí así que no puedo usar, aunque puedo usar un empate dramático por aquí. Pero, um, pero creo que esto transmite el mensaje mejor convertirse en una interfaz de usuario y experiencia de usuario diseñador aprendió habilidades en lugar de herramientas de diseño, se unió a la experiencia de aprendizaje con más de 12 cursos de video y unido 31 dimensional. Creo que tengo alrededor de ahora 37 1000 alumnos y van en aumento, y estoy tratandode enseñar al menos 100 mil alumnos. Veamos cómo, cuándo van a venir de todos modos. Entonces estas son las cintas prácticas. Cuando intentas seleccionar nuestra cara de corbata, combinando tus caras de troquel diferentes. Los de Ford no tratan de usar más de dos o tres V. Es por ejemplo, este es duff regular, y este es tablero de reclutamiento, y este es Minion Pro. Entonces no estoy usando más de estos tres. Si intentas usar más de estas tres o cuatro fuerzas diferentes, tus páginas yendo del dedo del pie cargan muy lentamente. De acuerdo, entonces van a añadir más peso a tu página. Y cuando alguien va a cortejarlo, se van de pie. Tener diferentes, tiempos
difíciles, ya
sabes, cargando esta página, será más lento. Entonces eso se trata de cómo selecciono mi tiefest es cómo se combinan diferentes tipos de letra, cómo experimento con diferentes tipos de letra. Y cuáles son las cosas que hay que tener en cuenta mientras afloja el Tifus es. Yo quería este curso, Toby. Por más práctico que pueda ser porque no se trata de habilidades de aprendizaje, se
trata de practicidad y cómo vas a usar y manejar nuestro proyecto de diseño, diseño
web o diseño de aplicaciones móviles con éxito. Entonces pasemos a la siguiente lección y veamos qué es lo que tenemos de lectura para ti.
9. experimen de esquías de color para el diseño web: no, después de haber seleccionado nuestro tifus es I. Normalmente lo que hago normalmente es seleccionar empecé a elegir mis colores o esquema de color, y los colores van a estar basados en la dirección de diseño que tenemos. Ya tenemos identificación asociada. Pocas palabras con nuestro diseño, como seguridad, como tablero profesionalismo confiado Ah ah, entidad
monedero donde sabemos que lo que
estamos haciendo, tenemos conveniencia y cosas así. Entonces, de voy a compartir con ustedes por cómo en realidad empecé. Seleccionar tifus es para mi último proyecto, que te he mostrado empresa tributaria, y lo que hice es seleccionar un color vibrante o muy se puede enfermar y de confianza color para la ciudad o llamar a la acción botón. Entonces la razón es que queremos atraer a nuestros usuarios al instante. Siempre que alguien aterriza es aterriza en tu página de aterrizaje o la primera página fuera de tu boca, quieres que note algún botón o algún texto porque queremos que tomen acción. Entonces esto se va a llamar al botón de acción, y va a ser vibrante o tener un montón de buen contraste con el fondo. Entonces el 2do 1 El segundo asesino que seleccioné era verde oscuro, que está relacionado con la seguridad, y tiene algunos tonos frescos al mismo. Por lo que no se ve muy opaco ni de color oscuro. Pero en cambio, mira, se
puede decir prometedor y en el tipo
esperanzador, esperanzador de color verde. Entonces por profesionalismo, seleccioné color azul oscuro, púrpura sobre eso también estaba algo relacionado con su propia marca angular para
los impuestos back help dot com y voy a compartir con ustedes ahora el proyecto y cómo seleccioné son yo empezar a seleccionar colores. Déjame mostrarte. De igual manera lo que hice con el tifus está por aquí. Se puede ver en la última S y tuvimos algo de experimentación en marcha. También empiezo a experimentar con seleccionar uno o dos colores en el inicio. Entonces tengo este color, por ejemplo, este y este me queda un poco bien. Me ha dejado compartir con ustedes, um, azul y verde. Por lo que es una mezcla de azul y verde. Es que no es perfectamente verde. Por lo que tiene. Tiene alguna esperanza en ella. Entonces así es en realidad como empecé con este color del que producí bajo acciones
más ligeras. Pocos. Este. Esto está más cerca del azul. Entonces empecé con este color oscuro, granate ish el cual creo que estaba relacionado con éste. Pero no usé este porque para mí, estaba un poco apagado,
como, como, más cerca del peligro. Por lo que evité usarlo en el al final. Entonces empecé por aquí como puedes ver si lo miras por aquí. Empecé con este color de pantalla, pero se puede ver por aquí en primera clase parece que este asesino ha sido sobreutilizado. El estrella pantalla limpia esta pantalla azulada. Se habían acabado. Yo estaba tratando de sobreutilizarlos aquí. Entonces estos son en realidad los colores reales para esta, um, marca. Se puede ver que tienen verdes y este azul púrpura. Por lo que tiendo a sacar algunas ideas de esta también. Entonces no quise usar Estos son muy lisos, azul
oscuro y verde simple. Yo quería tener alguna variación o una mezcla fuera a. Entonces les voy a mostrar cómo en realidad terminé usando colores. Déjame ver. De acuerdo, entonces aquí tenemos el mismo sueño un poco de verde, que es éste y éste de nuevo es azul. Pero tiene algo morado, morado, uh, pista Street otra vez. Se puede ver este fondo. Esto es muy ligero. Fondo azul verdoso, mismo esquema de color. Los colores mayores que seleccioné lucieron este azul púrpura este verde y este amarillo y este color ámbar
amarillento hemos usado solo para ellos para el esto sacando la atención del usuario y este verde al fondo luce muy seguro porque es verde más azul. Entonces, um así es en realidad como realmente paja seleccioné mis colores. También son los colores off sky y árboles. Tan amable, lo
puedes ver Estabilidad para árboles y ah, cielo está abierto y acogedor para mí. No estoy seguro de qué es para ti, pero esto es en realidad que quería que fuera serio. Para que se pueda ver esto. La ciudad a por aquí otra vez está usando el mismo color. Este color es en realidad déjame mostrarte. Creo que es un dedo del pie, morado y azul. Por lo que tiene algo rojo remolcarlo un poco verde y la mayoría del blues. Entonces si vamos a salir sm en el Hugh es a 22 de todos modos, así es en realidad como limite mis colores. Se puede ver que no te gustan los nazis 15 asesinos o aquí los asesinos mayores son sólo tres. Este amarillo este azul y la pantalla. Entonces eso es todo lo que necesitamos. Podríamos decir humos, o puedes decir acciones más ligeras, como por aquí usando los iconos. Y luego, um, se
puede ver este también es del mismo color dos tonos que se ofrecen. Si quieres aprender más sobre cómo crear un esquema de color, puedes tomar mi curso diseñado por esquema de color. Pero siempre que estés iniciando un proyecto que aleje, tienes que experimentar con diferentes colores. Tienes dedo del pie hacer experimentación como lo hice aquí. Tienes que empezar a crear algo como esto e ir a partir de ahí. Empieza a aplicar estos colores y ve cómo se ven. Experimenta con ellos. Trata de mejorar tu esquema de color por tiempo y tiempo. Yo no pruebo el dedo del pie. Selecciona todos los colores que sigo mejorando y experimentando. Entonces si veo que necesito un tono más claro por aquí, traté de generar eso, así que sigue experimentando con los colores sigue mejorándolos. Al final, podrías tener Ah, producto
diferente que nunca pensaste Que vas a terminar encajando. Por ejemplo, así aquí tenemos colores totalmente diferentes y se puede ver que hay pocas
pantallas móviles o aquí las cuales diseñé o rediseñé. Se puede ver que estoy usando este color amarillo en este campo de números telefónicos. Um también se puede ver por aquí fondo verdoso claro verde por aquí. Entonces así es como experimento con diferentes colores y sigo mejorando en ellos. No me pego a los colores. Yo, ya
sabes, he seleccionado en primer lugar de igual manera por aquí se puede ver que seguí experimentando . Probé muchos colores para este fondo, este fondo, pero en combinación y terminé en éste. Esta es una muy venidera, amable de color azul Onda. Fondo muy claro. No muy. Ya
sabes, se puede decir brillante pero muy tenue, amable de fondo claro un poco apagado opaco, color
grisáceo está en este fondo y porque quería usar un azul muy oscuro encima él, así que crea un diseño de aspecto muy agradable. De igual manera, se
puede ver este botón por aquí. El color es, ah, una novia porque queremos que los usuarios hagan clic arriba. El amarillo también es otro color. He usado ámbar amarillento, por lo que azul y amarillo y verdes aquí tenemos los diferentes tonos para ellos. No son los mismos que he usado aquí, que es éste. Esto es totalmente diferente. Entonces así es como las personalidades fuera de tus colores, van a hablar del dedo del pie en tu diseño. Van a contar la historia de tu diseño. Creo que has entendido cómo uso los colores. Alta seleccionar colores altos. Sigue mejorando mi esquema de color durante mi proyecto de diseño. Y si tienes alguna pregunta que hacerme, pasemos a la siguiente lección.
10. Uso y creación de componentes y símbolos en el diseño web: en este video, voy a hablar de generar elementos reutilizables o activos reutilizables o
chicos estilo reutilizables , botones y todo eso para tus proyectos de diseño de rep o tus proyectos de diseño de APP móviles o cualquier usuario interfaz que está tratando de diseñar. Ahora en la primera, cada vez que comienzas a diseñar, estás probando diferentes colores. Estás probando diferentes estilos. Una vez que casi hayas finalizado una o dos fuera de tus páginas como 1ra 1 por ejemplo, esta página de inicio ,
una vez que haya finalizado, sé que este botón este botón va a ser estándar i ni lo voy a necesitar en un montón de otras páginas del sitio web. Por ejemplo, como puedes ver, tenemos cursos de navegación, próximos cursos. Blawg, contáctame y Logan. Entonces voy a utilizar la reutilización de este elemento. Entonces voy a convertirlo en un símbolo o ah añadido para que también sea un componente. Si estás usando estigma, son Toby. En realidad, es componente, y si estás usando, dibuja su símbolo, así que intenta crear símbolos como puedes ver aquí a la izquierda. Tengo muchos símbolos. Estos son todos los colores que puedes ver como de 7 a 9 acciones diferentes fuera de cada color, diferentes tintes y tonos fuera de cada color, tres o cuatro tipos diferentes off likes on entonces tenemos un montón de blues por aquí publicados blues. Por lo que estos son tres erudito mayor. Entonces también tengo algunos estilos de coleccionista para definir mis diferentes encabezamientos o cosas
así . Entonces tengo pequeño tengo Ah, 19 punto, que es creo, el párrafo. Entonces tengo 38 44 50.50 años 67 cuando tengo 25 44. Por lo que estos son todos lazos de práctica diferentes que he usado en mi este proyecto. Y ah, déjame mostrarte algunas cosas más. Contamos con componentes para espaciado los cuales he mostrado en mi, um curso de diseño de capas cómo usarlos y cómo los creo y aplicarlos. Entonces tienen pocos botones como puedes ver esta es carga primaria. Entonces tenemos botón pequeño que es 45 ejerce algo como esto. De igual manera, tenemos curso más. Este te gustará. Ya puedes ver que solo puedo crearlo así. Entonces una vez que lo haya finalizado, voy a usar algo como esto. Entonces déjame mostrarte unos lanzamientos más. Como se puede ver por aquí. Aquí tengo todos los cursos diferentes y ah, si bajamos, se
puede ver que estos son también simplemente los mismos elementos. Entonces creé uno de ellos y Johnny acaba de reemplazar imágenes y texto en otras Ah, en las otras. Y ya terminé con mi diseño. Entonces esto es realmente útil. Tienes que crear algunos de los elementos reutilizables, pero tienes que crearlos. Una vez que hayas finalizado al menos una fuera de tus páginas o una fuera de tus pantallas o tal vez una o dos fuera eres skins. Porque en ese momento es mejor que sepas que esto es esto va a, ya
sabes, ser algo así. Este es nuestro estándar. Entonces primero se establecen algunos estándares de interfaz de usuario mediante la experimentación y luego el uso de la era re usando esos estándares. Entonces todo eso se trata de usar. Se puede ver sistema de color como este. Se puede ver por aquí. Tengo estos documentos se puede ver yo generé esto. Estos colores se pueden ver estos son pocos los push craze craze. Se trata de acciones anaranjadas de extranjeros. Estos son greens. Estos son de color rojo. Estos son algunos de los blancos ish craze. Estos son blues. Por lo que estos son todos colores diferentes que he estado usando en este sitio web. Entonces en este momento es básicamente mi sitio web para diseñadores, por lo que puede tener ah muchos colores. Pero para otros sitios web, es posible que necesites tres o cuatro tonos tal vez. ¿ No siempre no necesitas a todos estos asesinos? De igual manera, puedes ver yo creo mis textiles por aquí así en otro documento, todos los diferentes tamaños y cómo se combinarán y se verán entre sí. Además, puedes ver he creado pocos para enlaces, enlaces, estilos por aquí. Se puede ver por aquí esto es ah style para las condiciones. Por lo que estas son todas formas diferentes. En realidad trato de combinar diferentes tipos de letra en diferentes escalas. Entonces si quieres aprender más sobre qué es una escala, cómo generas estos diferentes tamaños de tipo, tienes que ver mis discursos del curso de tipografía sobre cómo realmente diseñé mis proyectos y cómo los manejamos y cómo prácticamente crear diferentes archivos o aseveraciones o lo que yo usé en estos diseños. Entonces aquí tenemos algunas cosas más. Al igual, tengo diferentes iconos. Los he reunido por aquí. Entonces tenemos todo tipo distinto fuera cinco o seis tipos de botones. Se puede ver esto es botón fantasma. Todos estos son botones llenos. Entonces tengo unos estilos para ah, para las formas y déjame mostrarte unas cosas más. Y además, trato de guardar las ilustraciones así. Entonces cada vez que necesito una ilustración, solo la arrastro desde aquí, o puedo crear un componente fuera de ella y usar eso en mi diseño para que puedas ver estos son en diferentes fondos. This están sobre progresión morada grisácea, fondo
azul. Estos son fondos blancos y estos están sobre fondos oscuros. Por lo que trato de ustedes puede decir experimentar y mirar diferentes ángulos y perspectivas
que cómo podría verse en nuestro color oscuro, cómo podría verse en un fondo de color vita brillante y crear diferentes activos
tanto para oscuro como para fondos de luz. Entonces así es como se ve mi archivo en realidad y este va a ser el nuevo diseño para
mi sitio web,
y así es mi sitio web, como he diseñado la página de planeación de tabletas y móviles y eso es todo lo espero que hayan aprendido mucho de consejos y cómo puedes manejar realmente la creación de nuestro sistema de diseño. No intentes pasar como,
ah, ah, cientos de horas libres creando tu sistema de diseño. Apenas primero, experimenta con una o dos páginas de pantallas honorables fuera de tu diseño e ve desde ahí y crea diferentes activos. Diferentes colores, diferentes tipos de estilo, diferentes elementos utilizables, diferentes componentes y símbolos. Por lo que espero que hayan disfrutado de esta lección. Si tienes alguna pregunta que hacerme, pasemos a la siguiente lección.
11. El diseño mejorará con el tiempo: un montón de diseñadores. No entienden que el diseño es progresivo, por lo que tomará forma y tomará en su forma con el tiempo. Por lo que tienes remolque, dale algo de tiempo a tu diseño. Entonces aquí hay algunos consejos que son prácticos y que uso en mi vida real en el diseño sitios web o más por lapse número uno es que no diseñan en una sola sesión. No necesitas sentarte. Y en 1er 3 horas vas a simplemente saltar fuera en el diseño y salir Y bien, así que he hecho su diseño hija en von session. Siempre que estés diseñando, diseñado para una o dos horas, luego sal afuera, obtén comentarios de otros, camina y luego siéntate de nuevo. Lo harás. Sentirás la diferencia de que eres podrías tener más ideas en tu mente. Así que prueba dedo del pie, sal de tu alegría y ve algún mundo o conoce a tus amigos o cosas así. Haz algunas otras cosas jugando alrededor, regresa y tendrás algunas ideas más en tu diseño. ¿ Están inter tu en tu mente? Entonces este es el primer paso. No diseñes ningún sitio web ni ninguna aplicación móvil en una sola sesión. Segundo es que no desees diseño con una sola perspectiva, que es tu propia mente única y tus dos ojos. Tienes que cambiar tu perspectiva. Tienes que preguntarle a otros en tu equipo a los miembros de tu equipo, a tu esposa, a tus amigos, a tu familia. Ahora mi esposa no sabe mucho de diseño. Pero siempre le pregunto porque ella le pertenece a usted puede decir usuarios que no son muy tecnológicos. Por lo que siempre le pregunto cuando diseñé un diseño tan rico. ¿ Crees que se ve genial? ¿ Cuáles son Ah, confías en este diseño? Entonces ella contesta como a mí no me gusta esto. Esto se ve demasiado pasando por aquí. Algo no está bien. Entonces intento y tiendo a, ya
sabes, obtener retroalimentación de ella. No devaluo su retroalimentación de que ella no sabe nada porque cualquier usuario su perspectiva ahí están lejos. Ver las cosas es diferente. Por lo que tienes que conseguir al menos para rt diferentes perspectivas y luego mejorar tu diseño sobre ellas. Eres el constructor de soluciones que tienes dedo del pie, ya
sabes, entiende lo que los demás están tratando toe express y usa eso y crea más ideas. 3er 1 es que tienes que darle algo de tiempo a tu diseño que tomará forma. Se pondrá más detallado. Tendrá más refinado cuando le vas a dar algo de tiempo. Por lo que siempre da tiempo a tu diseño. Y te voy a mostrar cómo en realidad puede mejorar y cómo mis diseños se ven horribles cuando los
empecé y ¿cuál fue el resultado final? Te sorprenderá que cómo es posible, cómo empecé con este feo o puedes decir fuera diseño de equilibrio. Y cuando yo y lo terminé, era totalmente diferente. Entonces voy a compartir con ustedes el último proyecto que hice. Te puedo mostrar últimos dos proyectos, pero creo que será video muy largo. Entonces esto es de vuelta proyecto de ayuda de Texas Y este es mi intento de acogida. Por lo que puedes ver después de terminar mi tipografía y seleccionar pocos colores, empecé con este diseño. De acuerdo, así que esto fue muy abierto y no tiene algunos. Se puede decir personalidad poderosa o audaz. Y para mí, se waas Solo estaba bien lo diseñó. ¿ Fue que no estaba listo. Se puede decir diseño único o no muestra mucho valor O se puede decir profesionalismo para el discurso. Muy sencillo. Diseño no tan único o no muy potente. No hubo llamado a la acción, pero en Shone overhead estaba por aquí, que no era muy oscuro del dedo del pie. Era una luz y era del mismo color que esta bolsa lo atropelló. Por lo que seguí mejorando y estos son en realidad los resultados finales. Entonces te voy a mostrar y resultado Este es el resultado final. Ahora se puede ver que esta es una dirección totalmente diferente. Este es un diseño totalmente diferente para lo que empezamos. Empecé en primer lugar. Por lo que puedes ver ahora si miras estas esperanzas de diseño. No, Si miras este diseño, puedes ver vamos a alejarnos y puedes ver que es totalmente un diseño diferente. Tiene ah personalidad a ella. Tiene grandes colores. Es equilibrio. Es todo lo que hay. El primer intento inicial Waas No así seguir mejorando en tus diseños. Sigan dándole tiempo. También te puedo mostrar el en entre diferentes fases. Déjame mostrarte ese dedo del pie cómo llegué a este diseño y ah, ¿cuáles son las diferentes etapas? Este fue el 1er 1 Déjame mostrarte el 2do 1 Ahora, en este archivo, puedes ver esta es toda la historia de este diseño. Así es como empecé por aquí. Este es el primer intento de la izquierda. Entonces empecé a mover esto por aquí en la parte superior, y se puede ver aquí Tenemos algunos, um, iconos cortos por aquí, y trato de equilibrar esto en empezar a construir. Otras secciones estaban aquí, pero aun así no estaba, ya
sabes, contento con el encabezado por aquí. Entonces me mudé a éste. Este es otro, Un fondo
un poco más fuerte y lo mismo, Um, un poco más fuerte, pero aquí teníamos un ex. Entonces esta es la idea real fuera de mi cliente y ah, mostrando esto muy audaz por aquí. Y tiene pantalla de arbusto de fondo muy aburrida, azulada ,
púrpura, ,
púrpura,verdosa, y no se veía muy única ni poderosa. Entonces recibí algunos comentarios de mi cliente lo cual está agregando más perspectivas a este. Y terminé teniendo más espacio por aquí de lo que otra vez probé otro color que era azul . Aún así, el cliente dijo
No, no, quiero algo más. ¿ Por qué no intentas usar un morado Lo sentimos, uh, color
naranja porque lo habían visto en en la web de su competencia. Entonces en lugar de usar naranja, seleccioné este equipo que waas verde y amarillo o color ámbar Verde
amarillento, bob amarillento Llamarlo color naranja amarillento. Por lo que realmente me encantó este color. Entonces así es como progresa mi diseño TSA En muchas etapas diferentes, se
puede ver en cuántas tablas de arte he trabajado. También puedes ver algunas de las variaciones por aquí en estas secciones. Se puede ver este Waas negro y luego lo moví por aquí, que waas azul púrpura. Y también se puede ver en el inicio. Trato de copiar el mismo diseño que te mostré desde Designer Fund. Se puede ver la misma técnica. Pero al final me conformé con éste porque este look se veía más profesional. Por lo que puedes ver hay muchas iteraciones que hice para este diseño. 1234567 En la séptima última iteración. Mejoró mucho con el tiempo y mi esfuerzo y la retroalimentación del cliente. Entonces todo eso se trata de mejorar tu diseño. El tiempo que tienes para dar tu tiempo. El diseño es progresivo. Tomará algún tiempo. Se va a desarrollar por etapas. Se necesitará más de un dedo del pie mental, tener, ah, crear y construir un gran diseño. Espero que consigas mucho de valor de este video o de esta lección. Si tienes alguna pregunta que hacerme, pasemos a la siguiente lección.
12. Colaborar con desarrolladores en el proyecto de diseño web: en este video, voy a hablar de cómo te vas dedo del pie colaborar con tus desarrolladores de una manera significativa y tratar de dedo ahorrar tanto tiempo como puedas. Ahora, muchas veces cuando inicias un proyecto o comienzas, ya
sabes, entregando tu diseño a tus desarrolladores,
los problemas comienzan a ocurrir. Entonces cómo puedes manejar esos problemas fuera de nosotros por paso es que siempre que quieras tu dedo del
desarrollador, entender algo, tratar de grabar o pantalla. Graba la pantalla corta o la pantalla fuera de video. Describa su diseño para que pueda ver por aquí. Si lo miras por aquí, puedes ver tengo 1234567 diferentes videos en los que le expliqué a mi desarrollador que estos son los cambios que necesito. No es así como vas dedo del pie llamado Ed on. No es así como debe verse o actuar. De igual manera, puedes ver que tengo diferentes carpetas con fechas como cambios del 2 de septiembre. Tenía dos cortos de pantalla diferentes que puedes ver por aquí. Así es como realmente lo hago. Utilizo una herramienta llamada Jing. Déjame mostrarte. Esto es DJing en realidad y en realidad uso esta herramienta por mazos Mitt y uso esta para tomar shorts de pantalla y montar cosas diferentes o las suyas como puedes ver que estamos aquí. ¿ Por qué? Esto se está moviendo a segunda línea. Por lo que quería al escondite Toby en una línea. De igual manera, las distancias eran son que eran como 1 86 píxeles. Pero en mi diseño, eran 1 20 fotos. Entonces tuve que,ya
sabes,
hablar ya
sabes, con mi desarrollador incluso por teléfono, de ida y
vuelta del dedo del pie para que podamos entendernos los problemas del otro. Entonces lo que estaba pasando es que en el diseño web, tenemos algún margen en la parte inferior de éste y marchamos a lo alto de éste. Entonces si mi desarrollador tenía
que, ya sabes, usó 1 20 tuvo que irse como, 60 píxeles en esta sección y 60 cerdos en esta sección. Estaba pasando algún tiempo duro, ya
sabes, haciendo estos cambios así de igual manera se puede ver que tengo diferentes cambios para pantallas móviles. Entonces yo También había un problema más que waas enviándolo. Ah, adobe en realidad archivo. No, El problema estaba pasando que no estaba muy se puede decir familiarizado con adobe en realidad herramienta porque era desarrollador. Entonces le pregunté que ¿Qué está pasando? No estás haciendo lo que te mostré ni el expediente. No estás de acuerdo con el último o último archivo subido. Dijo: ¿ Dónde está el último archivo subido? Dije, es ah. Así que sé archivo extra que tengo en tu carpeta, que es nombrado por el Yep, Este es el nombre de los desarrolladores. Por lo que creé una carpeta. Pero dijo que en realidad está usando Zeppelin. Por lo que waas ofreciendo una herramienta la cual se llama Zeppelin Zeppelin dot ¿Eres? Si no lo sabes, me tengo mucho libre. Tengo muchos videos sobre el uso de esto. Cómo puedes usar este dedo del pie. Entregue sus diseños a sus desarrolladores. Puedes ver que te puede mostrar todos los diferentes tamaños, diferentes núcleos que puedes ver a la derecha. Se puede generar toda la cancha a partir de ese diseño. Por lo que usé. Después nos decidimos a usar Zeppelin. Por lo que para todo este proyecto, acabo de actualizar en un solo lugar. Por lo tanto, no intentes duplicar archivos Replicator en muchos lugares diferentes. No molestes a tus desarrolladores con herramientas de diseño. Prueba dedo del pie encuentra una herramienta que se va dedo del pie trabajo para ellos. Eso va a ser más fácil para ellos entender y copiar el código y usarlo en el desarrollo del tribunal. Entonces esto se trata de colaboración, por lo que hay que hacerlo más fácil y tratar de asentarse. Trata de hablar con tu desarrollador que vamos a utilizar sólo esta herramienta y necesitas
encontrar todas las cosas diferentes desde aquí. Entonces eso es todo, um, sobre la colaboración con tus desarrolladores, cómo vas a hablar con ellos. Podrían necesitar archivos SPD. Podrían necesitar archivos en peligro o PNG. Tienes que hablar con ellos que si necesitas algún expediente, como en mi caso, déjame mostrarte lo que estaba pasando. En mi caso, está abierto este. Entonces hubo un problema que fue muy único para mí, que waas me dejó mostrarte. OK, entonces aquí tenemos el logo para este. De acuerdo, para que veas si miras este logo. Este es en realidad un archivo PNG, y fue proporcionado por mi cliente. Por lo que este archivo PMD tiene mucho fuera de pixeles transparentes alrededor de su tamaño real si hace clic en esto, tiene 1 20 pixeles de alto. Ya puedes ver si lo muevo alrededor. Es Fue algo. Tenía tanto límite a su alrededor. Entonces mi desarrollador, estaba teniendo problemas, ya
sabes, alineándolo por aquí porque puedes ver en mi diseño en realidad coloqué este PNG fuera externalización fuera de este lienzo. Perdón. Entonces pero para él, cuando trató de cancha este hey estaba teniendo problemas colocando el Se puede ver la distancia entre estos dos elementos. Por lo que si haces click por aquí, puedes ver el 72. Pero estaba teniendo problemas, así que dije:
¿Por qué no? Te voy a dar un expediente. Voy con el dedo del pie quitar todos los píxeles vacíos a su alrededor. Y lo abrí en photoshop. Y usé la función de sueño para para tienda y eliminé todos los píxeles transparentes a su alrededor. Por lo que tiene caja delimitadora así. Entonces este es, creo, el viejo diseño. Pero en el diseño reciente, usé esto. Por lo que estos son diferentes tipos de problemas que se van a dar los pies. Tienes que decirles cómo estos pero bajo van a interactuar, cómo las sombras van a mostrar cómo estas bellezas de videos realmente Señor o cosas
así . Entonces espero que hayas entendido cómo te vas del dedo del pie, colabora con tus desarrolladores. ¿ Y cuáles son los diferentes problemas que normalmente enfrentan los desarrolladores y los diseñadores cuando intentan colaborar entre sí? Una cosa más es nombrar convenciones. Tienes que nombrar tus capas o todo correctamente, para que los desarrolladores puedan entender fácilmente tus diseños. Espero que hayan entendido este concepto. Si tienes alguna pregunta que hacerme, pasemos a la siguiente lección.
13. Optimización de rendimiento y carga lazy: ahora en este video, voy a hablar de algunos fuera de los consejos sobre rendimiento fuera de tu sitio web cargando fuera de tu sitio web, Hauspie. Es lo que son diferentes. Se puede decir retoques de rendimiento que se pueden hacer cuando se está desarrollando o diseñando para cualquier sitio web. Ah, y cómo vas del dedo del pie Muéstralo a tu cliente y cómo realmente lo hice en este proyecto. Por lo que mi desarrollador realmente usó get hub y solía, ya
sabes, empujar y cometer diferentes cambios. Por lo que tienen la pista de todos los diferentes cambios o versiones fuera de esa página. Version ing es una de las características que recientemente los diseñadores también han comenzado a usar. Y creo que va a estar presentando a Kobe. En realidad, algunos fuera de sus diseñadores, lo
están usando en boceto con algunas herramientas de terceros. Entonces en get hub, trata de contratar ah, desarrollador que tiene es vell versado en las últimas tecnologías como chicas o consigue hub o todas esas cosas. Entonces lo que hizo es que en realidad, um me mostró su progreso al usar esto. Get, ¿eh Buehrle? Entonces cada vez que quería tener algunos cambios, le
digo,
o le doy los cambios son revisiones y lo hizo en esta página, y yo sólo tenía dedo del pie,ya
sabes, ya
sabes, ir a esta página dedo del pie, ver todos los diferentes cambios. Se puede ver cómo este botón en realidad está teniendo el cambio de sombra y un poco presionado y girando en verde. Entonces estas son todas cosas diferentes. Ya sabes, le
dije que debería ser así. De igual manera, tenemos este botón de reproducción para escuchar de todos modos. Entonces, um, esto es una cosa. Entonces ni un segundo es así es como te vas del dedo del pie, obtienes diferentes cambios y ves tu proyecto en vivo. Tienes que tener algún mural el cual puedes publicar a tu cliente. Y también puedes ver diferentes cambios ocurriendo con vida en un LifeBridge. Entonces, um, segunda cosa waas, um problemas de rendimiento como puedes ver u oír. Aquí tenemos este trasfondo. Se trata de una imagen PNG de imagen Jipping. Entonces tenemos estas cuatro imágenes por aquí. Después tenemos estos dos videos sobre estos iconos. Iconos Spc. Son livianos. Y luego tuvimos estos MP tres expedientes. Ah, estos son de nuevo iconos. Iconos SPG. Ah, y, um, estos son pocos guiones que son que estamos corriendo por aquí y creo que aquí tenemos una cosa
más que está mostrando estas ah, preguntas. Preguntas comunes de desgravación fiscal. Y entonces tenemos esto. De acuerdo, ¿y qué? Mi desarrollo lo es. Lo más rápido en desarrollo web es JavaScript. Entonces en lugar de cargar a Jake Yuri como un archivo separado Ah, eso también le gustará tener ah, 70 a 80 KB de carga fuera. Si eres desarrollador puedes hacer cosas en javascript, eso sería mucho más rápido. Entonces, ¿qué? Mi cuarteado es desarrollador loco. Él Lizzie cargó estos dos videos. Por lo que estaban cargando después de que toda la página se cargue solo para proporcionar más, se
puede decir retrasos en cargar estos videos desde YouTube. Esto es una cosa. En segundo lugar, intentamos comprimir estos fondos de imagen de imágenes mediante el uso de PNG. Creo que es diferente compresión. Hay mucha compresión PNG ponderante o algo así. No recuerdo el pequeño PNG. Entonces normalmente uso esto para que solo sueltes,
arrastras y sueltas tu archivo J peg o PNG, y los va a comprimir, lo que va a perder en su mayoría menos compresión. Por lo que no vas a perder tu calidad. Entonces usé todo eso y un error que cometí es que probé dedo del pie, ya
sabes, usar nuevo tipo de compresión, que era ser imagen. Por lo que la extensión tus extensiones para imágenes es dardo w E B y B Web be image Ahora, empecé a usar red rep e image en la sugerencia fuera de Google. Entonces si no sabes la velocidad de Google Google prueba de velocidad Así que esta es la velocidad de Google por dentro. Entonces siempre que quieras ver cómo se están cargando tus páginas, solo tienes que copiar la u. R l y basarlo aquí y analizar. Y va a mostrar lo lejos que está y cuáles son diferentes problemas con él, por qué se está cargando lento y cosas así. Entonces, ¿qué estaba pasando? Google me acaba de hacer algunas cosas. Cambié la imagen tipo toe webby. Por lo que puedes ver aquí muestra página muy lenta. Pero no siempre escuches a Google. Tienes que ver realmente cómo tu página En realidad, Señor, tienes que probar algunos otros servicios como teníamos. Empezarás a ser tonta dot com, así que también uso este. Entonces te estoy mostrando mis herramientas fuera de comercio, que normalmente usaba para probar diferentes sitios web cargando tiempo y cosas así. Entonces se trata de cargar tiempo y luego una cosa más, que es Brother Stack. Esta es una herramienta que utilizamos para las pruebas de aplicaciones o navegadores. Entonces lo que hace este taburete es que va a tomar tu página y se va a engendrar esta página en múltiples dispositivos nativos diferentes. Entonces, por ejemplo, quiero probar mi página. Se puede ver, por ejemplo, este espacio. Se puede ver cargado en 1.14 segundos, lo cual es muy rápido. A pesar de que Google está demostrando que estos son 24. Pero quería ver en cuánto tiempo sólo voy a Lourdes. Aún así, esto es ah mucho fuera de página tamaño. En realidad, esta es la vieja página. Reduje los tamaños de imagen y no, creo que es alrededor de 3 a 4 MB. Por lo que esta app esta realmente empolvarla en diferentes dispositivos que puedes ver u oír. Puedes probarlo en diferentes pantallas móviles que, como el móvil, Um, como si quieres probar una sola página en el iPhone 5678 iPhone x ah, y acceder o cualquier dispositivo que quieras. Entonces si quieres ver que How My page se va a ver en todos los diferentes dispositivos. Puedes usar esta pila de hermanos, y te va a mostrar en tiempo real. ¿ Cuáles son los problemas con tu página? Entonces, ¿qué pasaba cuando cambio este dedo del pie wep e cual era esta imagen? Um Creo que este fondo Ah, iPhone X no estaba soportando imágenes de Webby en su momento. Entonces en este momento no luce imágenes felices. Escucho Google Page por dentro y la cambio. Y estábamos teniendo algunos problemas al aprender la página en el iPhone X. Mi cliente volvió a llamar y soy, ya
sabes, todo mi desarrollador. Y él dijo: ¿Cambiaste alguna imagen? Demasiado feliz dije que sí. Y dijo, Este es el problema en el iPhone accidente y deporte feliz. Entonces no siempre pienses que siempre tienes que subir opta por lo más un lu ah, tamaño
bajo fuera de archivo o tienes que mirar, tienes que escuchar a Google. Siempre intenta usar tus propios sentidos o tus propios y úsalos en la evaluación del que conoces Ah, esto probando tus sitios web en diferentes navegadores y diferentes APS y diferentes dispositivos. Entonces Estas son todas las herramientas que utilicé mayormente minúscula PNG Brother Stack. Creo que esto en realidad lo da mi, um mi cliente. Empecé a usarlo, creo que hace 56 años ahora creo que lo han pulido mucho. En ese momento, era velocidad pagada gratis por dentro, siendo dom tools, minúsculo PNG para compresión. Y eso es todo. Entonces espero que hayas disfrutado de esta lección lated de optimización del rendimiento Ah, respecto a tu diseño Web y cómo lo vas a manejar. Si tienes alguna pregunta que hacerme, pasemos a la siguiente lección.
14. Implementación de proyecto de diseño web y servicio de ventas: ahora, Al final, más importante que creo que mucho fuera freelance es un montón de diseñadores y desarrolladores que ignoran es el despliegue. Y servicio post-venta, cómo te iba del pie, dale todos los archivos a tu desarrollo a tu cliente y cómo vas a crear valor para usar técnicas de servicio posventa. Por lo que siempre que seas Clyde, tu proyecto está terminado. Lo primero es, que s no dejes a tu cliente después del pago por lo que podrían tener problemas cuando intenten
subir esos archivos del pie de su servidor. O podrían tener algo que no está funcionando ahí ambiente o ahí dentro se puede decir servidor de pruebas. Entonces lo primero es que ibas a enviarles archivos zip y también tratar de ayudarles a subir esos archivos dedo del pie allí servidor FTP. Entonces diles que les voy a mostrar cómo el dedo aplauden eso. Y si algo no está funcionando, estoy aquí por ti. Siempre estoy aquí. Simplemente dispárame un email y voy a responder y voy a tratar de solucionar tu problema. Entonces mi cliente, cuando les envié este proyecto lo subí todo tiene que ser varios. Estaban teniendo problemas como cuatro o cinco problemas diferentes y seguí resolviéndolos. Incluso mi desarrollador, él estaba fuera de la ciudad y yo usé el mío propio. Se puede ver, según habilidades que he dejado al sector cortejo fuera de este desarrollo. Pero aun así traté de arreglar sus problemas. No obstante puedo así que lo primero es darles servicio gratuito para pequeños cambios. Entonces si hay cambios son como 15 minutos, 30 minutos, no juzgues por ellos. Si lo intentan, están tratando de hacer un cambio muy grande o que no se definió en los
requisitos del proyecto . Entonces puedes cobrarlos. Esto va a demostrar que eres un profesional. De verdad te importa su proyecto. Entonces muéstrales que realmente te importa este proyecto. Eres persona realmente seria. Eres un profesional que despliega su trabajo a la perfección en perfectas condiciones. Por ejemplo, si compras un auto y cuando llevas tu auto nuevo a tu casa, algo dejó de funcionar y no eres capaz de arrancar tu auto. Entonces, ¿qué? Cuales serán tus sentimientos, ¿ves? Entonces, no trates de dejarlos. Muéstrales que podemos ayudarte. Podemos llevar tu auto a tu puerta donde lo quieras. vamos a ayudar si vas a hacer pequeños cambios en este proyecto. Y ah, realmente
nos preocupamos por este trabajo y somos profesionales nos íbamos a ayudar de pie hasta el éxito fuera de este proyecto. Entonces todo eso se trata de manejar este proyecto de diseño web freelance y cómo doy el servicio
postventa a mi cliente. Creo que tuvimos cinco o seis cambios diferentes y no cobré nada por esos. A pesar de que
envié, di algunos Se puede decir que sí. Pagué algo así como pequeña cantidad $20 a mi desarrollador, pero no le cobré a mi cliente por eso. Por lo tanto, ten en cuenta estos consejos. Creo que te van a ayudar en la construcción de buena reputación en tus clientes y te ayudarán a conseguir mawr proyectos de diseño web. Se puede ver el senti yo hice éste y no, mi cliente está diciendo que tengo una página de aterrizaje más para ti para que así sea como se obtiene un fideicomiso cuando la confianza de sus clientes y ellos saben que esta es la persona a la que debemos ir cuando nosotros tener dedo del pie hacer algo así. Entonces eso es todo sobre esta clase y los puntajes si tienes alguna pregunta, Aún tienes alguna pregunta que hacerme? Nos vemos pronto en, um, más videos nuevos. Si puedo mantenerlos al día, voy a añadir más videos. Pero hasta entonces, creo que eso es todo. Ah, toma tu y nos vemos pronto en mis otros cursos.
15. ¿Qué hacer de NEXT?: muchas gracias por tomar esta clase. Si tienes alguna duda con respecto al diseño o respecto a esta clase, siempre
puedes preguntarme en la sección de comunidad. Además, no te olvides del dedo del pie derecho. Algunos revisan algunas palabras lindas. Entonces para mí, Así que puedo, ya
sabes, conseguir algo de inspiración para crear más clases como estas en. Y además no te olvides del dedo del pie echa un vistazo a mis otros cursos porque lo son. Tengo muchos cursos sobre diseño de UX, diseño interfaz de
usuario y freelancing y diseño visual. Entonces hasta entonces, nos vemos pronto en la siguiente clase.