Apple Aqua: Explorando la interfaz de usuario obsoleta de macOS X | Nick Babich | agosto 2022

Apple presentó Aqua, su interfaz de usuario de última generación para MacOS X, en la Macworld Expo de San Francisco en 2000. Apple describió Aqua como el futuro de Macintosh, y fue una de las actualizaciones de diseño más fundamentales jamás realizadas por Apple.

MacOS X 10.0 Cheetah con Apple Aqua. Tamaño de imagen 512 píxeles

Aunque la apariencia de Aqua ha cambiado a menudo a lo largo de los años, los principios de diseño de GUI subyacentes definidos por Aqua se mantuvieron igual hasta 2020, cuando se lanzó macOS Big Sur.

En este artículo, quiero centrarme en el lenguaje visual de Apple Aqua y por qué este lenguaje tiene un impacto tan grande en otros productos lanzados por Apple.

Contenido del Articulo

Una breve historia del sistema operativo Apple Macintosh

Apple lanzó el sistema operativo Macintosh en 1984. El sistema operativo Macintosh sentó las bases para el diseño de interfaz gráfica de usuario para toda la industria. Si observa de cerca el sistema operativo Macintosh, notará que tiene muchos de los atributos de una interfaz gráfica de usuario moderna: el concepto de ventana, el ícono de la aplicación y el estado del sistema.

Interfaz de usuario original de Apple Macintosh OS (1984)

Después de un gran éxito en los 80, Apple comenzó a tener problemas a principios de los 90. La segunda mitad de la década de 1990 fue una época oscura para Apple. Microsoft dominó la industria de las computadoras personales, mientras que Apple sufrió pérdidas anuales significativas. Apple ha realizado varios intentos de crear un sucesor moderno del clásico sistema operativo Mac, pero todos han fracasado. Apple compró NeXT en 1997.

Antes del lanzamiento de Aqua, Apple usaba una interfaz de usuario llamada Platinum, un legado de NeXT. Si bien Platinum tenía más énfasis en el color que las versiones anteriores, aún representaba una integración gradual de muchas de las tecnologías desarrolladas entre 1988 y 1996.

Captura de pantalla de Mac OS 8.1 en la plataforma Apple Platinum

La nueva era dictaba un nuevo enfoque, y Apple quería crear un sucesor moderno del clásico sistema operativo Mac. Apple presentó la próxima versión de la interfaz gráfica de usuario llamada Aqua en 2000. Aqua fue mucho más que un simple cambio cosmético. En comparación con el sistema operativo anterior lanzado por Apple, la interfaz de Aqua se siente familiar y muy nueva.

Apple llamó a esta interfaz de usuario “Aqua” porque originalmente se basó en el tema del agua. Steve Jobs bromeó sobre esto en su introducción. “… es líquido, uno de los objetivos del diseño era que cuando lo veas, quieras lamerlo”‘

Según el equipo de diseño de Apple, el objetivo de Aqua era:

“Convierta el color, la profundidad, la translucidez y las texturas complejas en una interfaz visualmente atractiva” en las aplicaciones de macOS.

Esta es la razón por la que Aqua hace un amplio uso de los efectos de reflexión y translucidez. Otra característica notable del lenguaje visual de Aqua es que complementa visualmente el diseño del iMac a color lanzado a finales de los 90.

Computadoras Apple iMac en diferentes colores. finales de los 90

Sumerjámonos en el lenguaje visual que se le ocurrió a Aqua:

Colores

Gris, blanco y azul fueron los colores clave que definieron el estilo de Aqua. Todos los elementos funcionales y decorativos (barras de herramientas, fondos, elementos funcionales como botones y menús) se realizaron en cualquiera de estos colores.

Si observa de cerca la barra de herramientas, notará que a menudo son de color gris o metálico. Esto se hace a propósito. Este diseño parece menos ocupado para el ojo humano y también puede guiar visualmente el ojo del usuario hacia elementos funcionales (elementos de menú).

Barra de herramientas en versiones anteriores de MacOS X.

Diseño de controles y menús funcionales

Es mucho más fácil entender un lenguaje visual si se descompone en sus elementos más pequeños. Y cuando se trata de OS, el elemento más pequeño posible es el control funcional.

Aqua presenta elementos de interfaz más planos, como nuevos botones y menús desplegables. Mira ese enfoque suave en los botones.

Diseño de botones en color Aqua.

El estilo visual de los botones Aqua se usará más tarde en las primeras versiones de Apple iOS (por supuesto, con algunas modificaciones visuales).

Cuadro de diálogo del sistema en Apple iOS

Aqua ha aportado un aspecto radicalmente nuevo a todos los elementos familiares de la interfaz (barras de desplazamiento, ventanas, menús).

Menú desplegable en Apple MacOX Public Preview. Tamaño de imagen 512 píxeles
Barra de progreso en Apple MacOX Public Preview. Tamaño de imagen 512 píxeles
Barra de desplazamiento en Apple MacOX Public Preview. Tamaño de imagen 512 píxeles
Control deslizante en la vista previa pública de Apple MacOX. Tamaño de imagen 512 píxeles

Aquí hay algunas cosas notables sobre el estilo de los elementos de la interfaz de usuario:

Oscuridad. Puede notar que la mayoría de los elementos de la interfaz de usuario proyectan sombras. Las sombras se utilizan tanto en los controles funcionales como en las ventanas. Las ventanas Aqua casi no tienen marco ni borde exterior; en cambio, las sombras se utilizan para separar y distinguir las ventanas activas de las inactivas. Las sombras sutiles crean una sensación de volumen.

Las sombras transmiten una sensación de profundidad y dimensión en una interfaz de usuario; Los elementos de la interfaz de usuario parecen objetos 3D.

Transparencia. El efecto de transparencia se utilizó para centrar la atención del usuario en un objeto en particular. Por ejemplo, cuando la ventana ya no está enfocada, los botones de control de la ventana se vuelven transparentes.

Las propiedades gráficas de un elemento de la interfaz de usuario se utilizaron para transmitir su estado actual.

Iconos de sistema altamente detallados

En comparación con el estilo visual Platinum, los íconos del sistema Aqua eran más grandes y detallados. El estilo visual de los íconos era una interfaz de usuario visualmente más atractiva. Un aspecto de icono skeuomorphic similar se usa más tarde en la primera versión del sistema Apple iOS.

Skeuomorphism es un concepto de diseño que estiliza los objetos digitales para parecerse a sus contrapartes del mundo real.

Con MacOS X, Apple ha llevado los íconos a un nuevo nivel de fidelidad. Iconos en MacOS X 10.0 Cheetah. Tamaño de imagen 512 píxeles

Doc

La década de 2000 fue la era de la multitarea. Los usuarios cambiaban constantemente entre diferentes aplicaciones mientras trabajaban en una computadora, y Apple quería que el proceso de cambio fuera lo más fluido posible. Para que esto suceda, Apple presentó el Dock, donde se encuentran todas las aplicaciones populares y más recientes.

Apple Dock en MacOS X. Imagen de 512 px

Junto con el Dock, Apple agregó una barra de título con tres botones a la izquierda: rojo para cerrar la ventana, amarillo para minimizar y verde para maximizar. En las primeras versiones de Aqua, estos botones estaban ubicados visualmente en la parte superior:

Primeras versiones de Apple Aqua (Apple Mac OS 10.1)

pero luego apareció “hundido” en la ventana:

Apple MacOS 10.7 León

Uso de la proximidad en el diseño de GUI

El principio de proximidad establece que es más probable que los objetos que están cerca entre sí se perciban como parte del mismo grupo.

Apple usó el principio de proximidad en el diseño de MacOS X. Comprender la relación entre las ventanas principales y secundarias fue uno de los problemas más molestos de muchos sistemas operativos GUI a principios de la década de 2000. El usuario debe recordar qué diálogo pertenece a qué ventana.

En Windows 98, un cuadro de diálogo modal no está visualmente relacionado con la ventana que lo muestra.

Apple ha utilizado la distancia como una propiedad de relación. Por ejemplo, el panel Guardar se ha vinculado visualmente a la ventana principal para que el usuario pueda entender fácilmente a qué ventana pertenece el panel Guardar.

El cuadro de diálogo Guardar está vinculado visualmente a la ventana principal. OSXImagen diaria

Fuerte lenguaje de movimiento.

Aqua no solo se veía hermosa, sino que en general era impresionante en acción. Apple ha prestado mucha atención a la dinámica, no solo a cómo los objetos de la interfaz de usuario se ven estáticos, sino también a cómo funcionan cuando el usuario interactúa con ellos. El objetivo era ayudar a las personas que acaban de empezar a usar una computadora para que puedan entender cómo funcionan las cosas mucho más rápido.

Una de las cosas notables es la transición visual cuando la ventana está minimizada, lo que le da al usuario una pista de dónde irá la ventana en el Dock. Cuando se minimizan, las ventanas son “absorbidas” en el Dock usando un “efecto de genio”. Esto dirigió la mirada del usuario hacia donde había ido el objeto e hizo que los cambios de estado fueran más evidentes.

Efecto Genio de MacOS X. Esta transición visual muestra exactamente a dónde pasa la ventana en el Dock. Imagen de Reddit.

El muelle en sí puede cambiar de tamaño dependiendo de cuántos objetos haya en él. Por ejemplo, los íconos en el Dock pueden encogerse si coloca muchos objetos en él. También tiene ampliación, que le permite aumentar el tamaño de un objeto en el Dock al pasar el mouse por encima.

Los iconos del Dock pueden aumentar de tamaño a medida que el cursor se acerca a ellos.

En el nivel micro, Apple introdujo microanimaciones sutiles para controles funcionales. Por ejemplo, el sistema operativo atenúa el botón clave de llamada a la acción para dar al usuario una pista de que se hará clic en este botón si el usuario presiona la tecla Intro.

Atenuación del botón “Aceptar” en el cuadro de diálogo del sistema MacOS X

Aqua no era el estilo visual ideal. MacOS X basado en Aqua exigía mucho hardware (era un recurso enorme, especialmente RAM) y en algunos contextos era insoportablemente lento. A pesar de esto, Aqua fue un gran paso adelante tanto para Apple como para la industria informática. Incluso hoy, el legado de Aqua se puede encontrar en las últimas versiones de macOS. Dos décadas después, el muelle sigue funcionando exactamente de la misma manera. Claro, se ve mucho mejor que su predecesor, pero funcionalmente es lo mismo.

Publicado originalmente en babich.biz

Previous post ¿Ciertas estrategias de SEO garantizan altas clasificaciones?
Next post ¿Cuándo debería utilizar los cursos de formación de SEO en Londres?

Deja una respuesta