← Volver ao Blog

Chegou o Modo Escuro

Gorka Mendez
Gorka Mendez 8 min de lectura
features

É a función máis solicitada que tivemos en meses, e por fin chegou. BlaBlaNote ten agora un modo escuro de verdade. Non é unha versión ‘cambiamos un par de fondos’ a medias, senón un tema escuro real, de principio a fin, que abrangue cada recuncho da aplicación: a túa lista de contactos, os detalles das interaccións, o modo evento, a sincronización con LinkedIn, as integracións de calendario, a cadencia de networking, a configuración do perfil, cada estado baleiro, cada modal, cada distintivo.

Se algunha vez te pillaches entrecerrando os ollos en BlaBlaNote ás 23:00 despois dun longo día de reunións, ou gravando unha nota de voz desde a cama e sendo cegado por unha pantalla branca, isto é para ti.

Tres modos, unha decisión

Abre a configuración do teu perfil e atoparás unha nova sección ‘Esquema de cores’ con tres opcións:

  • Automático segue o teu sistema operativo. Se o teu Mac, Windows, iPhone ou Android está configurado en escuro, BlaBlaNote é escuro. Cando o teu SO cambia ao pór do sol, BlaBlaNote cambia con el. Sen refrescar, sen a fricción de ‘recargar a páxina para aplicar os cambios’. Simplemente acontece.
  • Claro é o BlaBlaNote clásico que xa coñeces. Sempre brillante, sempre igual.
  • Escuro permanece escuro, faga o que faga o resto do teu dispositivo. Se vives co modo escuro en todas partes, esta será probablemente a túa elección.

Cada opción ten unha pequena previsualización visual para que poidas ver o que estás elixindo antes de confirmalo. A previsualización mantense constante independentemente do tema actual, así que estás comparando cousas equiparables.

Selector de esquema de cores do modo escuro de BlaBlaNote con opcións Automático, Claro e Escuro

Non só invertemos as cores

Calquera deseñador dirache que o modo escuro non é ‘o modo claro cun fondo negro’. Cando invirtes as cores de forma inxenua, acabas con texto embarrado, estados desactivados ilegibles, bordos que se desvanecen no fondo e gráficos que parecen unha escena dun crime. Todos usamos aplicacións que o fixeron mal.

Así que construímos a paleta escura desde cero. Os fondos usan un enfoque por capas: un negro profundo case negro para a páxina, un ton lixeiramente máis claro para as tarxetas e paneis, e un terceiro nivel para os elementos ao pasar o rato ou seleccionados. Esa separación é o que fai que a interface de usuario se sinta sólida en lugar de que todo flote nunha folla plana.

Auditamos cada cor de texto segundo os requisitos de contraste WCAG AA. Iso significa que o gris que se le como ‘información secundaria’ no modo claro ten a súa contraparte dedicada no modo escuro, elixido para que siga sendo cómodamente lexible sen ser agresivo. O mesmo ocorre cos botóns desactivados, o texto do marcador de posición, os bordos, os aneis de foco e os estados de paso do rato. Dedicamos máis tempo aos casos límite que ás superficies principais, porque aí é onde o modo escuro adoita fallar.

Os detalles polos que nos obsesionamos

Algunhas cousas ás que prestamos especial atención:

  • Sen flash ao cargar. Cando abres BlaBlaNote e estás en modo escuro, non verás un cuarto de segundo de branco cegador antes de que o tema se active. O tema aplícase antes da primeira representación, polo que a aplicación arranca coas cores correctas inmediatamente.
  • As túas pantallas de LinkedIn, Calendario e integracións. Estas son algunhas das partes da aplicación máis densas visualmente, con moitas tarxetas, avatares, distintivos de estado e botóns. Cada unha delas recibiu un tratamento de modo escuro, incluíndo as complicadas tarxetas de integración que necesitaban manter alturas coincidentes lado a lado.
  • Cadencia de networking e seguimentos. Os botóns de radio, as opcións desactivadas e os banners de ‘próximo contacto pendente’ foron reconstruídos para seguir sendo lexibles no modo escuro. Se usas BlaBlaNote para xestionar o teu ritmo de networking, notarás a diferenza desde o primeiro día.
  • Modo evento e información previa ao evento. Gravando nunha conferencia pola noite? As tarxetas de estatísticas, os estados baleiros e os avatares dos convidados adáptanse, para que o networking intelixente de eventos siga sendo lexible cando as luces baixan.
  • Cores da marca das relacións. O noso acento azul e dourado da marca ten variantes de modo escuro para que sigan sendo vibrantes sen brillar radioactivamente contra un fondo negro.
  • Resumos de IA e tarxetas de tarefas. Os paneis onde BlaBlaNote mostra as túas conversas organizadas e elementos de acción extraídos recibiron o mesmo tratamento de contraste coidadoso, porque son onde realmente les, non só botas unha ollada.

Detalle de contacto de BlaBlaNote en modo escuro con relacións, etiquetas e datas importantes

Fácil de acceder desde calquera lugar

A configuración está ben, pero ás veces queres cambiar o tema sen ter que navegar por tres menús. No escritorio, hai un botón de ‘Tema’ dedicado na parte inferior da barra lateral. Un clic e ábrese o selector, xa mostrando en que modo te atopas. No móbil, onde a barra lateral se contrae, o mesmo selector de tema está no menú de usuario. De calquera xeito, nunca estarás a máis dun ou dous toques.

Non importa onde o abras, terás as mesmas tres opcións, elixes unha, e toda a aplicación cambia ao instante. Sen refrescar, sen botón de ‘aplicar’, sen esperas.

Lista de interaccións de BlaBlaNote en modo escuro con tarxetas de conversa e etiquetas

Por que ‘Automático’ é probablemente o que queres

Se non estás seguro de que modo elixir, opta por Automático. Aquí tes por que.

A maioría dos sistemas operativos modernos xa fan un gran traballo cambiando os temas en momentos oportunos: ao pór do sol, cando activas unha programación de modo nocturno, cando estás nun ambiente escuro. O teu SO sabe moito sobre o teu contexto actual que BlaBlaNote non. Ao seguir o sistema, BlaBlaNote vólvese consistente con calquera outra aplicación que uses. Non máis momentos de ‘por que esta aplicación segue sendo branca brillante’ cando cambias do teu correo electrónico ao teu CRM pola noite.

O modo Automático escoita o sistema continuamente. Se estás no medio dunha reunión e o sol se pon e o teu portátil cambia a escuro, BlaBlaNote tamén cambia, sen ningunha intervención túa. Se tes un horario fixo e preferires o control total, elixe Claro ou Escuro explicitamente. Ambos son válidos. Non hai unha resposta incorrecta.

Lémbrate de ti

A túa elección gárdase localmente en cada dispositivo. Iso significa que podes ter BlaBlaNote no teu portátil en modo Automático (para que siga a túa xornada laboral), no teu teléfono en Escuro (porque o usas principalmente pola noite), e na túa tableta en Claro (porque les artigos nela durante o día). Cada dispositivo mantén a súa propia preferencia.

Non sincronizamos isto entre dispositivos a propósito. O modo escuro é unha decisión local e dependente do contexto. A iluminación da túa oficina non é a iluminación do teu dormitorio, e a aplicación que se ve ben nun monitor externo grande non é a aplicación que se ve ben nun teléfono pola noite. As preferencias por dispositivo son a resposta honesta.

Que segue

O modo escuro foi un gran proxecto. Afectou practicamente a todos os compoñentes de Vue na aplicación, e aproveitamos para limpar moitas inconsistencias de cor que acumularamos co tempo. A aplicación séntese máis coherente agora, en ambos os temas, como un efecto secundario.

Algunhas cousas que estamos considerando para a próxima iteración:

  • Temas programados, onde poderías dicir ‘escuro despois das 20:00’ independentemente da configuración do teu SO, para persoas cuxo sistema operativo non lles ofrece un control detallado.
  • Tematización nativa da barra de estado en móbil, para que a barra de estado superior en iOS e Android tamén se adapte. Agora mesmo a UI da aplicación cambia pero a barra do sistema permanece no que dite o teu SO. Non está mal, pero está a un pulido de ser perfecto.
  • Algunhas opcións máis de cores de acento para usuarios que queiran personalizar máis, unha especie de ‘BlaBlaNote pero coas túas cores’.

Nada diso está no calendario aínda. Queríamos lanzar o modo escuro primeiro, usalo nós mesmos durante unhas semanas e despois ver que merece a pena construír a continuación en función dos teus comentarios.

Próbao esta noite

Se xa es usuario de BlaBlaNote, abre o teu perfil, busca a sección ‘Esquema de cores’ e elixe o teu modo. Trinta segundos, cero risco, alivio instantáneo para os teus ollos. Se queres comezar con Automático, o teu SO fará o resto do traballo por ti.

Se aínda non es usuario e estiveches aguantando porque BlaBlaNote era ‘demasiado brillante’, esa escusa está oficialmente retirada. Inicia a túa proba gratuíta, elixe Escuro ao entrar, e prepárate para a túa próxima reunión sen derreter as túas retinas.

Esperamos que che encante. E se algo non se ve ben nun recuncho da aplicación que non detectamos, dinos. O modo escuro é unha desas funcións onde o último cinco por cento é invisible ata que alguén usa a aplicación de verdade e atopa o caso límite que se nos escapou. Preferimos arranxalo que finxir que é perfecto.

Feliz toma de notas nocturna.

Gorka

Gorka Mendez

Gorka Mendez

Co-founder
30 dias gratis

Transforma as tuas conversas

Profesionais que capturan, organizan e actuan sobre as suas conversas con intelixencia artificial.

30 dias gratis
Sen tarxeta de crédito
Cancela cando queiras