miércoles, 18 de enero de 2012

Personalizacion de Diapositivas Avanzadas 19-10-11


Personalizacion de Diapositivas Avanzadas

Diplomado: Blog como Recurso Didactico
Sesion num.10 (19 de octubre del 2011)




Flicker nos da la opcion decopiar y pegar reproductores de diapositivas que funcionan como videos que cuentan con un boton de PLAY que nos permite ver las fotos contenidas en el album de Flicker que nos genero dicha presentacion.
De cualquier manera el hecho de que es un reproductor de diapositivas tan basico nos brinda un abanico limitado de opciones para crear nuestro reproductor es entonces que surgen servicios de personalizacion avanzada de diapositivas como PICTOBROWSER

1- Como utilizar el programa en linea de PICTOBROWSER

a) En una pestaña nueva, acceso a wwww.pictobrowser.com
b) En la esquina superior derecha ubico el BOTON DE PICTOBULDER, hago clic
c) Ubico el campo que dice ENTER YOUR SCREEN NAME y le escribo mi nombre que aparece en mi cuenta de Flicker en el renglon que dice SESION INICIADA COMO(arriba a la derecha)
http://html-color-codes.info/codigos-de-colores-hexadecimales/



Sesion num.11 (23 de octubre del 2011)

continuación de la clase pasada 12/12/11 bitacora no. 21

TIFF. Es un formato de imagines digitales que no tiene compresión, esto es, que fue creado en la calidad y resolución maxima que puede generar nuestro aparato (ya sea cámara digital, imagen escaneada o cámara de vídeo que puede tomar fotos.) Por lo regular el formato TIFF es muy pesado (asumiendo el peso del archivo como un valor elevado en MEGABYTES) y es el ideal para ampliaciones reproducciones en gran formato.
PNG. Este formato es una versión mejorada del archivo de imágenes tipo GIF en el sentido de que permite excelentes imágenes para su uso en web y presentaciones en proyector, ademas de transparencia (evitando el remarco blanco que acompaña a ciertos formatos de imagen) teniendo mayor calidad que el GIF. En contraparte, el hecho de que tanga mayor calidad impide el uso de animaciones.
:

Introducción al diseño gráfico


Glosario de términos básicos para el deseo grafico a través 


de medios electrónicos.
1.-Que es un Pixel?¿es la unidad de color     replantear un medio electrónico. Su forma física mas tangibles un punto de coloren la pantalla. En televisiones y monitores mas grandes, también en pantallas gigantes de LCD (como las  que se encuentran en los anuncios publicitarios n las vialidades) es un punto de color que puede ser rojo, verde, azul, o cualquier combinación de los 3 clores, generando luz blanca cuando se combinan todas en la misma proporción.
Todas la medidas de gráficos en cualquier medio electrónico se expresa en pixeles, siendo la medida de 800x600 la mas usada hasta antes de los monitores SVGA y aun mayores con los monitores de alta definición y pantalla plana.
2.- ¿Que es un megapixel? 
Se le llama megapixel a una matriz de aproximadamente un millón de pixels, dispuestos en columnas e hileras para conformar una imagen en un  medio electrónico. Mientras mas megapixeles tenga una imagen no necesariamente se hace mas detallada, si no que permite capturar imágenes mas grandes, lo que favorece su ampliación sin que suceda la pixelizacion o que aparezcan las deformaciones de baja resolucion denominadas artefactos. 
3.- Pixelizacion: 
deformación comun que experimentan las imágenes cuando   observadas a un tamaño mayor al que fueron creadas para observar, por ejemplo en el caso de fotos que fueron tomadas para verse por pantalla de celular, cunado son amplificadas en un monitor 


4.- Artefactos: Son las deformaciones regularmente de formas cuadradas  o rectangulares que aparecen en pantalla cuando forzamos las ampliación de una imagen que no fue creada para verse de cerca.


Pasa muy seguido con imágenes que fueron bajadas e Internet y se imprimen en papel revelando su pixelizacion.
-Formatos de imágenes mas populares y sus usos:
JPG: es el mas usado en la web. Cuando una imagen esta en este formato nos indica que ya fue comprimida (no esta en su máxima resolucion) y que esta optimizada para mandarse por Internet, verse en monitor o bien ampliarse hasta la medida original en la que fue creada, ya que se pixelea si se amplifica de mas.
GIF: al igual que JPG, es un formato ideal para ver imágenes en pantalla en tamaño relativamente pequeños que no ocupen mucho espacio en memoria (por ejemplo, que excedan el tamaño permitido en un correo electrónico) pero tiene 2 características que la diferencian de otros formatos: 1.- Permite varios cuadros de imágenes en u solo archivo, por ejemplo, fotos animadas. y 2.- para poder almacenar este tipo de información de animación, sacrifica colores, ya que cuenta con un numero limitado de colores para mostrar.



Introducción a la edición de plantilla: Los Gadgets

Los Gadgets en Blogger:

Se les llama así a los pequeños modulos de código que modifican el comportamiento de la plantilla de nuestro blog. Esto es, mas que se runa entrada nueva, es un componente del diseño de nuestro blog que le aporta funcionalidad extendida o adicional. Aparte que no están sujetos al acomodo cronológico de las entradas donde cada nuevo articulo que publiquemos va a colocarse inmediatamente encima de lo anterior, relegando el contenido al fondo de nuestro blog. Los gadgets por su parte están anclados en la plantilla de nuestra pagina, incorporados permanente al menú de nuestra pagina.
Aplicaciones comunes de los diferentes tipos de Gadgets:
1.- Ventanas de video: Podemos copiar la dirección de algún video favorito y anclarlo a la columna izquierda o derecha de nuestro blog, dependiendo de su diseño, para que cada vez que se cargue la pagina, se corra dicho vídeo.
2.- Galerías fotograficas fijas: podemos mandar llamar una película de diapositivas y asignarla a algún espacio en las columnas laterales de nuestro blog.
3.- Directorios de blogs/paginas adicionales: podemos crear listados de nuestra paginas favoritas, o bien listados de blogs de nuestros compañeros y mostrarlos en la forma de una relación de links convenientemente colocados a los lados de la pagina.
4.- Subscripciones y RSS: Este Gadget permite a las personas que visiten nuestra pagina subscribirse a nuestro blog utilizando su correo electrónico contenidos de modo automático a sus respectivos correos en el momento en que son publicados
5.- anuestros posts o entradas favoritas: Nos permite mantener siempre a la mano un listado de contenidos sobresalientes para su rápida visualizacion y referencia.
6.- Listado de etiq2uetas: relación d4e palabras clave que facilita la búsqueda de contenidos en nuestras publicaciones.
7.- Cuando de busquedas: Similar a Google pero con la opción de buscar dentro de nuestra pagina exclusivamente o bien realizar una búsqueda general en toda la web.

Ejercicio de repaso; Captura de audio en mp3 y publicación en SOUNDCL

Utilizando los conocimientos adquiridos hasta el momento realizar el siguiente ejercicio de repaso:

1.- Seleccionar el video de nuestra preferencia en www.youtube.com que puede ser musical, de comedia, discursos, etc. Con una duracion no mayor a los 4:30

2.- Utilizar la paqgina www.keepvid.com para obtener el audio en formato mp3 de dicho video, grabandolo en nuestro escritorio

3.- Utilizando el servicio de www.souncloud.com, subir la grabacion mp3 a nuestro perfil de SoundCcloud.

4.- Exportar el codigo de SHARE y pegarlo en esta misma entrada, al pie del texto.

31/10/11

Luis Miguel - Amarte Es Un Placer by teremgonzalez1@gmail.com

Introducción a la edición de plantillas: Los GADGETS 31-oct-2011


Introducción a la edición de plantillas: Los GADGETS

Los Gadgets en Blogger:

Se les llama asi a los pequeños modulos de codigo que modifican el comportamiento de la palntilla de nuestro blog. Esto es, mas que ser una entrada nueva, es un componente del diseño de nuestro blog que le aporta funcionalidad extendida o adicional.

Apàrte que no estan sujetos al acomodo cronologico de las entradas donde cada nuevo articulo que publicamos va a colocarse inmediatamente encima de lo anterior, relegando el contenido al fondo de nuestro blog.

Los gadgets por su parte estan enclados en la plantilla de nuestra pagina, incorporados permanentemente al menu de nuestra pagina.

Aplicaciones comunes de los diferentes tipos de Gadget

1.- Ventanas de video podemos copiar la dirección de algún video favorito y anclarlo a la columna izquierda o derecha de nuestro blog dependiendo de su diseño para que cada vez que se cargue la pagina, se corra dicho vídeo.

2.-Galerías fotograficas fijas podemos mandar llamar una película de diapositivas y asignarla a algún espacio en las columnas laterales de nuestro blog.

3.-Directorios de blogs/paginas adicionales podemos crear listados de nuestras paginas favoritas o bien listados de blogs de nuestros compañeros y mostrarlos en la forma de una relacion de links convenientemente colocados a los lados de la pagina

4.- Subscripciones y RSS este Gadget y permite a las personas que visitan nuestra pagina subscribirse a nuestro blog utilizando su correo electrónico de este modo lres llegan notificaciones y copias de nuestros contenido de modo automático a sus respectivos correos en el momento en que son publicados

5.-Listado de nuestros posts o entradas favoritas nos permite mantener siempre a la mano un listado de contenidos sobresalientes para su rápida visualización y referencia.

6.- Listado de etiquetas relación de palabras clave que facilitan la búsqueda de contenidos en nuestras publicaciones

7.- Cuadro de búsquedas similar a Google pero con la opción de buscar dentro de nuestra pagina exclusivamente o bien realizar una búsqueda general en toda la web

lunes, 16 de enero de 2012

16-1-12

En la interface de diseño de nuestro panel de control podemos realizar ajustes relacionados con funcionamiento general de nuestro blog. D e la mismo manera podemos aumentar os funciones y características de nuestra pagina en la manera de Gadgets que aportan nuevas y averiadas aplicaciones.
Fuera de esto, podemos reacomodar el orden en que estas funciones parecen en el espacio designado a nuestro blog, pero con todo es una herramienta limitada en cuanto a la flexibilidad y capacidad de personalización de nuestro blog.
Es entonces que, para hacer ajustes más drásticos en la apariencia y funcionalidad de nuestro sitio, recurrimos a la interface del diseñador de plantillas.
Este apartado de nuestro panel de control esta dividido en 2 partes:
1.- (Parte inferior) La vista previa dinámica: Se llama así porque refleja inmediatamente (esto es, sin tener que¨ refrescar¨ la pagina) los cambios realizados en el menú principal. Estos cambios son solo aparentes en esta pagina y se convierten en ajustes permanentes si y solo si presionamos el botón de APLICAR AL BLOG.
2.- (Parte superior) El menú de ajustes:
Este menú afecta la apariencia y disposición de los elementos gráficos de nuestro blog, y abarca varios apartados específicos:
a) Plantilla General: este apartado nos permite seleccionar de una variedad de plantillas prediseñadas de una variedad con una apariencia o estilo gráfico definido. A la vez cada una cuenta con una apariencia o estilo grafico definido. A la vez cada una cuenta con un submenú que muestra variaciones del mismo concepto, como puede ser alguna variante en tono de color o algún ajuste en las decoraciones de la página.
b).- Apartado de Fondo: (en alguna página que no están traducidas este apartado puede aparecer como Background o Colorways). En este menú podemos seleccionar fondos de color solido (que vienen combinados con colores adicionales) para el fondo de nuestra pagina, o bien podemos seleccionar una imagen (por lo regular de 1800x1600 pixels) Aquí se cierra el paréntesis. De las que viene  precargadas en la interface. También podemos seleccionar  desde nuestra computadora una imagen de aproximadamente las mismas medidasy subirla para ser usada como fondo. El límite de peso/resolución de la foto no debe exceder los 300 kilobytes.
c).- Ajuste de medidas del blog:
En este apartado por lo regular contamos con 2 deslizadores que nos permiten incrementar/decrenebtar el ancho de la columna principal de nuestro blog. Ojo, aquí viene un paréntesis (En donde se publican las entradas principales, las fechas y los títulos del contenido)  Y CERRAMOS EL PARENTESIS. Adicionalmente contamos con el deslizador del ancho de columna secundaria, que contiene por lo regular los gadges que hemos incorporado a la plantilla además de los directorios e índices de nuestro blog. Consideraciones: el ancho de pantalla  promedio es de aproximadamente 1024 pixels, lo que nos permite ajustar medidas dentro del rango de los 980 pixels hasta los 780 aproximadamente, para fines de no truncar la longitud de los encabezados o crear un sitio que4 no se muestre completo en pantalla debido a su medida excesiva.
d).- Apartado de diseño:
Esta sección nos permite organizar y orientar los elementos de la pagina de acuerdo a la relación entre las entradas principales y las columnas secundarias que cuentan con gadgets e índices, etc.
Trabajando de la mano con el apartado anterior, donde ajustábamos el tamaño, podemos crear un espacio amplio libre de distracción visuales donde solo se muestre el texto de las entradas, o bien un espacio que4 concentre mucho información en un rea reducida, como en el caso de incluir hasta dos columnas adicionales de contenido extra. Esto por lo regular conlleva aumentare ancho de las columnas para no segmentar los textos.
e).- Edición avanzada:
Este apartado demuestra pantalla de edición de plantillas nos permite justar de manera precisa todo lo relativo a las tipografías y colores que se emplean para desplegar los contenidos de nuestras entradas.
-Sección de Teto de pagina: Este aportado nos permite definir el tamaño, color y tipografía de los textos en general de nuestra pagina. Este apartado nos permite definir el tamaño, color y tipografía de los texto sen general de nuestra pagina. Es conveniente siempre seleccionar una Familia tipográfica esto es, una letra que cuente con versiones en Negritas, Itálicas, Condensada, Etc. Y que todas estas variantes son utilizadas en diferentes secciones de los texto se desplegar.
-Sección de fondos: Aquí se define los colores específicos de cada sección de mi blog, en el renglón de fondos. Con2 posible opciones: Color o transparencia. Los fondos determinar son3 los del encabezado, los de las entradas y los de las columnas.
-Sección de enlace: Este apartado determina el comportamiento de los hipervinculos en el documento escrito en tres posibles estados: uno es cuando el máuser se posiciona sobre ellink y eltercero es sobre los links visitados. En estas tres opciones se puede determinar la tipografía y el color respectivamente.
-Sección del titulo del blog: Aquí definimos la tipografía, el estilo y el color del titulo del blog. En el caso particular de nuestro diseño, este a ha sido substituido por un encabezado diseñado en ACDSEE photo editor, así que este apartado no se emplea en nuestro diseño.
-Apartado de gadgets: Aquí definimos los encabezados para las secciones adicionales ubicadas en las columnas laterales, cuya ubicación fue determinada en el apartado de DISEÑO.
-Apartado de fondo: en algunas paginas que no estan traducidas este apartado puede aparecer como Background o colorway. En este menu podemos seleccionar fondos de color soido, que vienen combinados con colores adiciones, para el fondo de nuestra pagina, o bien podemos seleccionar una imagen por lo regular de 1800x1600pixels.
De ñlas que vienen pr4cargadas en la interfase. tambien podemos seleccionas desde nuestra computadora una peso/resolucion de la foto no debe exceder los 300 kiobytes..

lunes, 9 de enero de 2012

bitacora 09/01/12

sábado 7 de enero de 2012

SESION 13 UTILIZANDO EDITORES DE FOTOS PARA REDISEÑAR MI BLOG

1.- Rediseño del Encabezado: Vamos a recurrir al programa ACDSee Photo Editor para crear un proyecto con la siguiente medida: 960 pixeles de ancho por 250 pixeles de alto, que es la medida aproximada del encabezado de mi blog.
El proyecto debe de reunir los siguientes requisitos:
Debe estar en resolucion WEB (96 pixeles por pulgada cuadrada)
Fondo transparente.
La versión final de este archivo se debe de guardar como PNG.

2.- Utilizamos la herramienta de texto para redactar el titulo de nuestro blog, con la cual podemos seleccionar la tipografía, el tamaño y el color.
Una vez que redactamos el titulo lo convertimos en objeto haciéndole doble click, esto nos permite ponerle efectos como sombra y bisel, creando de este modo texto artístico decorativo.

3.- Importamos el logotipo de la UEEP y seleccionamos el fondo para eliminarlo, usando la herramienta de varita mágica e invertimos la selección, copiamos y pegamos en nuestro documento original.

4.- En este punto el logotipo es un objeto al que se le pueden aplicar efectos también, ajustamos su tamaño y su posición y exportamos todo a PNG.

sábado 10 de diciembre de 2011

SESIÓN 12 INTRODUCCIÓN AL DISEÑO GRÁFICO: LA APARIENCIA DE NUESTRO BLOG

GLOSARIO DE TÉRMINOS BÁSICOS PARA EL DISEÑO GRÁFICO A TRAVÉS DE MEDIOS ELECTRÓNICOS.


1.- ¿Que es un Pixel?
El pixel es la unidad de color con luz mínima que puede representar un medio electrónico.
Su forma física mas tangible es un punto de color en la pantalla. En televisiones y monitores mas grandes, también en pantallas gigantes de LCD (como las que se encuentran en los anuncios publicitarios en las vialidades) es un punto de color que puede ser rojo, verde, azul o cualquier combinación de los tres colores, generando luz blanca cuando se combinan todas en la misma proporción.

Todas las medidas de gráficos en cualquier medio electrónico se expresan en pixeles, siendo la medida de 800x600 la mas usada hasta antes de los monitores SVGA y aun mayores con los monitores de alta definición y pantalla plana.

2.- ¿Que es un megapixel?
Se le llama megapixel a una matriz de aproximadamente un millón de pixeles, dispuestos en columnas e hileras para conformar una imagen en un medio electrónico. Mientras mas megapixeles tenga una imagen no necesariamente se hace mas detallada, si no que permite capturar imágenes mas grandes, lo que favorece su ampliación sin que suceda la pixelizacion o que aparezcan las deformaciones de baja resolución denominadas artefactos.

3.- Pixelizacion:
Deformación común que experimentan las imágenes cuando son ampliadas u observadas a un tamaño mayor al que fueron creadas para observarse, por ejemplo en el caso de fotos que fueron tomadas para verse por pantalla de celular, cuando son amplificadas en un monitor de mayor tamaño, se pixelean.

4.- Artefactos: son las deformaciones regularmente de formas cuadradas o rectangulares que aparecen en pantalla cuando forzamos la ampliación de una imagen que no fue creada para verse de cerca.

Pasa muy seguido con imágenes que fueron bajadas de internet y se imprimen en papel revelando su pixelizacion.

Formatos de imágenes mas populares y sus usos:

JPG: es el mas usado en la web. Cuando una imagen esta en este formato nos indica que ya fue comprimida (no esta en su máxima resolución) y que esta optimizada para mandarse por internet, verse en monitor o bien ampliarse hasta la medida original en la que fue creada, ya que se pixelea si se amplifica de mas.

GIF: al igual que JPG, es un formato ideal para ver imágenes en pantalla en tamaños relativamente pequeños que no ocupen mucho espacio en memoria (por ejemplo, que excedan el tamaño permitido en un correo electrónico) pero tiene dos características que la diferencian de otros formatos: 1.- Permite varios cuadros de imágenes en un solo archivo, por ejemplo, fotos animadas. y 2.- Para poder almacenar este tipo de información de animación, sacrifica colores, ya que cuenta con un numero limitado de colores para mostrar.