DISEÑO
EQUIPO 6:
BARCENA ORTEGA GENARO GALINDO GARCIA RODRIGO GARCIA GONZALEZ LEONARDO CONTRERAS RICARDO
¿DEFINICIÓN DE DISEÑO? Un diseño es el resultado final de un proceso, cuyo objetivo es buscar una solución idónea a cierta problemática particular, pero tratando en lo posible de ser práctico y a la vez estético en lo que se hace. Para poder llevar a cabo un buen diseño es necesario la aplicación de distintos métodos y técnicas de modo tal que pueda quedar plasmado bien sea en bosquejos, dibujos, bocetos o esquemas lo que se quiere lograr para así poder llegar a su producción y de este modo lograr la apariencia más idónea y emblemática posible.
MAPA DE SITIO Es la organizaciรณn lรณgica y estructurada de los contenidos que se van a presentar en el sitio web y no necesariamente guarda la misma estructura.
COMO CREAR UN MAPA DE SITIO Mediante el siguiente ejemplo se crea el siguiente mapa de sitio. • Coloca el nombre de tu sitio en la parte superior del mapa.
• Debajo de el nombre del sitio, coloca los títulos de cada grupo, uno alado del otro. • Los grupos deben estar ordenados de izquierda a derecha, con los más importantes primero.
• Estos grupos se convertirán en las categorías principales de tu sitio web o aplicación.
OBJETIVO La importancia de elaborar un mapa del sitio radica en la comprensión del orden de presentación de las pantallas con los contenidos (páginas web, aplicación etc) y la flexibilidad de moverse entre ellas (hipervínculos).
EN EL DISEÑO DEL MAPA DE NAVEGACIÓN SE DEBE: • Seleccionar la pantalla de entrada al sitio web presentación (página web: index.html).
• Ordenar de manera jerarquizada las pantallas con los contenidos (por niveles o categorías).
• Establecer los vínculos entre pantallas (páginas web) permitiendo una navegación hipertextual.
EJEMPLO 1:
• En esta estructura de mapa de navegación (sitio Web) tenemos dos niveles: • El primero, la navegación es posible entre las actividades e index de manera hipertextual. • El segundo, la navegación hipertextual es posible entre actividad y sus páginas correspondientes (contenido teórico, laboratorio, aplicación, evaluación, glosario y enlaces); por otro lado, permite ir desde cualquiera de estas páginas hasta las otras actividades entrando en el primer nivel de navegación.
EJEMPLO 2:
HERRAMIENTAS (SOFTWARE)PARA REALIZAR: Gliffy • Es una impresionante herramienta para crear diagramas de Venn, gráficos circulares, gráficos de barras, wireframes, análisis FODA y otros tipos de diagramas. • Se pueden crear hasta 5 funciones completas con diagramas gratis. Sin embargo, la cuenta gratuita permite a un usuario, almacenamiento de 2mb.
WriteMaps
• permite crear, editar y compartir tus sitemaps en lĂnea y acceder a ellos desde cualquier lugar.
• Dia es una aplicación informática de propósito general para la creación de diagramas está diseñado como un sustituto de la aplicación comercial Visio de Microsoft. • Se puede utilizar para dibujar diferentes tipos de diagramas. • Actualmente se incluyen diagramas entidad-relación, diagramas UML, diagramas de flujo, diagramas de redes, diagramas de circuitos eléctricos, etc.
• Nos permite crear diagramas para iPhone, iPad, Android, Windows pone, Surface y web.
• Es fácil de usar, no requiere un instalador se trabaja desde internet. • Reduce tiempo de diseño y reduce costos de proyectos.
• Es gratuito y versión de paga. • Contiene una caja de herramientas utilizados en aplicaciones web, también nos permite crear nuestras propias herramientas. • Permite crear anotaciones del proyecto • Permite guardar el proyecto en formato pdf para poder imprimir, enviar por correo o mostrar al cliente.
ArgoUML • Es una herramienta de código abierto que permite la creación de modelos uml. • Permite crear diagramas de clases, estados, casos de usos, actividad, colaboración, desarrollo, secuencia.
• Es una herramienta para el modelamiento de software basado en los estándares UML (Unified Modeling Language) y MDA (Model Driven Arquitecture), • – Diagrama de casos de uso • – Diagrama de clase • – Diagrama de secuencia • – Diagrama de colaboración.
• – Diagrama de estados • – Diagrama de actividad. • – Diagrama de componentes • – Diagrama de despliegue.
• Bibliografia: • https://cursoweb20.net/2012/08/03/que-es-un-mapa-del-sitio-o-sitemap-de-una-web/ • http://www.sitemaps.org/es/protocol.html
• https://mx.godaddy.com/help/que-es-un-mapa-de-sitio-3643 • http://www.guiadigital.gob.cl/guiaweb_old/guia/capitulos/dos/estructura.htm • http://dia-installer.de/index.html.es • http://www.pcwebtips.com/2012/10/paginas-crear-driagramas-graficos-online.html • https://ninjamock.com/ • http://staruml.io/download • http://dia-installer.de/ • https://ninjamock.com/