• Save

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

Like this? Share it with your network

Share
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
2,011
On Slideshare
2,011
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
3
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • My presentation – universitate, msp, interests in MS products,Questions to know each other- Programming level, Silverlight, Design
  • GoalsHighest priority: delighting the user. Consistency : One sees the phone and when buying another brand- same experienceChoice : flexibility, choice of color, keyboard : DIVERSITYDeveloper: largest possible coverages of users – little change in hw design – no more testing for many screen sizes, processors etcThus consistency will standardize the choisability
  • Cheap: VS Express for Phone + Blend 4 for Phone + Students are exempt from annual subscription fee in Marketplace 2: easy to use, reliable technologyStandardized: apps created for a specific model will run the same and have same appereance on same class of devices.Tools: reuse of skills : C# and XAML + extensive set of apis that enable users to easily start.Users experience: powerful code + good designer will make it happen
  • 1Two flavours : XAML and XNA2 One download to setup, extra dowload for Blend3 Cloud services – apps can be yours(u build, u consume + Azure), theirs(WCF and their apis: Twitter), MS4
  • Apps usually in SL Games usually in XNA
  • These are the principles that guide the experiencePersonal – it‘s a personal device – allow user to add it on main screenRelevant – relevant to user interaction and location of userSocial – reffers to friends location
  • Use the color
  • It‘s built in and nice to show. But it‘s like in an action movie: if it is 100% action you‘ll finish the movie tired. Same applies here – too much animaton can bother and tire the user
  • Are a way of building consistent experienceSilverlight is flexible and you can make new controls - but be consistentPay attention to : - interaction - visual style - motion
  • Light experience with less buttons in bar
  • Focuses user on a single taskSplits experience in multiple single tasks
  • Very used – allows to build pretty immersive exp
  • Not all experiences needs to be a hub
  • 0Examplesfor SL 3 apply to the Phone12 the text box has a associated sw keyboard, list have implemented phisyx3 same video experience, sensors : vibr, location services4 app is part from experience – same look as Phone5 security concerns – relax cross-domain policy check
  • Start the dev of sample application – text block in XAML and code
  • Importable from designers‘ PhotoshopNo demo yet
  • Demo with Ellipse
  • VS can create the events for youOr you can create them by handDefault event handler for Button – Click eventOr by double clicking
  • Grid – layout system, not semantic informational display
  • Attached propertiesA ball doesn‘t now its position, but the parent can provide it.Canvas – not so flexible, phone can be rotatedStack panel Grid – rows : auto or * or pixels
  • Ball pulsing demo app - animation in Blend - call it from code

Transcript

  • 1. Silverlight programming on Microsoft Phone
    Radu Poenaru
    Microsoft Student Partner
  • 2. Today‘s agenda
    Introduction in Windows Phone 7
    Silverlight for Windows Phone
    Blend design
    LINQ
    Lunch break
    Building our Twitter Client
  • 3. Let‘s start!
    • Introduction in Windows Phone 7
    Silverlight for Windows Phone
    Blend design
    Lunch break
    Building our Twitter Client
  • 4. New Start
    Philosophy
    Customer
    Design
    Experience
    Platform
  • 5. Integrated Experiences
    PEOPLE
    OFFICE
    PICTURES
    MUSIC+VIDEO
    MARKETPLACE
    GAMES
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 6. Hardware
    Common hardware
    Common platform
    Many producers
    HTC
    Samsung
    LG
    Etc
    • Only one resolution at launch: 800 x 480 pixels
    • 7. Second resolution will be added later: 480 x 320
    • 8. Identical touch Input
    • 9. Consistent processor and GPU
    • 10. Identical RAM size
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 11. Applications
    people + standards + server code + client code  experiences
    Browser
    Web Site
    Web API
    Hosted in the Cloud
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 12. Windows Phone Team goals
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 13. Application Platform
    Runtime – On “Screen”
    Tools & Support
    Tools you use to design & develop
    Code you write on the client
    Phone Emulator
    Sensors
    Media
    Data
    Location
    Samples
    Documentation
    Xbox LIVE
    Notifications
    Phone
    Guides
    Community
    .NET Framework managed code sandbox
    Packaging and Verification Tools
    SCREEN
    CLOUD
    Cloud Services
    Developer Portal Services
    Notifications
    App Deployment
    Registration
    Marketplace
    Code you write on the server
    Tools you use to ship & sell
    Validation
    MO and CC Billing
    Location
    Identity
    Feeds
    Certification
    Business Intelligence
    Maps
    Social
    Publishing
    Update Management
    Presentation Title | PP | DD Month YYYY
  • 14. Two different approaches
    • High performance game framework
    • 15. Rapid creation of multi-screen 2D and 3D games
    • 16. Rich content pipeline
    • 17. Mature, robust, widely adopted technology spanning Xbox 360, Windows, and Zune
    • 18. Modern XAML/event-driven application UI framework
    • 19. Rapid creation of visually stunning apps
    • 20. Metro-themed UI controls
    • 21. HTML/JavaScript
    • 22. 500,000 developers spanning Windows and web
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 23. Common features for SL and XNA
    Input
    Touch
    Hardware buttons
    Media
    Digital media capture & playback
    Media library access
    Data
    Isolated storage
    LINQ for both Objects and XML
    .Net
    Superset of Silverlight 3
    WCF – SOAP and REST services
    Phone access
    Integrated access to Phone UI
    Sensors
    Pickers for contacts and photos
    Integration with Cloud Services
    App deployment and updates
    Notifications
    Location
    Xbox LIVE
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 24. What am I producing?
    myapp.xap
    Tools
    • One format for all Windows Phone apps & games
    • 25. Simple, declarative, manifest-based installation
    • 26. Tightly integrated into security model of phone
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 27. Pathway to the customer (1)
    Tools
    myapp.xap
    Windows Phone device
    Windows Phone
    Emulator
    Tests with hardware and beta testers
    Development Stage
    Developer tests
    Presentation Title | PP | DD Month YYYY
    Microsoft Confidential
  • 28. Pathway to the customer (2)
    Submit & validate
    Certify and sign
    Packaging & Verification Tools
    Developer
    Microsoft portal
    Customer
    Windows Phone Application Deployment Service
    Marketplace
  • 29. UI and design – Metro experience
    Three important things:
    Personal
    Weather surfaced on the live tile in Start
    Relevant
    Weather updated based on your location
    Connected
    Weather for your contacts
  • 30. Themes
  • 31. Typography
    Make words feel welcome
    Pay attention to balance,
    weight & scale
  • 32.
  • 33. Motion
    Use motion to delight the user
    Remember that pacing is important: the more
    you use it, the less special it becomes
  • 34. Make It Easy to Use
    Familiar = Easy to use
    Provide consistent and predictable experience
  • 35. Hardware Implications
    Hardware buttons
    Optional landscape
    keyboards
    Design for one hand usage
    whenever possible
  • 36. Gestures
  • 37. Touch
    Recommended touch target size is 9mm
    Minimum touch target size is 7mm
    Minimum spacing between
    elements is 2mm
    Visual size is 60-100% of the touch
    target size
  • 38. Common controls
  • 39. Application Bar + Menu
    Up to 4 Icons
    You don’t need to fill all 4 controls
    Swipe up the bar to bring up the menu
  • 40. Tabs
    Separate multiple tasks
    Tap or flick tabs to change them
  • 41. Hubs
    Rich experience
    Aggregate multiple sources
  • 42. Hubs vs. Single-Page Apps
  • 43. Iconography
    Icons in the application menu
    should be consistent
    Test icons with users
    (pay attention to context)
  • 44. Sources of information
    Official Microsoft Phone website: http://www.microsoft.com/windowsmobile/en-gb/default.mspx
    Windows Phone for developers http://developer.windowsphone.com/
    Windows Phone UI Design http://microsoftfeed.com/2010/windows-phone-ui-design-and-interaction-guides/
    Mix 2010 event http://live.visitmix.com/Sessions
  • 45. Questions ?
  • 46. Today‘s agenda
    Introduction in Windows Phone 7
    • Silverlight for Windows Phone
    • 47. Blend design
    LINQ
    Lunch break
    Building our Twitter Client
  • 48. What we are trying to achieve
    How to create a simple Silverlight app
    Use Blend 4 for Phone for design
    http://70gigapixel.cloudapp.net/
  • 49. What is Silverlight?
    “Silverlight is a powerful development platform for creating engaging, interactive user experiences for Web, desktop, and mobile applications when online or offline.”
    Microsoft Official Silverlight website
    http://www.silverlight.net/
  • 50. Silverlight
    Very powerful framework
    Same known XAML and C#
    Windows, Mac, Linux and now Phone
    Learning curve is smooth
  • 51. Silverlight capacities
    Data
    Inputs
    Base Class Library (BCL)
    XAML
    UI Core
    Windows Communication Foundation
    Media
  • What about Silverlight for Phone
    It is a superset of Silverlight 3 having several elements from Silverlight 4 and many extras:
    Performance tuning
    Input integration
    Hardware media and sensor integration
    OS application model integration
    Relaxed sandbox constraints
  • 69. Let‘s see some code
    XAML – eXtensible Application Markup Language
    XML with custom tags
    Maps to code
    Can contain as children
    resources
    styles
    controls
    supports binding
    Anything that is done in XAML can be done in code
    Let‘s see some demo
  • 70. Shapes
    Vector- based
    Easy to scale, keeping the smoothness
    Can be easily imported from Photoshop or Illustrator
    Example(ellipse code):
  • 71. Brushes
    Determines how objects are painted and outlined
    Solid – filled with just one color
    Gradient – linear or radial with multiple stop points
    Image – shows an image in the brush
    Media – paints with a playing movie
    Let‘s see a Demo!
  • 72. Controls
    Encapsulate functionality
    Requires a x:Name if you plan to call it from the code
    Same properties in XAML as in Code
  • 73. Events
    Can be created in XAML and Code
    XAML editor helps you create a handler
  • 74. Layout containers
    Flexible Layout system
    Canvas – fixed position
    StackPanel – „Stacks“ dynamically
    Grid – rows and columns, very flexible
    Can be nested – but beware of performance issues
  • 75. Demo
    Layout demo
    Attached properties
  • 76. Transforms
    Alters any element
    Controls
    Text
    Media
    Transforms
    Rotate, Scale, Skew ,Translate, Matrix
    Projections
    Plane, Matrix,
    Apply 3D to a 2D element
  • 77. Animations
    Animates a property value over the time
    Basic elements in a page
    Contains one or more Storiboards
    Contains one or more Animations
    Contains one or more Keyframes
    Expression Blend is the best tool to do this
    Let‘s see some demo!
  • 78. Styling
    Applies a set of values to a specific target type
    Created in page Resources, application Resources or a ResourceDictionary
    Requires
    x:Key
    TargetType
    On the element – StaticResource pointing to the x:Key
  • 79. Binding
    Connects data to UI
    Two types
    Property binding
    List binding
    Value converters – ex take color Red and convert it to hex representation
    Based on change notification
    Cascades through the hierarchy of controls
    Let‘s see a demo
  • 80. Code reuse
    Reuse UI
    User controls
    Custom controls
    Reuse code
    Across projects
    Across platforms – Web, Desktop through OOB, Phone
  • 81. References
    Search for Silverlight 3 source:
    Forums, books, podcasts
    http://silverlight.net
    http://www.stackoverflow.com
    Get Started with Silverlight for Windows Phone http://www.silverlight.net/getstarted/devices/windows-phone/
    Silverlight for Windows Phone forum http://forums.silverlight.net/forums/63.aspx
    Mix 2010 event http://live.visitmix.com/Sessions
  • 82. Today‘s agenda
    Introduction in Windows Phone 7
    Silverlight for Windows Phone
    Blend design
    • LINQ
    Lunch break
    Building our Twitter Client
  • 83. LINQ
    “LINQ is a set of extensions to the .NET Framework that encompass language-integrated query, set, and transform operations. It extends C# and Visual Basic with native language syntax for queries and provides class libraries to take advantage of these capabilities.”
    LINQ website
  • 84. Flavours of LINQ
    LINQ to Entities
    LINQ to SQL
    LINQ to XML
    LINQ Over DataSet
    LINQ to CSV
    etc
  • 85. LINQ syntax
    Similar syntax with MSSQL and other flavours of SQL
    Differences
    For enabling Intellisense, first you have to set the from clause
    The last one is select
    • Query taken from 101 LINQ Samples
    http://msdn.microsoft.com/en-us/vcsharp/aa336746.aspx
    Hint : it is easier found on Bing than typing this link
  • 86. Get Twitter data
  • 87. Comments and sugestions are welcome!
    radu.poenaru@studentpartners.de
    www.radupoenaru.com
    Thank you!