Feeds:
Posts
Comments

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?

image

image 

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.

image

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.

image

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:

Advertisements

 

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.

image

 


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 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.

image

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.

image

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.

image

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

image

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.

image

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

image

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

image

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")

 

image

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:

image

 

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.

image

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”.

image

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.