Transcripciones
1. Introducción: Oye, qué pasa, todos sólo aquí. Por lo que soy diseñadora y emprendedora del Reino Unido. Y este ha sido un tutorial muy solicitado sobre cómo hacer tus propios iconos de iOS. Desde que lanzé mi propio pack de iconos de iOS, he hecho más de 30 mil dólares y he tenido muchas peticiones de gente preguntando cómo pueden hacer sus propios packs de iconos y bien como pueden hacer sus propios iconos en general. Por lo que este tipo de guía es una
muy, muy rápida sobre cómo hacer la tuya. Entonces entrémonos en ello.
2. Parte 1: Entonces vamos a empezar en sigma. Si no tienes una cuenta de figura, por favor, regístrate. Es gratis inscribirse y es gratuito de usar. Vamos a hacer un nuevo documento. Y luego vamos a hacer un marco presionando f Solo haz un marco, un fueraborda donde podamos hacer nuestros iconos. Y lo que me gustaría hacer primero es traer una captura de pantalla de mi pantalla de inicio, por ejemplo, me gusta traer esto. Por lo que esto en realidad se encuentra actualmente al doble de la resolución. Podemos cambiar eso yendo al ancho, poniendo una franja y luego poniéndote,
y luego voy a la mitad del ancho. Y lo que hacemos desde aquí es que se puede ver que estos iconos tienen un radio fronterizo. Entonces vamos a copiar ese radio fronterizo. Por lo que haremos una oración de rectángulo Presionando r.
hazlo alrededor del mismo tamaño que este. Asegurémonos de hecho que esto esté aquí debajo. En el marco. Son como, oh, vamos. Ahí vamos. Entonces queremos asegurarnos. Entonces vamos a acercar. Y está alineado perfectamente. Y luego ajustemos el ancho para que sea perfecto. 9091 no es correcto. 90 por 91, eso no ve mi lodo. Lo hará por 90, por 90. Entonces eso está hecho. Y luego podemos bajar el radio yendo a cualquier otro rincones de la forma, bajando eso y acercándolo lo más posible al icono de iOS. Creo que ya está lo suficientemente cerca. Entonces ahora que lo hemos hecho, podemos sacarlo del camino. Y podemos empezar a hacer nuestro primer ícono.
3. Parte 2 de haz tu primer icono: Por lo que mi pack de iconos principalmente eran iconos negros. Entonces también voy a hacer iconos negros aquí. Entonces hagámoslo el color de relleno es negro. Y empecemos con algo sencillo. Entonces, por ejemplo, si miro los iconos que tenemos aquí a la derecha, empecemos con la app recordatorios que vemos aquí. Entonces voy a hacer un pequeño círculo. Hacer ese círculo Blanco, creo. Sí, hagámoslo blanco. Y hagámoslo diez por diez. Ahí vamos. Entonces mi objetivo aquí no es que los iconos sean réplicas exactas de lo que ven aquí. Yo quiero que estos iconos tengan mentes o estilo y gusto para ellos. Entonces voy por una mirada monocromática, como se puede ver aquí. Entonces eso es a lo que vamos a ir e incluso podríamos hacer las cosas más simples. Entonces, por ejemplo, la app recordatorios tiene tres puntos con los anillos a su alrededor. Podría ni siquiera meter los anillos. Entonces, solo copiémoslo y peguémoslo. 12345678. Sí, creo que eso se ve bien. Y entonces podemos mover la segunda o tercera forma incluso a ocho. Ahí vamos. Y entonces vamos a asegurarnos de que esté centrado. Agradable. Y entonces pongamos una línea. Entonces me gustaría poner en una línea con un rectángulo porque la línea va a ser,
bueno, básicamente es un rectángulo de todos modos. Hagámoslo 49. En realidad, hagámoslo un poco más corto, él ancho. Hagámoslo 34 y luego dos píxeles de alto. Y luego lo haremos blanco, le enviaremos con nuestro círculo, 12345678 año. Creo que eso funciona. Y entonces podemos hacer lo mismo aquí. Tenemos nuestro primer ícono. Muy simple, muy fácil, realmente tan simple como eso. Déjame, bueno, vamos a la GUI a facturar recordatorios. Entonces ahora que sabemos que nuestra app Recordatorios.
4. Parte 3 de Recreate la aplicación de notas: A continuación, hagamos el siguiente paso que ven aquí. Por lo que solo copiaremos y pegaremos nuestro icono de recordatorios 1234. Entonces para mover un icono diez píxeles cada vez que mantienes presionado el turno, y luego presionas la tecla de flecha a la izquierda o a la derecha, y lo moverá por diez píxeles. Diga, pasemos a eso, y hagamos la app de caballeros. Entonces, vamos a acercar. Hicimos este escritorio ness, y luego tomaremos esta forma aquí. Ponlo aquí, y lo traeremos, aunque Erlang, bonito. Por lo que el WhatsApp ha especie de subir en la parte superior y luego alineado así de la parte superior del bloc de notas y tiene dos líneas. Entonces estás tratando de averiguar qué se vería bien aquí. A lo mejor no deberíamos hacerlo de ancho completamente completo. las líneas, quiero decir, así que hicimos ésta y seleccionaremos nuestra línea. A lo mejor lo hagamos para que sea 90 de ancho ahora, disminuyámoslo en dos. Entonces disminuyamos el ancho a 70, centréelo. Y entonces pongamos sí, ya
sabes qué, creo que eso puede funcionar. Y luego veré aquí tenemos tres líneas ahora que he copiado y pegado. Podemos cambiar el ancho entre ellos cada uno yendo al lado derecho aquí y luego cambiándolo por lo que creemos apropiado. Creo que 12 se ve bien. En realidad también quiero volver a cambiar el ancho de los iconos. Entonces bajemos eso tal vez a 60. Y luego enviemos a los iconos. Ahora estamos realmente pensamos que se ve bastante bien en ello como una app de notas. Nuevamente, muy, muy sencillo. No tiene que ser complicado. Creo que esto es lo principal. Haz iconos tan simples como puedas, sobre todo cuando estás empezando a hacer los íconos porque es muy fácil superarse complicado con iconos y realmente meterte en el diseño porque conozco a algunos diseñadores de líquenes realmente puede pasar horas solo en un ícono cuando estás empezando por primera vez, te
recomiendo encarecidamente que estés empezando simple con iconos como estos.
5. Parte 4 Haz un icono para tu aplicación favorita: Ahora bien, ¿y si quieres hacer un ícono de tu app favorita como Twitter? Entonces lo que vamos a hacer es que vamos a copiar. En realidad necesitamos un nombre, nuestro ícono también. Entonces, pongámosle un nombre a éste, notas. Y vamos a nombrar a éste Twitter. Entonces lo que hacemos es buscar Twitter,
logo, SVG, tal vez como probablemente la mejor manera de hacerlo. Vamos a llevar recurso marrón de epsilon que tengo aquí. Y luego podemos descargar el logotipo de Twitter. Una vez que guardes el logotipo de Twitter, vas a querer volver a tu caída FISMA, quitará estas líneas aquí rápidamente zona. Y luego podemos arrastrar en el archivo SVG aquí. Una vez que tienes un arrastre, Dan es bastante grande, definitivamente demasiado grande para caber en el ícono real en sí. Y también puedes ver que el SVG de Twitter en realidad tiene dos formas ahí dentro y su espaciado alrededor del ícono real de Twitter. Para que podamos quitar esa forma. Podemos tomar el ícono de Twitter aquí y arrastrarlo a nuestro ícono de Twitter aquí. Y entonces podemos cambiar el tamaño de la misma. Ah, estoy cambiando el tamaño de toda la forma. En realidad sólo necesitamos cambiar el tamaño del vector. Ahora cuando se trata de lo grande que el icono de Twitter real debe ser relativo al icono, eso depende totalmente de ti. Pero lo que te recomiendo es que si tienes formas como esta, como el ícono de Twitter, y vas a ser más íconos que están en medio del ícono mismo, es tratar de mantener al mismo ancho y altura relativamente, así que sabemos que nuestro icono es 90 por 90. Cambiemos el ancho de este pequeño ícono a tal vez 48, por ejemplo. En realidad, necesitamos vincularlos por lo que necesitamos asegurarnos de que las proporciones estén constreñidas. Presionas ese botón aquí para hacer eso. Pero sí, cambiemos eso a 48. Y podemos centrarlo también cambiará el color de la misma. Y sí, creo que eso se ve bastante bien como un icono de Twitter. Ahora podemos ver la altura y el ancho de la misma es diferente. Pero mientras nos mantengamos a un alto relativo de 48 y un ancho relativo a 48, cualquiera que sea el lado más largo. Creo que esa es una buena manera de asegurarte de que todos tus iconos se vean en proporción y obtienes una especie de mirada más cohesiva y consistente entre ellos.
6. Parte 5 de hacer mensajes: ¿ Por qué no hacemos el icono de mensajes a continuación. Entonces vamos a copiar este. Traer IVR. Y hacemos los mensajes que recibí. Por lo que eliminaremos el icono de 2s dentro de ahí, cambiaremos el nombre de nuestro grupo. Entonces lo que estamos haciendo hoy es que vamos a insertar un círculo. Entonces podemos hacer eso subiendo aquí, o simplemente podemos presionar el teclado. Tenía un chico. Y luego hagamos icono de mallas. Entonces me voy muy rudo aquí. Entonces solo estoy tratando de averiguar más piernas, ¿verdad? Y entonces lo que haremos es traer un vector. Entonces usamos aquí la herramienta de bolígrafo que puedes ver p. Y entonces lo que haremos es hacer una forma así. Oh, lo siento, te conectaron. Pero nuestra forma obviamente sólo tiene una huelga. En realidad necesitamos darle un relleno. Entonces retiramos la huelga y le daremos un relleno. Ahí estamos. En realidad estamos bastante módulo ya ahí. Entonces lo que hacemos es tomar estas dos formas y las convertimos en una. Entonces subimos aquí y tú puedes hacer selección sindical y yo haré la forma en una. Entonces podemos cambiar el color de la misma a
yAhora estamos, ese es nuestro icono de mallas hecho muy rápido y fácil.
7. Parte 6 Exportación: Para exportar tus iconos, simplemente
seleccionas cada uno. Al igual que así. Se va a plus en exportación. Normalmente me gusta exportarlos en resoluciones bastante altas. Entonces hagámoslo cuatro veces. Y luego puedes hacer PNG fácilmente funcionaron mejor. Exporta cuatro capas y luego simplemente las guardas donde quiera. Y es realmente tan simple como eso. Básicamente puedes repasar cualquier ícono, cualquier ícono favorito de la orina, y copiarlos. Hazlas solo usar herramientas vectoriales y herramientas de forma para copiarlas tanto como quieras. Y también puedes obtener logotipos de marca como Facebook, Twitter, Tesla, otros logotipos de internet. arrastrar y soltar no cambies el color de los mismos, ponlos encima del icono. Y eso es más o menos eso. Por supuesto. Sí lleva tiempo y eso es lo principal. Sí toma unas horas hacer todos los iconos para todas tus apps favoritas. Pero con el tiempo, puedes hacerlo y puedes tener cualquier tipo de suerte como. Entonces espero que ustedes hayan disfrutado de este tutorial y gracias por ver.
Oliur, Designer and creator.
