Introducción al Desarrollo para SharePoint con Visual Studio 2008
Creando interfaces expectaculares con Expression Studio
1. Web days Creando interfaces expectaculares Julio Casal John Galt Solutions julio_casal@hotmail.com
2. Agenda Microsoft y UX Vistazo a las Plataformas UX de Microsoft Introducción a Expression Studio WPFE/E
3. UX la efectividad, eficiencia, y satisfacciónque un usuariopercibe al interactuar con la compañía y susproductos o servicios mucho másqueuna IU simpática Incluye a la IU comocomponente clave 3 Feb 2007
4. Retos de UX para Clientes Enriquecidos Costo Facilidad de Uso Interactividad Ubiquidad Tamaño del Cliente Acercamiento al Cliente Ancho de Banda Calidad de Video Propiedad de IP Tiempo a Mercado Administración de Derechos Servicio de Publicidad Soporte a la Plataforma Puesta en Producción QoS Facilidad en el Desarrollo Soporte Escalabilidad Reportería Formatos A/V Facilidad de Descubrir Estándares Pruebas Tamaño Interoperabilidad 4 Feb 2007
5. Plataforma de UX Punto a Punto de Microsoft Plataforma de Aplicaciones Microsoft Tecnologíaspara UX de Microsoft ExperienciaFascinante Windows Vista .NET Framework 3.0 (w/WPF) Web Cliente Plataforma de Aplicación de Microsoft SQL Server Commerce Server IIS ASP.NET Windows Media Windows Server Office Funcional UX Superior Gran Experiencia Navegador+ “WPF/E” Buena Experiencia Navegador+ ASP.NET AJAX Feb 2007 5
6. Unificandoel Proceso de Diseño/ Desarrollo Diseñador Look, comportamiento, marca y conexiónemocional Desarrollador Funcionalidad, puesta en producción, datos, seguridad, integridadoperacional 6 Feb 2007
7. Papel JPG / TIFF PSD PPT MOV / WMV C++ C# VB.NET XAML XHTML CSS / XSLT XML ASP.NET AJAX Sin Estándares ‘Código Sucio’ Maquetas Unificandoel Proceso de Diseño / Desarrollo Diseñador Desarrollador 7 Feb 2007
9. Ya sea queestésdiseñandositios web enriquecidosbasados en estándares, experienciasfantásticas en el escritorio, o administrandocontenido digital,lasherramientasprofesionales de diseño Expression le dan la flexibilidad y libertad de convertirsuvisión en realidad. La herramientaprofesional de diseñoWeb La herramientaprofesional de diseñoInteractivo La herramientaprofesional de diseñoGráfico La herramientaprofesional deAdministración de Medios 9 Feb 2007
10.
11.
12.
13. Entregue experiencias de usuario excepcionales con gráficos enriquecidos, animaciones e interfaz gráfica interactiva10 Feb 2007
14.
15.
16.
17. Exporte sus diseños visuales como código XAML listo para usarse en diseño de interfaces y skinning de controles11 Feb 2007
18.
19.
20.
21. Incluye Expression Media Encoder, paraconversión, mejora y compresión de video web enriquecidoFeb 2007 12
43. Se integra bien con otras ofertas de Microsoft y otros Microsoft Otros ASP.NET ASP.NET AJAX Office Sharepoint IIS WMS Compatible con cualquier servidor web y cualquier servidor de scripting Feb 2007 18
45. Plataformas de UX Microsoft Usuario Puntos de entrada ExperienciaFascinante .NET Framework 3.0 Windows Excelente: Web Superior Apps “WPF/E” Apps “WPF/E” EstándarAvanzadas Bueno: Estándares Web ASP.NET AJAX windows Enriquecimiento office ModeloProgramación digital home DHTML + ASP.NET + AJAX Live Image Search www.live.com New York Times Reader www.nytimes.com CódigoAdministrado ModeloPresentación CSS / XHTML web devices Rich Graphics / Animation / Media XAML 20 Feb 2007
(Before getting into details on “WPF/E”, organically solicit feedback feedback on the pain points the customers’ business is experiencing today from partners– items in red are most common reported by partners delivering rich media experiences. Bulleted out are sample speaking points for each)These are the top challenges/pain points that partners have called out when delivering Rich Client UX experiences today. Cost – Cost of development & distribution are well known.Interactivity – Richness of experience offeredUbiquity – Ubiquity of client on desktop systemsVideo quality – ability to deliver high fidelity video at a variety of bit rates, particularly 300kbps – 1.5 mbps for the rich WebReach – Client and customer reach Bandwidth – While it’s getting cheaper, bandwidth still costs $$Ease of Use – How easy is development on the platform? How easy is it for the customer to install and enjoy?Client Size – How big is the client install? In particular, our studies have showed significant concerns about installs over 4MB for initial experience.Time to Market – How long it will take to develop the experience – how agile is the platform for delivery?IP Ownership – A thorny issue, particularly for video codecs where ownership of IP sometimes doesn’t reside with the platform provider. As a result, licensing costs or possible patent concerns in the future may result in undue risk.Rights Management – Ability to protect content IP through copy protection and DRMAd Servicing – A growing number of rich media experiences are vying for coveted ad dollars. How well can you target ads and deliver the ad content in a compelling way?OS/Platform Support – Will I be able to deliver the experience to a broad OS/Browser/Client base? Will it integrate with my existing platforms (server and infrastructure)Deployment– Will it be friction-free? How many steps? Can it be managed and updated regularly?Ease of Development – Will my developers be agile? Can the use their existing development skills?Quality of Service (QoS) – Will the experience be responsive? For streaming, will my users see buffering? Support – Will I get 24/7 support for my entire platform? Will the vendors stand behind it?Scalability – Can I scale up my solutions easily and cost-effectively?Reporting – Will I have to jump through hoops to get meaningful metrics or be dependent on proprietary solutions?Discoverability – Will my web properties be discoverable and searchable? Will I have to spend more $$ on awareness/visibility or will search engines be able to find my content organically?Standards – can I use web standards such as AJAX to build my solutions? Can they interop with other browser-DOM based elements organically?Testing and Integration – How easy is it to test/debug solutions based on the platform?Interoperability – will it integrate with my existing solutions (web properties, web applications, etc.)Size – Can the assets be easily and effectively compressed and delivered? For Media partners, is there a rich set of tools available for compression and encoding of rich media?
The UX Opportunity and how Microsoft delivers End to EndShift away from thinking in terms of Reach and Rich experiences, focusing on Functional and Superior UXASP.NET AJAX offers benefits of 24/7 support for AJAX-enabled applications built around Web standards. [Brian- please add here]For richer web experiences that add 2D animation, vector graphics, and high-fidelity audio and video on the Web, “WPF/E” is being introduced to address. By embracing Web standards and architecture for development including AJAX (asynchronous Javascript+XML), and in-line XML mark-up (XAML) for presentation, Microsoft is working to break rich development out of the “black box” that it exists in today. As an added benefit, content authored in “WPF/E” is becomes more discoverable by search engines, while also offering the benefits of being cross-platform (Windows and Mac) and cross-browser (IE, Firefox, Safari, Opera). ASP.NET AJAX and “WPF/E” are designed to be complementary technologies. In the broader sense, “WPF/E” can take talk to any AJAX application, both client and server-side. In addition to this, ASP.NET AJAX can be used to control “WPF/E” based visualization of data, or delivery of rich experiences. Examples might include mapping applications, or video playback with rich presentation.ASP.NET AJAX and “WPF/E” at final release will also benefit from being a fully supported technology from Microsoft, with the benefits of 24/7 technical support and the breadth support of the Microsoft development community. AJAX is a fundamental technology supported in “WPF/E” and now, ASP.NETMicrosoft recommends the Windows Presentation Foundation in .NET 3.0 for building rich immersive applications and experiences that can take full advantage of the Windows platform, including UI, Media, offline communication and Document support. “WPF/E” will be used for broad reach interactive media content and browser-based experiences.Combined with the breadth of platform investments, worldwide support and community:Powerful backend with IIS, ASP.NET and Windows Media Server (WM #1 format for streaming)Client side: more UX in vista, also through WPFAJAX very good, but gap. “WPF/E” bridges gap. Brings rich interactivity of experiences previously reserved for desktop to Web with small client install and responsiveness.HACER NOTAR QUE YA SE HIZO LA DEMO DE AJAX
(Note that the quotes around “WPF/E” are due to it being a codename. Final name to be announced at a later date, with focus on end-user friendliness, simple, with high recall.Announced at Microsoft’s Professional Developer’s Conference (PDC) 2005, “WPF/E” is Microsoft’s solution for delivering richly interactive experiences for the Web and beyond:A Better Web (UX)-The “WPF/E“ December CTP includes early support for the industry-leading Windows Media platform, enabling delivery of rich audio and video with 2D animation, vector graphics, and more. Capable of running platform independent on Windows and Mac (10.4.8 or above) with feature parity, “WFP/E” will run in all major browsers including IE, Firefox, and Safari.-As an added benefit, because content authored in “WPF/E” uses plain-text XML for its presentation layer + AJAX for logic, content and applications are more easily searched. More Productive-By embracing Web standards and architecture for development including AJAX (asynchronous Javascript+XML), and in-line XML mark-up (XAML) for presentation, Microsoft is working to break rich media development out of the “black box” that it exists in today. -A part of Microsoft’s Application Platform and Developer Tools strategy, “WPF/E” will benefit from Microsoft’s full platform ecosystem including 24/7 support, servers, solutions, technical resources, and community. Efficient and Effective-On Windows and Mac, “WPF/E” offers a lightweight, independent install of ~2MB with a goal of 3-click installation. No additional software is required- even the audio/video codecs are independent.Microsoft is the only company that has platform investments across the entire rich Web media ecosystem, from tools to codecs, to servers, DRM and clients at work, at home, or on the go.In recognition of it’s contributions to Streaming Media Architecture, Microsoft was recently awarded a Technical and Engineering Emmy® Award from the National Academy of Television Arts and Sciences for Windows Media technologies. The award for Streaming Media Architecture & Components was announced by the National Academy of Television and will be formally delivered to winners at a ceremony held during the CES trade show, January 2007 in Las Vegas. (In full disclosure- was a 4-way win for Microsoft, Adobe, Apple, Real)As an IP company, Microsoft is also committed to ensuring we have content protection in place for delivery of rich media.
(This provides an overview of the framework as disclosed at MIX last year. Note that managed code support is called out here. The CTP today offers great support for AJAX-based programmability and transparency, the team is working to support managed code as well. More details on the exact feature set will be made available at a later date as well as content packaging.Content packages will use .zip style compression for easy packaging and delivery. (Post CTP)
Example scenarios for first release that will be enhanced with “WPF/E”. Web mediaBranded playback with eventsVideo and marketing mixDynamic videos with adsAudio playerInfomercial videoViral videoVlogRich islands on a page (mini apps)Casual gamesGadgetsWeb visualization elementsNavigation propertiesData visualizationTime cardBanner adsReiterating the scenarios that “WPF/E” is optimized for:Always connected to the WebDeeply engaging, cross-platform experiencesFlexibility and breadth of browser support
Recapping on Microsoft’s UX platform offering: ASP.NET AJAX offers benefits of 24/7 support for AJAX-enabled applications built around Web standards. [Brian- please add here]For richer web experiences that add 2D animation, vector graphics, and high-fidelity audio and video on the Web, “WPF/E” is being introduced to address. By embracing Web standards and architecture for development including AJAX (asynchronous Javascript+XML), and in-line XML mark-up (XAML) for presentation, Microsoft is working to break rich development out of the “black box” that it exists in today. As an added benefit, content authored in “WPF/E” is becomes more discoverable by search engines, while also offering the benefits of being cross-platform (Windows and Mac) and cross-browser (IE, Firefox, Safari, Opera). ASP.NET AJAX and “WPF/E” are designed to be complementary technologies. In the broader sense, “WPF/E” can take talk to any AJAX application, both client and server-side. In addition to this, ASP.NET AJAX can be used to control “WPF/E” based visualization of data, or delivery of rich experiences. Examples might include mapping applications, or video playback with rich presentation.ASP.NET AJAX and “WPF/E” at final release will also benefit from being a fully supported technology from Microsoft, with the benefits of 24/7 technical support and the breadth support of the Microsoft development community. AJAX is a fundamental technology supported in “WPF/E” and now, ASP.NET- Microsoft recommends the Windows Presentation Foundation in .NET 3.0 for building rich immersive applications and experiences that can take full advantage of the Windows platform, including UI, Media, offline communication and Document support. “WPF/E” will be used for broad reach interactive media content and browser-based experiences.