Categories

Tipografía — Experiencia de lectura y uso

Diseñar pensando en el desarrollador como un usuario.

Equipo de diseño versus equipo de desarrollo. Son muchas las instancias de conflicto y desencuentro entre estos dos grupos. En la diaria, en el conflicto cotidiano de trabajo, se genera una interacción constante no siempre prospera. Pero encontrar un punto de conexión entre ambos, eso sí es un desafío.

Al pensar en los entornos de trabajo de los equipos de desarrollo y en el ámbito de la programación surge el nombre de Visual Studio Code, o más conocido como VS Code. Un software de edición de código fuente lanzado por Microsoft en 2015, luego de haber presentado más de 25 años antes la primera versión de Microsoft Visual Studio. Esta nueva plataforma propone una navegación simplificada, con algunas herramientas limitadas, pero sin dejar de ser completamente funcional para quienes requieran de este tipo de editores. Al breve tiempo se convirtió en uno de los programas más utilizados por desarrolladores, y ubicándose también entre uno de los elegidos para los espacios educativos, por su simpleza y facilidad de uso.

Otro de los aspectos que lo vuelve uno de los más elegidos es el hecho de ser un software de código abierto. Es decir, que permite su personalización y el agregado de funcionalidades a partir de la modificación de su código. Aunque esta funcionalidad es propia de cada desarrollador, y simplemente editará las funcionalidades del software en su dispositivo, se ofrece la posibilidad de compartir esas alteraciones para que el resto de personas usuarias de la comunidad puedan apropiárselas. Sumado a una gran variedad de herramientas dentro del programa para personalizar las funcionalidades y la interfaz del programa: disposición de los elementos, integraciones, tipografías utilizadas, tamaños, lenguajes de programación, etc.

Analizando esto desde una mirada de diseño, se vuelve un desafío el pensar y diseñar una plataforma que permita tal grado de personalización y alteración, buscando una consistencia del sistema identitario y funcional, y sin dejar de lado que toda esta personalización no afecte negativamente a la navegación y a la experiencia de personas usuarias.

Investigando sobre la historia de Visual Studio Code, e indagando sobre el diseño del programa, haciendo hincapié sobre la tipografía nos encontramos con familias tipográficas que cumplen un rol crucial en una interfaz como la de VSCode que se compone en su gran mayoría por texto. Por un lado, con el uso de Segoe UI una tipografía sans serif de clasificación humanística, con trazo constante y cortes rectos en sus extremos. Ideada por Monotype, y registrada posteriormente por Microsoft, es la tipografía elegida para todo el sistema marcario de Microsoft (incluyendo su logotipo). Generando una fuerte consistencia con el resto de programas de la empresa. Y por otro lado Cascadia Code, una familia tipográfica serif monoespaciada de trazo constante, pensada específicamente para el uso en código, con ligaduras de programación. Es decir, desde su inicio, la funcionalidad de esta tipografía estuvo orientada a la lectura de largos códigos de texto, buscando siempre simplificar el entendimiento de estos textos de código fuente. Una particularidad no menor, es que al igual que VS Code, Cascadia es una tipografía de código abierto, es decir que de forma similar a lo que sucede con el software, permite su personalización y edición, con desafíos parecidos a los que se le presentan al programa.

Caracteres y ligaduras propios de la familia tipográfica Cascadia Code.

Dos familias con distintos usos dentro de la interfaz, permitiendo entender qué parte de lo que se ve está dedicado al código fuente, su trabajo y edición, delimitada por la Cascadia Code. Y la porción de la pantalla, que bajo el uso de la Segoe UI, ofrece las diversas funcionalidades propias de Visual Studio Code.

Resulta interesante pensar en cómo diseñadores y diseñadoras pensaron e idearon interfaces y tipografías, para que luego desarrolladores y desarrolladoras puedan agilizar y simplificar su tarea diaria. Desde el diseño de pantallas personalizables en su totalidad, la creación de tipografías que agilicen la lectura de código, la codificación de color de estos códigos (buscando diferenciar entre las diferentes funcionalidades de cada parte del código), hasta la aparición de ciertos elementos no-tipográficos o miscelaneas como cuadrados de color o íconos que también sirvan de ayuda para la lectura.

Porción de la pantalla de Visual Studio Code que permite evidenciar la combinación de las distintas tipografías y elementos no-tipográficos.

El anterior enfrentamiento resulta ínfimo, comparado con todo el trabajo de diseñadores y diseñadoras pensando en la función final de sus interfaces y tipografías, y conociendo a fondo a las futuras personas usuarias. Ese es el real desafío del diseño de interfaces.

Fuentes: