Advertisement
  1. Computer Skills
  2. Customization

Cómo crear una aplicación de reloj mundial

Scroll to top
Read Time: 8 min

() translation by (you can also view the original English article)

Tal es la naturaleza de mi trabajo, que me encuentro trabajando no sólo con colegas del Reino Unido, sino también con otros de Australia, Europa y los Estados Unidos. Estas múltiples zonas horarias podrían dificultar fácilmente la planificación de las llamadas de conferencia; necesito una forma de calcular un horario conveniente para que cualquier equipo se reúna en una llamada de Skype.

En este tutorial, te mostraré cómo crear un icono de Dock que te dé acceso directo a las zonas horarias que son importantes para ti, y mucho más. Aunque hay aplicaciones para la barra de menú que hacen esto, en la Mac App Store, mi método evita añadir otro icono a tu (ya abarrotada) barra de menú y no cuesta nada.


Antes de comenzar

Antes de comenzar, tendremos que asegurarnos de que tenemos lo siguiente:

  • Una conexión a Internet para acceder a time.is a través de un navegador web
  • Un icono de reloj adecuado de 512x512px, o 1024x1024px para pantallas HiDPI (retina)
  • Fluid app

¿Cómo creamos nuestra "aplicación" de reloj mundial?

Crear y personalizar nuestras zonas horarias es muy sencillo. Este es el proceso:

  1. Vamos a utilizar un sitio web llamado Time.Is donde vamos a personalizar una página web para nuestras necesidades personales.
  2. Crearemos un icono de reloj personalizado.
  3. Luego crearemos una "aplicación", para OS X, usando una pequeña herramienta llamada Fluid app.
  4. Ubicaremos nuestra nueva aplicación en el Dock.

1. Crear y personalizar nuestras zonas horarias

Esta parte del proceso es bastante sencilla, implica poco más que visitar un sitio web y adaptarlo a tus necesidades particulares.

Paso 1. Visita Time.Is

Visita el sitio web time.is, en un navegador de tu elección, y time.is se ajustará por defecto a la hora actual de tu zona horaria.

The time.is websiteThe time.is websiteThe time.is website
El sitio web de time.is

Paso 2. Elimina zonas horarias

Además de tu zona horaria actual, la hora que se muestra en letras grandes, el sitio web time.is también mostrará la hora en algunas otras zonas horarias. Si las zonas horarias sugeridas no cumplen con tus requisitos, haz clic en la que quieras eliminar para cambiar a esa hora y luego haz clic en el enlace Eliminar de las ubicaciones favoritas. Repite este proceso para todas las zonas horarias que desees eliminar.

Removing times zonesRemoving times zonesRemoving times zones
Eliminación de zonas horarias

Paso 3. Añade zonas horarias

Envato tiene su sede en Melbourne, Australia. A menudo necesito saber qué hora es, allí, por lo que esta será la primera zona horaria que tengo que añadir.

Añadir zonas horarias es muy simple. Usa el cuadro de búsqueda en la parte superior de la página web e introduce la ciudad de la que necesitas saber la hora. Mientras escribes, time.is te sugerirá ciudades y las reducirá a medida que sigas escribiendo.

Selecciona la ciudad correcta y luego haz clic en el enlace Agregar a lugares favoritos. Repite este proceso para todos los lugares que necesites saber la hora. Cada vez que añadas una ciudad a tus lugares favoritos, una pequeña caja con el lugar y la hora será añadida a tu página web.

Adding timezonesAdding timezonesAdding timezones
Adición de zonas horarias

Paso 4. Personalizar la información mostrada

Dado que estoy en el Reino Unido, la forma en que mostramos nuestras fechas y horas será diferente a la forma en que, digamos, un americano estaría familiarizado. El sitio time.is tiene por defecto un formato familiar para mis colegas americanos, pero me gustaría anglicanizarlo un poco.

Para ello, haz clic en el enlace Más >> en la parte superior de la página para revelar un menú desplegable y luego selecciona Personalizar para ver los ajustes que se pueden modificar.

Una de las primeras cosas que haré es corregir la ortografía seleccionando el inglés británico. Ahora estoy personalizando algunos elementos.

Customising the displayed informationCustomising the displayed informationCustomising the displayed information
Personalizando la información mostrada

Puedo seguir cambiando la forma en que se muestra la fecha a la más lógica DD-MM-AA. Los usuarios europeos pueden elegir el formato ISO, aún más lógico, de AA-MM-DD. Puedes elegir lo que más te convenga, o quedarte con el formato americano MM-DD-YY por defecto.

Elige si quieres conservar los botones sociales y si quieres invertir el color a blanco sobre negro. Cuando estés satisfecho con las personalizaciones, haz clic con el botón derecho del ratón en el enlace que dice Haz clic con el botón derecho del ratón en este enlace y cópialo en tu portapapeles (CMD C). Tal vez quieras pegar tu enlace personalizado en un documento de texto para conservarlo. Dicho esto, siempre y cuando permita las cookies del navegador (que es el comportamiento por defecto de todos los principales navegadores web) entonces tu configuración se almacenará para la próxima vez que visites la página web time.is.

Saving your customisationsSaving your customisationsSaving your customisations
Guardando las personalizaciones

2. Crea un icono de reloj personalizado

No es obligatorio que realices esta etapa, pero si tu intención es poner un ícono en el dock, tal vez quieras que también encaje estéticamente.

Para crear mi icono, hice una captura de pantalla del icono de reloj suizo de Mondaine en la aplicación Reloj del iPad. Luego transferí esta captura de pantalla a mi Mac.

Al abrir la captura de pantalla en Pixelmator (puedes usar otra aplicación de edición de gráficos), recorté la captura de pantalla convirtiéndola en una imagen adecuada para un icono. Para el uso en OS X, tu icono deberá ser de 512x512 píxeles, o de 1024x1024 píxeles para una pantalla de retina.

Exporta tu imagen final como un archivo .png (Portable Network Graphic), asegurándote de que tenga un fondo transparente. Anota la ubicación a la que has exportado el icono recién creado.

Using Pixelmator to create the app iconUsing Pixelmator to create the app iconUsing Pixelmator to create the app icon
Usando Pixelmator para crear el icono de la aplicación

Dato: Si no tienes el tiempo, o la inclinación, para crear tu propio icono de reloj personalizado, siéntete libre de usar el Reloj Mondaine que he creado para este tutorial.


3. Crea una "App" con Fluid App

A continuación, vamos a juntar nuestra página web personalizada y nuestro icono personalizado en una "aplicación" que crearemos usando una aplicación práctica llamada Fluid, de Celestial Teapot Software.

Fluid nos permite crear una aplicación para Mac convirtiendo nuestra página web en una aplicación de escritorio para OS X.

Paso 1. Crea tu aplicación personalizada

Descarga y abre la aplicación Fluid. Localiza el URL personalizado que guardaste del paso 4 en la personalización del sitio web de time.is.

Introduce tu URL personalizada y un nombre adecuado para tu aplicación.

Entering the criteria to create an appEntering the criteria to create an appEntering the criteria to create an app
Introduciendo los datos para crear una aplicación

Paso 2. Adjunta tu icono personalizado

Para crear tu aplicación con tu icono personalizado, selecciona Otro en el campo Icono y busca la ubicación en la que guardaste tu icono personalizado.

Creating the appCreating the appCreating the app
Creación de la aplicación

Paso 3. Crea tu aplicación

Cuando hayas introducido la información requerida, haz clic en el botón Crear y luego en Ejecutar ahora.

The Word Time app in the DockThe Word Time app in the DockThe Word Time app in the Dock
La aplicación de reloj mundial en el Dock

Tu aplicación será creada, colocada en la carpeta de Aplicaciones. Se creará un icono en el Dock y se abrirá la aplicación.

Puedes arrastrar el icono de la aplicación a donde quieras que esté ubicado en el Dock. Incluso puedes arrastrarlo fuera del Dock si prefieres que no esté allí. Si quieres mantener tu aplicación de tiempo en el Dock, haz clic con el botón derecho del ratón y comprueba que está anclada en el Dock (este debería ser el comportamiento por defecto).

Keeping the app in the DockKeeping the app in the DockKeeping the app in the Dock
Manteniendo la aplicación en el Dock

Uso de tu aplicación personalizada

Ahora tienes acceso a tu aplicación de tiempo personalizada. Es una aplicación que te da las horas actuales en diferentes zonas horarias de interés. Saber si está bien que llames por Skype a tus colegas en Melbourne, Mammoth Lakes o Manchester está ahora a un solo clic.

Si eliges o no ubicar tu aplicación de tiempo en el Dock, depende de ti. De cualquier manera, recuerda que puedes abrirla muy rápidamente si usas Spotlight o Alfred. Usa los atajos de teclas, como la barra espaciadora + CMD o la barra espaciadora + opción, respectivamente, para ejecutar estas aplicaciones. Una gran solución para la gente que encuentra el teclado más productivo.

The end result. (Note, you can continue to customise your "app" in the same way as described in section 1, step 4The end result. (Note, you can continue to customise your "app" in the same way as described in section 1, step 4The end result. (Note, you can continue to customise your "app" in the same way as described in section 1, step 4
El resultado final. (Nota: puedes seguir personalizando tu "aplicación" como se describe en la sección 1, paso 4)

¡Todo listo!

Sí, hay aplicaciones que hacen algo similar al añadir acceso a las zonas horarias globales en la barra de menú, pero normalmente cuestan dinero y ¿dónde está la diversión en eso? Fluid app es mucho más flexible, así que por qué no configurar tus zonas horarias globales, y además apoyar Fluid app comprando una licencia, si te conviene.

En este tutorial, he mostrado cómo personalizar una aplicación web y crear una "aplicación" dentro de OS X, usando una herramienta llamada Fluid, para dar acceso rápido y fácil a la información de las zonas horarias desde el Dock. Mi método permite que tu barra de menú no tenga iconos adicionales y ni siquiera es necesario que coloques la aplicación en el Dock. Puedes usar tu programa de inicio rápido favorito para acceder a las zonas horarias mundiales cuando necesites saber qué hora es en otro lugar.

Déjanos saber, en los comentarios de abajo, cómo configuraste tus zonas horarias, o si tienes algún otro consejo o truco.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Computer Skills tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.