Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Tablet and Slate Development with Silverlight


Published on

Learn the key to creating engaging customer experiences

Published in: Technology, Education
  • Be the first to comment

  • Be the first to like this

Tablet and Slate Development with Silverlight

  1. 1. Tablet Development with Silverlight Jeremy Likness Project Manager, Senior Consultant Copyright © 2011consulting training design debugging
  2. 2. consulting training design debugging
  3. 3. what we do consulting training design debugging who we are Founded by top experts on Microsoft – Jeffrey Richter, Jeff Prosise, and John Robbins – we pull out all the stops to help our customers achieve their goals through advanced software-based consulting and training solutions. how we do it Training • On-site instructor-led training Consulting & Debugging • Virtual instructor-led training • Architecture, analysis, and design services • Devscovery conferences • Full lifecycle custom software development • Content creation Design • Project management • User Experience Design • Debugging & performance tuning • Visual & Content Design • Video & Animation Productionconsulting training design debugging
  4. 4. Agenda • The Rise of the Tablet • Case Study • Why Silverlight? • From GUI to NUI: A Touchy Subject • Tips and Tricks • Going Native • Windows 8 • Conclusionconsulting training design debugging
  5. 5. The Rise of the Tablet Devices purchased by employee and used at work Employee purchased and used for business Not used Source: IDC (almost 3000 respondants)consulting training design debugging
  6. 6. Consumerization of IT • “Although consumer technologies create new risks for the enterprise, eliminating their use is increasingly difficult, and impractical” – Rich Mogull, Research VP, Gartner • The IT organizations in 26% of enterprises (firms with 1000 employees or more) were planning to implement or had implemented general purpose touchscreen tablets such as the Apple iPad. – Forrsights Hardware Survey Q3 2010, Forrester Researchconsulting training design debugging
  7. 7. The Influence of NUI • Natural User Interfaces are easier to learn • iPhone, iPad, Windows Phone 7 are examples of a touch-first interface • Microsoft Kinect, also a NUI, sold 10 million units in 30 weeks • Users are forcing the enterprise to take NUI seriously • Tablet is a “here and now” technology for deploying NUI • Windows 7 supports NUI, Windows 8 will embrace itconsulting training design debugging
  8. 8. Silverlight is not Dead! • Version 5 to be released late 2011 • The primary development platform for the Windows Phone • 1 million Silverlight developers (Silverlight team blog) • 70% penetration ( • Silverlight Firestarter: DayForce – “1/4th cost to build Silverlight compared to Java” – “1/30th total cost due to reduced load on servers” • Major enterprise adoption, including Fortune 500 companiesconsulting training design debugging
  9. 9. Case in Point: Rooms to Go • Sales people tired of losing their customer by having to walk over to a kiosk to get information • Needed something portable, easy to use, with a friendly touch interface • Didn’t want “that other device” because of security concerns and inability to integrate with their existing Windows-based software • Windows tablet would fit in nicely with existing security infrastructure • Silverlight development allowed them to keep in house expertise for the projectconsulting training design debugging
  10. 10. demo point of sale slate applicationconsulting training design debugging
  11. 11. Why Silverlight? • Connects easily to existing web services • Insanely easy to deploy/install OOB • Leverages existing development team and keeps the technology in house – Familiar languages like C#, VB.NET – Familiar Visual Studio environment • Great for platforms with enterprise features – Integration with existing authentication/authorization (Active Directory) – Security policy enforcementconsulting training design debugging
  12. 12. From GUI to NUI • Silverlight is not touch-friendly “out of the box” • Mouse gestures are promoted but “It’s just not the same” • No multi-touch capability (tracking a “mouse” rather than touch points) • No touch and hold • Applications built without touch in mind will sufferconsulting training design debugging
  13. 13. demo untouchableconsulting training design debugging
  14. 14. Touch Primer • A touch is a point of contact (X = 2.7,Y=5.9)consulting training design debugging
  15. 15. Touch Primer • A manipulation is a continuous touch. The touch may change position and the manipulation may track inertia. Origin = (2,3) Delta = (+2,+3) Duration = 0:0:0.5 Velocity = (+3,+3)consulting training design debugging
  16. 16. Touch Primer • A gesture is a specific, repeatable combination of manipulations that may involve multiple touches. Tap Double Tap Hold Pinchconsulting training design debugging
  17. 17. LightTouch for NUI • Provides the missing touch support • Does not require elevated trust • Parity with the Windows Phone 7 APIs • Powered Rooms to Go • Open source • training design debugging
  18. 18. demo lighttouchconsulting training design debugging
  19. 19. Manipulate 2D Behavior <Touch:Manipulate2DBehavior IsInertial="True" ManipulationStarted="TouchShapeBehavior_ManipulationStarted" ManipulationDelta="TouchShapeBehavior_ManipulationDelta“ ManipulationCompleted= "TouchShapeBehavior_ManipulationCompleted"/> private void TouchShapeBehavior_ManipulationDelta(Object sender, Manipulation2DDeltaEventArgs e) { var senderShape = (Shape)sender; var translateTransform = (TranslateTransform)senderShape.RenderTransform; translateTransform.X += e.Delta.TranslationX; translateTransform.Y += e.Delta.TranslationY; }consulting training design debugging
  20. 20. List Box Scroll Behavior <i:Interaction.Behaviors> <Touch:ListBoxTouchScrollBehavior/> </i:Interaction.Behaviors>consulting training design debugging
  21. 21. Touch Combo Box <Touch:TouchableComboBox ItemsSource="{Binding Collection}" Width="200" HorizontalAlignment="Left" DisplayMemberPath="Title"/>consulting training design debugging
  22. 22. Element Resizing Behavior <Image x:Name="ResizeImage" Source="/Wintellect.Touch.Sample;component/Assets/avatar.png"> <i:Interaction.Behaviors> <Touch:ElementResizingBehavior x:Name="ResizeBehavior"/> </i:Interaction.Behaviors> </Image>consulting training design debugging
  23. 23. Gesture Listener <Touch:GestureService.GestureListener> <Touch:GestureListener Tap="GestureListener_Tap" DragStarted="GestureListener_DragStarted" DragDelta="GestureListener_DragDelta" DragCompleted="GestureListener_DragCompleted" DoubleTap="GestureListener_DoubleTap" Hold="GestureListener_Hold"/> </Touch:GestureService.GestureListener>consulting training design debugging
  24. 24. Tips and Tricks • “Fat Fingers” is no longer just cliché • The fewer touches, the better – Filters instead of searches – Pop-ups instead of combo boxes • A child’s curiosity, or great UX? – Draw the user’s attention – Make it intuitive • Don’t forget about the SIP!consulting training design debugging
  25. 25. demo the software input panelconsulting training design debugging
  26. 26. Going Native (with Silverlight) • Elevated trust and nothing to share with Windows Phone 7 • Native Extensions for Silverlight (NESL) • • COM Wrapper for Windows 7 Touch • Requires additional steps in your installation packageconsulting training design debugging
  27. 27. NESL Touchconsulting training design debugging
  28. 28. Windows 8consulting training design debugging
  29. 29. Windows 8: What we KNOW • First-class touch experience • Designed to target multiple platforms and processors – instead of a runtime like Silverlight, Windows 8 will meet the hardware on its own turf • HTML5 + JavaScript environment will be available • Fallback to existing shell • Will support existing applications (yes, that means Silverlight too) • There are still millions of Windows XP machines and XP will end of life – it is likely Windows 7 will be the stepping stone, not Windows 8consulting training design debugging
  30. 30. Windows 8: What we SUSPECT • Jupiter is a Xaml runtime • Xaml technology will remain • Something similar to Silverlight will exist, but likely will be closer to the OS and native to Windows 8 rather than part of a lightweight, portable runtime • We should be able to use our favorite languages like C# to develop, but there will be a lot more focus on native (C++) experiences as well • We’ll know a heck of a lot more coming out of BUILD than we will going into itconsulting training design debugging
  31. 31. Your Reality Check (HTML5) • HTML5 won’t be finalized for years • Technology outpaces standards bodies • Touch is still “new” to HTML5 – Supported only by smart phones and special desktop builds – Specification still in flux • Other technologies will continue to fill gaps – Native code (WPF, Surface SDK, Objective-C, etc.)consulting training design debugging
  32. 32. ROI: Today’s Skills Tomorrow • HTML5 and multi-touch – Manipulations are similar (touch start, touch move, and touch end) – Touches (fingers), targets (touches on the interesting element), changes (finger removed) • JavaScript – you still need to know the APIs – Even on Windows 8 will likely rely on hooks – “Not your mama’s JavaScript” – today’s JavaScript plus JQuery includes classes, inheritance, even the “namespace” concept – Good coding practices are good coding practices • Xaml is likely to remain • Why do we love Silverlight? • Xaml + C# (VB/F#/etc.) + Visual Studio + Portability • BUILD, BUILD, BUILDconsulting training design debugging
  33. 33. Example: SVG and XAML HTML5 Silverlight SVG Xaml Graphics SVG Styles Resource Dictionaries Canvas Canvas/WriteableBitmap Audio/Video Audio/Video CSS3 Grid Layout (DataGrid, Panel…) CSS3 WOFF Typography CSS3 Transforms Transforms DOM Visual Tree/Event Model Timer DispatcherTimer Web Storage Isolated Storageconsulting training design debugging
  34. 34. Remember! • Jounce for your MVVM framework – • LightTouch for your NUI – • Follow @JeremyLikness for Silverlight updates: – training design debugging
  35. 35. Questions? Jeremy Likness Project Manager, Senior Consultant jlikness@wintellect.comconsulting training design debugging