Cómo seleccionar una cara de tipo (campo de inicio de diseño de UI, semana 3)

1. Introducción: Esta semana vamos a estar seleccionando tipos de letra para un diseño de UI. Vamos a empezar hablando de lo que hace una buena combinación de tipografía. Lo que hace un buen texto corporal y lo que hace un buen texto de visualización y tiene que emparejarlos juntos. Y entonces el proyecto en el que trabajarás esta semana será elegir un artista que disfrutes. Piensa en qué características tiene ese artista, y luego encuentra una exhibición y textos corporales que coincidan con el estilo artístico así como parejas bien entre sí. tipografía compone casi todo lo vemos en Internet y las habilidades que aprendimos esta semana nos ayudarán a elegir los mejores tipos de letra para nuestros diseños de UI. Empecemos. 2. Inspiración: Ahora, antes de poder ir y empezar a seleccionar cualquier tipo de letra, necesitamos llenar nuestro cerebro de inspiración. Tenemos que mirar diseños de todas las industrias diferentes y tener una idea de lo que hay por ahí. Qué diferentes tipos de letra nos hacen sentir. Realmente, deberíamos pasar bastante tiempo y probablemente con bastante regularidad Mirando otros trabajos de tiempo y probablemente con bastante regularidad diseño y contemplando lo que comunica, lo que nos dice y cómo nos sentimos al respecto. También nos da ideas sobre cómo podemos usar la tipografía. Como dijo famoso Pablo Picasso, buenos artistas copian, grandes artistas roban. Ahora no necesariamente queremos estar robando directamente el trabajo de la gente, pero sí queremos estar inspirándonos cosas buenas que hemos visto por ahí fuera en la industria del diseño. Ahora siempre abogo por mirar tipos de diseño evitados, no diseño web, no diseño de aplicaciones, pero mirando el diseño en su conjunto para que tengamos una gama mucho más amplia de inspiración y posiblemente crear algo un poco más único o sabía que otros diseñadores de la industria no lo son. Podríamos venir a un sitio como inspiración de diseño. Obviamente hay muchos sitios web de inspiración de diseño, pero podríamos venir a diseñar inspiración y buscar tipografía. Y vamos a ver bastantes letras escritas a mano, si soy sincera o bastante funky pequeñas ilustraciones usando letras. Pero todas estas cartas nos van a dar un sentimiento. Nos van a dar la sensación de que pertenecen a algo. Esta carta aquí o este número. Se ve muy regio, parece realmente importante. Se ve valioso. Y se ve ligeramente delicado. Y creo que es por la enorme cantidad de contrastes entre las grandes zonas gruesas y las líneas muy delgadas. Y posiblemente porque sólo le quedan unas cuantas áreas ligeramente rectas, se ve y si estábamos buscando algo que comunicara esas características, tal vez estábamos trabajando para toda una marca o marca de joyería de alto valor , por ejemplo, entonces podemos buscar una tipografía que tenga esas características, pero que sea mucho más simple y más clara y más fácil de leer cuando venimos a elegir una tipografía. Ahora se podría decir, bueno, eso está todo bien y bueno. Estoy haciendo una app para un banco. Entonces, ¿por qué querría algo con ese tipo de características? Bueno, en realidad, yo, el banco todavía va a tener muchas características muy específicas. Y he elegido estas cartas aquí de un partido de futbol por las miradas del mismo. Se ve muy seguro, muy seguro, muy confiado, y definitivamente funcionaría en un sitio web bancario. Y entonces mi pregunta es, ¿por qué es eso? ¿ Es porque son letras muy gruesas o es porque las letras no tienen ningún contraste? ¿ Tiene que ver con el seguimiento de esos bastante espacio entre cada letra. Es incluso que ver con la alineación, cómo se centra esto, y el texto está todo alineado centralmente. Hay muchas decisiones tipográficas que han entrado en este cartel muy simple que lo hacen medio plano, tipo de sentimiento confiable que funcionaría para una aplicación bancaria. Tratemos de pensar cuáles son ahora para que cuando vengamos a elegir nuestros tipos de letra, tengamos algunas ideas de lo que estamos buscando. Ahora, aún podría usar la inspiración de diseño y la siguiente, y simplemente buscar tipografía web. Así que consigo cosas que son un poco más específicas y comenzarás a ver algunas ideas de aplicaciones web reales empiezan a aparecer. Pero tal vez en este punto queremos cambiar a una galería de inspiración diferente como esta, fuentes en uso porque a medida que nos pongamos más específicos, vamos a estar cuestionando ¿cuáles son estas fuentes? ¿ Puedo acceder a ellos? Una cosa que es realmente agradable con las fuentes y usos, vemos muchos diseños diferentes, pero también descubrimos qué tipos de letra reales están utilizando. Entonces de manera similar a cómo acabamos de tratar de obtener inspiración de diferentes medios. Podríamos mirar aquí y a menos que veamos muchas portadas de discos y carteles y todo tipo de cosas. O tal vez en este punto queremos empezar a filtrar en base a cosas que son bastante similares a nosotros. Podríamos mirar sitios web, tal vez podríamos mirar los empaques. Quiero decir, tal vez haya alguna inspiración interesante que podamos obtener de los empaques. medida que buscamos por aquí, podemos recoger lo que los tipos de letra. Y a veces esa tipografía podría no estar disponible para nosotros por diversas razones, pero saber qué nos va a ayudar a encontrar algo parecido. Un par de otras galerías de inspiración útiles, tenemos tipo lobo. Ahora esto es otra vez consiguió algunos diseños realmente bonitos, pero también te dice cuáles son las tipografías. Entonces eso es absolutamente brillante y estos son un poco más simples y claros y un poco más similares a lo que realmente vas a usar en tu sitio web. Así que muy bueno para alguna inspiración de etapa posterior. Lo que es bastante bonito con el sitio web tipo lobo es como si en realidad estuvieran escribiendo muchas publicaciones también si quieres realmente emariñarse en tipografía, este es otro buen lugar para venir. Y por último, quiero mostrarte exploración de tipo donde estas pequeñas maquetas de cómo podría parecer en nuestra página web. Elementos interactivos de interfaz de usuario en encabezados y enlaces. Para que puedas ver exactamente cómo va a verse si fuera en una aplicación web. Por lo que esto es mucho más útil después de que hayas completado tu inspiración y en realidad vas a elegir tipografías, sobre todo porque de nuevo, está usando Google Fonts. Entonces si estás con un presupuesto, estas la mayoría de las cosas que han burlado aquí, nuestras tipografías que son de uso libre. Ahora similar a esta galería de inspiración, hay una aquí llamada Font pair, donde literalmente puedes encontrar fuentes de Google que se emparejan bien juntas para que puedas filtrarla por. Quiero un san serif encabezado con un texto de cuerpo Serif. Y te va a dar todas las diferentes fuentes de Google que pueden emparejar bastante bien juntas. Y solo puedes mirar hacia abajo y ver cuál tiene este tipo de sentimiento que querías tener como una forma muy rápida, fácil de elegir, pero también para que puedas inspirarte y ver cómo estos se ven juntos. Por último, solo quería mostrarte este plugin Chrome llamado type sample, que si instalas en Chrome te va a ayudar a identificar qué tipo se ha utilizado en diferentes sitios web. Si no eres demasiado conocedor de tecnología, eso puede ser bastante útil. También hay un sitio web llamado lo que la fuente, donde puedes subir imágenes y te dirá qué tipos de letra piensa que estás usando en ellas. Solo una comida para llevar de este video realmente, que es asegurarte de que estás llenando tu cerebro de gran inspiración. Al mirar a través de estas galerías de inspiración, intenta pensar en lo cada tipo de letra y la forma en que se utiliza es realmente comunicándote cómo te hace sentir y cuál es el mensaje que tiene la tipografía. 3. Define la marca: Antes de cualquier tipo de proyecto de diseño visual, vas a trabajar con tu cliente para establecer qué significa la marca, qué significa, qué debe comunicar. Diferentes agencias de diseño utilizan técnicas muy diferentes son formas de hablar de esto. Es posible que hayas encontrado investigadores del mercado antes de eso como preguntas locas como, ¿qué tipo de auto conduce tu marca? Están tratando de crear una comprensión compartida de cuál es la personalidad de la marca. Probablemente la técnica más utilizada es intentar crear cinco adjetivos que expliquen la marca. Ya que este curso no se trata de branding per se. Vamos a usar esta técnica. Si estás trabajando con un equipo o un cliente, puedes dejar unas horas a un lado y probar esto. Simplemente junte y ideas todos los adjetivos que sientes, comunica la marca, y coleccionarlos todos en una pizarra blanca o en un gran trozo de papel. Entonces ten una discusión sobre qué palabras significan lo mismo. Atravesar algunos, decidir cuál de esas palabras es la mejor. Entonces de las palabras que te quedan entre, tienes una discusión para decidir cuál de los cinco adjetivos que son únicos y mejor describen la personalidad de la marca. Una vez que tengas este conjunto de cinco adjetivos, switch resuma lo que es la marca. Ayuda con las críticas de diseño más adelante. Nos detiene tener una conversación de si nos gusta la estética, y en su lugar tenemos una conversación sobre si el estilo estético comunica la personalidad de la marca. Cuando tu equipo vuelva a reunirse para mirar los diseños, puedes recordarles los cinco adjetivos que resumen la personalidad de la marca y dicen, hace esta paleta de colores, esta tipografía, toda esta composición comunican la personalidad. Y nadie tiene que decir si les gusta o no. conseguir que un equipo de diseñadores y el cliente imposibleconseguir que un equipo de diseñadores y el clientele guste un diseño. Conseguir que un equipo de diseñadores y el cliente coincidan en que un diseño comunica una personalidad de marca es un poco más útil y posiblemente un poco más realista. Es posible que de vez en cuando vea a gente crear calzoncillo de diseño con escalas deslizantes entre jóvenes y experimentados, fuertes y delicados. Si desea sugerencias para trabajar a través de los ejercicios en este curso para cada módulo donde sí tenemos algunas actividades prácticas. Entonces crearé cinco adjetivos de marca que puedes usar. Voy a crear diferentes para cada sección para que tengas una oportunidad en creación de estilos bastante diferentes para cada uno de estos módulos. Tu ejercicio para este video es reunirte con tus clientes, tu equipo de diseño o ambos, e identificar cinco adjetivos que resuman tu marca. Alternativamente, si estás trabajando por tu cuenta, solo podrías llegar a cinco adjetivos que crees que suenan un poco cool. O adjuntaré cinco a los recursos de este video. Y a medida que elijas tus tipos de letra a lo largo del resto de este módulo, intenta tener en cuenta estos cinco adjetivos. Simplemente haz los tipos de letra que estás eligiendo ayudan a comunicar estos adjetivos de marca. El propósito de este video es asegurar, ya sabes, trabajar solo en trabajos de diseño estético cuando sepas lo que la marca está tratando de comunicar. Si no has establecido cuál es la personalidad de la marca ya que no puedes elegir un tipo de letra que comunique eso o hagas alguna de las otras actividades de diseño. Si estás trabajando en un proyecto del mundo real, siéntate con tus clientes, lo contrario elige otro diseñador o posiblemente podrías hacerlo por tu cuenta solo solo para practicar la primera vez. Y entre usted lluvia de ideas y resuelve cuáles son sus adjetivos de marca. Cinco adjetivos que comunican cuál es tu personalidad de marca. La mayoría de ustedes en trabajar con una marca real todavía. Así que sólo para conseguir alguna práctica en, tal vez elija una marca existente o un sitio web existente con el que trabajes ocasionalmente. Y pensar en lo que los cinco adjetivos que describen su personalidad. 4. Tiendas de fuentes: Obviamente, en algún momento vas a necesitar encontrar algunas fuentes. Por supuesto, encontrar algunos tipos de letra para usar. Tienes tu inspiración. Ya sabes cuáles son los requisitos, ¿dónde los vas a buscar? Y mucho de las veces va a ser Google Fonts. Eso es porque son gratis, son fáciles de implementar, y aquí hay muchas fuentes potencialmente bastante buenas. En primer lugar, solo echemos un vistazo rápido a Google Fonts. Podemos buscar si conocemos el nombre de la misma o podemos escribir algún texto aquí si queremos que diga algunos textos diferentes aquí en los pequeños bits de ejemplo y todo, podemos filtrarlo por categorías. Ahora estas categorías no van a ser ligeramente diferentes a las diferentes categorías que has encontrado en diferentes sitios. Todos los categorizan un poco diferente, pero sabemos lo que es un serif. Sabemos lo que es un sans serif. Es si tiene los pies pequeños no lo son. Display solo significa un tipo de letra que está específicamente diseñado para encabezados. Escritura a mano significa ¿tiene una sensación humanística manuscrita a ella? Y el monoespacio, por supuesto, significa que los anchos de cada personaje o el mismo normalmente utilizado para la codificación. Ahora una cosa de la que no hemos hablado demasiado es que si fueras a seleccionar un idioma diferente como digamos por ejemplo , seleccionamos japonés. japonés tiende a tener sus propias clasificaciones, pero Google Fonts, sólo va a clasificar las mismas de inmediato. Si buscas una tipografía japonesa, por ejemplo, va a ser un poco más difícil encontrar una que se ajuste a tus requisitos exactos en las fuentes de Google porque no las están clasificando de alguna manera que la gente podría esperar letra japoneses sean clasificados. Pero también podemos ver que básicamente hay ocho para elegir. Por lo que tienes que elegir solo el que quieras. Ahora una cosa que es particularmente agradable de las fuentes de Google también es que podemos seleccionar algunas de las propiedades de la fuente. Entonces, por ejemplo, tal vez queremos que sea bastante estrecho porque su mayoría estamos diseñando dashboards para un sitio web de interfaz de usuario muy pesado, que tal vez no tiene muchas publicaciones de blog y cosas donde enfocándose puramente en lo que es tipo de encajar bien en los menús y botones. Vamos a querer que sea una tipografía bastante estrecha para solo podamos filtrar ese pelo lacio y eso va a reducir el número de opciones disponibles. Idealmente, una gran cosa de elegir un tipo de letra es simplemente descartar a todos los que no encajan. Y entonces te van a quedar un puñado para elegir. Por último, una característica bastante agradable que tiene Google Fonts, que es una característica bastante nueva. adelante vamos a hablar más de fuentes variables. Pero si hago clic en esta casilla de verificación aquí mostrar solo fuentes variables. Actualmente hay 34 fuentes variables en Google y hay una variable. Te mostraré con losa Roboto. Si miras aquí, hay si estuvieras importando esto y hablaremos mucho más esto en la etapa de implementación. Pero si estuvieras importando esto, podrías estar tentado a importar estos nueve archivos de fuentes diferentes, por lo que tienes todos los pesos diferentes. Bueno en realidad podrías simplemente importar este archivo de fuente. Y tiene 900 pesos diferentes, cuales puedes controlar con una variable en tu CSS más adelante. Esto es particularmente agradable para conseguir los blancos correctos exactos, especialmente cuando estamos lidiando con el diseño sensible, donde podría haber múltiples tamaños diferentes para la tipografía. Vamos a querer que haya varios pesos diferentes también. Y ahora podemos controlar que en un nivel mucho más granular, cada vez más con tipografía web, vamos a estar buscando fuentes variables. Y como acabamos de ver, la propia Google Fonts ya tiene 34 fuentes variables. Diferentes fuentes variables tienen otras variables distintas a las blancas. Pero Google Fonts actualmente solo tienen estos con las variables blancas. Así que eso es realmente bonito. Ahora la siguiente ubicación a mencionar es puramente para las personas que tienen una cuenta de Adobe Creative Cloud. Porque si tienes Adobe Creative Cloud, estarías loco por ir a cualquier parte que no sea fonts.adobe.com para tratar de encontrar tus tipos de letra. En primer lugar, y eso se debe a que Adobe tiene una colección realmente impresionante que están disponibles para los usuarios de Creative Cloud. Pero sí quieres una pregunta si la persona que está publicando el sitio web también tiene licencia para usar el tipo de letra también. Lo que quiero decir con eso es que si estás haciendo trabajo de cliente y personalmente tienes la cuenta de Creative Cloud, ¿necesitan una licencia diferente para que utilicen el mismo tipo de letra en la página web del cliente. Ahora, con las fuentes de Adobe, ya te vas a notar de inmediato que aquí las clasificaciones son mayores. De hecho, la escritura a mano y el guión se separa en dos clasificaciones diferentes. Tenemos carta negra de la que hablamos antes, que sería bastante extraño usar eso en un sitio web, pero tal vez lo hagas. Y Slab Serif. Por lo que ya tenemos una opción más rica de clasificación es elegir. Y podemos seleccionar estas propiedades no todo en una escala deslizante como en Google, pero podríamos elegir una que sea más estrecha o, o más pesada ponderada, o incluso seleccionar una con bastante alta o baja x-altura. Y ya sabemos que eso potencialmente podría ser bastante útil. Ahora de nuevo, otra cosa que es realmente agradable con Adobe Fonts es si fuera a seleccionar japonés y han señalado un poco a japonés por aquí. Notarás que las clasificaciones realmente cambian. Si se trata de tipos de letra japoneses, puede ser más fácil encontrar uno que se ajuste a su clasificación exacta en Adobe Fonts. Pero de nuevo, vale la pena señalar que solo hay siete tipos de letra japoneses. Entonces, cuán útil es poder, filtrar en las diferentes clasificaciones. No estoy muy seguro. Adobe Fonts es absolutamente increíble si tienes licencia de Adobe Creative Cloud. Ahora la próxima pareja sólo voy a mostrarte rápidamente nuestra fuente shop.com y no mentir ningún tipo. Y estos son sitios web que recoge fuentes de todas las fundiciones de diferentes tipos. Y los posicionan en su página web para que puedas buscar fácilmente a través un gran número de fuentes comprables compradas a diferentes diseñadores. Voló este curso, estoy usando branding con tipo para los tipos de letra que se usan ahí. Relativamente asequible y me gusta bastante su estilo. Quieres tener cuidado cuando estás comprando unos de diseñadores individuales que entiendes cuál es la licencia. Entonces, por ejemplo, si miro branding con licencias de tipos, podemos ver que en realidad hay una licencia completamente separada diferente que necesitamos usarla en aplicaciones móviles a si estamos utilizando se en un sitio web. Por lo que necesitamos estar conscientes de dónde podemos usarlo en la licencia que tenemos porque puede ser muy fácil equivocarse la licencia. Sólo voy a mostrarte rápidamente un par de unos un poco más preciosos. Este es el tipo de juego. El realmente ofrecen un diseño de tipo basado en comisiones donde puedes acudir a ellos con tus requisitos y en realidad crearán la tipografía para ti si estás trabajando en un proyecto con un presupuesto muy grande, este es Hoefler y Co, y tienen algunos tipos de letra realmente bonitos aquí. Una cosa que notarás es que parece realmente buena relación calidad-precio porque dice noventa y nueve dólares para la tipografía. Pero en realidad, si quieres usarlo en la web, que por supuesto lo haces que la licencia. Y va a subir bastante en función de cuántas impresiones hay en la página web y cuánto tiempo lo tienes en vivo para todo ese tipo de cosas. Así que no se deje engañar demasiado por lo que parece un precio bastante bajo de primero, este es un proyecto interesante que encontré recientemente llamado prototipo, donde se puede tipo de diseñar su propia tipografía. Puedes elegir las alturas serif, y probablemente esté trabajando con fuentes variables de alguna manera puedes elegir el ancho del Serif y el contraste. Y hay todo tipo de diferentes escalas deslizantes donde puedes controlar exactamente cómo se ve la tipografía y posiblemente diseñar la tuya con algún mínimo esfuerzo. En este video, en su mayoría estoy hablando contigo sobre dónde vas a encontrar tus tipos de letra, tus archivos de fuente? Y de manera realista, si tienes una cuenta de Adobe, quieres acercarte directamente a las fuentes de Adobe en este momento y estar usando eso para encontrar tus fuentes. De lo contrario, dependiendo de su presupuesto, su mayoría vamos a estar en fuentes de Google. Entonces, si tienes un poco de dinero extra de repuesto, es posible que quieras empezar a mirar algunos de esos sitios donde puedes comprar una tipografía específicamente. De lo contrario, voy a pasar el resto de este curso usando Google Fonts puramente porque creo que ahí es donde alrededor del 90% de ustedes van a estar gastando cerca del 90% de su tiempo. 5. Texto de cuerpo: Si el 95% de nuestra aplicación es topografía, entonces tal vez algo como 85 a 90% es topografía corporal. El texto corporal, el texto en los párrafos en las publicaciones de blog, los textos en descripciones alrededor de infografías, áreas de texto explicando cómo se utiliza la aplicación. Todo ese texto de estilo de cuerpo es la mayoría de cualquier sitio web. Por lo tanto, la mayoría de los tipógrafos o mayoría de los diseñadores eligen primero la topografía corporal. Voy a sugerir eso ahora y lo voy a sugerir de nuevo más tarde, pero por razones muy diferentes. Ahora algunas cosas que pensar a la hora de elegir su topografía corporal. No queremos escoger algo demasiado loco. Por ejemplo, no vamos a elegir nuestra tipografía manuscrita para conformar la topografía corporal de nuestra aplicación web. Podría ser en enormes párrafos largos de texto, los términos y condiciones. A lo mejor queremos que sea individual y único. Queríamos comunicar quién es la marca y la personalidad de la marca. Pero queríamos hacerlo de la manera más mínima, sutil que posiblemente pueda. Vamos a aprender más adelante cuando observemos la legibilidad que queremos que nuestra tipografía corporal idealmente tenga una altura x ligeramente superior a la media. significa que si miramos a Roboto aquí, sí tiene una altura x razonablemente grande y un tamaño muy bonito. Nos fijamos en el tamaño de las letras minúsculas. Son bastante grandes en comparación con el tamaño general. Entonces eso es realmente bueno para leer un tamaño pequeño. Pero tampoco queremos demasiado contraste. Algo así como Baskerville probablemente no sea ideal para textos corporales, sobre todo si era un poco pequeño porque hay bastante contraste entre algunos de los trazos delgados y más gruesos. Aquí tenemos pantalla de Playfair y tiene unas líneas muy delgadas en este lado de la a y una línea muy gruesa en ese lado de la Si esto fuera demasiado más pequeño, va a empezar a causarnos algunos problemas para diferenciar las cosas y asegurarnos de que podamos verlo correctamente. Ahora, pantalla de Playfair, vamos a hablar de display en un poco en su propio nombre está sugiriendo que lo usamos como textos de encabezado y no como textos corporales. Pero una cosa a tener en cuenta es algo con demasiado contraste. Aquí tenemos PT serif y esto tiene algún contraste, pero mucho menos que las arenas de exhibición. Probablemente podríamos salir con la suya usando esto como textos corporales. posible que deseemos hacerlo un poco más grande que nuestra topografía corporal promedio. Ahora lo siguiente a pensar es que vamos a querer varias veces utilizar diferentes pesos de texto en negrita y posiblemente texto en cursiva para llamar la atención sobre las cosas dependiendo del propósito de nuestros textos corporales . Pero sin duda si íbamos a utilizar bastantes textos en nuestra página web, vamos a querer múltiples estilos donde tengamos propiedades de fuente. En realidad podemos decir que estamos buscando que tenga más de una cierta cantidad de estilos para asegurarnos que solo estamos viendo aquellos donde vamos a tener opciones cursivas y audaces también. Ahora tenemos nuestras especificaciones de nuestro breve. Si empezamos a descartar todos los tipos de letra que no podemos usar, sólo nos van a quedar con tantos para elegir. Si estuviéramos, por ejemplo, eligiendo un tipo de letra para un banco y algunas de nuestras palabras clave de branding decían cosas como seguras y seguras y confiables. Probablemente vamos a evitar algo como Poppins, que tiene formas únicas muy interesantes alrededor de la G aquí, o ferrocarril, que tiene este crossover bastante extravagante con la WWE. Y vamos a elegir algo que se ve un poco más confiable que botes de remos creativos QUIEN podría ser realmente una buena opción para un banco. Pero si todavía queremos que tenga algún tipo de personalidad, tal vez no, tal vez Morley sería una opción más interesante. Independientemente de cuál sea nuestra marca y palabras clave, no queremos que la tipografía del cuerpo tenga demasiada personalidad. cuando el lector llega a los textos corporales, ya han decidido que les interesa leer el artículo. Ya decidieron que van a utilizar la aplicación. Ya hemos comunicado la personalidad de la marca y de lo que estamos todos. Ahora queremos que sea lo más fácil posible para que lean. Me puse el escrito de encontrar uno para un banco seguro y seguro. Sólo va a tener a Sans Serif. No queremos los textos de splay ahí. Y al instante hemos reducido esto a 139. A lo mejor quiero que sea un poco estrecho porque también lo voy a utilizar para mis elementos de interfaz de usuario. Y luego me quedo con Sarah burn. Así que simplemente con solo establecerme reglas específicas basadas en mi breve de diseño, inmediatamente he encontrado una tipografía que es perfecta. Ahora quiero que te lleves el breve que has creado, ya sea que lo hayas creado tú mismo o tu trabajo, el cliente, para crearlo. Quiero que vuelvas a pasar algún tiempo mirando las galerías de inspiración. Pero ahora tienes una idea de lo que es lo que estás buscando. Por lo que va a obligar a tus ojos a ver cosas que antes no estabas mirando. Entonces quiero que vengas a Google Fonts o si tienes una cuenta de Adobe, siéntete libre de usar Adobe Typekit e intentar reducirla y encontrar una tipografía que no tenga demasiado contraste. No tiene demasiada personalidad, pero tiene la personalidad que buscas sutilmente ahí dentro que sientes que va a funcionar bien para tu proyecto. 6. Una caras individuales: Antes de empezar a hablar de las tipografías coincidentes para usar múltiples tipos de letra en nuestros diseños y cómo encontrar estos tipos de letra que funcionen bien juntos. Vale la pena tomarse un minuto para pensar, ¿puedo salir con la suya con una tipografía? Es totalmente posible crear un diseño realmente agradable con mucho carácter usando una sola tipografía. Puede verse realmente bien, puede parecer minimalista, y va a ser más rápida y más fácil para ti crear. Posiblemente la principal desventaja con el uso una sola tipografía es que los encabezados, el tipo de pantalla realmente pueden ayudar a comunicar carácter, marca, personalidad, y realmente pueden dibujar a la gente. Pero también ayuda a crear esa jerarquía visual haciendo una distinción realmente clara entre encabezados y texto corporal. Y como hablábamos antes, por la forma en que obtenemos una especie de distorsión visual, el texto no va a parecer el mismo tipo de letra, un tamaño grande como lo hará en un tamaño pequeño, podría se ven un poco como un error. En realidad hay algunas soluciones si no ibas a elegir una sola tipografía y usarla para todo a lo largo de tu sitio. Hay ciertas tipografías en la pantalla en este momento tenemos losa. Y es posible que hayas notado que hay dos versiones, una llamada losa 013 pixels y otra llamada losa 027 pixels, que te dicen los tamaños exactos para los que están diseñados para estos tipos de letra para ser utilizados. Podemos ver que el que se va a usar más grande es un poco estrecho porque si tienes encabezados largos, va a ocupar bastante espacio de tu pantalla. Y probablemente han ajustado la espera visual ligeramente por los dos tamaños diferentes. Ahora cuando miras a tu alrededor, hay múltiples tipos de letra donde ha creado una fuente separada o una tipografía separada para mostrar los textos del cuerpo y a veces incluso una tipografía separada para texto de subtítulos. Sólo voy a mostrarte otro. Este se llama DM serif text y DM Serif Display. Ahora este es uno peculiar real creo, porque dM Serif Display está obviamente diseñado con un poco más de contraste en las letras, por lo que se puede utilizar mucho mayor tamaño, pero dm serif text probablemente no va a funcionar particularmente bien si era alrededor de 14 píxeles, tal vez 16, posiblemente incluso 18. Idealmente, este sería un texto separado para subencabezamientos dos encabezados principales. De hecho, incluso cuando hago clic en esto en fuentes de Google y busco los emparejamientos que recomienda es casi consistentemente sugiriendo usar texto DM serif como en realidad el tipo de letra de encabezado hasta que llegue derecho a la parte inferior donde está diciendo que tal vez podría usar la pantalla Playfair y el texto serif DM. Ni siquiera creo que sea una combinación particularmente buena que hablaremos más adelante. Pero sólo para ser claros, hay muchas posibilidades donde se ha diseñado una tipografía con una fuente separada para el texto de visualización y para el texto del cuerpo. Si te interesa usar una sola tipografía, esa es una opción bastante elegante. Otra cosa a cuidar de nosotros, si estás usando para usar una sola fuente, asegúrate de que tenga mucha ponderación diferente. Asegúrate de que tenga opciones de cursiva. Posiblemente pequeños campamentos como podrían ser utilizados para subencabezamientos o subtítulos. Pero asegúrate de que tenga mucha variación a ella. Porque cuando vengas a construir todo tu sistema de diseño, vas a necesitar todos esos pedazos y piezas extra. Vamos a ver eso más en la sección de estilismo. Pero solo ten en cuenta ahora mismo que si vas a usar una sola tipografía para todo, vas a querer que tenga muchas más opciones. Vale, ahora a continuación vamos a ver el emparejamiento con nuestro texto de visualización. 7. Mostrar texto: Antes de encontrar una tipografía para emparejar con nuestro texto corporal, para encontrar un bonito encabezado textos que coincidan con esas etiquetas corporales, necesitamos entender el propósito de encabezar topografía. A veces nos referimos a esto como texto de visualización. Cuando estamos tratando con los textos corporales, estamos mucho más preocupados por los tecnicismos sobre cómo puedes leerlo, la legibilidad que leerás en grandes áreas a la vez. Vamos a ver la legibilidad muy pronto. Pero los textos de encabezamiento sirven a un propósito muy diferente. Necesita captar a la gente. Se necesita hacer que quieran leerlo, aunque sea algo que alguien necesita leer por trabajo o por otra razón, todavía tienen que querer leerlo para asegurarse de que se comprometan plenamente con el texto y sacar el máximo provecho de ella. El encabezamiento de textos establece el tono. Nos dice si estamos hablando en un tono lúdico o un tono muy serio, nos dice con quién es la persona con la que estamos teniendo una conversación. ¿ Cuál es la personalidad que nos habla ahora mismo. Además de eso, crea una cierta cantidad de interés visual. Si nuestra tipografía, si nuestra tipografía comunica suficiente emoción y comunica la democión de crack, tal vez no necesitemos ni siquiera usar una imagen u otros elementos gráficos para establecer el tono para la página, suficiente emoción y comunica la democión de crack, tal vez no necesitemos ni siquiera usar una imagen u otros elementos gráficos para establecer el tono para la página, en realidad puede crear un diseño mucho más minimalista si somos mejores en seleccionar una buena tipografía de visualización. Porque cuanto más personalidad de la marca se comunica a través de la tipografía, menos necesitamos confiar en ilustraciones, imágenes o texturas. Cuando hablamos de cómo alguna comunicación es no verbal, este es el lugar donde puedes poner la mayor parte de tu comunicación no verbal en el texto display donde no va a interferir con la legibilidad. Y va a marcar el tono justo desde el principio. Ahora el otro lado de todo esto, si no ponemos ningún pensamiento en nuestra pantalla, tipografía podría ser algo como lo verías con Bootstrap antes de haber hecho cualquier edición al código, tenemos un lista de personalidad muy sosa, aburrido que se dirige aquí. Y no crea compromiso, ni interés. Y ya le pone tu cerebro asumiendo que esto va a ser una pieza de texto aburrido, poco interesante, y francamente, sin importancia. Y podría decirse que parece un error. Es como cuando encuentras un ícono muy simple diseñado para tener solo 20 píxeles de altura y lo vuelas para que sea enorme. Se ve mal porque no tiene suficiente detalle para ser tan grande. El topografía y el encabezamiento aquí es claramente una topografía corporal. No tiene suficiente detalle e interés para ser volado hasta este tamaño. Parece un error. De hecho, en realidad edité ligeramente el CSS para crear este encabezado bastante feo para este sitio web, es imposible para nosotros ignorar todas las ventajas elegir un texto de visualización efectivo para nuestros encabezados. Porque si no tenemos inadvertidamente todos los efectos negativos del encabezado que está en pantalla en este momento. El propósito del texto de visualización es mucho más sobre marca y el ajuste del tono de lo que se trata de legibilidad. Este es el lugar donde realmente podemos comunicarnos por debajo de ese nivel consciente. Y actúa como una especie de imaginería realmente atrae a la gente y hace que quieran leer, aunque alguien tenga que leer el texto en la página, necesitan querer leerlo primero para asegurarse de que estén completamente comprometerse con ella. Y su cerebro está interesado en el material, ya sea que estamos creando un periódico, un blog, todo el tablero de instrumentos para una aplicación bancaria, ese encabezamiento de texto de visualización necesita para que gente se interese así como comunicar la personalidad. 8. Información meta: Vamos a hablar de emparejar dos tipos de letra. Pero por supuesto, hay muchas situaciones en las que podrías elegir más de dos tipos de letra. Uno común es para meta-información para los leyendas, por ejemplo, si estuvieras tratando con una aplicación web muy pesada de contenido o sitios web como potencialmente un sitio web de noticias. Tengo al guardián en la pantalla en este momento, entonces naturalmente necesitarás una jerarquía visual mucho más sofisticada. Hay muchos tipos y significados más diferentes para el texto en la pantalla. Y por lo tanto, es mucho más difícil para nosotros diferenciar entre cosas como la fecha o el título de una imagen que en realidad no son importantes para que muchos lectores, 99% de las personas que leen este artículo no necesita leer el título de la foto. Realmente no es necesario saber a qué hora se publicó, y no queremos interferir con esos noventa y nueve por ciento de los lectores. También queremos que sea visualmente obvio que el título es otra cosa, que la fecha es otra cosa. Podemos elegir un tipo de letra diferente para ayudar a hacer esa diferenciación. Pero también porque sabemos muy pocas personas necesitan leer eso, realidad podemos hacerlo un poco más pequeño que lo que es incómodo el tamaño de lectura, podemos hacer que sea incómodo leer. The Guardian han hecho que el título de esta imagen sea mucho más pequeño que el tipo de letra del cuerpo. Lo han convertido en una tipografía sans serif, y también lo han hecho un color más claro por lo que tiene menos contraste con el fondo, además de añadir un símbolo o un pequeño indicador visual de que es una leyenda y la forma de un triángulo. Se ve un poco como una flecha apuntando hacia arriba a la imagen. Todas estas cosas combinadas nos dejan muy claro que esto no es importante y no es parte del artículo y simplemente podemos saltarte por encima. En la muy rara ocasión de que alguien necesita saber quién fue el fotógrafo o la hora exacta en que se publicó el artículo. Y resulta que tienen bastante mala vista. Pueden pedir ayuda a alguien. Podrían usar un lector de pantalla, podrían acercar. No necesitamos preocuparnos demasiado por la legibilidad en estos casos de borde increíblemente raros. Porque si lo hacemos, va a dañar la legibilidad para el noventa y nueve por ciento que están justo aquí para tratar de leer el artículo. Si estamos en una situación en la que tenemos una aplicación pesada de contenido estamos diseñando y decidimos que necesitamos una nueva tipografía para las líneas del comprador, las fechas, los leyendas, o cualquier otra información de Meta. Lo más importante es que si lo hacemos increíblemente pequeño, ¿podemos todavía leerlo? Y aparte de esos puntos individuales, las otras reglas que estamos a punto de hablar de hacer con emparejar tu tipo de letra de cuerpo con tu tipo de letra de rubro. Todos aquellos todavía se aplican cuando estás diseñando en un tercer tipo de letra para tu información de Meta. Si estamos trabajando en un sitio web muy pesado de contenido como por ejemplo, un sitio web de noticias o una aplicación con un dashboard con muchas visualizaciones de datos en. Entonces aumenta la necesidad de una tercera tipografía a medida que aumenta la complejidad del sistema tipográfico. Si estamos eligiendo un tercer tipo de letra para nuestra meta-información, nuestros leyendas son nuestras fechas para un ejemplo, entonces lo más importante es si lo hacemos realmente pequeño, sigue siendo legible? Y aparte de eso, todavía se aplican todas las reglas sobre la topografía de emparejamiento y veremos las siguientes. 9. vincular fuente: En este video, vamos a hablar cómo emparejar tipos de letra. 99% de las veces en que estamos diseñando una aplicación o un sitio web, vamos a elegir más de un tipo de letra. Vamos a tener uno para los encabezados y otro para los textos corporales, y potencialmente un tercer tipo de letra para cosas como leyendas. Ahora tenemos algunas reglas establecidas. Existen algunas reglas para ayudarnos a decidir si una tipografía funciona bien con otra. Desafortunadamente, hay demasiadas variables para que se confíen esas reglas. Siempre vas a tener que aprender a entrenar tus ojos. Pero una vez que hayas entrenado tus ojos para emparejar tipos de letra que funcionen bien juntos, puedes hacer toda una carrera apenas fuera de eso si quieres, pudiendo emparejar tipografías en combinaciones efectivas, pero también combinaciones únicas es una piedra angular realmente vital para tus diseños. Ahora, supongamos que he elegido EB Garamond para que sea mi tipo de letra de cuerpo. Y he elegido esto parcialmente porque vamos a estar usando mucho Garamond en la siguiente sección. Pero antes que nada, algunas cosas que sabemos de este tipo de letra. Entonces sabemos que es un tipo de letra serif tradicional. Sabemos que es un clásico absoluto. Es uno de los primeros aparte de quizás Jensen, que todavía está en uso hoy en día. Pero Jensen tiene algunas características que lo devuelven un poco demasiado. Mientras que Garamond todavía puede parecer una tipografía de hoy en día. Y por estas razones, a muchos abogados y abogados y contadores les gusta usar Garamond. Hace que las cosas se vean bastante oficiales y clásicas. Estuve trabajando con un abogado hace poco y cada documento de Word que le envié, cambió el tipo de letra, el Garamond. Si asumimos por un segundo que tengo un breve para crear una solicitud de abogados u otra persona con antecedentes de tipo jurídico muy profesional, entonces Garamond podría ser una buena opción para los textos corporales. O si estoy diseñando una aplicación con un tipo de letra atípica ligeramente loco, podría usar Garamond solo para la página de Términos y Condiciones, por ejemplo, donde quiero que las cosas se vean un poco más oficial. Entonces, ¿cómo podríamos entonces emparejar esto con un rumbo? Bueno, podemos mirar algunas de esas galerías de inspiración de las que hablamos como el tipo Wolf. Y otro lugar para mirar obviamente es en la parte inferior de la página de fuentes de Google. Va a sugerir algunas cosas que son bastante comúnmente emparejadas con ella. Ahora, acabo de sugerir que mi breve es hacer una solicitud o un sitio web para abogados u otros profesionales similares. Entonces algo así como langosta definitivamente no va a funcionar. Podríamos cruzar eso de inmediato. De igual manera, un tipo de letra como el juego, que se llama play, supongo porque tiene reminiscencia de los juegos de computadora de estilo antiguo. De hecho, parece casi el monoespacio tal vez está dibujando hacia un género muy específico. Y por lo tanto también podemos ignorar lotes dejándonos. Y obviamente nos quedamos con cientos de otros tipos de letra de rumbo, pero dejándonos con tres posibilidades que Google dice que son bastante comunes, que es Roboto, Montserrat, y Oswald. Ahora roboto está increíblemente sobreutilizado. Algunos diseñadores de aplicaciones solo usarán Roboto. Entonces, sin siquiera pensarlo, solo pegarán a Roboto en todo. Siempre soy reacio a usar algo como esto porque la posibilidad de que nuestro usuario esté dormido mientras usa nuestra aplicación es increíblemente alta con algo así como Roboto. Ahora en realidad no me siento como Montserrat es que bueno aparecer el algo que ver con sobre todo usar Montserrat Regular, tal vez si lo hice medio o audaz, pero algo que hacerlo teniendo una especie de trazos muy estrechos, lo que hace que me sienta choque un poco con Garamond y hablaremos esto un poco más tarde. Pero me siento bastante atraído por la idea de usar Oswald con Garamond. Y una gran ventaja de inmediato es que este rumbo es muy impactante. Te atraen tan rápido, es tan grande y denso y te llama la atención casi como una de esas serifas de losa. Pero sin tener connotaciones de carteles victorianos de Inglaterra. Siento que hay un nivel de contraste realmente agradable entre estos dos tipos de letra. Voy a sacar esto a Figma ahora, Oswald y Garamond. Y voy a explicar algunas de las razones por las que estos tipos de letra trabajan juntos. Aquí tenemos a Oswald y Garamond como bloque de texto cómo pueden aparecer potencialmente en un sitio web o aplicación web. Y se pueden ver que se ven bastante bien juntos. Creo que una cosa que creo que es realmente útil de Oswald como un encabezamiento textos en una nota al margen es porque se destaca tanto y tiene tal impacto, puedes hacerlo un poco más pequeño como un encabezado. Y por lo tanto, ya estamos quizás parece un poco más profesionales para nuestro sitio web de abogados o aplicación web que potencialmente estamos haciendo. Ahora cuando estamos emparejando tipos de letra, lo que no queremos son tipos de letra que son demasiado similares, van a chocarse. Va a parecer un error. Y vamos a hablar de esto más tarde. Pero tienes una distorsión óptica cuando haces una tipografía más grande. Y eso podría hacer que parezca un tipo de letra diferente y como si estuviera chocando consigo mismo. Así que incluso si solo estamos usando exactamente el mismo tipo de letra para los encabezados, podría parecer un poco como si chocara. Queremos que se vea obviamente diferente. Queremos que parezca una decisión intencional. Y eso nos va a ayudar también con nuestra jerarquía visual. Va a hacer que sea más distinguible que sea un rumbo. Por lo que nunca queremos tener un encabezado que parezca demasiado parecido al texto corporal. Ahora, por lo que podemos ver en este momento, estos se ven bastante drásticamente diferentes. Estoy en prendas bastante amplia, es bastante espacio abierto y Oswald está muy condensada. De hecho, esto sería bastante bueno para los elementos de la interfaz de usuario. También hay una versión condensada de Oswald, pero en realidad tienen algunas similitudes. Tampoco queremos que se vean opuestos completos. Si parecen opuestos completos, se ven como dos cosas de diferentes mundos que hemos empujado juntos. Necesitan algunas similitudes. Queremos medidas iguales de personalidad. Si nuestro texto de visualización, si dirijo textos tiene demasiada personalidad, queremos un texto corporal bastante conservador y viceversa. Ahora veamos algunas de las cosas que tienen similares porque se ven bastante diferentes en este momento. Una cosa que siempre, siempre, siempre queremos que tengan al menos relativamente similar entre el texto de visualización y el texto del cuerpo es la altura x. Entonces aquí tengo una L mayúscula y un par de x mayúscula tanto en Oswald como en Garamond. Y podemos ver que Oswald tiene una altura x ligeramente mayor que la prenda, pero no es drásticamente más alta. Es alrededor del 57% de las alturas en Oswald y es alrededor del 50% en EB Garamond. Es un poco más pequeño en Garamond normal, aquí hay un poco de espacio, pero son relativamente similares. Eso es realmente importante y vamos a hablar de eso más tarde. Pero siempre queremos que nuestros textos display y nuestros textos corporales tengan una altura x similar. Nunca queremos uno con una altura x realmente alta y otra con una altura x realmente baja. Ahora lo siguiente que quiero ver es si miras esta E desde ambos, se puede ver cómo la ponderación es bastante similar. No hay una gran cantidad de contraste en un serif tradicional como Garamond. Cuando miras el pequeño travesaño de la E y luego el costado de la E. Se puede ver que el contraste en la espera es aproximadamente el mismo que el contraste que esperan que Oswald tiene. Son similares en ese sentido. Si fuéramos a elegir un tipo de letra como el serif moderno, entonces se va a ver bastante drásticamente diferente a algo como Oswald. Y vamos a querer tratar de encontrar otras formas de hacerlo similar. Quizás pudiéramos encontrar un texto de encabezado con un ancho similar. El contraste en trazo es bastante similar entre estos dos tipos de letra. Y luego finalmente la forma real. El Garamond obviamente tiene aberturas mucho más grandes. Podemos ver cómo es mucho más amplio y este espacio en la E es mucho más grande y Garamond a Oswald. Pero la forma general real de las letras, por ejemplo, la a es la tradicional una forma en ambas. Y he mirado a través de la tipografía. La mayor parte de la celosía sí tienen formas similares. Y mencioné que porque si cambié este Oswald a más de dos, tal vez una Futura a o algo así, verás que tiene una forma completamente diferente. E incluso si esto se relaciona y todas las demás formas, entonces va a crear contraste con eso. Hay similitudes entre estos tipos de letra que los hacen parecer que pertenecen juntos mientras que tienen suficiente contraste para crear un interés visual. Por supuesto, combinar un serif con un sans serif siempre va a crear instantáneamente esa tensión que contrasta entre los dos. Pero también podríamos hacer muchas cosas que hacer con la conformación de este último, el contraste del trazo, cuán humanista se ve. A veces algo así como Futura se ve geométrico, mientras que algunos Garamond casi se ven ligeramente manuscritos. Tiene un golpe que fluye hacia él. Podríamos llamar a eso humanista y llamaríamos futuro racional. Y cuando estamos eligiendo tipos de letra que van bien juntos, queremos algún contraste y algunas similitudes. Se trata de equilibrar esas dos cosas. Pero la única cosa que no queremos comprometer en las alturas x. Siempre tiene que tener una altura x relativamente similar. Eso es un emparejamiento de fuentes con Oswald y Garamond. Ve a ver si puedes encontrar un texto de visualización que cumpla con tu breve y también coincida con tu texto corporal bastante bien. Recuerda que quieres que tenga una cantidad significativa de contraste pero aún así parece que pertenece juntos. El Idealmente debería haber algunas similitudes y algún contraste. 10. Práctica de parado de fuentes: Antes de empezar a practicar nuestro emparejamiento tipo, quería mostrarte este juego realmente genial que he encontrado Se llama conexión tipo. Y la conexión tipo se está describiendo en broma como un juego de citas tipográfico. Para entrenarte para ayudar a emparejar tipos de letra. Nos va a dar cinco aquí para empezar. Y yo elijo a Garamond porque ya hemos mirado a Garamond. Y entonces nos está dando especie de reglas completas aquí sobre cómo podríamos elegir una buena pareja para Garamond está sugiriendo que ya sea podríamos confiar en la familia, en cuyo caso seleccionar un otra tipografía de la misma familia, otra tipografía tradicional serif. O buscar algo que se vea bastante parecido o mirar algo con bastante marcado contraste, o para encontrar algo con algún tipo de conexión histórica. Ahora digamos que quería encontrar algo que parecía bastante parecido. Voy a hacer click aquí y me da tres opciones. Y uno de ellos es la combinación correcta según este sitio web. Y dos de ellos son Dodds, que no van a quedar bien con Garamond de inmediato. Sabemos que este es un serif moderno aquí, este Pm, y no tengo que pronunciar eso. Por lo que yo diría que esto probablemente no sea el bailarín del crack. Y éste parece bastante transitorio, pero también serifs de losa muy fuertes aquí. Y si miro hacia abajo la descripción del guión, dice que tiene una altura alta x-height, tipo de me deja con esta opción, que es que tal vez este tipo de letra sea el mejor partido para Garamond. Y lo que es realmente genial aquí es que puedo ver algunas de las características sobre cómo se ve el travesaño. Dice que tiene un pequeño contador SCOTUS cabeza con bandera serif. Y si enciendo a la otra tipografía existe también tiene una cabeza serif en forma de cuñada y un contador pequeño. Entonces tiene muchas similitudes. Y lo que buscábamos era una tipografía similar, digamos. Y dice, Bien hecho, he encontrado una tipografía que funciona bien juntos. Ven y juega con este juego porque a veces te va a decir que te equivocas y va a explicar por qué. Y puedes ver algunos de los detalles sobre la tipografía y realmente te va a ayudar con algunas de esas palabras de anatomía que ya hablamos y cosas así. Este puede ser un juego bastante divertido para pasar diez minutos jugando. Ahora, también realmente rápidamente solo quiero recordarte un par de sitios que miramos antes cuando hablamos de inspiración tipo lobo, donde solo te va a mostrar tipografías, combinaciones y par de fuentes donde te está mostrando combinaciones de solo Google Fonts. Ahora si ya has elegido tu tipo de letra de cuerpo, podría ser algo útil solo ver lo que estos sitios web están recomendando pares bien, con esa tipografía ya. Y luego de las opciones que se alimentan bien, se puede ver una que se ajuste a su breve. Ahora podría ser un buen momento para volver a visitar tu inspiración después de que ya hayas elegido una tipografía corporal. A continuación, tengo un reto para ti que me gustaría que repetieras idealmente tantas veces como sea posible aprendemos haciendo después de todo, quiero que te lleves a un famoso diseñador o artista o músico o alguien realmente, y tratar de crear una maqueta muy simple de cómo podría verse una página sobre ellos. Queremos que tenga una visualización diferente de textos a textos corporales, y luego posiblemente capa con una imagen. Realmente, realmente simple. Antes de crear un sistema tipográfico completo, queremos haber tenido algún tipo de jugando con él para ver cómo podría verse y trabajar en una página. Realmente rápidamente acabo de hacer esto tres veces para Dieter Rams, Jackson *******, y Frank Gehry, donde elegí tipos de letra para cada uno. Y luego los coloco en una página para que pueda ver cómo se ven. Ahora, Dieter Rams para aquellos de ustedes que no saben, fue un diseñador muy famoso que trabajó en Braun. Y he elegido dos tipos de letra, pelo, Ubuntu y cabina. Y los he elegido porque son muy minimalistas y aspecto muy moderno o moderno en cuanto a Dieter Rams como el tiempo. Pero ambos tienen un juguetón muy sutil para ellos. Cuando miramos el trabajo de los dos Rams, vemos que utiliza un uso muy, muy sutil, muy simple de color y patrón para hacerlos un poco juguetones y tener ciertos personajes. Y creo que estos dos textos abiertos, el B es absolutamente perfecto de la manera en que tiene esta pequeña curva hacia arriba y curva hacia abajo poco sobre la línea base y sobre la línea superior. Y lo hace abultar y lucir poco similar a como veo Dieter Rams vale la pena buscar. Encontré lo que creo que es un emparejamiento bastante razonable entre los dos. Y de nuevo, si acerco al texto del cuerpo, se puede ver que tiene un cierto nivel de contraste, pero de nuevo, cierto nivel de similitudes también. Nuevamente, tiene una pequeña cantidad de juguetón. Una cosa que creo que es particularmente agradable es que Dieter Rams dice, nueva compañía lo se.Así que y en realidad tiene el glifo con la O y E juntos, lo cual es absolutamente vital si me iba para hacer una página escribiendo sobre Dieter Rams. Y así habiendo elegido este famoso diseñador y luego elegido estos dos tipos de letra, y más tarde en una página, puedo ver esto realmente comunicando el mensaje exacto que quiero. Es más un sentimiento que nada. Pero ambos tipos de letra trabajan juntos. Son muy modernistas, pero tienen el mismo tipo de alegría que siento que Dieter Rams tendría con su trabajo. El segundo que elegí fue Jackson *******, que pensé que tendría una muy diferente. Aproximación a ella. Hizo muchas cosas con salpicaduras de pintura sobre lienzo. Y cuando acerco el texto del encabezado es cuando y el texto del cuerpo es Judson. Y cuando acerco, el texto del encabezado casi parece pintura salpicada en la página. Podemos ver que es bastante juguetón. No obstante, la PII no se une del todo. Se ve bastante humanista. Algunas de las formas, la forma en que la parte más estrecha de la E está en un ligero ángulo. Parece que estaba pintada a mano. Hay cierto movimiento en los serifs de la parte superior de la W y el H. Casi puedo contemplar que esto sea dibujado por alguien que gotea pintura abajo, toque quizás. Pero por lo menos tiene que sentir expresionistas. Y entonces de igual manera el texto corporal tiene una sensación similar creo, pero es mucho más sutil. No saca nada lejos de la legibilidad. Si y estaba creando una página sobre Jackson *******, creo que estos textos, Es absolutamente fantástico. Podemos ver que la forma de la T es muy similar, pero ésta es mucho más limpia y más fácil de leer. Un tamaño pequeño. Por supuesto, he ido por Serifs con Jackson *******. Quería tanta extravagancia y detalle como sea posible. Y cuando me coloco en una página al lado de esta foto, no podía decir que estoy bastante contento con esta elección. Siento que esto sí comunica un tipo similar de mensaje. Entonces finalmente, creé una página muy rápida y sencilla para Frank Gehry y he puesto aquí uno de sus edificios arquitectónicos. Es arquitecto similar a Dieter Rams es muy modernista. He ido por sans serifs, pero tiene un estilo diferente de juguetón. Es postmoderno, es juguetón sin sentido. Los tipos de letra que he elegido aquí son seis gorras y Joseph en arenas. Y se puede ver que las sexta mayúsculas quieren que las letras minúsculas son en realidad gorras pequeñas, cual es un poco loco lo cual es un poco loco y realmente no tiene ningún sentido. Es puramente ahí sólo para ser diferente, que creo que es como a Frank Gehry le gustaría bastante, para ser honesto. Al principio mira a Joseph y suena tal vez no parezca que tenga ese extravagante borde posmodernista, pero voy a acercar y se puede ver esta E, se corta un ángulo realmente extraño. Está rotado. Esta Z o Z. Si estás en Estados Unidos, tiene un labio extraño donde simplemente parpadea al final ahí y la W se cruza. Particularmente extraño. Pero en general todavía tiene un aspecto modernista. Sólo tiene estos pequeños giros realmente locos aquí y allá que sólo salvan a Frank Gehry para mí. Entonces mi reto para ti, y realmente creo que deberías hacer esto tantas veces como tengas tiempo para hacer es escoger un artista, escoger un diseñador, escoger un músico si quieres, y tratar de encontrar un impuesto corporal y un texto de visualización que funciona bien en conjunto. Pero te sientes comunicarte el mismo mensaje que el artista que te da el mismo tipo de sentimiento. Si no puedes pensar en nadie o te gustaría un poco extra de desafío. Lo que creo que podría ser realmente divertido sería usar un sitio web como una wiki roulette.co. Acabo de venir a la ruleta Wiki y es aleatoriamente darme el nombre de un político ucraniano que también es constructor y electricista. Y creo que podría ser divertido simplemente tomar una página de Wikipedia al azar y ver cómo la rediseñarías. ¿ Qué tipos de letra elegirías si fuera por solo esta página? Podrías tener suerte y conseguir a una persona como el pelo, pero a veces obtienes una teoría o un lugar y ves si puedes hacerte una idea sobre qué emociones se invocan desde Marketplace o esa teoría o lo que esté en esa página de Wikipedia. Y mira si entonces puedes crear una composición realmente simple como esta a partir de esa página aleatoria de Wikipedia podría ser el siguiente nivel de este desafío. De verdad quiero que te vayas y hagas esto, y quiero que te vayas y lo hagas al menos tres veces. Porque cuantas más veces lo hagas, más te darás una idea de qué personalidad y qué sentimientos tienen los tipos de letra, y por supuesto, qué tan bien emparejan con otras marcas u otras ideas estás tratando de crear diseños para. 11. Resumen: Necesitamos dos cosas antes de que podamos empezar a seleccionar una tipografía, necesitamos inspiración. Necesitamos mucha inspiración. ¿ Dónde se usan comúnmente estos tipos de letra? ¿ Qué opciones de tipos de letra hay por ahí y cómo se utilizan? Entonces tenemos que asegurarnos de que conozcamos nuestros requisitos por primera vez. Los requisitos pueden cambiar a medida que obtenemos ideas y si estamos trabajando con un cliente o un grupo de interés, los requisitos podrían cambiar también. Por lo que tenemos que asegurarnos de que esté definido antes de empezar a comprar alrededor. A medida que compramos, hay tipos de letra gratuitos y de pago. Los pagados serán más únicos, pero también podrían tener mejor alineación y más glifos disponibles para nosotros. libres son construidos por aficionistas que han construido su mínimo desnudo. Todo lo que podrían hacer Google o Microsoft con demasiada frecuencia copian letra populares y así puede dar algo menos distinguibles caracteres. Para la mayoría de los proyectos. No obstante, algo así como las fuentes de Google serán tu tienda de go-to, o tal vez fuentes de Adobe si tienes una cuenta de Creative Cloud o si tu cliente lo hace, letra profesionales pueden ser muy caro y es muy importante que se asegure tener la licencia correcta para nuestro texto de visualización y nuestros encabezados. Queremos algo único que exprese el carácter de la aplicación y le dé una sensación rara y valiosa. Necesitamos cualquier combinación de fuentes para contrastar entre sí, así como complementarse mutuamente en partes iguales. Al seleccionar nuestro texto corporal, uno de los atributos más importantes es lo fácil que es para nuestro usuario leer.