Grupo Adobe Bolivia

En esta oportunidad vamos a mostrarte de la mano de Paul Trani, uno de los evangelistas mas importantes de Adobe como hacer un póster tipográfico usando Photoshop y Typekit

Han pasado 189 años. 189 largos años desde que hicimos esto.

Sabemos que has estado preparándote para ser mejor, sabemos que persigues tus sueños y que no importa lo lejos que te lleve la vida una parte de ti siempre permanecerá aquí.

Sabemos cuándo has estado peleando por esto toda tu vida, has luchado por hacer las cosas bien, has estado trabajado día y noche; aprendiste a convertir el dolor en una increíble fuerza de voluntad… Es así como un super héroe aprende a volar.

Queremos felicitarte, porque no importa cuánto tiempo pase, sabemos que no tendrás miedo de cometer errores o de tropezar y caerte. Porque la mayor parte del tiempo las mejores recompensas vienen de hacer las cosas que más temes.

Por eso para nosotros ya eres un SUPER HÉROE.

Eres ese alguien que hace de este país un lugar maravilloso, gracias por ser y estar…

Ahora queremos conocer tu historia publica un comentario con tu datos o escríbenos a adobebolivia@gmail.com, te haremos una entrevista y saldrás en un vídeo.

Dado que los usuarios actualizaron su Adobe Creative Cloud con las aplicaciones del lanzamiento 2014 van a ser recibidos con algo más que nuevas características ... las pantallas de inicio para sus aplicaciones favoritas también son nuevos y cuentan con obras de arte de inspiración de algunos diseñadores de talento. Para cualquier persona que no ha actualizado aún (o incluso para aquellos que tienen) Aquí hay una vista previa de algunas de las nuevas pantallas, junto con la de todos los detalles de los artistas que los crearon:

Adobe Photoshop CC 2014

Un diseñador autodidacta, Kylli Sparre fue atraído a Adobe Photoshop, debido a las infinitas opciones que le dio. Según Sparre, quien describe su estilo como de ensueño, simbólico, ya veces surrealista, lo ilimitado de la creación de imágenes ayudó a abrir su creatividad. La imagen apareció en la pantalla de bienvenida de Adobe Photoshop CC es uno de los proyectos personales de Sparre. Sabía que quería combinar la foto de la mujer con el tiro de la ubicación, pero ninguna de las cosas que ella intentó funcionó hasta que notó una conexión interesante entre las dos imágenes. Después de ajustar el ángulo de ella fue capaz de hacer hincapié en la conexión con resultados extraordinarios.


Adobe After Effects CC 2014

Con un estilo que se extiende a el arte y el diseño, Pablo Iglesias disfruta explorando todo tipo de disciplinas visuales, más recientemente, se centran en el arte más directo y de vídeo que combina una amplia gama de disciplinas creativas. Para la pantalla de bienvenida  Adobe After Effects CC, primero creó algunos elementos gráficos en Photoshop, una especie de ilustración digital de la recreación de un prisma transparente con colores iridiscentes. Después, él generó algunos bucles de vídeo con la imagen en Adobe Premiere Pro CC, utilizando diferentes movimientos y efectos de espejo. Luego jugó los bucles en un programa que utiliza para el rendimiento de vídeo en vivo, efectos tales como zoom, retrasos RGB y deformaciones 3D aplicada, y capturó todo con Syphon. El último paso fue hacer la edición final y la composición en Adobe Premiere Pro. La pantalla de bienvenida Después de Efectos CC es uno de los marcos que él capturó en el vídeo final.

Ha habido mucho entusiasmo por la nueva versión de Creative Cloud, la respuesta de los clientes ha sido simplemente impresionante.

Tamaño: 1280 x 768

Tamaño: 1600 x1200

Tamaño 2560 x 1600

• Tamaño: 640 x 480 
• Tamaño: 1136 x 640 
• Tamaño: 1280 × 1024 
• Tamaño: 1920 × 1080 
• Tamaño: 1920 × 1200 
• Tamaño: 2048 × 1536 
• Tamaño: 2880 × 1800

En esta oportunidad les traemos un tutorial que muchos deben estar esperando, de la mano de uno de los evangelistas de Adobe, Paul Trani.

En este tutorial nos va a enseñar como obtener los colores de una web a nuestro Photoshop cs6 exportado los css del site.

Sin mas les dejo el tutorial.

Este post es una traducción libre del post Style Scavenger: 7 CSS Snippets to Borrow from HTML5 Boilerplate de The David Walsh Blog.

Comenzar una aplicación web desde cero puede ser una tarea aburrida y lenta. El HTML5 Boilerplate de Paul Irish es un punto de partida excepcional para crear sitios web de cualquier tipo. Proporciona un conjunto increíblemente útil de archivos HTML, CSS, JavaScript e imágenes para iniciar de un modo rápido una aplicación web con HTML5. Aún así, HTML5 Boilerplate puede ser un poco más de lo que necesitas si ya tienes una plantilla propia; pero eso no significa que HTML5 Boilerplate no pueda serte útil. En este post se ofrecen 7 fragmentos CSS de HTML5 Boilerplate que puedes incorporar en tu propia aplicación.
html
Muchos desarrolladores se olvidan de la etiqueta HTML cuando tratan de dar estilo a su aplicación, pero dar estilo a la etiqueta HTML puede ser una de las cosas más importantes.

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

Este fragmento de código CSS se asegura de que la barra de desplazamiento siempre aparezca (por lo que no hay ningún "salto" cuando cambia el tamaño de página) e impide que los navegadores móviles ajusten el tamaño de la fuente de la página.
::selection

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

Cambiar el color de resaltado o selección es otro pequeño toque para hacer tu web única.
img -ms-interpolation-mode: bicubic;
Internet Explorer 7 hace un trabajo horrible en el escalado de imágenes. El siguiente fragmento de código CSS lo soluciona:

img { -ms-interpolation-mode: bicubic; }

.visuallyhidden
La estrategia de ocultar el texto mientras que se permite a los lectores de pantalla leerlo no es nueva y es increíblemente importante para la accesibilidad del sitio. La cuestión es que he visto 100 métodos diferentes para hacerlo, y es difícil saber de qué manera es mejor uno que otro. La recomendación de HTML5 Boilerplate es:

/* Ocultar sólo visualmente, pero tenerlo disponible para los lectores de pantalla: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Amplia la clase .visuallyhidden para permitir que el elemento sea "enfocable" cuando se navega por teclado: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
This little-known trick has been working wonders for years.

El código proviene de Jonathan Snook. Si estás interesado en conocer más acerca de este método puedes leer el post de Jonathan Snook.
svg:not(:root)
Estaba entusiasmado con el soporte a SVG en Internet Explorer 9. Pero, por supuesto tenía que llegar con un bug, y ese bug es un error de desbordamiento:

svg:not(:root) { overflow: hidden; }

Y olvidate del error. Asegúrate de incorporar este código si trabajas con gráficos vectoriales.
@media print img max-width
Incluso si no deseas utilizar ninguna de las reglas de la pantalla, la hoja de estilos de impresión de HTML5 Boilerplate vale por sí misma. Siempre pensamos en el texto cuando se trata de imprimir, pero ¿qué pasa con las imágenes?

@media print {
  img { max-width: 100% !important; }
}

El fragmento de código anterior se asegura de que las imágenes no sobrepasen los límites de la página.
@media print widows
Las líneas viudas y huérfanas no quedan bien en la impresión. En tipografía, las líneas viudas y huérfanas son líneas que, por quedar en una página distinta que el resto del párrafo al que pertenecen, aparecen aisladas de su contexto. Este código CSS previene las líneas viudas y huérfanas en las etiquetas de párrafo y encabezados h2 y h3.

@media print {
  p, h2, h3 { orphans: 3; widows: 3; }
}

Personaliza este fragmento de código a tu gusto.
Como puedes ver, HTML5 Boilerplate es una colección de trucos CSS que puedes incorporar a cualquier proyecto nuevo o existente. Incluso si no deseas utilizar todos los archivos incluidos en la plantilla, todavía hay muchos fragmentos CSS que puedes aplicar.

Fuente: WebIntenta

Mucha gente me ha preguntado porque al abrir un nuevo documento html tienen que editarlo para convertirlo en un <!doctype html> de html5 la razón es que Dreamweaver no tiene ese formato predefinido sino que tienes que asignarlo y es muy fácil y simple.

Al abrir DWCS6 tenemos esta imagen.

Ahora apretamos en la columna donde dice Crear Nuevo al final donde dice "más" y nos aparecerá lo siguiente.

Para los amantes de la web, no les sera raro escuchar de estas dos herramientas relativamente nuevas que tienen Adobe, recientemente estos pequeños juguetes han sido actualizados, no me extrañaría que se volvieran herramientas estándar para diseñadores, animadores y desarrolladores.

Adobe Muse actualmente esta en su versión Beta 7, estuve jugando con esta herramienta y es muy completa para ser un beta, si eres diseñador y quieres evitarte el tedioso trabajo de maquetar tu diseño manualmente esta herramienta es para ti, genera automáticamente el css, html y javascript necesario para hacer una pagina web.

Es una herramienta What you see is What you Get, obviamente tiene sus limitaciones, inicialmente se puede hacer paginas estáticas en html, y con estáticas me refiero a que los datos no son Administrables o Gestionables, pero esta no es una barrera que no se pueda remediar, si estas dispuesto a gastarte unos cuantos dolares puedes hacer tu sitio Gestionable, usando Adobe Business Catalyst .  

Adobe Muse me recuerda de cierta forma a Flash Catalyst, que pena que Adobe ya no seguirá mejorando esa herramienta.

Aquí va un listado de 6 malas prácticas que, sin ser especialmente graves, perjudican al desarrollador Web en su tiempo de desarrollo, en la limpieza del código que desarrolla, en su mantenibilidad a futuro, en el trabajo colaborativo con otros desarrolladores o en errores exóticos que después uno no sabe de dónde salieron.

No Conocer el Soporte Sobre el Cual se Trabaja