Download ANEXO 1

Anexo 1
Kiosco Ciudadano
Metodología
Diseño Gráfico
Hardware
SONY VAIO
Intel Pentium 4 640 con tecnología HT
3.20 GHz
1586 MB DDR SDRAM
160 GB en disco duro tecnología SATA
Cámara digital 7.1 mega pixeles
Software
Adobe flash cs4
Adobe illustrator cs4
Adobe photoshop cs4
Pano 2vr 2.3.1
Panorama Maker 5
Blender 2.49b
Microsoft Office Word 2007
Definición de requerimientos

Definiremos los requerimientos de comunicación para iniciar el diseño.
Para ello, relevaremos: Los distintos aspectos involucrados en el
mensaje comunicacional (contenido, publico objetivo),
Nombre:
Objetivo:
Misión:
Visión:
Usuario:
Medio de comunicación:
1

Aquellos aspectos de diseño gráfico que identifican a la Institución
(colores, tipografías, slogan,) y que necesariamente deben ser
utilizados, y aquellos aspectos que deben evitarse.
Congreso del Estado Libre Y Soberano de Hidalgo
Colores institucionales (Rojo, Verde, Negro, Gris)
Para reproducir con exactitud los colores de la identidad gráfica, se utilizan
muestras para los colores de identidad del Congreso del Estado Libre y
Soberano de Hidalgo serán: Verde, rojo, y negro (Sistema Pantone).
PANTONE (R) solid coated (Rojo PANTONE 1795 C), (Verde PANTONE 370
C), ( Negro PANTONE Black C)
Tipografía
La familia tipográfica institucional es Times New Roman-regular, y Poor
Richard-regular y su uso será obligatorio en las portadas de publicaciones ya
que en el resto de las aplicaciones podrá o no utilizarse, dependiendo del
diseño y de la aplicación de la imagen institucional se logrará con o sin
tipografía.
Dicha tipografía deberá ser utilizada en 50, 50, 50,100, negro o “calada” en
blanco, cuidando que el color de ésta sea el mismo de la identidad gráfica para
evitar que se propicie la confusión de la comunicación visual y proyectar una
imagen desfavorable de la Institución.
Escudo o Sello
La identidad gráfica del Congreso del Estado Libre y Soberano de Hidalgo solo
será expuesta en una sola presentación la cual podrá utilizarse: de forma
“circular”, con composición cuadrada.
Administración del proyecto
Red de trabajo
Idea—Marco Teórico---Metodología—Diseño—Programación—Ejecución
2
Orden
Aplicación
Descubrimiento
Proceso
Gráfico.
Desarrollo
Diseño
Arquitectura
(Cuadro red de trabajo)
Objetivo
Lograr establecer a través de recursos gráficos computarizados, un sistema
con una interfaz táctil que permita a los usuarios realizar múltiples acciones de
forma amistosa y de fácil interacción.
Lluvia de ideas
Plata
Centenario
Bicentenario
Kiosco
Rojo
3
Gris
Verde
Blanco
Bocetaje
Hablando en términos visuales comunicar las preferencias y características, a
través de la comunicación gráfica. Es también, el campo de pruebas para el
uso de la línea, valores tonales, masas, textura, formas y color – elementos de
composición – que después pueden ser traducidos a otros medios pictóricos.
El proceso de bocetaje desarrollado en tres etapas
1. Ideas gráficas
2. Desarrollo gráfico
3. Conclusión gráfica
Ilustrar:
Banner
Pleca
Fondos
Botones
Pantallas
Animar:
Paneo acceso al Congreso
Paneo Capilla Legislativa
Paneo Sala permanente
Paneo Explanada
Paneo Lobby
Paneo sala del pueblo
Banner (Moneda conmemoración Centenario y Bicentenario)
Botones
Introducción
Capilla Legislativa
4
LX Legislatura
Junta de Gobierno
Archivo y Biblioteca
Secretaria de Servicios Legislativos
Instituto de Estudios Legislativos
Auditoria Superior del Estado de Hidalgo
Centro de Desarrollo y Estudios Municipales
Comunicación Social
Galería fotográfica
Gestión Social
Recorrido Virtual
Mi Congreso
Inicio
Exportar:
Banner
Pleca
Fondos
Botones
Pantallas
Animaciones
Pruebas
5
Aspectos Técnicos
Descripción básica del equipo.
El equipo que se utiliza para la realización de este proyecto es un servidor hp
que a continuación se describen sus características:




Procesador Intel (R) Xeon (R).
CPU E5405 @ 2.006 GHZ.
Memoria Ram a 1.00 GB.
Sistema Operativo Windows 2003 Server Enterprise Edition R2 con
Service Pack 2.
Software Empleado.
El software ocupado para el desarrollo del proyecto es el siguiente:




Adobe Dreamweaver CS3.
Microsoft SQL Server 2008.
Adobe Flash CS3.
Tecnología Java (Servidor Web Tomcat maquina virtual de java).
Fase del Proyecto
Este proyecto está realizado con tecnología Web o bien de paginas HTML
llevando código java y esto se le llama JSP y tecnología Java con sus
diferentes aplicaciones, ya que permite mayor manejo de de páginas web
dinámicas y son más visibles y más llamativas para los usuarios que desean
consultar información.
A continuación se describen la tecnología que se implementa para la
realización del proyecto:
WEB
World Wide Web, o simplemente Web, es el universo de información accesible
a través de Internet, una fuente inagotable del conocimiento humano.
Es un dominio de internet de nivel superior.
Ventajas




Lograr estar a la altura de la competencia.
Mostrar una imagen en Internet.
Accesibilidad a sus productos o servicios.
Infinidad de posibilidades.
Desventajas
 La seguridad de datos confidenciales.
6
 La conexión a Internet. La dependencia del sistema a la conexión de
Internet.
HTML
HTML, siglas de HyperText Markup Language (Lenguaje de Marcado de
Hipertexto), es el lenguaje de marcado predominante para la elaboración de
páginas web. Es usado para describir la estructura y el contenido en forma de
texto, así como para complementar el texto con objetos tales como imágenes.
HTML se escribe en forma de "etiquetas", rodeadas por corchetes angulares
(<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un
documento, y puede incluir un script (por ejemplo Javascript), el cual puede
afectar el comportamiento de navegadores web y otros procesadores de HTML.
HTML también es usado para referirse al contenido del tipo de MIME text/html
o todavía más ampliamente como un término genérico para el HTML, ya sea en
forma descendida del XML (como XHTML 1.0 y posteriores) o en forma
descendida directamente de SGML (como HTML 4.01 y anteriores).
Ventajas
 Es el lenguaje de formateo para los navegadores web.
 Es fácil de entender y utilizar.
 Su uso es muy extendido.
Desventajas





No tiene semántica. Uso de etiquetas con nombres diferentes.
El contenido no puede ser reconocido ni procesado por programas.
Tiene un costoso mantenimiento de las páginas.
No tiene estándares comunes.
Solo tiene hiperenlaces simples (XML puede tener de 1 a n enlaces).
Xlink
En resumen, el html es un lenguaje muy fácil de comprender y muy utilizado
para la presentación de la información, pero esta no se puede procesar ni
almacenar, ya que no permite su manipulación por un programa debido a su
anarquía.
Java
Java es un lenguaje de programación por objetos creado por Sun
Microsystems, Inc. que permite crear programas que funcionan en cualquier
tipo de ordenador y sistema operativo.
7
Se usa el Java para crear programas especiales denominados applets, que
pueden ser incorporados en páginas web para hacerlas interactivas. Los
apliques Java requieren que el navegador utilizado sea compatible con Java.
Ventajas
 Es una fuente abierta, así que los usuarios no tienen que luchar con los
impuestos sobre patente pesados cada año.
 Independiente de la plataforma.
 El poder de Java API sea alcanzada fácilmente por los reveladores.
 Java realiza la colección de basura de las ayudas, así que la gerencia de
memoria es automática.
 Java asigna siempre objetos en el apilado.
 Java abrazó el concepto de especificaciones de la excepción.
 Lengua de la ayuda de la Multi-plataforma y ayuda para los telaservicios.
 Usando JAVA podemos desarrollar aplicaciones web dinámicas.
 Permite que usted cree programas modulares y códigos reutilizables.
Desventajas
Dado que la máquina virtual de java es un intérprete y redunda en una falta de
rendimiento con relación a aplicaciones equivalentes escritas en código
máquina nativo. Una respuesta a éste problema es el empleo de compiladores
JIT (Just In Time). Un compilador JIT interacciona con la máquina virtual de
java para convertir el código de bytes en código nativo.
El poder reducir los problemas de acceso a memoria y liberación automática
hacen de java un lenguaje poco apropiado para desarrollar aplicaciones de
base como Sistemas Operativos. Sin embargo Java puede ser implementado
en hardware como la tecnología jini que son redes adaptables y escalables.
JSP
JSP es el acrónimo de Java Server Pages. JSP es una tecnología Java que
permite a los desarrolladores generar contenido dinámico para web, en forma
de documentos HTML, XML u otros.
Ventajas
 Podemos crear aplicaciones web que se ejecuten en varios servidores
web, de múltiples plataformas, ya que Java es en esencia un lenguaje
multiplataforma.
8
 Las páginas JSP están compuestas de código HTML/XML mezclado con
etiquetas especiales para programar scripts ejecutables en el servidor en
sintaxis Java. Por lo tanto, las JSP podremos escribirlas con nuestro
editor HTML/XML habitual.
Desventajas
 El hosting (Sitio Web) en Java es más caro.
 Es más difícil de aprender que otros lenguajes.
 Es complicado la configuración del servidor web.
Desarrollo del proyecto
Esquema de Procedimiento del Proyecto
9
Diagrama de Flujo de Datos del Proyecto.
Descripción del Proyecto
Para ingresar al proyecto es mediante una URL o más bien por una dirección de pagina web la
dirección es la siguiente: http://192.168.22.63:8081/Kiosko y nos muestra la pantalla de
bienvenida y para ingresar a la página principal hay que dar un click a la moneda para que
tengamos acceso a la pagina, como se muestra en la pantalla No.1.
10
Click a la Moneda para tener
acceso.
Una vez que hayamos entrado a la página principal contiene un menú y una encuesta y botón
para ver los resultados de la encuesta, el menú consta de trece opciones las que son:













Introducción.
Capilla Legislativa.
LX Legislatura.
Junta de Gobierno.
Archivo y Biblioteca.
Secretaría de Servicios Legislativos.
Instituto de Estudios Legislativos.
Auditoría Superior del Estado de Hidalgo.
Centro de Desarrollo y Estudios Municipales.
Comunicación Social.
Galería Fotográfica.
Recorrido Virtual.
Comentarios.
Como se muestra en la pantalla No.2.
11
Cabe mencionar que todas las opciones nos guían a diferentes cosas pero el menú es el
mismo y nos permite navegar a distintos lados, las opciones de Recorrido Virtual y la opción de
LX Legislatura tiene otras opciones y que se mencionaran posteriormente.
En el menú LX Legislatura hay una opción que dice Diputados, como se muestra en la pantalla
No.3.
Opción Diputados
12
Una vez que hayamos oprimido el botón de Diputados nos mostrara una pantalla con tres
opciones que a continuación se mencionan:



Por Distritito.
Por Representación Proporcional.
Por Fracciones Parlamentarias.
Como se muestra en la pantalla No.4.
Otras Opciones
En la opción por Distrito nos mostrara el mapa del Estado de Hidalgo con sus diferentes
distritos en los que está compuesto el Estado y al darle clic a cada distrito nos mostrara una
ficha con el Diputado al cual pertenece ese distrito, también contiene un botón para regresar a
la página principal, como se muestra en la pantalla No.5.
13
Opción de Regresar a la Página
principal
En la opción “Por Representación Proporcional” nos muestra las fichas de los Diputados que
están por vía del no voto y al darle a una de la fichas de cada Diputado nos muestra la ficha
técnica de cada Diputado, como se muestra en la pantalla No.6 y 7.
14
En la opción de “Fracciones Parlamentarias” nos muestra todos los Diputados de los distintos
Partidos Políticos que conforman el Congreso del Estado Libre y Soberano de Hidalgo y se
realiza lo mismo que en lo anterior ya mencionado, como se muestra en la pantalla No.8.
Una vez que se hayan checado las fichas nos vamos al menú principal y seleccionamos la
opción de “Recorrido Virtual el cual nos muestra un menú principal que nos detecta los distintos
lugares del Congreso del Estado Libre y Soberano de Hidalgo y el Menú Principal del Recorrido
Virtual es el siguiente:
15







Entrada.
Capilla Legislativa.
Recinto.
Explanada.
Sala Permanente.
Loby.
Regresar.
Como se muestra en la Pantalla No.9.
Menú Principal del Recorrido
Virtual
A continuación seleccionamos cualquiera de las opciones y nos muestra el recorrido virtual de
la opción que hayamos deseado también podemos elegir la opción de regresar para que nos
lleve a la página principal, como se muestra en la pantalla No.10.
16
Opción Regresar a la Página
Principal.
Controles del Recorrido Virtual.
17
TEMA INFANTIL DEL CONGRESO DEL ESTADO DE HIDALGO
INTRODUCCIÓN
Un espíritu democrático debe construirse desde la niñez y, a partir de esta
etapa formativa, tomar conciencia de sus libertades, derechos y obligaciones
sobre los cuales se sustenta un régimen democrático.
Las niñas y niños tienen el derecho incuestionable de estar informados, opinar,
participar y prepararse en la toma de decisiones futuras, a fin de que asimilen
los principios de tolerancia, diálogo y civilidad, el respeto a las personas, a las
instituciones y el sentido de solidaridad y cooperación.
Por ello es de vital importancia involucrar a la niñez mexicana en el ejercicio
democrático del país.
CONTENIDO
1. Bienvenida
2. ¿Qué es el Congreso?
3. ¿Quiénes lo Integran?
4. ¿Qué hace un Diputado?
5. Conoce a tus Diputados
6. ¿Qué son las Comisiones Legislativas?
7. ¿Cómo se inicia una Ley?
8. ¿Cuáles son los Órganos de Gobierno?
9. ¿Cuáles son los Órganos Técnicos Administrativos?
10.
Mesa Directiva
HERRAMIENTAS DE TRABAJO PARA EL DESARROLLO DEL PORTAL
Equipo
LapTop
Fabricante: Dell
Modelo: Inspirion 1545
18
Procesador: Pentium ® DUAL-Core CPU T4400 @ 2.20 GHZ 2.20 GHZ
Memoria: 3.00 gb
Tipo de Sistema: Sistema operativo 64 bits
Software
Adobe Flash CS4
Adobe Illustrator CS4
Adobe Photoshop CS4
REQUERIMIENTOS
Objetivo: Que la niñez tenga un espacio atractivo que fomente el interés hacia el
Poder Legislativo y que al mismo tiempo conozcan las funciones y
atribuciones del Congreso del Estado Libre y Soberano del Estado de
Hidalgo.
Misión:
Que la niñez conozca y sean agentes de cambio para así promover el
interés superior de la infancia en la construcción de la ciudadanía.
Visión:
Fortalecer la transparencia, el conocimiento y la difusión de principios
valores.
PANTALLA
19