Diseño de notificaciones para aplicaciones
Explore diferentes modelos de notificación y cuándo usar qué

Gente de Medium, hola de nuevo. Continuando con la serie de desglose de funciones, aquí está el desglose de la 5ta característica: modelos de notificación para aplicaciones. Ahora las notificaciones pueden ser una característica compleja con la que lidiar. Este artículo no cubre todos los detalles al respecto, pero espero que sea suficiente para proporcionarle cierta claridad y una dirección para elegir el modelo de notificación correcto para su aplicación.
Antes de comenzar a analizar los modelos de notificación, hagamos un resumen rápido de las notificaciones y en qué consisten. Las notificaciones son piezas de información que se originan en una aplicación dirigida al usuario. Aquí hay algunos componentes importantes de una notificación.

Fuente: esta es la parte de la aplicación desde la cual se origina la notificación. La arquitectura de una aplicación puede tener varios sectores en los que se categoriza la información, y estos segmentos serían las fuentes de las notificaciones.
Información: este es el mensaje que debe transmitirse al usuario por medio de una notificación. Algunos ejemplos son “Daenerys Targaryen le envió una solicitud de amistad” o “Lord Varys comenzó a seguirlo”.
Tipo: las notificaciones pueden ser principalmente de dos tipos: informativas y procesables . Ambos tipos pueden tener subtipos adicionales según el contexto de la aplicación.
Credencial de notificación: estos son indicadores visuales que dirigen al usuario a la notificación. Los indicadores de notificación pueden ser tan simples como un punto, o también pueden contar con él, lo que mostraría el número de notificaciones no leídas.
Anchor: Anchor es el componente visual de la aplicación donde las notificaciones aparecen en la interfaz. En pocas palabras, este es el componente sobre el cual el usuario verá el indicador / insignia de notificación. Tenga en cuenta que los anclajes no son necesariamente fuentes de notificaciones, sino solo el componente donde emerge la notificación. Un ancla podría albergar notificaciones de múltiples fuentes o solo una. Piénselo de esta manera, las fuentes están más en el nivel arquitectónico / informativo, pero las anclas son el componente visual donde se ven las insignias de notificación.
Las notificaciones son uno de los medios a través del cual una aplicación se comunica con el usuario y posiblemente los devuelve a la aplicación. Por lo tanto, son una parte realmente importante de la aplicación. Permítanme presentarles algunos de los modelos de notificación más populares que existen y también cuando tiene sentido usar uno sobre el otro.
1. Centro de notificaciones
En este modelo, hay un lugar definido donde aterrizan todas tus notificaciones. El centro de notificaciones podría ser una pantalla dedicada o un menú flotante dependiendo de la propiedad inmobiliaria disponible. En este modelo, todas las notificaciones están ancladas al centro de notificaciones independientemente de su origen. Desde el centro de notificaciones, puede navegar hasta la fuente de la notificación. Medium usa este modelo para notificaciones. Aparece una insignia en el ícono de la campana, que es el punto de entrada a todas sus notificaciones. También es importante que las notificaciones leídas y no leídas difieran visualmente para permitir que el usuario diferencie entre ellas.

La mayor ventaja de este modelo es su flexibilidad. Es un lugar que puede acomodar cada notificación, ya sea de una fuente existente o algo nuevo.
Lineamientos
- Todos los diferentes tipos de notificaciones deben considerarse y deben seguir el mismo esquema de diseño. Al diseñar el esquema, es importante considerar la escalabilidad como nuestro objetivo principal.
- Si tiene demasiadas fuentes de notificaciones, existe la posibilidad de que este modelo empiece a parecer un poco desordenado cuando hay demasiadas notificaciones. Si hay tipos similares de notificaciones, puede agruparlas, lo que ayudaría a reducir la repetición. Por ejemplo, “Sansa Stark y otras 3 personas le enviaron una solicitud de amistad”.
- Asegúrese de que el centro de notificaciones sea fácilmente detectable y accesible.
Use el centro de notificaciones cuando
- Su producto necesita notificaciones que no pueden anclarse a ninguna de las opciones de navegación existentes. Podría ser porque la notificación no es coherente con los objetos existentes en el producto, o la notificación no proviene de ninguna de las fuentes definidas en la arquitectura de la información.
- Hay más fuentes posibles de notificación de las que la aplicación puede acomodar en la pantalla de aterrizaje.
- Cuando tienes poco tiempo. Puede haber casos en los que necesite enviar una característica antes de tener tiempo para pensar en todos los escenarios posibles para las notificaciones y encontrar los anclajes para cada uno. En tal caso, el centro de notificaciones podría ser la salida más fácil, ya que es muy flexible en su naturaleza.
2. Notificaciones ancladas de origen
En este modelo, cada notificación está anclada a una opción de navegación que probablemente también sea la fuente de la notificación. No hay un hub / centro único para todas sus notificaciones. Eche un vistazo a WhatApp para obtener una mejor idea. En ambas plataformas (Android e iOS), las notificaciones de chats o llamadas están ancladas a los respectivos menús de navegación. Las ventajas de este modelo son que conduce a una mayor capacidad de detección de contenido. El usuario ahora puede alcanzar directamente la información transmitida por la notificación, sin el problema de una capa intermedia adicional. Pero este modelo no es tan flexible ni escalable como el centro de notificaciones.

Este modelo depende en gran medida de la arquitectura de la información de la aplicación. La navegación debe ser capaz de acomodar todos los diferentes tipos de notificaciones. Al igual que el modelo anterior, aquí también es importante que las notificaciones leídas y no leídas difieran visualmente.
Lineamientos
- Asegúrese de que cada notificación se pueda anclar a una de las opciones de navegación en la pantalla de aterrizaje. A medida que aumenta la complejidad de su aplicación, las fuentes de las notificaciones también pueden crecer en número. En este caso, puede optar por un centro de notificaciones o puede considerar un modelo mixto (es decir, una combinación del modelo anclado y el centro de notificaciones). Llegaremos al modelo mixto en la siguiente sección.
- Cada ancla debe tener un esquema de diseño para el contenido que albergará. Asegúrese de que su notificación se ajuste al esquema del anclaje. Para entender esto, tomemos el ejemplo de WhatsApp. El “chat” de anclaje aquí tiene un esquema de diseño que define cómo debería verse un objeto de chat. Esto significa que cualquier notificación anclada al chat debe seguir este esquema. Lo mismo vale para “llamadas”.
- Asegúrese de que los anclajes sean fácilmente detectables y accesibles. Evite usar anclajes anidados.
Utilice notificaciones ancladas de fuente cuando
- Cuando todas las posibles fuentes de notificación se pueden acomodar en la pantalla de aterrizaje.
- Ha pensado en todos los escenarios de notificaciones y todas las notificaciones se pueden acomodar con los esquemas de diseño existentes. Es importante que estas notificaciones sigan el esquema de la fuente a la que están ancladas.
3. Modelo mixto
Este modelo es una combinación de ambos modelos. Es los modelos más comúnmente utilizados. Facebook, LinkedIn, Twitter e Instagram son algunas de las aplicaciones populares que lo usan. Aquí, el centro de notificaciones se convierte en una de las opciones en el menú de navegación que se puede utilizar como delimitador para las fuentes que no califican para estar en la pantalla de aterrizaje. Por ejemplo, Facebook ancla las nuevas solicitudes de amistad a la pestaña “amigos”, pero una invitación para darle me gusta a una página está anclada al centro de notificaciones.

Este modelo tiene los méritos de ambos modelos y puede acomodar fácilmente la mayoría de los casos. Aunque ahora tiene la capacidad de anclar las notificaciones al centro de notificaciones, sigue siendo esencial analizar todos los escenarios y priorizar los que se pueden acomodar con las notificaciones ancladas en la fuente.
Al igual que el modelo anclado de origen, este modelo también depende en gran medida del menú de navegación, que ahora también tiene el centro de notificación como opción.
Lineamientos
- Identifique y clasifique los segmentos de información más importantes en la arquitectura del producto. Al clasificarlos, puede priorizar qué notificaciones deben anclarse a las fuentes y cuáles deben ir al centro de notificaciones. Como este modelo depende de la navegación, la configuración de notificación puede cambiar de acuerdo con el espacio disponible.
- Asegúrese de que los anclajes principales y el centro de notificaciones sean fácilmente detectables como parte de la navegación en la pantalla de aterrizaje.
Usa el modelo mixto cuando
- Usted ha pensado en los escenarios de notificación. Usted tiene algunas notificaciones que pueden anclarse a sus respectivas fuentes, pero algunas otras notificaciones no pueden anclarse a ninguna de las fuentes existentes en la arquitectura.
- Has anidado las fuentes en tu navegación. Por ejemplo, el ícono de menú de hamburguesas en la aplicación de Facebook es un ancla para las notificaciones provenientes de las fuentes debajo de él, como grupos, reloj, recuerdos, guardado, mercado, etc.
Conclusión
Todos los modelos mencionados anteriormente son útiles en el contexto correcto. La decisión de qué modelo elegir para su aplicación depende de la arquitectura de la información y los tipos de notificaciones que desea atender.
No olvides aplaudir
10 es bueno, 20 es genial, pero 50 sería lo mejor. Simplemente presione y mantenga presionado el botón. :PAG
Espero que este artículo pueda guiarte para elegir el modelo de notificación correcto para tu aplicación. Si tiene algún comentario, hágamelo saber en los comentarios.
Encuéntrame en
Para conocer mas tecnologias pueden seguirme en mis redes sociales:
Facebook: https://web.facebook.com/wilber.ccori.huaman/
facebook: https://web.facebook.com/TechManiako/
Grupo_facebook: https://web.facebook.com/groups/166091130742535/
YouTube: https://www.youtube.com/c/WILBERCCORIDEVELOPER
Blogs: https://www.techmaniako.com/ED/
GitHub: https://github.com/wilberCcoriHuman
Consulte los desgloses de características anteriores en los enlaces a continuación
