Portal BVS y su Interfaz Introducción a la

Arquitectura de Información

Taller de Actualización de la Plataforma Tecnológica de la BVS 3 a 6 de Noviembre de 2014

Julio Takayama | takayama@paho.org Diseño Gráfico e Interfaces - DGI | MTI

Plantilla Básica Header

Auxiliar top (opcional)

Auxiliar footer (opcional)

Footer

Columna 1 Columna 2 Columna 3

Plantilla Básica

Header

Auxiliar top (opcional)

Auxiliar footer (opcional)

Footer

Columna 1 Columna 2 Columna 3

Plantilla Básica

Miles de plugins

Tienen todos los usuários las mismas necesidades?

PORTAL BVS RIPSA Rediseño

Projeto BVS RIPSA – Fase III

BVS-­‐Site  4.0.1  

WordPress  3.8.3  

Instalação do Aplicativo Instalação de plugins / temas

Migração de dados

Os Elementos da Experiência do Usuário Jesse James Garrettjjg@jjg.net

Arquitetura da Informação: Design estruturaldo espaço da informação para facilitar oacesso intuitivo ao conteúdo

Design de Interação: desenvolvimento defluxos de aplicação para facilitar as tarefasdo usuário, definindo como o este interagecom as funcionalidades do site

Design da Navegação: design dos elementosda interface para facilitar a movimentaçãodo usuário meio a arquitetura da informação

Design da Informação: No sentido Tufteano:design da apresentação da informação parafacilitar a compreensão

Especificações Funcionais: ‘conjunto defuncionalidades’: descrições detalhadas defuncionalidades que o site deve incluir parair ao encontro das necessidades do usuário

Requisitos de Conteúdo: Definição doselementos do conteúdo necessários ao sitepara ir ao encontro das necessidades dousuário

Design da Interface: como na IHC tradicional:design dos elementos da interface para facilitara interação do usuário com as funcionalidades

Design da Informação: No sentido Tufteano:design da apresentação da informação parafacilitar a compreensão

a Web como interface de software a Web como sistema de hipertexto

Design Visual: tratamento gráfico doselementos da interface (a “cara” do site)

Design Visual: tratamento visual do texto,elementos gráficos da página e componentesde navegação

tem

po

Abstrato Concepção

Concreto Maturidade

EspecificaçõesFuncionais

Requisitosde Conteúdo

Design deInteração

Arquiteturada

Informação

Design Visual

Design da InformaçãoDesign da

InterfaceDesign da

Navegação

Objetivos do siteNecessidades do usuário

Necessidades do usuário: Objetivos do site deorigem externa, identificados por meio depesquisa com o usuário, pesquisasetno/tecno/psicográficas, etc. Objetivos do site: Metas de negócio, criativas ououtras metas de origem interna para o site

orientado à tarefa orientado à informação

30 de março de 2000

Tradução para oPortuguês por

Livia Labate

© 2000-03 Jesse James Garrett http://www.jjg.net/ia/

Necessidades do usuário: Objetivos do site deorigem externa, identificados por meio depesquisa com o usuário, pesquisasetno/tecno/psicográficas, etc. Objetivos do site: Metas de negócio, criativas ououtras metas de origem interna para o site

Uma duplicidade básica: A Web foi originalmente concebida como um espaço de troca de informações hipertextuais, porém, o desenvolvimento crescente de sofisticadas tecnologias encorajou seu uso como uma interface de software remoto. Esta natureza dúbia resulta em muita confusão conforme, profissionais da experiência do usuário tentam adaptar suas terminologias para casos que estão além do escopo da aplicação original. O objetivo deste documento é definir alguns destes termos dentro de seus contextos apropriados e de esclarecer as relações subjacentes entre estes vários elementos.

Este esquema está incompleto: O modelo aqui delineado não aborda considerações secundárias (como aquelas que surgem durante o desenvolvimento técnico e de conteúdo) que podem influenciar as decisões durante o desenvolvimento da experiência do usuário. Além disto, este modelo não descreve um processo de desenvolvimento nem define os papéis dentro de um time de projeto. O que procura definir, são as considerações-chave que fazem parte do desenvolvimento da experiência do usuário na Web atualmente.

Card Sorting Es una técnica simples para diseño de experiencia de usuario en la cual un grupo de expertos en el tema (o representantes de usuarios) es orientado para generar un árbol de categorias. Es un enfoque útil para el diseño de la arquitectura de información, diseño de Interacción, definición de la estructura de menús y etiquetas

Definición de la AI

Card Sorting

Blueprint

Julio Takayama takayama@paho.org Diseño Gráfico e Interfaces - DGI|MTI BIREME | OPS | OMS

Muchas Gracias!