Dosys es un sistema integrado digital compuesto por una red social y una aplicación para dispositivos móviles, ideado para convocar, organizar y llevar a cabo acciones grupales de intervención en el medio, de forma fácil y efectiva.

En la actualidad, vivimos un auge en la organización espon-tánea de grupos de opinión que se basan en la facilidad que ofrece internet para compartir datos como principal medio de coordinación. Estos grupos suelen tener problemas para organizar coherentemente acciones que expresen sus ideas fuera de internet. DOSYS soluciona este problema al ofrecer un sistema completo para crear acciones, encontrar partici-pantes, organizar la puesta en marcha, llevar a cabo la acción y documentarla.

El target de DOSYS son hombres y mujeres jóvenes (16-35 años) de clase C-B, con una alta implicación tecnológica y social, fluidos en el uso de internet (en especial redes sociales) y dispositivos móviles como smartphones o tablets.

INTRODUCCIÓNINTRODUCCIÓN

PÁGINA DE PERFIL

DESCRIPCIÓN GENERAL

USO - PASO 1

USO - PASO 2

USO - PASO 3

La marca tiene un corte y estilo claramente tecnológico y dinámico, combinando rectas, curvas y ángulos para con-vertirla en un elemento con mucho movimiento. Este mo-vimiento se define en el sentido de lectura por la inclinación de la fuente y acaba en una ascensión abierta por las dos cápsulas. El interletraje natural de la fuente se ha modificado para hacer la marca regular excepto en la parte final, en la que las cápsu-las se construyen a partir de medidas dependientes, lo que le otorga mayor sensación de movimiento. La combinación de colores también ayuda a esta sensación.

En el proceso de naming se buscó un nombre de alta pregnancia para representar el concepto de “intervención en el sistema”, adecuado para el target. DOSYS es la contracción de DO SYSTEM, “sistema de acción”, que se relaciona directamente con el imagotipo de las dos cápsulas y con la idea de inyectar el sistema. Iconográficamente, las cápsulas roja y azul repre-sentan el concepto “elección entre acción e inacción”, remi-tiendo al simbolismo de obras como Matrix o Alicia en el Pais de las Maravillas, las dos con un alto componente de modificación de la realidad.

La marca no presenta variaciones ya que su uso normativo es exclusivamente digital, afirmando así el compromiso inherente a un sistema donde el ideario, la puesta en marcha de las pro-pias ideas, tiene un alto peso específico.

18 º

a

h

h

b

MARCA

PÁGINA PRINCIPAL

DOSYS utiliza tres fuentes diferentes: Runway para construir la marca y los elementos textuales más gráficos, y Trebuchet y Verdana como fuentes seguras de pantalla (fuentes reproduci-bles en diferentes dispositivos), dado el carácter multiplata-forma del sistema. Estas últimas son además fuentes de libre uso, en concondancia con los ideales de DOSYS.

El color tiene mucha importancia, ya que actúa como ordena-dor de la información a muchos niveles. Los colores rojo y azul del imagotipo se repiten sistemáticamente: en rojo se encon-trarán los elementos que llamen a la acción, estén en desar-rollo o indiquen atención; en azul, los elementos que indiquen procesos acabados o estáticos. La suma en hexadecimal (colores de pantalla) de estos dos colores resulta en violeta, que se utiliza en elementos que indiquen identidad o toma de decisiones (valores ‘suma’ de acción e inacción).

#EB2627 #2D2C2C #949494+ #325AA7 = #A46DAD

Para el resto de información, elementos estáticos y texto se utilizan grises desde el 50%. Se ha escogido gris para estos elementos en vez de negro para disminuir ligeramente el con-traste, y así también disminuir el cansancio visual al tener que lidiar con muchos elementos en pantalla.

Tanto la web como la aplicación presentan un fondo de ruido blanco, simbolizando ‘interferencia’ en consonancia con la idea de ‘intervención’ en el sistema.

Trebuchet MSABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890 àáäâã

VerdanaABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890 àáäâã

RunwayABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890 àáäâã

Ruido blanco66%

COLOR Y FUENTES

La cápsula es uno de los elementos gráficos principales. Es el avatar de los usuarios de DOSYS. Con él, se mantienen a la vez el anonimato y se diferencia la individualidad, al permitir una combinación de colores en fondo, contorno y degradadados de todo tipo. El efecto final es el de un “ejército” de cápsulas, de “dosis” de acción.

Los 4 diferentes roles que se pueden adoptar en una acción se representan mediante 4 tipos diferentes de virus en baja iconi-cidad, según sus características. Así, el adenovirus (con patas) representa a los inyectores, los que llevan la acción a cabo. El rotavirus (circular y con núcleo) representa a los vigilantes, que supervisan la zona de acción. El virus con flagelos (le per-mite llegar a varios sitios a la vez) representa el papel de los media, quienes documentan la acción. Por último, el cúmulo de bacterias representan a los coordinadores, quienes distribuyen la información.

En la web también se utilizan figuras esquemáticas humanas para representar acciones. Las figuras no tienen cara, van de negro y tapadas por una capucha, identificándose con el target anónimo en acción.

ELEMENTOS GRÁFICOS

OPERACIÓN EN VIVO

USO - PASO 4

Marca del sistema, avatar del usuario, nombre y hora actual.

Selector de rol (intercambiable en cualquier momento), nombre de la inyección y barra de progreso.

Campo de entrada de datos.

Participantes en la acción. Al ser este el panel de coordina-dor, se muestran todos los usuarios sin distinguir su rol.

Información sobre el participante seleccionado, desplegable para mostrar su timeline.

Timeline general, mostrando el flujo completo de infor-mación del evento.

Selectores de envío de información y botón de acción.

APP. MÓVIL - COORDINADOR

Marca del sistema, avatar del usuario, nombre y hora actual.

Selector de rol (intercambiable en cualquier momento), nombre de la inyección y barra de progreso.

Campo de entrada de datos.

Selector de zona y botones de acción, para seleccionar si una zona está siendo inyectada o no.

Selector de participantes, con scroll horizontal.

Información sobre el participante seleccionado, desplegable para mostrar su timeline.

Timeline general, mostrando el flujo completo de infor-mación del evento.

Selectores de envío de información y botón de acción.

APP. MÓVIL - INYECTOR

Marca del sistema, avatar del usuario, nombre y hora actual.

Selector de rol (intercambiable en cualquier momento), nombre de la inyección y barra de progreso.

Campo de entrada de datos.

Selector de zona y botones de acción, para seleccionar si una zona está siendo controlada o no.

Selectores de estado de zona, configurables por el usuario.

Selector de participantes, con scroll horizontal.

Timeline general, mostrando el flujo completo de infor-mación del evento.

Selectores de envío de información y botón de acción.

IAPP. MÓVIL - AVISADOR

Marca del sistema, avatar del usuario, nombre y hora actual.

Selector de rol (intercambiable en cualquier momento), nombre de la inyección y barra de progreso.

Campo de entrada de datos.

Selector de medios de recepción.

Campo de entrada de configuración de medio.

Selector de medios de transmisión propios del dispositivo móvil, configurable.

Selector de medios propios del dispositivo móvil.

Timeline general, mostrando el flujo completo de infor-mación del evento.

Selectores de envío de información y botón de acción.

APP. MÓVIL - MEDIA

La página de entrada a DOSYS funciona como una red social hipercondensada, dónde aparecen de un vistazo los últimos participantes y se puede explorar sin necesidad de hacer ningún click. En esta página, se muestran dos descripciones generales (texto y gráfico) junto al estado general en cuanto a adscritos, lo cual da una idea general introductoria de en qué consiste DOSYS.

La barra de menú es sencilla, con contraste visual, siempre presente y basa la jerarquía de elementos en el tamaño de fuente. Usa el código de colores para facilitar la navegación. En la página de entrada, se muestra un esquema visual que sirve de resumen o pista del funcionamiento de DOSYS.

En la parte izquierda, también siempre presente, se muestra un indicador de nivel como el de las jeringuillas que indica la fecha. El eje central de la página es siempre el día actual. A medida que nuevos participantes se registran en la página, su cápsula-avatar aparece en el eje central, y el contador de par-ticipantes se actualiza, todo en tiempo real.

Al pasar el cursor por encima de las cápsulas, se muestra infor-mación sobre el participante como su alias, zona de acción, experiencia en DOSYS y un mensaje personalizado, que puede incluir HTML para llevar a diferentes links o formatear el texto.

Toda la página se basa en HTML + PHP + Javascript, lo cual posi-bilita la actualización automática sin tener que efectuar clicks. Esto hace que la página en todo momento esté ‘viva’, pre-sentando las nuevas cápsulas, que van desplazando el bloque de antiguas a la derecha y hacia abajo.

En toda la página hay enlaces clave que llevan a las secciones correspondientes en cada momento. Ha sido posible condensar la información dado que, aunque funcione como una red social, sólo se necesitan unas pocas características de éstas para pre-sentar la información.

DESC. PÁGINA PRINCIPAL

Junto con la página de entrada, la página de perfil forma el núcleo de DOSYS como red social para poner en contacto y encontrar participantes. El perfil funciona a la vez como muro de información y buzón de entrada, siguiendo el mismo sistema para presentar la información (horizontalmente, por días y sólo mostrando los avatares)

En la página de perfil, accesible al hacer click en una cápsula, se muestra la información disponible sobre el adscrito, como su avatar personalizado y el número de operaciones en que ha participado. Al pasar el cursor por encima de los iconos de rol, se muestra un listado de nombres de operación en los que ha participado. Haciendo click en ellos, se puede ver la operación.

La página de perfil también funciona como un ‘muro’ clásico de red social, pero en vez de mostrar directamente los mensajes recibidos se muestran únicamente los avatares correspondi-entes a quién nos ha mandado un mensaje, apilados horizontal-mente en el día correspondiente. Aquí, al seleccionar un avatar se muestra el mensaje recibido en una ‘ficha de mensaje’.

La ficha de mensaje muestra información sobre el emisor del mensaje, herramientas para responderlo, reenviarlo a otros, guardarlo o eliminarlo. También ofrece un selector de privaci-dad del mensaje, para hacerlo privado (sólo el receptor puede verlo) o público (cualquier visitante del perfil puede ver los mensajes recibidos)

La información se presenta de forma sintética, usando el sistema general de mostrar la información inmediata sin hacer click. Así se consigue tener toda la información a mano de forma efectiva sin tener que mostrarla toda. Únicamente se requiere hacer click para mostrar información de forma fija.

Junto con el formulario del Buscador, la página de perfil es la principal manera de contactar participantes.

DESC. PÁGINA PERFIL

DOSYS puede ser difícil de comprender en un primer momento, por lo que la sección de explicación del sistema es importante. En ella se resume toda la información esencial sobre DOSYS siguiendo la rejilla específica.

Las cinco páginas que conforman la explicación del sistema son sencillas y estructuradas. La información se basa en el texto, apoyado por imágenes también sencillas, de diferentes estilos.

En la primera de las páginas, se puede ver un esquema del fun-cionamiento del sistema, que junto al presentado en la página de portada dan una mejor idea global del proyecto.

Para no acumular información, se presenta estructurada en pasos según la sección. En cada paso se incluyen los links nec-esarios para ampliar la información.

La interface de DOSYS es bastante intuitiva en cuanto a su uso, gracias a la distribución de la información y las acciones a realizar junto con el sistema de colores.

En esta representación gráfica se muestra directamente cada sección en un panel para ayudar a la comprensión global del sistema, tal como se haría en la página web al ir pasando de una a otra.

DESC. GENERAL

La pantalla de operaciones en vivo muestra en tiempo real el proceso de una inyección usando DOSYS. Mediante la distribución en cuatro paneles, uno por cada rol, y gracias a la actualización automática y la interrelación entre paneles, la información se distribuye y está disponible de forma sencilla, solucionando el problema que constituye tener que informar de gran cantidad de datos simultáneos de forma sencilla.

El panel de media muestra todos los participantes activos en ese rol. El tamaño relativo del avatar aumenta según la canti-dad de información que está retransmitiendo. Al escoger uno, se muestra su información y la selección de medios en los que esté retransmitiendo. Al hacer click en un medio en concreto, éste se muestra inmediatamente debajo. Como en todos los paneles, por último se muestra el timeline de todos los media.

Por último, el panel de vigilantes muestra la posición de cada uno de los participantes en ese rol en un mapa interactivo. La lista de zonas utiliza el mismo código de colores, siendo aquí azul zona controlada, rojo zona en proceso y gris zona sin infor-mar. Al seleccionar alguna de las zonas, se muestra el último status recibido y el informador aparece seleccionado en la columna de coordinadores.

En todos los paneles, la información puede desplegarse hacia abajo para ampliar el timeline, haciendo click en los botones de scroll.

El panel de la izquierda muestra el estado de los inyectores de la operación. En él se puede ver el estado de la operación (dividida en fases completadas: gris, no iniciada; roja, en activo; azul, finalizada). El mismo código de color se utiliza para las zonas en las que se haya definido la operación. Debajo de esta información, se muestra la información que los inyec-tores participantes están transmitiendo en DOSYS. Al hacer click en el avatar de un inyector, su información se muestra en el panel de coordinadores.

El siguiente es el panel de coordinadores. En él, se muestran mediante scroll horizontal todos los participantes en la acción. Si alguno es seleccionado, su información se muestra debajo: un icono mostrando el rol que tiene activo, su nombre y hora de actividad. Más abajo se muestra el timeline, con la infor-mación que los coordinadores encían y a quién ha sido enviada. Si es a alguien en concreto, se muestra su cápsula identifica-tiva; si es a todo un rol en concreto, se muestra su icono.

La información de todos los paneles es dinámica, por lo que la página de En Vivo se mueve continuamente, dando la sensación de ser algo vivo. Esto refuerza la idea de sistema, de acción, de inyección, apoya el discurso de ‘Dosis/virus/inyección’, etc.

La página de En Vivo también sirve para consultar acciones pasadas, que se muestran reproduciéndose de nuevo como si fueran en tiempo real. Así, la consulta de datos de operaciones anteriores se puede hacer de forma dinámica, con un interface innovador al tratarse de un sistema de archivo.

DESC. OPERACIÓN EN VIVO