641 Diseño2Dparaweb pdf

(1)

COLEGIO DE BACHILLERES SECRETARIA GENERAL DIRECCIÓN DE PLANEACIÓN ACADÉMICA

PLANTEL 15 CONTRERAS

CLAVE 641

Plan de estudio: 2014

Guía de estudio de DISEÑO EN 2D PARA WEB

6° SEMESTRE

(2)

Créditos 4

Nombre de la Academia: TECNOLOGIAS DE LA COMUNICACIÓN

Elaborador (es): ISC DE LA PEÑA GARCIA LIZZIA SOFÍA

(3)

INDICE

I.- Introducción General ... 5

BLOQUE I DISEÑO VISUAL DE LA PAGINA WEB PUBLICITARIA ... 7

B.-Contexto sobre Bloque 1 ... 7

C.-Problemática Situada del Bloque ... 7

Actividad de aprendizaje tema 1.- ... 7

Establecer la viabilidad del desarrollo del proyecto multimedia. ... 7

ACTIVIDAD 1 DE CONSOLIDACION DEL BLOQUE I.- ... 7

ACTIVIDAD DE APRENDIZAJE DEL TEMA 2 ... 8

ACTIVIDAD 2 DE CONSOLIDACIÓN DEL BLOQUE I ... 8

ACTIVIDAD 3 DE APRENDIZAJE DEL TEMA 3 PROTOTIPO ... 8

ACTIVIDAD 4 DE APRENDIZAJE DEL TEMA 3 BLOQUE I ... 9

ACTIVIDAD 5 DE APRENDIZAJE DEL TEMA 3 BLOQUE I ... 9

Bloque temático II ... 10

DISEÑO DE LA PÁGINA WEB PUBLICITARIA ... 10

Maquetación con diseño web adaptable ... 10

ACTIVIDAD 1 DE APRENDIZAJE DEL TEMA 1 BLOQUE II ... 10

ACTIVIDAD 1 DE CONSOLIDACIÓN DEL BLOQUE II... 10

Bloque temático III ... 12

(4)

Metodología de la publicación ... 12

ACTIVIDAD 1 DE APRENDIZAJE DEL TEMA 1 BLOQUE III ... 12

ACTIVIDAD 1 DE CONSOLIDACIÓN DEL BLOQUE III ... 12

(5)

I.- Introducción General

La salida ocupacional de Auxiliar Diseñador Gráfico tiene la finalidad de que el alumno de bachillerato pueda desarrollar soluciones gráficas para presentar información de forma impresa y/o digital, que permita promocionar la marca, producto y/o servicio de una empresa; empleando su creatividad, originalidad, experiencia y trabajo colaborativo, lo que le permitirá incorporarse a la vida laboral.

En este sentido, el alumno será capaz de analizar, planear, diseñar y desarrollar material publicitario impreso y/o digital, a través del trabajo colaborativo para la propuesta de soluciones al cliente, el uso de herramientas informáticas para el diseño y edición gráfica, mediante la realización de trabajos de diseño: bocetos, maquetación, material publicitario, editorial básico, fotográfico digital, así como la creación y edición de interfaces gráficas con animación en 2D para Web.

La salida ocupacional de Auxiliar Diseñador Gráfico pretende que el estudiante adquiera los conocimientos y habilidades de la comunicación gráfica, mediante la transmisión de información de manera visual, el intento de influir en la percepción y opinión de otros, así como la interpretación y traducción de elementos del lenguaje visual como base para la creación de un diseño.

El Auxiliar Diseñador Gráfico realiza un trabajo de investigación en equipo para un proyecto de diseño, mediante la realización de bocetos y la preparación de los materiales para la producción, aplicadas al diseño de un producto con ideas creativas, mediante la producción de bocetos, utilizando colores, técnicas y materiales adecuados. Presenta ideas, genera modelos y prototipos con herramientas de lenguaje visual. Durante su trabajo el alumno debe considerar lo que el cliente requiere, elaborar el presupuesto, la idoneidad de los diferentes materiales y las limitaciones técnicas.

Como resultado de este proceso formativo el alumno adquirirá conocimientos, habilidades, destrezas y características personales (valores) en sus actividades cotidianas, académicas y laborales como:

 Habilidades para resolver problemas  Habilidades lógicas

 Habilidades creativas y artísticas

 Habilidades para el diseño de dibujos y bocetos  Habilidades para trabajar solo, en binas y en equipo  Capacidad de transformar ideas en diseños

 Comprensión del espacio de composición

 Facilidad para entender instrucciones del profesor/diseñador  Habilidades comunicativas

 Habilidades de investigación

(6)

 Análisis de información

 Aptitudes para negociar, bocetar y diseñar

 Capaz de emplear colores y formas de manera creativa

 Capaz de mantenerse al día sobre las innovaciones del diseño gráfico  Capaz de trabajar con un presupuesto

La asignatura Diseño en 2D para Web, tiene como propósito que el estudiante sea capaz de crear y publicar un proyecto de animación en 2D para web, a partir de herramientas de software para la presentación visual de objetos, de acuerdo con los requerimientos del cliente.

(7)

BLOQUE I DISEÑO VISUAL DE LA PAGINA WEB PUBLICITARIA

A

.- Propósito del Bloque 1

Diseñar los elementos de la página web

publicitaria, considerando los requerimientos del cliente, para dar solución a la

petición informática

B.-Contexto sobre Bloque 1

diseño visual de la página web publicitaria

Tomando en cuenta los requerimientos del cliente se capturara los requerimientos

necesarios para el cliente.

C.-Problemática Situada del Bloque

.- Tenemos al cliente de McDonald el cual nos está solicitando el diseño de un nuevo producto que sacara al mercado pero que la publicidad la realizara desde su página web debemos saber cuáles son los requerimientos de este producto y diseño de lanzamiento.

Actividad de aprendizaje tema 1.-

Investigar lo siguiente:

Investigar la definición de Requerimiento

:

¿Cuáles son los requerimientos que se necesitan recabar para el

sitio web?

A partir de la investigación desglosa cada uno de los requerimientos de que

tratan:

Explique cuáles son las técnicas de información

Establecer la viabilidad del desarrollo del proyecto multimedia.

ACTIVIDAD 1 DE CONSOLIDACION DEL BLOQUE I.-

(8)

ACTIVIDAD DE APRENDIZAJE DEL TEMA 2

Técnicas de diseño visual y definición del estilo

Identifica las especificaciones del aspecto visual del sitio web.

ACTIVIDAD DE APRENDIZAJE DEL TEMA 2

6.- ¿Cómo generar bocetos para tus proyectos web de forma

rápida?

7.- Técnicas de composición para jerarquizar los objetos y los

elementos de navegación del sitio web.

ACTIVIDAD 2 DE CONSOLIDACIÓN DEL BLOQUE I

Realizar una propuesta de cada uno de los puntos tanto el aspecto visual como la

jerarquización de los objetos y elementos de navegación.

ACTIVIDAD 3 DE APRENDIZAJE DEL TEMA 3 PROTOTIPO

INVESTIGA QUE HERRAMIENTAS DE SOFTWARE EXISTEN EN EL MERCADO PARA PODER CREAR O DISEÑAR UN APAGINA WEB

ACTIVIDAD 3 DE CONSOLIDACIÓN DEL BLOQUE I

Elabora un diseño o boceto a papel o utilizando herramientas de

software.

(9)

ACTIVIDAD 4 DE APRENDIZAJE DEL TEMA 3 BLOQUE I

Investiga que es un mapa de navegación del sitio web y menciona

que es un mapa de navegación.

ACTIVIDAD 5 DE APRENDIZAJE DEL TEMA 3 BLOQUE I

ACTIVIDAD 4 DE CONSOLIDACIÓN DEL BLOQUE I

(10)

Bloque temático II

DISEÑO DE LA PÁGINA WEB PUBLICITARIA

Maquetación con diseño web adaptable

A

.- Propósito del Bloque 1

Diseñar una página web, utilizando las

herramientas para el tratamiento de elementos multimedia; para obtener un

producto de calidad de acuerdo con los requerimientos del cliente.

B.-Contexto sobre Bloque 2

diseño visual de la página web publicitaria

Tomando en cuenta los requerimientos del cliente se capturara los requerimientos

necesarios para el cliente.

C.-Problemática Situada del Bloque

.- Tenemos al cliente de McDonald el cual

nos está solicitando el diseño de un nuevo producto que sacara al mercado pero

que la publicidad la realizara desde su página web debemos saber cuáles son los

requerimientos de este producto y diseño de lanzamiento.

ACTIVIDAD 1 DE APRENDIZAJE DEL TEMA 1 BLOQUE II

Elabora la maquetación para el sitio web, estableciendo secciones

y elementos.

Paso por paso

ACTIVIDAD 1 DE CONSOLIDACIÓN DEL BLOQUE II

Elabora la maquetación para el sitio web, estableciendo secciones y elementos. De

acuerdo con la problemática de la página de McDonald.

ACTIVIDAD 2 DE APRENDIZAJE DEL TEMA 2 BLOQUE II

(11)

Identifica el software necesario para generar una página web

ACTIVIDAD 2 DE CONSOLIDACIÓN DEL BLOQUE II

Elabora una página web a partir del software sugerido.

DREAMWEAVER

ACTIVIDAD 3 DE APRENDIZAJE DEL TEMA 2 BLOQUE II

Investigar cómo utilizar los siguientes conceptos para el diseño de la página web de

objetos para el sitio web

ACTIVIDAD 3 DE CONSOLIDACIÓN DEL BLOQUE II

Identifica el audio adecuado para insertarlo en las páginas web

ACTIVIDAD 4 DE CONSOLIDACIÓN DEL BLOQUE II

- Elabora distintos tipos de botones y menús.

ACTIVIDAD 5 DE CONSOLIDACIÓN DEL BLOQUE II

- Elabora distintos tipos de imágenes y videos para generación de banners

ACTIVIDAD 3 DE APRENDIZAJE DEL TEMA 3 BLOQUE II

Animación de objetos por computadora

La animación por computadora (también llamada animación digital, animación

informática o animación por ordenador) es la técnica que consiste en crear

imágenes en movimiento mediante el uso de ordenadores de computadoras.

ACTIVIDAD 6 DE CONSOLIDACIÓN DEL BLOQUE II

(12)

Bloque temático III

PUBLICACIÓN DE LA PÁGINA WEB PUBLICITARIA

Metodología de la publicación

A

.- Propósito del Bloque 1

Publicar una página web, en un host gratuito o de

pago; con la finalidad de dar a conocer la página web publicitaria, de acuerdo con

los requerimientos solicitados por el cliente.

B.-Contexto sobre Bloque 2

La problemática de qué tipo de hosting se

escogerá para poder alojar a nuestra página web, que tipo de dominio será y como

es que funciona el alojar nuestra página en un hosting.

C.-Problemática Situada del Bloque

.-

una vez que el cliente ha aprobado

nuestro proyecto de la página web seguimos con el problema de donde la

publicaremos y como lo realizaremos

ACTIVIDAD 1 DE APRENDIZAJE DEL TEMA 1 BLOQUE III

Metodología de publicación

Explicar brevemente la metodología para publicar una página web.

Paso 1

: Elegir el hospedaje web dónde va a radicar el nuevo sitio

Normalmente cuando un cliente nos contrata para hacer un sitio web, existen tres

posibilidades:

ACTIVIDAD 2 DE APRENDIZAJE DEL TEMA 2 BLOQUE III

ACTIVIDAD 1 DE CONSOLIDACIÓN DEL BLOQUE III

Explica las ventajas y desventajas para la elección de un dominio público o privado

ACTIVIDAD 2 DE CONSOLIDACIÓN DEL BLOQUE III

Establece el dominio en el que se alojará la página web, considerando las

necesidades del cliente.

ACTIVIDAD 3 DE APRENDIZAJE DEL TEMA 3 BLOQUE III

(13)

¿Qué es un hosting?

TIPOS DE HOSTING:

ACTIVIDAD 3 DE CONSOLIDACIÓN DEL BLOQUE III

Explica las ventajas y desventajas para la elección de hosting gratuito y uno de paga

ACTIVIDAD 4 DE CONSOLIDACIÓN DEL BLOQUE III

Establece el hosting donde se alojará la página web considerando las necesidades

del cliente. (GRATUITO)

ACTIVIDAD 4 DE APRENDIZAJE DEL TEMA 3 BLOQUE III

Tipos de archivos

Identifica el FTP (Protocolo de transferencia de archivos) a utilizar para el montado

de la página web.

ACTIVIDAD 5 DE CONSOLIDACIÓN DEL BLOQUE III

Sube los archivos necesarios para el funcionamiento de la página web a través del

FTP seleccionado al servidor. (de acuerdo al hosting que elegiste)

ACTIVIDAD 5 DE APRENDIZAJE DEL TEMA 4 BLOQUE III

Implementación

ACTIVIDAD 6 DE CONSOLIDACIÓN DEL BLOQUE III

(14)

FUENTES DE CONSULTA

Bloque I

Pressman, (2002). Análisis de requisitos del software. Consultado el 4 de diciembre de 2014 en: http://yaqui.mxl.uabc.mx/~molguin/as/IngReq.htm

Torres, N. Métodos de recolección de datos para una Investigación. Consultado el 4 de diciembre de 2014 en: http://www.tec.url.edu.gt/boletin/URL_03_BAS01.pdf

Bloque II

Boceto. Consultado el 3 de noviembre de 2014, en http://definicion.de/boceto/

Cruz, G. 10 etapas fundamentales en el desarrollo web. Consultada el 8 de julio de 2015 en: http://sitiocom.com.mx/10-etapas-fundamentales-en-el-desarrollo-web/

Metodología para la creación de sitios web. Consultado el 7 de julio del 2015 en: http://disenowebakus.net/metodologia-para-la-creacion-de-sitios-web.php

Manual de dominios en internet. Consultado el 8 de julio del 2015 en: http://www.tierradelazaro.com/informatica/cursoweb/Tema%203%20Manual_dominios_internet.pdf La informática en el aula, clases y tipos de dominio. Consultado el 8 de julio del 2015 en: http://www.geocities.ws/nora_ragon/tiposdominios.pdf

¿Qué es un hosting web?, Tipos de alojamiento y ¿Cuál elegir? Consultado el 8 de julio del 2015 en: http://www.ciudadano2cero.com/que-es-un-hosting-web-tipos-alojamiento-cual-elegir/

Dominio, hosting y sus características. Consultado el 8 de julio del 2015 en: http://roluro.com/geeks-y-mas/dominio-hosting-y-sus-caracteristicas/

El mejor hosting en México 2014. Consultado el 8 de julio del 2015 en: http://aldeahost.info/?tag=hosting&print=pdf-page

¿Cómo subir archivos en FTP? Consultado el 8 de julio del 2015 en:

(15)

Bloque III

AKus.net, (s/f). Metodología para la creación de sitios web. Consultado el 7 de julio del 2015 en: http://disenowebakus.net/metodologia-para-la-creacion-de-sitios-web.php

Tusmarcas, (s/f). Manual de dominios en internet. Consultado el 8 de julio del 2015 en: http://www.tierradelazaro.com/informatica/cursoweb/Tema%203%20Manual_dominios_internet.pdf Ragon, N. (s/f). La informática en el aula, clases y tipos de dominio. Consultado el 8 de julio del 2015 en: http://www.geocities.ws/nora_ragon/tiposdominios.pdf

López, B. (2013). ¿Qué es un hosting web?, Tipos de alojamiento y ¿Cuál elegir? Consultado el 8 de julio del 2015 en: http://www.ciudadano2cero.com/que-es-un-hosting-web-tipos-alojamiento-cual-elegir/

Torres, P. (2013). Dominio, hosting y sus características. Consultado el 8 de julio del 2015 en: http://roluro.com/geeks-y-mas/dominio-hosting-y-sus-caracteristicas/

Webhosting, (2014). El mejor hosting en México 2014. Consultado el 8 de julio del 2015, en http://aldeahost.info/?tag=hosting&print=pdf-page