El pasado 05 y 06 de Noviembre de 2008, tuve la oportunidad de dictar el entrenamiento en Silverlight para Partners de Microsoft Colombia inscritos en el programa Metro. Durante las 6 sesiones (8 horas) desarrollamos este programa:

• 8:30 – 9:30 Framework y Herramientas. Novedades en C# y VS2008.

• 9:35 – 10:45 WPF 101. Conceptos básicos, XAML, Blend y ejemplos.

• 10:45 – 11:00 Refrigerio

• 11:05 – 12:30 WPF 201. Dependecy Properties, Routed Events, IValueConverters, ApplicationsCommands

• 12:30 – 1:50 Almuerzo Libre

• 2:00 – 3:00 Silverlight 101. Conceptos Basicos y ejemplos.

• 3:05 – 4:15 Silverlight WorkShop . Construccion de un reproductor de MP3 con Silverlight. Comunicaciones entre SL y JS.

• 4:15 – 4:30 Refrigerio

• 4:35 – 5:30 Encoder, Deep Zoom y Silverlight Streaming. Ejemplos.

Gracias a todos los que participaron, espero que haya sido útil para el desarrollo de sus proyectos. Por favor no dejen de enviarnos sus comentarios sobre este evento a jpelaez at juanpelaez.com y a Sandra Marin en sandra.marin at microsoft.com

Dejo aquí las PPTs, y los resultados de la sesión 1, sesión 3 y el taller.

Recursos

Presentaciones.

Código de la Sesion 01. Novedades en c# y VS2008 

Código de la Sesion 02. WPF 201.

Código del Taller

Juan Pelaez

Arquitecto de Software

Keywords: Silverlight, Partners Microsoft Colombia, Programa Metro, Capacitacion, Juan Pelaez, Juan Carlos Pelaez, Entrenamiento, WPF.

Se ha publicado el Preview de Diciembre de Blend 2.  Para descargarlo puede ir a este enlace.

En una revisión rápida para preparar un demo para Microsoft Andino he encontrado dos caracteristicas interesantes:

• La Solución ahora puede manejar multiples proyectos lo que permitirar reconstruir y reusar controles que estaban en proyectos diferentes.
• Ya se pueden cerrar los diferentes paneles con la acostumbrada x que tanto extrañamos antes.

Hay muchas más que se pueden leer en el mismo sitio de la descarga.

Un Comentario.

Al crear un nuevo proyecto ya se puede seleccionar el framework que desea usarse para compilar, esto ya estaba en la versión anterior (preview de septiembre), pero solo se habilitaba si se instalaba el framework 3.5. (Lo que por cierto traia muchos dolores de cabeza con proyectos nuevos que se crearan despues de instalar el Framework 3.5). Imagino que es por la misma razón que en esta versión actual todos los proyectos y soluciones que se crean son para VS2008, lo que tiene sentido pero es complicado para todos los que veniamos usando blend, queremos las mejoras de la ultima versión pero aún no estamos en VS2008.

Tambien puede verse como una excusa más para migrar a VS2008. (Otras en un post futuro...)

Espero que sea de ayuda

Juan Peláez

MCTS.

Miembro de Microsoft Andean Influencer Framework

Miembro de Microsoft Andean Speaker Group.

Keywords: VS2008, Blend 2, Juan Peláez., Problemas Proyectos Blend 2 Diciembre VS2005., Por que mi proyecto Blend no abre en VS2005, Visual Studio 2005.

Con la llegada del los productos de Microsoft Expression y el Windows Presentation Foundation (WPF) se ha presentado la necesidad de generar archivos desde las herramientas de otros fabricantes de diseño al formato XML que puede entender Expression y Visual Studio.

Una de las más populares viene de Mike Swanson y permite exportar desde Ilustrator hacia XML, sin embargo durante las pruebas que hemos hecho con Juan Diego hemos tenido problemas de todo tipo.

Lo que mejor ha funcionado hasta ahora es guardar el archivo desde ilustrator en el formato CS3 y luego si pasarlo por el convertidor.

Espero que sea de ayuda.

Juan Peláez

MCTS

Keywords: Ilustrator, Blend, Microsoft Expression, Tools, WPF.

Durante Noviembre de 2007 y gracias a la invitación de Sandra Marin de Microsoft Andino tuve oportunidad de presentar, junto con Juan Diego Velasco de Gattaca, las conferencias de Bogotá y Medellín sobre los procesos de desarrollo de software entre el Diseñador y el Desarrollador usando la Suite Expression de Microsoft.

En estas conferencias mostramos un ejercicio a dos manos en el que construimos desde cero una aplicación que consume un servicio web que expone los consumos de agua de los habitantes de una ciudad imaginaria.

Durante la presentación Juan Diego exportó desde Ilustrator el logo de la empresa a Expression Design, luego en Expression Design se construyó la interfaz gráfica usando los mejores criterios de usabilidad y experiencia de usuario.

Todo lo anterior se exportó a Expression Blend y se demostraron algunos efectos y propiedades de las herramientas, en este punto interactuamos con el desarrollador y construimos el databind de los controles. Cuando Juan Diego terminó el Diseño, abrimos el proyecto en Visual Studio 2005 (con las extensiones del framework 3.0) y vinculamos una fuente de datos de un web service a la aplicación.

Despues de realizar estos ejercicios usando expression enconder codificamos un video y construimos el player de silverlight, hicimos una disección de silverlight y explicamos sus características y funcionamiento.

Para finaliza con Expression Web creamos un proyecto y usamos el player de Silverlight y las características de integración de Web para demostrar algo de Ajax y del proceso de trabajo conjunto entre el Desarrollador y el Diseñador en proyectos Web.

En el apartado de archivos relacionados publicamos la ppt que usamos ese día y el proyecto resultante.

Archivos Relacionados:

Presentación utilizada

Código Fuente (40+ Megas, Incluye Video)

Recursos Necesarios:

Expression Design

Expression Blend

Expression Encoder

Expression Web

Visual Studio 2005 (con extensiones para el Framework 3.0)

Plug-in de Silverlight.

IIS (para correr los servicios Web)

SQL Server 2005 (Para la base de datos que usan los servicios web)

Espero que sea de Ayuda

Juan  Peláez

MCTS

Miembro del Microsoft Speaker Group

Miembro del Andean Influencer Framework.

Keywords: Expression, Juan Peláez, Juan Diego Velasco, Desarrollo de Software, Mejores Practicas, Diseño Grafico, Expression Blend, Expression Design, Expression Web, Silverlight, Gattaca S.A., Desarrollo de Software, Colombia, España, Medellín, Bogotá, XML, WPF, Framework 3.0,

Pd:  En las próximas semanas estaré en Ecuador, Colombia y Venezuela presentando el Andean Road Show, un evento para desarrolladores de plataforma Microsoft. Espero verlos en los Show. Más Información en: Andean Road Show Web Site

Durante el desarrollo de los proyectos de Gattaca con Microsoft Expression Blend 2 Preview de Septiembre se nos ha presentado este error al compilar desde Blend

error MSB4126: The specified solution configuration "Debug|MCD" is invalid. Please specify a valid solution configuration using the Configuration and Platform properties

Compilando desde Visual Studio funciona perfecto, Juan Diego ha encontrado la solución como comenta en este Post.

Espero que sea de Ayuda.

Juan Carlos Peláez

MCTS.

Keyword. Debug, MCD, Blend, Expression, Errores Compilación, Tips.

Microsoft ha publicado una nueva versión del producto Blend versión 2. El preview de Septiembre, en esta versión se han implementado algunas nuevas funcionalidades que son realmente importantes y que facilitarán la vida de los que están haciendo una transición o están haciendo convivir Flash y Expression.

Algunas de las más notorias características de la versión de Septiembre de Blend 2 son :

Integración con Visual Studio 2008 Beta 2.

Con esta versión de Blend pueden abrirse proyectos de Visual Studio 2005 y 2008, sin embargo los proyectos por default no son de VS2008 ya que no es posible abrirlos en VS2005 aunque se tenga Microsoft .Net Framework versión 3.5.

Creación de Controles desde objetos existentes.

Ahora Blend incluye una nueva funcionalidad que permite convertir contenido existente en un control que puede ser usados nuevamente (instanciado). El elemento seleccionado, sus recursos y sus animaciones son refactorizados en un nuevo control.

Mejoras en el Editor del XAML y una vista Split

El nuevo Blend permite abrir un documento XAML y ver al mismo tiempo el código y el diseño en una vista "Split", también permite modificar la fuente, el tamaño y la indentación del código XAML, en esto se acerca mucho a lo que puede hacerse con VS2008 que contiene esta misma vista Split para HTML y XAML.

Selector de StoryBoards.

El selector de StoryBoard (Picker) reemplazo la caja de storyboard anterior, el selector permite salir del modo de grabación, le permite crear una nueva animación, duplicar, reversar o eliminar la animación seleccionada. También puede renombrar la animación seleccionada.

Propiedades del StoryBoard y KeyFrame.

Blend de Septiembre permite modificar las propiedades desde el panel de propiedades, ahora se puede modificar la dirección de la animación y el modelo de repetición de la misma.

Animación Vertex

Blend de Septiembre contiene una nueva funcionalidad para animar vértices individuales (puntos y tangentes) en una línea. Antes si se modificaba el vértice la  forma original se modificaba de forma permanente. Creo que esto resuelve un problema de animación de formas que era muy extraño para los diseñadores de Flash.

Barra de "Controles"

Una nueva barra sobre la tabla de arte permite identificar e incluso seleccionar objetos dentro de la jerarquía del template, esto permite cambiar rápidamente el alcance en los procesos de edición de las plantillas y los estilos en WPF.

Inserción de Fuentes

Blend 2 contiene nueva funcionalidad para garantizar que las fuentes que se seleccionaron en el proyecto son las mismas que el usuario verá al momento de ejecutar la aplicación, las fuentes ahora se insertan en el proyecto para garantizar su adecuada distribución.  El nuevo menó Font Embeding permite insertar la fuente.

Espero que sea de ayuda

Juan Carlos Peláez

MCTS

Miembro de Microsoft Speaker Group Andino

Miembro del grupo Influencers de Microsoft Colombia.

Keywords: Expression Blend, Microsoft, .Net, WPF, Nuevas Caracteristicas, StoryBoards

Extractado del Blog de Jesse Ezell, quien ha tenido una amplia experiencia en desarrollo de herramientas, proyectos y soluciones usando flash.

Comparación entre Silverlight y Flash, principales características diferenciadoras de ambos productos.

(...)

Animaciones

Las animaciones en Flash son del tipo de transformación de matrices, uno puede aplicar una matrix a un elemento basado en frames para generar el movimiento, quiere mover algo a través de la pantalla en 3 segundos?, calcule cuantos frames estos 3 segundos necesitarán, luego calcule las matrices que cada frame requiere. No olvide que el reproductor no mantiene la misma tasa de frames a no ser que se coloque un archivo de audio en blanco, así que los 3 segundos pueden convertirse en 2, 6 o 5, dependiendo de que está haciendo el procesador.

Silverlight soporta el modelo de animaciones de WPF, que no solo es basado en tiempo más que en frames, sino que permite definir las condiciones de principio y fin y él se encargará de llevar la animación a donde se desea, no hay que trabajar con matrices, no hay que calcular posiciones en varios frames. La animación simplemente funciona.

Formas

Flash almacena sus formas usando un registro binario. Para escribir definiciones de forms, se necesita la licencia de un tercero del SDK del archivo flash o construir su propio SDK, no es muy difícil, pero requiere un curva de aprendizaje y la habilidad para manipular cosas al nivel de bit, no es el tipo de cosas que la mayoría de las personas puede escribir y depurar en una tarde.

Silverlight usa XAML, XAML está basado en texto y puede ser exportado usando cualquier simple objeto XAML, no se requiere comprar librerías especiales para escribir los archivos, tampoco hay necesidad de escribir sus propias librerías, solo se coloca algún texto en un archivo y listo, el tipo de cosas que pueden ser depurados y completados en una tarde.

Texto

Flash almacena sus fuentes usando la misma definición que usa para las formas. El reproductor no entiende archivos TTF, así que al final uno termina sumergido en las definiciones del API de Win32 y la vaga definición del formato de archivo de Flash, es posible que uno tarde años tratando de entenderse con todas las complicaciones de las fuentes.

Silverlight le permite a usted insertar la información de las fuentes true type directamente en su proyecto, y descargar esa información con el objeto que se descarga. No se necesita nada especial, no se necesita manejar nada especial, simplemente funciona.

Video / Audio

Flash soporta múltiples formatos de video, el último codec es realmente de alta calidad y con un excelente uso del ancho de banda. El problema es que si usted está creando una herramienta que exporta contenido flash...el formato que usa no está soportado por nadie más. El video codec original, la implementación H.263 propietaria de sorenson es una versión mutante de H.263. La compresion sigue la especificación muy cerca, pero hay un lista de características que se salen de la especificación y no permiten completar la construcción de un encoder propio. el ultimo encoder de On2 lo pone en una posición peor. Licenciar el Codec Sorenson no es muy costoso, pero el de On2 si lo es, la compañía está tratando de aumentar su valor de acción de los 2 dólares actuales a través del modelo de licenciamiento del codec usado por Flash. Los formatos de Audio que soporta flash son todos propietarios, excepto por el ADPCM, que nadie usa por sus problemas de compresion, y MP3 que requiere licencias de terceros para las librerías de conversión.

Comparando eso con la historia de Silverlight, Silverlight implementa el codec VC-1 para video (un estándar de la industria), también soporta WMV and WMA.  Casi todo el mundo tiene Windows Movie Maker, pero si lo no tiene no importa, por que?, porque Microsoft libero un encoder gratuito para producir WMA y WMV. Así que, no solo usa formatos que la gente puede usar comúnmente, sino que Microsoft también provee su producto con SDKs si usted quiere hacer el encoding por sí mismo. La mejor parte de esto es que Microsoft no está basado en el licenciamiento de WMA/WMV para mantenerse. No solo es fácil de integrar sino que es barato.

Scripting

Usted puede reusar clases de C# (o de VB. Nota JCP) de su propia herramienta dentro del contenido exportado. Si se toma la ruta de flash todas las clases deberan escribirse dos veces, usted necesitara clases en .net para manejar la experiencia de tiempo y clases Flash para manejar el tiempo de ejecución. Si tiene componentes de servidor tendrá que volver a .net y escribir todas las clases que el componente de runtime están usando.  Por ejemplo, digamos que uno está escribiendo un herramienta que exporta exámenes con gran contenido gráfico, con Silverligth/.Net las mismas clases y entidades que trabajan con los resultados en el player pueden usarse en el servidor. Con Flash, usted tiene que escribir toda la lógica 2 veces y tenerla sincronizada en cada cambio.

Tools

Se puede crear contenido Silverlight con las mismas herramientas que usted usa a diario. Visual Studio.net es de lejos la más poderosa herramienta de desarrollo y el IDE más popular. Usted puede poner todo el código de los componentes del servidor, los componentes de ejecución del player y las herramientas suyas en el mismo proyecto, no se requiere habilidades extras, no hay que contratar un experto en Flash para hacer  las partes gráficas. Cada desarrollador puede contribuir a completar la aplicación. (...)

Para nosotros en Gattaca la experiencia ha sido muy buena, hemos desarrollado una aplicación que llama por teléfono, imprime, se conecta con servicios web usando WCF y tiene una riqueza gráfica inmensa y todo trabajando en equipo el desarrollador en .net y visual studio y el diseñador en blend.

Espero que sea de ayuda.

Juan Carlos Peláez

MCTS

Miembro del Speaker Group de Microsoft Andino

Miembro del Grupo Influencers de Microsoft Colombia

Keywords: Silverlight, WPF, Flash, Visual Studio, .Net, Video, Audio, Encoders, Comparación

Durante el desarrollo de nuestro proyecto Real en Blend, hemos entrado en la fase final de pruebas e instalación en el cliente. A pesar de nuestra recomendación de comprar una maquina con Windows Vista, se han comprado una maquina Dell bien bonita pero con Windows XP, por lo que nos enfrentamos a diversos problemas que serán objeto de otro post, pero este me pareció bastante especial y aburridor como para ser publicado inmediatamente.

El Problema: Al instalar la aplicación desarrollada con Blend Expression (preview de agosto) y Visual Studio 2008, los efectos de sonido asociados al StoryBoard se perdieron.

Aunque los archivos se encontraban en la misma carpeta del ejecutable, con el mismo nombre, y con todo bien creado y configurado no se ejecutaban cuando llegaba el momento. Tocándolos por aparte si estaban sonando.

La solución: Buscando en Internet encontramos que uno de los workarounds detectados de Blend (incluso publicados en la página de readme en internet que no leímos y que anexamos aqui el link: Blend) indican que tiene que tenerse la versión 10 de Windows media player o superior , asi que bajamos la version 11, y funciono perfecto, ahora nuestros storyboard tienen audio.  (y lo más increíble, es un control, es animado, tiene audio y es una camiseta!!!, adjunto una foto, Juan Diego después hablará más del tema, pero la camiseta roja, sobre la que caen flores, se mueven los tambores y tiene el sonido es un control, como un botón o una lista tiene propiedades de databind, y es un gráfico vectorial que no se pixela en ningún tamaño, toda una lista de características y tecnologías nuevas. -:)),

Corolario: Para poder instalar una aplicación desarrollada en Microsoft Expression Blend y Visual Studio 2005 en una maquina XP, esta máquina tiene que tener el framework 3.0 instalado, lo anterior puede que no sea muy claro para todos, pero el componente que permite hacer el render del XAML que es el núcleo gráfico de la aplicación solo está disponible a partir del framework 3.0. De todas formas esta es una buena noticia para nosotros como desarrolladores por qué podemos hacer aplicaciones con Blend que tienen diseños, interactividades y experiencias de usuario muy novedosas pero que corren (en general) en la base instalada de usuarios con XP SP2.

Preguntas: Analizando este problema de hoy con Juan Diego nos entró la duda sobre lo que pasara con silverligth, es decir si meto audio a una aplicación silverlight y no tengo windows media player 10 o superior no sonará?, habrá que probarlo.

Espero que sea de ayuda, nosotros pasamos varias horas tratando de encontrar la causa de este comportamiento.

Juan Carlos Peláez

MCTS

Miembro de Microsoft Speaker Group Andino

Miembro del Grupo Influencer de Microsoft Colombia.

Keywords: Microsoft Expression Blend, Gattaca, Visual Studio, Framework 3.0, .Net, Windows XP, Audio, Sonido, Windows Media Player, Problemas, storyboard.

Hola a todos, en las últimas semanas hemos estado desarrollando con el grupo de diseño de Gattaca un Juego para uno de nuestros clientes y hemos decidido usar WCF y WPF, estamos usando el preview de Agosto de Blend  y hemos encontrado diversas cosas que pueden parecer interesantes a otras personas que estén llevando a cabo proyectos similares.

Desde la perspectiva del Diseñador Gráfico la cosa siempre se ve diferente así que estaremos publicando es este blog algunas notas sobre lo que podemos y no podemos hacer en blend, lo que es fácil y lo que no.  : http://tatuajefalso.wordpress.com/

Espero que sea de Utilidad.

Juan Carlos Peláez

MCTS

Keywords: Blend, Expression, WPF, Diseñadores Gráficos, Juan Peláez, Juan Diego Velazco, WCF.