Changing Blog Feed to blog.wpfwonderland.com

All future posts will be this new URL.

http://blog.wpfwonderland.com

RSS feed at

http://blog.wpfwonderland.com/index.php/feed/

 

Please update your RSS readers.

Silverlight MapStats – show who is on your site

 

Al Pascual has created a nice Silverlight plug-in that visually pinpoints your recent website visitors on a map.

You can see who is on your website or blog and can be added to any website. Will keep track of the hits since the day you install it. I’ll create more custom reports as this project matures.

It’s dead simple to add to your site, just copy the JavaScript code into your page.  Unfortunately WordPress.com hosted blogs cannot use script on pages so I can’t use it on this site.  One more reason to accelerate the move to our own servers.

The application uses the ArcGIS for Silverlight API. The map can be shown full screen and supports zooming up close for more details.

 

 

How does it work?

At every request will geocode the IP address and will add the location on the map, right now the color changes lighter as the time goes by, the hits represent the last 12 hours or the last 100 people, whatever comes first. All this could change depending on the feedback received.

Win £10,000 writing a Surface application

 

Seems like the season for contests.  Here’s a UK contest with a new twist.  You’ve got to create an application for the finance industry and it must target Microsoft Surface.

Prizes totaling ~$15,000 USD

 

Bank branches of the future could soon have a Microsoft Surface like ours.
The School of Informatics and Microsoft have teamed up with a financial services organisation to bring you the Touch Finance Competition.
Your challenge is to design and build an innovative branch-based personal banking application for Microsoft Surface.

I’m not sure if this contest is only open for  University of Edinburgh student as the complete rules are not posted yet.

Using a Tile Brush in Expression Blend

A couple years ago I wrote a post regarding the WPF VisualBrush. As part of that post I discussed the TileBrush.

TileBrush is abstract and defines a number of useful properties for creating a repeating pattern.  For example you could set the source of the ImageBrush to a picture of a flower, then set properties to repeat the picture in five columns and three rows.

Expression Blend and TileBrush

Now that more developers and designers are adopting  Expression Blend it seems like a good idea to learn how Blend handles Tile brushes.  For this example I am using an ImageBrush but the similar techniques apply to the DrawingBrush and VisualBrush.

Add an Image to a Blend Project

The first step is to add an image to a Blend project.  Right-click the project in Project tab and choose "Add Existing Item".  Find an appropriate image and return to the Blend UI.

Insert an Image

Right-click the image in the project tab and choose "Insert".  This will add the image to the ArtBoard.

Convert to Brush Resource

Press the ‘V’ key to activate the Selection tool and click the image in the ArtBoard. Choose the "Make ImageBrush Resource" menu item as shown below.

Provide a key (Name) for the ImageBrush resource.

Using the Brush Transform Tool

Delete the existing Image from the ArtBoard.   Add another element to the ArtBoard, for this example I am using an Ellipse. 

Select the Ellipse with the Selection tool (press the ‘V’ key then click the Ellipse).  Select the Properties tab and then choose the Brush Resource.

 

 

The ellipse is filled with the ImageBrush.

Transform the ImageBrush

Now it finally time to add columns and rows to the ImageBrush.  The Brush Transform tool (press the ‘G’ key) is the tool you are looking for.

 

Finally choose the TileBrush button in the Properties window and then choose a TileMode value.

You can continue to manipulate the tile in the Artboard. Resizing the Tile smaller adds more columns and row to the result.  Dragging the tile in the ArtBoard changes the top/left position of the tile.  Lastly you can skew and rotate the tile with the Brush Transform tool

New WPF Themes released

For the last year I’ve been talking about the need to make a set of themes and templates available for WPF developers.   There are plenty of companies who want nice looking WPF applications (other than the default Windows XP/Vista look) but don’t know where to start.  I’ve argued, to anyone who’ll listen, that we need a community site that showcases the power of WPF templates.

CSS Zen Garden

I suspect that many of you are familiar with the CSS Zen Garden.

The goal of the site is to showcase what is possible with CSS-based design. Style sheets contributed by graphic designers from around the world are used to change the visual presentation of a single HTML file, producing hundreds of different designs. Aside from reference to an external CSS file, the HTML markup itself never changes. All visual differences are the result of the CSS (and supporting imagery).

The magnitude of the changes you can make to a prototype website by swapping the CSS is staggering.  CSS Zen Garden permits designers to show how creative they can be with CSS and allows other to use these CSS files as starting points for their own development.

Where is the WPF/Silverlight Zen Garden?

Both WPF and Silverlight support templated controls.  Templates allow us to completely change the way a control looks, while keeping the same behavior.  This is a powerful concept that allows developer to change a button from

to

My dream is to have a community site where designers can display their templates for WPF/Silverlight controls and others can peruse the catalog looking for design ideas and samples.

WPF Futures releases new control templates

Microsoft has made a few small steps in publishing control templates. A few months ago Microsoft released a set of control templates for Silverlight.  Those templates have been modified to work with WPF controls and were released last week for your consumption.

Tim Heuer – Great summary of Silverlight 3 features

The stream of product announcements and feature enhancements during the Mix09 keynote was non-stop.  I estimate that Scott Guthrie must have rattled off ninety or more of these tidbits in the two and a half hour Mix09 kickoff.  At a rapid pace Scott discussed IIS, Silverlight Expression Blend, the Microsoft Web Installer, adaptive streaming and many more.

There was a lot of anticipation regarding Silverlight 3 and Microsoft delivered the goods.  Tim Heuer has a summary of all the new Silverlight features.  Give it a once over, there is a lot to absorb.

http://timheuer.com/blog/archive/2009/03/18/silverlight-3-whats-new-a-guide.aspx

Super Secrets to be Revealed at Mix09

Attend a keynote at a big Microsoft conference and at some point in the presentation you will hear a musical fanfare followed by a breathless product announcement.

Depending on the show and the time of year the announcements can be hum-drum or spectacular.  Do you remember when Microsoft announced a new development framework called .NET a few years ago? 

 

Of course Scott Guthrie’s keynotes tend to be a little more fun.

 

How to Top Mix08?

Silverlight 3 is going to be the brightest light in the Mix09 marquee this year.  Expect to hear a flurry of announcements regarding new features in Silverlight.  Silverlight 2 is impressive but Microsoft needs to show improvements in many areas to offset the advantages of their competitors RIA frameworks. 

The tools in Expression Suite get little love from Adobe devotees. The designer wars are heating up however and Microsoft will show some startling improvements in Expression Blend.  You definitely won’t want to miss the Expression Blend announcements.

WPF and XAML are also gaining significant improvements, some of which will be shown at Mix.  I saw a preview of what’s coming in Silverlight, Expression Blend and WPF while at the MVP summit earlier this month. What I saw at the summit was very exciting and I expect it will be thoroughly covered during Mix sessions this week.

I know that there are even more surprises coming, including one super NDA Silverlight secret, so keep your ears open.

Expect live coverage of the Mix event here at the WpfWonderland blog.

[update]

Mix09 is over and the secrets have been revealed.

Tim Heuer has a nice summary of Silverlight 3 features.

http://timheuer.com/blog/archive/2009/03/18/silverlight-3-whats-new-a-guide.aspx

Nice Sushi application for the Surface

Are you a sushi veteran?   If so it is probably hard to remember your first few trips to a sushi bar.   Looking at the names, wondering what to order.  Nigiri, Onigiri, Temaki.   Wouldn’t it be wonderful to have an expert on hand to guide you step by step through your dinner order?

 

Phenomblue, a consultancy in Omaha Nebraska, has created a Microsoft Surface proof of concept application for a sushi bar.  The application shows you the sushi items available on the menu (in a rich graphical way), lets you watch videos of the chef preparing the entry and simplifies the ordering process.  Watch the video here.

Nice touches in the application

You can tell that a lot of work went into the UI for this application.  Creating a Surface application forces you to rethink your UI design.  There are many elements to consider, but l want to touch on two of them in this post.

Surface is a 360 degree environment.  People can approach the Surface from from any side.  A traditional top oriented UI will disappoint at least 75% of the people working at the table.  In this app small wooden boats float in from opposite directions and stop in front of the user on either side of the  table.   Watch the user touch the boat, it sinks a little into the water.

Do not show help files.   Surface applications strive for an immersive and intuitive experience.  The application should lead the user through the learning process whenever possible.  Observe what happens when the diner drags the sushi to the center platter.

First, a nice animation of a fan appears.

Then the orange slider moves up and down, showing the hungry diner how easily they can order five rolls instead of one.   Nice attention to details. The key is that the application works with the patron by using animation in a practical way.

Kudos to Phenomblue.

 

 

---

Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

• Dallas TX
• April 20-24th
• Register for an upcoming class

Reflecting on Design #16

 

Sometimes the best way to tell a story is with an animation. Melih Bilgil, a visual artist from Germany, show splendid usage of simple black icons on a white canvas in his ‘History of the Internet’ video.

 

Can you spot the subtle use of color in the video?

PICOL

Melih created a new Pictorial icon set (PICOL) which sees heavy use in the video.   See his site to download your own copy.

 

---

See the entire Reflecting on Design series.

The point is to find beauty elsewhere; photographs, typography, architecture, fine art, industrial design. Just maybe they’ll help wake up your inner designer.

Mix09 At the movies with ‘Objectified’

Mix09 is coming next week.  I can’t wait to be there and see all the announcements about Silverlight 3. Since this is the main Microsoft RIA event it is loaded with enough Silverlight and WPF content to keep even an aged RIA veteran happy. 

Mix is more than just technology news however.  The Mix team always stages an abundance of activities and social events during the week.   

On Wednesday they will be showing the movie Objectified.

Objectified is a feature-length documentary about our complex relationship with manufactured objects and, by extension, the people who design them. It’s a look at the creativity at work behind everything from toothbrushes to tech gadgets. It’s about the designers who re-examine, re-evaluate and re-invent our manufactured environment on a daily basis. It’s about personal expression, identity, consumerism, and sustainability. 

Through vérité footage and in-depth conversations, the film documents the creative processes of some of the world’s most influential product designers, and looks at how the things they make impact our lives. What can we learn about who we are, and who we want to be, from the objects with which we surround ourselves?

Gary Hustwit, the director, will lead a question and answer session after the screening.

 

Brainstorming the film logo

The director want a special look for the movies logo.  You can learn a little about the design process from the designer here or just look at the history of the design below.

CodeGallery – the Unknown Code Sharing Site

Are you a .NET developer?  If so, I bet you are familiar with CodePlex.com.   CodePlex has been around for several years.  There are thousands of projects hosted on CodePlex, some have a very active developer community working on project improvements.

CodeGallery

There is lesser known Microsoft code sharing site called CodeGallery.  What if you just want to share code? Do you have a project where you don’t need to collaborate with other developers?  This is the main idea behind CodeGallery.

MSDN Code Gallery is your destination for downloading sample applications and code snippets , as well as sharing your own resources.

Code Gallery is a community-enabled Web site where you can share developer information and resources such as sample applications and code snippets. CodePlex is Microsoft’s open source project hosting Web site. Code Gallery is a pure storage site, with no project management capabilities. If you need to manage a live code project, CodePlex is a better choice.

Adding code to CodeGallery

The first step is create an account on CodeGallery.  Next you will be presented with the Create New Resource Page’ screen.

Once your project is create you can change a number of settings.

Adding Console Window to WPF Application

I’ve had several WPF projects which required showing a log window.  The idea is to log a constant stream of status messages for a admin to monitor.  You could write your own LogWindow and pass messages into the window but there is an easier way.  Tell your WPF application to run as a ‘Console’ application.

Now this sounds funny but it is easy to do and doesn’t impact your WPF application.

• Right click the Project Properties node in the Solution explorer or choose the Project menu.

• Change the project Application Type to ‘WPF Console Application.

Run the application, you will see two windows; the main WPF window and the console window.

Using Console

To write to the console window use Console.Write or Console.WriteLine.  You can also control the size and position of the window and change the font color.

  1:     Console.SetWindowSize(40, 20)

  2:     Console.SetWindowPosition(0, 0)

  3:     Console.Title = "Log Window"

  4: 

  5:     Console.ForegroundColor = ConsoleColor.Yellow

  6:     Console.WriteLine("Log: Something happened")

  7:     Console.ForegroundColor = ConsoleColor.Red

  8:     Console.WriteLine("Details: Database initialized")
 

									

Play Beanbag Toss on Microsoft Surface

What type of application would you create if your target device is a 30 inch table?  Did I mention that it has a hardened top that can take some serious abuse?

Would you have considered a bean bag game?

The clever folks at Razorfish are churning out some interesting Surface apps.  Check out their video archive for more applications.

 

---

Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

• Dallas TX
• April 20-24th
• Register for an upcoming class

Quick Tip: Expression Blend – the Hand

 

There never seems to be enough screen space when working with Expression Blend or Visual Studio.   Sometimes in Blend the Artboard gets a little off center and you need to move it to see what you are working on.

In this screen shot the right edge of the button and window are not visible.

Scrollbars are so ’90’s

Are you tempted to grab the bottom scroll bar and move the artboard back into the center?

Before you do I’d like to point out another option.

Blend also has ‘the Hand”.

Click the Hand (or press the H key) and you can mouse drag anywhere on the artboard.

Now here is the tip.

You don’t have to actually have to select the hand in the toolbar or with the H key.  The secret is to hold down the Spacebar and mouse drag.  The benefit to this approach is that the Hand is only toggled on as long as you hold the spacebar.  Once you release the spacebar Blend returns to the previously selected tool.

MS Demos Surface Physics Engine

James Wood has been quietly hacking away on a new Surface physics engine.  His job is to visualize and create proof of concept applications for Microsoft UK and this is his latest project.

A couple weeks ago James released some videos of his latest research.  Take a look, what do you think?  There are more videos on his site.

In the last couple months there have been  number of excellent Microsoft Surface applications released.  Vertigo, IdentityMine , RazorFish and InterKnowlogy are just a few of the companies creating fascinating Surface applications.  Most of these apps are written in WPF and show how beautiful a WPF interface can be.

 

---

Mastering Microsoft Surface Development with WPF

Learn to program the Microsoft Surface today.
Take our intensive five day course

 

A multi-faceted course that delivers loads of content in an instructor-led format. You get lots of lab time and thousands of lines of sample code to take back to work with you. Best of all we bundle the Microsoft Surface™ and WPF content into to one convenient package, so you can learn everything you need in one information packed week.

Next class:

• Dallas TX
• April 20-24th
• Register for an upcoming class