1

Luego de diversas propuestas y una necesaria redefinición de los objetivos de comunicación a partir de las mismas, presentamos dos variantes de cabecera para el sitio “Salud y envejecimiento en las Américas” de acuerdo a los requerimientos definidos recientemente: una solución tipográfica, sin imágenes y sin ningún elemento que establezca una asociación directa a la OPS.

Variante 1

Variante 1 Inicio

Variante 1 - Inicio

Variante 1 - Sección Observatorio

Variante 1 - Sección Observatorio

Variante más clásica, emplea una tipografía con serif que connota elegancia y profesionalidad. En el fondo se aprecia una solución gráfica de apoyo que muestra diferentes zonas que generan una degradación del color (aludiendo al envejecimiento como proceso con diferentes etapas).

Variante 2

var2-inicio

Variante 2 - Inicio

var2-seccion

Variante 2 - Sección Observatorio

Esta propuesta se ajusta al atributo “científico-técnico” definido por los editores, mediante el empleo de códigos actuales y una tipografía sin serif. El empleo de planos cortantes que contienen los caracteres le imprimen a la solución orden y modernidad.

0

Proyecto de conjunto con la OPS. A partir de una propuesta inicial se realizan ajustes específicos (tipografía, jerarquías visuales, definición de bloques de información) para optimizar el rendimiento gráfico del sitio. Valoraciones posteriores precisan la necesidad de replantearse el diseño de cabecera (elementos inicialmente exigidos en las propuestas de diseño se decidieron eliminar, en esta propuesta aún se mantiene la anterior no aprobada). En blogs posteriores se presentarán variantes para la misma.

Ver propuesta

1

Actualmente, estamos realizando algunos ajustes al sitio de Cencomed, con el objetivo de optimizar su rendimiento y solucionar algunas deficiencias detectadas en la primera versión. Por otra parte, antes del lanzamiento, surgieron necesidades no contempladas durante el proceso de trabajo que implicaron modificaciones a la propuesta que ahora estamos revisando con detenimiento. Por ejemplo:

-El módulo “Navegar por” que no se planeó desde un inicio y que actualmente funciona pero posee una interfaz deficiente desde el punto de vista de legibilidad y organización de información. Estamos trabajando en su optimización.

-El enlace a la BVS que se muestra en forma de módulo de contenido innecesariamente.

-Detalles de diseño que no han sido ajustados completamente. Read more on Actualización Diseño Cencomed (Página de Inicio)…

1

Propuesta Identificador BMN

 La solicitud de un nuevo identificador para la Biblioteca Médica Nacional, parte de la necesidad de integrar la identidad visual de la misma a la de Infomed, y llegar a una solución formal que connote los atributos actuales de esta Institución.

Atributos a comunicar definidos de conjunto con la dirección de la BMN:

  • Subordinación al Centro Nacional de Información de Ciencias Médicas (general).
  • Biblioteca (específico).
  • Biblioteca virtual (específico).

Recursos visuales empleados para comunicar los atributos definidos:

  • Para connotar la subordinación a Infomed, se emplearán recursos visuales utilizados en el identificador del mismo: la familia tipográfica Myriad Pro en su variante Regular, el uso de los caracteres del logotipo en caja baja (minúsculas) y los del genérico en caja alta (mayúsculas), el mismo código cromático, el “círculo verde” como elemento base del símbolo al que se le sustrae una forma y la composición horizontal como única variante compositiva.
  • Para hacer alusión al servicio de biblioteca y biblioteca virtual, se recurre al libro y al cursor respectivamente como elementos simbólicos.
3

En el artículo anterior comentábamos sobre el módulo de banner rotatorios y presentábamos una propuesta que permitía al usuario avanzar y retroceder en la visualización de los mismos, con el objetivo de que el usuario tuviese un control sobre la información de su interés. Continuamos revisando sitios y valorando patrones de diseño que fuesen pertinentes para esta solución. Ahora presentamos una variante, que no solo permite controlar la visualización,  sino que se ofrece el dato de cuántos sitios se están promocionando mediante este recurso.

De acuerdo a la primera ley de la usabilidad de Krug, la página web debe ser obvia y auto-explicativa. El visitante debe entender qué hace la página, cómo funciona y cómo puede ir a otro lado, el objetivo debe ser que no se haga preguntas.

Actualmente, nuestros usuarios deben realizar una serie de pasos para que la implementación de este recurso de los banner rotatorios cumpla con su objetivo: Promocionar eventos, no uno (porque sería un banner estático) ni dos (porque entonces se colocarían uno debajo del otro) sino múltiples eventos (actualmente hay 7 disponibles).

-En primer lugar el visitante debe permanecer más de 5 segundos visualizando la parte superior de nuestros sitios para comprobar que el banner cambia. O sea, el primer paso depende de una probabilidad.

-Debe esperar 10 segundos para comprobar que no se repite el anterior, por tanto, se genera la duda: “cuántos hay”. El segundo paso depende también de una probabilidad y además genera una pregunta, que solo se responde si espera a que se repita el primero.

-Esperar 35 segundos para visualizar los 7 disponibles actualmente en caso de que le interese. Este paso precisa de un gran interés por parte del visitante ya que debe invertir mucho tiempo.

-De interesarle algún evento debe hacer clik sobre el banner, si no lo hace en los 5 segundos que se muestra (lo cual es probable si se detiene a leer la información que muestra el banner) tendrá que esperar 35 seg para que se repita…tiempo que invertirá buscando el mismo evento por otra vía: pinchando otra opción en la página  o en un buscador web que le ofrezca mayores posibilidades de encontrar rápidamente la información que busca.

De modo general, existe una probabilidad muy alta de que el objetivo de este recurso no se esté cumpliendo actualmente de manera óptima, si tenemos en cuenta además que generalmente los usuarios “escanean” las páginas sin leerlas con detenimiento, buscando palabras, anclajes visuales y puntos fijos que los guíen hacia lo que están buscando; su tiempo es esencial.

En esta propuesta, mantenemos la animación como recurso de énfasis visual, pero incluimos elementos de navegación ampliamente reconocidos y aportamos como dato informativo el número de eventos disponibles mediante este módulo. Mirándolo una sola vez, el usuario reconoce qué le estamos ofreciendo, si le interesa, revisará los banners controlando el tiempo que invierte en esta acción.

Ver propuesta

6

Luego del profundo análisis y las numerosos reuniones entre todos los implicados, que tuvo como resultado la propuesta de Lilibeth de arquitectura de información del Portal de Cencomed y una extensa argumentación de la misma que avala cada una de las decisiones, presentamos la primera propuesta de diseño de interfaz.

En esta versión se emplea un esquema de color Acromático Monotono (constituido sólo por colores neutros dentro de la gama del negro al blanco) combinado con otro color, en el que el color rojo oscuro que identifica al sitio se utiliza como color de resalte, para enfatizar las área más relevantes (en este caso: Servicios). Posteriormente presentaremos otras variantes que se están desarrollando y que exploran otros esquemas cromáticos.

Esta solución fue seleccionada de conjunto con la especialista de información, y representa adecuadamente los niveles de jerarquía de información definidos en la etapa de arquitectura. También se tuvieron en cuenta las especificaciones de tipo técnico y de estrategia visual que determinan la necesidad de emplear una plantilla genérica para los sitios en Drupal que con un mínimo de personalización pueda utilizarse para generar nuevos servicios, es decir, desde el punto de vista de diseño, esta propuesta define un estilo gráfico que será implementado en los próximos servicios y que se aplicará a los ya existentes.

Esta estrategia, además de ajustarse a nuestras posibilidades de respuesta a las numerosas solicitudes y rápido crecimiento en lo que respecta a servicios, pretende garantizar una identidad visual homogénea y sólida en nuestros sitios, deficiencia fundamental detectada en los diagnósticos eventuales que hemos realizado.

En la propuesta, existen algunas diferencias con respecto a la arquitectura propuesta, las cuales fueron analizadas y valoradas de conjunto con Lilibeth:

-La información qué debe mostrarse en el Pie de página que precisamos con Víctor y que está definida por el centro.

-La distribución de algunos elementos en el mismo para ajustarnos a patrones de diseño reconocidos por su pertinencia.

-La incorporación de otros enlaces en el Pie de página que por su importancia es conveniente que estén disponibles en esta sección.

-Modificar el sistema de banner rotatorios y permitir al usuario controlar la visualización de los mismos. Esto es algo que hemos discutido antes y que es conveniente retomar. Actualmente los usuarios deben esperar pacientemente que se muestren todos los banner colocados sin saber cuántos son o cuánto demorará. Este recurso además de atentar contra la usabilidad, no resulta coherente con el concepto de promoción que da origen a los banner, ya que si el usuario continúa navegando por la página puede no “ver” un banner que promocionaba un evento de su interés o aburrirse esperando que le toque el turno a uno que le interesa. De esta forma que proponemos, el usuario podría avanzar o retroceder en la visualización de los banner promocionales disponibles. Esta sería una variante más sencilla, existe otra que combina ambas, en la que los banner cambian como ahora, pero se ofrece la posibilidad de avanzar y retroceder. En cuánto a cual usar, depende del énfasis que se pretenda, las animaciones captan mucho más la atención que un elemento estático…es algo a valorar con el equipo.

La imagen de la cabecera fue seleccionada para el análisis de la propuesta, no es definitiva. Para facilitar el flujo de trabajo es necesario priorizar los elementos que pasan a la etapa de programación y personalización de la plantilla de Drupal.

Ver Propuesta 1

1

Partiendo del Diagrama de Presentación elaborado de conjunto con el Grupo de Arquitectura y teniendo en cuenta algunas modificaciones posteriores definidas por ellos en cuanto a organización de información, se realizó una propuesta de interfaz para el sitio de los Boletines BVS Cuba, que se desarrollará en WordPress. En la cabecera se realizaron modificaciones en el área de identificación, especificamente en el identificador, ajustándolo a las normas definidas por la BVS;  estas variaciones se harán extensivas al resto de los sitios implementados de la BVS Cuba.

Actualemente es están valorando los temas de WordPress disponibles que mejor se ajusten a la diagramación y diseños pautados, para posteriormente personalizar el área donde se mostrarían los boletines.

Ver Propuesta / Especificaciones de diseño (para Grupo Web)

1

A continuación algunos de los requerimientos que desde el punto de vista de diseño de interfaz han surgido para el desarrollo (por parte del Grupo de Tecnología) de una plantilla genérica de Drupal para los sitios de Infomed que emplearán este CMS:

1-Cabecera compuesta por 2 imágenes y un background color a definir por el usuario.

2-Barra superior con el identificador de Infomed como enlace al Inicio del Portal, habilitada para incluir enlaces comunes: Contacto, Ayuda, Mapa del Sitio, etc (en dependencia de las necesidades específicas de cada servicio)

3-Posibilidad de personalización de los módulos de contenidos (al menos 3 variantes predefinidas). Por ejemplo: Módulo con el listado de Servicios con mayor jerarquía visual que el Módulo de Enlaces relacionados.

Este Post queda abierto a nuevos requerimientos y pretende que el resto de los implicados en el proceso de creación de Servicios aporten nuevas sugerencias.