Utilice símbolos SF para mejorar el diseño de su interfaz – Explore

Los iconos son guías visuales que nos ayudan a navegar por experiencias sin palabras. Ya sea que las personas estén viendo una imagen en una señal de tráfico o un ícono en su aplicación, los usuarios confían en íconos familiares y fáciles de entender para brindar información contextual y ayudarlos a encontrar su camino.

SF Symbols proporciona a los diseñadores y desarrolladores símbolos consistentes y personalizables que se integran a la perfección con la fuente del sistema San Francisco. Estos iconos son un gran recurso si eres un diseñador experimentado o si trabajas principalmente con Xcode. La biblioteca elimina la necesidad de rediseñar, redimensionar y reinventar elementos gráficos y ofrece una gama flexible de pesos y escalas, así como alineación vertical automática cuando las interfaces de usuario se ajustan a diferentes tamaños de pantalla.

Encuentra el símbolo correcto

Con más de 2.400 símbolos, cada uno disponible en nueve pesos y tres escalas, SF Symbols ofrece una variedad de opciones para satisfacer sus necesidades. Puede examinar fácilmente los símbolos basados ​​en vectores en la aplicación SF Symbols o buscarlos, copiarlos y pegarlos rápidamente en aplicaciones populares como Sketch, Adobe XD o Figma, donde se alinearán automáticamente con el texto.

Los símbolos vienen en diferentes colores, contornos y variantes rellenas.

Utilice la aplicación SF Symbols para buscar y obtener una vista previa de las selecciones antes de agregarlas a su proyecto. Existen muchos símbolos tanto en contorno como en variantes rellenas que se pueden utilizar en diferentes contextos. Los símbolos delineados tienen propiedades similares al texto, mientras que los símbolos rellenos proporcionan contraste y énfasis adicionales.


Consejo: cuando se trata de estilos de iconos, menos es más. Intente ceñirse a un solo estilo para unificar su diseño dentro de un componente o contexto específico.


Los iconos dan a cada parte de su interfaz de usuario un aspecto coherente y familiar. Al seleccionarlos e incluirlos, tenga en cuenta el contexto: cómo aparecen junto al texto y cómo se mezclan con las otras palabras e imágenes en la pantalla.

Busque símbolos que se reconozcan instantáneamente. Opte por la claridad del diseño sobre la creatividad. ¿Qué mensaje se supone que transmite este símbolo? ¿Alguien nuevo en tu aplicación estaría familiarizado con ella? Si no es así, ¿hay otro símbolo que esté más en sintonía con lo que alguien podría esperar de ese símbolo?

Diseñar símbolos personalizados

Si necesita crear un ícono personalizado para su aplicación, la aplicación SF Symbols puede ayudarlo a comenzar. Busque un símbolo que se corresponda con el que desea representar, luego expórtelo como una plantilla personalizable basada en vectores.

Utilice una herramienta de edición de vectores como Illustrator o Sketch para realizar los cambios necesarios mientras mantiene una escala y un peso consistentes del símbolo que se cambia. Esfuércese por crear un ícono que sea simple, reconocible y que se relacione claramente con la acción o el contenido que representa. Observe cómo se nombra y se organiza el árbol de capas SVG. Los símbolos personalizados deben coincidir con la estructura del archivo original.

Cree imágenes de iconos personalizadas para su aplicación

Diseño de símbolos SF

Solos o en colaboración, los diseñadores y desarrolladores apreciarán la simplicidad y adaptabilidad de SF Symbols. Puede usar símbolos SF en aplicaciones que se ejecutan en iOS 13 y superior, watchOS 6 y superior y tvOS 13 y superior. Este otoño, podrá usar símbolos SF en macOS Big Sur.

recursos



Introducción a los símbolos SF

SF Symbols proporciona una biblioteca completa de símbolos basados ​​en vectores que puede incorporar a su aplicación para simplificar el diseño de los elementos de la interfaz de usuario alineándolos automáticamente con el texto circundante y admitiendo múltiples pesos y tamaños. Descubra lo fácil que es adaptarse a diferentes …



Símbolos SF 2

SF Symbols es una manera fácil de usar símbolos de alta calidad diseñados por Apple que se ven muy bien con San Francisco, la fuente del sistema para todas las plataformas de Apple. Aprenda a usar los símbolos SF en AppKit, UIKit y SwiftUI. Aprenda a trabajar con símbolos SF en herramientas de diseño populares y cómo usarlos en …

Más información sobre los símbolos SF

Introducción a los identificadores de tipo uniformes

Leave a Reply

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.