UF6-1-3 Fases de Proyecto

UF 6.1 Diseño de interfaz de usuario Fases de un proyecto multimedia

Módulo 6

fases de un proyecto multimedia

I. anteproyecto o preproducción > objetivos, sinopsis > guión hipertexual > guión gráfico > diseño de GUI

II.produción > desarrollo de la aplicación > elaborar los contenidos de la aplicación(vídeos, textos, animaciones, sonido,...)

III. difusión > publicación on-line, testeo y mantenimiento

UF 6.1 Diseño de interfaz de usuario


I. anteproyecto o preproducción > objetivos, sinopsis > guión hipertexual > guión gráfico > diseño de GUI

II.produción > desarrollo de la aplicación > elaborar los contenidos de la aplicación(vídeos, textos, animaciones, sonido,...)

III. difusión > publicación on-line, testeo y mantenimiento



anteproyecto o preproducción: > análisis > diseño > elaboración de un prototipo > evaluación




fases de un proyecto multimedia: análisis

análisis En esta etapa se reúne la siguiente información: • Los objetivos del proyecto • Las características de los usuarios objetivos (target). • Los requisitos técnicos del desarrollo. Una herramienta muy útil para analizar las características de los usuarios es el modelaje del usuario UF 6.1 Diseño de interfaz de usuario


análisis



análisis 1. Cuál es el contenido de la aplicación? 2. A qué tipo de usuario va dirigida? 3. Cuál es el soporte de la aplicación? 4. Cuáles son los requisitos definidos por el cliente? 5. Cuáles son los recursos humanos disponibles? 6. Cuál es el tiempo de vida del producto? 7. Se han de actualizar los contenidos?



Análisis: el briefing

el briefing ‘informe’ o documento que realiza el cliente describiendo cuales son las necesidades y requisitos del proyecto


fases de un proyecto multimedia: diseño

Diseño

Pasos en la fase de diseño > Modelaje de usuario > Diseño conceptual > Diseño de contenidos > Diseño visual



Diseño: modelaje de usuario

Modelaje del usuario Se reúne información sobre los usuarios potenciales definidos en la etapa de análisis. Se definen los perfiles de usuario teniendo en cuenta: 1. sus necesidades 2. su experiencia o conocimientos 3. sus condiciones de acceso a la aplicación




Modelaje del usuario > Si la audencia es heterogénea, se pueden crear arquetipos o personas con una identidad concreta. > Sirve para definir las características de los posibles usuarios. > Se crean unas fichas con una fotografía y los datos de la persona (ficticios).











fases de un proyecto multimedia: modelaje




Diseño: modelaje de usuario La ficha de la persona debe incluir:

Características fundamentales 1 – Perfil geográfico. Lugar de residencia i de trabajo, i nivel de vida. 2 – Perfil demográfico. Edad, género, familia, ingresos, ocupación, educación, etc. 3 – Perfil psicosocial. Clase social, estilo de vida, aficiones, características personales.

Relación 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 definición de diferentes perfiles de usuario. • Cuál es el nivel de relación entre la persona y la aplicación? Se puede tratar de un usuario ocasional o de un usuario frecuente. El diseñador debe definir qué tipo de relación espera que la persona mantenga con el producto.




Escenarios - El usuario necesita conocimientos especiales? - Cuándo va a utilizar la aplicación, en que momento del día, desde qué lugar, mediante que dispositivo. - Definir la interacción: será continua, con que frecuencia, será compleja... – Qué tipo de experiencia espera de la interacción? Quiere vivir una aventura, prefiere sentir libertad, seguridad, confianza..







Diseño conceptual

Diseño conceptual: definir la arquitectura de la información de la aplicación > esquema de la organización de los contenidos y la > navegación (nodos y enlaces) > detetermina las relaciones entre apartados y las transiciones entre pantallas o páginas diagrama de hipertexto / mapa web / guión multimedia UF 6.1 Diseño de interfaz de usuario


Diseño conceptual

técnica del card sorting



Diseño conceptual



Diseño conceptual



Diseño conceptual

Diseño conceptual: wireframe el wireframe es un esquema que nos sirve para ubicar los elementos de la interfaz (contenidos, elementos de navegación..)

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



Diseño conceptual

fases fases de un proyecto multimedia: diseño

Diseño conceptual


Diseño conceptual





Diseño conceptual


Diseño conceptual

Diseño conceptual: storyboard si el producto multimedia incluye animaciones, transiciones entre pantallas (videojuegos) se genera el storyboard



Diseño conceptual



Diseño conceptual

cardsorting diagrama hipertextual wireframe



Diseño visual

Fases del diseño visual

1. análisis del libro de estilo (si lo hay) 2. diseño de retícula 3. elegir la gama cromática. Si hay libro de estilo se seguirá sus criterios. 4. elección de la tipografía. Máximo dos tipos de letra diferentes. 5. Generación de los elementos del diseño. UF 6.1 Diseño de interfaz de usuario


Diseño visual

Diseño visual se definen las características gráficas de la interfaz tenemos en cuenta: los datos de la fase de análisis, modelaje, y el diseño conceptual (la estructura de los contenidos)


fases de un proyecto multimedia: prototipado

Prototipado

elaboración de un prototipo - baja fidelidad (papel, dibujo) - alta fidelidad (con las mismas herramientas que en la fase de desarrollo)


fases de un proyecto multimedia: evaluación

Evaluación

Test de usuario - es la fase más importante del proceso de diseño centrado en el usuario - se testea sobre usuarios reales


fases de un proyecto multimedia: evaluación

Evaluación: test de usuario


fases de un proyecto multimedia: producción

Producción fase de desarrollo del producto - trabajo de maquetación HTML/CSS - generación de contenidos y exportación al formato adecuado - programación (bases de datos, interacción,etc..)

.


fases de un proyecto multimedia: difusión

Difusión

- publicación online - publicidad - actualizaciones


fases de un proyecto multimedia: roles

Roles

Director del proyecto Es necesario contar con un equipo. Las tareas se reparten en función de los perfiles de los miembros del equipo.

El director será quien se responsabilice de la relación con el cliente y supervise el desarrollo de la página de principio a fin. Tendrá que solucionar los problemas que vayan surgiendo y asegurar una buena comunicación entre el equipo y el cliente.



Roles

Director de arte y diseñador

Debe ser consciente de que las tareas de impresión y diseño 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 además el funcionamiento de internet (usabilidad, navegación, conexiones, etc..)



Roles Editor y redactor

- reestructura los textos y los ajustar al desplazamiento de las páginas web para poder incluir enlaces y motores de búsqueda. El editor, quien en ocasiones sera también 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 diseño deficiente.



Roles

Codificador/especialista en html

Pero en aquellos equipos donde tengan cargos y obligaciones diferenciados, el codificador tomará los trabajos gráficos del diseñador, los exportará, los convertirá al lenguaje html y les aplicará estilos CSS. Trabajarán con una aplicación visual como Dreamweaver o programarán manualmente el codigo en un editor de texto



Roles

Programador/ingeniero informático

A veces resulta difícil deslindar esta tarea de la del codificador porque los programadores también 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 interacción complejas y de la integración de bases de datos. Dada la existencia de diferentes tecnologías, puede ser que necesite alguien con una especialización concreta para proyetos específicos (por ejemplo, PHP o ASP, JavaScript, Jquery..)

. UF 6.1 Diseño de interfaz de usuario

UF6-1-3 Fases de Proyecto

Recommend Documents