Z-Graphics

Este es un metodo sencillo de recoger o expandir informacion adicional en nuestras entradas que acabo de ver en el blog de jMiur lo unico que tenemos que hacer es copiar y pegar el javascript antes de cerrar la etiqueta HEAD.

Ejemplo:


EXPANDIR CONTRAER

Ahora puedes personalizar tus propios wallpaper o fondos de escritorio, estas son las tres primeras imagenes que podrás cambiar a tu gusto y colocarle tus propios textos. En el "paquete" van las tres imagenes .JPG y el archivo PSD (archivo de photoshop) correspondiente.

Espero que disfrutes de las imagenes...

Puedes descargarlo desde aqui:

http://www.filefactory.com/file/c3b1b7/n/wallpapers_Z-Graphics_rar

Bien pues creo que no necesita de mucha explicacion, esta es la entrega numero 3 de iconos. En esta ocacion se trata de imagenes que podemos utilizar para adornar las entradas de comentarios en nuestra pagina web o blog.





http://www.filefactory.com/file/4b7a4b/n/iconos_Z-Graphics_png_3_rar

y si quieren el archivo psd(archivo de photoshop)

http://www.filefactory.com/file/75dab6/n/imagenes_by_z-graphics_psd

Tutorial de Nivel: bajo-Medio
Descripcion: En este tutorial vamos a crear un icono senciilo usando photoshop.
Programa: Photshop y con unos pequeños cambios flash.

1- Creamos un documento en blanco de tamaño: 256px * 256px de fondo transparente y creamos un rectangulo utilizando la Herramienta de rectangulo Redondeado.





2- aplicamos el siguiente estilo de capa

sombra paralela: opacidad= 97
distancia= 5
extencion=0
tamaño 5
color=negro





Sombra interior: opacidad=40
distancia=0
retraer=0
tamaño=38





3-presionamos ctrl+click sobre la capa del rectangulo para seleccionar el mismo, y aplicamos un degradado radial con estos dos colores:





Asi nos debe quedar:





4-Con la herramienta Pen tool dibujamos la figura que necesitamos, en este caso es un icono de home, y aplicamos el siguiente
estilo de capa:


sombra paralela







sombra interior





superposicion de degradado





Y finalmente el resultado es este

Como les habia dicho en estos dias estaré publicando packs de iconos que nos serviran de mucha ayuda al momento de organizar nuestra web, en este caso nos va a servir mas que eso ya que se trata de imagenes que vamos a poder utilizar en archivos de flash como reproductores o para dar apariencia a nuestras imagenes de ventnas, etc.

Todo depende de la creatividad de cada uno y del uso que le podamos dar.

Pueden descargar el pack completo desde aqui

Una de las cosas mas importantes de una pagina web es lograr que cada visitante encuentre lo que busca, y nosotros debemos tratar de hacer lo mejor para que este recurso sea eficiente. Asi que hoy tratare de dejarles las mejores cajas de busqueda que he encontrado en la web.
(al momento de pegar el codigo en tu blog cambia donde dice: "z-graphics.blogspot.com"`por la direccion del tuyo.)

1-google


<form action="http://www.google.com/custom" method="get"><p><input name="q"><input type="submit" value="Buscar"><input type="hidden" value="z-graphics.blogspot.com" name="sitesearch"></p></form><br /><br />

2-Búsqueda de blogs en Blogger:


<form action="http://search.blogger.com" method="get"><p><input name="as_q"><input type="hidden" value="z-graphics.blogspot.com" name="bl_url"><input type="submit" value="Buscar"></p></form><br /><br />

3-Búsqueda de blogs en Google (la búsqueda es lo mismo que lo anterior, solo cambia la apariencia):

<form action="http://blogsearch.google.com/blogsearch" method="get"><p><input name="as_q"><input type="hidden" value="z-graphics.blogspot.com" name="bl_url"><input type="submit" value="Buscar"></p></form>

4-Para terminar, una curiosidad: cómo se pone un texto por defecto en una caja de búsqueda que desaparezca al pinchar en la caja cuando se empieza a escribir:

<input type="text" value="Escriba su consulta..." onfocus="if(this.value=='Escriba su consulta...')this.value=''">



5-Otras opciones para poner cajas de búsqueda en tu blog:

PicoSearch
FreeFind
MuseStorm

Antes de empezar a explicar el procedimiento tengo que confesar que nunca antes habia escuchado sobre esto, hasta que un buen dia tratando de cambiar la plantilla de mi blog, tuve la oportunidad de leerlo.

Lo primero que debes saber es que para cada etiqueta que coloques en tus entradas debe existir una imagen que la represente, es decir:

si publicas una noticia sobre google, una de
las etiquetas será..."google", asi que debera existir una imagen como esta: que la represente. Por supuesto no querras una imagen grande y de
poca calidad.

y hay otras cosas que tambien debes saber, como por ejemplo que no se trata
de anteponer un icono a la lista de etiquetas, se trata de reemplazarlas o
acompañarlas por una representacion grafica.
puedes observar las etiquetas
de mi blog y asi entenderas un poco mas de que se trata.

Y hay algo mas
(si ya lo se, es un poco aburridor pero recuerda que las etiquetas son una parte
importante del blog)
Cada vez que escribamos una etiqueta en una entrada,
blogger las buscara en un servidor: Por nombre y por extencion(será como un
directorio estatico) por lo que no podremos utilizar servicios de alojamiento
como imageshack, blogger , el skydrive de
hotmail, etc si no que vamos a utilizar otros servidores que
establecen una direccion fija como Photobucket, Fileden, Google Pages.

ejemplo:

http://i120.photobucket.com/albums/r21/z-graphics/etiquetas/nombre_del_archivo.ext

y no se olviden, despues de
haber subido las imagenes deben colocarle el nombre de la etiqueta que
representan y todas las imagenes deben ser del mismo formato{o todas png, o
todas jpg, o todas gif, etc}.

ahora si a lo que vinimos

Primer paso:

ingresa a blogger y ve a la pestaña "diseño" de tu blog, despues a edicion de html y marca la casilla de expandir artilugios.

Segundo paso (Marcamos la casilla de Expandir artilugios):

Si se fijan, las etiquetas se muestran en una lista, eso es lo que está definido por los códigos:

Dependerá mucho de cómo vamos a mostrarlas pero, en principio, podríamos eliminar esas líneas o darles una clase para luego poder manipularlas con CSS:

.sidebar ul.listaetiquetas {... propiedades ...}

.sidebar li.etiquetaimagen {... propiedades ...}

Luego, la parte importante, reemplazar el texto de la etiqueta (<data:label.name/>) por la imagen correspondiente; para esto, vamos a usar una facilidad de Blogger, crear una expresión:

<img expr:src='"http://nuestro_servidor/" + data:label.name + ".ext"'/>

Esto se encuentra en dos líneas diferentes. Cambiamos ambas pero reemplazamos http://nuestro_servidor/ por la dirección del servidor donde esté alojada la imagen y ext por la extensión del tipo de archivo que utilicemos. Y ya que estamos, también eliminamos el contador (<data:label.count/>).

El código quedaría así:

Lo mismo podemos hacer con las etiquetas que se muestran debajo de los posts, esto lo vamos a encontrar en:

<b:includable id='post' var='post'>

Por defecto, el código de esa parte es el siguiente:

Como se ve, es muy similar al anterior pero, no es una lista HTML sino que se escriben una al lado de la
otra así que eliminamos el carácter separador (la coma) y, nuevamente, reemplazamos el texto <data:label.name/> por la imagen:

<img expr:src='"http://nuestro_servidor/" + data:label.name + ".ext"'/>

En este caso, podemos crear una variante, utilizar una imagen personalizada y además, el texto, uno al lado del otro:

Este tutorial fue sacado de Vagabundia

Este es el primer grupo de iconos que estaré subiendo en los proximos dias y que consta de imagenes que podemos utilizar para adornar nuestra pagina web o blog. Como puedes ver, las etiquetas de Z-Graphics estan hechas con iconos, si quieres utilizar este mismo sistema no dudes en entrar a ver el tutorial.

ah y si quieres aprender a hacer tus propios iconos en photoshop, pero no eres el mejor no te preocupes sigue paso a paso este tutorial y podrás hacerlo mucho mejor.

Puedes descargarlos todos desde aqui

Adobe ® Flash ® CS4 Profesional es el software líder en la industria medio ambiente de autoría para la creación de realizar experiencias interactivas. Entregar al público a través de plataformas y dispositivos.
Animación basada en objetos
Logre un control absoluto sobre todos y cada uno de los atributos de la animación con el método basado en objetos, que aplica directamente a éstos las interpolaciones en lugar de a los fotogramas. Efectúe con sencillez cambios a las rutas de movimiento mediante los selectores de Bézier.

Transformación 3D

Anime objetos bidimensionales en un espacio tridimensional con las nuevas herramientas de traslación y rotación 3D, que permiten elaborar las animaciones a lo largo de los ejes X, Y y Z. Aplique transformaciones locales o globales a cualquier objeto.
Modelado de procesos con la herramienta decorativa y el pincel rociador
Convierta cualquier símbolo en herramientas de diseño instantáneo. Aplique los símbolos de formas diversas: obtenga con rapidez efectos caleidoscópicos y emplee rellenos mediante la herramienta decorativa; u opte por rociar símbolos de forma aleatoria en un área definida mediante la herramienta del pincel rociador.
Compatibilidad con metadatos (XMP)
Añada metadatos a los archivos SWF mediante el nuevo panel de XMP. Asigne rápidamente etiquetas para lograr una colaboración mejorada y un uso más eficaz de los dispositivos móviles.

Creación para Adobe AIR™

Añada las ventajas del contenido interactivo a su escritorio con la nueva función integrada que permite efectuar la publicación en el tiempo de ejecución de Adobe AIR. Amplíe aún más su audiencia abarcando más dispositivos (Web, dispositivos móviles y, ahora, de escritorio).
Nueva interfaz de Adobe Creative Suite®
Incremente la eficacia de su trabajo con un acoplamiento intuitivo de paneles y comportamientos que emulan los de elementos accionados por resortes; con ellos, su interacción con las herramientas de todas las ediciones de Adobe Creative Suite será más fluida.
Cinemática inversa con la herramienta de huesos
Cree efectos de animación similares a los de elementos encadenados con una serie de objetos vinculados unos a otros, o distorsione con sorprendente rapidez una forma cualquiera mediante la nueva herramienta de huesos.

Editor de movimiento

Utilice el nuevo Editor de movimiento para lograr un control exhaustivo de los parámetros de los fotogramas (como rotación, tamaño, escala, posición o filtros, entre otros). Utilice la visualización de los gráficos para obtener resultados más precisos con la aceleración.
Configuración predefinida de movimiento
Ponga en marcha sus proyectos empleando animaciones prediseñadas aplicables a cualquier objeto. Puede efectuar la selección de entre decenas de valores de configuración o, si lo prefiere, crear su propia configuración y guardarla. Comparta estos valores de configuración preestablecida con otros usuarios para ahorrar tiempo de animación.

Compatibilidad con H.264

Efectúe una codificación a cualquiera de los formatos que el tiempo de ejecución de Adobe Flash Player reconoce gracias a Adobe Media Encoder, la misma herramienta que está presente en otros productos de vídeo de Adobe y que incorpora ahora la compatibilidad con H.264.

Descargar Adobe Flash cs4_

http://www.filefactory.com/file/ad5099/n/migueljimenezADB_FLASH_part5_rar

Serial para Flash cs4_1302-1856-4062-7946-4986-2994