Herramientas de Diseo

TEMA:CUARTA SEMANA -Herramientas de Diseo -Tipos de herramientas -Objetivos de las herramientas de diseo - Categoras de las herramientas de desarrollo -Diseo de la interfaces de usuarios -Objetivos de la interfaz de usuario -Tipos de interfaz -Normas la interfaz -La retroalimentacin

INTEGRANTES:: Guadamur Cauti Thersi Huamn Crdenas Mijail Snchez Callirgos Osmar

FACULTAD DE INGENIERA ELECTRNICA E INFORMTICAingenieria de Sistemas e informacion II

IntroduccinEtapas del Diseo del SistemaEl Diseo de los datosEl Diseo ArquitectnicoEl Diseo de la InterfazEl Diseo de procedimientos

Tipos de herramientas

Herramientas de especificacin Apoyan el proceso de formular las caractersticas que deben tener una aplicacinHerramientas para presentacinSe utilizan para describir la posicin de datos

Herramientas CASE ComputerAidedSoftwareEngineering,ingeniera de softwareasistida porcomputadoraEl empleo de herramientas Case permiten integrar el proceso de ciclo de vida:Anlisis de datos y procesos integrados mediante un repositorio.Generacin de interfaces entre el anlisis y el diseo. Generacin del cdigo a partir del diseo.Control de mantenimiento.

Tipos de Herramientas Case

No existe una nica clasificacin de herramientas CASE y, en ocasiones, es difcil incluirlas en una clase determinada. Podran clasificarse atendiendo a:Las plataformas que soportan.Las fases del ciclo de vida del desarrollo de sistemas que cubren.La arquitectura de las aplicaciones que producen.Su funcionalidad.

Herramientas de planificacin de sistemas de gestinHerramientas de anlisis y diseoHerramientas de integracin y pruebaHerramientas de gestin de prototiposHerramientas de mantenimientoHerramientas de gestin de proyectosHerramientas de soporteEjemplo: Utilizando la funcionalidad como criterio principal, es la siguienteObjetivos de las herramientas de diseoSatisfacer los requerimientos de los usuarios:Especificar los elementos de diseo lgico

Proporcionar las especificaciones de software

Ajustarse a estndares de diseo

Fcil de usar

Categoras de las herramientas de desarrolloHerramientas de tipo front-end

Herramientas de tipo back-end

Herramientas integrales

Front-end: lado del cliente (HTML, CSS, HTML5, CSS3, Javascript, jQuery)

Son los encargados de maquetar la estructura semntica del contenido (HTML), codificar el diseo en hojas de estilo (CSS) y agregar la interaccin con el usuario (Javascript).

Back-end: Orientado hacia el lado del servidor (PHP, Ruby on Rails, Django, Node.js, .NET)

En Facebook, por ejemplo, PHP manda la estructura bsica del sitio web, pero son mltiples programas y servidores hechos en C++ o Erlang los que procesan la informacin en tiempo real (chats, comentarios, notificaciones) y las envan y reciben a travs de Javascript en el navegador.

Diseo de la interfaces de usuarios

Qu es una diseo interfaz de usuario?

El diseo de la interfaz de usuario crea un medio de eficaz de comunicacin entre los seres humanos y la computadora. Siguiendo un conjuntos de principios de diseo de interfaz , el diseo identifica los objetos y acciones de esta y luego crea un plantilla de pantalla que constituye la base del prototipo de la interfaz de usuarioExisten tres reglas para el diseo de la interfaz

Dar el control al usuarioEs decir un sistema que reaccione a las necesidades del usuario y que le ayude a hacer las cosas.Reducir la carga en la memoria del usuario Una interfaz de usuario bien diseada no depender de la memoria del usuario. Siempre que sea posible, el sistema debe recordar la informacin pertinente y ayudar al usuario con un escenario de interaccin que le facilite el uso de la memoria.Lograr que la interfaz sea consistenteToda la informacin visual este organizada de acuerdo con un estndar de diseo que se mantenga en todas la presentaciones de pantalla.

Recortar pasos al usuario

Excel Word

El Diseador de la Interfaz debe cumplir el principio ms importante del diseo de la interfaz de usuario: quien conoce al usuario, conoce las tareas .

El proceso de diseo de las interfaces de usuario es iterativo y se puede representar mediante un modelo espiral.

DiseoAnlisis de requerimientos de productoAnlisis de las tareasConocimiento del usuarioRevisin de posibilidades para la implementacinImplementacin Generacin de prototipos (profundos o amplios , para investigacin general o de ajustes)Desarrollo de la aplicacin, sitio o sistema

Por ejemplo tenemos herramientas como:BALSAMIQ

Otras herramientas son:HOTGLOOMOCKFLOWMOCKUP BUILDERINVISIONPROTO.IO

MEDICION(test de usabilidad)Planificacin (desarrollo de plan, definiciones de la medidas, seleccin de participantes ,formacin de observadores)Test(prueba piloto, tests con usuarios)EvaluacinConclusin (anlisis de los datos, elaboracin de informe, resultado y recomendaciones)Comparacin contra estndares (internos y/ o externos) versiones anteriores del mismo producto y productos competidoresVerificacin de las deferencias Generacin de nuevas metasCiclo de evaluacin del diseo de la interfaz de usuario

Objetivos de la interfaz de usuarioEs definir un conjunto de objetos y acciones de interfaz que permitan al usuario llevar a cabo todas las tareas definidas para que cumplir con todos los objetivos de usabilidad definidos por el sistema.

La actividad de implementacin comienza con la creacin de un prototipo que permita evaluar los escenarios de utilizacin.

Cul es Mejor para el Usuario?

Consideraciones La interfaz de usuario debe ser diseada considerando las habilidades, experiencia y expectativas de los usuarios Los usuarios muchas veces juzgan al sistema por su interfaz ms que por su funcionalidad Una interfaz mal diseada puede causar que un usuario cometa errores catastrficos Muchos sistemas nunca son usados debido a un mal diseo de la interfaz de usuarioTIPOS DE INTERFAZEl usuario emite comandos en lenguaje natural .Accesible a usuarios casualesFcil de ampliarSe requiere teclear ms .Los sistemas de comprensin de lenguaje natural no son fiables.

Ejemplo: Sistemas de horarios, sistemas www de recuperacin de la informacin.

Interfaces de lenguaje naturalInterfazPregunta/RespuestaEn la pantalla se despliega una pregunta para el usuario.El usuario introduce una respuesta.La computadora despus acta con en esa informacin de entrada de acuerdo con su programa.Para instalar un software se usan asistentes.

Interface tipo Men Proporciona al usuario una lista en la pantalla de las opciones disponibles. El usuario est limitado a las opciones desplegadas.El usuario no necesita conocer el sistema.La consistencia es importante en el diseo de una interfaz de tipo men.Pueden anidar dentro de otro para llevar a un usuario a las opciones de un programa.

Siempre de despliega la barra de men principal.El men principal de usar palabras simples. Las opciones de men principal siempre despliegan mens desplegables secundarios. Las artculos de men en gris no estn disponibles para la actividad.

Lineamiento del interface tipo men

Esta tcnica de interfaz tambin se conoce como mtodo basado en el formulario y en formularios de entrada/salida.Las interfaces de entrada/salida consisten de formularios en la pantalla que se basan en la Web.El formulario a menudo es un facsmil de un formulario impreso que ya es familiar para el usuario

Interface de entrada / salidaInterface de lenguaje de comandos Permite al usuario controlar la aplicacin con una serie de pulsaciones del teclado.El lenguaje de comandos no tiene un significado inherente para el usuario.Es una interfaz popular que es ms refinada.El lenguaje de comandos ofrece al usuario mayor flexibilidad y control.Los lenguajes de comandos requieren memorizar las reglas de sintaxis.Los usuarios experimentados tienden a preferir los lenguajes de comandos, posiblemente porque les permite trabajar ms rpido.

Interfaces graficas de usuarioPermiten la manipulacin directa de la representacin grfica en pantalla.

La clave para las interfaces graficas es la retro-alimentacin constante que proporcionan.

La creacin de las interfaces graficas representa un reto, debido a que se debe inventar un modelo apropiado.Retroalimentacin Es un proceso por el que una cierta proporcin de la seal de salida de un sistema se redirige de nuevo a la entrada.

Compara el comportamiento actual con los objetivos predeterminados y devuelve la informacin que describe el vaco entre el desempeo actual y el esperado.

Incrementa la confianza humana.Tipos de retroalimentacin Reconociendo la aceptacin de la entrada.

Reconociendo que la entrada es correcta.

Notificando que la entrada es incorrecta.

Explicando un retraso en el procesamiento.Reconociendo que una peticin est completa.Ofreciendo a los usuarios retroalimentacin ms detallada