Maquetación del sitio web

Tecnologías de la información 3

Proyecto Certificación Dreamweaver 2015B

Desarrollo del proyecto “Comunicación comercial”

Diseño

El diseño de la interfaz de usuario inicia con la identificación de los requerimientos del usuario, esto forma la base para crear una plantilla de la pantalla y posteriormente la colocación de iconos, imágenes, textos, títulos de las ventanas y las características del menú de navegación. 

En el siguiente enlace encontrarás algunos consejos para realizar el diseño gráfico de las páginas de tu sitio.

http://mocionsoft.com/blog/interfaz-de-usuario-tips-para-tener-en-cuenta/

Entre las páginas 106 y 113 de tu manual, encontrarás información acerca de los elementos que debes considerar a la hora de diseñar el sitio web. Revisa también las actividades desarrolladas en este blog sobre el diseño de interfaces. (Post  del martes, 13 de octubre de 2015)

Propuesta de la campaña

Tecnologías de la información 1

Proyecto Certificación Power Point 2015B

Habilidades tecnológicas (Ver matriz de habilidades en la página 201 del manual)

Instrucciones:

• Genera una diapositiva que enumere los medios de difusión que se van a emplear en tu campaña.

http://www.endvawnow.org/es/articles/1235-principales-pasos-en-la-elaboracion-de-una-estrategia-de-comunicacion-.html?next=1236

• Genera una diapositiva en donde se explique la utilidad del cartel como medio de difusión en una campaña.

http://didacticosfesar.blogspot.mx/p/que-es-el-cartel-esun-material-grafico.html

• Genera una diapositiva en donde se explique la utilidad del folleto como medio de difusión en una campaña.

http://www.endvawnow.org/es/articles/1259-volantes-y-folletos-de-la-campana-.html?next=1260

• Genera una diapositiva en donde se explique la utilidad de la página web como medio de difusión en una campaña.

http://www.nuevaregion.com/para-concienciar-en-internet-hay-que-sorprender-y-emocionar/

Requisitos:

• Coloca el nombre y el logo de la campaña en todas las diapositivas. 

• Inserta un pie de página a las diapositivas, en la que se deberá incluir el slogan de la campaña.

• Para los títulos y subtítulos incluye diferentes tipos y tamaños de fuente.

• Para la descripción de cada medio de difusión, incluye viñetas con imágenes alusivas a la campaña. (Ver información de la página 99 del manual)

• Aplica efectos de transición a cada diapositiva, cambia su orientación a posición vertical y guarda la presentación.

Estructura del sitio web

Tecnologías de la información 3

Proyecto Certificación Dreamweaver 2015B

Desarrollo del proyecto “Comunicación comercial”

Estructura

El trabajo de construcción de un sitio web exige una planificación exhaustiva, organizar adecuadamente los contenidos y estructurarlos en forma de páginas. Las páginas contendrán todos los elementos soportados en formato html y se almacenaran dentro de un servidor web. De esa forma el sitio podrá actualizarse, ampliarse y modificarse fácilmente.

Sugerencias para planificar la estructura de un sitio web
http://www.lawebera.es/de0/organizar-pagina-web.php

Actividades

• Especificar secciones del sitio (De  5 a 7 secciones incluyendo portada)*
• Especificar contenido de las secciones del sitio (Logotipo, título, textos, imágenes, pie de página)**
• Generar diagrama de estructura***

* Llenar la parte del formato correspondiente a la página 102 del manual

** Escribir en documento de word

*** Dibujar en documento de word

Justificación de la campaña

Tecnologías de la información 1

Proyecto Certificación Power Point 2015B

Justificación de la campaña

Habilidades tecnológicas (Ver matriz de habilidades en la página 193 del manual)

Instrucciones:

Genera una diapositiva en donde se responda a la pregunta 
¿Cuál es la importancia de la campaña?

Genera una diapositiva en donde se responda a la pregunta 
¿Cuál es la problemática que resolverá la campaña?

Genera una diapositiva en donde se responda a la pregunta 
¿Qué pasaría si no se lleva a cabo la campaña de concienciación?

Genera una diapositiva con imágenes que mediante una animación, muestre el antes y el después de la problemática social que resuelve la campaña.

En el siguiente enlace encontrarás ideas para responder a las preguntas anteriores

http://blog.es.idealist.org/tag/campanas-sociales/

Requisitos de entrega 

• Coloca el nombre y el logo de la campaña en todas las diapositivas. (Aplica un estilo WordArt al título de la diapositiva)
• Inserta un pie de página a las diapositivas, en la que se deberá incluir el slogan de la campaña.
• Emplea una imagen por diapositiva relacionada con la pregunta, (Ajusta la imagen empleando el ajuste "volver a colorear" con un solo tono) aplica una trayectoria de animación en cada imagen.

Proyecto de certificación Dreamweaver 2015B

Tecnologías de la información 3 

Planteamiento del proyecto “Comunicación comercial”

Hoy en día, cada vez más consumidores utilizan Internet para buscar los productos o servicios que necesitan. Una pequeña empresa se hará creíble al tener un sitio web. Contar con un espacio virtual proporciona a los negocios una imagen profesional que inspirará mayor confianza comercial.
Un sitio web  actúa como un folleto o catálogo en línea. Es más fácil y rápido actualizar la información de productos y servicios en un sitio que en material de impresión. A diferencia de los anuncios impresos que se convierten rápidamente obsoletos, el sitio puede proporcionar información y noticias de actualidad.
En este ejercicio es necesario aplicar una serie de habilidades tecnológicas de la herramienta Adobe Dreamweaver mediante un enfoque creativo y funcional, con el propósito de capturar el interés de los potenciales clientes en un servicio o un producto online.

Competencia a desarrollar

El alumno debe aplicar las habilidades de certificación Dreamweaver en el desarrollo de proyectos para la solución de problemas.

Objetivo

El alumno deberá adquirir y desarrollar habilidades tecnológicas de certificación para su aplicación en los diferentes contextos de aplicación personal y laboral.

Fases del proceso de desarrollo (Página 98)

• Definición
• Estructura
• Diseño
• Construcción y prueba
• Lanzamiento

Definición del sitio (Páginas 99 a 103)

• Objetivos
• Público objetivo
• Contenido (Secciones del sitio)
• Condicionantes del diseño
• Condicionantes técnicas
• Estructura del sitio

Proyecto Certificación Power Point 2015B

Tecnologías de la información 1

Planteamiento del proyecto “Campaña de concientización social”

Situación del problema

Actualmente, en nuestro país, se han incrementado algunos problemas sociales entre ellos están el narcotráfico, las adicciones, la pobreza y la violencia, los cuales nos afectan de forma directa así como en la convivencia con los demás. Hoy en día no ha sido posible que la situación cambie, sino por el contrario, cada vez nos enfrentamos a nuevas situaciones que descontrolan nuestra forma de vivir. Por lo tanto, es necesario contar con medios que contribuyan a mejorar las condiciones en las que vivimos y sobre todo, a concientizar a las personas sobre estos problemas para tratar de evitarlos.
A partir de la cuestión anterior, se te pide que elabores una campaña de concientización, de acuerdo a una problemática de impacto social que esté afectando la zona en la que vives, con la finalidad de mejorar la situación en la que se encuentra dicho lugar.

Competencia a desarrollar

El alumno debe aplicar las habilidades de certificación PowerPoint 2010 en el desarrollo de proyectos para la solución de problemas.

Objetivo

El alumno deberá adquirir y desarrollar habilidades tecnológicas de certificación para su aplicación en los diferentes contextos de aplicación personal, académica y laboral.

Campaña de concientización

• DEFINICIÓN DE LA CAMPAÑA
• JUSTIFICACIÓN DE LA CAMPAÑA
• PROPUESTA DE LA CAMPAÑA
• VALIDACIÓN DE LA CAMPAÑA
• IMPACTO DE LA CAMPAÑA

Definición de la campaña (Características)

• Nombre de la campaña (WordArt, inserción de imágenes)
• Logo para definir la campaña
• Población a la que va dirigida (estilos rápidos) 
http://www.nsvrc.org/sites/default/files/SAAM_2012_Es-hora-de-crear-una-campana.txt
• Objetivo  
http://ctb.ku.edu/es/tabla-de-contenidos/estructura/estrategia-planificacion/crear-objetivos/principal

• Diagrama de recursos (SmartArt)

Llenar el formato de proyecto según instrucciones (Página 182)
¿Cómo iniciar una campaña de concientización? (Ver características en la página 183)

Habilidades tecnológicas (ver matriz de habilidades)

• Aplicar un tema a una presentación
• Aplicar fondos personalizados
• Insertar fecha y pie de página
• Aplicar estilos gráficos
• Diseño de diagramas SmartArt
• Trabajar con cuadros de texto
• Alineación de párrafos
• Interlineados de párrafos
• Listas con viñetas

Proceso

1. Revisar la matriz de habilidades e identificar las habilidades de certificación de PowerPoint que se deberán aplicar en cada producto.
2. Revisar los temas en el libro y realizar las practicas.
3. Cada alumno debe elegir un proyecto y completar en el libro el Formato del proyecto. En él se encuentran los datos generales, la descripción y los beneficios esperados del mismo.
4. Desarrollar cada producto de acuerdo a los requisitos y habilidades de certificación
PowerPoint 2010 a aplicar y completar el Formato de plan de trabajo de cada producto.
5. El docente debe retroalimentar los avances obtenidos por cada producto.
6. Evaluar cada producto mediante los formatos que se te proporcionan en el libro
(Autoevaluación y Coevaluación).

Ilustración básica Entregas Octubre

Por este medio le hacemos saber que el proyecto "Escultura de papel" de la asignatura Ilustración básica, se entrega en tiempo y forma este viernes 16 de octubre.
Ese mismo día deberán llevar los materiales e información necesarios para la realización del siguiente proyecto en el plan del curso ("Ilustración a color")

ILUSTRACIÓN A COLOR

ESPECIFICACIONES ILUSTRACIÓN

•TEMA: Leyenda/Mito
•TAMAÑO: 28x43cm
•MARGEN: 2cm por lado ya incluido en el tamaño solicitado. 
•TÉCNICA: Transfer, ceras (pastel graso, crayones) y acrílico
•SOPORTE: Adecuado a las técnicas elegidas.

MATERIAL

Escuadras, escalímetro, portaminas, lápices de grafito, goma, cuaderno para bocetar, bolígrafos, texto impreso, referencias fotográficas nítidas e IMPRESAS, ceras, gesso, acrílico (todo lo indispensable para su aplicación), acetona pura, algodón, copias de las referencias a transferir, hojas doble carta de papel marquilla.

INFORMACIÓN

- Texto (Ver relación de asignaciones) BUSCAR TEXTO EN INTERNET
- Diccionario
- Referencias impresas según tema

ASIGNACIÓN

Tecnologías de la Información (Segundo parcial 2015 B)

ACTIVIDADES TECNOLOGÍAS DE LA INFORMACIÓN I

SEGUNDO PARCIAL

1.-Actividad "Imágenes en diapositivas" (Presentación Power Point .PPTX)

2.-Actividad "Animaciones y transiciones" (Presentación Power Point .PPTX)

3.-Actividad "Navegación con hipervínculos" (Presentación Power Point .PPTX)

4.-Actividad "Gráficos SmartArt (Mapas conceptuales) (Presentación Power Point .PPTX)

5.-Actividad "Tablas en Power Point" (Presentación Power Point .PPTX)

Enviar bajo el nombre de asunto: APELLIDO_NOMBRE_TECINFO_1 al correo electrónico dorantesdonovan@gmail.com, hasta las 20:00 horas del día 16 de octubre 2015.

Todos los documentos deben ir en el mismo correo y todos con los nombres acordados en clase. 

P.D. Si no se realizan los requerimientos de entrega en tiempo y forma, las actividades NO FORMARAN  PARTE DE LA EVALUACIÓN

ACTIVIDADES TECNOLOGÍAS DE LA INFORMACIÓN III

SEGUNDO PARCIAL

1.-Actividad "Etiquetas DIV de posición absoluta" (Captura de pantalla. PNG o JPG)

2.-Actividad "Inserción de texto" (Captura de pantalla. PNG o JPG)

3.-Actividad "Navegación con hipervínculos" (Captura de pantalla. PNG o JPG)

4.-Actividad "Inserción de imágenes" (Captura de pantalla. PNG o JPG)

5.-Actividad "Botones RollOver (Imagen de sustitución)" (Captura de pantalla. PNG o JPG)

Enviar bajo el nombre de asunto: APELLIDO_NOMBRE_TECINFO_3 al correo electrónico dorantesdonovan@gmail.com, hasta las 20:00 horas del día 16 de octubre 2015.

Todos los documentos deben ir en el mismo correo y todos con los nombres acordados en clase. 

P.D. Si no se realizan los requerimientos de entrega en tiempo y forma, las actividades NO FORMARAN  PARTE DE LA EVALUACIÓN

Interfaz de la página Web

Elementos de la interfaz

La interfaz del Sitio Web, debe dar cuenta de normas de carácter general, que se refieren a sus características como sistema de información y comunicación. Gracias al cumplimiento de las normas de diseño, el usuario logrará acceder efectivamente a lo que necesita del sitio.

Las características formales tienen que ver con los elementos de identificación, de navegación, de contenidos y de acción que el Sitio Web maneja. Por lo anterior, es importante que las interfaces se construyan con claridad, organización y legibilidad.

A continuación observa el siguiente esquema y nombra adecuadamente las partes que componen la interfaz de una página web, localizando en la sopa de letras los nombres correctos. Puedes guiarte con la información que se te proporciona abajo.

SOPA DE LETRAS

PISTAS

- Esta columna sirve para alojar contenido complementario que debe estar separado del área de contenidos principal.

- Conjunto de botones o hipertextos que permiten vincular con paginas web.

- Es la parte más baja de la página, es un espacio para reiterar información importante o que deba repetirse en cada sección del sitio para que el usuario no se pierda.

- En esta área se coloca el contenido informativo de la pagina web.

- Esta sección siempre encabeza la pagina web y esta reservada para un contenido importante.

- Son hipertextos relacionados por categorías y que describen la profundidad del contenido del sitio jerárquicamente.

- Es el texto que sirve para titular el contenido.

- Sirve para que el usuario identifique al emisor del contenido.

Una vez identificadas las partes de la interfaz web, genera un esquema en Microsoft Word (como el del ejemplo) y coloca los nombres correctos con cuadros de texto. Toma una captura de pantalla y envíalo a tu correo electrónico.

Practica acuarela

Técnicas de representación

Materiales para la practica: técnica de la acuarela

Papel Guarro mediano 1/4

Papel Fabriano mediano 1/4

Pinceles sintéticos redondos  (nilón o poliéster) 10 y 6

Franela (lavada)

Godete (limpio o nuevo)

Recipientes de vidrio (lavados)

Acuarelas “Pelikan” , “Jovi” o marcas de calidad en pastilla

Cinta engomada seca (por equipo de 5 personas)

Practica efectos de acuarela

Sal de grano

Plastipack (Película plástica para envolver alimentos)

Gesso (Envase pequeño)

Vela blanca limpia

Crayola blanca limpia

Cepillo de dientes (Usado pero limpio)

Espátula de plástico

Gotero

1 limón completo

3 servitoallas

Masking líquido (por equipo de 5 personas)

Esponja pequeña

Gráficos estadísticos Power Point

Tecnologías de la información I

Gráficos estadísticos en Power Point

Emplea los siguientes datos para elaborar gráficos en una presentación de Power Point

BARRA VERTICAL CILINDRO
Índice de relaciones extramaritales por país
*Número de parejas por cada 100

Turquía 58*
Francia 24*
Estados Unidos 17*
Alemania 11*
Israel 7*

GRÁFICO PASTEL
Horas frente a la televisión

Estados Unidos 8.2 horas
Turquía 5 horas
Reino Unido 3 horas
Irlanda 2.6 horas
Suecia 2.4 horas

BARRA HORIZONTAL
Días de asueto al año por país

España 16 días
Alemania 13 días
Francia 11 días
Estados Unidos 10 días
Rumania 5 días

BARRA APILADA
Numero de suicidios por país
*suicidios por cada 100000 habitantes

Japón 23.7
Francia 17.6
Estados Unidos 11
México 4.1
Irán 1

Numero de homicidios por país
*homicidios por cada 100000 habitantes

Japón 1
Francia 1.2
Estados Unidos 5.7
México 11.1

Colombia 53

Navegación con botones de imagen (RollOver)

Tecnologías de la Información III

Navegación con botones de imagen (RollOver)

Adobe Fireworks

- Generar nuevo documento 200 px x 50 px (72 DPI)

- Mostrar retícula/ajustar a retícula

- Generar figura con herramienta rectángulo

- Aplicar estilo con panel de trabajo "Estilo"

- Insertar texto (cambiar atributos de texto)

- Alinear texto con panel de trabajo "Alinear"

- Guardar formato PNG de Firewoks

Adobe Dreamweaver

- Nuevo documento HTML

- Insertar etiqueta PA 200 px x 50 px (botón 1 y botón 2)

- Insertar imagen de sustitución "Roll Over" (imagen original/ Imagen RollOver)

- Modificar atributos pagina 1 (Fondo de página)

- Guardar página 1

- Insertar hipervínculos (panel "propiedades")

- Modificar atributos e hipervínculos de la página 1

- Guardar como página 2

- Probar navegación en "Browser"

Trabajo con tablas en Power Point

Tecnologias de Información I


Trabajo con tablas en Power Point

Elabora una tabla con la siguiente información y dale formato según el ejemplo que se muestra en este post.

Estadística Mundial

• México 
• Estados Unidos
• China
• Rusia
• Alemania

Datos en la tabla

Índice de riqueza (PIB_MMD)

Índice de corrupción (Ranking)

Índice de lectura (Horas de lectura a la semana)

Índice de consumo de cerveza (Ranking)

Ranking de mundiales de fútbol (Participación)

Ranking de premios Nobel

Ranking de acceso a Internet