Cómo diseñar caras de reloj

Las caras de reloj personalizadas aprovechan un lienzo dinámico y digital que puede incluir colores, animaciones y datos contextuales.

La creación de una cara de reloj para Wear OS implica visualizar la hora con claridad, tal como lo harías en una cara de reloj tradicional. Los dispositivos para Wear proporcionan capacidades avanzadas para caras de reloj que puedes aprovechar en tus diseños, como colores vibrantes, fondos dinámicos, integración de datos y animaciones. Sin embargo, también existen muchas consideraciones de diseño que se deben tener en cuenta.

Para diseñar una cara de reloj sin programación, consulta Watch Face Studio.

Para comenzar a diseñar una cara de reloj, consulta otros ejemplos de caras de reloj. Descarga la aplicación complementaria de Wear OS para explorar una gran selección de caras de reloj.

Cómo planificar la implementación de la cara de reloj

Después de completar el diseño de la cara de reloj, debes determinar el modo en que obtendrás los datos necesarios y dibujarás la cara de reloj en el dispositivo wearable. La mayoría de las implementaciones incluyen los siguientes componentes:

  • Una o más imágenes de fondo
  • Código de la aplicación que recupera los datos requeridos
  • Código de la aplicación que dibuja texto y formas sobre las imágenes de fondo

En general, las apps muestran diferentes imágenes de fondo para los modos interactivo y ambiente. Puede ser difícil crear una imagen atractiva para el modo ambiente. Por lo tanto, los fondos del modo ambiente a menudo son todos negros o grises, y no tienen imágenes.

Las imágenes de fondo para los dispositivos para Wear con una densidad de pantalla de hdpi deben tener un tamaño de 320 x 320 píxeles En dispositivos redondos, las esquinas de la imagen de fondo no se ven. En tu código, puedes detectar el tamaño de la pantalla del dispositivo y reducir la imagen de fondo si el dispositivo tiene una resolución más baja que la imagen. Para mejorar el rendimiento, adapta la imagen de fondo solo una vez y almacena el mapa de bits resultante.

Ejecuta el código de la aplicación para recuperar datos contextuales solo con la frecuencia que sea necesaria y almacena los resultados para volver a usarlos cada vez que dibujes la cara de reloj. Por ejemplo, no es necesario buscar actualizaciones meteorológicas cada un minuto.

Mantén el código de la aplicación que dibuja la cara de reloj en modo ambiente relativamente simple para aumentar la duración de la batería. Por lo general, en este modo, dibujas contornos de formas usando un conjunto limitado de colores. En el modo interactivo, puedes usar formas complejas de colores, gradientes y animaciones para dibujar la cara de reloj.

En las lecciones restantes de esta clase, se explica en detalle cómo implementar caras de reloj.

Consulta los siguientes recursos relacionados: