Archive
.toolbox events in May – Free Blend training in Chicago, New York, Boston and Austin
.toolbox is going on the road!
The .toolbox site is hosting 4 events in May. These interactive workshops are focused on improving your skills with Expression Blend and Silverlight. Topics covered include:
- the Blend workspace
- prototyping with SketchFlow
- drawing and animation
- importing artwork from other tools
- styling and skinning controls
- transitions and effects
- adding interactivity with behaviors
- and whatever else we can fit in based on time and interest of attendees
Who should attend?
- designers who want to build on their interaction skills
- developers who want to learn Silverlight
- developers who want to improve their Silverlight UI skills
When and Where will the events be held?
- May 7 – Wyndham Hotel, Chicago – register
- May 11 – Crowne Plaza Times Square, New York – register
- May 14 – NERD Center, Boston – register
- May 26 – Intercontinental Stephen F. Austin, Austin – register
Are these the same events as the Silverlight Design Days?
Yes. If you have already registered for a Silverlight Design Day you do not need to register again. The good news is that along with the re-branding of the events we have also added seating at each event. When we started these workshops in February, the .toolbox site was not live yet, but now we’re ready to celebrate and shout out its name.
Will these events be as entertaining as the Conan O’Brien show you just saw?
I can’t play guitar, but I hope to make the events engaging. I will be there presenting along with some other local stars to be confirmed shortly.
I can’t make it to an event, but I still want to learn, where do I go?
The .toolbox site, of course!
Other sites with Expression Blend and Silverlight tutorials include:
- Expression Blend team blog
- Expression Forums
- Eyes of Blend tutorials
- Flash to Silverlight Guide
- Dynamic Prototyping
- Silverlight Switch
- Kirupa.com
- Videos from Victor Gaudioso
- Nibbles Tutorials
- Lynda.com
- Hope to see you there! If you plan to attend, feel free to let me know here or @adkinn
Answering “What is SketchFlow?” in 90 seconds
This video of Jon Harris deftly explaining the power of Expression Blend and SketchFlow in 90 seconds was already shared by Christian Schormann, but I wanted to post it here too as an easy way to share and view the video.
Topics covered include: Navigation and Flow Map, Sketchy Styles, Client Player, Interactivity, Text and Ink Feedback, Viewing Feedback in context, Exporting to Word for Documentation
A few cool new features added in Expression Blend 4 RC
In accordance with the release of Silverlight 4 and Visual Studio 2010, Expression Blend 4 RC was released yesterday and is available for download.
With the release of Blend 4 Beta, just a month ago this isn’t a major release, but there a few cool new features I thought would be useful to point out.
Make Layout Path option
The new menu option allows for more convenient and intuitive PathListBox creation.
- Draw a shape or Path
- Right-click the shape or Path and select Path –> Make Layout Path option
- Inspect the Object panel and you will find Blend has generated a new PathListBox and set the selected shape or Path as the Layout Path
Simpler PathListBoxItem binding
One of the first handy tricks you see with the PathListBox is that you can change properties of an item based on its location on a path. This is done by binding properties like Opacity and Scale of the item container to its own GlobalOffset property. In the beta this was only possible by entering the XAML by hand, but the team has added more support for Template Binding which exposes this functionality on a few clicks.
The easiest way to show this feature is to use design-time data so we’ll take advantage of Blend’s ability to create Sample data quickly for us. We’ll start by repeating the steps from above first.
- Draw a shape or Path
- Right-click the shape or Path and select Path –> Make Layout Path option
- Inspect the Object panel and you will find Blend has generated a new PathListBox and set the selected shape or Path as the Layout Path
- Now, in the Data panel, click “New Sample Data” and hit OK.
Select the “Collection” node in the data panel, click and drag it over to the PathListBox in the Objects panel. When you see a tooltip that reads “Data bind [PathListBox].ItemsSource to Collection” release the mouse.
You should end up with a PathListBox like the image to the right. At this point you may want to arrange the Path to be behind the PathListBox, so the items are shown in front of the Path fill.
- Right-click the PathListBox and from the context menu select: Edit Additional Templates -> Edit Generated Item Container (ItemContainerStyle) –> Edit a Copy…, hit OK
- Now in template editing mode, select [Grid] in the Objects panel and open the Properties panel.
Find the Opacity property and click the Advanced options square (the yellow highlighted square in the picture to the right). - From the Advanced options menu select Template Binding –> GlobalOffset.
If everything is setup properly, you should see the items closer to the start of the Layout Path have less Opacity, matching the value of their offset.
- Exit template Editing mode and select the PathListBox. Try changing the Padding, Start and Span properties to get a feel for how the GlobalOffset property works.
PropertyChangedTrigger added
A new trigger has been added to the Expression Blend SDK called PropertyChangedTrigger. As the name implies, an action can now be triggered when a property changes. Simple in concept but a useful addition. The following steps provide a simple demonstration.
- Draw a Rectangle
- Add a Button
- Create a Storyboard animating the Rectangle to a new noticeable position.
- Add a ChangePropertyAction to the Button, keeping the Click event as the default trigger.
- For the TargetObject of the ChangePropertyAction use the new element picker to select the Rectangle and in the dialog, select Effect.
- Set the Value of the ChangePropertyAction to a New BlurEffect.
- Now add a ControlStoryboardAction to the Rectangle.
- For the Trigger, click New and from the dialog select a PropertyChangedTrigger.
- Set the Binding property of the Trigger to the Rectangle using the element picker and select the Effect property.
- Set the Storyboard property of the ControlStoryboardAction to the name of the Storyboard you created (default is “Storyboard1”).
Now run the project and click the button. On click of the button the ChangePropertyAction is triggered to add the BlurEffect to the Rectangle. On change of the Effect property, the ControlStoryboardAction is triggered and your storyboard should play animating the Rectangle.
This is a super simple example, but ideas should already be popping into your head where this new Trigger could be useful.
Documentation and Search links added for Behaviors
The last feature to point out is simple but elegant. When a behavior is selected, links are displayed at the bottom of the Properties panel that lead directly to documentation or an online search that opens in your browser. Easy access to learn how to use Behaviors form the Expression Blend team and the community.
Can’t wait for the final release!
18,230 miles, 8 events, 1 vacation and 25 pictures later…
Starting with MIX10, I’ve been on a bit of an odyssey the last month. My itinerary looked something like this:
- MIX10 – Workshops, @Ch9Live shows, my Flash skills session and having a great time with attendees
- go home for the weekend
- London trip – presented MIX10 Recap at Edge UG meeting, Silverlight Design Day London, Silverlight UK User Group, NxtGenUG Coventry
- Dublin trip – presented SketchFlow at IXDA Dublin and MIX10 Recap at MTUG Meeting
- go home for the weekend
- Washington DC trip – actual vacation time acting as a chaperone on my son’s 6th grade class trip.
I’ve posted a few of my favorite photos on Flickr of London, Dublin, and Washington DC.
Thanks to all of those who acted as hosts for the events, attended the events and hung out in proper English or Irish pubs (and the occasional Vegas casino bar) afterwards. I had a great time discussing all of the great news about Windows Phone, Blend 4 and IE9 from MIX10.
And now to return this week with Visual Studio 2010 and Silverlight 4 releasing along with the announcement of the KIN, there is a ton of fun to be had and work to be done.
Now, back to work…
FXG Import for Expression Blend previewed at MIX10
This is an excerpt from the day 1 keynote at MIX10, of Jon Harris building a Windows Phone application in Expression Blend. Although the demo is slick, the main thing I wanted to point out here is the preview of the FXG Import, which is shown in the first minute. More then a few people noticed this feature and I wanted to provide an easy way to see it in action.
Import FXG file into Blend > Edit in Illustrator > file auto updates in Blend
Design/Development Workflow++
You won’t find the Import feature included in the current Blend 4 Beta bits yet. The feature is being built out as an extra add-in similiar to the add-in for Windows Phone development. This way the feature can be released and updated outside of the major Blend releases, allowing it to stay in synch with the latest versions of FXG.
Silverlight and Blend events tour this week in England and Ireland
I jokingly told many of my friends at MIX from the other side of the Atlantic that I would be chasing them home. The truth is, I am heading to England and Ireland this week and will be participating in a few events along with a workshop of my own device.
Most of the events will be a local recap of the amazing MIX10 event with the exception of the IXDA Dublin event and the Silverlight Design Day workshop. Being a “Silverlight and Expression Blend” guy myself, I hope to skew the MIX recap discussions towards RIA and Windows Phone as much as possible. Here is the agenda for the next two weeks:
Tuesday, March 23rd
Mini-MIX at the Edge UG
London, UK
18:30 – 20:30
Wednesday, March 24th
Silverlight Design Day – London
Chertsey, UK
8:30 – 17:00
Silverlight UK User Group
London, UK
18:00 – 21:30
Thu, March 25th
MixGenUG – Coventry
Coventry, UK
19:00 – 21:00
Mon, Mar 29th
The Blend Experience – IXDA Dublin
Dublin, Ireland
18:15 – 21:00
Tue, Mar 30th
Best of MIX at MTUG
Dublin, Ireland
19:00 – 21:00
Happy to confirm that I will be heading over there to meet up with friends, I am glad to say the other joke about me riding back in one of their suitcases is not true. I get to ride in tiny seat watching MIX10 videos the whole way, like everyone else.
Install checklist for Silverlight 4 RC, Blend 4 Beta and Windows Phone Developer tools from MIX10
I’m upgrading my machines to the latest bits and I haven’t seen an aggregated list of all the Silverlight, Blend and Windows Phone tools yet, so I thought I’d post mine. As an extra bonus I’ll add the extra links for training and documentation resources.
This list is for the full setup for Silverlight 4 RC and Windows Phone development.
1. Visual Studio 2010 RC
If you need help downloading and installing this bad boy, here’s a video from Channel 9 explaining the process.
2. Silverlight 4 RC Tools
One setup file that installs the Developer Runtime, Tools for Visual Studio, SDK and WCF RIA Services.
3. Expression Blend 4 Beta
One setup file that installs the Blend SDK for Silverlight 4, Blend SDK for .NET 4
4. Windows Phone Developer Tools
Installs Visual Studio 2010 Express for Windows Phone CTP, Windows Phone Emulator CTP, Silverlight for Windows Phone CTP, XNA 4.0 Game Studio CTP
5. Expression Blend Add-in Preview for Windows Phone
Windows Phone development integration add in for Blend.
6. Expression Blend SDK Preview for Windows Phone
Project templates for Windows Phone development in Blend.
7. Silverlight 4 Toolkit (optional)
No new update yet, but the version released in November still works
- And with those files installed you are ready for Silverlight 4 RC and Windows Phone development. Enjoy!
Expression Blend 4 Beta Feature Overview available for download
Expression Blend 4 Beta is out in the wild and available for download! As a companion whitepaper, check out the Expression Blend 4 Beta Feature Overview which provides a walkthrough of the new features. Here’s where we begin:
Introduction
Expression Blend 4 Beta adds support for Silverlight 4 and Windows Presentation Foundation 4, while maintaining the ability to create and edit Silverlight 3 and WPF 3.5 with Service Pack 1(SP1) applications. Interoperability with Visual Studio 2010 has been added, maintaining the seamless workflow between the two tools.
In response to customers’ desires to do more without code, new features in SketchFlow enable more dynamic prototypes to be created and provide an enhanced player experience. Additionally, Expression Blend 4 Beta adds powerful new behaviors for all application types and makes them configurable with conditional statements.
Expression Blend 4 Beta introduces new features that support the Model-View-ViewModel (MVVM) pattern for business application development. New design-time data and resource features, along with behaviors such as CallMethodAction and InvokeCommandAction greatly increase the capability and experience for design tasks while building these applications.
Along with these three areas of focus, other additions include: new controls, such as the PathListBox, new pixel shader effects, transition effects and helpful tooling improvements.
Expression Blend 4 Beta is an exciting update that continues to revolutionize the speed and efficiency with which you can take your ideas from concept to completion on the Silverlight and .NET platforms.
The rest of the paper is divided into the following topics:
- SketchFlow Improvements for Better Prototypes
- Enabling Business Application Development with MVVM
- New Controls and Effects for Dynamic Interfaces
- More Interactivity and Less Code with New Behaviors
- Editor and Tooling Improvements
- and Expression Blend Resources
I hope you find the Expression Blend 4 Beta Feature Overview useful and that you share your feedback. We want to make sure the overview for the final release is even better!
What I’ll be doing at MIX10 – sessions, events and Channel 9 Live!
Packing now, flight takes off in 8 hours and MIX10 starts tomorrow!
I’ve posted this on twitter, but I believe this is going to be the best MIX ever. Windows Phone is already huge, keynote demos are rocking and there are a ton of interesting sessions. And a lot of those are coming from external speakers, which is a great way to learn from those who do the design work and use the tools in the real world.
My schedule is packed and I thought I’d share some of the sessions and events I’m looking forward to:
Sunday
09:00 – Microsoft Silverlight 4 Boot Camp
John Papa and Mike Taulty share their immense Silverlight knowledge and teach of the Silverlight Fu.
09:00 –Design Fundamentals for Developers (and Other Non-Designers)
Robby Ingebretsen provides an encore presentation of his wildly popular session to help others learn about user-centric design, whitespace, color theory & other important concepts
13:30 – Design Tools and Techniques
Arturo Toledo and the good people from Archetype will be sharing lessons learned from doing amazing design work with Silverlight and Expression Blend.
22:00 – MIX10 Tweetup
Early birds will enjoy free drinks (until the tab runs out) and an unlimited character conversation with other MIX10 attendees. Non-attendee guests and significant others are welcome.
Monday
09:00 – Day 1 Keynote
Streamed live at http://live.visitmix.com, definitely not one you want to miss!
10:30 – MIX10 Day 1 Keynote After Party – (live stream)
Recapping the announcements and answering all your questions from the Day 1 Keynote
Who: John Papa, Adam Kinney, Loke Uei Tan and Nic Fillingham
Ask questions via @ch9live
11:30 – Syncing Audio, Video and Animations in Microsoft Silverlight Applications
Silverlight MVP Dan Wahlin discusses an animation project created for a Fortune 500 company and demonstrates tips and tricks that can be used to keep various assets synced so that audio and video clips can be started at specific times as a storyboard plays.
12:05 – Designing Rich Experiences for Data-Centric Applications
Come hear Ken Azuma discuss how to design better experiences for data-centric applications from someone that has designed and developed many successful business applications using an array of UX technologies.
14:00 – Authoring for Microsoft Silverlight 4 with Microsoft Expression Blend
Christian Schormann and Peter Blois explore how Expression Blend lets you design and build rich, vibrant Silverlight 4 applications.
15:30 – Windows Phone UI and Design Language
Windows Phone constitutes a dramatic new user experience paradigm. This session will provide prescriptive guidance, tips, and techniques on how designers & developers can build beautiful, compelling user experiences that are consistent with the built-in Windows Phone 7 Series experiences
16:00 – UI Design with Expression Blend for the Windows Phone 7 Series – (live stream)
Who: Christian Schormann, John Papa, Adam Kinney
Ask questions via @ch9live
17:00 – MIX10 Day 1 Wrap Up Edition – (live stream)
Who: Adam Kinney, John Papa, Jeff Sandquist and Dan Fernandez
Ask questions via @ch9live
17:00 – Ask the Experts
MIX speakers, Microsoft team members and members of the web community will be available to answer your questions and take your feedback at this informal reception.
I’ll be by the Silverlight and Expression tables with the rest of the crew.
Tuesday
09:00 – Day 2 Keynote
Streamed live at http://live.visitmix.com
10:30 – MIX10 Day 2 Keynote After Party – (live stream)
Recapping the announcements and answering all your questions from the Day 1 Keynote
Who: Scott Hanselman, Giorgio Sardo, Adam Kinney and Nic Fillingham
Ask questions via @ch9live
11:30 – Touch in Public: Multi-touch Interaction Design for Kiosks and Architectural Experiences
Multi-touch capabilities in Windows 7 have a vast array of possible applications. However, the design considerations for creating desktop applications that utilize these capabilities are somewhat different than designing for multi-touch applications in public installations, such as kiosks and architectural interfaces
15:00 – The Elephant in the Room
Do you want to learn why the process of designing software always reveals our humanness – our biases and prejudices, quiet agendas, irrational actions, and diverse portfolio of imperfections – in full effect.
16:30 – Principles of Microsoft Silverlight Graphics and Animation
Come and learn how to breathe life into your designs by learning the fundamentals of Silverlight graphics and animation. We take a look at the types of graphical assets Silverlight and Microsoft Expression Blend support, where they come from, and how to leverage them in your applications.
17:00 – MIX10 Day 2 Wrap Up Edition – (live stream)
Who: Adam Kinney, John Papa, Jeff Sandquist and Dan Fernandez
Ask questions via @ch9live
21:00 – Attendee Party!
Wednesday
09:00 – Developing Multiplayer Games with Microsoft Silverlight 4
Come learn from world-renowned interactive developer Grant Skinner about the opportunities, challenges, and processes for developing successful games using Silverlight. Hear about key Silverlight animation topics from many angles including business, technical, tools, workflow and design integration.
10:30 – Flash Skills Applied to Silverlight Design and Development – (my session!)
If you know how to design and develop Flash applications, you are more than half the way there to creating Silverlight applications. Similar languages, graphic and animation features and skinnable controls, ease the training between the two technologies. Listen and learn how to add a new skill to your skillset and expand your opportunities.
11:05 – Dynamic Layout and Transitions for Microsoft Silverlight 4 with Microsoft Expression Blend
Learn to create applications that change layout and visual appearance using smooth, dynamic and visually rich transitions without writing code. Come see new features in Expression Blend that raise the bar, making it even easier to create amazing applications that will delight users.
12:00 – Prototyping Rich Microsoft Silverlight 4 Applications with Microsoft Expression SketchFlow
SketchFlow is the prototyping environment in Microsoft Expression Blend. See how to use SketchFlow to collaboratively design, evolve, explore and review user experiences and interactive content.
13:30 – Creating Effective Info Viz in Microsoft Silverlight
So much information and so little time. Matthias Shapiro, contributing author for "Beautiful Visualization", talks about how to create information visualizations in Silverlight that bring both beauty and insight to the data. He covers different methods for portraying data, in which cases different methods should be used, and how Silverlight can inform the process and speed up a visualization project.
There’s plenty more than that going on, so check out the site: http://live.visitmix.com and keep on eye on @ch9live for live coverage.
Now, my flight takes off in 7 hours… need to pack!
.toolbox – Free online Silverlight and Expression Blend training
Woohoo, the site is live! .toolbox is a free online training program where designers and developers can learn to create Silverlight applications using Expression Studio and to apply basic UX concepts to their solutions.
I was lucky enough to get involved with the project while it was coming together and I’m very excited to see it out there in the wild. I hope you really enjoy the training content. This site will be the answer to two questions I am asked often:
- I’m a designer, how do I get started with Silverlight & Blend? .toolbox Design Scenarios
- I’m a developer, can you teach me how to design? .toolbox Design Principles
To Get Started
- Go to .toolbox and sign up using your Windows Live ID
- Visit the School section and explore the curriculum.
- Select a module, watch the videos, and follow along using the provided guide & assets.
- Take the evaluation for a completed level to achieve a badge.
- Broadcast your achievements by posting to Twitter and Facebook.
Useful Links
Adam Kinney's blog has moved 