La perfecta imperfección del notch y todas las esquinas diseñadas por Apple

Notch

Cuando miras el notch, los iconos de iOS, el iPhone, el Apple TV... ¿Qué ves? ¿Rectángulos con las esquinas redondeadas? Estás equivocado, el equipo de diseño de Apple ni utiliza rectángulos perfectos ni hay un radio aplicado a las esquinas de sus productos y recursos de software. De hecho, en el iPhone X el notch ni siquiera es un rectángulo invertido, sino más bien un trapezoide. Y por supuesto, esto tiene una razón de ser.

Evitando la tangente desde 2013


Esta imperfección en el notch no es algo nuevo, Apple lleva aplicando su propio estilo en las esquinas de sus diseños desde hace cinco años, con la llegada de iOS 7. El equipo de diseño con Jony Ive al mando se obsesionó por conseguir que el efecto visual de la interfaz fuese mejor. La solución para conseguirlo pasaba por romper las reglas, algo que en diseño muchas veces se hace y no nos damos cuenta. Un ejemplo de ello es por ejemplo la alienación óptica, algo con lo que los diseñadores lidiamos a diario. En el siguiente ejemplo verás que en la opción donde no está alineado perfectamente el texto se ve mejor:
Artboard Copy La opción de la izquierda nos parece más alineada, pero al poner una regla realmente no lo está.

Algo así ha hecho Apple pero con las esquinas. Si te fijas verás que Apple aplica siempre la misma curvatura a todas las esquinas de lo que diseña. Por ejemplo, en el iPhone X con las esquinas redondeadas coinciden el icono, el dock, el borde de la pantalla y el borde del móvil. Manías de Apple.



Pero si normalmente un rectángulo con la esquina redondeada genera una tangente, en las de Apple esto no ocurre del todo así. Para evitar que sólo punto de la curvatura toque la recta, lo que hace Apple es una continuidad de la curvatura. La curvatura no comienza de forma brusca por la generación de un radio, sino que previamente comienza a inclinarse la recta del rectángulo para llegar al radio en sí. ¿El resultado? La sensación de que el radio no es un radio bruto, sino algo delicado y cuidado.

Nomeme

Y justamente esto se aplica también en el notch, concretamente en las dos "orejas" que tiene a los laterales. El notch no es la parte de un rectángulo invertido, sino más bien de un trapezoide invertido. Aquí tienes la diferencia:

 



De hecho, los desarrolladores al diseñar apps para el iPhone X deben tener en cuenta este detalle, porque simplemente ni la línea es recta, tiene una ligera inclinación. La forma más fácil de no equivocarse es por supuesto utilizando los recursos oficial de apple para ello.

Notch

Apple no es la única empresa en utilizar este detalle para redondear las esquinas, pero sí la única que lo aplica a rajatabla en todos sus diseños. Más trabajo, más complicación, pero el resultado final es mucho mejor. De hecho, a partir de ahora cuando veas cualquier esquina de un producto de Apple te darás cuenta de ello con tan sólo fijarte mínimamente.

Apple

Si quieres más detalles al respecto el diseñador industrial Mark Stanton tiene un artículo en Hackernoon sobre este detalle de los iconos de Apple. Por otro lado Brad Ellis, diseñador de interacción, tiene otro sobre el notch y este detalle en Tall West.

 

 



Con información de Applesfera