Archive

Posts Tagged ‘Blend’

31 días de Windows Phone | Día #5: Decoración temática del sistema

December 5th, 2010 No comments

Windows Phone 7 incorpora el concepto de decoración temática, en la que varios colores usados por el sistema pueden ser cambiados en una sola operación. Aplicaciones que aprovechen este sistema tienen la garantía de verse bien sin importar el tema escogido por el usuario.

Este artículo fue publicado originalmente en Maromas Digitales y es una traducción aproximada del artículo 31 Days of Windows Phone | Day #5: System Theming por Jeff Blankenburg publicado el 5 de octubre del 2010

 

Este artículo es el Día #5 de una serie llamada los 31 días de Windows Phone.

Ayer discutí la orientación del dispositivo y cómo podemos ajustar la aplicación a la posición del teléfono escogida por el usuario. Hoy vamos a enfocarnos en cómo adaptarnos a cambios en el tema y colores de la decoración.

 

Temas oscuros y claros

Si todavía no lo han probado, es posible cambiar el juego de colores del teléfono de oscuro a claro. También se puede definir un color que sirva como énfasis decorativo. Estos son ejemplos de ambos temas en la misma aplicación:

 

Temas con colores oscuros y claros.

 

Colores de énfasis

Los usuarios también tienen la opción de escoger un color como acento o énfasis decorativo global. El sistema operativo ofrece diez colores enérgicos y brillantes de los cuales escoger. Estos colores son usados ampliamente en la pantalla de inicio del teléfono, pero también se les puede sacar provecho en nuestras aplicaciones. He aquí la lista de colores:

 

Colores de énfasis para temas decorativos.

 

Con respecto a los valores predeterminados

Hay veces que al crear la aplicación surge el deseo de cambar algunos colores. Los animo a hacerlo. Hagan su aplicación única. Pero entre más modificaciones hagan, más van a querer hacer cambios en TODO LO DEMÁS. No estoy diciendo que sea malo usar texto oscuro en un fondo claro (o viceversa). Lo que digo es que si están por hacer algo blanco de forma explícita, consideren con cuidado cómo se va a ver si el teléfono tiene asignado el tema de colores claros. (Probablemente termine siendo invisible.) Afortunadamente existe una forma muy simple de resolver el problema y su nombre es Expression Blend 4.

 

Pestaña del dispositivo en Blend 4

Primero, hay que abrir el proyecto en Expression Blend. La manera más fácil de hacerlo es con un clic derecho en el proyecto de Visual Studio y escogiendo Abrir en Expression Blend…

 

El proyecto se puede enviar a Blend desde Visual Studio.

 

Una vez abierto se puede localizar la pestaña titulada Dispositivo. (MD: si no aparece, se puede desplegar usando el menú Ventana->Dispositivo). Tiene la siguiente apariencia:

 

Pestaña Dipositivo en Blend.

 

Esta pestaña nos permite revisar en el área de diseño cómo se verán los diferentes temas y colores de énfasis, lo cual será sumamente importante cuando empecemos a USAR esos colores en nuestras aplicaciones. A modo de ejemplo, digamos que se quiere tener un color de fondo que coordine con el escogido por el usuario. Para esto voy a usar otra asombrosa característica de Blend 4: la sección de Recursos de color.

 

Recursos de color

Antes de que empiecen a llover comentarios como “Yo soy programador, ¿por qué tengo que usar Blend?” déjenme aclarar que todo esto puede ser hecho en Visual Studio 2010. No más que es MUCHO, MUCHO más difícil. Yo tiendo a optar por el camino más fácil cuando no hay ventajas obvias en usar un método más duro.

Windows Phone 7 tiene un amplio juego de colores predeterminados que utiliza a menos que sean alterados intencionalmente. Lo mejor, en la mayoría de los casos, es conocer bien cuáles son esos colores. En las ilustraciones abajo pueden ver que el color de énfasis, PhoneAccentColor, y el de fondo, PhoneBackgroundColor, cambian según el tema y color escogidos en la pestaña Dispositivo. La primera es Oscuro/Azul y la segunda es Claro/Naranja.

 

La paleta del sistema cambia según el tema escogido.

 

Mediante enlazar los colores de nuestra aplicación a valores del sistema logramos que se adapte instantáneamente a cualquier escogencia del usuario. En el ejemplo siguiente verán que he añadido un rectángulo con relleno graduado que va desde PhoneBackgroundColor a PhoneAccentColor. También configuré el título para que usara el color de énfasis.

 

 

Y el resultado de usar las combinaciones de color y tema citadas anteriormente (lo único que cambió entre ambas capturas es el tema usado y el color de énfasis):

 

Al tomar ventaja de los colores del sistema, la aplicación de adapta automáticamente el tema decorativo escogido.

 

Descargando el código

Bajen el ejemplo y ábranlo en Expression Blend. Jueguen con los Recursos de color. Experimenten con la pestaña del Dispositivo para ver los cambios que se producen. Definitivamente les va a hacer la vida más fácil.

 

Jeff Blankenburg

 

Categories: WP7 Tags: , , ,

Como Crear una guía de Movimiento con Expression Blend

October 5th, 2010 1 comment

En este post mostraré como podemos crear una guía de movimiento ,  la cual será la ruta de movimiento de un objeto en particular.

Ver Demo

Read more…

Categories: Blend Tags: ,

Tutoriales del Blend

January 19th, 2010 No comments

John Papa publicó un post en el que habla sobre Project Rosetta, si bien el sitio tiene mucho material para gente que está acostumbrada a usar Flash, también puede servir para que un programador de .NET aprenda diferentes conceptos de diseño. Además, el sitio incluye unos tutoriales muy buenos y cortos de Blend.

image

No duden en echarle un vistazo.

Categories: Blend, Tutoriales Tags: ,

El programa WebSite Spark

September 24th, 2009 No comments

Hace unas horas Scott Gu anunció el WebSite Spark. Este programa está diseñado para apoyar a desarrolladores y diseñadores a obtener software y recursos de Microsoft sin costo alguno durante tres años. El programa incluye:

  • 3 licencias de Visual Studio 2008 Professional Edition
  • 1 licencia de Epression Studio 3 (Incluyendo Blend, Sketchflow y Web)
  • 2 licencias de Expression Web 3
  • 4 licencias por procesador de Windows Web Server 2008 R2
  • 4 licencias pro procesador de SQL Server 2008 Web Edition
  • Panel de Control DotNetPanel

Las licencias de Windows Server y SQL Sever pueden usarse tanto para ambientes de desarrollo como de producción.

Todo lo que necesitan es ser desarrolladores independientes o ser una compañía de 10 o menos empleados.

Después de 3 años, no tiene olbigación alguna de pagar el software, solo un cargo de $100 dlls al final del programa. Si deciden seguir en el programa, este tendrá un costo de $999 dlls por año. Alternativamente, pueden quedarse sólo con las licencias de producción (una de Windows Web Server y otra de SQL Server) por $199 dlls al año.

Para enrolarse solo necesitan entrar a la página del programa en donde se les solicitará unos datos sobre su compañía y un referal code que pueden solicitar a webspark@microsoft.com

No lo duden más y ¡enrólense!