El Documento de Diseño Es el documento que se crea para reflejar las especificaciones del proyecto y puede servir para buscar inversores Sirve tanto al cliente como a los desarrolladores del proyecto Debe incluir todas las peticiones del cliente y estar centrado en el resultado final No debe incluir los pasos del prototipado Se realiza en la fase de diseño En algunos casos puede incluir la planificación temporal y económica

Contenido del documento Portada Nombre del proyecto Imagen representativa o logo Número de versión del documento Fecha de la versión actual Puede incluir el logotipo o la estética del desarrollador Índice de contenidos

Contenido del documento Apartado de “Diseño de la aplicación” Concepto Un par de líneas que describan la aplicación. No debe ser muy extenso. Es lo que da tiempo a decir a un posible inversor mientras sube el ascensor. Por ejemplo, whatsapp: “Una plicación de mensajería móvil en la que los usuarios pueden chatear entre ellos, crear grupos y enviarse fotos, vídeos y otros archivos”.

Contenido del documento Género o tipo de aplicación Se especifica si es un juego, una aplicación de mensajería, un programa de contabilidad, etc. Usabilidad Una descripción breve de cómo se usa la aplicación, sin entrar en detalles específicos sobre cómo se va a hacer. Soportes Se listan las plataformas para las que está orientada la aplicación.

Contenido del documento Objetivos Se listan los objetivos que se pretenden satisfacer con la creación del proyecto Pueden ser ofrecer un servicio que no existe, mejorar un servicio existente o proporcionar entretenimiento o diversión Importante remarcar cómo la aplicación va a conseguir esos objetivos

Contenido del Documento Apartado “Diseño Técnico” Se listan las escenas o pantallas de la aplicación con una pequeña descripción y se realiza un diagrama con la secuencia Para webs que tienen varios apartados en la misma página se pueden incluir diferentes partes dentro de una escena

Ejemplo de diagrama de escenas

Contenido del documento Controles Debemos indicar cómo se usa la aplicación y con qué controles: ratón y teclado, pantalla táctil etc. Para proyectos web basados en enlaces y botones debemos describir cuáles son los controles, qué hace cada uno y cómo puede usarlos el usuario. Mecánicas Las mecánicas de una aplicación son los átomos de interacción con el usuario, como “subir una foto”, “Postear en el muro” o “reproducir un vídeo”.

Contenido del documento Diseño de escenas / pantallas Para cada una de las escenas de la aplicación, debemos hacer un diseño detallado, indicando los elementos Nos servirá para determinar las fuentes audiovisuales que necesitaremos

Contenido del documento Diagrama de flujo Es una representación de la cadena de actividades y funciones que se llevan a cabo en la aplicación Los diagramas se pueden anidar para representar abstracción Para cada mecánica debemos tener su diagrama de flujo correspondiente, de forma que entre todos, representen el flujo completo de la aplicación

Ejemplo de diagrama de flujo

Contenido del documento Apartado de “desarrollo” Se describen los métodos de desarrollo que se van a utilizar, tecnología, lenguaje de programación, etc, que mejor se adapten a los requisitos Scripts o archivos de código Habitualmente se utiliza la palabra script para referirse a un fragmento de código que hace una tarea Debemos confeccionar una lista con los archivos que vamos a necesitar y qué hace cada uno. Esta lista no tiene que ser exahustiva, sino una estimación.

Ejemplo de lista de scripts En el ejemplo de la web del cocinero, los scripts o archivos de código que tendríamos serían los siguientes: HTML Index.html → Portada o inicio de la web, con la presentación Receta1.html → Un archivo por cada receta CSS Estilo.css → Un archivo para el estilo general de la página Javascript Utilidades.js → Un archivo para efectos visuales

Contenido del documento Apartado de “Gráficas o Arte Gráfico” Convenciones de estilo Se dará una descripción del estilo general de la página: códigos de colores, tipografía, estética deseada Se especificarán los requisitos de las fuentes gráficas: formato de las imágenes, peso máximo y resolución Listado de fuentes necesarias Si vamos a necesitar 10 imágenes, se listan todas, con una pequeña descripción si es necesario

Contenido del documento Apartado de “Audio” Convenciones de estilo Se especificarán los requisitos de las fuentes sonoras: formato del audio, peso máximo y calidad Listado de fuentes necesarias Si vamos a necesitar 10 sonidos, se listan todos, con una pequeña descripción si es necesario En este apartado se suele diferenciar entre sonido FX y música

Contenido del documento Apartado de “Vídeo” Convenciones de estilo Se especificarán los requisitos de las fuentes de vídeo: formato, peso máximo y resolución Listado de fuentes necesarias Si vamos a necesitar 10 vídeos, se listan todos, con una pequeña descripción si es necesario