View
227
Download
0
Category
Preview:
DESCRIPTION
Estrategia Web y de Señalización
Citation preview
Alumnas: Gley Carolina Riquelme Van · Sofía Savoy AnguitaProfesor Guía: Sr. Herbert Spencer GonzálezDiseño Gráfico · Diciembre 2011Pontificia Universidad Católica de Valparaíso · Escuela de Arquitectura y Diseño
Construcción de la Comunicación VisualEstrategia Web y de Señalización
Construcción de la Comunicación VisualEstrategia Web y de Señalización
Alumnas: Gley Carolina Riquelme Van · Sofía Savoy AnguitaProfesor Guía: Sr. Herbert Spencer GonzálezDiseño Gráfico · Diciembre 2011Pontificia Universidad Católica de Valparaíso · Escuela de Arquitectura y Diseño
5
Índice
PRÓLOGO 9
PRESENTACIÓN 11
La Comunicación 11
CAPÍTULO I: "CONSTRUCCIÓN DE UN ARGUMENTO VISUAL" 13
INTRODUCCIÓN 15
ESTRATEGIA DEL PROYECTO 17
Brief 17
Benchmark 17
Propuesta 21
ARQUITECTURA DE LA INFORMACIÓN 22
El Sector de la Salud en Chile 22
Estructura del Sistema de Salud Chileno 24
Mapa de Navegación Anterior 26
Mapa de Navegación Propuesto 27
Niveles de Accesibilidad 28
DISEÑO ESTRUCTURAL Y VISUAL 30
Wireframes e Interfaz 32
Mapas de Divs 42
Color 46
Tipografía 48
CONSTRUCCIÓN DEL ARGUMENTO 50
Definición del Guión 52
Construcción de Animación 54
CONFIGURACIÓN E IMPLEMENTACIÓN 58
Plugins 58
Elementos Integrados 59
CIERRE PRIMER CAPÍTULO 61
6
CAPÍTULO II: "SISTEMA VISUAL DE ORIENTACIÓN PARA HOSPITALES" 63
INTRODUCCIÓN 65
ESTUDIO Y ANÁLISIS 67
Introducción a la Investigación del Usuario: Sondas 67
Diseño para actividades del usuario 68
Análisis de las Actividades 74
Observaciones en Terreno 75
Wayfinding 76
DISEÑO ESTRATÉGICO DEL SVO 79
Construcción de un Viaje Hospitalario 80
TIPOGRAFÍA HOSPITAL 90
Visibilidad, Legibilidad e Inteligibilidad 90
Gobierno 93
Titillium 93
Creación de Trazos y Esqueletos 94
Caracteres 110
Versiones Tipográficas 112
Iconos 122
Versiones de Iconos 130
Sitio Web 138
Enlaces externos 138
CONSTRUCCIÓN GRÁFICA 152
Imagen del Hospital 152
Decisiones Cromáticas 158
DISEÑO DE PROTOTIPOS 160
Jerarquías Tipológicas de la Señalética 160
Estructuración de Tipologías 162
Propuestas Anteriores 182
CIERRE PRIMER CAPÍTULO 199
7
AGRADECIMIENTOS 201
REFERENCIAS 203
Bibliografía 203
Webgrafía 203
COLOFÓN 205
Colofón de Estudio 205
Colofón Técnico 205
9
Prólogo
Una organización es una construcción de un “nosotros”. Se trata de un nosotros orien-
tado, yendo hacia un propósito común. En este camino de “dirigirse hacia” se construye
una imagen de propósito escencialmente utópica porque es diferente al presente, y,
en cierta medida, inalcanzable. En este “ir hacia” se deben ir gestionando los diferen-
tes recursos, darle forma a los espacios, a los actos e interacciones internas y externas,
además debe repartir diferentes tareas y roles entre sus miembros. Todo esto correspon-
de la la construcción de los argumentos de una organización humana.
El argumento de una organización equivale a su relato fundamental, aquel que permite
reunir, en primera instancia, a ese grupo de personas. Corresponde a su ethos interno, a
la palabra que construye sobre sí misma y que le confiere identidad. Su argumento es lo
que va sembrando en el mundo y es aquello por lo que otras personas la reconocerán
e, incluso, podrán unirse a ella, porque el argumento es también su cultura, su modo
de vida.
El argumento tiene capas de profundidad en la relación público-privado, y tiene niveles
de especificidad; desde lo más idiosincrático a lo más convencional. En el mundo actual,
el oficio del diseñador es muchas veces cogido por esta tarea: la de facilitar la materia-
lización del argumento desde una partida poiética o de la elicitación de su voz, desde
una partida retórica.
Sofía Savoy y Gley Riquelme, autoras del presente estudio, abordan dos aspectos funda-
mentales y diversos del diseño de argumentos. Comienzan su exploración enfrentándo-
se a una organización en gestación. Se trató de una agrupación ciudadana preocupada
por los derechos civiles asociados a la salud pública, compuesto principalmente por
médicos, enfermeras y salubristas denominado “Salud, un Derecho”. El argumento de
esta organización es bastante elemental: se trata de instalar el tema de la salud en el
debate público para promover una reforma estructural que garantice el acceso a todos
los ciudadanos.
Más allá de las implicancias políticas de adscribirse —o no— a un movimiento de esta
naturaleza, resulta fundamental para un diseñador lúcidamente ubicado en el mundo,
reconocer el sentido retórico de su oficio y su potencia aglutinadora por cuando imagen
que se vuelve propósito. Diseño como designio que se convierte en su relato articulador
de personas y que encarna finalmente su identidad y su cultura.
A esta primera experiencia germinal interna la sigue otra de naturaleza más física y tangi-
ble, dentro de una organización más madura y consolidada, como lo es un hospital del
sistema público de salud. Este proyecto se centró en un modo de comunicación visual
Prólogo
10
jugado en complejidad espacial de tamaños, de signos y orientaciones. El argumento,
en este caso, se centra en el modo de comunicar el sentido de la organización a las
personas externas que ingresan a su dominio: el edificio hospitalario.
Un hospital es un edificio de gran complejidad programática, con muchos servicios
interrelacionados, con muchos actores y reglas en juego. Uno de los principales proble-
mas de las organizaciones grandes y complejas radica en que su orgánica se impone
por sobre las personas, construyendo ambientes fríos e inóspitos, compartimentali-
zados por sus propios protocolos y burocracias. Los espacios no logran comunicar ni
conducir naturalmente a las personas a través de sus servicios de un modo coherente
a su condición de entrega, ya que dentro del hospital el propio cuerpo se vuelve espa-
cio en disputa. Este cuidado por la experiencia del otro es el kairos de la hospitalidad,
gran oportunidad que abre este proyecto para desarrollar una ética de diseño centrado
genuinamente en las personas.
Este proyecto aborda esta capa espacial de la organización hospitalaria para construir
una voz gráfica que acompañe a las personas que atraviesan el servicio, en un intento
por otorgar coherencia y hospitalidad a la experiencia de los pacientes y sus familiares,
y también otorgándole un rostro y una voz a una entidad abstracta, para dejarla en una
situación de proximidad. El presente estudio relata el periplo por este territorio, desde la
reflexión tipográfica que desencadena el desarrollo de una familia completa, así como
de las diferentes configuraciones de señalética para el hospital de Quilpué, pero tal vez,
constituyéndose como medida gráfica para extenderse a otros hospitales y servicios de salud.
Herbert Spencer G.
11
Presentación
El desarrollo de dos proyectos aparentemente distintos en su totalidad, encuentra un
modo de vincular sus aspectos fundamentales por medio de la construcción de la
comunicación. Diseñar para un público, para los usuarios, comprende un lenguaje
complejo que debe construirse a través de un arquitectura, la cual sabe distinguir las
jerarquías que la componen, acentuando de forma correcta los aspectos principales y
creando un camino legible y accesible a los contenidos más especfíficos.
El contenido del primer proyecto trata de la construcción de un argumento visual, que
responde a las necesidades de un grupo político-social para intenta dar a conocer una
situación crítica respecto al sistema de salud en Chile. Por otro lado, el segundo proyec-
to, trata de la construcción de un sistema visual de orientación para hospitales, con la
idea de diseñar el viaje del usuario dentro del recinto.
La estructura que establece la relación directa entre los proyectos, se basa en el modelo
de comunicación de Shannon y Weaver. Este permite dar cuenta de los roles, elementos
e interacciones que se identifican en el proceso comunicativo, lo que permite aproxi-
marse al contenido y las herramientas que se emplearán para construir este diálogo.
La Comunicación
Salud Un Derecho
Elementos pertenecientes al proyecto del Argumento Visual
de Salud Un Derecho.
Hospital de Quilpué
Elementos pertenecientes al proyecto del Sistema Visual de
Orientación del Hospital de Quilpué.
CONTEXTO
Viaje del Usuario en el Hospital
CÓDIGO
MENSAJEEMISOR CANAL RECEPTOR
Lenguaje de programaciónVideo animación
Signos lingüísticosSignos pictográficosColores
Salud Un Derecho IdealesPropósitos
Sitio Web Comunidad ChilenaInternautas
Hospital de Quilpué DireccionesUbicaciones
Sistema Visual deOrientación
PacientesFuncionariosVisitas
Navegación del Usuario en el Sitio Web
Pre sentación
13
Capítulo IConstrucción de un Argumento VisualSitio Web y Animación para “Salud Un Derecho”
15
Introducción
Un primer acercamiento al proyecto de Titulación I, reside en el área de la salud con la
presencia de un caso puntual (orientado a lo político-social): Salud Un Derecho. Este
movimiento político y social nace ante la urgencia de cambiar el Sistema de Salud y
proponer una nueva reforma estructural del Sistema de Salud Chileno, planteando
igualdad en este para todas las personas, sin discriminar de su estatus social.
La oportunidad de trabajar en este ámbito, permite abordar la temática de la salud desde
una perspectiva diferente, y a la vez, da la posibilidad de reestructurar y rediseñar el sitio
web de Salud Un Derecho. Para esto, es fundamental poseer metodologías de estudio
por medio de las cuales llegar a construir un proyecto sólido y sustentable a través del
tiempo.
Con esto surge la necesidad de navegar a través de la web y comenzar a observar las
variadas temáticas y funcionalidades que poseen los sitios web, a partir de lo cual se
identificarán distintos patrones que ayudarán a la creación de un nuevo argumento
visual, capaz de transmitir el planteamiento de una idea y de una serie de acciones que
se ejecutarán dentro del sitio y que responden a los objetivos que se propone este movi-
miento.
caPítulo i : "construcción de un argumento Visual" • introducción
17
Estrategia del Proyecto
Salud Un Derecho surge como una urgencia ante una nueva reforma de la salud, enfo-
cada a la igualdad de las personas, en donde no hay discriminación de atención ante
quien posee mayor o menor recurso.
Para exponer sus ideas han construido un sitio web a base de sus planteamientos y mani-
fiestos, con ello se quiere que las personas conozcan sus propuestas e ideas y apoyen
el proyecto para poder ser planteado como una nueva reforma estructural de la salud
ante el gobierno el 14 de mayo del 2014, teniendo al menos 1.000.000 de residentes a
favor de ella.
Objetivos del Proyecto:
• Que el sitio web sea un espacio de educación con respecto a la salud, ante toda
persona que ingrese a él.
• Crear una comunidad comprometida y participativa, que pueda generar un activismo
social, dando a conocer los planteamientos de “Salud Un Derecho”.
• Que el Sitio sea un canalizador y capacitador de fácil acceso, con material gráfico
explícito para quienes sientan el compromiso de divulgar esta nueva reforma de la
salud.
Meta a Cumplir:
Conformar una comunidad de al menos un millón de residentes Chilenos, que apoyen
activamente la nueva reforma para el 14 de marzo del 2014.
Benchmark
caPítulo i : "construcción de un argumento Visual" • estr ategia del Proyec to
Comparar el actual sitio de Salud Un Derecho con otros sitios que se constituyen a partir
de una temática determinada (este caso “movimientos sociales”), es importante para
saber cuales son los pro y los contra que tiene cada uno, de modo que se destaquen los
aspectos positivos para integrarlos a la propuesta de arquitectura de información.
En total se analizaron tres sitios -incluyendo el de Salud Un Derecho- nacionales e inter-
nacionales que se relacionan con el tema de la salud a nivel político y social.
Brief
Salud Un Derecho
Movimiento liderado por Vivienne Bachelet Norelli (vocera
del Frente Amplio de Defensa de Salud Pública) que nace a
través de la red social Twitter, y que apoya el hecho de que
la salud debe ser un derecho igual para todos.
18 caPítulo i : "construcción de un argumento Visual" • estr ategia del Proyec to
SALUD UN DERECHO
http://saludunderecho.cl/
Aspectos Positivos
• Dispone de información rápida para encontrar.
• El Sitio se actualiza constantemente.
• Ofrece un espacio de opinión para cualquier persona.
• Expone los ideales de la organización de forma clara.
• Existe contacto directo con las redes sociales.
Aspectos Negativos
• Falta un espacio de participación más activa.
• La información se repite (y está presente) en varias
secciones.
• Faltan recursos gráficos que den a entender (de manera
visual y directa) ideas, procesos, temáticas, etc. que se
muestren.
• El sitio no provoca, a quien lo visita, un deseo de
participación; no se percibe una invitación.
MI SALUD NO ES UN NEGOCIO
http://www.misaludnoesunnegocio.net/
Aspectos Positivos
• Espacio de información Categorizada y Actualizada.
• Comparte su contenido con las redes sociales.
• Cuenta con un espacio de Opinión dentro de los Artículos.
• Incita a informarse acerca de temáticas.
Aspectos Negativos
• La Información del sitio se presenta de forma muy
condensada.
• Falta de recursos gráficos que permita entender de manera
más visual la gran cantidad de contenido escrito.
19caPítulo i : "construcción de un argumento Visual" • estr ategia del Proyec to
NATIONAL HEALTH SERVICE
http://www.keepournhspublic.com/index.php
Aspectos Positivos
• Presenta una idea clara de sus planteamientos desde el
inicio del sitio.
• Cuenta con un espacio para generar una campaña,
otorgando los elementos gráficos de esta.
• Ofrece un espacio de participación al que visita el sitio.
• Declara todos los aspectos de su campaña y quienes
aportan a ella.
Aspectos Negativos
• Falta de recursos gráficos que permita entender de manera
más visual la gran cantidad de contenido escrito.
• Falta de definición gráfica en el sitio.
• No cuenta con un buscador, y sus contenidos dentro de él
son difíciles de ser encontrados.
OBSERVATORIO DE EQUIDAD DE GÉNERO EN SALUD
http://www.observatoriogenerosalud.cl/
Aspectos Positivos
• Dispone la información ordenadamente en las distintas
secciones.
• Señala “campos de observación” dentro de la temática
general.
• Utiliza esquemas para graficar y explicar ciertas ideas.
Aspectos Negativos
• Los campos del buscador son poco claros.
• La interfaz mezcla muchos elementos.
• No permite el registro y participación de cualquier persona.
20
ORGANIZACIÓN PANAMERICANA DE LA SALUD
http://new.paho.org/hq/
Aspectos Positivos
• Sitio donde se Publican noticias Actualizadas del tema, y
actúa también como Generador de Contenido.
• El Sitio está en Español y en Ingles, por lo que puede
acceder a más personas.
• Da a conocer los miembros que participan.
Aspectos Negativos
• El espacio de Comentario es muy cerrado, los comentarios
no quedan visibles como puntos de discusión.
• Falta de recursos gráficos que permitan entender el
contenido de un modo más visual.
• Nombres de menúes donde no queda claro lo que se señala.
SOCIEDAD INTERNACIONAL DE EQUIDAD DE SALUD
http://www.iseqh.org/
Aspectos Positivos
• Genera contenido propio.
• Tiene la opción de ver la mayor parte del contenido en
español y francés.
• El contenido principal se clasifica de buena forma; el menú
se organiza claramente.
• Recalca puntos importantes y detalles de actividades.
Aspectos Negativos
• Se visualizan demasiados contenidos en un mismo espacio.
• El diseño estructural del sitio carece de un criterio de
diseño (falta definición de diagramación).
caPítulo i : "construcción de un argumento Visual" • estr ategia del Proyec to
21
Según lo analizado en los distintos sitios, se logra destacar:
• Estructuración y organización concisa de los contenidos.
• Los ideales y temáticas a tratar se muestran claros.
• Generación de contenidos de los propios organizadores.
• Hay un cierto llamado a participar en el sitio, integrando a las personas .
Con esto, es posible identificar los elementos faltantes del sitio actual y hacer las correc-
ciones y propuestas correspondientes para comenzar a desarrollar el proyecto:
Propuesta
Accesibilidad
Definir tres niveles de
accesibilidad para usuarios.
Administrador, Registrado,
No Registrado.
Participación
Generar el deseo de
participación mediante
la exposición de argu-
mentos claros, y de la
constante actualización
de contenidos.
Comunidad
Conformar una comunidad comprometida
con las ideas planteadas mediante un registro
de ellas en el sitio, otorgándoles espacios
de publicación abierta para que expresen
sus ideas, sus testimonios, creen debates y
colaboren.
Educar
Lograr educar acerca del tema de
la salud en Chile a través de info-
grafías y modelos explicativos.Estructura
Organizar el contenido del sitio a través de
la arquitectura de la información, creando
espacios que generen un discurso cohe-
rente y den forma al sitio web.
Red Social
Implementar las redes sociales
“Twitter” y “Facebook”, siendo
esta última una causa (no perfil)
a la cual se pueden unir las
personas.
Interfaz e Imagen
Definir un diseño coherente,
con una paleta de color y una
línea de dibujo que componen
la interfaz representativa
del sitio web.
Otros de los elementos a integrar, de modo más concreto y
directo, son:
• Crear una página con estructura de contenido fija que
presente la identidad del movimiento, posicionando el
feed de entradas en otra sección.
• Crear un slideshow en el “Home”, como una presentación
inmediata del perfil del movimiento.
• Crear un sidebar específico para el “Home”.
• Crear subsecciones en algunas páginas, reordenando el
contenido de manera apropiada.
• Implementar un sistema de calendarización con “Google
Calendar”
caPítulo i : "construcción de un argumento Visual" • estr ategia del Proyec to
22
Lo que sabemos hoy acerca de la salud en nuestro país, ha estado sujeto a diversos
cambios a través de la historia, y se hace necesario conocer esta secuencia de eventos
para comprender el desarrollo de las distintar reformas que han llevado a concretar la
que se encuentra en la actualidad.
Esto es un paso previo para conocer la formación de los organismos que se han creado
durante distintos períodos de la historia, y algunos de los cuales siguen vigentes hasta el
día de hoy. A partir de esto, se conforma la estructura que da forma al Sistema de Salud y
que muestra un panorama general de la conexión entre cada uno de ellos.
El Sector de la Salud en Chile
Servicios Locales de Salud
1886
Promulgación del Reglamento Orgánico de la Junta de Beneficencia.
Promulgación del Reglamento Orgánico de la Junta de Beneficencia.
1887
Creación de la Junta Nacional de Salubridad.
Asesora al Gobierno en materias de salubridad y organiza nacionalmente los desarrollos locales.
1892
Consejo de Higiene Pública asume las funciones de laJunta Nacional de Salubridad.
1917
Realización de un Congreso Nacional de sociedades benéficas e instituciones previsionales y sectoriales.
Estas dieron mayor organización y estructuración al sistema previsional y asistencial de salud.
1924
Creación del Ministerio de Higiene, Asistencia y Previsión Social.
Se establece el Seguro Obrero Obligatorio (ley 4.054).
La Caja de Seguro Obrero fue destinada a cubrir riesgos de enfermedad invalidez, vejez y muerte.
Reforma Neoliberal de los 80
1978 1981 19901979
Se introduce el procedimiento de pago por servicios FAP (Facturación por Atención Prestada) y FAPEM (Facturación por Atención Prestada en Establecimiento Municipal).
Comienza el proceso de municipalización de los Centros de Atención Primaria.
Creación de la Superintendencia de ISAPRE (Ley 18.933).
Fusión de los recursos del SNS y del SERMENA.
Redefinición de las funciones del Ministerio de Salud.
Creación del Fondo Nacional de Salud (FONASA), el Sistema Nacional de Servicios de Salud (SNSS), el Instituto de Salud Pública (ISP) y la Central de Abastecimientos del SNSS (CENABAST).
Financia la compra de insumos. Así, los hospitales reciben su financiamiento mediante sueldos, salarios y FAP
Hasta 1988 se traspasan al rededor del 70% de los establecimientos de atención primaria del SNSS a las municipalidades.
Fiscaliza las ISAPRES, vela por el cumplimiento de la normativa y promulga disposiciones relativas al funcionamiento del sector.
Desde esta fecha, los Gobiernos de la Concertación de Partidos por la Democracia han asumido la responsabilidad gubernamental de administrar el Sistema de Salud heredado.
Se establece la formación de las Instituciones de Salud Previsional (ISAPRE).
Esto permite al trabajador dependiente, la libre elección de optar por la compra de su seguro obligatorio de salud (puede optar por FONASA o ISAPRE).
Arquitectura de la Información
Maduración del
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
23
SNS y Predominio de Planificación Central
1938
Se dicta la Ley deMedicina Preventiva.
1942
Creación del Servicio Médico Nacional de Empleados (SERMENA).
Cubre al sector de empleados públicos y particulares.
Creación de la Dirección General de Protección a la Infancia y Adolescencia (PORTINFA).
Protección para niños y adolescenter.
1948
Construcción por Ley del Colegio Médico de Chile.
Formula políticas de salud.
1952
Creación del Servicio Nacional de Salud (SNS).
Unifica diversos organismos públicos que prestaban servicios de salud.
Responsable de atender aobreros, sus cargas e indigentes.
1964
Inicio de reformas sociales.
En salud, se invierte en centros asistenciales, formación y enrolamiento de personal, y extensión de cobertura geográfica.
1996 2004 200619971995
Se reemplaza el FAP por un sistema de pago asociado a diagnóstico (PAD), combinado con un sistema de pago prospectivo por prestación (PPP).
Creación del Plan de Acceso Universal con garantías Explícitas (Plan AUGE).
El Plan AUGE es reemplazado por el plan de Garantías Explícitas de Salud (GES).
Se reemplaza el FAPEM por un sistema capitalizado de acuerdo a población adscrita.
Promulgación del Estatutode la Atención Primaria.
Se corrigieron problemas del antiguo sistema de pago y se tiene como objetivo incentivar la eficiencia y calidad de los servicios entregados.
Entra en vigencia al año siguiente.
Garantiza la cobertura por parte de FONASA e ISAPRES.
Gobiernos de la Concertación de Partidos por la Democracia
Línea de Tiempo del Sistema de Salud Chileno
En esta cronología se muestra un resúmen del contexto
histórico y normativo del Sistema de Salud Chilen.
Desarrollo Social y Sistema de Salud
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
24
Para poder comprender la temática que aborda la Salud en Chile, es necesario realizar
una organización de los distintos elementos que conforman su estructura, entendiendo
esta última como un sistema en el que los agentes cumplen distintos roles.
Estructura del Sistema de Salud Chileno
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
25caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
26
Mapa de Navegación Anterior
Mapa de Navegación
Mapa de navegación del sitio web anterior de Salud un
Derecho.
1. Ingresar
2. Únetenos
3. Conócenos
3.1. Manifiesto
3.2. Nuestros Miembros
4. Aprendamos de Salud
4.1. Artículos de Aprendizaje (infografías, esquemas, etc)
5. Noticias
5.1. Artículos de Noticias
6. Publicación Abierta
6.1. Haz tu publicación
7. Actividades
7.1. Actividades Realizadas
7.2. Calendario
8. Descargas
8.1. Documentos
8.2. Videos
8.3. Gráfica de Campaña
9. Contacto
ÍNDICE DE CONTENIDO
Salud Un Derecho
Salud Un Derecho NoticiasManifiesto
Artículos(cat. noticias)
Inscríbete!
Artículos(cat. salud un
derecho)
Manifiesto Salud Un Derecho
Declaraciones
Artículos(cat.
declaraciones)
Documentos
Artículos(cat.
documentos)
Artículospor Categorías
Enlaces CategoríasArchivos por
Mes
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
27
Mapa de Navegación Propuesto
La organización y disposición de las secciones en el mapa de navegación anterior, no es
del todo óptima, pues mucho de sus contenidos están dispersos y repetidos en el sitio.
La siguiente propuesta reorganiza y crea nuevas secciones en las cuales el contenido se
dispone de manera tal que presenta un discurso coherente respecto a la información
que se desea mostrar.
En la nueva estructura del sitio web, se definen áreas de crecimiento identificadas en
tres niveles, los cuales indican los sectores en los que se iran agregando contenido, de
modo que el sitio tenga un aspecto orgánico, es decir, un espacio vivo que se alimente
y retroalimente de contenidos creados por los administradores, por los usuarios, por la
gente que visita el sitio y por otras fuentes de información.
Crecimiento Mínimo
Aumenta el listado de personas que siguen el movimiento,
dispuesto en una sola página.
Crecimiento Medio
El crecimiento es un poco más activo, pues son archivos,
eventos y artículos que se irán agregando.
Crecimiento Alto
Son las secciones más activas y de mayor crecimiento,
pues van incorporando contenidos y actualizando el sitio.
Salud Un Derecho
Únete Aquí
Crear Publicación
Contacto
El Movimiento Noticias Publicación Abierta Actividades CampañaLa Reforma
Ingresar
PublicacionesArtículos de NoticiasManifiesto Apoyan la Causa Archivos de
Campaña (descarga)
CalendarioArtículos de Actividades Realizadas
Agregar Evento
Editar
Eliminar
RSS
Desconectarse
Subir Archivo
Administrador y Usuario RegistradoAdministrador
Discutamosla Reforma
Construyamosla Reforma
Artículos de Discutamosla Reforma
Salud Un Derecho
Únete Aquí
Crear Publicación
Contacto
El Movimiento NoticiasPublicación
AbiertaActividades CampañaLa Reforma
Ingresar
PublicacionesArtículos de
NoticiasManifiesto
Apoyan la Causa Archivos de
Campaña (descarga)
CalendarioArtículos de Actividades Realizadas
Agregar Evento
Editar
Eliminar
RSS
Desconectarse
Subir Archivo
Administrador y Usuario Registrado
Administrador
Discutamosla Reforma
Construyamosla Reforma
Artículos de Discutamosla Reforma
AdministradorAdministrador y Usuario Registrado
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
28
La propuesta de navegación del sitio, se basa en aspectos de colaboración y participa-
ción, de modo que existen diferentes tipos de usuarios relacionados. Primero se piensa
en tres casos comunes posibles dentro de la navegación web; quien sólo observa, quien
participa y quien administra. A partir de esto, se determinan tres diferentes niveles de
accesibilidad, correspondientes a las acciones anteriores:
• Usuario No Registrado
• Usuario Registrado
• Administrador
Niveles de Accesibilidad
Nivel de Accesibilidad dentro del Sitio
Salud un Derecho
Acceder a cada una de las secciones y publicaciones que se realizan en el sitio. Escribir comentarios en el espacio deopinión de cada artículo.
Difundir un artículo publicado, a travésde Redes Sociales.
Descargar Material de Campaña.
1.
2.
3.
4.
Crear nuevas publicaciones; editar y borrar las propias creadas.
Editar y eliminar únicamente el contenido que ellos han publicado.
1.
2. Crear, editar y eliminar cualquierpágina, categoría o artículo.
Subir, editar y eliminar archivos.
Control sobre todas las opciones deadministración del sitio.
1.
2.
3.
Acceso Usuario No Registrado
+ +
+
Acceso Usuario Registrado Acceso Usuario Administrador
Acceso Usuario No Registrado Acceso Usuario No Registrado
Acceso Usuario Registrado
Niveles de Accesibilidad para Usuarios
Tipos de usuarios y sus respectivos permisos y acciones
dentro del sitio web. Esto permite tener una idea clara de
cómo será administrado el sitio en relación a la generación
de contenido.
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
29
Página de Inicio de Salud Un Derecho, en donde se muestran las distintas secciones de navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestas planteadas por elmovimiento, su visión y quienes loapoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre el tema de la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la Salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5Espacio de registro y calendarización de actividades y eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos. b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacercampaña y de descarga de materialdisponible, como por ejemplo afiches,logos, banners, etc.
[7.1] Archivos Descargables.
7
Salud Un Derecho
Únete Aquí
Crear Publicación
Contacto
El Movimiento NoticiasPublicación
AbiertaActividades CampañaLa Reforma
Ingresar
PublicacionesArtículos de
NoticiasManifiesto
Apoyan la Causa Archivos de
Campaña (descarga)
CalendarioArtículos de Actividades Realizadas
Agregar Evento
Editar
Eliminar
RSS
Desconectarse
Subir Archivo
Discutamosla Reforma
Construyamosla Reforma
Artículos de Discutamosla Reforma
1
1.7
1.1
1.2
1.3
1.4
1.5
1.6
2
2.1
3
3.1 3.2
4
4.12.2
5
5.1
7
7.1
6
6.1a
b
c
6.2
a
Secciones del Sitio y su Accesibilidad
Cada sección presenta contenidos diferentes, así como
también la accesibilidad de algunos es limitada. Se especifica
qué es cada sección y cuáles son las acciones de los usuarios
dentro de estas.
Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7
Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7
Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7Página de Inicio de Salud Un Derecho, endonde se muestran las distintas seccionesde navegación.
[1.1] Ingreso de las personas ya registradas.
[1.2] Sección de Registro de la persona que visita el sitio.
[1.3] Los Usuarios Registrados pueden crear una publicación, otorgándoles una categoría que define dónde se publica dentro del sitio.
[1.4] Los Usuarios Registrados pueden subir archivos.
[1.5] Salir de la sesión.
[1.6] Indicación de Contacto (mail) del movimiento.
[1.7] Enlaces a redes sociales y RSS.
1Página que cuenta acerca de las propuestasplanteadas por el movimiento, su visión yquienes lo apoyan.
[2.1] Declaración de las ideas y visión del movimiento.
[2.2] Muestra a las personas destacadas que apoyan los planteamientos de Salud Un Derecho.
2Espacio de opinión e informaciónacerca de la Reforma del Sistema deSalud, propuesta por el movimiento.
[3.1] Sección de discusión sobre temas y asuntos referentes a la Reforma Estructural de la Salud.
a. Artículos sobre la reforma que pueden ser comentados por quienes visitan el sitio.
[3.2] Sección privada donde se aportar en la elaboración colectiva de la Reforma Estructural de la Salud.
3Sector de publicación de noticias de actualidad, respecto a temas de Salud.
[4.1] Colección de artículos de distintas categorías, acerca del ámbito de la Salud que aporten una mirada y creen un espacio de discusión sobre los variados temas de actualidad.
4
Espacio de publicación abierta paraUsuarios Registrados en el sitio.
[5.1] Colección de Publicaciones de la categoría “Publicación Abierta” de caracter general acerca de la salud, como experiencias, sugerencias, articulos, etc., realizadas por los usuarios registrados.
5
Espacio de registro y calendarización de actividadesy eventos realizados por el movimiento.
[6.1] Calendario que contiene las actividades realizadas y programadas por los administradores.
a. Los administradores pueden calendarizar actividades y eventos.
b. Los administradores pueden editar la actividad o evento calendarizado.
c. Los administradores pueden eliminar actividades o eventos.
[6.2] Publicaciones de Actividades Realizadas que dejan registro y profundización de lo hecho.
6Página que expone el modo de hacer campañay de descarga de material disponible, como porejemplo afiches, logos, banners, etc.
[7.1] Archivos Descargables.
7
caPítulo i : "construcción de un argumento Visual" • arquitec tur a de l a información
30
Teniendo armada la estructura base de contenidos y definidos los roles de usuarios, el
siguiente paso corresponde a la disposición y articulación de estos en el diseño del sitio
web. En esta etapa es importante tomar en cuenta que hay un argumento por construir,
el cual da a entender el discurso del sitio mismo, acerca de lo que Salud Un Derecho
quiere dar a conocer.
La disposición de los elementos en la página, juega un rol fundamental en la comuni-
cación con el usuario, donde existe un momento inicial en el que se encuentra con la
presentación del argumento y de los aspectos que el sitio abarca. Para esto, se comienza
con la maquetación del sitio al crear los wireframes, en donde se definen las distintas
áreas de contenidos, sin mucho detalle y sólo como un esqueleto que servirá de guía al
momento de realizar el diseño visual.
La interfaz reúne los aspectos más detallados del diseño, pues se debe cuidar cada
elemento que se incorpore en ella. La elección de una paleta de color consecuente
y de una tipografía adecuada, es fundamental para llamar o no la atención de quien
visita el sitio.
El logo del movimiento fue diseñado previamente, y los permisos para modificarlo son
limitados, por lo que se mantiene la tipografía y se mejora la imagen, dándole un aspec-
to de corazón más redondeado y no tan alargado como el que se tenía.
Diseño Estructural y Visual
Cuerpo de Contenido
Contendrá toda la información de las distintas secciones,
publicaciones y contenido en general.
Header
Contendrá logo y buscador.
Barra de Menú
Contendrá las secciones principales del sitio.
Footer
Contendrá las mismas secciones de la barra de menú, más
un enlace a “Contacto” (mail to).
(Logo Original) (Logo Editado)
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
31
MEDIDAS
Sidebar
Contendrá enlace al registro, secciones de redes sociales,
últimas publicaciones y etiquetas de estas.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
32
Wireframes e Interfaz
HOME DEL SITIO
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
33caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
34
PÁGINA CON SUBPÁGINAS
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
35caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
36
PÁGINA DE NOTICIAS
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
37caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
38
PÁGINA DE ARTÍCULO
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
39caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
40
FORMULARIO DE CONTACTO
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
41caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
42
Para construir de manera simple y eficaz la construcción del sitio, utilizamos mapas de
divs para diagramar los sectores del sitio. Si bien Thesis define una cierta cantidad de
capas, se han creado otras acorde a la necesidad de cómo disponer el contenido en la
página.
HEADER Y BARRA DE MENÚ
El header, al igual que el menú, se mantiene de la misma manera en todas las secciones
del sitio. Consta sólo de dos partes importantes y visibles, que son el logo y el buscador.
Mapas de Divs
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
43
HOME
La página de home, es una página estática, con una estructura personalizada, pues se
agrega el slideshow y tres columnas. También posée un sidebar específico, diferente a
los de las otras páginas que mantienen la misma estructura.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
44
PÁGINA CON SUBPÁGINAS
Este tipo de página reemplaza de cierta forma al “menú desplegable”, y permite tener
un manejo más personalizado del contenido que quiera introducirse en ella. El sidebar
que de esta página, es el mismo para el resto de las secciones del sitio (excepto el home).
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
45
PÁGINA DE NOTICIAS
La página de noticias, muestra los resúmenes de las últimas publicaciones en filas, dos
por cada una de ellas.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
46
FOOTER
El footer también se mantiene de la misma manera en todas las secciones del sitio,
presentando los mismos enlaces que la barra de menú.
Color
La capa emocional del sitio, está dada principalmente por los colores. Estos tienen distin-
tos significados, que comunican o provocan emoción de manera sensorial (a través de
la vista), por lo que es fundamental definir una paleta de colores adecuada para aplicarla
al un sitio web.
Como se dijo anteriormente, “Salud Un Derecho” ya cuenta con un logo y ccon olores
definidos (naranjo y rojo), por lo que las demás elecciones de color deben tener una
relación armónica respecto a los colores base.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
47
Naranja:
• Representa entusiasmo, felicidad, atracción, creatividad, determinación, éxito, estí-
mulo y ánimo.
• Tiene alta visibilidad, por lo que es útil para captar atención y subrayar aspectos impor-
tantes.
• Se utiliza cuando se reclama participación o acción, también es ideal para botones.
• Utilizado en pequeñas extensiones o con acento, es un color de gran utilidad, pero
en grandes áreas es demasiado atrevido y puede crear una impresión impulsiva o
agresiva.
Rojo:
• Es el color más intenso en lo emocional, y cuando se lo usa como color secundario,
recomendable para motivar a las personas a tomar decisiones rápidas y a incrementar
las expectativas.
• Trae el texto o las imágenes con este color a primer plano, resaltándolas sobre el resto
de colores.
Azul:
• Cuando se utiliza junto a colores cálidos (amarillo, naranjo), la mezcla suele ser llama-
tiva. Puede ser recomendable para producir impacto.
• No es un color que “sature” la vista al ser utilizado en grandes áreas.
Café:
• Comunica credibilidad y estabilidad. Este es el color de la tierra y de la abundancia en
la naturaleza.
• Excelente para transmitir información, ya que crea un ambiente neutral para discu-
siones abiertas.
Beige:
• Como el café, también es color de tierra relajante, reductor del estrés, que invita a la
comunicación.
• Utilizado para reconfortar a otros o para transmitir información.
Gris:
• Los grises medio-claros tienen poca atracción visual, siendo idóneos para fondos o
elementos de relleno que no aporten información al espectador.
• Se asocia a la neutralidad absoluta, discreción y equilibrio.
En la paleta de colores definida predominan los tonos cálidos, acompañados de un color
frío y un color neutro. Se han utilizan gradaciones de algunos colores, siguiendo la línea
de tonalidades.
Selección del Color
Del logo, el único color que se mantiene en la paleta de
colores, es el naranjo, pues el rojo se reemplaza por un color
más terracota; más oscuro y menos fuerte para la vista al
tomar tonalidades del café.
El café no fue una elección directa, ya que se prefirió
algo más neutro, un color más suave y que tuviera directa
relación con otros colores de la paleta. En este caso, el beige
toma matices del café, que también toma el terracota, y del
amarillo presente en el naranjo.
Los colores fríos y neutros, como el celeste y el gris, son el
toque que da equilibro; uno que es muy discreto y otro que
destaca.
Colores Base
Gradaciones
#CCCCCC
#F0F0F0
#DDDDDD
#BC9838
#E6D6AA
#D4B96F
#B6431C
#E47A56
#D54E21
#EA690B
#FF9933
#2396CB
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
48
Tipografía
Las decisiones tipográficas se hicieron a partir de fuentes abiertas en la red, para evitar
incompatibilidades y complicaciones al utilizar tipografías diferentes a las web safe. Para
esto se recurrió a Google Font Directory, que ofrece un listado de fuentes para el uso
liberado de ellas.
De las 28 fuentes que Google ofrece, utilizamos sólo dos, IM Fell English y Droid Sans;
la primera se definió para los títulos principales, y la segunda para títulos secundarios,
texto y enlaces.
El trazo de “IM Fell English”, emula un trazo a mano alzada, una tipografía dibujada,
manteniendo concordancia entre la línea de dibujo del video y del sitio, pero caer en un
aspecto demasiado informal.
Fuente IM Fell English
Diseñada por Igino Marini, en su versión 3.00.
Posée dos variantes; regular y cursiva.
Fuente Droid Sans
Diseñada por Steve Matteson, en su versión 1.00.
Posée dos variantes; regular y negrita. La variación a cursiva
en algunos casos del sitio, es modificada por las cascadas
de estilo.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
49
Las jerarquías definidas en el sitio varían tanto en tamaño como en color. Para los títulos
se decide utilizar el color #D54E21, mientras que para los enlaces y otros, se utiliza el
color #2396CB.
La relación jerárquica está dada directamente por la fuente, como puede apreciarse en
la imagen superior, los títulos principales utilizan “IM Fell English”, mientras que el texto
de párrafos y secciones menores, utilizan “Droid Sans”.
En una sección específica, se utiliza la fuente “Georgia” para los textos breves introducto-
rios de las subpáginas. No se utiliza “IM Fell English“ ya que, a tamaño pequeño y cursiva,
no favorece la legibilidad del texto.
IM Fell English 30 px
IM Fell English 25 px
IM Fell English 18 px
Droid Sans 12 px
Droid Sans 14 px
Droid Sans 14 px
Droid Sans 12 px
Droid Sans 11 px
Utilización de fuente tipográfica “Georgia”
Esta imagen es un ejemplo del párrafo introductorio en una
subpágina, en donde se utiliza la fuente “Georgia”, en su
variante cursiva.
caPítulo i : "construcción de un argumento Visual" • diseño estruc tur al y Visual
50
Para el desarrollo de una idea, se hace imprescindible la organización y estructuración
de sus partes, que en este caso, será lo que transforme la “idea” en el “argumento” de lo
que se desea expresar y dar a conocer.
El texto de las “Cuatro Figuras Maestras” (Four Master Tropes) de Kenneth Burke, indica
que metáfora, metonimia, sinécdoque e ironía son recursos para descubrir y describir
la verdad, es decir, son recursos que se utilizan como base para la construcción de un
argumento lógico y consecuente.
Construcción del Argumento
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
51
Metáfora
La metáfora en relación a la perspectiva, hace ver una cosa
desde el punto de vista de otra, por lo que para nuestro
argumento, se aplica a crear distintas vivencias de una
persona (dentro del área de la salud), las que son relatadas y
que aluden a comparaciones dentro de las mismas.
Metonimia
La metonimia en relación a la reducción, transmite la idea
de lo tangible (o corpóreo) a lo intangible (o incorpóreo) y
viceversa, lo cual se aplica a ciertos momentos o situaciones,
que son representados por elementos concretos.
Sinécdoque
La sinécdoque en relación a la representación, siendo
aplicada en el argumento, como una forma de traer distintas
realidades sociales a través de personajes, que serán el
elemento mediante el cual se representarán.
Ironía
Finalmente, la ironía en relación a la dialéctica, se aplica
en la argumentación como forma de leve exageración y
desarrollo de un drama, el cual llama al sentido de alerta y
de interés.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
52
Definición del Guión
La construcción del guión de Salud Un Derecho es fundamental para conformar la tota-
lidad del argumento, para mostrar y dar a entender dentro del sitio web, la postura de
este movimiento frente a la complejidad del Sistema de Salud Chileno.
Para esto, es necesario tomar ciertos elementos clave y comenzar a vincularlos coheren-
temente entre sí, logrando crear una estructura base a partir de la cual se desprende un
“relato” acerca de lo que el sitio va a contar.
El siguiente paso luego de construído el guión, es llevarlo desde su estado estructural
a un estado gráfico y comprensible para todos, transformándose así en una animación.
Esta apunta a una situación emocional más que explicativa (pues para esto se encuentra
la sección “Aprendamos de Salud”) ya que el “enganche” que se trata de lograr, es tomar
un caso cotidiano en la vida de las personas, para que se sientan identificadas y se inte-
resen en lo que el sitio y el movimiento les está mostrando.
Si bien esto responde a dirigirse (de modo específico) a un tipo de público, los otros no
están excentos, ya que si bien no es una vivencia propia o cotidiana, muestra la diferencia
entre un sistema y otro, dejando clara la injusticia ocurrida y su evidente desigualdad.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
53
Cruzar información sobre Salud Un Derecho y sobre el
Sistema de Salud Chileno, es fundamental para dejar en
claro cual será el discurso a entregar. Así, se articulan los
contenidos tomando en cuenta los aspectos puntuales que
se quieren destacar y recalcar.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
54
Construcción de Animación
HISTORIA: GUIÓN VIDEO PRESENTACIÓN “SALUD UN DERECHO”
“Cuando llevé mi niño al consultorio con tos y fiebre, estuve todo el día ahí para que
después el médico me lo atendiera en 3 minutos. Pero cuando mi patrona lleva su
guagua al pediatra, va y solo espera un par de minutos para ser atendida, y el doctor se
da su tiempo pa’ revisarla.
En el hospital, cuando el doctor me recetó un remedio, fui a buscarlo en la farmacia y
me dijeron “Señora Carmen, no tenemos más de ése, lo tendría que comprar afuera”. Yo
me pregunto ¿Por qué los hospitales ahora no tienen plata para nuestros remedios? Si yo
no tengo culpa de haberme enfermado, o de no tener pa’ comprar.
Como mi vecina, que está hace más de un año con una hernia y nunca la operan, en el
hospital le dicen “Lo suyo puede esperar, hay otros más graves”, y ella ya ni puede hacer
las cosas de la casa. Entonces yo pienso ¿Por qué algunos pueden elegir la fecha de su
operación como si fueran unas vacaciones, y el que no puede pagar tiene que esperar
años? Allá en el barrio alto, donde trabajo, veo clínicas privadas que parecen hoteles 5
estrellas… yo no pido tanto, sólo pido que me traten bien, y me den lo que necesito!
Pero igual una piensa: “Algo debe estar mal si es tan diferente un hospital de una clínica…
¿o no?”
Y al final, de mi salud, ¿quién se preocupa?
Salud Un Derecho nació en Chile como un movimiento político y social, y su razón de
ser es el restablecimiento de la solidaridad como el pilar fundamental del sistema de
salud chileno. Buscamos que exista un sistema de salud igual para todos en nuestro país,
y queremos generar conciencia en la sociedad civil sobre los derechos que emanan de
su condición humana. Así, Salud Un Derecho busca la promoción de la salud para todos,
especialmente de las personas, familias, grupos y comunidades que viven en condicio-
nes de pobreza y marginalidad.
Luchemos por una reforma estructural de la salud! Sé parte de este sueño. Comprométete.
La Salud es un derecho!!!”
STORYBORAD
La definición de las partes del video introductorio de Salud Un Derecho, crea una estruc-
tura guía para llevar a cabo la construcción de la animación determinando escenas
claves para el desarrollo de ideas y situaciones, de modo que se reitere el argumento,
enfocado desde distintos planos.
9. Señora Carmen dice lo que pide y analiza que algo está mal en el Sistema de Salud.
13. ¡Luchemos por una Reforma Estructural de la Salud! Se parte de este sueño, comprométete ¡La salud es un derecho!
5. Señora Carmen reflexiona acerca de su situación en el Hospital y con los pocos recursos con los que este cuenta.
1. La Sra. Carmen lleva a su hija al Consultorio ya que tiene tos y fiebre, pero debe esperar horas para ser atendida.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
55
11. Aparece el Logo de Salud Un Derecho. Se cuenta parte de lo que trata este movimiento.
12. Se dicen los propósitos que plantea el movimiento Salud Un Derecho y a quienes va enfocada esta Reforma Estructural del Sistema de Salud.
7. Señora Carmen reflexiona acerca de la diferencia de tiempo de espera de una operación entre un Hospital Públlico y uno Privado.
8. Señora Carmen compara las Clínicas Privadas con hoteles cinco estrellas.
3. El doctor le receta un remedio a la Señora Carmen. 4. En la Farmacia le indican que no cuentan con el medicamento y que debe ir a comprarlo afuera.
14. Finaliza el video mostrando el sitio web, invitando a unirse al movimiento para cumplir una meta.
10. Señora Carmen pregunta: “¿Y al final de mi salud, quien se preocupa?”.
6. La vecina de la Sra. Carmen está hace más de un año con una hernia y nunca la operan, en el Hospital le dicen “lo suyo puede esperar”.
2. La patrona de la Sra. Carmen lleva a su bebé al Médico y solo tiene que esperar unos minutos para ser atendida.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
56
PERSONAJES Y ELEMENTOS
El diseño de los personajes y elementos para la animación (y también para elementos
dentro del sitio) se define como un trazo a mano alzada, evitando caer en un diseño
iconizado, pues se enfoca en la parte emocional del usuario y receptor.
Personajes
Protagonistas, sus estados y extras presentes en la animación,
en la cual se les aplica sombra para sobresalir en las
escenografías.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
57
Objetos y Escenografías
Elementos y escenas principales utilizadas en las
composiciones de la animación.
caPítulo i : "construcción de un argumento Visual" • construcción del argumento
58
La plataforma sobre la cual se construye el sitio web de Salud Un Derecho, es “WordPress”,
y el template específico a utilizar es “Thesis Theme”. En esta sección de programación,
se modifican tanto cascadas de estilo como archivos .php, dando forma al espacio en el
cual se dispondrá el contenido, de acuerdo a la etapa de diseño estructural (wireframes)
y visual (interfaz).
Al momento de trabajar directamente en la programación del sitio, se hace indispen-
sable buscar plugins que faciliten y complementen el diseño propuesto. Para esto, la
búsqueda comienza sabiendo exactamente qué es lo que necesitamos, de modo que se
evite la descarga innecesaria de plugins.
Dentro del sitio, existen múltiples aspectos que deben cubrirse, como por ejemplo: para
los usuarios, el formulario de registro para un nuevo miembro, el rol que a este se le
asigna y los permisos y capacidades que debiese tener; y en el área de las redes sociales,
la existencia de bookmarks y un espacio del sidebar para Twitter, RSS y Facebook, entre
otros.
• Akismet: Chequea los comentarios para ver si son o no spams.
• Category Reminder: Muestra una “nube de etiquetas” personalizada en el sidebar.
• Configurable Tag Cloud: Añade un globo gigante que cambia de color, indicando la
sección de categorías justo debajo del botón de publicación para no olvidar agregarlas.
• GET POSTS: Añade una etiqueta de código corto en cualquier página estática o
entrada, y se mostrará una lista de mensajes utilizando el código de plantilla [get_
posts].
• Google Analytics for WordPress: Añade Google Analytics en el blog de WordPress,
añadiendo un montón de características como, por ejemplo, variables personalizadas
y clickout automático, y el seguimiento de descarga.
• Latest Post by Category: Devuelve una lista de sus últimos mensajes, organizados por
categoría.
• Levels2Categories2: Permite crear una relación entre el nivel de usuario y las
categorías, así solo los usuarios con definido nivel pueden postear en las categoría
elegida.
• Raw HTML Capability: Permite ingresar HTML puro en los mensajes. También puede
activar y desactivar “comillas inteligentes” y otros formatos automáticos en función
de cada post.
• Register Pluz Redux: Mejora el proceso de registro de usuario con una personalización
completa y opciones adicionales de administración.
Plugins
Configuración e Implementación
WordPress
Es un sistema de gestión de contenido enfocado en la
creación de blogs, que nació del deseo de construir un
sistema de publicación personal, elegante y con una buena
arquitectura, colocando especial atención a la estética,
estándares web, y usabilidad.
Fuente: http://es.wikipedia.org/wiki/WordPress
Thesis Theme
Es un framework que gestiona la plantilla de WordPress,
ofrece diferentes opciones de diseño que pueden ser
administradas fácilmente. Da espacio para “custom.css” y
“custom_functions.php”, haciendo versátil personalizar el
diseño al momento de la programación.
caPítulo i : "construcción de un argumento Visual" • configur ación e imPlementación
59
• Role Scoper: Sistema de gestión de contenidos (CMS) que otorga permisos para
leer y editar, restringir contenido específico y crea, complementa y edita roles de
WordPress.
• Share This: Permite que los visitantes compartan un post o una página con los demás.
Soporta correo electrónico y posteos a los sitios con bookmarks sociales.
• Social Profiles Widget: Permite insertar íconos de perfiles sociales en el sidebar a
través de widgets.
• Thesis OpenHook: Permite insertar contenido arbitrario en los numerosos hooks que
el tema Thesis proporciona.
• Widgets Reloaded: Reemplaza varios de los widgets que vienen por defecto en
WordPress con versiones que permiten mayor control y opciones para personalizarlos,
además pueden ser utilizados repetidas veces.
• Tweet Blender: Proporciona varios widgets de Twitter, como mostrar los propios
tweets, mostrar tweets relacionados con las etiquetas de mensaje, mostrar tweets para
listas de Twitter, mostrar tweets de hashtags y tweets favoritos, entre otros.
• WordPress Importer: Importa posts, páginas, comentarios, campos personalizados,
categorías, y tags desde un archivo de exportación de WordPress.
• WP Filter Post Category: Permite elegir las categorías de las entradas que se mostrarán
en el home, escondiendo las que no se seleccionen.
Otra de las implementaciones hechas en el sitio web, fue la incorporación de un
“Slideshow” en el home, en el cual se ubica la animación que explica “qué es Salud Un
Derecho”, en la primera pestaña, “cuál es su objetivo” en la segunda y “cómo contribuir”
en la tercera. De este modo, se optimiza el espacio de la página, en comparación a lo
que hubiese sido desplegar estas secciones dentro de la misma.
Los títulos de las pestañas se ubicaron en la parte inferior del recuadro y su apariencia
fue modificada mediante la cascada de estilo correspondiente, dándole un aspecto más
ligero; también fueron eliminados los botones “anterior” y “siguiente”, pues el hecho de
ser sólo tres pestañas hace rápida la selección de contenido.
Elementos Integrados
Slideshow
Presentación de los tres momentos del slideshow ubicado
en el home del sitio web: video e imágenes.
caPítulo i : "construcción de un argumento Visual" • configur ación e imPlementación
61
Cierre Primer Capítulo
El proceso de trabajo en esta etapa, abarcó distintos aspectos de estudio y desarrollo, los
cuales convergeron en un punto crucial para concluir el proyecto; este es, la creación de
un argumento visual en un espacio web concreto.
La realización del video introductorio para Salud Un Derecho, se ha terminado para
completar el elemento faltante dentro del sitio, esta es la pieza que da forma al argu-
mento globar y que presenta al movimiento de manera clara, dando sentido al discurso.
A pesar de haber producido una sola animación, se han puesto a disposición, de los inte-
grantes de Salud Un Derecho, los archivos que la construyen para que puedan tomarlos
y crear otros videos, con el fin de entregar argumentos en distintos casos, que transmitan
al público, información e ideas claras y precisas. Lo estimado, es que se siga trabajando
con la línea de diseño implementada.
Si bien se ha concretado la construcción del video y del template del sitio, su administra-
ción se encuentra en manos de los integrantes del movimiento, por lo que sucede algo
similar a lo que pasa con el video; el sitio queda sujeto a cambios de contenido, más que
de diseño, según lo que ellos estimen conveniente para el desarrollo de sus necesidades.
caPítulo i : "construcción de un argumento Visual" • cierre Primer caPítulo
63
Capítulo IISistema Visual de Orientación paraHospitalesEstudio y Diseño deComponentes Gráficos
65
Introducción
En la segunda etapa de Titulación se abarca un nuevo tema, presentando un cambio con
relación al proyecto anterior, pues el tema tratante en este período, se orienta a la crea-
ción de un producto de diseño tangible. En este caso, el medio deja de ser una platafor-
ma web para ser ahora un lugar y un objeto físico: el Hospital de Quilpué y su señalética.
A pesar de ser dos proyectos que abarcan asuntos diferentes y que parecieran ser distan-
tes el uno del otro en términos de materia, existe un hilo conector entre ambos casos de
estudio que reside en la creación de la “comunicación visual”.
Con esto tenemos que en el proyecto de “Salud un Derecho” se construye un argu-
mento visual, en el que se da a conocer este grupo como entidad y donde comunica
sus metas e ideales, invitando a las personas a unírseles; por otro lado, en el Hospital de
Quilpué se diseña un sistema visual de orientación que construye el viaje del usuario
(paciente, funcionario, acompañante) desde que llega al lugar hasta que lo deja, actuan-
do como un canal de comunicación entre él y los espacios físicos que conforman los
distintos servicios del Hospital.
La idea del anteproyecto se divide en dos ciclos; Fase de Diseño y Fase Constructiva.
La primera corresponde a esta etapa de la Titulación, en la cual se desarrolla el estudio
y planificación del Sistema Visual de Orientación, y donde se construye una tipografía
llamada “Hospital”, exclusiva para su uso. La segunda corresponde a la etapa de Titulación
3, en la cual se abarcará el tema del prototipado con materiales y puestas en escena,
además de la entrega del manual gráfico a la directiva del Hospital de Quilpué como
documentación de un anteproyecto que puedan implementar en sus instalaciones.
Las áreas de estudio presentes en este capítulo abarcan aspectos de la realidad vivida por
los usuarios, las condiciones creativas y funcionales que requiere un sistema de orienta-
ción exitoso, como también aspectos más finos que se aplican en la abstracción de un
símbolo y la construcción de un caracter, para que juntos conformen codigo coherente
y legible para el usuario.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • introducción
67
Estudio y Análisis
Las sondas nos permiten descubrir diferentes cosas respecto a los sueños, percepciones,
experiencias y vivencias de las personas, ya se componen de elementos que recolectan
información, que ayuda a responder diversas preguntas en una investigación.
Los objetos de diseño no son solo productos tangibles que se aplican a modernas tecno-
logías, sino que también son experiencias, funciones y servicios que deben ser útiles,
usables y deseables. Por ello el diseño se ha vuelto complejo, porque aplica a su produc-
to la experiencia del usuario que debe ser previamente estudiada.
Introducción a la Investigación del Usuario: Sondas
Estudio de Sondas:
Para abarcar el proyecto, se necesita de una investigación del
usuario, por ello que se estudian las sondas como método
de compilación de información del usuarios y metodologías
de pensamiento.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
68 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
A partir de la materia acerca de las sondas, nos enfocamos a generar una investigación
sobre el usuario (funcionarios, pacientes, acompañantes, visitas, etc). Para esto, debemos
describir qué es lo que necesitamos saber en pos de descubrir algo y documentarlo.
El primer paso que inicia el proceso, es definir en torno a qué son las preguntas; en este
caso es saber qué proceso se necesita para orientar a las personas del hospital, cómo
ubicarlas dentro del flujo abstracto y del lugar físico. A partir de esto es posible comenzar
a definir los ítems de las actividades que se quieren realizar.
Teniendo los ítems claros, se comienzan a construir las actividades respectivas. Es impor-
tante tener en cuenta que estas deben ser dinámicas y no demasiado extensas, pues
la idea es que el usuario no pierda el interés y la continuidad durante el desarrollo de
estas, ya que además puede generar una conversación entre diseñador (en este caso) y
usuario, un diálogo válido que aporte a la investigación del proyecto y al desarrollo del
diseño.
ESTRUCTURA DE LA ACTIVIDAD
1. Cómo se mueven las personas en el espacio y cómo se ubican dentro de este.
1.1. Actividad con mapa
a. Ubíquese usted dentro del mapa
b. Ubique el punto a donde se dirige, anote el lugar.
c. Dibuje el recorrido del lugar al que se dirige.
d. Señalice y nombre los lugares que conoce.
e. Coloque puntos críticos para la orientación.
2. Cuál es la percepción que se tiene del hospital, qué refleja.
2.1. Describa el hospital en 3 palabras.
2.2. ¿Le gusta su hospital? Si su respuesta es “sí”, ¿qué cosas le gustan de él?
2.3. Nombre aspectos críticos del hospital y cómo podrían solucionarse.
2.4. ¿Cómo considera la señalización dentro del hospital? Encierre su alternativa
a. muy bueno
b. bueno
c. malo
d. muy malo
3. Cuáles son los modos más frecuentes para orientarse.
3.1. Ordene de 1 al 5 los modos más frecuentes para orientarse; tomar el “1” como
lo mejor (oficina de informaciones, señalética, personal administrativo, personal
médico, guardia).
3.2. Explique la decisión de los números 1 y 5.
Diseño para actividades del usuario
69
4. Cuáles son las características o cualidades de un hospital idóneo.
4.1. Describa en 3 palabras su hospital idóneo.
4.2. ¿Cuál es la imagen que le gustaría que reflejara el hospital?
5. ¿Cuál es la rutina del usuario al llegar y entrar en el hospital?
5.1. Línea de tiempo. Marque con una cruz su rutina desde que va al hospital hasta
que sale de él.
5.2. Me voy al hospital en:
a. automóvil propio
b. locomoción colectiva
c. bicicleta
d. caminando
5.3. Llegando al hospital:
a. sé exactamente a dónde debo ir
b. no sé a dónde debo ir
5.4. Me guío gracias a:
a. la señalética del hospital
b. OIRS
c. el personal médico
d. el personal administrativo
e. guardia
f. otro
5.5. Una vez dentro del hospital:
a. me ubico perfectamente
b. me pierdo con facilidad
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
70 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
Consultorio Adosado de Especialidades
Hospital de Quilpué
Datos de Usuarios 1 Complete el siguiente mapa
a) Ubiquese usted dentro del mapa
b) Ubique el punto a donde se dirige, anote el lugar:
c) Dibuje el recorrido del lugar al que se dirigie
e) Señalice y nombre los lugares que conoce
f) Coloque puntos críticos para la orientación
Nivel -1
Sexo
Femenino
Masculino
Funcionario
Paciente
Acompañante
Edad
- 25
25 a 50
50 a 75
+ 75
Relacióncon el Hospital
Baja
Media
Alta
Frecuencia devisita al Hospital
Consultorio Adosado de Especialidades
Hospital de Quilpué
Datos de Usuarios 1 Complete el siguiente mapa
a) Ubiquese usted dentro del mapa
b) Ubique el punto a donde se dirige, anote el lugar:
c) Dibuje el recorrido del lugar al que se dirigie
e) Señalice y nombre los lugares que conoce
f) Coloque puntos críticos para la orientación
Nivel -1
Sexo
Femenino
Masculino
Funcionario
Paciente
Acompañante
Edad
- 25
25 a 50
50 a 75
+ 75
Relacióncon el Hospital
Baja
Media
Alta
Frecuencia devisita al Hospital
71
Actividad 1
Mapa de las plantas del hospital que permite a las personas
ubicarse y expresar sus ideas dentro de él.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
Consultorio Adosado de Especialidades
Hospital de Quilpué
Datos de Usuarios 1 Complete el siguiente mapa
a) Ubiquese usted dentro del mapa
b) Ubique el punto a donde se dirige, anote el lugar:
c) Dibuje el recorrido del lugar al que se dirigie
e) Señalice y nombre los lugares que conoce
f) Coloque puntos críticos para la orientación
Nivel -1
Sexo
Femenino
Masculino
Funcionario
Paciente
Acompañante
Edad
- 25
25 a 50
50 a 75
+ 75
Relacióncon el Hospital
Baja
Media
Alta
Frecuencia devisita al Hospital
72
Actividad 2-3-4
Sección de narración e indicación sobre algunos temas
referentes al hospital.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
2 Cuál es la percepción que se tiene del hospital, qué refleja. 3 Cuáles son los modos más frecuentes para orientarse.
4 Cuáles son las características o cualidades de un hospital idóneo.
a) Describa el hospital en 3 palabras a) Ordene del 1 al 5 los modos más frecuentes para orientarse (tomar el “1” como lo mejor).
b) Explique la desición de los números 1 y 5:
a) Describa en 3 palabras su hospital idóneo:
b) ¿Cuál es la imagen que le gustaría que reflejara el hospital?
b) ¿Le gusta su hospital? Si su respuesta es “sí”, ¿Qué cosas le gustan de él?
c) Nombre aspectos críticos del hospital y cómo estos podrían solucionarse:
Muy buena Buena Muy malaMala
d) ¿Cómo considera la señalización dentro del hospital? Encierre su alternativa.
GuardiaPersonalAdministrativo
PersonalMédico
SeñaléticaOficina deInformaciones
73
Actividad 5
Indicación del recorrido-ubicación de la persona en el
hospital.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
5 Marque con una cruz su rutina desde que va al hospital hasta que sale de él
automóvil propio
locomoción colectiva
bicicleta
caminando
1 2 3 4
me voy alhospital en...
llegando al hospital...
me guío gracias a...
una vez dentrodel hospital...
Comparta su experienciaen cada uno de los puntos
Guardia
el personal administrativo
el personalmédico
la señaléticadel hospital
la oficina deinformaciones (OIRS)
otro...
no sé a dóndedebo ir
sé exactamente adónde debo ir
me pierdocon facilidad
me ubico perfectamente
74
El análisis de las actividades busca entrever lo que los usuarios y funcionarios esperan,
desean y sueñan del hospital, así como también conocer su postura frente a algunas
situaciones, su orientación dentro de este edificio. Algunos de los ítems pueden ser muy
subjetivos, pero esto da la posibilidad de que las personas expresen su punto de vista, sus
pensamientos.
• La actividad con el mapa muestra claramente que los funcionarios conocen bastante
mejor los edificios que la mayoría de los pacientes, aunque en ciertos casos el CAE
y el Hospital se ven totalmente independientes el uno del otro. Otro aspecto de
importancia que se observó fueron los puntos críticos dentro del hospital, puntos
de decisión y de indicación que señalaron las personas, claves para el diseño de
wayfinding.
• Las actividades respecto a los modos de orientación dan un claro acerca de la señalética
y de primera fuente de la que los usuarios se informan. El orden de preferencia y
funcionalidad es el siguiente:
1. Guardia - Es la primera persona con la que se encuentran y quien les indica y
aclara dudas respecto a la ubicación.
2. Oficina de Informaciones (OIRS) - Es la segunda opción al preguntar por lugares
y procesos dentro del hospital.
3. Señalética - Es la tercera opción que sólo sirve como referencia para orientarse,
pero que ha sido criticada no en cuanto a su función, sino en cuanto a su
ubicación, aspecto y relación con el hospital.
• Las actividades respecto a asuntos más subjetivos permiten ver que a las personas
les gusta el hospital en relación a la atención directa, pero aún así piensan y desean
un hospital renovado, más tecnológico, con más espacios y recursos, y con atención
personalizada, más cercana. Todos aspectos que les gustarían ver reflejados en el
Hospital de Quilpué.
Podemos decir que las limitaciones financieras del hospital, impiden muchos de los
sueños que tienen las personas respecto a la infraestructura y tecnología, pero se puede
avanzar con un sistema de orientación ubicado en puntos clave, mejorando el flujo
tanto del personal como de los pacientes, acompañantes y visitantes. Es importante que
exista una persona a la cual se le puedan hacer consultas respecto de una ubicación,
pero de ahí en adelante el camino se hace por mera intuición de lo señalado; es aquí
donde el sistema de orientación ayudará a facilitar este recorrido.
Análisis de las Actividades
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
75
El Hospital de Quilpué tiene un evidente problema en cuanto a la señalética, pues
además de carencia en la parte estética, también comprende una falta de lógica y
funcionalidad.
Lo primero a observar es la cantidad de diferentes colores, formas y tipos de señaléticas
que pretenden formar un asunto continuo y unificado, pero este se ve interrumpido por
la variedad y poca correspondencia entre ellas. Lo segundo se enfoca a la ineficiencia
de las indicaciones dentro y fuera del recinto, haciendo difícil la ubicación de la persona
en el lugar.
Observaciones en Terreno
Actuales Tipologías Hospital de Quilpué
La variedad de tipologías no alcanza a construir una
continuidad y lógica para obtener una optima lecturabilidad
de las variadas jerarquías de rótulos, afectando también la
carente imagen corporativa que puede tener un hospital.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
76
Para comenzar la creación y el desarrollo del sistema de orientación, es necesario
comprender aspectos más generales respecto a la señalética que no dejan de ser impor-
tantes. Con esto nos referimos al conocimiento y entendimiento del “wayfinding”.
El wayfinding es una metodología de organización de señalética (o indicadores) que
sirve para guiar a las personas en diferentes espacios que la rodeen, utilizando entre
algunas de sus herramientas, los signos y símbolos. La función de estos últimos es iden-
tificar, informar, dirigir, restringir o permitir en la señalética, haciéndola más accesible y
ofreciendo una mejor experiencia de manera exitosa. Otros aspectos que juegan un rol
importante en el wayfinding, son la luz, el color, los materiales y los senderos, elementos
que muchas veces condicionan las decisiones de diseño.
El hospital ya es un entorno complejo, y nos hemos percatado de que en muchos
casos la señalética no es suficiente, o no es lo suficientemente clara. Para mejorar esta
situación, es bueno considerar algunos principios del wayfinding, tales como:
La lógica del sitio:
• Comprender cómo se dividen y seccionan los espacios.
• Saber qué corresponde a cada cosa.
Los sistemas dentro del entorno:
• Aspectos como el nombrar, enumerar y organizar las áreas, zonas, sitios, etc.
• Crear jerarquías claras y lógicas que ayuden a los usuarios a recordar y usar la
nomenclatura.
La orientación:
• Utilizar mapas direccionales, orientativos (“usted está aquí”)
• Definir diagramas simples, mostrando los detalles suficientes para no complejizar los
mapa.
Elementos de señalización:
• Símbolos y signos.
• Mecanismos gráficos relacionados con el entorno mismo (paredes y pisos).
Habilidades del usuario:
• Tomar en cuenta las necesidades especiales, las minorías culturales y étnicas, y la
tercera edad.
• Considerar a los funcionarios y usuarios frecuentes, las limitaciones de vista (por
ejemplo, al utilizar color, el daltonismo) y movimiento.
Wayfinding
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
77
Interpretación Cognitiva
Ejemplo de un esquema cognitivo de un mapa geográfico.
Consistencia:
• Todas las formas de información pública deben ser consistentes y claras.
• La explicación de cómo funcionan los signos (de la señalética), ayudan al equipo
(funcionarios) a dar indicaciones más claras y útiles.
• Los términos utilizados deben ser reconocidos y entendidos por todas las personas.
Para pensar en un sistema de orientación eficiente para estructuras complejas como el
hospital, es también importante basarse en el comportamiento de las personas,ya que
estas interpretan de manera cognitiva los espacios.
Las siguientes características debería considerarse en un sistema de señalización:
• No les hace pensar.
• Crean un sistema de comunicación visual completo, claro y consistente, con mensajes
concisos.
• Muestra solo lo que se necesita.
• Muestra información relevante sobre el espacio, la ubicación y ruta de navegación.
• Elimina el exceso de información.
• Elimina elementos innecesarios para crear un entorno visual.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
78
ACCESIBILIDAD COGNITIVA
La accesibilidad al medio urbano requiere que la ciudad y sus servicios se organicen, de
modo que permita a cualquier persona poder desenvolverse en ellos de manera inde-
pendiente, segura y natural.
Según el Concepto Europeo de Accesibilidad (CEAPAT, 1996), la accesibilidad es una
característica básica del entorno construido. Es la condición que posibilita el llegar,
entrar, salir y utilizar las casas, las tiendas, los teatros, los parques y los lugares de trabajo.
La accesibilidad permite a las personas participar en las actividades sociales y económi-
cas para las que ha concebido el entorno construido.
Para obtener accesibilidad en el medio físico, los sistemas que se establezcan deben
respetar los siguientes requisitos:
• Crear sistemas sencillos y entendibles para todo tipo de usuarios.
• Administrar y facilitar la información en los puntos críticos mediante una buena
indicación.
• Utilizar símbolos y signos adecuados en la señalización.
Las capacidades cognitivas son aquellas que se refieren a lo relacionado con el proce-
samiento de la información, entre ellas están: atención, percepción, memoria, resolu-
ción de problemas, comprensión y establecimiento de analogías. La idea es ocupar estas
capacidades para el desarrollo de un sistema de orientación basado en la experiencia
del usuario.
En relación al wayfinding, lo cognitivo se sitúa en uno de sus procesos, en donde las
personas deben realizar acciones cognitivas (como la toma y ejecución de decisiones)
para desplazarse en los espacios. Si la persona está en un lugar desconocido, se debe
facilitar la estrategia cognitiva para que logre escoger correctamente qué camino seguir,
posibilitando la accesibilidad cognitiva dentro del espacio.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • estudio y análisis
79
Analizando las actividades, se puede dar cuenta de tres áreas esenciales que deben ser
intervenidas para crear un nuevo Sistema Visual de Orientación que acompañe a la
persona en su viaje dentro del hospital: contenido, espacialidad e innovación.
Diseño Estratégico del SVO
Esquema SVO
Se muestra lo que se abarca en cada área, cual es el enfoque
que debe tratarse en ellas respectivamente, de modo que
sea posible crear una estructura clara y organizada del viaje
del usuario en un entorno hospitalario.
La señalética es una forma de comunicación visual muy precisa, pues la utilización y
decisión de símbolos, colores y tamaños crea un sistema complejo a la hora de comu-
nicar el contenido a una persona. Así, las tres áreas mencionadas anteriormente tienen
directa relación con la comunicación y con el sistema de orientación en sí.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
80
El viaje de las personas dentro del recinto hospitalario se define por un ritmo, función,
disposición y arquitectura del hospital. Para entender este ritmo, este viaje se dividió en
siete etapas necesarias para lograr internarse en la complejidad del hospital, y en sus
respectivas áreas. En cada una de ellas se define un suceso que guía al usuario de manera
fluída y legible.
Construcción de un Viaje Hospitalario
1Identificación
Hospital
Una vez que se llega al recinto hospitalario,
la persona desea saber en qué lugar de él se ubica y
hacia dónde debe dirigirse
3Reconocimiento del
Edificio
Se verifica que el lugar al que debía dirigirse
es el correcto
5Direccionamiento
En el recorrido interno dentro del edificio, existe señalización que indica la ubicación de los servicios
2Llegada
La persona ubica el hospital fuera del recinto
4Identificación de
Planta
La persona identifica todas las plantas del
edificio, la ubicación de sus servicios
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
81
Estructura del Viaje Hospitalario
El viaje hospitalario se divide en 7 partes definidas por
distintos sucesos que marcan un guión que acompaña al
viaje en el Hospital.
Caminata
Viaje continuo del usuario hacia y en el hospital
con el fin de llegar a un servicio.
Detención
El usuario hace una pausa en su trayectoria para
hacer un reconocimiento del lugar.
6Reconocimiento del
Área
La persona verifica la llegada a un área gracias a
su nominación
7Selección
Dentro de un área o del mismo recinto hospitalario, la persona puede identificar los
servicios menos , así comotambién las habitaciones
para ingresar a ellas
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
82
PARTITURA DE INTERACCIÓN
El viaje de la persona dentro del hospital comienza a formar una estructura que se cruza
con una planificación del sistema de orientación. Con la partitura de interacción se
puede visualizar de mejor modo los puntos claves en este viaje y los componentes inter-
nos y externos que intervienen en el proceso, para crear un sistema que acompaña al
usuario hasta llegar a su destino.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
83
Partitura de Interacción
Permite ver de manera paralela los distintos elementos que
actúan en el viaje hospitalario, en este caso la evidencia
física, el usuario, el sistema de orientación e información.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
84
ESTUDIO DEL ESPACIO
La estructura base parte con la definición de estos momentos en el viaje del usuario, los
cuales están definidos según los puntos claves de decisión. Estos han sido ubicados en el
plano, en los distintos niveles del hospital.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
85
Hospital Quilpué Nivel-1
En el plano se muestran los puntos claves donde se deben
indicar nombres, prevenciones,peligro, direccionamiento
y ubicaciones.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
86
Hospital de Quilpué Nivel 1
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
87
Hospital de Quilpué Nivel 2
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
88
ORGANIZACIÓN DEL ESPACIO
Los edificios se “separan” en 9 complejos que se nombran como: Urgencias, Centro
Adosado de Especialidades (CAE), A, B, C, D, E, F y G. La idea tras esta decisión, es lograr
ubicar al usuario en espacios definidos y concretos, señalando no una planta general,
sino que especificando los niveles del edificio en particular y los servicios existentes en
cada uno.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
89
División del Hospital
La división tiene el propósito de hacer un rápido
reconocimiento de los espacios en el hospital, identificando
los edificios con esta designación de letras.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño estr atégico del sVo
90
La tipografía en la señalética responde a una necesidad específica y fundamental; está
diseñada para ser vista y comprendida de forma inmediata, ofreciendo mayor legibili-
dad a distancia en un mínimo de tiempo. En base a esta premisa, la elección tipográfica
para el sistema de orientación comienza con un estudio previo en base a su visibilidad,
legibilidad e inteligibilidad, de modo que su diseño y construcción para el Sistema Visual
de Orientación, reúna la mayor cantidad de elementos favorables para un resultado
eficiente en su implementación.
El punto de crear una nueva fuente tipográfica, no es solo darle funcionalidad, sino que
también aportar un toque estético y un rasgo particular, pero sin desviar su objetivo.
Crear una tipografía para el Sistema Visual de Orientación responde a todos los crite-
rios estudiados con anterioridad, pero no solo busca dar cierta identidad al Hospital de
Quilpué, sino que también proyectarse como una tipografía que pueda ser utilizada por
distintos servicios de salud, respondiendo a la urgencia, a la rapidez y al breve tiempo de
detención de las personas que transitan estos espacios y que interactúan día a día con
el sistema.
Tipografía Hospital
La tipografía en la señalética responde a una necesidad específica y fundamental; está
diseñada para ser vista y comprendida de forma inmediata, ofreciendo mayor legibili-
dad a distancia en un mínimo de tiempo. En base a esta premisa, la elección tipográfica
para el sistema de orientación comienza con un estudio previo en base tres aspectos
fundamentales:
1. Visibilidad: Que el texto o palabra sea “visible”.
2. Legibilidad: Que texto o palabra se pueda “leer” (el código es accesible).
3. Inteligibilidad: Que el texto o palabra se pueda “comprender”.
Dentro de los criterios para la prevalencia de legibilidad, existen ciertas características
importantes a considerar:
• Reconocimiento de trazos: Son los contornos destacados de cada letra, sus trazos
ascendentes, descendentes, redondos y angulares, los que facilitan la recepción
visual del usuario. Con esto, el ojo humano es capaz de reconocer rápidamente los
caracteres sin necesidad de captarlos completamente, sobre todo al observar su parte
superior, lo que ayuda al usuario en movimiento dentro del hospital, en su recorrido,
y facilita -de cierto modo- la lectura, si es que el usuario presenta problemas de visión.
Visibilidad, Legibilidad e Inteligibilidad
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
91
• Uso de mayúsculas y minúsculas: Los textos escritos en mayúsculas requieren una
superficie mayor de impresión y reducen la velocidad de lectura en aproximada-
mente un 12%, a diferencia de un texto escrito en minúsculas. El ojo tipográfico, los
trazos ascendentes, descendentes y terminales, y los puntos de las íes y diéresis, son
aspectos determinantes de las minúsculas que influyen directamente en el reconoci-
miento de las palabras.
• Variaciones tipográficas: Al utilizar negritas o semi-negritas, se corre el riesgo de
bajar el índice de legibilidad, pero al aplicarlas para diferenciar categorías y destacar
algunas cosas, su cualidad de contraste funciona perfectamente para esto.
• Interletraje: Debe ser armónico y equilibrado respecto del blanco del espacio interior
de los caracteres y el blanco del espaciado, pues un interletraje exagerado evoca la
imagen de caracteres aislados, y un interletraje demasiado estrecho, será un ruido
en la lectura perjudicando la legibilidad. Sucede algo similar en el interlineado y el
espaciado entre palabras.
Trazos Reconocibles
La imagen al costado izquierdo muestra los trazos
fundamentales para el reconocimiento de los caracteres de
caja baja.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
92
REFERENCIAS TIPOGRÁFICAS
De lo estudiado respecto a las fuentes para señalética, señalización y rótulos, las tipo-
grafías más apropiadas para esta clase de usos son las sin serif, de estilo neo-grotesco y
geométricas. Su construcción es bastante dúctil y dócil, presentan muy buena legibili-
dad en palabras y frases cortas ya que sus trazos son equilibrados, sencillos y proporcio-
nados, y tienen una abertura del ojo tipográfico apropiada.
Algunos ejemplos de las fuentes tipográficas más utilizadas para la señalética, son:
• Frutiger: Creada por Adrian Frutiger en 1968 para el diseño de un sistema de señali-
zación acorde con la arquitectura del nuevo aeropuerto de Charles de Gaulles. Es de
fácil y rápido reconocimiento a grandes distancias, tanto de frente como en ángulo.
No es estrictamente geométrica ni humanista.
• Helvetica: Desarrollada por Max Miedinger en 1957 para la fundición de tipografías
Haas’sche Schriftgießerei de Suiza; nace como un rediseño de una fuente llamada
“Haas Grotesk”. Es muy buena para su uso en títulos u otras aplicaciones donde el
texto es corto y de gran tamaño.
• Johnston Underground: Diseñada por Edward Johnston en 1916 para el sistema de
señalización de la London Underground Railways. Se caracteriza por la combinación
de una gran técnica caligráfica y sensibilidad tipográfica.
• Univers: Creada por Adrian Frutiger en 1954 para la Fundición Deberny & Peignot,
para su uso en composición y fotocomposición en metales. Escapa de las formas
geométricas y constructivistas. Los blancos internos son más grandes que los blancos
entre las letras, las astas verticas son más gruesas que las horizontales y las diagonales
tienen un grosor intermedio.
• DIN 1451: Las letras DIN hacen referencia al Deutsches Institut für Normung (Instituto
Alemán de Estándares Industriales). Declarada en 1936 por el Comité alemán de
estándares como la tipografía para las áreas de tecnología, tráfico, administración y
negocios. Se extendió rapidamente por toda Alemania, especialmente en la señaliza-
ción de carreteras. La selección de un palo seco se debe a su legibilidad y a las formas
geométricas y fáciles de reproducir.
La versión de DIN utilizada en este caso es más contemporánea, y corresponde a la
fuente “DINPro”. Las variaciones presentes en esta residen en aspectos de interletraje,
prolongación de trazos y curvas, pero son tan leves que no logran cambiar considera-
blemente la forma de los caracteres.
Fuente Tipográfica “Frutiger”
Fuente Tipográfica “Helvetica”
Fuente Tipográfica “Johnston Underground”
Fuente Tipográfica “Univers”
Fuente Tipográfica “DIN”
El escrito superior corresponde a la fuente tipográfica DIN
1451, mientras que el escrito inferior corresponde a la
fuente tipográfica DINPro.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
93
Además de estas cuatro fuentes, se consideran dos más como elementos de inspiración,
correspondientes a la tipografía del “Transantiago“ (presenta un trazo menos geométri-
co y “hecho a mano”) y del “Gobierno de Chile” (presenta variaciones en el grozor de
los trazos).
Para comenzar con la respectiva construcción de los caracteres, se agrega una séptima
fuente tipográfica que es de libre uso y que puede ser editada: “Titillium”. Esta fuente
nace en la Accademia di Belle Arti di Urbino como un proyecto didáctico de un curso
de diseño tipográfico del Master of Visual Design Campi Visivi. Los diseñadores de tipo-
grafías interesados en la corrección o revisión de Titillium son invitados a cooperar o
desarrollar sus propias variantes de los caracteres acorde a los términos especificados en
la licencia, compartiendo nuevas ideas.
En base a las referencias tipográficas se modula el diseño de una fuente exclusiva para
señalética hospitalaria, tomando los aspectos más claros y funcionales de cada una.
Considerando que los trazos del contorno superior son fundamentales para el recono-
cimiento de los caracteres -y así, para el reconocimiento de una palabra-, se toman los
rasgos más limpios y definidos de las tipografías escogidas. En cuanto al blanco interior,
este debe ser proporcionado respecto al blanco que deja con otras letras, sin abusar
del caso de si es redonda, ovalada o curva. El grosor del trazo también es decisivo y
determinante para su construcción, pues el blanco interior más dibujado, será una guía
a considerar en el diseño de la nueva tipografía.
La evolución de la tipografía va mostrando de forma clara e inmediata algunas de las
decisiones tipográficas, tales como la orientación y definición de los trazos. Esto confor-
ma el gesto de la tipografía, el cual se muestra tanto en los caracteres como en la icono-
grafía, pues es sumamente importante que en el desarrollo lineal de los tipos, los iconos
y la señalética como tal, sea coherente y consecuente en el uso de los aspectos caracte-
rísticos, de modo que todo el sistema sea consistente.
Gobierno
Titillium
Fuente Tipográfica “TS”
Tipografía del Transantiago
Fuente Tipográfica “Gobcl”
Tipografía del Gobierno de Chile
Fuente Tipográfica “Titillium”
Blancos Tipográficos
Blancos interiores de las tipografías Frutiger, Helvetica y
Univers.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
94
Antes de definir un diseño final para la fuente, se crean al rededor de tres versiones que
vendrán a ser una especie de "paso a paso" en el desarrollo de la tipografía. En un punto
del proceso se cae en la cuenta de que es necesario tener un modo de regular los trazos
de los caracteres y de los iconos sin que exista la necesidad de mover y ajustar cada uno,
punto por punto. Es a partir de esta premisa que se piensa en la creación de los trazos
tipográficos para las estructuras.
La función primordial de los trazos es principalmente construir el "esqueleto" de los
caracteres, y así también, el de los iconos, estableciendo una relación directa y cohe-
rente entre ambos. Estos trazos se definen como "trazos básicos" ya que mantienen un
grosor definido pero varían en sus terminaciones, presentando cuatro formas diferentes
en base a las cuales se crean los diversos trazos para casos específicos, en relación a la
orientación de los caracteres, sus ángulos y trazos terminales. De este modo se obtienen
diferentes variantes de un mismo tipo, en este caso dieciseis trazos en total.
Recto Biselado TriangularSemi-biselado
Terminaciones de los Trazos Básicos
Formas de las terminaciones utilizadas para definir los
distintos trazos.
Creación de Trazos y Esqueletos
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
95
Trazos Biselados
Los trazos biselados se utilizan en su mayoría en las
terminaciones curvas de algunas letras minúsculas y en
algunos caracteres especiales.
Trazos Rectos y Semi-biselados
Los trazos rectos y semi-biselados se utilizan en su mayoría
en letras mayúsculas, números y caracteres que no presentan
curvas.
Trazo Recto
Trazos Semi-biselado por ambos lados
Trazos Semi-biselado por lado izquierdo
Trazos Semi-biselado por lado izqderecho
Trazos Biselado por ambos lados
Trazos Biselado por lado izquierdo
Trazos Biselado por lado derecho
Trazos Triangulares
Los trazos triangulares se utilizan en su mayoría en algunas
letras minúsculas compuestas de curvas y trazos rectos, así
como también en algunos caracteres especiales.
Trazos Triangular por ambos lados
Trazos Triangular por lado izquierdo
Trazos Triangular por lado derecho
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
96
Creación de un Trazo
Especificaciones del trazo tales como nombre, estiramiento,
dirección y colorización, entre otros.
Uno de los aspectos más importante dentro de estas
especificaciones es el estiramiento entre guías, ya que evita
que si el trazo a utilizar se prolonga demasiado, las
terminaciones se deformen.
Base del Trazo
Cuerpos vectoriales que muestran la forma del trazo antes
de configurarlo como tal.
La construcción de estos trazos se genera a partir de cuerpos vectoriales, los cual son
pensados para conformar las distintas partes que forman los caracteres. Con esto se
tienen la base que permitirá constituir el trazo como tal.
Al momento de configurarl este cuerpo como “trazo”, se definen una serie de modifi-
caciones (como nombre, escala, color, estiramiento, etc.) propias de él, lo que ayuda a
tener un control minucioso en la construcción de los caracteres.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
97
Estructura del Trazo
Esqueleto de algunos de los trazos con los que se construye
la tipografía Hospital.
Luego de determinar las condicionantes y especificaciones del trazo a configurar, se
mantiene la misma forma del cuerpo vectorial, y a partir de esto comienza la estructura-
ción de los esqueletos de los caracteres.
Un ejemplo respecto a la utilización de trazos para casos específicos, se muestra en las
construcciones de las letras “a” y “c”, donde la letra “a” utiliza un trazo triangular por
ambos lados y un trazo biselado por el lado izquierdo orientado hacia el interior -esto se
refiere a que el lado más recto del trazo se orienta hacia el blanco interior de la letra-,
mientras que la letra “c” utiliza un trazo biselado por ambos lados, también orientado
hacia el interior.
Construcción de Caracteres
Utilización de trazos para la construcción de las letras a y c.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
98
Teniendo definida la paleta de trazos, se construyen los esqueletos de los caracteres que
permitirán la creación de distintos pesos tipográficos para completar la familia. El hecho
de que la fuente esté pensada principalmente para la señalética, no quita la posibilidad
de enriquecerla con más variantes que, en este caso, pueden seguir siendo creadas dada
la libre disposición a cambios en que se deja esta fuente.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
99
Estructura
Esqueleto de las letras mayúsculas y minúsculas de la
tipografía.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
100 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
101
Estructura
Esqueleto de los números y caracteres especiales de la
tipografía.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
102 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
103
Estructura
Esqueleto de los pictogramas en su versión final.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
104 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
105caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
106 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
107caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
108 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
109caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
110
Caracteres
Una vez listo el esqueleto y definido un peso tipográfico base, se crean los distintos pesos
para conformar la familia tipográfica a utilizar. Para la creación de cada caracter, se ha
utilizado el programa Fontographer, mientras que para la exportación y validación de la
tipografía en un sistema operativo, se ha utilizado el programa FontLab, el cual permite
establecer la información y los ajustes necesarios para su uso (como el interlineado, las
propiedades de cada variante y los permisos de descarga, entre otros).
Casilla de Caracteres y Edición de Métricas
La imagen a la izquierda corresponde a la ventana de
Fontographer que muestra los caracteres de la variante
Hospital Regular, mientras que la imagen a la derecha
muestra la ventana en donde se edita el interletraje (kerning)
de la tipografía.
VARIANTES
Las variantes de la tipografía constan de cuatro pesos:
• Regular
• Medium
• Bold
• Black
El uso de ellas dependerá de la aplicación en la que se utilicen, como por ejemplo
al destacar el nivel del edificio al cual se está ingresando, o al presentar jerarquías de
elementos en los mapas de planta. Los iconos se integran a la familia tipográfica como
un elemento aparte, pues se ha dejado establecido sólo el peso “regular” en ellos, ya que
el detalle es mucho más fino.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
111
Variante “Hospital Medium”
Variante “Hospital Regular”
Variante “Hospital Bold”
Variante “Hospital Black”
ABCDEFGHIJKLMNÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz
1234567890|/\#$@&%()[]{}=-—+_¿?¡!ºª`́¨^*~‘’“”·¬<>•
ÇÁÉÍÓÚÀÈÌÒÙÄËÏÖÜÂÊÎÔÛçáéíóúàèìòùäëïöüâêîôû
ABCDEFGHIJKLMNÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz
1234567890|/\#$@&%()[]{}=-—+_¿?¡!ºª`́¨^*~‘’“”·¬<>•
ÇÁÉÍÓÚÀÈÌÒÙÄËÏÖÜÂÊÎÔÛçáéíóúàèìòùäëïöüâêîôû
ABCDEFGHIJKLMNÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz
1234567890|/\#$@&%()[]{}=-—+_¿?¡!ºª`́¨^*~‘’“”·¬<>•
ÇÁÉÍÓÚÀÈÌÒÙÄËÏÖÜÂÊÎÔÛçáéíóúàèìòùäëïöüâêîôû
ABCDEFGHIJKLMNÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz
1234567890|/\#$@&%()[]{}=-—+_¿?¡!ºª`́¨^*~‘’“”·¬<>•
ÇÁÉÍÓÚÀÈÌÒÙÄËÏÖÜÂÊÎÔÛçáéíóúàèìòùäëïöüâêîôû
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
112
Versiones Tipográficas
PRIMERA VERSIÓN
Esta versión se caracteriza por la intervención directa de los caracteres de la fuente
Titillium, modificando las curvas bézier y el grosor de los trazos de forma manual. Para su
transformación esto se vuelve un tanto perjudicial, pues no existe consistencia propor-
cional ni uniformidad a lo largo de los caracteres, entorpeciendo la armonía gráfica de
estos y dificultando su construcción.
A pesar de lo anterior, esta versión sirve como un patrón general sobre el cual aplicar
un trazo de grosor constante, que permita mantener la línea tipográfica en los distintos
pesos a crear. La idea del blanco interior y la conformación de este se muestra en esta
etapa..
La definición de la caja tipográfica (para altas y bajas) se define en base al ancho de la
letra “b”, la que se mantiene en la mayoría de las letras minúsculas, pues varía levemen-
te en algunos caracteres como la “a” y la “n”. Para las letras mayúsculas el ancho base
también es el de la letra “B”, pero presenta más variaciones en otras letras de anchos
similares, como la “A” y la “E”.
Existe un trazo curvo en las terminaciones de las letras “a” y “g” que intenta dar cierto
aspecto característico a la tipografía. Sólo se repite en estas dos letras que tienen cierta
similitud en su composición, pues ambas tienen un blanco interior cerrado en el ojo
tipográfico y uno abierto en la curva ascendente y descendente. Otros caracteres que
mantienen un trazo terminal curvo, pero más prolongado, son las letras “f”, “j”, “t” e
“y”Integrar este trazo curvo a todas las letras interferiría en la lectura de una palabra o
texto, pues la línea base se vería demasiado recargada y lo que se necesita es construir
sencillez y claridad para la rápida comprensión del usuario.
Blancos Tipográficos
Blancos interiores de las tipografías Frutiger, Helvetica y
Univers.
Titillium Text22L Hospital
Anchos Tipográficos
Definición de los anchos tipográficos de la primera versión
a partir de las letras b y B, junto con la altura de la caja
tipográfica.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
113
Trazos Terminales
Lo que caracteriza la tipografía en esta versión, es la
consistencia de la curvatura en los trazos terminales presentes
en algunos de los caracteres.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
114 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
115
Primera Versión de la Tipografía “Hospital”
Caracteres que conforman la primera versión de la tipografía
diseñada.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
116
SEGUNDA VERSIÓN
La segunda versión sigue modificando directamente las curvas, pero esta vez, afinando
y modulando los trazos de manera que tengan algo característico, que esté presente
constantemente y que ayude a mantener el blanco interior de los caracteres, sin alejar-
los de su funcionalidad. Los caracteres especiales siguen siendo los mismos que en la
versión anterior, por lo que no se muestra cambio o innovación en su estructura.
Nuevos Trazos Terminales
Traslape de las letras a y g de la primera y segunda versión
tipográfica, quitando la curvatura de los trazos terminales.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
117
El ancho tipográfico se estandariza con la letra “n”, evitando que existan demasiadas
variables. Los trazos terminales de las letras “a” y “g” eliminan las curvas, dejando estos
rectos, lo que es más limpio visiblemente y consecuente con la línea tipográfica general
que se propone. Además, se regulan los ángulos de estos trazos según proporciones de
las cajas para que exista un orden entre los caracteres que también se implementa en las
letras mayúsculas, consolidando la construcción de la familia tipográfica.
Ancho Tipográfico y Trazos Terminales Curvos
El ancho tipográfico base se rige por la letra n, y el corte de
los trazos terminales curvos se orienta proporcionalmente al
alto de la caja tipográfica (un octavo).
Segunda Versión de la Tipografía “Hospital”
Caracteres que se han modificado en la primera versión de
la tipografía diseñada.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
118
TERCERA VERSIÓN
Es en este punto del proceso en que se toma la decisión de crear más de un peso tipo-
gráfico, dando paso a la creación de los trazos mencionados con anterioridad. A pesar
de que esta es una manera que modula los caracteres de forma mucho más propor-
cional, existe un rango mínimo de modificaciones directas al momento de transformar
este esqueleto en un cuerpo vectorizado, pero sin entorpecer el desarrollo, sino más
bien, ayudándole.
Ya en esta fase, aparecen otros caracteres especiales que suelen ser utilizados frecuente-
mente, y que aportan a la construcción de una familia tipográfica más completa.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
119
Tercera Versión de la Tipografía “Hospital”
Caracteres modificados que conforman la tercera versión de
la tipografía diseñada.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
120
VERSIÓN FINAL
La última versión, y definitiva, reúne los caracteres necesarios para que la fuente tipográ-
fica sea utilizada de modo preciso en la señalética como también en las necesidades de
funcionarios del Hospital respecto a la entrega de información cambiante e inmediata,
como la falta de ciertos medicamentos en la farmacia, por ejemplo.
La corrección de detalles y ajustes de la tipografía presenta ciertos cambios en algunos
caracteres, como por ejemplo, una de las curvas interiores de la letra “a” se vuelve más
recta y su ancho se reduce levemente; y los trazos terminales curvos de las letras mayús-
culas y los números, cambian de un trazo biselado a uno semi-biselado.Cambios en la Versión Final
Cambios aplicados a caracteres de la versión.
ABCDEFGHIJKLMNÑ OPQRSTUVWXYZÇ
abcdefghijklmnñop qrstuvwxyzç
1234567890
|/\#$@&%()[]{}=_— -+¿?¡!ºª̀´̈ ^*~‘’“”·¬<>•
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
121
ABCDEFGHIJKLMNÑ OPQRSTUVWXYZÇ
abcdefghijklmnñop qrstuvwxyzç
Cuarta Versión de la Tipografía “Hospital”
Caracteres la versión final de la tipografía diseñada.
|/\#$@&%()[]{}=_— -+¿?¡!ºª̀´̈ ^*~‘’“”·¬<>•
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
122
LA SEMIÓTICA
La construcción del signo como imagen representativa de un concepto se comprueba
en la semiótica, que es la ciencia que estudia los signos lingüísticos que influyen en la
relación entre la comunicación y el significación (cómo esta hecho un texto o elemento
para que pueda decir lo que dice). Es así como podemos saber si un signo o icono es
reconocible por las personas o no. La semiótica se divide en 3 ramas:
• Semántico: Orientado a la expresión del significado, este sistema comprueba las
posibles confusiones entre los diversos códigos culturales.
• Sintáctico: Se analizan con claridad las jerarquías entre las señales, así como su
integración, coherencia e integración en el sistema.
• Pragmático o Ergonómico: Que compruebe las dificultades de visión, los ruidos que
afecten la percepción de los signos.
Para la construcción de los signos se deberá realizar un análisis semiótico, es decir, un
acto de exploración de las raíces, condiciones y mecanismos de la significación. Para
ello, el análisis se basa en la tricotomía de los signos: Dimensión Semántica, Pragmática
y Sintáctica.
Iconos
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
123caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
124
REFERENCIAS ICONOGRÁFICAS
Sistema de Simbolos de Cook & Shanosky
En 1974 el Departamento de Transporte de Estados Unidos le pidió al American Institute
of Graphic Arts (AIGA, Organización de diseño gráfico más antigua de la nación)que
creara un conjunto de 34 símbolos dirigidos a los pasajeros y peatones para el uso de los
medios de transporte.
El primer paso fue la compilación e inventario de los sistemas de símbolos desarrollados
para los medios de transporte individuales y eventos internacionales. El Departamento
de Transporte proporcionó al AIGA una lista de áreas de mensajes. Investigaciones,
ejemplos y manuales de todas partes del mundo fueron recolectados y compilados. Las
soluciones anteriores de las 34 áreas de tema fueron evaluadas por el comité encarga-
do, luego se hizo un resumen de recomendaciones para guiar el diseño del sistema de
símbolos.
El conjunto final de símbolos fue diseñado y dibujado por la sociedad de diseño Cook
and Shanosky Associates de Princeton, Nueva Jersey.
Símbolos Cook & Shanosky
Es el primer paso principal para lograr el objetivo de que las
comunicaciones gráficas unificadas y efectivas trascendieran
las barreras culturales.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
125
Pictogramas Olimpiadas Pekin 2008
Por otro lado se hace referencia a los pictogramas de los Juego Olímpicos del 2008 en
Pekin, en donde se representaron cada una de las 35 disciplinas deportivas que alber-
garían tal evento. En marzo del 2005, BOCOG(Beijing Organizing Committee for the
Olympic Games) invito a 4 institutos profesionales del diseño y organizaciones para
la realización de la campaña de Pictogramas Juegos Olímpicos Beijing 2008. El diseño
se basó en los “caracteres de sello” siendo la Universidad de Tsinghua preseleccionada
después de la evaluación de expertos.
De esta propuesta es importante rescatar el rasgo que toma esta familia de iconos, en
cuando a su composición de lineas que los hace totalmente compatibles con el trazo
tradicional del los caracteres chinos.
Objetivos del diseño del sistema de símbolos considerados:
• Claridad de la imagen
• Armonía y consistencia visual con la línea, figura, peso y forma.
• Simplicidad en su composición
Pictogramas Olimpiadas 2008
Se rescata la compatibilidad constructiva entre los trazos
de los caracteres chinos y el trazo de los pictogramas.
Surgen como excelente referencia en lo que respecta a una
coherencia de tipográfica e iconográfica.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
126
IDENTIFICACIÓN DE PICTOGRAMAS
Para saber qué iconos se han de diseñar, es necesario realizar un listado de los servicios
que entrega el Hospital y considerar cuales de ellos deben ser identificados con picto-
gramas. De este modo, se determina cuatro áreas que clasifican estos servicios según
sus funciones:
Especialidades
• Pediatría
• Maternidad
• Cirugía
• Ginecología
• Neonatología
• Traumatología Adulto
• Traumatología Infantil
• Oftalmología
• Dental
• Otorrinolaringología
• Pensionado
• Salud Mental
• Pensionado
• Kinesiología
Reglamentación
• Informaciones
• Estacionamiento
• Silencio
• Solo Personal Autorizado
• Peligro Inflamable
• Peligro Alto Voltaje
• Peligro Radiación
• No Fumar
• No Usar Celulares
Servicios Médicos Generales
• Laboratorio
• Medicina
• Imagenología
• Rayos X
• Ecotomología
• Ecografía
• Electrocardiograma
• Banco de Sangre
• Medicina Transfusional
• Área de Parto
• Urgencias
• UPC
• Área Quirúrgica
• Clínica de Enfermería
• Sedile
• Farmacia
• Test de Esfuerzo
• Fonoaudiología
• Epidemiología
Servicios Generales
• PRAIS
• Baños
• Ascensor
• Alimentación
• Unidad de Participación del Usuario
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
127
CONSTRUCCIÓN
La construcción de la familia de iconos requiere de una investigación gráfica de los dife-
rentes pictogramas que se quieren representar. Para ello es necesario realizar un listado
completo de los pictogramas a construir, crear un catastro de las diferentes representa-
ciones de símbolos que existen, observar y evaluar los tipos de construcción, grados de
abstracción y ángulos de mirada en que muestra el símbolo.
En este caso se establece que el icono va acompañado de una tipografía creada espe-
cialmente para la ocasión, por lo que se quiere que entre la fuente y el símbolo haya
cierta compatibilidad que armonice su lectura.
En este caso la construcción del icono se centró en los siguientes puntos:
• Trazo:
Para la producción de un sistema de pictogramas coherente a la tipografía se ha
pensado construir un trazo, con el cual se dibujará la tipografía y el icono, con el
objeto de que ambos queden insertos en una misma lógica, pertenecientes a una
misma familia constructiva.
• Mirada:
La secuencia de pictogramas debe tener cierto rasgo reconocible, algo que puede
proporcionarle el correcto reconocimiento es la decisión del ángulo en que se
muestra el signo.
• Composición:
La composición del signo es algo muy importante, hay que tener en cuanta cuales
son los elementos necesarios para su reconocimiento por ello es necesario mirar
signos ya construidos de estos conceptos, y notar qué cosas cambian, qué cosas se
mantienen y según esto dar cuenta de cual es el aspecto que se puede innovar en él.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
128
CATASTRO DE ICONOS DE BAÑO
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
129
Figura Humana
Realizando un Catastro sobre símbolos de “baño“ podemos
dar cuenta de la cantidad de representaciones de la
figura humana. En este caso es importante establecer la
tipología de figura humana a implementar, ya que juega
un rol importante en el momento de construir una familia
iconográfica, ya que su definición puede ser la base
constructiva de los demás iconos.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
130
PRIMERA VERSIÓN
Es la primera experiencia por llegar a una idea o concepto a través del icono, que se
construyen a partir de formas simples y que intentan mantener un equilibrio proporcio-
nal entre relleno, trazo y calado de manera que los pesos de estos se vean equivalentes.
Sin embargo,la construcción de estas figuras cumplen diferentes principios constructi-
vos, es decir son formas heterogéneas, en donde algunas se forman por trazos, mientas
que otras se construyen a partir de un volumen, por lo que falta homogeneizar las figu-
ras creando ciertas reglas y estandarizaciones que integren todos los iconos dentro de
una misma familia.
Esta construcción de iconos es el primer estudio que busca la correcta aproximación a
la forma que pueda representar en el contexto, la idea que desea comunicar. Se podría
calificar como la Etapa de Exploración de Figuras y Miradas probando una composi-
ción de contrastes, formas, lineas y color (cantidad de blanco en cada figura), pensando
en cuales son los objetos o figuras más representativas, cuáles tienen una idea preesta-
blecida por convención, y exploración de las miradas que puede tener un signo.
Maqueteos de Fonoaudiología
Construcción de Trazo Construcción de Bloque
Formas Heterogéneas
La primera versión de iconos tenia como enfoque principal
crear una forma reconocible con respecto a lo que se
deseaba representar, por lo que en su forma constructiva
resultaron ser bastante heterogéneas, unas se construían
a base de trazos, mientras que otras lo hacían en base
a bloques geométricos, creando distintos contrastes de
blancos y terminaciones incoherentes entre ellas.
Exploración de la Forma
Buscar cuál es la mejor manera de representar una idea
fue el enfoque principal de esta primera versión de iconos,
evaluando cuales son las miradas y elementos que puedan
potenciar de mejor manera una idea.
Versiones de Iconos
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
131
Primera Versión Completa “Hospital Icons“
Pictogramas que conforman la primera versión de la familia
tipográfica Hospital Icons.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
132
SEGUNDA VERSIÓN
Se propone la construcción de la tipografía propia para la señalética que lleva dentro de
su familia, los iconos, por lo que ellos deben seguir cierta coherencia con esta.
Para la construcción de la tipografía y los iconos se crea una familia de trazos en Illustrator
CS5, con esto se quiere lograr una homogeinización entre estos. Esta etapa corresponde
a un Estudio de la Construcción Gráfica de los pictogramas.
El empleo de trazos comunes entre la tipografía y el icono no implica una correspon-
dencia visual entre ellos, sobre todo porque para la composición del icono el peso del
trazo ha sido escalado a un porcentaje menor para lograr la fineza de un dibujo, esto
hace que cuando el icono se posa junto a la tipografía, cuenta con el peso gráfico que se
debe tener como signos, en donde debe crear un impacto visual y ser capaz de comu-
nicar una idea rápidamente, por ello se debe pensar en un grado mayor de abstracción.
Prueba de Contrastes
Se hace la versión en negativos, para la prueba de contrastes
de los iconos, en donde a veces en necesario para realzar el
mensaje representado y causar mayor impacto visual, como
es el caso de señales restrictivas.
Grilla Iconográfica
Se propone como máximo tamaño del icono para
exportarlo a la tipografía, la altura de las mayúsculas de
Hospital.
Construcción del Icono
Mediante una paleta de trazos definidos en Illustrator CS5 se
construyeron los distintos pictogramas de la segunda versión
de iconos
Terminaciones del Icono
En esta versión se planteo una terminación cerrada del
pictograma, dibujando una silueta.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
133
Segunda Versión Completa “Hospital Icons“
Pictogramas modificados que conforman la segunda versión
de la familia tipográfica Hospital Icons.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
134
VERSIÓN FINAL
Se establece que si la tipografía se modula con trazos simples, abiertos y cerrados, los
iconos se compondrán de la misma forma, en algunas ocasiones se emplearan elemen-
tos rellenos. Se continua dibujando con los trazos establecidos, y su peso esta pensado
para una equivalencia con la tipografía.
El trabajo que debe ocurrir cada vez que se construye una familia de iconos es pensar
en la simpleza de una imagen en cuanto a su construcción. La manera de mostrar una
idea con la menor cantidad de elementos posibles, de este modo el icono asegura tener
una interpretación más rápida y por otro lado hay menos elementos que equivoquen
el mensaje original.
En este caso fue importante definir cual será la construcción de la figura humana, ya que
juega un rol importante en esta familia de iconos, teniendo en cuenta que toda cons-
trucción gráfica de una figura humana tiende a personificarse, por lo que muchas veces
se le designan cualidades calificativas. Por ello hay que procurar que esta forma sea lo
más neutral posible y que no comunique otra cosa más que “persona”.
La construcción de los iconos se realizó con trazos de diferentes características, tanto
de forma como de grosor, en donde su composición crea una correspondencia con el
trazo de la tipografía en cuanto a dibujar un blanco similar al de una letra. En los casos
en que se emplearon trazos más delgados que el de las mismas letras fue en figuras más
complejas, específicamente hablando, todo lo que correspondía a figura humana, ya
que sus trazos estaban más condensados, ocupando un espacio menor en su composi-
ción por lo que creaban una mancha negra mayor que la letra.
Paleta de Trazos
Los trazos utilizados en esta familia de iconos se emplearon
en distintas escalas y tipos.
Terminación del Icono
En esta versión se optó por terminaciones abiertas en los
iconos, de esta manera se busca tener cierta semejanza con
la forma tipográfica, abierta y sencilla.
Definición de Figura Humana
Por la condensación de trazos en la figura humana, se optó
por crear una figura que requiriese de menos trazos para
conformarse como tal.
Versiones Anteriores Versión Final
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
135
TAMAÑO DEL ICONO Y GRILLA
Los iconos toman un tamaño mayor al de la tipografía, para que en el proceso de diseñar
la señalética estos estén inmediatamente proporcionados con el mensaje que lo acom-
paña. Además de esta manera alcanza a constituirse como parte del mensaje ya que
logra adquirir un mayor impacto visual.
Grilla Iconográfica
En esta segunda versión iconográfica la grilla del icono se
agranda en comparación a la grilla tipográfica, en donde el
peso del trazo se equilibra equivalentemente al de las letras.
k l mnño p
qrstuv
aHombre
dMinusválido
gNiña
bMujer
eEnfermera
hNiño
cObstetricia
fMedicina
iPediatría
jTraumatología
Adulto
kTraumatología
Infantil
qCirugía
lNeonatología
rKinesiología
mImagenología
nVía de Evacuación
sÁrea Quirúrgica
oTest de Esfuerzo
uCirugía
pSala de Reunión
vSala de Reunión
ñCuidado con las
Escaleras
tUnidad Paciente
Crítico - UPC
a b c d e f g h i j
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
136
wxyzABC
!" ·$% &/ ()
L M N Ñ O P
WXYZ123
wBaño Público
LLaboratorio
WUrgencia
! | " @ · # $ % & ¬ / ( )Extintor
MBanco de
Sangre
XServicios Generales
ÑNutrición
ZAscensor
3Silencio
1Apagar Celulares
2Prohibido Fumar
NMedicina
Transfusional
YEscaleras
OÁrea de Parto
PAmbulancia
xBaño Infantil
yUnidad de
Participación
zCancha
ASalud Mental
CEndoscopía
BFonoaudiología
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
137
Tercera Versión Completa “Hospital Icons“
Pictogramas modificados que conforman la tercera versión
de la familia tipográfica Hospital Icons.
4 5 6 7 8 9 0
D EFGHIJK
QRSTUV
6Peligro Alto Voltaje
4Peligro Radiación
7Información
8Estacionamiento
9No Estacionar
0Acceso Restringido
5Peligro Inflamable
QEcotomografía
REcografía
SRayos X
UAlimentación
VAdministración
TRadiografía Dental
DFarmacia
ESEDILE
FDental
HOftalmología
KGinecología
GOtorrinolaringología
IElectrocardiograma
JEpidemiología
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
138
La presentación formal de la tipografía, fuera de la implementación en la señalética,
toma lugar en un sitio web. En él se explica brevemente el proceso creativo y cons-
tructivo, como también el por qué de su origen y además permite descargar la fuente
tipográfica para instalarla tanto en el sistema operativo como para utilizarla en sitios web.
ÍNDICE DE CONTENIDOS
1. Inicio
2. Presentación
3.Construcción
4. Descargas
4.1. Fuente Tipográfica
4.2. Font-Face
5. Autoras
MAPA DE NAVEGACIÓN
Sitio Web
Mapa de Navegación
Mapa de navegación del sitio web de la Tipografía Hospital.
Tipografía Hospital
Inicio ConstrucciónPresentación Descargas AutorasFuente Tipográfica
"Hospital"(Wiki Casiopea)
Sist. de Señalética Hospitalaria
(Wiki Casiopea)
FlickrS. Savoy
FlickrG. Riquelme
Gley Riquelme(Wiki Casiopea)
Sofía Savoy(Wiki Casiopea)
AIGA Symbol Signs
Pictogramas Beijin 2008
Familia Tipográfica "Hospital"
Font-face "Hospital"
PortafolioG. Riquelme
(Carbonmade)
PortafolioS. Savoy
(Carbonmade)
Enlaces externos
Cuerpo de Contenido
Es donde se desarrollarán cada uno de los temas de las
secciones principales.
Header
Contendrá logo del sitio y un enlace al proyecto tipográfico
en la Wiki de la Escuela.
Menú
Contendrá las secciones principales del sitio.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
139
MEDIDAS
Footer
Contendrá las mismas secciones que la barra de menú, más
dos enlaces relacionados al proyecto tipográfico en la Wiki
de la Escuela, los respectivos Flickrs de las autoras y un enla-
ce al sitio de la Escuela de Arquitectura y Diseño de la PUCV.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
140
WIREFRAMES E INTERFZ
Inicio
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
141caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
142
Páginas de contenido: Presentación y Construcción
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
143caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
144
Descargas
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
145caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
146
Autoras
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
147caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
148
MAPAS DE DIVS
Header y Navegación
El header, y el menú se mantienen constantes en cada página (todas estáticas), permi-
tiendo una navegación estandar y rápida.
<body>
<div id=”header”>
<div id=”nav”>
<div id=”head”>
<div id=”menu”>
<div class=”logo”>
<ul>
<ul>
<li></li><li></li><li></li><li></li><li></li>
<body>
<div id=”content”>
<h1> <div class=”esquema”>
<div class=”nota uno”><div class=”nota dos”><div class=”nota tres”><div class=”nota cuatro”><div class=”nota cinco”>
Inicio
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
149
Presentación
<body>
<div id=”content”>
<div class “gallery“> <div class “text“>
<div class “tiporegular“><div class “tipomedium“><div class “tipobold“><div class “tipoblack“><div class “tipoiconos“>
<p></p>
<h1> <h2>
Construcción
<body>
<div id=”content”>
<div class=”gallery”>
<div class=”text”>
<div class=”text”>
<h1> <h2>
<h2>
<img/>
<p></p>
<p></p>
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
150
Descarga
En esta página se almacenan dos elementos a descargar.
<body>
<div id=”content”>
<div class=”caja-tipografica”>
<div class=”caja-tipografica”>
<h1> <div class=”text”>
<div class=”text”>
<h2>
<h2>
<div class=”muestra”>
<div class=”muestra”>
<div class=”descarga”>
<div class=”descarga”>
<div class=”tipo”>
<div class=”tipo”>
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
151
Autoras
Footer
El footer también en estático y presenta links tanto internos como externos.
<body>
<div id=”content”>
<div class=”presentacion”>
<h1>
<div class=”persona”>
<img/><h2></h2><p></p>
<div class=”persona”>
<img/><h2></h2><p></p>
<body>
<div id=”footer”>
<div class=”footercontent”>
<ul> <ul> <ul> <div class=”mensaje”>
<li></li><li></li><li></li><li></li><li></li>
<li></li><li></li>
<li></li><li></li>
<div class =”i”>
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • tiPogr afía HosPital
152
La identidad que el Hospital desea reflejar no sólo comienza desde lo más interno con la
creación de un sistema de orientación, sino que también con el rediseño de su logotipo.
Este queda en un estado porposicional que se implementa en parte de la señalética y
papelería.
Construcción Gráfica
LOGOTIPO
El logotipo refleja la identidad corporativa de una empresa, en este caso, de un hospital
público, y tiene una relevancia fundamental en el éxito de esta ya que la hace mejor
reconocida y recordada por sus clientes. Con ello, el nuevo diseño del logotipo se trans-
forma en un elemento fundamental para la renovación de lo que el Hospital de Quilpué
busca transmitir:
• Perfil del Hospital: El Hospital de Quilpué cuenta con ciertos valores y aspiraciones
que desea comunicar, por ello es necesario conocerlos y reflejarlos en su imagen
como institución se salud.
• Misión: El Hospital de Quilpué es una institución de salud pública de alta compleji-
dad, inserta en las comunidades de Quilpué y Villa Alemana, otorga prestaciones de
salud, basándose en los pilares de fomento, protección y recuperación de la salud
de las personas en un marco de trabajo en red, promoviendo la ambulatorización y
satisfacción de los usuarios.
• Visión: Institución de salud pública autogestionada y sustentable, capaz de satisfacer
las necesidades de salud de la población, de manera eficiente, respetuosa, amigable
y participativa.
• Perfil del Usuario: Personas que asisten a la salud pública, en su mayoría habitantes de
Quilpué y Villa Alemana, con expectativas de recibir una atención eficiente y cercana.
Imagen del Hospital
Logotipo actual del Hospital de Qulpué
Logotipo propuesto
Este logotipo nace de la propuesta nº2, ajustando márgenes
y alineando los caracteres con la figura apropiadamente.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
153
Propuesta 1
Quilpué es conocida como la "Ciudad del Sol", por lo que en este primer boceto se
intenta crear una imagen del hospital como parte de ese reconocimiento, tomando así
la imagen de un sol naciente acogido por dos colinas.
Se ha tomado el color amarillo como representación del sol, y para contrastarlo, se
ocupa el color azul, el mismo color base que se ha tomado para la construcción de la
señalética hospitalaria.
Propuesta 1
Las imágenes corresponden a las distintas variaciones de la
primera propuesta del logotipo.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
154
Propuesta 2
Creemos que la imagen del sol es esencial para el logo del Hospital de Quilpué, pero
que a la vez, se debe hacer énfasis al plano de la salud, y verse reflejado en este, por
ello se toma la figura de la cruz para construir sobre ella una propuesta que integre los
elementos que lo compondrán.
En este caso la propuesta, se construye con la intersección de dos semicírculos de forma
perpendicular, coincidiendo en sus centros, asimilando así la forma de la cruz que repre-
senta la salud mientras que la figura del semicírculo esta basada en la imagen de un sol
de atardecer que hace referencia a la ciudad de Quilpué. El cruce de rectas perpendicu-
lares se presta como una parte interesante del icono para ser asociada con la tipografía
que lo acompañará, como un rincón que acoge parte de la letra.
La combinación de los colores sugiere un equilibrio entre los tonos cálidos y fríos,
porque de alguna manera se busca asociar el semicírculo horizontal con el sol de atar-
decer, por otra parte este equilibrio busca mantener el sentido de "autoridad y lealtad",
sin perder la cercanía y calidez con la gente.
Estudio de la Forma
Se prueban las diferentes rotaciones de la figura, para ver
cuál es la que mejor calza con lo que se quiere reflejar, en
este caso, se toman los tres pilares fundamentales sobre
los que se basa el Hospital: Fomento, Recuperación y
Protección.
Proteger Fomentar Recuperación
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
155
Propuesta 3
En esta propuesta se propone trabajar forma de la cruz como símbolo de Salud, que se
construye con distintas piezas, que con sus calados conforman parte de la cruz, y que se
completaría con la parte tipográfica. Se toman conceptos importantes de la visión del
Hospital , como lo son la participación y colaboración con la comunidad.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
156
PAPELERÍA
Además del rediseño del logotipo, se agregan productos de papelería que consisten en
una ficha médica y una hoja para informativos. La ficha está pensada para unificar de
cierta manera las recetas médicas que son entregadas a los usuarios tanto en el Hospital
mismo como en el CAE, ya que entre ellos no hay una conversación uniforme y consis-
tente en materia de documentos, cada uno tiene sus formatos haciéndolos parecer de
entidades totalmente independientes.
Por otro lado, la hoja para informativos queda en un estado editable al ser entregado al
hospital como una plantilla word, la cual puede ser rellenada con distintos contenidos
para informar al usuario de procesos, noticias, etc.
Ficha Médica
El tamaño de impresión de la ficha es de media hoja carta
orientada de manera horizontal (apaisada). El formato está
reducido a un 60% del tamaño original.
Dirección: Calle San Martín 1270Teléfono: (32) 27-59-010Fax: (32) 25-39-203
Nº Ficha: Prev:
Nombre Paciente:
Rut: Edad:
Diagnostico:
Rp:
Fecha Firma
Nombre del Profesional:
Rut:
Hospital de Quilpué
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
157
Dirección: Calle San Martín 1270 Teléfono: (32) 27-59-010 Fax: (32) 25-39-203
Para mayor información recomendamos visitar nuestro sitio web www.hospitalquilpue.cl
Informativo
El tamaño del informativo es de una hoja carta. El formato
está reducido a un 60% del tamaño original.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
158
Decisiones Cromáticas
El sistema cromático se refiere a la distinción de los nueve edificios que se ubican dentro
del recinto hospitalario, por lo que deben tener un contraste cromático de tal forma que
los hagan reconocibles rápidamente uno al lado del otro.
Rojo:
• Es el color más intenso en lo emocional y cuando se lo usa como color secundario.
Recomendable para motivar a las personas a tomar decisiones rápidas e incrementar
las expectativas.
• Representa la energía como la vida física. Otorga vigor, dinamismo, amor y calidez.
Amarillo:
• Simboliza el gozo y la alegría, luminosidad y el intelecto.
• Estimula la agilidad mental, mejorando las capacidades de memoria y concentración.
Azul:
• Cuando se utiliza junto a colores cálidos (amarillo, naranjo), la mezcla suele ser llamativa.
Puede ser recomendable para producir impacto.
• No es un color que “sature” la vista al ser utilizado en grandes áreas.
• Representa la paz y tranquilidad, favorece la concentración y el equilibrio de las
energías, estimulante e invita a la calma.
Púrpura:
• Se asocia a la sabiduría, el prestigio y elevación.
Verde:
• Este color invita a formar un ambiente de calma.
• Simboliza la bondad, fertilidad, estabilidad, tranquilidad, abundancia y vida.
Gris:
• Los grises medio-claros tienen poca atracción visual, siendo idóneos para fondos o
elementos de relleno que no aporten información al espectador.
• Se asocia a la neutralidad absoluta, discreción y equilibrio.
• Se utiliza para denotar edad, madurez y sabiduría.
Naranjo:
• Representa entusiasmo, felicidad, atracción, creatividad, determinación, éxito, estí-
mulo y ánimo.
• Se utiliza cuando se reclama participación o acción, también es ideal para botones.
• Es el color de la comunicación, del calor afectivo, equilibrio, seguridad y confianza.
C = 76,18M = 22,28Y = 7,69K = 0
C = 34M = 31Y = 40K = 50
C = 29M = 29Y = 0K = 19
C = 0M = 0Y = 0K = 6
[A]
C = 92,58M = 85,55Y = 36,72K = 41,02 [B]
C = 95,96M = 76,75Y = 13,4K = 2,88
C = 5,86M = 69,92Y = 97,27K = 0,39
C = 39,45M = 100Y = 29,97K = 7,81
C = 56,64M = 5,47Y = 100K = 0
C = 0M = 18Y = 93K = 23
C = 14,06M = 92,97Y = 96,48K = 4,3
Colores Identificativos
Diferencian las Distintas áreas del recinto hospitalario,
identificándolas con cada uno de los colores
correspondientes.
Colores Base
[A] Soportes: Es el color de fondo de los soportes de la
señalética, sobre él se presentan todos los otros colores
expuestos. Crea una homogeneidad entre las tipologías de
señalética.
[B] Textos: Es el color de los mensajes dentro de la señaléti-
ca, debe producir el contraste necesario para proporcionar
el mejor reconocimiento y lecturabilidad de los textos.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
159
• Tiene alta visibilidad, por lo que es útil para captar atención y subrayar aspectos impor-
tantes.
• Utilizado en pequeñas extensiones o con acento, es un color de gran utilidad, pero
en grandes áreas es demasiado atrevido y puede crear una impresión impulsiva o
agresiva.
URGENCIA
San Martín
Sam
uel V
alen
cia
A
B
C
GCAE
DEF
Plano Cromático del Hospital de Quilpué
La designación cromática para cada edificio tiene que ver
con una relación de color y función del edificio.
Urgencia
A
B
C
D
E
F
G
CAE
Alerta, emergencia, atención y decisiones rápidas
Área administrativa, seriedad, gestión
Calma, operación, curación, relajación, fertilidad
Familia, alegría
Alimentación, limpieza, relajo
Almacenamiento, reparación, organización
Serenidad, creatividad, limpieza, almacenamiento
Informaciones, datos, guía, asistencia al paciente
Especialidades, experiencia, seguridad
Edificio Características
Para la decisión cromática se considera la cualidad que posee cada edificio para hacerlo
más identificable según su función primordial. Se sabe que el color invita a las personas
a comportarse de cierta manera en un lugar determinado, por ello se han destacado las
características más esenciales de cada edificio del hospital. Lo importante a considerar
en los colores es que se distingan bien unos de otros, de manera que no se haga confuso
el viaje para el usuario.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • construcción gr áfica
160
Los prototipos realizados surgen como una aproximación de las distintas tipologías que
se han pensado para este sistema de orientación. Ellas se componen de una lógica muy
simple, pensando en la accesibilidad de la información para el usuario, relacionadas con
su rango de visibilidad, inteligibilidad y lecturabilidad.
Diseño de Prototipos
Jerarquías Tipológicas de la Señalética
Para definir un orden tipológico, en un comienzo se organizó, comparó y analizó la
señalética actual del Hospital, creando un registro de las señaléticas genéricas para luego
definir jerarquías dentro de la cual se pudiesen clasificar, identificando los distintos casos
respecto a su función genérica:
• Orientadoras: Situar a los individuos en un entorno, como por ejemplo mapas y
planos de ubicación.
• Direccionalas: Instrumentos específicos de circulación, como por ejemplo flechas o
prohibiciones de paso.
• Nominativas: Instrumentos de designación que confirman la ubicación al usuario.
• Informativas: En cualquier lugar del entorno, e informan por ejemplo, de horarios
o servicios.
• Normativas: Salvaguardar y proteger a los usuarios contra el peligro (preventivas,
restrictivas y prohibitivas).
En base a esta organización general de la señalética, se identifican las funciones dentro
del espacio y según las necesidades
RANGO DE VISUALIZACIÓN
Para la planificación de los prototipos es necesario contemplar las distancias en que
son visibles, el rango de visualización como un criterio fundamental de legibilidad. Una
señalética situada correctamente en un lugar, es clave para el desarrollo de su tipología,
y dependiendo de la distancia a la cual deba verse, se definen las variaciones de tamaños
para concretar su diseño. Son tres los rangos a considerar:
[A] Corta Distancia
Corta Distancia: Los letreros que se contemplan desde
distancias menores de 5 metros suelen estar ubicados a una
altura entre los 2.5 y 1.5 metros.
[B] Media Distancia
Cuando la distancia entre el observador y la señal esta entre
los 5 y 10 metros aproximadamente, el tamaño de esta no
puede ser menor de 1x1 metro.
[C] Larga Distancia
Rango de visibilidad mayor de 10 metros, estos letreros se
ubican a una altura superior al primer piso del edificio, por lo
que deben de ser de gran tamaño e luminosos, ya sea por un
foco o de material translúcido e iluminados en su interior.[A] [B] [C]
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
161
Cuadro de Jerarquías
En él se organizan las distintas tipologías según su función
y ubicación, planteando también un posible montaje para
ellas.
Función Tipo Emplazamiento Descripión
ORI
ENTA
TIVA
DIR
ECC
ION
ALN
OM
INAT
IVA
REG
LAM
ENTA
RIAS
INFO
RMAT
IVA
Mapa General
Mapa de Nivel
Escaleras
Áreas
Sub-Áreas
Evacuación
Pasillos
Edificio Interno
Edificio Externo
Normativas
Informativo
De banda
Adosado
Adosado
Adosado - Colgante
Adosado - Adhesivo
Adosado - Colgante
Adosado
Adosado
Adosado
Adosado - Adhesivo
Adosado - Impresión
Es un mapa de grandes dimensiones, ubicado en la entrada del Hospital (por el estacionamiento) que soporta la labor del guardia de dar indicaciones. Señala las vías principales por las cuales ingresar a los edificios.
Esquema del nivel y planta de los edificios, ubicado en los niveles principales de estos, destacando en cual se encuentra el usuario.
Señala la dirección en la cual se encuentran los servicios de los niveles superiores y/o inferiores, ubicados al comienzo y/o fin de las escaleras.
Se utiliza para identificar las áreas de servicios que se encuentran en cada edificio.
Señala las sub-áreas que se ubican dentro de las áreas mayores en los edificios, como servicios o información (OIRS).
Señala la vía y dirección en la que una persona debe evacuar en caso de siniestro.
Utilizados generalmente para señalar las áreas internas que se aproximan al pasar por las rampas y por los pasillos en donde hay más de un servicio en los costados.
Señala la dirección en la cual se encuentran las edificaciones y la cantidad de servicios por nivel en ellos. Ubicados en las rampas que conectan los edificios.
Señala los edificios, sus respectivos servicios y al nivel al cual ingresará el usuario, y se ubican en las puertas de entrada de cada edificio.
Señala las áreas en donde hay peligro, prohibición, alertas, las áreas en las que hay que tener cuidado y precausión, y los servicios higiénicos.
Señala horarios, procesos y boletines informativos, entre otros, y se mantiene en calidad de formato imprimible por los funcionarios del Hospital.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
Habitación Adosado - BanderolaUtilizado tanto para la identificación de servicios médicos como generales,habitaciones de pacientes y boxes.
162
Una vez definida la familia de iconos, se establece que al llevarlas a Fontographer
(programa empleado para la creación de tipografías), la caja del icono crece en un 136%
respecto a la caja tipográfica, quedando inmediatamente proporcionada en cuanto a
pesos de trazo. Dentro de esta caja los iconos son alineados de distintas maneras, respec-
to a sus formas y tamaños, para que al ser acompañados por la tipografía queden inme-
diatamente en proporción con estas.
ALINEACIÓN ICONOGRÁFICA
Alineación Inferior
Los iconos se alinean al extremo inferior de su propia caja, cruzándose en su altura con
la línea tipográfica.
Diferencia de Escala
El icono toma una escala mayor que la caja tipografíca,
creciendo a un 136%, de este modo el icono queda inme-
diatamente proporcional a la escritura que lo acompaña.
Estructuración de Tipologías
AlineaciónInferior
Línea basede texto
Iconos de alineación inferior:
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
163
Alineación Centrada
Los iconos se alínean de manera centrada dentro de su propia caja, cruzándose con la
línea tipográfica y en algunos casos quedando sobre ella.
Alineación a Línea de Texto
La alineación del icono corresponde con la línea base del texto, quedando a la misma
altura que este.
Iconos de alineación centrada:
AlineaciónCentrada
Línea basede texto
Iconos de alineación a la línea de texto:
Alineación a lalínea de texto
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
164
FAMILIA DE TIPOLOGÍAS
El diseño de los prototipos comienza con el listado de servicios del hospital previamente
definido, y con la clasificación de las tipologías a crear. Luego, su contenido gráfico se
estructura en base a los tamaños de cada tipología y a su ubicación dentro del espacio.
Ante el requerimiento y urgencia que existe de la señalética en el Hospital de Quilpué, se
piensa en una estructura sencilla, en la cual su forma, materialización y montaje deben
ser pensados para lograr la mayor eficiencia a bajos costos.
Así, el diseño de la señalética se abstrae -en un principio- a lo más puro y simple de
su sentido: orientar. En base a esto existen en dos palabras claves a partir de las cuales
se piensa la estructura: identificar e indicar/señalar. Estos verbos permiten definir una
estructura funcional lo suficientemente clara para ser comprendida por los usuarios,
proponiendo la identificación como un estilo nominativo y de color, y la indicación y
señalización como un estilo iconizado (de flechas) y color.
Servicio con Icono - Grande
13 cm
40 cm
2 cm
3 cm 3 cm
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
165
Especificaciones de Texto
Tipografía Título = Hospital Black
Tamaño = 72 pt.
Tipografía Texto = Hospital Regular
Tamaño = 100 pt.
Especificaciones de Texto
Tipografía Texto = Hospital Regular
Tamaño = 100 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 150 pt.
13 cm
35 cm
2 cm
13 cm
35 cm
2 cm
3 cm 3 cm
Servicio con Icono - Pequeño
Servicio con Icono - Pequeño
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
166
28 cm
7 cm
6 cm 6 cm6 cm
Variable
Área Simple
Especificaciones de Texto
Tipografía = Hospital Medium
Tamaño = 300 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 300 pt.
Borde = 5 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
167
Área con Servicios
Especificaciones de Texto
Tipografía en Área y Servicios = Hospital Medium
Tamaño Área = 300 pt.
Tamaño Servicios = 130 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 300 pt.
Borde = 5 pt.
40,6 cm
7 cm
3,5 cm
5 cm
6 cm 6 cm6 cm
Variable
Especificaciones de Elementos
Grosor Línea = 4 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
168
Sub Área - Grande
21 cm
5 cm
6 cm
6 cm
6 cm 4,5 cm
55 cm
Especificaciones de Texto
Tipografía = Hospital Medium
Tamaño = 180 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 200 pt.
Borde = 2 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
169
Sub Área - Pequeño
21 cm
5 cm
6 cm
6 cm
6 cm 4,5 cm
40 cm
Especificaciones de Texto
Tipografía = Hospital Medium
Tamaño = 180 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 200 pt.
Borde = 2 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
170
Direccionales de Escaleras - Grande
Variable
42 cm
3 cm
2 cm
2,5 cm
2,5 cm
3 cm
3 cm1,5 cm
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
171
Direccionales de Escaleras - Pequeño
Variable
42 cm
3 cm
2 cm
3 cm
3 cm1,5 cm
Especificaciones de Texto
Tipografía = Hospital Regular
Tamaño = 72 pt.
Interlineado = 80 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 80 pt.
Borde = 1,8 pt.
Especificaciones de Elementos
Grosor Línea = 2 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
172
Direccionales de Pasillo
Variable
75 cm
6 cm
9 cm
6 cm
6 cm
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
173
Especificaciones de Texto
Tipografía = Hospital Medium
Tamaño = 130 pt.
Interlineado = 156 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 150 pt.
Borde = 9 pt.
Variable
40 cm 40 cm
6 cm
9 cm
6 cm
6 cm 6 cm 6 cm
Variable
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
174
Direccionales de Edificio Internos
Variable
6 cm
6 cm
9 cm
6 cm 6 cm6 cm 6 cm4 cm
40 cm 40 cm 40 cm
144 cm
Especificaciones de Texto
Tipografía Encabezado = Hospital Black
Tamaño = 200 pt.
Tipografía Niveles = Hospital Bold
Tamaño = 120 pt.
Estilo de Texto = Todo en altas
Tipografía Texto = Hospital Medium
Tamaño 130 pt.
Interlineado = 156 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño Encabezado = 150 pt.
Borde = 18 pt.
Tamaño junto a Texto = 141 pt.
Especificaciones de Elementos
Grosor Línea = 4 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
175
Nominativo de Edificio Interno
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
33 cm
144 cm
Especificaciones de Texto
Tipografía = Hospital Bold
Tamaño = 700 pt.
176
Normativa - Grande
24,8 cm
42 cm
1 cm 1 cm1,2 cm
Especificaciones de Texto
Tipografía = Hospital Black
Tamaño = 72 pt.
Interlineado = 80 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 493 pt.
Borde = 4 pt.
1 cm
1 cm
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
177
Normativa - Pequeña
24,8 cm
1 cm 1 cm
1 cm
1 cm
6,3 cm
23 cm
Especificaciones de Texto
Tipografía = Hospital Black
Tamaño = 66 pt.
Interlineado = 60 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 395 pt.
Borde = 4 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
178
Edificio Exterior
40 cm
Variable
6 cm
6 cm
10 cm
4,8 cm
2 cm
2 cm
2 cm
6 cm 6 cm
40 cm
Especificaciones de Texto
Tipografía Encabezado = Hospital Bold
Tamaño = 1000 pt.
Tipografía Niveles = Hospital Bold
Tamaño = 100 pt.
Estilo de Texto = Todo en altas
Tipografía Texto = Hospital Regular
Tamaño = 100 pt.
Interlineado = 120 pt.
Especificaciones de Elementos
Grosor Línea = 2,5 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
179
Mapa de Planta
Variavble1 mt máx.
Variavble1 mt máx.
4,5 cm
5 cm
9 cm
4 cm 4 cm
Especificaciones de Texto
Tipografía Edificio = Hospital Black
Tamaño = 180 pt.
Tipografía Nivel = Hospital Bold
Tamaño = 120 pt.
Tipografía Título Simbología = Hospital Medium
Tamaño = 48 pt.
Tipografía Texto Simbología = Hospital Regular
Tamaño = 44 pt.
Interlineado = 72 pt.
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 60 pt.
Tamaño Simbología = 44 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
180
Mapa General
8 cm
161 cm
8 cm39 cm39 cm 8 cm8 cm
8 cm
8 cm
8 cm
6 cm
4,5 cm4,5 cm
2,8 cm43 cm
12 cm
42 cm
185 cm
Especificaciones de Texto
Tipografía Título = Hospital Bold
Tamaño = 88 pt.
Estilo de Texto = Todo en altas
Tipografía Texto = Hospital Medium
Tamaño = 88 pt.
Interlineado = 98 pt.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
181
Especificaciones de Iconos
Tipografía = Hospital Iconos
Tamaño = 260 pt.
Especificaciones de Elementos
Dimensiones de Logo = 43 cm x 30 cm
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
182
Las primeras versiones de prototipado, buscan la manera de crear una forma ordena-
da de comunicación, a través de elementos simples. En base a estas se identifican los
elementos más apropiados para crear coherencia, lectura continua, legibilidad y empa-
tía en el sistema de orientación para con el usuario
PRIMERA VERSIÓN
El uso del color es casi como una etiqueta que distingue solo la correspondencia con
el edificio en el que se está, para destacar cosas relevantes se emplea un color neutral
que se antepone al blanco del fondo. Para esta propuesta se destaca el empleo de un
logotipo que hace referencia al hospital.
Propuestas Anteriores
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
183
Versión 1 - Propuesta A
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
184
Se emplea un método de color como distintivo de cada edificio a través de franjas de
color que van a los laterales de cada señalética.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
185
Versión 1 - Propuesta B
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
186
SEGUNDA VERSIÓN
El Color se emplea no solo para crear correspondencia entre la señaletica y el edificio,
sino que también como área para destacar y hacer referencia a cosas relevantes.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
187
Versión 2 - Propuesta A
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
188
Esta Propuesta trabaja netamente el color de cada edificio en la totalidad de la señaléti-
ca, empleando el color tanto como fondos, en áreas para destacar cosas y en tipografías
e iconos se hace un juego entre fondo blanco - tipografía color y fondo color - tipo-
grafía blanco, el problema de esto es que la lectura se torna molesta ya que cada color
genera su propio contraste en al lectura de caracteres, dificultando así su legibilidad.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
189
Versión 2 - Propuesta B
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
190
TERCERA VERSIÓN
Esta propuesta trabaja con formas rectas y además integra formas curvas, de modo de
romper lo paralelo, de cierta manera, y dar un poco de dinamismo a lo visual. El color
se usa en cantidad medida, la suficiente para lograr indicar e identificar a qué edificio
corresponde.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
191
Versión 3 - Propuesta A
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
192
Aquí el color se vuelve protagonista de la señalética, quizás siendo un poco violento
o invasivo para la vista. Se destaca el uso de una franja de color vertical, la cual integra
íconos y flechas.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
193
Versión 3 - Propuesta B
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
194
VERSIÓN FINAL
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
195
Señaletica de Exterior
Se muestran las tipologías principales y la manera en como
irán dispuestas en el espacio fuera de los edificios.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
196 caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
197
Señaletica de Interior
Se muestran las tipologías principales y la manera en como
irán dispuestas en el espacio dentro de un edificio.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • diseño de PrototiPos
199
Cierre Primer Capítulo
El proceso de trabajo en esta etapa, abarcó distintos aspectos de estudio y desarrollo, los
cuales convergieron en un punto crucial para concluir el proyecto; este es, la creación
de un sistema visual de orientación y una familia tipográfica.
El estudio tanto del espacio físico y de sus transeúntes, como el de las necesidades y
bases de un sistema orientativo y sus componentes, permiten desarrollar una propuesta
creativa fundamentada en base al viaje que experimenta el usuario dentro del hospital,
formulando así un proceso comunicativo a través de un Sistema de Señalética.
Así mismo, la creación de una fuente tipográfica exclusiva da libertad a los funcionarios
del recinto para su uso en situaciones de urgencia o de último minuto, pues no solo se
piensa para que esté presente en la señalética, sino que también para diversos propósi-
tos dentro del Hospital. De este modo, la conclusión de la familia tipográfica da cuenta
de un proceso evolutivo dejando expuesta su materia de estudio. La tipografía construi-
da queda disponible para todo el público a través de su sitio web:
http://proyectos.ead.pucv.cl/hospital/inicio.html
La finalización de este proyecto concluye con la presentación completa de este, al
Hospital de Quilpué, junto con la entrega de toda la documentación y material de estu-
dio producido, a través de un manual gráfico y un CD que compilan cada uno de los
archivos fundamentales para la posible implementación de este proyecto en el recinto.
caPítulo ii : "sistema Visual de orientación Par a HosPitale s" • cierre Primer caPítulo
201
Agradecimientos
Durante esta etapa de estudio y trabajo, se ha contado con la presencia de personas que
han aportado de diferentes maneras en el desarrollo de los proyectos.
Comenzamos agradeciendo a nuestro profesor de titulación, Herbert Spencer, por
guiarnos en el desarrollo de nuestros estudios y por haber proporcionado el uso de
Thesis Theme para la construcción del sitio web de Salud Un Derecho; a los integrantes
de Salud Un Derecho por la entrega de material acerca del movimiento y temas de la
salud en Chile, y por las correcciones y aportes hechos en la redacción del guión para el
video introductorio; a Mirian Araceli Muñoz Araya y Francisco Javier Vera Muñoz, por su
disposición para grabar sus voces en la animación; a Juan Andrés Mucarquer Fuentes por
compartir sus conocimientos de programación; al Hospital de Quilpué por entregarnos
documentación que aportó al estudio; a Marcela Gonzáles por gestionar los permisos
necesarios para poder circular dentro del Hospital, facilitando el estudio y la realización
del proyecto de señalética hospitalaria; a Adolfo Espinoza Bernal por su asesoramiento
en materiales para las ediciones y el empaste de estos ejemplares.
agr adecimientos
203
Referencias
• AEDO I., Cristián. Las Reformas en la Salud en Chile, Capítulo 14.
• B. MEGGS, Philip. La Historia del Diseño Gráfico, Identidad corporativa y los sistemas
visuales, Cap. 22, 1991.
• BASTÍAS S., Dr. Gabriel; VALDIVIA C., Dr. Gonzalo. Reforma de Salud en Chile; El Plan
AUGE o Régimen de Garantías Explícitas en Salud (GES). Su Orígen y Evolución, 2008.
• BAUMANN, Sander. Introduction to Wayfinding and Signage Design, 2010.
• BENEICKE, Alice; BIESEK, Jack; BRANDON, Kelley. Wayfinding and Signage in Library
Design, 2003.
• BURKE, Kenneth. Four Master Tropes, Rethoric Review, Vol. 11, 1992.
• COSTA, Joan. Diseñar para los ojos, 2003.
• FREYLEJER, Valeria; MADIES, Claudia; TOBAR, Federico. Reforma de los Sistemas de
Salud en América Latina, 1997.
• GROWTH SOLUTIONS GROUP. Specialist clinics wayfinding guidelines: The outpatient
journey, 2008.
• MATTELMÄKI, Tuuli. Design Probes, 2006.
• QUINTANA OROZCA, Rafael. Diseño de Sistemas de Señalización y Señalética.
• R. MÁRQUEZ, Elio. Señales: Características de Visibilidad y Legibilidad.
• VEGA, Eugenio. Sistemas de signos en la comunicación visual.
• EVOLUCIÓN DE LOS SISTEMAS DE SALUD EN CHILE
https://www.u-cursos.cl/medicina/2010/1/FOGESTSA2/1/material_docente/objeto/294443
• EL SISTEMA DE SALUD CHILENO
http://www.colegiomedico.cl/
• DERECHO A LA SALUD
http://www.derechoshumanos.udp.cl/
• DIEZ LECCIONES SOBRE LA SEÑALIZACIÓN
http://blog.duopixel.com/articulos/senaletica.html
• NORMAS GRÁFICAS DEL TRANSANTIAGO
http://www.det.cl/elaboracion-de-estudio-de-actualizacion-del-manual-de-normas-graficas-de-transantiago-ts3/
• PLUGINS PARA WORDPRESS
http://wordpress.org/extend/plugins/
• VISIBILIDAD Y LEGIBILIDAD
http://www.proyectacolor.cl/percepcion-del-color/visibilidad-y-legibilidad/
Bibliografía
Webgrafía
referencia s
205
Colofón
Colofón de Estudio
Colofón Técnico
Las etapas de titulación comprendieron dos proyectos: “Salud un Derecho”, proyecto
Web y “Hospital de Quilpué”, proyecto de Señalética. Ambos, a pesar de parecer tan
distantes, convergen en la construcción y planificación de una conversación, un diálogo
en el cual uno se interna en los contenidos de un sitio web y el otro en los servicios de
un hospital.
La coherencia en el discurso que ambos proyectos buscan establecer, trata de construir
una fluidez significativa entre los distintos elementos que los componen y los usuarios.
Los documentos relacionados a los proyectos se han dejado a disposición de estas dos
entidades (Salud Un Derecho y Hospital de Quilpué) en caso de que quisieran seguir
desarrollándolos, o por otro lado, dejarlos como referencia en caso de realizar un
proyecto similar.
TIPOGRAFÍA
Título 1: Giacomo Medium; Cuerpo 16; Interlínea 13
Título 2: Giacomo Regular; Cuerpo 11; Interlínea 13
Subtítulo 1: Giacomo Medium; Cuerpo 7,5; Interlínea 13; Todo en altas
Subtítulo 2: Giacomo Regular Italic; Cuerpo 7,5; Interlínea 13
Texto: Giacomo Light; Cuerpo 7,5; Interlínea 13
Título de Notas: Giacomo Regular; Cuerpo 6,5; Interlínea 10
Texto de Notas: Giacomo Light; Cuerpo 6,5; Interlínea 10
Folio: Giacomo Light; Cuerpo 7; Interlínea 11; Versalitas
COLORES
Terracota: C=0; M=63; Y=85; K=29
Celeste: C=87; M=49; Y=0; K=0
Negro: C=0; M=0; Y=0; K=100
Gris: C=0; M=0; Y=0; K=70
SOPORTE
Papel de Contenido: Hilado 6
colofón
206
SOFTWARES
Contenido y Portada: Adobe InDesign CS5
IMPRESIÓN
Contenido: Se ha impreso con la impresora láser Samsung CLP 320 Series
Portada: Se ha impreso en la impresora carro ancho HP Designjet 90
Esta edición terminó de imprimirse el 3 de Diciembre del 2011.
colofón
Recommended