1 / 25

6000 Greenwood Plaza Blvd Suite 110 Greenwood Village, CO 80111 303.798.5458 aspenware

6000 Greenwood Plaza Blvd Suite 110 Greenwood Village, CO 80111 303.798.5458 www.aspenware.com. Expression Blend 5 For Developers. Design Your XAML or HTML5 & CSS3 UI Faster. Ben Hoelting @ benhnet. Ben Hoelting.

chessa
Download Presentation

6000 Greenwood Plaza Blvd Suite 110 Greenwood Village, CO 80111 303.798.5458 aspenware

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 6000 Greenwood Plaza Blvd Suite 110 Greenwood Village, CO 80111 303.798.5458 www.aspenware.com Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster Ben Hoelting @benhnet

  2. Ben Hoelting In truth, he’s just a big kid. He loves designing systems that solve real world problems. There is nothing more satisfying than seeing something you helped develop being used by the end users. Ben is also involved in the technology community and runs the South Colorado .NET user group. He also enjoys speaking at tech groups and events around the country. Ben Hoelting @benhnet b.hoelting@aspenware.com

  3. Agenda • Who needs Blend Anyway? • Blend Decoded • Blend for XAML • Blend for HTML Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  4. Who needs Blend Anyway? Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  5. UX Design Process Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  6. Who Needs it? • Developers are not Designers and Visual Studio is not a Design Tool! • Blend can import UX Designs to get you started. • Designers can use Blend to finalize the UX. Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  7. More than Visual Studio • VS XAML Designer is a subset of the one used by Blend • Blend has more Features: • State Management • Animation/Storyboarding Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  8. Blend Decoded Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  9. UI Overview Panel Menus Artboard Tools Panel Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  10. Tools and Selectors • Selection • Select objects and edit their properties • Direct Selection • Select objects and edit their path segments Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  11. “GEMS” • Gems provide context sensitive commands Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  12. Panels Projects Assets Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  13. Panels Cont. Triggers States Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  14. Panels Cont. Objects and Timelines Properties Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  15. Panels Cont. Resources Data Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  16. Blend UI and Import Demo Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  17. Blend For XAML Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  18. Blend for XAML Highlights • Stable V5 Version of XAML Editing • Visual State Designing • Storyboard/Animation Designing • Import Adobe Files Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  19. Blend For XAML Demo Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  20. Blend For HTML Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  21. Blend for HTML Highlights • Impressive CSS Editor • Accurate Rendering • Renders Dynamically Generated Content onto the Artboard • Interactive Mode – Sweet…! Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  22. Blend For HTML Demo Expression Blend 5 For Developers Design Your XAML or HTML5 & CSS3 UI Faster

  23. Designing Apps with Blend Blend is for XAML and HTML Blend Implements the Design UX Design Matters • Blend can implement the UX Design in both XAML and HTML for Windows Store Apps. Expression Web is used for designing web based HTML apps. • Blend has some built in functionality to import the output from the UX design. Implementing the UX design is easier in Blend than in Visual Studio. • Don’t discount the importance of UX design. If you pay attention to the details, you will delight your users. Outputs from UX design usually don’t convert to code.

  24. Resources: Step by Step Expression Books http://blendinsider.com/ http://www.microsoft.com/expression/ http://msdn.microsoft.com/en-us/library/cc295790.aspx http://msdn.microsoft.com/en-us/library/cc296227.aspx http://msdn.microsoft.com/en-us/library/cc295346(v=Expression.40).aspx

  25. Ben Hoelting In truth, he’s just a big kid. He loves designing systems that solve real world problems. There is nothing more satisfying than seeing something you helped develop being used by the end users. Ben is also involved in the technology community and runs the South Colorado .NET user group. He also enjoys speaking at tech groups and events around the country. Ben Hoelting @benhnet b.hoelting@aspenware.com

More Related