uf6-1-3 fases de proyecto

UF 6.1 Diseo de interfaz de usuario Fases de un proyecto multimedia

Mdulo 6 Thursday, October 10, 13

UF 6.1 Diseo de interfaz de usuario

I. anteproyecto o preproduccin> objetivos, sinopsis> guin hipertexual> guin grfico> diseo de GUI

II.producin

> desarrollo de la aplicacin> elaborar los contenidos de la aplicacin(vdeos, textos, animaciones, sonido,...)

III. difusin > publicacin on-line, testeo y mantenimiento

fases de un proyecto multimedia

Thursday, October 10, 13

UF 6.1 Diseo de interfaz de usuarioUF 6.1 Diseo de interfaz de usuario

anteproyecto o preproduccin:> anlisis> diseo> elaboracin de un prototipo> evaluacin




En esta etapa se rene la siguiente informacin:

Los objetivos del proyecto Las caractersticas de los usuarios objetivos (target). Los requisitos tcnicos del desarrollo.

Una herramienta muy til para analizar las caractersticas de los usuarios es el modelaje del usuario

anlisis

fases de un proyecto multimedia: anlisis



anlisis




anlisis

1.Cul es el contenido de la aplicacin?2.A qu tipo de usuario va dirigida?3.Cul es el soporte de la aplicacin?4.Cules son los requisitos definidos por el cliente?5. Cules son los recursos humanos disponibles?6.Cul es el tiempo de vida del producto?7.Se han de actualizar los contenidos?




el briefing

informe o documento que realiza el cliente describiendo cuales son las necesidadesy requisitos del proyecto


Anlisis: el briefing


Pasos en la fase de diseo

> Modelaje de usuario> Diseo conceptual> Diseo de contenidos> Diseo visual


fases de un proyecto multimedia: diseo

Diseo



Modelaje del usuarioSe rene informacin sobre los usuarios potenciales definidos en la etapa de anlisis.Se definen los perfiles de usuario teniendo en cuenta:1. sus necesidades2. su experiencia o conocimientos3. sus condiciones de acceso a la aplicacin


Diseo: modelaje de usuario


Modelaje del usuario > Si la audencia es heterognea, se pueden crear arquetipos o personas con una identidad concreta.> Sirve para definir las caractersticas de los posibles usuarios.> Se crean unas fichas con una fotografa y los datos de la persona (ficticios).






fases de un proyecto multimedia: modelaje



La ficha de la persona debe incluir:Caractersticas fundamentales

1 Perfil geogrfico. Lugar de residencia i de trabajo, i nivel de vida.2 Perfil demogrfico. Edad, gnero, familia, ingresos, ocupacin, educacin, etc.3 Perfil psicosocial. Clase social, estilo de vida, aficiones, caractersticas

personales.Relacin entre la persona i el producto. La persona, es un cliente, un empleado o un socio? Se puede distinguir entre el

desarrollo de una intranet o extranet, o la definicin de diferentes perfiles de usuario.

Cul es el nivel de relacin entre la persona y la aplicacin? Se puede tratar de un usuario ocasional o de un usuario frecuente. El diseador debe definir qu tipo de relacin espera que la persona mantenga con el producto.





Escenarios

- El usuario necesita conocimientos especiales?- Cundo va a utilizar la aplicacin, en que momento del da, desde qu lugar, mediante que dispositivo.- Definir la interaccin: ser continua, con que frecuencia, ser compleja...Qu tipo de experiencia espera de la interaccin? Quiere vivir una aventura, prefiere sentir libertad, seguridad, confianza..





UF 6.1 Diseo de interfaz de usuarioUF 6.1 Diseo de interfaz de usuarioThursday, October 10, 13

Diseo conceptual:

definir la arquitectura de la informacin de la aplicacin> esquema de la organizacin de los contenidos y la > navegacin (nodos y enlaces)> detetermina las relaciones entre apartados ylas transiciones entre pantallas o pginas

diagrama de hipertexto / mapa web / guin multimedia



Diseo conceptual


tcnica del card sorting



Diseo conceptual




Diseo conceptual


Diseo conceptual: wireframe

el wireframe es un esquema que nos sirve para ubicar los elementos de la interfaz (contenidos, elementos de navegacin..)

http://www.gliffy.com/examples/



Diseo conceptual



Diseo conceptual


fases de un proyecto multimedia: diseo fases de un proyecto multimedia: diseo

Diseo conceptual




Diseo conceptual


UF 6.1 Diseo de interfaz de usuarioThursday, October 10, 13


Diseo conceptual


Diseo conceptual: storyboard

si el producto multimedia incluye animaciones, transiciones entre pantallas (videojuegos)se genera el storyboard



Diseo conceptual




Diseo conceptual


cardsortingdiagrama hipertextual

wireframe



Diseo conceptual


Fases del diseo visual

1. anlisis del libro de estilo (si lo hay)2. diseo de retcula3. elegir la gama cromtica. Si hay libro de estilo se seguir sus criterios.4. eleccin de la tipografa. Mximo dos tipos de letra diferentes.5. Generacin de los elementos del diseo.



Diseo visual


Diseo visual

se definen las caractersticas grficas de la interfaz

tenemos en cuenta: los datos de la fase de anlisis, modelaje, y el diseo conceptual (la estructura de los contenidos)



Diseo visual


elaboracin de un prototipo

- baja fidelidad (papel, dibujo)- alta fidelidad (con las mismas herramientas que en la fase de desarrollo)


fases de un proyecto multimedia: prototipado

Prototipado


Test de usuario- es la fase ms importante del proceso de diseo centrado en el usuario

- se testea sobre usuarios reales


fases de un proyecto multimedia: evaluacin

Evaluacin



fases de un proyecto multimedia: evaluacin

Evaluacin: test de usuario


fase de desarrollo del producto

- trabajo de maquetacin HTML/CSS- generacin de contenidos y exportacin al formato adecuado- programacin (bases de datos, interaccin,etc..)

.


fases de un proyecto multimedia: produccin

Produccin


- publicacin online- publicidad- actualizaciones


fases de un proyecto multimedia: difusin

Difusin



fases de un proyecto multimedia: roles

Roles

Director del proyecto

Es necesario contar con un equipo. Las tareas se reparten en funcin de los perfiles de los miembros del equipo.El director ser quien se responsabilice de la relacin con el cliente y supervise el desarrollo de la pgina de principio a fin. Tendr que solucionar los problemas que vayan surgiendo y asegurar una buena comunicacin entre el equipo y el cliente.




Roles

Director de arte y diseador

Debe ser consciente de que las tareas de impresin y diseo web son muy diferentes y que todos los elementos del sitio deben funcionar dentro de una interfaz general.

Es imprescindible que tenga buenos conocimientos sobre plataformas y navegadores, que est familiarizado con HTML y CSS, y que entienda adems el funcionamiento de internet (usabilidad, navegacin, conexiones, etc..)




Roles

Editor y redactor

- reestructura los textos y los ajustar al desplazamiento de las pginas web para poder incluir enlaces y motores de bsqueda.

El editor, quien en ocasiones sera tambin el autor del texto, sera el encargado de adaptarlo. Esa persona ser la responsable de actualizar los contenidos del sitio web. Es convieniente que esta tarea la realice un profesional, pues un texto con un estilo pobre da tan mala imagen como un diseo deficiente.




Roles

Codificador/especialista en htmlPero en aquellos equipos donde tengan cargos y obligaciones diferenciados, el codificador tomar los trabajos grficos del diseador, los exportar, los convertir al lenguaje html y les aplicar estilos CSS.

Trabajarn con una aplicacin visual como Dreamweaver o programarn manualmente el codigo en un editor de texto




Roles

Programador/ingeniero informticoA veces resulta difcil deslindar esta tarea de la del codificador porque los programadores tambin se encargan de etiquetar el texto y crear los scripts. Si en un equipo existen los dos puestos, el programador suele encargarse por lo general de las tareas de interaccin complejas y de la integracin de bases de datos.Dada la existencia de diferentes tecnologas, puede ser que necesite alguien con una especializacin concreta para proyetos especficos (por ejemplo, PHP o ASP, JavaScript, Jquery..)

.




Roles

Otros roles:- experto en arquitectura de la informacin y usabilidad- community manager- SEO manager

.


uf6-1-3 fases de proyecto

Documents