1. Web Design
  2. UX/UI

Cómo utilizar las bibliotecas de Sketch: colaboración fácil

En este tutorial, aprenderás todo sobre una nueva función de Sketch llamada “libraries” (bibliotecas). Las bibliotecas se introdujeron recientemente, en la versión 47, y en verdad mejoran la manera en que trabajamos con los recursos y otros miembros del equipo.
Scroll to top
2 min read

Spanish (Español) translation by Carlos (you can also view the original English article)

En este tutorial, aprenderás todo sobre una nueva función de Sketch llamada “libraries” (bibliotecas). Las bibliotecas se introdujeron recientemente, en la versión 47, y en verdad mejoran la manera en que trabajamos con los recursos y otros miembros del equipo.

Mira el screencast

Please accept preferences cookies to load this content.

Introducción a las bibliotecas de Sketch

Una biblioteca de Sketch es, en esencia, un archivo de Sketch con un grupo de símbolos. Donde las bibliotecas difieren, es que los símbolos dentro de ellas están disponibles desde la aplicación de Sketch sin necesidad de abrir el documento en el que están almacenadas. Puedes importar los activos de tu biblioteca en cualquier documento de Sketch que gustes.

Abre Sketch 47 por primera vez y verás inmediatamente que hay una biblioteca disponible para usar, en el menú Insert (Insertar) o Symbol (Símbolo). La biblioteca “iOS UI Design” tiene una gran variedad de recursos que puedes colocar directamente en tu mesa de trabajo.

Cómo crear tu propia biblioteca de Sketch

Para demostrar esto, voy a crear una biblioteca de muestras de color. Primero, creamos una página, despueś en esa página colocamos algunas muestras de color (rectángulos de los colores que queramos). Con la opción Create Symbols (Crear símbolos) nombramos cada una, empezando por color/ para poder agruparlas en el menú de símbolos.

Este documento en particular se guarda permanentemente en una ubicación conveniente y ya está actuando efectivamente como una especie de biblioteca. Pero ahora debemos añadirlo a Sketch.

Ve a Sketch > Preferences > Libraries (Sketch > Preferencias > Bibliotecas) y haz clic en Add Library (Añadir biblioteca). Luego indica el archivo que necesitamos (en este caso, nuestro archivo de color) y observa cómo está disponible en la lista de bibliotecas.

Whoomp There It IsWhoomp There It IsWhoomp There It Is
¡Whoomp! (Ahí está)

Ahora, podemos acceder a nuestros símbolos de color desde el menú Symbols, donde también vemos otras bibliotecas incluidas.

Actualización de los símbolos y las bibliotecas

Es importante señalar que en este punto del proceso, ahora aparece una advertencia en la parte inferior de nuestro archivo de colores original:

Cualquier cambio que efectuemos en los símbolos dentro de este archivo se reflejará directamente en la biblioteca y, por consiguiente, en cualquier otro archivo que haga uso de la biblioteca. Si optamos por realizar una actualización, se nos advertirá en otros archivos que hacen uso de la biblioteca (mira la parte superior derecha de la ventana):

Al hacer clic en Library Update Available (Actualización de la biblioteca disponible), se abrirá un cuadro de diálogo que mostrará exactamente qué cambios se han hecho antes que decidas usarlos.

Conclusión

Imagínate el poder que las bibliotecas podrían ofrecer tanto a tu equipo de diseño como a ti. Considera la situación anterior y los colores de tus propios diseños: altera una muestra de color en tu biblioteca principal y observa cómo surte efecto en todos tus componentes. Y esto también se aplica a todo tipo de símbolos; símbolos de tipografía, íconos, estilos... ¡genial!

Para más detalles, mira el screencast de arriba y permanece atento a más actualizaciones y trucos de Sketch.