Monday, July 20th, 2009
Richard Galvan, Gerente de Producto Flash de Adobe Systems pasa la mayor parte de su tiempo ayudando a clientes a encontrar la manera de expresar su imaginación y creatividad en la Web. Por esto nos acerca 10 tips sobre Adobe Flash CS4 Profesional.
1. Funciones muy “hot”
Se conoce como “Hot Text” cualquier campo que contenga medidas y en donde usted pueda hacer clic para arrastrar y cambiar las medidas. En todo Flash CS4, use los controles de “hot text” con estos dos atajos de teclado:
Command (PC: Ctrl): Cuando se usa al arrastrar “hot text”, se divide la sensibilidad por 10.
Shift: Cuando se usa al arrastrar “hot text”, se aumenta la sensibilidad por 10.
2. Cuando cada segundo cuenta
¿Alguna vez logró una animación tal y como la quería, solo para darse cuenta de que quedó un poco corta? Para extender una transición en la Línea de Tiempo sin modificar los cuadros actuales, mueva el cursor hacia el final de la transición hasta que vea un cursor de doble flecha. Entonces mantenga presionada la tecla Shift y arrastre el final de la transición hasta el tiempo deseado. Y listo. En serio.
3. Cuando tiene que hacer rebotar cientos de pelotas
Aplicar animación a objetos seleccionados nunca había sido tan rápido. Primero, seleccione un objeto. Mejor aún: son pequeños, así que seleccione varios. Luego escoja un nombre predeterminado en el panel Motion Presets y haga clic en Aplicar. Automáticamente, la posición actual del objeto se toma como la posición inicial de la animación, o también puede sostener la tecla Shift mientras hace clic en Aplicar para que la posición actual sea el último punto de la animación.
4. Sí, usted escucha voces
Libere el artista que lleva adentro. Flash CS4 ahora viene con una colección de muestras de sonido de Soundbooth. Para tener acceso a ellas en Flash, seleccione Window>Common Libraries>Sounds. Escoja entre una variedad de sonidos incluyendo ladridos y disparos y agréguelos fácilmente a su proyecto con solo arrastrar y soltar.
5. Los elementos pueden correr, pero no esconderse
Flash CS4 puede filtrar los elementos del catálogo. Si usted trabaja en proyectos con una enorme cantidad de elementos que manejar, entonces mantenga el catálogo (Library) abierto, y haga clic en el campo de búsqueda en la parte superior del árbol del catálogo y escriba las palabras clave o el nombre de archivo que necesita. Los elementos aparecerán fuera de las carpetas en una lista fácil de revisar. Presione Esc o haga clic en el botón Clear en el campo de búsqueda para regresar a la lista completa.
6. Encadénelo
La Configuración Automática del Punto de Transformación permite que el usuario coloque un “bone” en el lugar en el que suelta el mouse, al momento de crear una nueva armadura. Para una ubicación más precisa, primero use la herramienta Free Transform para determinar el punto de transformación en la ubicación deseada. Luego desmarque la herramienta IK Bone en la caja de Configuración Automática del Punto de Transformación (Preferences>Drawing Category). Ahora los “bones” se encadenarán en la ubicación del punto de transformación cuando sean dibujados.
7. ¿Necesita mover un solo hueso?
¿Desea editar un hueso (“bone”) en específico sin tener que re-crear la armadura completa? La ubicación de “bone” IK Shape puede editarse en el Cuadro 1 inmediatamente después de crear la armadura usando la herramienta Subselection. Solo haga clic y arrastre la cabeza o la cola del “bone” a una nueva ubicación. Para armaduras que fueron creadas con símbolos, ajuste el punto de transformación usando la herramienta Free Transform. Nota: Los “bones” solo deberían ser editados en el Cuadro 1 antes de agregar nuevos cuadros y/o poses. La edición de ubicación de “bones” en cualquier otro cuadro que no sea el Cuadro 1 puede darle sorpresas poco felices.
8. Todos los pájaros en un solo tiro
Flash CS4 también permite editar las propiedades de múltiples elementos en el Catálogo con un solo diálogo. Solo seleccione un conjunto de elementos en el catálogo y haga clic en el conjunto para que aparezca el diálogo de Propiedades. El diálogo ahora es lo suficientemente inteligente para mostrarle solo las propiedades comunes en la selección. Si usted escoge todas las imágenes, obtendrá todas las propiedades de esas imágenes en una sola caja de diálogo. Escoja múltiples símbolos y podrá establecer una relación y clasificación para ellos.
9. Una manera de mantener las promesas de Año Nuevo
Flash CS4 hace que organizar sus símbolos sea tan fácil como arrastrar y soltar. Solo mueva el símbolo creado recientemente a una carpeta existente o una nueva carpeta en el diálogo Create New Symbol. Mucho mejor: cuando arrastre símbolos sobre carpetas y sub-carpetas existentes, éstas se abrirán automáticamente.
10. ActionScript se vuelve verde, y recicla
Estas son algunas opciones para re-usar una animación en su documento con código. Usted puede asignar un nombre a una animación en el inspector de Motion Property, luego usar esta línea de código —tweenInstanceName.addTarget (mcInstanceName)—para aplicarla a otra instancia en su archivo FLA. Este ActionScript asigna la transición al nombre de la instancia tweenInstanceName a un video con la instancia mcInstanceName. O puede simplemente copiar la animación desde una transición como ActionScript—haga clic en la transición y escoja Copy Motion as ActionScript 3.0.
Tags: consejos, Flash, tips
Posted in Artículos, Destacados, Flash | No Comments »
Wednesday, June 10th, 2009
Uno siempre quiere agregar o modificar mas cosas de su sitio esperando optimizarlo de alguna forma. Una de las formas mas utilizadas, es aplicar SEO. Pero no todos sabemos de que se trata y por eso es bueno que gente como la de OnlineMoneyTutor nos de una mano en el tema.
Así nos listan 10 tips SEO que deberíamos tener en cuenta. Entre ellos veremos el uso de un sitemap (mapa del sitio), como crearlo, usar keywords, títulos, optimizar enlaces, elegir un buen dominio (de primer nivel) o aplicar la keyword como título de una imagen. No dejen de leerlo si quieren aprender sobre SEO. Si bien está en inglés, podemos recurrir de seguro a un traductor en línea.
Tags: consejos, SEO, tips
Posted in Artículos, SEO | No Comments »
Friday, May 29th, 2009
Alan Musselman es arquitecto de aplicaciones de Fireworks y nos brinda algunos consejos para conocer mas sobre este programa en su versión CS4.
1.- AUTOMATICE LOS PASOS REPETITIVOS
Cada vez que se realiza una acción en el lienzo, se genera un paso en el panel History (Window>History). Usted puede seleccionar estos pasos y hacer clic en el icono Save Steps As a Command en la parte inferior del panel para guardarlos y reutilizarlos en otros documentos. Escriba un nombre en el diálogo Save Command y haga clic en OK. El nuevo comando estará listado bajo el menú Commands y también podrá usarse durante la exportación de un conjunto de datos. (File>Batch Process)
2.- ENCONTRAR Y REEMPLAZAR
Encuentre y reemplace colores, fuentes y hasta URLs rápidamente usando el panel Find ubicado en Edit>Find (Command-F [PC:Ctrl-F]). Al reemplazar colores, note que Find and Replace no solo afecta tanto los trazos como los rellenos, sino que también puede cambiar los colores en los Live Filters (que se aplican por medio del inspector de propiedades), e incluso los gradientes.
3.- RE-UTILICE LOS ATRIBUTOS
Una función muy poderosa en Fireworks es la habilidad de añadir rápidamente el mismo estilo de diseño de un objeto a otros objetos en el documento. Esto podría ser dificultoso en otras aplicaciones porque usted tendría que re-aplicar cada propiedad una por una. Usted puede fácilmente copiar y pegar atributos a objetos nuevos o existentes con solo seleccionar el objeto y los atributos que le gustaría usar, de la siguiente manera: Vaya a Edit>Copy, seleccione el objeto al que quiere pegar los atributos y seleccione Edit>Paste Attributes. Esto mantendrá las líneas, el relleno y hasta las configuraciones Live Filter.
4. RECTÁNGULOS REDONDEADOS
Puede cambiar la redondez de un rectángulo en el inspector de propiedades desde porcentajes (%) a pixeles (px). Esto es de mucha ayuda cuando se diseñan columnas CSS y necesita saber la cantidad radial exacta de pixeles para cada esquina. Consejo adicional: Al dibujar un rectángulo en el lienzo usando la herramienta Rectangle (U) y antes de soltar el botón del Mouse, presione la tecla Up Arrow para añadir redondez o la tecla Down Arrow para reducirla. Suelte el botón del Mouse para crear el rectángulo redondeado.
5. REDIMENSIÓN VISUAL DEL LIENZO
Usted puede ampliar rápidamente el lienzo de su documento. Solo haga doble clic en el icono de la herramienta Crop (atajo: tecla C) en el Toolbox para ver los límites de corte de lienzo. Haga clic y arrastre alguno de los puntos de control de manera que el área de corte sea más grande que el tamaño actual del lienzo y presione Enter en el teclado para aplicar el nuevo tamaño.
6. EL PODER DEL PANEL DE TRAZOS (“PATH PANEL”)
El panel de trazos (Window>Others>Path) ofrece acceso a avanzadas funciones de vector que le harán más productivo al momento de realizar prototipos y diseñar Fireworks. Con un solo clic, usted puede aplicar operaciones comunes como Union y Punch, eliminando la necesidad de ir a los menús para escoger las opciones más comúnmente usadas. Por ejemplo, ¿alguna vez ha necesitado afinar una esquina de vector redondeado para hacerla en línea recta? Esto puede hacerse seleccionando los puntos de la esquina redondeada con la herramienta Subselection (A) y aplicando la opción Sharper Points en la sección Edit Points en el panel de trazos.
7. NAVEGUE PÁGINAS CON SOLO TOCAR UN BOTÓN
Para navegar fácilmente en sus páginas, use las teclas Page Up y Page Down en su teclado o use el menú Page en la parte superior derecha de la ventana del documento.
8. HAGA FLUIR TEXTO EN UN TRAZO
Seleccione un objeto de texto y un objeto de trazo cerrado, y luego seleccione la opción Text>Attach In Path: el bloque de texto se colocará dentro del trazo y seguirá los contornos del mismo. Esto es de mucha ayuda cuando necesita simular CSS y hacer flotar una imagen dentro de un bloque de texto.
9. ESTILOS GLOBALES
Cree, aplique o guarde un estilo directamente desde el inspector de propiedades. Haga clic en el icono New Style para crear un estilo. Este estilo se agregará al menú que aparece justo arriba de los iconos de estilo. Si usted modifica el estilo y el mismo ha sido aplicado a múltiples objetos, solo haga clic en el icono Redefine Style en el inspector de propiedades para actualizar todos los otros objetos que usan el mismo estilo. Esta es una función útil cuando es necesario relacionar otros estilos en el documento a un estilo en particular.
10. INTEGRACIÓN DE LA SUITE
Asegúrese de aprovechar la estrecha integración de Fireworks CS4 con las otras aplicaciones de Creative Suite. Estos son solo algunos ejemplos:
Dreamweaver: Copie una selección o un objeto en Fireworks y péguelo directamente en la vista de diseño de Dreamweaver.
Flash: Un símbolo de botón copiado de Fireworks y pegado en Flash mantendrá todos los estados del botón, incluyendo el estado de “hit”.
Photoshop: Un mapa de bits o una máscara de vectores creados en Fireworks se verán como una máscara editable en Photoshop si se salvan como PSD desde Fireworks.
llustrator: Abrir un documento Illustrator CS4 convertirá cualquier lienzo en Pages en Fireworks. Este es un efectivo flujo de trabajo cuando usted necesita hacer un prototipo o abrir elementos de diseño en Fireworks.
Tags: consejos, Fireworks, tips
Posted in Fireworks | 1 Comment »
Friday, May 29th, 2009
John Nack y Bryan O’neil Hughes son Gerentes de Producto de Adobe Photoshop y nos acercan varios tips para conocer mas sobre el manejo de la versión CS4.
1.- VISTA DE PÁJARO (También conocida como: Adiós Panel de Navegación)
Photoshop CS4 aprovecha el poder de su tarjeta de gráficos (GPU) para permitir panorámicas y acercamientos rápidos y suaves. Si usted está trabajando con documentos en alta resolución, pruebe hacer un acercamiento, luego mantener presionada la tecla H y al mismo tiempo hacer clic y mantener presionado su Mouse. Verá que Photoshop instantáneamente (y temporalmente) hace un alejamiento para mostrar el documento entero. Entonces puede cambiar de posición, usando el pequeño rectángulo bajo el cursor en forma de mano para ver lo que estará en pantalla cuando usted suelte el botón del Mouse. Es difícil de explicarlo por escrito, pero es muy interesante y poderoso en la práctica.
2.- SALTE DE UNA HERRAMIENTA A OTRA
Si usted acostumbra a cambiar de herramientas por medio del teclado, sabe que saltar temporalmente de ciertas herramientas a otras siempre ha sido posible. Mantener presionada la barra espaciadora muestra la herramienta Zoom, por ejemplo, y al soltarla usted regresa a la herramienta que estuviera usando antes. CS4 lleva este concepto a un nuevo nivel, permitiéndole saltar temporalmente desde cualquier herramienta a cualquier otra presionando y luego soltando el atajo de la otra herramienta. Por ejemplo, para saltar desde la herramienta Brush a la nueva herramienta Rotate View, solo mantenga presionada la tecla “R”, luego haga clic y arrastre el lienzo para rotarlo, luego suelte la tecla “R” para regresar a la herramienta Brush. La técnica es más fácil de usar que de describir, y aunque ahorra un clic a la vez, pruebe sumar el total de clics que puede ahorrar en un proyecto.
3.- CORTE CAPAS DE AJUSTE AUTOMÁTICAMENTE
Es posible que usted necesite usar ajustes de color no destructivos, pero prefiere que los ajustes se apliquen solo a una capa en lugar de a todas las capas por debajo. Siempre ha sido posible “cortar” las capas de ajuste para ocuparse de las capas una por una, pero ahora usted puede hacerlo automáticamente por omisión. Haga clic en el pequeño icono de “círculo-múltiple” en la esquina inferior derecha del panel de Ajustes para establecer las nuevas capas que desea cortar automáticamente.
4.- TRANSFORMACIONES DE PERSPECTIVA NO DESTRUCTIVAS
Los Smart Objects son una excelente manera de escalar, rotar y transformar capa de manera no destructiva. Antes de CS4, sin embargo, no era posible aplicar una transformación de perspectiva de esa manera. Con el nuevo lanzamiento, usted puede seleccionar un Smart Object, luego pasar al modo Free Transform y simplemente mantener presionada la tecla Cmd/Ctrl al tiempo que toma y arrastra la esquina del objeto. Si cambia de opinión más tarde, puede regresar al modo Free Transform y continuar editando la perspectiva como desee.
5.- CONVIERTA UNA CAPA EN UNA TARJETA POSTAL EN 3D
Además de los Smart Objects, Photoshop Extended ofrece otra manera de aplicar transformaciones de perspectiva de manera no destructiva: seleccione cualquier capa o capas, luego escoja 3D->Convert to 3D Postcard. Photoshop hará un mapa de su capa en un “espacio de tarjeta postal” 2D. Entonces puede usar las diferentes herramientas de manipulación de objetos 3D (K) y herramientas de cámara (N) para cambiar la orientación y apariencia de la capa. También puede probar a agregar luces por medio del panel 3D: una interesante técnica que puede usar aunque no esté usando la transformación de perspectiva.
6.- 3D: ENCUENTRE ÁREAS “PINTABLES”
Photoshop usa un modelo de pintura basado en proyecto, lo que significa que es necesario posicionar el objeto 3D paralelo a la pantalla para poder pintarlo apropiadamente. La configuración Preset (en el panel 3D) le mostrará la posición y resolución ideales en las que debe estar su modelo para aplicarle pintura. En este modo, las áreas blancas indican un posicionamiento óptimo y las rojas indican un posicionamiento poco ideal. La opción Paint Selection (en el menú 3D) seleccionará las áreas que están en la posición ideal para pintar.
7.- 3D: CAPAS QUE SE ESCONDEN AUTOMÁTICAMENTE
Para mejorar el desempeño cuando se interactúa con objetos 3D, usted puede encender esta opción para activar el dibujo directo en la pantalla (permitido por OGL). Esto esconderá temporalmente todas las capas por encima de la capa 3D mientras usted interactúa con el objeto 3D.
8.- PRE-CONFIGURACIONES Y MÁS PRE-CONFIGURACIONES
Además de liberar el poder de Capas de Ajuste, CS4 ahora permite cargar y guardar las pre-configuraciones de Levels, Exposure, Hue/Saturation y Selective Color. Así, usted no solo ahorra tiempo, sino que cuenta con 22 nuevas maneras de empezar a trabajar con solo sacar el software del paquete. Los archivos de pre-configuraciones son muy pequeños y fáciles de distribuir: para compartir los suyos, solo copie el archivo correspondiente de la carpeta Preset y distribúyalo.
9.- VIEJAS COSTUMBRES EN EL NUEVO DIÁLOGO DE CURVAS
La curvas siempre han sido la espina dorsal del ajuste de imágenes, y continúan haciéndose más poderosas y fáciles de usar. En CS4, el nuevo control On-Image del panel de Ajustes hace que los ajustes sean tan intuitivos como hacer clic en la imagen y arrastrar hacia arriba y hacia abajo; claro, algunos atajos en el teclado son muy valiosos a la hora de usar el control de ajuste On-Image:
* O (círculo de pre-visualización) = Libere el cursor sobre la imagen (¡NUEVO! En CS3 era necesario clic + arrastrar)
* Agregar punto solo a la curva activa = Clic en la imagen (¡NUEVO! En CS3 era necesario Ctrl/Cmd + clic)
* Eliminar punto en curva activa = Ctrl/Cmd clic en la imagen con valores de punto Entrada/Salida (El círculo de pre-visualización aparecerá sobre le punto en la curva) (¡NUEVO!)
* Seleccionar el siguiente punto en la curva = Presionar la tecla “+” (¡NUEVO! En CS3 era necesario Control + Tab)
* Seleccionar el punto previo en la curva = Presionar la tecla “-” (¡NUEVO! En CS3 era necesario Shift + Control + Tab)
* Cambio entre Canales = Opt/Alt + 2 al 9 (¡NUEVO! En CS3 era necesario Ctrl/CMD 1 al 9)
* Pre-visualizar corte = Punto Blanco/Negro + Alt + mouse sobre la imagen. (¡NUEVO!)
10.- AUTO-BLEND Y MUCHO MUCHO MÁS
Una función nueva en el control Auto-Blend de CS4 es la habilidad de diferenciar automáticamente entre un panorama y una pila de imágenes. Por supuesto, los panoramas son más precisos y se proyectan mejor gracias a los muchos cambios hechos a la auto-alineación, pero es el botón de radio de Stack Images el que realmente da el poder a la herramienta. Stack Images dibuja datos a partir de cuantas imágenes similares usted le provea, y la variada profundidad de campo puede iluminar efectivamente (pueden combinarse varias tomas hechas en poca profundidad de campo en una sola, todas enfocadas)… más inusual todavía es la habilidad de tener un fondo prominente y enfocado y un fondo enfocado con suave blur, que antes de CS4 era fotográficamente imposible. Por último, la función Seamless Tones and Colors ayuda a balancear la exposición entre las imágenes con diferentes focos.
Tags: consejos, Photoshop, tips
Posted in Destacados, Photoshop | 1 Comment »
Monday, March 30th, 2009
Que nuestro blog o sitio web cargue rápido, es un punto importante para cualquier proyecto. Si un sitio cuando entras tarda en verse, seguramente cerremos y busquemos lo que nos llevó hacia ahí en otro lado. Por lo menos eso hago yo. Por eso es bueno conocer de que formas podemos ayudarnos a que la carga sea lo mas corta posible.
En AdmixWeb crearon una lista con consejos para acelerar la carga de un sitio, explicados claramente y que van a ayudarnos a optimizar diferentes puntos de nuestro blog. Los temas tratados abarcan el código CSS, AJAX, cómo optimizar nuestras imágenes y el consejo de remover el código innecesario, entre otras cosas.
Tags: Carga, sitios web, tips
Posted in Ajax, Artículos, CSS | 1 Comment »
