Diseñar un icono del elemento web de SharePoint

Los iconos del elemento web están diseñados para ser simples, representativos y simbólicos. Cada icono se reduce a un estilo minimalista que representa los atributos más importantes. Los iconos se mostrarán en el cuadro de herramientas en las páginas de SharePoint y, opcionalmente, en la tienda. Algunos ejemplos de formas de icono son cuadradas, circulares, verticales y horizontales.

Formas de línea clave de cuadrícula

Los iconos del elementos web se muestran a 32 x 32 px pero están diseñados al doble del tamaño o 64 x 64 px. Crear iconos al 100 % para asegurarse de que los píxeles sean correctos.

Diseño

Diseñe iconos dentro del área de contenedor de 64 x 64 px. Así se asegura de que el icono se muestre correctamente.

Formas

No todos los iconos o logotipos están diseñados en un cuadrado perfecto. Use esta guía de formas básicas para comprender cómo unificar formas de iconos diferentes dentro de la cuadrícula y mostrarlas en un tamaño proporcional. Asegúrese de que el icono rellena el ancho o alto completo de la cuadrícula, según la forma.

Claridad de píxel

Intente evitar distorsiones de icono ajustando los bordes en las coordenadas X e Y. Use los números enteros siempre que sea posible.

Colores y fondos

El icono es la expresión visual del elemento web y su función. Los iconos sirven para comunicar la idea principal del elemento web de modo simple y claro.

Los iconos del elemento web pueden contener un color o ser a todo color. La mayoría de iconos funcionan mejor cuando se utilizan formas simplificadas, con líneas de dos píxeles de ancho, similares a los iconos de Office UI Fabric. En algunos casos, es posible que deba usar un icono de marca de empresa o un logotipo a todo color. Si está disponible una versión de un único color del icono, puede usar esta versión.

Exportar los iconos

Exportar iconos como SVG de 64 x 64 px con fondos transparentes.

Puede encontrar la cuadrícula de icono en el Kit de herramientas de diseño de SharePoint.