/ / Multimedius Blog \ \

Videos | La mentira perfecta en Photoshop

2008-07-10T21:42:00.002-03:00

Cuantas veces vemos mujeres increiblemente hermosas en las tapas de las revistas, en tv y en anuncios por la calle? Mujeres aparentemente perfectas, con miradas deslumbrantes, sin arrugas, piel suave y sin defectos, que harian que cualquier otra chica se considere una ruina.

Estas mujeres "perfectas" dan una impresion distorsionada de lo que es la belleza y destrozan el autoestima de muchas muchachas inseguras de su fisico. Igual, chicas, si las tranquiliza tengo algo que decirles: esas chicas NO EXISTEN. Y sino miren este video:

Este es uno de los 18 mejores videos de Photoshop segun PSDTUTS. Vean las cosas impresionantes que se pueden lograr con un poco de habilidad.

Recursos | 56 estilos para Photoshop

2008-07-06T21:38:00.004-03:00

Los estilos de photoshop pueden ayudarnos a lograr efectos muy bonitos economizando tiempo y energias. Son una gran herramienta para trabajar por capas y pueden sernos muy utiles si son bien utilizados.

En Jayhan pueden descargar una coleccion de 56 estilos para Photoshop y utilizarlos libremente en cualquier diseño.

Diseño | Portfolio de 73dpi

2008-07-06T19:44:00.004-03:00

73dpi es un grupo de diseñadores ukranianos con clientes importantes como la cerveceria Stella Artois. Se dedican principalmente a la creacion de web y grafica de sus clientes con un exito impresionante.

Les dejo la pagina principal con el portfolio de sus creaciones. Ademas, no dejen de ver el diseño de sus iconos y logotipos.

Diseño | 50 sitios "oscuros" y bonitos

2008-07-06T19:09:00.004-03:00

Si bien hoy en dia es muy valorado el "blanco" en los diseños web, podemos admirar una hermosa coleccion de sitios diferentes en Vandelay Design. Se trata de magnificos ejemplos de lo que se puede lograr a partir de colores oscuros.

Hay dos colecciones de 25 webs:

Recursos | Pincel de photoshop: "Acrilicos"

2008-07-06T18:26:00.000-03:00

Luego de mucho tiempo en stand-by sin postear nada nuevo vuelvo a las andadas y les traigo un set de pinceles de Photoshop de Alta Resolucion. Antes de que intenten bajarlos debo mencionarles que pesan 47.72 MB! Pero bien valen la pena si los necesitan.

Son muy bonitos y lo mejor de todo: son gratuitos. Simplemente tienen que descargarlos e instalarlos en Photoshop.

Recursos | Coleccion de pinceles y texturas Vintage

2008-06-29T23:04:00.005-03:00

Paseando por DesignReviver me encontre con una coleccion de texturas y pinceles Vintage que estan buenos para lograr algun estilo antiguo en nuestros diseños.

300+ Vintage Style Textures and Photoshop Brushes.

Tutoriales | 6 tutoriales para efectos de texto

2008-06-09T13:36:00.000-03:00

En PSDTUTS hay un tuto de Photoshop muy piola para crear efectos alucinantes para nuestros textos en solo 5 minutos.

Eso si; como siempre, esta en ingles.

Ver Enlace

Recursos | Recopilacion de iconos gratuitos

2008-06-09T13:27:00.003-03:00

En Smashing Magazine hay uno de los mejores compilados de iconos gratuitos que vi en mi vida. Si necesitan iconos originales para la web o escritorio esta es la fuente que estan buscando.

Los iconos estan separados en 4 colecciones:

No se lo pierdan!

Recursos | Formulario en Ajax + PHP

2008-05-28T02:38:00.001-03:00

LightForm es un formulario muy cool desarrollado en Ajax y php que podra darle un toque especial a nuestra web.

Es amigable con el usuario y posee varias funcionalidades: validacion del formulario, chequea spam, verifica el nro de IP y servidor del usuario, trabaja bien en la mayoria de los navegadores, inputs con bordes redondeados y muestra una ventana de dialogo no intrusiva cuando el correo es enviado correctamente.

El formulario puede descargarse y utilizarlo libremente. Esta construido con XHTML, CSS y PHP y simplemente debemos cambiar el email del destinatario.

Programas | Estadisticas de tu sitio en tiempo real

2008-05-26T19:18:00.000-03:00

Para esta altura todos conocemos el potencial de Google Analytics... pero alguien conoce el de Woopra? Se trata de un sistema de web-tracking y analizador de tu sitio en tiempo real y posee un gran numero de herramientas.

Funciona de forma similar a Analytics con la diferencia que la consola de este sistema puede ser descargada a nuestra pc para ver los datos de una web desde tu escritorio en tiempo real. Una vez bajado el programa solo debemos colocar un plugin (o el codigo) en nuestro sitio web para que empiece a funcionar.

Algunas ventajas:

Analisis y estadisticas en tiempo real.
Impresionante GUI.
Administra varios sitios/blogs al mismo tiempo.
Permite chatear con los visitantes.
Herramientas par ael desarrollador.
Compatible con Wordpress.
Los datos pueden exportarse.

Web: Woopra
Descarga: Woopra

Utilidades | Encontra el nombre de una fuente

2008-05-26T00:01:00.000-03:00

What the Font es realmente una joyita que te puede ahorrar algo de tiempo en buscar una fuente.

A veces vemos alguna fuente en algun lado que realmente nos gusto pero no conocemos el nombre. ¿Que hacemos?

Solo basta con subir una imagen o indicar el URL de la letra que nos interesa y WTF nos indicara el nombre de la fuente. En algunos casos podemos bajar la fuente directamente a nuestra pc.

Diseño | 10 tendencias en el diseño de logos del 2008

2008-05-24T18:50:00.004-03:00

El logo es lo mas pregnante de la imagen de un sitio o empresa. Algunos pueden gustarnos mas que otros pero lo cierto es que se dan ciertas tendencias en el (re)diseño de algunas marcas. Un articulo nos explica cuales son las 10 ultimas tendencias en el diseño de logos.

Podemos mencionar algunas:

Formas 3D organicas
Utilizacion de "olas"
Colores brillantes y superficies pulidas (efectos web 2.0)
Transparencias
Letras minimalistas
Escalas de colores (arcoiris)
Fuentes modernas / Sci-Fi
Logos con hojas
Inspiradas en los '80
Diseños heraldicos

Web: 10 trends that will define logo design in 2008

Tutoriales | SiFr paso a paso

2008-05-24T18:41:00.000-03:00

sIFR es un script que reemplaza un elemento de texto (o varios) en una página por un archivo flash que despliega el mismo texto. Esto nos permite utilizar tipografías que no estén instaladas para nuestra web y tener texto con suavizado (anti-aliasing).

En Diseñorama podemos encontrar un tutorial -en castellano- que enseña como instalar y utilizar SiFr para utilizar cualquier fuente en nuestra pagina HTML.

Recursos | Vectores de elementos heraldicos

2008-05-24T02:54:00.003-03:00

Una coleccion de hermosos vectores gratuitos de elementos heraldicos en formato eps y listos para descargar.

Utilidades | Herramienta de E-mail Marketing open source

2008-05-24T01:59:00.003-03:00

El e-mail marketing es la interseccion entre CMS (content management system), CRM (Customer relashionships manager) y BI (Business Intelligence). Si se utilizan sabiamente, las campañas de e-mail marketing pueden tener un efecto contundente en una campaña de promocion. Lo interesante es que los resultados pueden medirse facilmente.

OpenEMM es una poderosa herramienta open source de gran nivel para llevar a cabo esta importante estrategia de marketing.

Entre algunas de sus cualidades podemos escoger un template para el diseño de los e-mails, crear listas de correo, configuracion para distintos usuarios, analisis de cantidad de clics, segmentacion de los usuarios, estadisticas, medir el exito de las campañas y comparacion de distintas campañas entre otras.

Utilidades | Plataforma de e-commerce open source

2008-05-24T01:35:00.002-03:00

Freeway es una plataforma de e-commerce de codigo abierto que te permite vender servicios, suscripciones o eventos ademas de productos.

Es una aplicacion construida con PHP y usa MySQL como base de datos y puede integrarse a Joomla y Drupal (gestores CMS).

Todavia no pude probarlo pero me hablaron muy bien de esta aplicacion. Si alguien lo hizo lo invito a compartir su experiencia.

Tutoriales | Enviar SMS a traves de la web

2008-05-22T00:27:00.005-03:00

Me pregunte como hacer para mandar mensajes de texto SMS desde un sitio web y se me ocurrio que no debe ser tan complicado teniendo en cuenta que las empresas permiten enviar mensajes a celulares desde el correo electronico.

Entonces si queremos mandar un mensaje de texto, por ejemplo, al 0351-156126188 de movistar solo basta con quitar el 0 y el 15 al principio y agregarle el dominio de movistar al final. Entonces quedaria asi: 3516126188@sms.movistar.net.ar

Luego, tan solo creando un formulario comun que envie los mails a las distintas empresas de telefonia ya estaria hecho el trabajo. Ahora, la gracia estaria en conseguirse los @dominio de todas las empresas de celulares.

Los pasos que deberiamos hacer son:

crear un formulario que mande los datos a la pagina que va a enviar el mail (por ej: action="sms.asp")
un campo de texto para ingresar el e-mail del remitente.
un campo de texto para ingresar el telefono celular del destinatario. (3516126188@etc...)
un campo para elegir la empresa de telefonía que utiliza el destinatario.
un textarea para escribir el mensaje y el boton de enviar.
programar una pagina para enviar los mails tipo CDONTS o Asp Mail.

Pueden ver el ejemplo de un script con el formulario y el envio de sms o descargarlo directamente. Esta programado en php pero el lenguaje de programacion no es importante, pueden hacerlo en asp tambien.

* Los dominios pueden haber cambiado, sera tarea de ustedes averiguar los dominios actuales.

Articulos | Designer Toys

2008-05-19T03:09:00.006-03:00

Conocemos a los Designer Toys (Juguetes de Diseñador) como juguetes coleccionables -de ediciones limitadas- que son elaborados por artistas y diseñadores y son el fetiche de un nuevo movimiento de cultura urbana.

El origen del Designer Toy o tambien llamado Urban Vinyl Toy tuvo lugar en Hong Kong cuando Michael Lau mostro un GI-Joe modificado con un estilo suburbano en una exposicion en 1997. De esta manera, los artistas japoneses comenzaron a diseñar sus propios juguetes, generalmente de vinilo o plastico aunque a veces utilizan madera o metal.

La mayoria de estas figuras estan hechas con la tecnica rotocasting, que utiliza una maquina cuyo molde rota constantemente para fundir y moldear el material. Las figuras de 12" o de 1/6 se convirtieron en un formato común puesto que comparten 12 moldes de cuerpo similares.

Podemos decir que en general el aspecto de los juguetes tiene algunas tendencias que dan la idea de ternura con algunos toques grotescos. Animalitos sangrando, muñecos con hachas o motosierras, niñas con calaveras, monstruos de aspecto infantil o naif son algunos de los patrones que se repiten.

Basicamente existen 3 tipos de Toys:

Urban Vinyl: la mayoria son figuras de accion (action figures) hechos de vinilo. Algunos ofrecen la posibilidad de "tunear" el diseño del toy.
Designer Plush: de materiales mas suaves, suelen ser muñecos rellenos que despiertan cierta simpatia en las personas.
Designer Consumer Electronics: cuando se cruzan los juguetes con la tecnologia nacen productos como Designer USB flash drives.

De a poco, el fenomeno se empieza a dar de forma global y los Designer Toys empiezan a ser producidos por diseñadores en todo el mundo, incluso en Argentina (Robotel).

Vean esta entrevista a una gente que se dedica a esto en Mexico:

Si les intereso el tema, probablemente quieran ver estos links:

MJG Adrian es un blog mexicano que suele subir varios posts acerca de Designer Toys y diseño en general.
Tokidoki es una empresa italiana dedicada a estos productos. Vean el Showcase.
Release the Freak otro gran sitio enfocado en Designer Toys.
StrangeCo catalogo de juguetes de diseño.
Nota en un portal español.
Post de un blog en ingles acerca de designer toys fantasticos.
Paper Critter crea tu designer toy online!
Baja, imprimi y arma tu propio designer toy.
Video tutorial para crear tu propio molde de dos piezas.

Recursos | Hosting gratuito y sin publicidad

2008-05-19T03:00:00.003-03:00

Chupate esa mandarina! En Intercambia.net publicaron una lista con servicios de hosting gratis y una breve descripcion de cada uno de ellos. En algunos casos, los servicios soportan php y mysql.

Les paso la lista:

Lamentablemente no pude probarlos a todos pero algunos funcionan muy bien!

Diseño | 22 Diseñadores con talento

2008-05-17T18:53:00.000-03:00

En Metrografic, una recopilacion de 22 grandes diseñadores con talento que incluyen artistas, fotografos, diseñadores web y graficos con algunos trabajos impresionantes.

Muy bellos, ¿verdad?

Articulos | Libros de diseño web Online

2008-05-17T17:19:00.003-03:00

Vamos... entre nosotros... sabemos que sos un poquito vaguito con la lectura ¿no? ¡Seamos sinceros! Pero sos consciente de que para seguir en esto hay que leer, leer, leer e investigar mucho ¿verdad?

La buena noticia es que no tenes que poner un centavo en esos carisimos libros de diseño porque toda la info esta en la web. Y de ultima podes pasarte por LibrosWeb, donde se publican libros completos acerca de CSS, AJAX, Javascript, XHTML y todo lo que te hace falta escritos por expertos en el tema.

Algunos libros se pueden bajar en formato PDF. Abrite un libro, te prometo que no va a doler (mucho).

Tutoriales | Bordes redondeados de 1 px

2008-05-17T17:02:00.005-03:00

¿Vieron esas esquinas apenas redondeadas en los botones de Google Analytics? Naturalmente podriamos recurrir a imagenes o javascript pero existe una manera de lograrlo utilizando nada mas que CSS.

Y sino me creen, preguntenle al tipo del CSS.

Recursos y Tutoriales | Recursos en PSD

2008-05-17T16:43:00.003-03:00

Amantes de Photoshop, les dejo dos links imprescindibles para facilitarles la vida y sus diseños. PsdFreebee es un espacio donde podemos encontrar varios archivos en formato PSD para tomar prestados, desde iconos y logos hasta templates web 2.0 enteros.

Por ultimo, si no conocian PSDTUTS les recomiendo que se den una vuelta ya que existe una infinidad de excelentisimos tutoriales para lograr los mas impresionantes efectos en Photoshop.

Utilidades | Slideshow + Panoramas para tus fotos

2008-05-09T17:12:00.003-03:00

Magtoo es una manera interesante de compartir tus fotos. Luego de subir nuestras fotos podemos crear tres tipos de widgets:

Slideshow con transiciones, efectos y sonidos.
Vistas panoramicas en 360º de nuestras fotos.
Trip view: fotos de nuestro viaje dispuestas en un mapa como el Google Maps.

Los widgets pueden ser colocados en facebook, blogger, xanga, flickr o en nuestra web.

Enlace | Magtoo

Utilidades | Efecto de olas en mi foto

2008-05-09T16:31:00.005-03:00

¿Se acu erdan hace muuuucho tiempo que publique un post acerca de un programa que sirve para hacer superficies acuaticas animadas en nuestras imagenes?

Wavemypic es una utilidad online que permite crear un efecto parecido en cuestion de segundos. No es tan buena como la otra pero si es rapido y facil de usar: solo debemos subir un imagen y listo. Eso si, cada imagen pesa bastante porque genera un gif animado cuadro a cuadro.

Ocio | Chatea con Dios en el I-God

2008-05-09T16:15:00.006-03:00

Hace algunos años, lo tradicional era ir a la iglesia si queriamos "hablar" con nuestro Señor... pero los tiempos cambian y la tecnologia avanza.

Asi es, damas y caballeros, desde que El se hizo instalar la banda ancha, la frase "Dios esta en todos lados" cobra un nuevo significado.

¿Para que caminar hasta tu parroquia amiga si podes chatear con Dios desde la comodidad de tu hogar, no?

Similar al funcionamiento de Elita, el I-God (que recuerda al famoso dispositivo movil para la reproduccion de mp3) es un sistema de inteligencia artificial que muchas veces da una respuesta coherente a las interacciones con el usuario. Si bien esto es algo curioso las verdaderas aplicaciones se relacionan con crear nuevos sistemas de interaccion con el usuario.

Enlace | I-God

Materias| Tipografia y Color

2008-05-01T17:13:00.002-03:00

Antes que nada: ¡Feliz dia a los trabajadores!
Para los interesados les dejo una presentacion acerca de Tipografia y Color en la Web, desarrollado por Juan Manuel Lucero.

| View | Upload your own

Ademas, las instrucciones en castellano para utilizar siFR, un sistema para utilizar cualquier fuente en nuestros diseños web sin necesidad de convertirlas en imagen. La ventaja de esto se encuentra a que no tenemos que limitarnos al reducido numero de fuentes compatibles para la web.

Articulos | Adobe TV

2008-05-01T16:58:00.004-03:00

La gente de adobe se pasa cada dia mas. El otro dia descubri Adobe TV, un servicio mas de la marca creadora de Photoshop, donde podemos ver un gran numero de videos educacionales orientados a fotografos, programadores, diseñadores y profesionales del video.

Para ver los videos simplemente debemos tener instalado Adobe Flash Player 9 y disponer de un poco de tiempo. Entre algunos de los temas que nos competen estan: como trabajar con Photoshop y Dreamweaver, demostraciones de Adobe Air y Flex, diseño con vectores y videos para aficionados.

Fijense si les interesa... eso si: It's in English, of course.

Recursos | Texturas

2008-04-29T14:31:00.001-03:00

En Bittbox hay una coleccion de 12 links para bajar texturas gratis:

Recursos | Templates en CSS Gratis

2008-04-28T16:29:00.001-03:00

Si buscaban plantillas gratuitas de sitios realizados con CSS, Free CSS es una opcion a tener en cuenta.

Hay una gran cantidad de diseños de calidad y gratuitos listos para bajar. No creo que haga falta mas descripciones...

Free CSS

Diseño | Posters + Videos + Imagenes Vintage

2008-04-27T23:59:00.000-03:00

No se a ustedes pero a mi me fascina el Diseño Vintage. ¿pero eso que significa? Les voy a dar mi definicion:

Vintage es toda caracteristica del diseño (colores, ilustraciones, tipografia) inspirada en la grafica de las décadas del 1920 a los '80.

Se dice que el termino vintage tiene sus raices en la palabra "vino" ya que se cree que el gusto por el diseño de aquella epoca mejora con los años y sus creaciones son vistas como CLASICOS.

Vintage se aplica a todo tipo de objetos como la grafica, fotografia, ilustraciones, videos e incluso música y moda.

Si aun no estan familiarizados con este estilo les recomiendo que vean este articulo y vean las cosas hermosas que pueden hacerse con muy buen gusto y aplicadas a publicidades y diseños actuales.

Otro ejemplo que me gusta es el sitio de Lana Landis, una tipica chica de calendario yanki (Pin-up).

Diseño | Revistas de diseño en PDF

2008-04-27T23:53:00.000-03:00

Via Smashing Magazine (uno de los mejores blogs de diseño a mi gusto) encontre PDF MAGS, un Showcase de revistas de diseño en formato PDF.

Entre alguna de las revistas podemos destacar:

Entel Magazine (revista de arte y diseño en castellano).
Vectorika (revista de diseño vectorial)
GizMag (revista de multimedia)
Anti (revista de fotografia e ilustraciones)

Sitio: PDF MAGS

Novedades | Crea tu propio youtube gratis

2008-04-27T18:32:00.002-03:00

En PuntoGeek encontre un post realmente interesante:
Se trata de Staryourtube, un servicio que nos permite crear nuestro propio "Youtube" sin necesidad de programar ni pagar hosting.

Ademas podemos darle al sitio nuestro propio estilo, logo y hasta nombre de dominio. Y la mejor parte: ¡hasta podemos ganar plata! ¿como? El 60% de las ganancias de publicidad en el sitio son para nosotros, el resto para ellos.

Solo tenemos que crear nuestra cuenta, ingresamos nuestros datos, personalizamos el sitio y listo.

Start your Tube!

Diseño | Tarjetas de presentacion originales

2008-04-27T14:02:00.004-03:00

¿Estas pensando en hacer tarjetas con tu nombre y no se te ocurre una idea? Entonces busca inspiracion en esta galeria de tarjetas "cool" que realmente vale la pena ver.

Materias | Apunte de Psicologia de la Comunicacion: Motivacion y Actitud

2008-04-27T13:47:00.002-03:00

Para el parcial del 8 de mayo va el apunte que esta en fotocopiadora y la siguiente presentacion de powerpoint:

Motivacion y Actitud:

| View | Upload your own

Articulos | Modelo de Brief II

2008-04-25T16:43:00.003-03:00

Hace algun tiempo publique un articulo donde mostraba un modelo de brief desarrollado por la agencia No Borders. Para aquellos interesados, ahora queria mostrarles un post que encontre en MexSide donde explican de que se trata y como armar un Brief. Ahi pueden encontrar 20 preguntas sencillas y un modelo para descargar.

Utilidades | Generador de cajas 3d

2008-04-25T16:22:00.004-03:00

Ideales para colocar en portfolios o venta de software, las cajas en 3D pueden aportar un toque distintivo a nuestros productos.

3D-BOX maker es un generador online de cajas tridimensionales donde lo unico que tenemos que hacer es colocar una imagen de frente, una de costado y una de arriba. Un simple clic y el generador hace el resto.

3D Box Maker

Utilidades | Crea un tour para tu web

2008-04-25T15:04:00.002-03:00

Los Site Tours son una manera de guiar al usuario por el contenido de nuestra web e incrementar la usabilidad. Estos asistentes suelen utilizarse en varios sitios, por ejemplo, en la descripcion de las cualidades de algun servicio o para registrarse en una web. Algunos ejemplos: Facebook, USDA, Aetna.

Si necesitas crear un site tour para tu web la solucion es Amberjack. Se trata de una manera gratuita y open source para personalizar un tour segun nuestros requerimientos mediante javascript: un asistente nos permite elegir las URL de nuestro sitio y genera un codigo que debemos pegar en nuestro sitio. Ademas el tour puede adaptarse al estilo de nuestra web mediante nuestras hojas de estilo.

Amberjack

Recursos | 1000+ recursos de Ajax & Javascript

2008-04-20T00:50:00.002-03:00

Ajax Rain es un excelente sitio donde podemos encontrar una infinidad de scripts para utilizar en en nuestro sitio web y optimizar al maximo la usabilidad y el "look" de tu web.

Algunos ejemplos:

¡Muy recomendado!

Sitio: Ajax Rain

Utilidades | Almacena tus archivos online

2008-04-18T14:15:00.005-03:00

Una buena de Micro$oft: probablemente si abrieron sus cuentas de hotmail habran notado un banner con una leyenda asi como "Windows Skydrive, hace clic y conocelo" (lo que me recuerda al famoso chiste de Marcelo).

SkyDrive es una herramienta que nos brinda un espacio de 5Gb para almacenar nuestros archivos en la red con la posibilidad de restringir su acceso en distintos niveles. Esto significa que al subir un archivo puedo elegir si quiero que cualquiera pueda acceder a el, o solo mis amigos, o solamente yo. Bastante util.

Live Skydrive

Utilidades | Optimiza tus fotos online

2008-04-18T00:15:00.002-03:00

Con "optimizar" me refiero a comprimir una imagen de manera tal que ocupe el menor espacio posible sin perder calidad. Si no tenemos ganas de abrir nuestro editor de imagenes para realizar esta tarea podemos recurrir a una herramienta que nos permite convertir nuestras imagenes online.

Image Optimizer

Utilidades | PSD a HTML

2008-04-17T23:29:00.004-03:00

Abriste el Photoshop, trazaste una cuadricula y colocaste las guias muy meticulosamente... luego de un tiempo dedicado a la maquetacion, armaste un flor de diseño que tenes que tener listo para dentro de 10 minutos porque tu cliente quiere ver como esta quedando... ¿que hacemos?

A menos que seas un "as" del CSS podrias llamar a Mandrake para que te transforme tu archivo PSD a Html. O mejor aun, podes subir tu archivo a PSD2CSS Online y convertir tu diseño de manera simple, rapida y gratuita.

Solo tenes que enviar el archivo y luego de unos segundos tendras tu xhtml + css listo para bajar a tu maquina. Interesante ¿cierto?

Converti tu PSD a HTML!

Agradecimientos a Juan Manuel Lucero por el dato.

Materias | Practicos + Parciales

2008-04-13T14:41:00.002-03:00

Marketing Digital:

Entregar informe de campaña de MKT celular LG/desarrollista inmobiliario en caso de no haberlo hecho anteriormente (16 de abril).
Parcial nro. 1: 23 de abril

Comercio Electronico:

Entregar informe de perfil de usuario (fecha de entrega: 17 de abril) - ver video trends
Parcial nro. 1: "como vender por internet" (hasta p. 48) - Modelo de negocios Gaptel

Animacion:

Trabajo practico nro. 1 (fecha de entrega indefinida)
Bocetos de 3 figuras para modelar (enviar por mail para el 16 de abril)

Programacion:

Parcial nro. 1: 25 de abril

Psicologia de la Comunicacion:

Parcial nro. 1: 8 de mayo

Articulos | Feeds de diseño

2008-04-11T21:39:00.004-03:00

Design Feed Aggregator es un sitio donde tenemos una recopilacion de blogs de diseño elegidos a mano. Ademas tiene los feeds de cada sitio para que podamos suscribirnos si usamos algun lector de noticias.

Para que no tengamos que suscribirnos a cada sitio por separado hay un archivo OPLM con toda la recopilacion lista para importar a nuestro lector.

Si no tienen algun lector les recomiendo que los empiecen a usar ya:

- http://www.bloglines.com/ (bloglines - lector online)
- http://www.google.com/reader (google reader - lector online)
- http://www.feedreader.com (lector de escritorio)

Articulos | Vocabulario 2.0

2008-04-08T15:58:00.009-03:00

Rss, Digg, Post, Vlog, Wiki... ¿te suenan de algun lado? Si no es asi, te recomiendo que le des un vistazo al diccionario 2.0 porque estos terminos van a terminar siendo parte de tu vida tarde o temprano. Se trata de una recopilacion de nuevos terminos surgidos a raiz de la instauracion de la web 2.0 y que no podemos dejar de conocer. Con ustedes, el Mataburros Digital:

Agregador: a.k.a. lector de feeds o RSS. Es un programa que "lee" el contenido dinamico de una web y lo presenta al usuario sin que este necesite ingresar a dicha web. Para suscribirse a una publicacion es necesario que esta cuente con un sistema de Feeds como Rss o Atom. Los agregadores mas conocidos son Bloglines y Google Reader.

AJAX: abreviatura de Asynchronous JavaScript y XML, es un método de desarrollo Web para elaborar aplicaciones Web interactivas.

App: Aplicacion (software).

Atom: formato de sindicacion de feeds similar al RSS.

Audioblog: es una galeria de audio que se actualizan periodicamente y que funciona de manera similar al blog. Por ej, Hipcast.

Bitacora: ver blog.

Blog: a.k.a. bitacora a.k.a. weblog. El termino surge de la contracion inglesa web-log ('log'=diario). Es un sitio web actualizado con frecuencia que recopila articulos de una tematica de forma cronologica. La vida de un blog es dada por la libertad de expresion de sus autores y principalmente por los comentarios de sus visitantes. Por ej, proyeccion digital o este sitio. Entre los generadores de blogs mas populares se encuentran blogger y wordpress.

Blogger: servicio de creacion y alojamiento de blogs del grupo Google. Ver sitio.

Blogroll: es una lista de links de varios blogs.

Bloglines: uno de los agregadores de feeds mas populares. Ver agregadores.

Blogosfera: se denomina asi al conjunto de todos los blogs existentes en linea.

CMS: (Content Manager System) permite la creación y administración de contenidos dinamicos para una web. Es un sistema de gestion de contenidos que utiliza una o varias bases de datos para administrar el contenido y el diseño por otro lado. Por ej: Joomla, OpenCMS, Drupal.

Del.icio.us: es un servicio de marcadores sociales que permite guardar nuestros URL favoritos, categorizarlos y compartirlos con otros usuarios. Ver sitio.

Digg: es un sitio especializado en tecnologia y ciencia donde los usuarios envian y comparten sus noticias y estas reciben un puntaje que ubicara a la noticia dentro de un ranking.

Feed: se refiere al tipo de sindicacion que utiliza un sitio actualizado periodicamente. De acuerdo al contenido creado en un sitio web, se genera un archivo XML que es leido por un lector de feeds (ver agregadores) que presentara el contenido a cierta cantidad de usuarios suscriptos. La idea principal seria que yo no busco los contenidos, ellos vienen a mi.

Facebook: es una sitio web social que conecta personas con sus amigos y otras personas que trabajan, estudian y viven cerca de ellos.

Flickr: Sitio web donde varios usuarios comparten sus imagenes. Ver sitio flickr.

Folksonomia: varios usuarios identifican con (una o varias) etiquetas un mismo contenido.

Etiqueta: (ver Tag)

Meneame: es un sitio web similar a Digg.

My Space: Similar a facebook, myspace.com es un sitio web de interacción social formado por perfiles personales de usuarios que incluye redes de amigos, grupos, fotos, vídeos y música.

OpenSource: (fuente abierta) hace referencia a cualquier programa cuyo código fuente sea accesible mediante una autorización (o una fórmula como el dominio público) que permita al usuario estudiar, cambiar y mejorar el programa y redistribuirlo de forma modificada o sin modificar.

Podcast: consiste en la creación de archivos de audio y de video y su distribución mediante un archivo RSS que permite suscribirse y usar un programa que lo descarga de internet para que el usuario lo escuche en el momento que quiera, generalmente en un reproductor portátil.

Post: se refiere a cada uno de los articulos o entradas de un blog.

RSS: formato de sindicacion de feeds. (ver feeds)

Sindicacion: (ver feeds)

Tag: a.k.a. etiqueta es una palabra clave asociada a un material informativo que describe ese material. Un mismo material puede tener varias tags y sirven para categorizar varios contenidos.

Tecnorati: es un motor de busqueda de blogs.

Trackback: enlace directo al post de un blog.

Vlog: (video-log) similar al blog y audiolog, pero utiliza archivos de video.

WebApp: es una aplicación que es accedida via web a través de una red. Estas estan hechas con diversas tecnologias, generalmente utilizan php, javascript y base de datos. Por ej, Webmails, Wikis, Weblogs.

Webcast: difusion de audio y video por internet via streaming.

WebOS: (web operative system) Escritorio web, sistema operativo. Es un proyecto que utiliza una aplicacion para administrar archivos y aplicaciones web en forma remota. Por ej, eyeOS, youOS.

Wiki: es un sitio web que puede ser editado por varios usuarios. Por ej, Wikipedia.

* a.k.a. (also known as) = "tambien conocido como"

Faltan algunos terminos mas pero creo que con eso van a tener suficiente.

Recursos | Layout amigable para el usuario

2008-03-31T16:53:00.004-03:00

En Deziner Folio, un magnifico recurso para crear layouts liquidos y amigables con el usuario. Permite cambiar el tamaño de fuente, incorporar acordiones, modificar el tamaño de la grilla, mostrar/esconder menues. Ver Demo.

Solamente debemos bajar un par de archivos en Javascript y un CSS. Luego modificamos nuestro HTML como esta especificado y podemos aplicarlo a nuestro diseño. Funciona con todos los navegadores mas conocidos. Si les interesa pero tienen dudas avisen nomas.

Ver Liquid Javascript Grid Layout en Deziner Folio.

Tutoriales | Sistema de usuarios con PHP y MySQL

2008-03-31T16:39:00.004-03:00

Como diseñadores quizas nos interese mas el aspecto grafico y estetico de nuestra web y solemos dejar de lado puntos clave en el desarrollo de un proyecto. Somos reacios a organizar la informacion, dedicar tiempo al posicionamiento y accesibilidad de nuestras web... ni hablar de la programacion!

Sin embargo es importante afrontar la realidad y darse cuenta que tarde o temprano vamos a lidiar con algunas de estas actividades. Y sin lugar a dudas algo con lo que vamos a tener que lidiar es realizar un sistema de usuarios.

Para los que necesiten -por cualquier motivo- llevar a cabo esta tarea, les dejo un tutorial de como hacer un sistema de usuarios mediante PHP y MySQL, de la mano de Sector Web.

Utilidades | Imagenes emergentes con lightbox

2008-03-30T17:27:00.005-03:00

Lightbox es un script que permite visualizar imagenes en un sitio web sin necesidad de usar popups. Probablemente hayan visto varias webs utilizando este complemento.

Cuando hacemos clic sobre la miniatura de la imagen, la pantalla se oscurece y se abre la imagen en tamaño real en la misma ventana. Para utilizarlo debemos pegar un codigo en el html, modificar el archivo CSS y adjuntar un par de archivos en la carpeta de nuestro diseño.

Algunos links para ver las demos y bajar los archivos:

Utilidades | Photoshop Online

2008-03-30T16:42:00.001-03:00

Por fin salio la version online del editor de imagenes mas famoso del mundo. Luego de meses de espera, Adobe anuncio el lanzamiento de Photoshop Express, la version online del fetiche por excelencia de cualquier diseñador. Ademas de incorporar las herramientas mas frecuentes de la version estandar, Photoshop Express permite crear galerias y un espacio gratuito de 2 Gb para guardar tus trabajos. Eso si, requiere Flash Player 9.

Estan invitados a probarlo:

Photoshop Express

Utilidades | Acortar direcciones web

2008-03-29T23:48:00.003-03:00

Este dato me lo paso Agus:

Se van a dot.tk e ingresan el nombre de URL con terminacion .tk que les gustaria tener.
Eligen "dominio gratis"
Ingresan el URL del sitio web que quieren acortar
Siguen los pasos del asistente hasta finalizar

Resultado:

Al dirigirse a tudominio.tk este te redirecciona a la URL del sitio original sin perder el nombre de dominio anterior.

Por ejemplo: http://multimedius.blogspot.com = http://multimedius.tk

Visitar Sitio

Recursos | Efecto de revista en Flash

2008-03-29T23:25:00.004-03:00

Probablemente ya conozcan el Pageflip: ese efecto que utilizan en muchos sitios para mostrar sus portfolios, emulando una revista donde podemos pasar las paginas con el mouse. Cuando se convirtio en boom, muchos abusaron de este "juguetito" pero si es utilizado con mesura suele quedar muy bonito.

En esta ocasion queria mostrarles FlashPageFlip, que es una version alternativa mas simple de utilizar con respecto al primer Pageflip.

A diferencia de su contrapartida open source, este modelo permite utilizar herramientas como slideshow, zoom, sonido y encajar en pantalla. Simplemente debemos bajar el archivo zip y agregar las fotos o swf que formaran parte de la revista en la carpeta que corresponda y modificar el archivo XML que indica la ubicacion de los archivos.

UItilidades | Galeria de fotos con Flash y XML

2008-03-28T18:41:00.004-03:00

Autoviewer es un visor de imagenes en flash muy piola. Simplemente elegimos las fotos que nos gustan, editamos el archivo XML indicando la ubicacion de las imagenes y una descripcion para cada una. Las imagenes pueden pasar automaticamente como un slideshow o pueden detenerse. Ver Demo

Desde el sitio oficial pueden descargar Autoviewer y utilizarlo para sus propios diseños.

Ocio | Ilusiones opticas estaticas...

2008-03-28T18:20:00.006-03:00

Observen la siguiente imagen con cuidado... ¡Se esta moviendo!

(Visto en Blogotote)

Vale la pena aclarar que el formato de la imagen es un .JPG comun y corriente. Es simplemente una imagen que engaña nuestra percepcion y nuestro cerebro tiende a interpretar las variaciones como una imagen en movimiento.
El diseño es muy interesante para analizar: si se fijan es la misma "almendra" una al lado de la otra con una evolucion en la variacion de su angulo.

Otro ejemplo:

(Visto en Desvariando)

Si bien no son una novedad queria compartirla con ustedes y proponerles tener en cuenta estos engaños de la percepcion para lograr algun diseño creativo.

Tutoriales | Diseñar con CSS II

2008-03-27T13:03:00.006-03:00

Parece ser que el mayor inconveniente que se planteo por parte de todos nosotors es la maquitacion mediante CSS. A primera vista parece ser muy complicado y, aunque es muy amplio, diseñar con CSS no es imposible si nos subimos las mangas y nos animamos a probar por nuestra cuenta.

Recomendaciones:

Antes de empezar a diseñar recomiendo tener algunas nociones de XHTML y conocer algunas diferencias con HTML. En W3C hay una lista de preguntas frecuentes sobre HTML y XHTML.

Si ya conocemos como funciona el CSS y sus ventajas entonces vamos bien encaminados para programar.

Conocer y repasar selectores, propiedades, valores, etc. de CSS. Guia de referencia rapida de CSS2.

Analizar el codigo xhtml/css de un template (plantilla) diseñado en CSS e intentar reproducirlo. En lo posible empezar con un diseño muy basico.

Explicar como diseñar un sitio en CSS no tiene sentido porque existe una enorme cantidad de tutoriales en internet que explican como hacerlo. Incluso seria hipocrita de mi parte ya que yo tambien estoy aprendiendo... lo que puedo ofrecer es hablar desde mi experiencia y comentarles como me fue.

Un metodo posible:

Escribimos el contenido de la web en un documento HTML como si escribieramos en un procesador de texto. No coloquemos ningun estilo aun.
Encerramos los encabezados entre las etiquetas de header (<h1>, <h2>, <h3> segun corresponda). No se olviden de cerrar las etiquetas de header.
Armamos los contenedores para el contenido utilizando las etiquetas <div>. Vamos anidando todas las div segun su jerarquia. Esto significa que a la parte del contenido que funciona como cabecera de la web, le vamos a colocar una etiqueta <div> al comienzo y cerramos la etiqueta al final. Por ejemplo:
<div >Esta es la cabecera de la pagina </div>. Hacemos lo mismo con el texto principal, el menu, el pie de pagina, etc.y anidamos las div si es necesario.
Identificamos cada contenedor con un nombre. Esto se puede hacer utilizando los parametros ID o CLASS dentro de la etiqueta DIV. Por ejemplo: <div class="cabecera">Esta es la cabecera de la pagina</div> .
Creamos la hoja de estilo y colocamos los parametros para cada contenedor que identificamos. Por ejemplo, si queremos que la cabecera mida 700 pixeles con fondo rojo colocamos lo siguiente: .cabecera {width: 700px; background-color: red;}.
Vinculamos la hoja de estilo y aplicamos. Dentro de las etiquetas HEAD de nuestro html establecemos la relacion con el archivo css. Por ejemplo: <link href="estilo.css" rel="stylesheet" type="text/css" />

Es una de las formas que probe y funciono. Tambien pueden modificarse etiquetas de html. Obviamente esto es muy basico, solamente para que entendamos como funciona pero no es la unica manera de hacerlo y, por supuesto, esta muy incompleto. Pruebenlo por su cuenta, es simple. De yapa unos links:

Tutoriales
Tutorial para principiantes (LEANLO, OBLIGATORIO)
Manual de CSS (muy completito y facil)
Curso de CSS (breve, conciso pero piola)
Componer un diseño de 3 columnas en XHTML y CSS
Introduction to CSS (manual muy practico en ingles)
Tutoriales de CSS y Javascript de Cristalab

Utiles
Guia de referencia rapida CSS
Generador de CSS
Definicion Wikipedia de CSS
Diferencias xhtml/html (de wikilearning)
Probar fuentes CSS
Trucos y Sugerencias para css
CSS LAB (laboratorio CSS - Excelente)
Sky CSS tools (editor de CSS online)
Simple CSS (otro)
CSS Fly (editor online de Html y Css)
HTML Playground (otro editor online)

Inspiracion/Templates
CSS Mania (diseños muy lindos)
CSS Garden (galeria y sabiduria CSS)
Camaleon CSS (similar a CSS garden)
Open Source Web design (templates open source)
OpenWebDesign
CSS Tinderbox
Css Showcase (galeria de menues en CSS)
30 Templates de 3 columnas
42 Layouts en css

Y no dejen de ver recursos, tutoriales y ejemplos de CSS en este blog.

Articulos | La web mas fea del mundo

2008-03-25T16:42:00.006-03:00

¿Es apropiado calificar a un diseño como "bueno" o "malo"? ¿La belleza de un diseño es proporcional a su exito? Confundir un sitio "feo" con uno malo suele ser un grave error y considerar un sitio como "malo" puede ser un acto infantil y subjetivo.

Ciertas cuestiones personales -como el gusto propio- nos llevan a exclamar frases como "este sitio es feo" y, aunque existen rasgos generales que hacen a las tendencias y al buen gusto de la sociedad, quizas estamos dejando de lado algunas otras cuestiones de lado. ¿Quien considera que la pantalla roja con letras blancas mayusculas de Cronica TV es bonita? ¡Sean sinceros! Sin embargo, todos sabemos identificar ese estilo con el canal de television mas visto de Argentina. En todo caso, la pantalla roja es es el rasgo mas caracteristico de Cronica.

Si bien es dificil resistirse a la tentacion, podria considerarse mas adecuado reemplazar los adjetivos bueno/malo por "este sitio es mas (o menos) efectivo" o "cumple (o no) con sus objetivos". ¿Que objetivos? ¿La fealdad puede estar relacionada con el objetivo? ¿Puede un sitio ser popular por ser feo?

Creo con total seguridad que encontre la web mas FEA del mundo: http://havenworks.com/
Y aunque no se apega a ninguno de los "canones" del diseño, el sitio recibe miles de visitantes por dia, aumento su popularidad considerablemente y tiene un puntaje de 3547 en Digg.

La mejor parte es que el sitio se jacta de su pobreza:

!-! Nominated for Most Poorly Designed Website in the World by Digg.com and "El peor diseño del mundo" by elMundo.es
Website Web Design: Web Design by Hermit ;-)

¿Que opinan? ¿Cual es el sitio web "mas feo" que vieron?

Tutoriales | Hacer un texto 3D en Photoshop

2008-03-24T20:52:00.007-03:00

Ultimamente son cada vez más los sitios que utilizan tipografías en 3D en sus diseños y hay que admitir que algunos se ven muy atractivos. Existen diversas maneras para crear un texto en tres dimensiones... ya sea con programas como Blender o 3D Max los resultados pueden terminar en un producto agradable a la vista. Esta vez vamos a ver como crear un texto 3d en Photoshop.

1. Escribir el texto
Para lo que vamos a usar la herramienta de texto (T) de la manera convencional.
2. Rasterizar el texto y perspectiva
Hacemos clic derecho sobre la capa de texto y sobre "Rasterizar texto". A continuación cambiamos la perspectiva del texto (Ctrl+T) hasta conseguir la forma deseada.

3. Duplicar y mover la capa.
Duplicamos la capa del texto rasterizado (Ctrl+J) y movemos la capa con las teclas de dirección del teclado -por ejemplo, una vez abajo y otra a la derecha. Repetir esta operacion varias veces.

4. Cambiar el color de la ultima capa
Una vez que tenemos el grosor deseado, cambiamos el color/brillo de la ultima capa que seria la cara frontal del texto 3D. Esto se puede hacer de muchas formas.. una de ellas es ir a Imagen/Ajustes/Tono-Saturación. Si todo salio bien deberia verse asi:
5. Toque final
Va tomando forma ¿verdad? Ahora solo resta hacer las decoraciones complementarias hasta que quedemos satisfechos con el resultado.
En You are the designer hay una coleccion de diseños en 3D muy creativos y bellos para buscar inspiracion.

Tutoriales| 20 tutoriales para crear tu propio juego en Flash

2008-03-24T17:13:00.000-03:00

En DezignerFolio hay una recopilacion de 20 tutoriales para hacer tu propio juego con Flash... lamentablemente esta en Ingles. Sorry Folks!

Utilidades | ¿Cual es tu puntaje en SEO?

2008-03-24T16:58:00.000-03:00

Website Grader es una herramienta que sirve para comparar el posicionamiento de tu web con respecto a tus competidores. Para ello solo hay que colocar el URL de tu web, agregar otros datos adicionales y Website Grader elabora un analisis detallado de SEO (Optimizacion en Buscadores) que dara como resultado un puntaje de 1 a 100.

Simplemente otra joyita para tener en cuenta al momento de pensar en posicionar una web.

Articulos | Ganar dinero durmiendo..

2008-03-24T15:25:00.001-03:00

Asi como lo leen... se puede ganar plata desde la cama. O por lo menos eso dice Yde Van Deutekom, un pibe de 22 años que vive en Holanda y ya supera los 12000 Euros ganados desde su habitacion.

Desde su sitio Sleeping Rich podemos verlo via webcam y hacer actividades como dormir, comer y ver television.

Ahora bien, ¿como gana dinero? La respuesta es publicidad y donaciones, nada mas. En su web podran ver chivos de marcas reconocidas como Lego, Microsoft, Ebay y Mac.

¿Novedoso? No.¿Util? Para nada ¿Rentable? Totalmente. ¡Dulces sueños!

Tutoriales| Blogger con dominio .com.ar

2008-03-21T14:49:00.002-03:00

Desde que abri el blog me hice una pregunta existencial: ¿es posible cambiar midominio.blogspot.com por midominio.com.ar? A simple vista es imposible ya que no conozco el DNS de Blogger ni la configuracion para delegar el dominio en nic.ar.

Sin embargo, leyendo el blog de minitutoriales encontre una solucion para mi problema: Un tutorial que explica, paso a paso, como delegar tu dominio de Blogger y crear tu dominio personalizado.

Aun no probe hacerlo pero segun dicen funciona bien aunque el proceso es largo.

Ver Enlace

Utilidades | Diseñar con grilla

2008-03-21T14:01:00.004-03:00

Como sabemos, la grilla (o reticula) es una herramienta basica para cualquier diseñador porque permite la organizacion coherente del contenido e imagenes, teniendo en cuenta el objetivo principal de un diseño.

Aca les dejo una pequeña recopilacion de herramientas para diseñar con grid:

Design es una suite de herramientas orientadas al diseño web que puede utilizarse online sobre cualquier sitio web. Para utilizarlo debemos cargar una URL y luego iniciar el widget que guardamos previamente en nuestros marcadores. Entre las herramientas contamos con una grilla, regla, medidor de unidades y una mira que permite dibujar sobre el diseño. Realmente bueno, pruebenlo!

Grid Calculator es un generador de reticulas en el que debemos ingresar el tamaño de la fuente, el numero de columnas, el ancho de columna y de espaciado y podremos descargar una grilla hecha a nuestra medida.

Grid Generator es otro generador similar al anterior... es bueno contar con alternativas.

Grilla generica que sirve para los diseños mas frecuentes de la web. Descarguen la imagen y pueden utilizarla de fondo en Dreamweaver.

BluePrint CSS es un generador de grillas CSS. Nosotros le damos los valores y el generador nos permite descargar el css.

DesignbyGrid es quizas el mas importante. Se trata de una galeria de diseños inspiradores totalmente realizados con grilla. Ademas publican una infinidad de tutoriales y cuenta con varias herramientas para ayudarnos en nuestros propios diseños.

Ademas de todo esto recomiendo utilizar la grilla para observar y analizar muchos de los diseños que vemos a diario. De esta manera vamos incorporando la reticula como una herramienta natural que nos ahorra tiempo y esfuerzo.

Tutoriales | Diseñando con CSS

2008-03-18T15:22:00.000-03:00

Me da la sensacion que estando a punto de terminar la carrera hay muchos que estan preocupados porque no tenemos conocimientos solidos en CSS y sobre todo en cuanto al diseño y maquetacion de una pagina web.

Diseñar con tablas solo traeria dolores de cabeza sin contar los problemas de accesibilidad y estandarizacion (W3C). Como profesionales deberiamos conocer en profundidad como se debe diseñar un sitio completamente en CSS.

Les dejo una Guia para CSS que muestra, paso a paso, la construccion de un sitio web completamente diseñado en CSS.

Enlaces:

Manual CSS en castellano
Manual original en ingles

Novedades| Pixelations Visual Tour 2008 en Cordoba

2008-03-18T15:20:00.004-03:00

2. 3 y 4 de mayo
Viviendo Paradigmas

AUDITORIO PRINCIPAL - “PABELLON ARGENTINA”
Córdoba Capital

Chicos, se viene el 4to. Encuentro Pixelations Visual Tour, un espacio para diversas disciplinas del Diseño, con nuevas presentaciones de proyectos, conferencias, debates, demostraciones, declarado de Interés Cultural y Educativo.

Para Mayor informacion visiten la pagina oficial de Pixelations Visual Tour 2008

Programas | Construye modelos 3D con Google

2008-03-18T13:53:00.006-03:00

Asi es, Google se viene con todo... ¿prestaron atencion a la cantidad de herramientas que ofrece ademas del buscador y correo electronico? Ahora tambien podemos realizar diseños en 3D con Google SketchUp.

SketchUp es un programa gratuito que permite construir nuestros modelos en tres dimensiones y como si fuera poco podemos subirlo a Google Earth utilizando coordenadas reales.

El software es muy sencillo de usar y permite exportar los diseños en diversos formatos entre los cuales se encuentran (en la version Pro) los formatos OBJ, XSI, VRML, 3DS, PNG, JPG entre otros.

Utilidades | Aspecto en otros monitores

2008-03-18T01:43:00.003-03:00

Estamos muy acostumbrados a diseñar nuestras paginas para una o dos resoluciones, sin embargo, con el advenimiento de otros dispositivos y lel mayor consumo de notebooks (cada vez mas accesibles) es necesario plantearse seriamente si todos nuestros proyectos merecen funcionar en pantallas de 1024 x 768 o requieren otro tamaño.

Para ello existe una herramienta online que nos permite visualizar nuestras web con diferentes resoluciones. Simplemente debemos introducir el URL de nuestro sitio y especificar una resolucion y observaremos los resultados de manera instantanea.

Tutoriales | Como hacer un FavIcon

2008-03-18T00:28:00.004-03:00

Para empezar vamos a aprender como se hace y como colocar un FavIcon en nuestro sitio web. Pero primero lo primero, ¿que es un FavIcon?

Un FavIcon (Fauvorite Icon) es simplemente un Icono que se situa junto a la direccion de una pagina web. Son esos dibujitos que aparecen cuando guardamos una URL a nuestra lista de favoritos/marcadores.

Ahora si, ¡Manos a la obra!

Paso 1: Diseño del icono
Para diseñar el icono de Multimedius ultilizamos Photoshop aunque puede hacer la misma tarea basicamente en cualquier editor de imagenes. El icono debe conservar las siguientes propiedades:

16 x 16 pixeles
En lo posible fondo transparente (excluyente)
Extension PNG (luego lo transformaremos en ICO)

Paso 2: Convertir la imagen a icono
Una vez que terminamos de diseñar el Icono lo guardamos a formato PNG (si tiene transparencias) y convertiremos el archivo a .ICO con algun conversor como ConvertIcon. ¡Ojo! No es lo mismo cambiarle la extension al archivo, eso no funciona.

Paso 3: Insertar el codigo HTML en nuestras paginas
Si ya tenemos nuestro archivo .ICO lo subimos a nuestro dominio mediante FTP. Luego editamos nuestras paginas web y agregamos el siguiente codigo dentro de las etiquetas HEAD:

<link rel="shortcut icon" href="http://www.tudominio.com/favicon.ico" > (*)

(* colocar el directorio donde se encuentra el archivo.ICO)

Guardamos y subimos las paginas a nuestro dominio. Si todo salio bien deberias ver tu propio icono en la barra de direcciones de tu navegador.

NOTA: En algunos navegadores como el Internet Explorer puede ocurrir que no aparezca el favicon.

La Metro | Nuevos horarios de Cursado

2008-03-17T23:43:00.003-03:00

Damas y caballeros, al fin empezamos este año lectivo y aquí están los nuevos horarios de cursado:

Martes:
19:35 (D.M.III)

Miercoles:
16:30 (Téc. AV II)
19:35 (MKT Digital)

Jueves:
18:00 (Psicología)
19:35 (Comercio electrónico)

Viernes:
19:35 Programación III

¡Que todos tengan un buen año!

La Metro | Fechas de examenes

2007-12-07T15:47:00.000-03:00

Estimados compañeros, aca les dejo las fechas de examenes para este turno. Recuerden que si van a rendir este martes tienen tiempo hasta hoy viernes para inscribirse al examen.

Fecha	Hora	Materia
Mar 11/12/07	10:00	Guión Multimedia
Jue 13/12/07	14:30	Técnicas AV I
Vie 14/12/07	15:00	Programación II
Mar 18/12/07	12:00	Dis. Interfases II
Jue 20/12/07	11:30	Aplicaciones II

¡Y suerte en los examenes!

Novedades| Hagamos algo para fin de año!

2007-11-30T21:23:00.000-03:00

Lo que esperabamos hace bastante se hizo presente... ¡Llegaron las vacaciones! ¡Adiós carpetas, prácticos y entregas! Eso es lo que trae de bueno terminar el año. Sin embargo, nosotros no nos vamos a ver hasta dentro de algún tiempo y probablemente nos extrañemos un poco... ¡MINGA QUE LOS VOY A EXTRAÑAR, MANGA DE PEREJILES!!! (perdón por el exabrupto).

En fin, estabamos pensando en hacer una juntada con la gente del curso y creo que esta es una buena oportunidad antes de que todos nos vayamos por ahi a beber daikiris en la playa. Podríamos salir de pachanga una noche, comer pizzas por ahi o jugar un bowling... pero ya que el profesor de Aplicaciones ofreció su casa para un asadito (assadum chimichurris) considero que es la propuesta más real. Quien tenga el numero de su casa que se encargue de arreglar los detalles asi combinamos un dia de la siguiente semana para vernos las caras nuevamente. Si surge otra idea haganla saber. Y bueno,

¡Felices Vacaciones para todos!

Novedades| Curso de PHP gratuito

2007-11-22T10:41:00.001-03:00

Recientemente me llego un mail de la gente de desarrolloweb.com, donde me invitan a participar de curso en vídeo a través de Internet, de introducción a la programación Web con PHP.

Este curso tendrá una duración de 2 días, y se distribuirá en formato vídeo a través de un servidor privado al que sólo tendrán acceso las personas que se registren en el curso. El costo real del curso es de 67 Euros pero es gratuito para quienes se inscriban (sorry si suena a publicidad de Sprayette pero mi deber es informar).

Pueden registrarse desde este enlace: http://www.aulaformativa.com/registro y quienes estén interesados pueden iscribirse y participar de este curso que se llevará a cabo el próximo Lunes 26 de noviembre.

El cupo es limitado.

Utilidades| Medir el tiempo de descarga de tu web

2007-11-13T22:01:00.002-03:00

Pingdom Tools es una herramienta muy piola que sirve para calcular el tiempo de descarga de un sitio web completo.
Simplemente con ingresar un URL, esta utilidad hace un desglose completo por archivos y sus tiempos de descarga. Si son algo "freaks" de los tests y optimizacion de archivos los invito a conocerlo.

Utilidades| Panoramas 360 en Flash

2007-11-13T21:42:00.000-03:00

360PanViewerPRO es un componente para flash que sirve para crear panoramas en 360 grados. Una vez instalado, simplemente hay que arrastrar el componente al escenario y configurar la foto que queremos utilizar.

Entre algunas de sus características podemos mencionar que es compatible con XML, soporta zoom de imagenes y permite agregar Hot Spots de manera dinámica.

Les dejo el link para descargar el componente desde rapidshare. Que lo disfruten!

Articulos| Enfermedades del color

2007-11-06T18:51:00.000-03:00

Se dice que un 10% de la poblacion masculina sufre de ceguera a ciertos colores. La enfermedad más común es la Protanopia y quien la padece tiene problemas para percibir los colores rojos y verdes.

Un diseñador web responsable se involucra con el diseño para que sea accesible a la mayor cantidad de usuarios posibles. Es por eso que pasamos horas haciendo pruebas de accesibilidad, compatibilidad con navegadores y pensando en las mejores estrategias de posicionamiento. ¿Pero qué hay de ese 10%? ¿Qué sucede con aquellos usuarios con monitores de bajo contraste? ¿Pensamos en ellos?

Si les interesa pensar en ellos, les dejo dos herramientas que les pueden ser de utilidad:

COLORBLIND WEB PAGE FILTER: permite ingresar un URL, escoger un tipo de ceguera de color
y genera una pagina con el filtro indicado.

COLOUR CONTRAST CHECK: herramienta que evalua si el color frontal y el color de fondo hacen un buen contraste o no.

Herramientas para tener en cuenta si pensamos en nuestros usuarios...

Tutoriales| Efecto lupa con Flash

2007-11-06T18:39:00.000-03:00

Si no ven un pomo (como diría mi abuela) probablemente necesiten anteojos o en su defecto una buena lupa. ¡Y qué mejor que tener una lupa en pantalla!

Para quienes quieran conseguir el efecto de lupa para Flash, les dejo algunos tutoriales que explican muy bien cómo lograrlo:

Utilidades| Vectoriza tus imagenes online

2007-11-06T18:23:00.001-03:00

Vector Magic es una alucinante herramienta que nos permite vectorizar una imagen de manera simple, gratuita y online, con resultados asombrosos. Simplemente subimos nuestra imagen (grafico, logo, foto), realizamos algunos ajustes y el programa se encarga de vectorizar rápidamente.

Si el resultado nos complace, simplemente seleccionamos el modo de descarga: EPS, SVG o PNG.

Utilidades| Generador de CSS

2007-11-01T22:10:00.001-03:00

CSS Builder es una herramienta que nos permite generar el código CSS de una manera sencilla. El funcionamiento consiste en elegir o crear una etiqueta que deseemos aplicar un estilo y simplemente le damos los parametros necesarios. Una vez terminado este proceso, pulsamos un botón y el código se genera de forma automática para que lo insertemos en nuestra hoja de estilo. Ideal para laburar de manera simple, prolijo y rápido.

Recursos| Más de 800 pinceles para Photoshop

2007-11-01T21:57:00.000-03:00

Luego de un breve "cuelgue" volvemos a encontrarnos por aqui nuevamente... es raro porque algunos me dicen que me cuelgo mucho para escribir y otros que actualizo tan seguido que no alcanzan a leer lo anterior, jaja! Ponganse de acuerdo, gente!

En fin.. quiero retomar con un gran aporte realizado por el siempre magnifico Eze, que nos pasa esta excelentisima colección de brushes para Photoshop. Tienen de todos los gustos y sabores, ya me instale varios y debo decir que tienen una gran calidad. Algunos ejemplos:

Tambien quiero recomendar el link que paso Agus para hacer el kamehameha en After Effects. Veanlo, esta muy bueno. Ahi se ven, vatos!

Trucos| Cambiar el cursor del pincel en Photoshop

2007-10-27T12:49:00.000-03:00

Si son usuarios de Photoshop y además amantes de los pinceles se deben haber encontrado con este problemita alguna vez. Cuando eligen la herramienta de Pincel (B) y el cursor se transforma en una cruz en lugar del pincel común, es porque hemos seleccionado el pincel preciso.

Posiblemente esto se deba a que tenemos activada la tecla Bloq. Mayus (o Caps Lock) de nuestro teclado asi que si la desactivamos deberíamos alternar el pincel a su estado normal.

De la misma manera podemos elegir los tipos de cursores para los pinceles y otras herramientas entrando a Edición/Preferencias/Cursores.

Tutoriales| Rayos de luz en Photoshop

2007-10-26T21:04:00.000-03:00

Algo que se esta viendo mucho en fondos de pantalla y queda muy bien para hacer diseños cool son aquellos haces de luz que salen de algún costado. Para empezar a hacerlos debemos tener en cuenta el manejo de ciertas herramientas que vemos a continuacion:

1. En una capa hacer un degradado radial.
Seleccionamos la herramienta de degradado (G) y elegimos la opción de degradado radial. Es conveniente que el degradado sea entre dos colores similares, yo elegi hacerlo con el #026583 y #0088c2 pero haganlo según lo que necesiten.

2. Entrar en el Editor de Degradado y seleccionar tipo Ruido.
Dentro del editor seleccionamos Ruido en el tipo de degradado y haciendo clic en Aleatorio surgen distintas combinaciones de degradado. No se preocupen por el color porque no van a afectar al resultado final. Damos Aceptar.

3. En otra capa hacemos un degradado de angulo.
Para ello creamos una capa nueva y aplicamos el degradado. Recomiendo que se haga desde el borde superior hacia afuera de la composicion para que quede algo asi:

4. Aplicar Luz suave.
En modos de fusión (por defecto "normal") seleccionamos Luz suave y voila'! Deberia quedar algo asi:

Quedo bueno, ¿verdad? Ahora imaginenlo con unas nubes y los rayos saliendo entre medio de ellas. ¡Prueben!

Utilidades| Cobrar publicidad en tu web

2007-10-20T15:10:00.000-03:00

TLA es un sistema de publicidad en la web donde ellos actúan como intermediarios entre la compra y venta de links para los interesados en poner publicidad en una web y aquellos que quieren ganar algun dinerillo con eso.

En el sitio existe una herramienta para calcular el precio de los anuncios en dólares según ciertas propiedades como su ubicación en el diseño, PageRank, etc.

Sólo indicamos una URL, la categoría a la que correspondería nuestra web, la cantidad de publicidades que se venderán, la ubicación dentro del diseño y si la publicidad de se colocará en una sóla página o en todo el sitio.

Los factores que tiene en cuenta para calcular el precio de la publicidad son:

El tráfico de tu web
La popularidad del sitio
El tema que trata
La exclusividad de publicidad
Ubicación en el diseño

Para quienes se interesen en el tema pueden ver un post de PuntoGeek que explica un poco mejor cómo funciona este sistema.

Articulos| Cuanto cobro?

2007-10-20T14:44:00.000-03:00

Por lo hablado en clase, parece ser que hay muchos que están preocupados por saber cuánto cobrar en nuestra área de trabajo. Aunque cada proyecto tiene sus propias características y por lo tanto, su propio costo, podríamos discutir durante horas acerca de cuál sería un precio razonable para nuestras horas de trabajo.

Sin embargo, existe un sitio donde podemos saber cuánto están cobrando otras personas en relación de dependencia por el mismo trabajo. Se trata de una comunidad donde los usuarios comparten el monto de sus sueldos y colocan un puntaje según estén cobrando bien o no. Comparando los sueldos podemos saber si estamos cobrando bien o cuál es el sueldo en otros países ya que los sueldos se pueden filtrar por trabajo y por país.

Según un informe del sitio, un Project Manager está cobrando un promedio de $5700 en Argentina, mientras que un Desarrollador Web unos $2100 (mmmm...).

[Ver enlace]

Recursos| 70 recursos javascript

2007-10-15T13:21:00.000-03:00

Muy populares ultimamente como siempre, los scripts son pequeños programas, escritos en un lenguaje de programación muy conocido, que trabajan en la máquina del cliente (no desde el servidor) para que los diseñadores puedan optimizar (o a veces no) la experiencia de navegación.

Menues desplegables, carteles emergentes, scrolls internos, cambios de apariencia son algunos de los ejemplos de lo que puede desarrollarse con javascript y se potencian con CSS.

Hay una colección de 70 sitios con recursos javascript para diseñadores web que pongo a su disposición.

Tutoriales| Efecto Manga en Photoshop

2007-10-15T04:25:00.000-03:00

Manga es la palabra japonesa para designar a la historieta. Se traduce, literalmente, como "dibujos caprichosos" o "garabatos" y se la utiliza exclusivamente para referirse a la historieta japonesa.

¿Vieron esos dibujos japoneses donde los personajes tienen unos ojos gigantes y rasgos finos? Esos son manga.

Articulos| Top 20 sitios de ecommerce

2007-10-15T04:14:00.001-03:00

En tutorialblog hay una recopilacion de los 20 mejores sitios de ecommerce. Todos los sitios están muy bien diseñados y validados segun los estandares de W3C.

Un ejemplo de que pueden lograrse diseños usables, estéticos y encima ganar dinero. Ideal para buscar inspiracion para sitios de esta clase.

Materias| Resumen base de datos (programacion)

2007-10-15T03:54:00.000-03:00

SQL: STANDARD QUERY LANGUAGE
(lenguaje de base de datos)

La informacion en base de datos se organiza en niveles.
Campo: Cada unidad de informacion se llama "campo".
Campos clave: son campos unicos que permiten distinguir un dato del resto (por ej. DNI).
Registro: conjunto de campos (por ej. cada persona tiene dni, nombre,edad, etc)
Tabla: conjunto de registros.
Tablas auxiliares: tablas relacionadas con la tabla principal que almacenan codigos y datos.
Motor de base de datos: software que consulta la informacion guardada en base de datos (microsoft Access[.mdb], mySQL[más potente, admite más usuarios], sql server, oracle[mas segura]).

Motores más comunes:

PHP --> MySQL
ASP --> access, mysql, sql server.

Bloqueo: se ponen todos los procesos de la basede datos en espera hasta que se complete el proceso actual.
Indice: ordena los datos para ser buscados.

Utilidades| Cambia el tamaño de tus imagenes online

2007-10-15T03:53:00.000-03:00

Suele suceder (¿por que no?) que necesitamos cambiar el tamaño de una imagen y no queremos abrir el Photoshop para hacer una tarea tan simple o porque no disponemos de un programa de edicion de graficos en ese momento.

Una salida rápida es rsizr, una utilidad sencilla y agil para cambiar las dimensiones de nuestras imagenes desde la web.

Utilidades| Aprender idiomas es gratis

2007-10-15T03:40:00.000-03:00

Mango es una conveniente herramienta web para quienes no hablan inglés y desean ponerse al día con el idioma.

Se trata de una webapp muy bien diseñada que ofrece 11 cursos (portugues, polaco, español, aleman, frances, griego, italiano, japones, chino mandarin, latin y ruso) totalmente interactivos.

Es gratuito y solo requiere que ingreses tu email para registrarte. Ahora no tienen excusas para ver sitios en ingles...

Utilidades| Calibra tu monitor online

2007-10-15T03:14:00.000-03:00

Resulta que el otro dia estaba mirando unas fotos de alta calidad en un monitor LCD y cuando quiero verlas en un monitor comun me doy cuenta que se habian perdido muchos detalles en las sombras de la imagen. ¿Será que el monitor LCD tiene más brillo o es el resultado de una mala calibracion del monitor?

Como diseñadores nos vemos obligados a tener en cuenta ciertos aspectos que tienen que ver con el contraste, legibilidad, profundidad de color y accesibilidad. A simple vista parecen ser detalles pero es muy importante que no podemos descuidar.

Displaycalibration es una herramienta online que nos permite ajustar el brillo, contraste, resolucion y colores de nuestro monitor directamente desde internet.

DisplayCalibration.com |
Calibrate Your Computer Display Or Monitor Online For Optimal Viewing

Programas| Open Office

2007-10-15T02:38:00.000-03:00

Hay herramientas que no pueden faltar en nuestra PC y una de ellas es -sin lugar a dudas- una suite ofimática.

Hay que reconocer que MICRO$OFT OFFICE es la más popular pero no es la única solucion que permite realizar las tareas más comunes.

OpenOffice es un proyecto de software libre que viene con un procesador de textos, hoja de cálculos y soluciones para realizar presentaciones en pantalla, base de datos y diagramas. OpenOffice permite trabajar con las extensiones de los formatos más conocidos por lo que no tiene nada que envidiarles a sus equivalentes de licencia privada.

Es una herramienta poderosa, sencilla y gratuita que trabaja en varias plataformas y podes descargarla a tu computadora.

Tutoriales| Divs desplegables

2007-10-15T00:16:00.000-03:00

Estan muy en boga esos espacios con secciones plegables/desplegables que resultan muy utiles a la hora de maximizar el espacio en nuestros diseños sin necesidad de usar scroll o pasar a una página nueva. Si no saben a qué me refiero pueden ver un ejemplo.

En diarioTHC hay un buen tutorial que explica, paso a paso, como podemos lograrlo utilizando CSS y javascript.

Recursos| 375 Pinceles para Photoshop

2007-10-15T00:09:00.001-03:00

Para los que andaban pidiendo pinceles... Brown Thoughts realizo una recopilacion de 14 sets de pinceles para Photoshop con lo mejorcito que anda por ahi. En total son 375 pinceles para que puedan disfrutar.

Pinceles

Recursos| Pack de vectores

2007-10-14T23:56:00.001-03:00

Nunca viene mal una buena coleccion de vectores chetos para utilizar en nuestros diseños. Y mejor aun si son ¡Gratis!

Descargar

Recursos| 77 recursos para simplificar tu vida

2007-10-14T23:46:00.000-03:00

Damas y caballeros... niñas y niños... lo que ustedes estaban esperando, ¡Pasen y vean! Una fantástica recopilacion de Vandelay Website Design con 77 recursos que harán de sus vidas como diseñadores una maravilla. Encontrarán diversos materiales entre los que se encuentran:

Herramientas de color
Menues de navegacion con CSS
Fotografías y gráficos libres
Iconos
Templates
Testers y Validators
Scripts
Fuentes
Generadores
Y más, mucho mas...

Ver enlace

Articulos| Modelo de Brief

2007-10-14T23:21:00.001-03:00

Para quienes trabajan en agencias de diseño y publicidad, quizas les resulte familiar trabajar con Briefs como herramienta de trabajo para definir las caracteristicas de un proyecto. Pero ¿que es un Brief?

Se conoce como brief a la informacion que el cliente envía a la agencia para que genere una comunicacion. El brief no es algo estándar; cada empresa arma el brief que más le convenga.

Aquellos que se interesen por el tema pueden bajar un modelo de Brief desarrollado por la agencia No Borders Campaign y que puede ser de gran ayuda.

Utilidades| Contador de usuarios online

2007-10-14T15:47:00.000-03:00

Habran notado que en esta página existe un contador de usuarios online que visitan el sitio en tiempo real. Una cosa como esta:

Whos.amung.us es un servicio que nos permite colocar el contador de manera tan simple como pegar el código HTML que nos proporcionan:

<a href="http://whos.amung.us/show/inqjjc4a"><img src="http://whos.amung.us/widget/inqjjc4a.png" alt="who's online" width="81" height="29" border="0" /></a>

¡Y listo!

Recursos| Iconos y Wallpapers

2007-10-14T15:34:00.001-03:00

En pixelgirlpresents hay una gran coleccion de iconos y fondos de pantalla libres para personalizar nuestro escritorio. Ademas podemos encontrar tutoriales y articulos de diseño.

Visitar enlace

Recursos| Plugins para Photoshop

2007-10-14T14:57:00.000-03:00

Una recopilación gratuita de plugins para Photoshop.

Pack 1: Cybia Plugins

Es un conjunto de filtros mejorados con efectos de transparencia, color, contornos, granulado, etc.
Pack 2: Filter Factory

380 filtros con efectos variados y gratuitos.

Utilidades| Optimizacion de Motores de busqueda

2007-10-14T00:29:00.000-03:00

Algunas herramientirijillas para mejorar el rendimiento de tu web en los motores de búsqueda:

Backlink Anchor Text Analysis: determina los backlinks que hacen referencia a tu sitio y la linea de texto que utilizan.
Backlink Builder: Analiza los backlinks a tu web que tengan la misma tematica.
Backlink Summary: Resumen del backlink de un sitio y su competencia.
Check Yahoo WebRank: Importancia de una web en Yahoo y Google.
Domain Stats Tool: Estadisticas de un dominio.
Keyword Density Checker: Densidad de las keywords de una página.
Keyword Playground: Analiza las frases clave.
Keyword-Rich Domain Suggestion Tool: Sugiere una combinacion de palabras claves para una cierta frase.
Website Keyword Suggestions: Proporciona palabras clave.

Utilidades| Escanea imagenes y envialas por fax con tu celular

2007-10-14T00:17:00.000-03:00

ScanR es una utilidad en linea que te permite pasar una fotografia de una calidad aceptable (+ 2 MP) a un PDF en limpio. Está optimizado para imagenes extraidas de documentos, pizarras y tarjetas. El proceso seria el siguiente:

Lo más extraño es que es gratis... (por ahora)

Articulos | Manual de Flash Intermedio

2007-10-14T00:15:00.000-03:00

A modo de repaso -quizas- les dejo un manual de Flash de nivel intermedio con algunas nociones acerca Actionscript 2 y Flash en general.

Para versiones anteriores al Adobe Flash CS3 pueden descargar el manual en formato PDF.