techdencias windows 10 diseño de aplicaciones universales

Martin VegaUniversal Windows Platform:Como planificar y diseñarmi Aplicación

MADRID 28 de Noviembre 2015

Martin Vega

@mvegaca

Senior Consultant - Windows developmentmvega@pasiona.com

www.pasiona.com(+34) 669 333 333info@pasiona.com

@pasiona BarcelonaPujades 350, 10ª planta08019 · Barcelona

BilbaoGran Vía 19-21, 2ª planta 48008 · Bilbao

Londres1 Northumberland AvenueLondon · WC2N 5BW

MadridPinar 5, 28006 · Madrid

Windows App Studiohttp://appstudio.windows.com/

Categorías de Apps

Social

Herramientasy productividad

Entretenimiento

Informacióny promoción

Juegos

Información y promoción

Macy’s NY Times CNN Yelp Engadget

All Recipes Men’s HealthWorkouts

ArsenalBlog

Las VegasGuide

PGA Tour

¿Qué es Windows App Studio?

Desarrollo de Apps basado en web

Muy útil para Apps de Información y Promoción

Para la plataforma Windows

Usa, comparte o publica en el Store

Extiende o mejora tus las apps con código

Principios de App StudioWindows App Studio es una herramienta online, gratis y fácil que permite convertir tus ideas en Apps para Windows

Nuevos usuarios pueden crear aplicaciones de calidad siguiendo los principios de diseño de Microsoft de manera sencilla y publicarlas al Store.

Nuevos desarrolladores y entusiastas pueden iniciarse en el desarrollo de Apps para Windows y continuar con Visual Studio

Desarrolladores con experiencia pueden implementar prototipos rápidamente y modificarlos con Visual Studio para incrementar su velocidad de desarrollo.

Make your app look greaton any size screen or window!Llega Windows 10 a nuestro trabajo y a nuestra casa.

La nueva Universal Windows Platform UWP para Windows 10 culminala evolución de las Universal Apps creadas para Windows 8.1 yWindows Phone 8.1.

Apps nativas que nos permiten tener un único código para una gran familiade dispositivos.

Visual Studio 2015 & Windows 10 ToolsVS2015 trae muchas novedades para las Apps universales de Windows 10:• Nuevos controles (XAML)• Total rediseño de los controles existentes• Nuevos emuladores• Nueva configuración de los paquetes Nuget (project.json)• Una tienda unificada• Nuevas familias de dispositivos (IoT, Hololens)

¿Qué nos ofrece el SDK y la plataforma?Nuevos controles además de un total rediseño de los ya existentes. Los controlesse adaptan al input de la plataforma (raton y teclado, lápiz, dedo, etc.)

Diseño con capacidad de respuestaPoder trabajar en pixeles efectivos que nos fácilitan adaptar los textos ytamaños en función del tamaño y resolución de la pantalla.

AdaptativeTriggersUna forma fácil y flexiblepara cambiar propiedades de controles XAML en diferentes anchos de pantalla.

… por contra:Crean mucho XAMLNo afectan a losDataTemplatesNo dan flexibilidad para compartirlos entre páginas

Estrategias Responsive: The six R’sSeis estrategias para que nuestro contenido se ajuste sacando el mayor partidoal ancho de pantalla disponible:

• Resize• Reflow• Reposition• Reveal• Rearchitect• Replaze

ResizeNo limitar los elementos a dimensiones fijas y dejar que ocupen el espacio delcontenedor.

ReflowAdaptar el contenido al tamaño de la pantalla, variando la disposición enpantallas más grandes.

RepositionRecolocar el contenido en pantallas más pequeñas, usando inclusoScroll Vertical

RevealRevelar y ocultar información. Una de las más efectivas: llevar contenido a otrapágina, a elementos de un pivot o a un SplitView.

RearchitectPensar en arquitecturas y jerarquías diferentes. Por ejemplo, en tener o nopágina de detalle en función del “DeviceFamily”

ReplaceRemplazar elementos pensando en pantallas pequeñas, por ejemplo, cambiarun menú horizontal de vista desktop a acciones secundarias de el AppBar enmóvil o cambiando menus verticales en Desktop por Pivots en móvil.

SoluciónVemos la solución adoptada en Windows App Studio en una pequeña

DEMO

Windows App Studio

http://appstudio.windows.com/https://github.com/wasteam/

waslibs

Preguntas

¡Muchas gracias! @mvegaca