<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:georss='http://www.georss.org/georss' xmlns:gd='http://schemas.google.com/g/2005' xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-7107524622185637438</id><updated>2011-10-08T13:43:34.744+02:00</updated><category term='IScrollInfo'/><category term='SUR40'/><category term='finger'/><category term='Surface 2'/><category term='VS 2010'/><category term='Surface Toolkit'/><category term='SP1'/><category term='Design'/><category term='PDC09'/><category term='Broken'/><category term='custom development'/><category term='Interview'/><category term='contact events'/><category term='attract applications'/><category term='SDK'/><category term='blob'/><category term='Videos'/><category term='wpf layer'/><category term='water'/><category term='ISurfaceScrollInfo'/><category term='General'/><category term='Panel'/><category term='contact'/><category term='Projects'/><category term='MSDN Radio'/><category term='Surface'/><category term='tagged object'/><category term='Events'/><category term='Sonicspree'/><category term='Training'/><category term='WPF'/><category term='Helpinghands'/><category term='Installation'/><category term='Windows 7'/><title type='text'>Surface Developer</title><subtitle type='html'></subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default?max-results=100'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>43</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>100</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-1808695155367324597</id><published>2011-09-19T14:15:00.000+02:00</published><updated>2011-09-19T14:19:53.113+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface 2'/><title type='text'>Getting ready for Surface 2</title><content type='html'>The release of Surface 2 is getting closer! This summer Microsoft released the Surface 2.0 SDK and with that you can easily create applications to take advantage of the next generation Surface computing device or Windows 7 touch-enabled devices. So don’t let the lack of hardware prevent you from starting those Surface 2 projects that you are planning!  Here is a list of resources that you can use to kick start and to prepare for Surface 2. &lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.microsoft.com/download/en/details.aspx?displaylang=en&amp;amp;id=26716" target="_blank"&gt;Microsoft Surface 2.0 SDK and Runtime&lt;/a&gt;&lt;br /&gt;&lt;i&gt;With the Microsoft Surface 2.0 SDK, you can easily create applications to take advantage of the next generation Surface computing device or Windows 7 touch-enabled devices&lt;/i&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.microsoft.com/download/en/details.aspx?displaylang=en&amp;amp;id=26713" target="_blank"&gt;Microsoft Surface 2 Design and Interaction Guide&lt;/a&gt;&lt;br /&gt;&lt;i&gt;The Microsoft Surface 2.0 Design and Interaction Guide helps designers and developers create Surface applications for Microsoft Surface and Windows 7 touch PCs. Developing compelling Surface experiences requires a different approach to interface design. This document presents design principles and guidelines to address key aspects of application interface design including: interaction, visual, sound, text, and more. These principles and practices are a starting point to get the most out of the Surface software and hardware platform’s unique capabilities.&lt;/i&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.microsoft.com/download/en/details.aspx?displaylang=en&amp;amp;id=26715" target="_blank"&gt;Microsoft Surface 2 Development Whitepaper&lt;/a&gt;&lt;br /&gt;&lt;em&gt;This paper provides an overview of the Microsoft Surface application development process. It provides detailed information about the Surface platform and unique capabilities of the hardware. Topics include the Surface 2.0 SDK, vision based touch input, and system architecture. This development whitepaper covers the basic end-to-end process for creating great Surface applications.&lt;/em&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://code.msdn.microsoft.com/Social-Stream-for-Surface-8a3a7fd9" target="_blank"&gt;Social Stream for Microsoft Surface 2.0&lt;/a&gt;&lt;br /&gt;&lt;em&gt;Social Stream for Microsoft Surface is a sample application created in collaboration between Microsoft and Stimulant, Inc.  It’s an interactive way for businesses to engage their customers face-to-face using the most recent and relevant Twitter, Flickr, and RSS newsfeeds.&lt;/em&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://msdn.microsoft.com/en-us/library/ff727815(Surface.20).aspx" target="_blank"&gt;Microsoft Surface 2.0 SDK documentation&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://social.msdn.microsoft.com/Search/en-US/?Refinement=112&amp;amp;query=surface" target="_blank"&gt;Surface forums on MSDN&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.microsoft.com/surface/en/us/default.aspx" target="_blank"&gt;Surface.com&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.surface.com/blog" target="_blank"&gt;The Microsoft Surface Blog&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.twitter.com/surface" target="_blank"&gt;Follow Surface on Twitter&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.facebook.com/#!/pages/Microsoft-Surface/6997379361" target="_blank"&gt;Join the Facebook page&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-1808695155367324597?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/1808695155367324597/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/09/getting-ready-for-surface-2.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1808695155367324597'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1808695155367324597'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/09/getting-ready-for-surface-2.html' title='Getting ready for Surface 2'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8664369247361931165</id><published>2011-01-09T14:06:00.001+01:00</published><updated>2011-01-09T14:07:00.147+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><category scheme='http://www.blogger.com/atom/ns#' term='SUR40'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface 2'/><title type='text'>Sonicspree on Surface 2</title><content type='html'>&lt;p&gt;The new version of Sonicspree is completely rewritten from the ground and up. It has a new design, new architecture and new frameworks but with the same engaging and social gameplay. The goal of the game is to find a matching album cover to a song playing before one of your competitors does. The faster you do it, the more points you get. If you guess wrong you will lose some of your points.&lt;/p&gt;  &lt;p&gt;One of the biggest challenges with the first version of Sonicspree was how to do with music and album covers when installing the application on different units. That version used local mp3 files with embedded graphics. This time we wanted a more flexible solution so we turned to the Swedish online streaming music service Spotify. So this version of Sonicspree is powered by music from Spotify.&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh3.ggpht.com/_zHNvN5eY_4U/TSmyxiOvl6I/AAAAAAAAAlQ/u7RESIK0dkY/s1600-h/Sonicspree_3_%5B4%5D.jpg"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="Sonicspree_3_" border="0" alt="Sonicspree_3_" src="http://lh4.ggpht.com/_zHNvN5eY_4U/TSmyyD5OIVI/AAAAAAAAAlU/RFgD1iDQsrA/Sonicspree_3__thumb%5B1%5D.jpg?imgmax=800" width="404" height="307" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;Sonicspree was built using Visual Studio 2010 and Blend 4 in a tight collaboration between developers, user interface designers and interaction designers. To make a clear separation in the developer/designer workflow we have used a Model View ViewModel design pattern and the MVVM Light Toolkit.&lt;/p&gt;  &lt;p&gt;One game in Sonicspree now consists of several gamerounds and each gameround consists of five songs. The dice still play an important role in Soncispree and they can be rolled before each gameround to decide the genres to use.&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh5.ggpht.com/_zHNvN5eY_4U/TSmyyx_wUYI/AAAAAAAAAlY/eVEuv2_EAec/s1600-h/Sonicspree_1%5B5%5D.jpg"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="Sonicspree_1" border="0" alt="Sonicspree_1" src="http://lh6.ggpht.com/_zHNvN5eY_4U/TSmyz7fpiqI/AAAAAAAAAlc/jnTc4CIGtQ8/Sonicspree_1_thumb%5B2%5D.jpg?imgmax=800" width="404" height="271" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;When a song starts playing, the players drags the hidden album covers to the center of the table to reveal the cover. When someone finds the correct cover they drag it home to its own nest to make a guess. If it is correct a new song starts playing and if its wrong the nest shakes and spits out the cover.&lt;/p&gt;        &lt;p&gt;&lt;a href="http://lh3.ggpht.com/_zHNvN5eY_4U/TSmy1Jn5ERI/AAAAAAAAAlg/cJ89KDXhaCE/s1600-h/Sonicspree_2%5B4%5D.jpg"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="Sonicspree_2" border="0" alt="Sonicspree_2" src="http://lh4.ggpht.com/_zHNvN5eY_4U/TSmy13q_uzI/AAAAAAAAAlk/iB7osb9-MJE/Sonicspree_2_thumb%5B1%5D.jpg?imgmax=800" width="404" height="271" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8664369247361931165?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8664369247361931165/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/01/sonicspree-on-surface-2.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8664369247361931165'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8664369247361931165'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/01/sonicspree-on-surface-2.html' title='Sonicspree on Surface 2'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh4.ggpht.com/_zHNvN5eY_4U/TSmyyD5OIVI/AAAAAAAAAlU/RFgD1iDQsrA/s72-c/Sonicspree_3__thumb%5B1%5D.jpg?imgmax=800' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-6137767494415721321</id><published>2011-01-08T10:34:00.001+01:00</published><updated>2011-01-08T10:34:38.403+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><category scheme='http://www.blogger.com/atom/ns#' term='SUR40'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface 2'/><title type='text'>Surface 2 and Sonicspree</title><content type='html'>&lt;p&gt;This week at CES in Las Vegas Microsoft showed the next version of Surface for the public for the first time. It was at the Ballmer keynote that the world got a first glimpse of what’s to come. With the first version of Microsoft Surface Microsoft the hardware was built by Microsoft but this time they have teamed up with Samsung to create the “Samsung SUR40 for Microsoft Surface” witch is the official name. The new unit is pretty much everything you wanted and asked for in an upgrade plus some extra! It is a 40-inch 1920x1280 display covered with Gorilla Glass (same kind of glass as in many smartphones). The first version of Surface has a glass with a matte finish witch is very different from the feel we now will experience.&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh5.ggpht.com/_zHNvN5eY_4U/TSgvn6_lNhI/AAAAAAAAAkw/RUoLnyIh2SI/s1600-h/microsoft_surface_sur40-580x386%5B23%5D.jpg"&gt;&lt;img style="background-image: none; border-right-width: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px; padding-top: 0px" title="microsoft_surface_sur40-580x386" border="0" alt="microsoft_surface_sur40-580x386" src="http://lh3.ggpht.com/_zHNvN5eY_4U/TSgvoUBlBqI/AAAAAAAAAk0/hnuUGC5xMOg/microsoft_surface_sur40-580x386_thumb%5B21%5D.jpg?imgmax=800" width="404" height="270" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;The new version is only four inches thick and uses a completely new technology called Pixel Sense. With Pixel Sense every pixel acts like a “camera” and can supply information about what’s happening on the glass. All this information is processed in 60 frames per second. Since it is only four inches thick, the SUR40 can also be wall mounted and the SDK will notice at what angle the unit is at and can respond accordingly. It will only detect change in angle in landscape mode but not in portray mode. An application can change its appearance based on how much the monitor is tilted. As a developer you will not get an event when the tilt changed but that is understandable since it still is a pretty large piece of hardware!&lt;/p&gt;  &lt;p&gt;There has been a TAP program running for the new Surface since May 2010. Connecta has once again teamed up with Ergonomidesign and collaborated to develop an application on the new hardware and with the new SDK. One of the biggest challenges we have had was the limited access to hardware. The first time we got to see it was in November, on site at Microsoft in Redmond, and we are still waiting to get continuous access to hardware. So we have basically developed everything using only the new SDK and sent bit to the Surface team in Redmond for testing. The reports that we have gotten back has been positive and that really is a good rating for the SDK, i.e. it is possible to develop great apps without having access to hardware. But to get it perfect you still need hardware because you will notice things when several people are using the app at the same time that you never will see in a simulated environment.&lt;/p&gt;  &lt;p&gt;Speaking of simulation, the old simulator from v1 is gone. Please welcome the Microsoft Surface Input Simulator!&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh4.ggpht.com/_zHNvN5eY_4U/TSgvo-kkQPI/AAAAAAAAAk4/QXdikUrfqHI/s1600-h/inputsimulator%5B4%5D.png"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="inputsimulator" border="0" alt="inputsimulator" src="http://lh3.ggpht.com/_zHNvN5eY_4U/TSgvpTvVb-I/AAAAAAAAAk8/rLzmQeEHtkk/inputsimulator_thumb%5B2%5D.png?imgmax=800" width="154" height="472" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;With the Microsoft Surface Input Simulator, the application is running in full screen on your monitor and input is simulated to let you as a developer work with fingers, blobs and tags similar to as it was done in v1. The input simulator can also simulate monitor tilt in 360 degrees. On limitation so far is that your screen resolution has to be at 1920x1280 to get the exact same view as you will get on real hardware but that high resolution is not a requirement to start your app.&lt;/p&gt;  &lt;p&gt;The application that we have created for Samsung SUR40 for Microsoft Surface is a new version of the popular music game Sonicspree. We will write more about that in coming posts but here is the new logo and screen shot.&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh5.ggpht.com/_zHNvN5eY_4U/TSgvqDdgifI/AAAAAAAAAlA/_eYdfSYjgzk/s1600-h/icon%5B5%5D.png"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="icon" border="0" alt="icon" src="http://lh5.ggpht.com/_zHNvN5eY_4U/TSgvqcxPNGI/AAAAAAAAAlE/HtOdBhe2jB4/icon_thumb%5B8%5D.png?imgmax=800" width="240" height="61" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh5.ggpht.com/_zHNvN5eY_4U/TSgvq_6ZR-I/AAAAAAAAAlI/FjOZpv1lIzY/s1600-h/gameplay%5B5%5D.png"&gt;&lt;img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="gameplay" border="0" alt="gameplay" src="http://lh3.ggpht.com/_zHNvN5eY_4U/TSgvrRZF71I/AAAAAAAAAlM/F2ZCs7g9sFk/gameplay_thumb%5B7%5D.png?imgmax=800" width="419" height="245" /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;Please follow #Sonicspree on Twitter for continuous news about where you will be able to experience Sonicspree and Samsung SUR40 for Microsoft Surface during the following months.&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-6137767494415721321?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/6137767494415721321/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/01/surface-2-and-sonicspree.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6137767494415721321'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6137767494415721321'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2011/01/surface-2-and-sonicspree.html' title='Surface 2 and Sonicspree'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh3.ggpht.com/_zHNvN5eY_4U/TSgvoUBlBqI/AAAAAAAAAk0/hnuUGC5xMOg/s72-c/microsoft_surface_sur40-580x386_thumb%5B21%5D.jpg?imgmax=800' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8135227194454450644</id><published>2010-08-06T08:48:00.000+02:00</published><updated>2010-08-06T08:48:00.721+02:00</updated><title type='text'>Swag</title><content type='html'>The Surface team is taking Swag to a whole new level!&lt;br /&gt;&lt;br /&gt;Thanks Anders for the lovely swim cap!&lt;br /&gt;&lt;br /&gt;&lt;center&gt;&lt;a href='http://picasaweb.google.com/EllenHilma/EnBildOmDagen02#5502185000088645634'&gt;&lt;img src='http://lh3.ggpht.com/_zHNvN5eY_4U/TFuwGxLEMAI/AAAAAAAAAbA/J0BvemblYdY/s288/iphone_photo.jpg' border='0' width='500' height='666' style='margin:5px'&gt;&lt;/a&gt;&lt;/center&gt;&lt;br /&gt;&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8135227194454450644?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8135227194454450644/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/08/swag.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8135227194454450644'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8135227194454450644'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/08/swag.html' title='Swag'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh3.ggpht.com/_zHNvN5eY_4U/TFuwGxLEMAI/AAAAAAAAAbA/J0BvemblYdY/s72-c/iphone_photo.jpg' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-2163829754026586295</id><published>2010-04-12T20:26:00.000+02:00</published><updated>2010-04-12T20:35:46.506+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface Toolkit'/><title type='text'>Surface Toolkit for Windows Touch Beta!</title><content type='html'>Today is a big day for a Microsoft developer like myself. Not only is Visual Studio 2010 released but we also see a long awaited sign of life from the Surface Team! Today, for Surface Parters only, Microsoft releases The Microsoft Surface Toolkit for Windows Touch Beta. This was first announced at PDC and is said to be Microsoft Surface controls, templates, and samples to easily create applications that are optimized for multi-touch interaction and that run on Windows Touch PCs.&lt;br /&gt; &lt;br /&gt;The Microsoft Surface Toolkit for Windows Touch Beta is a set of controls, APIs, templates, sample applications and documentation currently available for Surface developers.  With the .NET Framework 4.0, Windows Presentation Framework 4.0, and this toolkit, Windows Touch developers can quickly and consistently create advanced multi-touch experiences for Windows Touch PCs. One really interesting part is that this toolkit is supposed to provid a jump-start for Surface application developers to prepare for the next version of Microsoft Surface.&lt;br /&gt;&lt;br /&gt;What the next version of Surface is, or when it is, is still hidden for the masses but boy, do I look forward to it!&lt;br /&gt;&lt;br /&gt;Will be back with more after I have downloaded and played with the toolkit!&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-2163829754026586295?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/2163829754026586295/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/04/surface-toolkit-for-windows-touch-beta.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2163829754026586295'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2163829754026586295'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/04/surface-toolkit-for-windows-touch-beta.html' title='Surface Toolkit for Windows Touch Beta!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8356925344682757698</id><published>2010-03-02T08:35:00.001+01:00</published><updated>2010-03-02T09:00:15.385+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><title type='text'>Mobile Surface comming?</title><content type='html'>At the olny Surface session at PDC09, Robert Levy said that they are looking at ways to make Surface smaller, cheaper and vertical. This is of course very interesting and especially to see how they have solved one of the key features of Surface - interaction with physical objects.&lt;br /&gt;&lt;br /&gt;This is now starting to bare fruit and rumors are starting to surface that something will appear at TechFest 2010. TechFest is an internal annual event that brings researchers from Microsofts Research's locations around the world to Redmond to share their latest work.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://blogs.zdnet.com/microsoft/?p=5435&amp;amp;tag=col1;post-5435"&gt;http://blogs.zdnet.com/microsoft/?p=5435&amp;amp;tag=col1;post-5435&lt;/a&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8356925344682757698?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8356925344682757698/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/03/mobile-surface-comming.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8356925344682757698'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8356925344682757698'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/03/mobile-surface-comming.html' title='Mobile Surface comming?'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-2678695330340158831</id><published>2010-02-11T07:43:00.001+01:00</published><updated>2010-02-11T07:43:15.172+01:00</updated><title type='text'>A case of OCGM</title><content type='html'>&lt;p&gt;Recently there have been some talking about OCGM and it’s impact on NUI. OCGN is a design philosophy proposed by &lt;a href="http://blog.rongeorge.com/" target="_blank"&gt;Ron George&lt;/a&gt; and is suppose to be to NUI in the same way &lt;a href="http://en.wikipedia.org/wiki/WIMP_%28computing%29" target="_blank"&gt;WIMP&lt;/a&gt; is to GUI. OCGM is pronounced Occam as in &lt;a href="http://en.wikipedia.org/wiki/Occam%27s_razor" target="_blank"&gt;Occam’s Razor&lt;/a&gt; and it’s an abbreviation for: &lt;/p&gt;  &lt;ul&gt;   &lt;li&gt;&lt;u&gt;&lt;strong&gt;&lt;font size="3"&gt;O&lt;/font&gt;&lt;/strong&gt;bjects&lt;/u&gt; – “&lt;em&gt;Objects are the core of the experience. They can have a direct correlation with something physical, or they can just be objects in the interface.”&lt;/em&gt; &lt;/li&gt;    &lt;li&gt;&lt;u&gt;&lt;strong&gt;&lt;font size="3"&gt;C&lt;/font&gt;&lt;/strong&gt;ontainers&lt;/u&gt; – “&lt;em&gt;Containers will be the “grouping” of the objects. This can manifest itself in whatever the system sees fit to better organize or instruct the user on interactions. They do not have to be, nor should they be, windows. They can be any sort of method of presentation or relationship gathering as seen fit.&lt;/em&gt;” &lt;/li&gt;    &lt;li&gt;&lt;u&gt;&lt;strong&gt;&lt;font size="3"&gt;G&lt;/font&gt;&lt;/strong&gt;estures&lt;/u&gt; – “&lt;em&gt;Gestures are actions performed by the user that initiate a function after its completion and recognition by the system. This is an indirect action on the system because it needs to be completed before the system will react to it.&lt;/em&gt;” &lt;/li&gt;    &lt;li&gt;&lt;u&gt;&lt;strong&gt;&lt;font size="3"&gt;M&lt;/font&gt;&lt;/strong&gt;anipulations&lt;/u&gt; – “&lt;em&gt;Manipulations are the direct influences on an object or a container by the user. These are immediate and responsive. They are generally intuitive and mimic the physical world in some manner. The results are expected and should be non-destructive. These are easily performed and accidental activations should be expected and frequent.&lt;/em&gt;” &lt;/li&gt; &lt;/ul&gt;  &lt;p&gt;I’ve cited Ron from his first &lt;a href="http://blog.rongeorge.com/general/ocgm-pronounced-occams-razor-is-the-replacement-for-wimp/" target="_blank"&gt;post&lt;/a&gt; about OCGM. I recommend you read the post and I also recommend reading this &lt;a href="http://nui.joshland.org/2010/02/ocgm-universal-foundational-metaphors.html" target="_blank"&gt;paper&lt;/a&gt; about OCGM by Ron George and Joshua Blake.&lt;/p&gt;  &lt;p&gt;To understand OCGM further, I would like to make a little retrospective on one my previous Microsoft Surface applications and see how the application fits into OCGM (or should it be the other way around?).&lt;/p&gt;  &lt;p&gt;My first Surface project was &lt;a href="http://surfacedeveloper.blogspot.com/2009/06/sonicspree-video.html" target="_blank"&gt;SonicSpree&lt;/a&gt;. To summaries the application: SonicSpree is a game of guessing songs, where the players goal is to combine the song currently playing with it’s corresponding album art. The actual game element is to find the correct album art by&amp;#160; and then drag it into the players nest / home. A simple idea. Finding the album art though is like playing Memory. From the start, all album arts cards are facing down but can be flipped by dragging an album art card into the center. When faced up, the player can make a guess by dragging the album art card into his or hers home to receive a point. &lt;/p&gt;  &lt;p align="left"&gt;&lt;img style="border-right-width: 0px; display: block; float: none; border-top-width: 0px; border-bottom-width: 0px; margin-left: auto; border-left-width: 0px; margin-right: auto" title="sonicspree" border="0" alt="sonicspree" src="http://lh6.ggpht.com/_5Rl_gMJhoUk/S3OnAQxRjVI/AAAAAAAAAGE/VsxcSpRPYmc/sonicspree_thumb4.png?imgmax=800" width="362" height="330" /&gt;    &lt;br /&gt;If we start with identifying what kind of &lt;em&gt;objects&lt;/em&gt; used in SonicSpree the most obvious one is of course the actual album art card the users actually interact with to play the game. The other kind of &lt;em&gt;objects&lt;/em&gt; used in SonicSpree are actually the &lt;a href="http://4.bp.blogspot.com/_zHNvN5eY_4U/Sjn9h_wN1SI/AAAAAAAAAPY/1ITsjuoiE0A/s1600-h/SonicSpree+009.JPG" target="_blank"&gt;physical dices&lt;/a&gt;. A new game round can be started by throwing the dices onto the Surface.&lt;/p&gt;  &lt;p&gt;As for the &lt;em&gt;containers&lt;/em&gt;, SonicSpree uses two of them: the players nest and “the edge”, as we have called it during development. The nest holds the correct album arts the player have collection and the mysterious edge is actually the container for holding all album art cards that are not currently interacted by the players. As you can see the containers doesn’t resemble each other but they both help organizing the the same kind of objects.&amp;#160; &lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;Continuing with &lt;em&gt;manipulations&lt;/em&gt; used in SonicSpree and it’s now it gets a bit interesting. First, moving the album art cards. This is probably the most basic manipulation with table based multi touch NUI, especially on Microsoft Surface as ScatterView is very easy and basic control to use. The next part I’m not sure about. Whether the events are counted as many &lt;em&gt;manipulation&lt;/em&gt; or if the entire sequence of events is counted as a &lt;em&gt;gesture&lt;/em&gt;. What I am refering to is the throwing and removal of the physical dices. First, you as a player throws the dices to randomly select music and secondly removing the dices to start the game. There are actual two most natural &lt;em&gt;manipulations&lt;/em&gt; you can make with a couple of dices. But on the other hand, the whole sequence of events (throwing and removing of the dices) can be seen as a gesture as it on completion starts a new game round. Or can it even actually be both?&lt;/p&gt;  &lt;p&gt;Talking about &lt;em&gt;gestures&lt;/em&gt;, I think I can define two more &lt;em&gt;gestures&lt;/em&gt; in the game. First, moving an album art card from the edge to the middle of the screen (illustrated as the circle in the picture above) to flip the card to actually see the album art. Secondly, moving a flipped card into a players nest to make a guess. &lt;/p&gt;  &lt;p&gt;I will end my retrospective here and I think SonicSpree did adept the OCGM philosophy quite well, perhaps it was thanks to the UX and design people of Ergonomidesign? But I think OCGM can give us NUI developers the language and abstraction to create NUI applications, not only multi touch ones. Maybe in time we will see more specific design philosophy like WIMP for multi touch NUI, but I like OCGM. &lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-2678695330340158831?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/2678695330340158831/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/02/case-of-ocgm.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2678695330340158831'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2678695330340158831'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/02/case-of-ocgm.html' title='A case of OCGM'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh6.ggpht.com/_5Rl_gMJhoUk/S3OnAQxRjVI/AAAAAAAAAGE/VsxcSpRPYmc/s72-c/sonicspree_thumb4.png?imgmax=800' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7463614327941272804</id><published>2010-01-20T20:11:00.002+01:00</published><updated>2010-01-26T17:56:47.331+01:00</updated><title type='text'>ISurfaceScrollInfo and You, Epilogue</title><content type='html'>&lt;p&gt;The holidays are long gone and now it’s time for me to end this blog series. In the previous post was the last post about actually implementing the &lt;em&gt;&lt;a href="http://msdn.microsoft.com/en-us/library/microsoft.surface.presentation.controls.primitives.isurfacescrollinfo.aspx" target="_blank"&gt;ISurfaceScrollInfo&lt;/a&gt;&lt;/em&gt; interface, but I wanted to end this with talking about the solution for &lt;em&gt;SurfacePagePanel&lt;/em&gt;. &lt;/p&gt;  &lt;p&gt;The behavior of the &lt;em&gt;SurfacePagePanel&lt;/em&gt; is to only show one page (list item) at a time, or as far as it can display only one page. To do that I need the SurfacePagePanel to take control of the panning between pages. If you remember from my last post, I mentioned that I implemented a “&lt;em&gt;peak&lt;/em&gt;” functionality. &lt;em&gt;Peaking&lt;/em&gt; allows the user to look at the adjacent pages but more with a rubber band kind of feeling. I think you need the rubber band feeling on a Microsoft Surface because:&lt;/p&gt;  &lt;ol&gt;   &lt;li&gt;The area of use is larger. &lt;/li&gt;    &lt;li&gt;The panel is probably not constraint by a physical border, like the edge of a mobile device. &lt;/li&gt; &lt;/ol&gt;  &lt;p&gt;How is the peaking functionality implemented in &lt;em&gt;SurfacePagePanel&lt;/em&gt;? Although I mentioned the solution in the Part Three, I had to rewrite the code.Why? Because I didn’t understand it! ;). Nothing made sense to me when I read the code so I ended up rewriting it. However, the idea is the same as before, to keep the x-value of the output vector within a certain range. In my code I use a logarithmic function to cap x-values. But that is not all. To make the explanation easier I start with showing of a graph of two curves:&lt;/p&gt;  &lt;p align="center"&gt;&lt;a href="http://lh5.ggpht.com/_5Rl_gMJhoUk/S1dVQrZfyUI/AAAAAAAAAF8/cHUBdHv2AS0/s1600-h/peak_math4.png"&gt;&lt;img style="border-width: 0px; display: inline;" title="peak_math" alt="peak_math" src="http://lh5.ggpht.com/_5Rl_gMJhoUk/S1dVRK5NsZI/AAAAAAAAAGA/Hzaj2zYFFU4/peak_math_thumb2.png?imgmax=800" border="0" height="299" width="393" /&gt;&lt;/a&gt; &lt;br /&gt;&lt;span style="font-size:78%;"&gt;figure 1: logarithmic and linear curve&lt;/span&gt;&lt;/p&gt;  &lt;p&gt;Well, the curves represents how the corresponding mathematical function maps the input value to an output value, in our case mapping the x-value from input to the output vector. If I only were to use the logarithmic function the result would be that the panning would go faster than the contact movement at the beginning of the panning, because of inclination of the curve. Therefore I mixed in a linear curve. The idea is to let the linear curve control the mapping of the x-value until a crossing point (where the two curves intersect). After that I use the logarithmic function. To control the crossing point, or the intersection, I alter the altitude of the logarithmic curve by multiplying the function with a specified factor. In the graph above I’ve used a factor of 30. This means that when the x-value reaches 60, the the logarithmic function seize control of the mapping. This is how it looks In code: &lt;/p&gt;  &lt;div   style="background: none repeat scroll 0% 0% rgb(63, 63, 63); color: rgb(227, 162, 62); font-weight: bold;font-family:consolas;font-size:7pt;"&gt;   &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  236&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;public&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Vector&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;ConvertToViewportUnits&lt;/span&gt;(&lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Point&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;origin&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Vector&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  237&lt;/span&gt; {&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  238&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;if&lt;/span&gt; (&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_isMoving&lt;/span&gt; || !&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_panningOrigin&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;HasValue&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  239&lt;/span&gt;     {&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  240&lt;/span&gt;         &lt;span style="color: rgb(223, 223, 132);"&gt;return&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Vector&lt;/span&gt;(&lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.0&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.0&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  241&lt;/span&gt;     }&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  242&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  243&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;const&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;int&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;logBase&lt;/span&gt; = &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;2&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  244&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;const&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;double&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;scaleFactor&lt;/span&gt; = &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.2&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  245&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  246&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;elasticityLength&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;GetScrollOwnerElasticityLength&lt;/span&gt;() * &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;scaleFactor&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  247&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;absHorizontalOffset&lt;/span&gt; = &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Abs&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;X&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  248&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;direction&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;X&lt;/span&gt; / &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;absHorizontalOffset&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  249&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;absHorizontalOffset&lt;/span&gt; *= &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;scaleFactor&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  250&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;thresholdFactor&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;elasticityLength&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;/&lt;/span&gt;&lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Log&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;elasticityLength&lt;/span&gt;, &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;logBase&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  251&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;cappedOffset&lt;/span&gt; = &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Min&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;absHorizontalOffset&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Log&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;absHorizontalOffset&lt;/span&gt;, &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;logBase&lt;/span&gt;) * &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;thresholdFactor&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  252&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  253&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;return&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Vector&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;cappedOffset&lt;/span&gt; * &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;direction&lt;/span&gt;, &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Y&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  254&lt;/span&gt; }&lt;/p&gt; &lt;/div&gt;  &lt;p&gt;At line 250 I determine the crossing point factor of the logarithmic function using the Elasticity property of the ScrollOwner. That’s how the peak function is implemented.&lt;/p&gt;  &lt;p&gt;To change page the user can either peak far enough or use a flick gesture. Doing that I listen to the ContactUp event in the SurfacePagePanel. Look at the code executed on the event:&lt;/p&gt;  &lt;div   style="background: none repeat scroll 0% 0% rgb(63, 63, 63); color: rgb(227, 162, 62); font-weight: bold;font-family:consolas;font-size:7pt;"&gt;   &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  610&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;private&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;void&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;OnScrollOwnerContactUp&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 132);"&gt;object&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;sender&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;ContactEventArgs&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;e&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  611&lt;/span&gt; {&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  612&lt;/span&gt;     &lt;span style="color: rgb(127, 159, 127); font-weight: normal;"&gt;//The first contact has been captured.&lt;/span&gt;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  613&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;if&lt;/span&gt; (&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_isMoving&lt;/span&gt; || !&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;e&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Contact&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;IsFingerRecognized&lt;/span&gt; ||&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  614&lt;/span&gt;         &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;e&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Contact&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;IsTagRecognized&lt;/span&gt; || &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_scrollOwner&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;ContactsCaptured&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Count&lt;/span&gt; &amp;gt; &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;1&lt;/span&gt; || !&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_panningOrigin&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;HasValue&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  615&lt;/span&gt;     {&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  616&lt;/span&gt;         &lt;span style="color: rgb(223, 223, 132);"&gt;return&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  617&lt;/span&gt;     }&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  618&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  619&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;point&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;e&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;GetPosition&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;ScrollOwner&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  620&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;destinationIndex&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;DetermineNextFocusedChildIndex&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;point&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  621&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;_panningOrigin&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;null&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  622&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;e&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Handled&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;true&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  623&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;MoveViewportToChild&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;destinationIndex&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  624&lt;/span&gt; }&lt;/p&gt; &lt;/div&gt;  &lt;p&gt;Essentially; first I get the the page that I will move to, which can either be the next, previous or the current one. Second I programmatically pan to that page. That is done using a KeyFrame animation. For the moment I inserted a “bounce” effect just like on the iPhone and the Android and the code for doing all this looks like this:&lt;/p&gt;  &lt;div   style="background: none repeat scroll 0% 0% rgb(63, 63, 63); color: rgb(227, 162, 62); font-weight: bold;font-family:consolas;font-size:7pt;"&gt;   &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  737&lt;/span&gt; &lt;span style="color: rgb(223, 223, 132);"&gt;private&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;AnimationTimeline&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;BuildMovementAnimation&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 132);"&gt;double&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;, &lt;span style="color: rgb(223, 223, 132);"&gt;double&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;direction&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;Duration&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animationDuration&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  738&lt;/span&gt; {&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  739&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointTime&lt;/span&gt; = &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;TimeSpan&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;FromMilliseconds&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animationDuration&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;TimeSpan&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;TotalMilliseconds&lt;/span&gt; * &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.7&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  740&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointOffset&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt; + (&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;direction&lt;/span&gt; * &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;GetBounceElasticityLength&lt;/span&gt;());&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  741&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;destinationOffset&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;offset&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  742&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  743&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animation&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;DoubleAnimationUsingKeyFrames&lt;/span&gt; { &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Duration&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animationDuration&lt;/span&gt; };&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  744&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;startFrame&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;SplineDoubleKeyFrame&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;HorizontalOffset&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;KeyTime&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;FromTimeSpan&lt;/span&gt;(&lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;TimeSpan&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;FromSeconds&lt;/span&gt;(&lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.0&lt;/span&gt;)));&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  745&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointFrame&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;SplineDoubleKeyFrame&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointOffset&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;KeyTime&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;FromTimeSpan&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointTime&lt;/span&gt;), &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;KeySpline&lt;/span&gt;(&lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.8&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.8&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.0&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;1.0&lt;/span&gt;));&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  746&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;var&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;endFrame&lt;/span&gt; = &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;SplineDoubleKeyFrame&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;destinationOffset&lt;/span&gt;, &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;KeyTime&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;FromTimeSpan&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animationDuration&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;TimeSpan&lt;/span&gt;), &lt;span style="color: rgb(223, 223, 132);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(240, 223, 175); font-weight: normal;"&gt;KeySpline&lt;/span&gt;(&lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.5&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;1.0&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;0.5&lt;/span&gt;, &lt;span style="color: rgb(138, 204, 207); font-weight: normal;"&gt;1.0&lt;/span&gt;));&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  747&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  748&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animation&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;KeyFrames&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Add&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;startFrame&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  749&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animation&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;KeyFrames&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Add&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;turningPointFrame&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  750&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animation&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;KeyFrames&lt;/span&gt;&lt;span style="font-weight: normal;"&gt;.&lt;/span&gt;&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;Add&lt;/span&gt;(&lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;endFrame&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  751&lt;/span&gt; &lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  752&lt;/span&gt;     &lt;span style="color: rgb(223, 223, 132);"&gt;return&lt;/span&gt; &lt;span style="color: rgb(223, 223, 191); font-weight: normal;"&gt;animation&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px;"&gt;&lt;span style="color: rgb(133, 172, 141); font-weight: normal;"&gt;  753&lt;/span&gt; }&lt;/p&gt; &lt;/div&gt;  &lt;p&gt;I’m sorry for the code formatting, but once again I blame the blog theme ;). As you see, the bounce always occur after 70% of the animation duration. &lt;/p&gt;  &lt;p&gt;Well, that concludes this blog series about how I implemented ISurfaceScrollInfo for the SurfacePagePanel. I hoped you liked it and happy “surfacing”. &lt;/p&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7463614327941272804?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7463614327941272804/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/01/isurfacescrollinfo-and-you-epilogue.html#comment-form' title='2 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7463614327941272804'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7463614327941272804'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/01/isurfacescrollinfo-and-you-epilogue.html' title='ISurfaceScrollInfo and You, Epilogue'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh5.ggpht.com/_5Rl_gMJhoUk/S1dVRK5NsZI/AAAAAAAAAGA/Hzaj2zYFFU4/s72-c/peak_math_thumb2.png?imgmax=800' height='72' width='72'/><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7345580431810057326</id><published>2010-01-17T00:21:00.001+01:00</published><updated>2010-01-17T00:21:58.451+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Helpinghands'/><category scheme='http://www.blogger.com/atom/ns#' term='PDC09'/><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Surface at PDC09</title><content type='html'>&lt;p&gt;(Should have posted this two months ago… Found it as a draft in Live Writer today…)&lt;/p&gt;  &lt;p&gt;At the last day of PDC 2009 I attended the only session about Microsoft Surface. It was presented by Robert Levy who is Program Manager for the Surface team and his equivalent from the WPF team. The session was interesting and it’s always to see the fun stuff that the Surface team has cocked up. This time it was the Surface Monster that stole the show. Videos and more info is available on &lt;a href="http://www.surface.com/monster"&gt;http://www.surface.com/monster&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;The WPF-demos showed of the multi touch capabilities of WPF 4 where you can scale, rotate and transform objects on touch enabled hardware. The example is similar as in my previous blog post (multi touch). Please note that that example is for beta 1 for Visual Studio and that some things have changed to beta 2. I plan to post an upgrade soon.&lt;/p&gt;  &lt;p&gt;The session was probably perfect for those who were new to touch or new to Surface and also draw some applauds from the crowd. For a developer already up and running with Surface it was fun but not much new. I would have liked to see another session on the program with &lt;i&gt;Surface SDK Deep Dive &lt;/i&gt;or&lt;i&gt; Performance Tips When Developing for Microsoft Surface&lt;/i&gt; or &lt;i&gt;Surface from the Trenches – Experiences from a Real World Surface project&lt;/i&gt;. What I look for is more level of depth with two sessions, one introduction and one a bit deeper.&lt;/p&gt;  &lt;p&gt;One new announcement was the Surface Touch Pack for Windows 7 that will enable you to use the same controls in WPF for Windows 7 as you do in Surface which is really cool! Robert also “announced” that they are working on units that will be cheaper, thinner and wall mountable. That wasn’t too hard to guess and no real details were available. I was hoping to hear something about Surface SDK 2.0 that hopefully will be on the way with some new controls, new gestures and maybe detection of a hand in the contact events.&lt;/p&gt;  &lt;p&gt;Earlier on the conference I did get a chance to show the two applications that I have been part of the development team for, Sonicspree and HelpingHands. The feedback from Robert and another guy whose name I can’t remember were all positive. Not sure that they liked what we had done with the element menu but I think they bought the reasons we had for doing what we did. We have changed the behavior of the element menu in HelpingHands so that it will act more like a toggle menu and stick even when the user removes her finger.&lt;/p&gt;  &lt;p&gt;All in all it has been a good PDC from a Surface point of view. Cool stuff on the session, one on one time with the team and confidence in that the applications we develop at Connecta are top notch!&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7345580431810057326?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7345580431810057326/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/01/surface-at-pdc09.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7345580431810057326'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7345580431810057326'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2010/01/surface-at-pdc09.html' title='Surface at PDC09'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-4620500575793077976</id><published>2009-12-20T21:11:00.001+01:00</published><updated>2009-12-20T21:11:41.265+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='ISurfaceScrollInfo'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Panel'/><title type='text'>ISurfaceScrollInfo and you, Part Three.</title><content type='html'>&lt;p&gt;Hi again. &lt;a href="http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-two.html" target="_blank"&gt;Last time&lt;/a&gt; I talked about the &lt;em&gt;IScrollInfo&lt;/em&gt; interface and how it is implemented in my &lt;em&gt;SurfacePagePanel&lt;/em&gt;. Now it’s the time to talk about the &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt;! As I said in the &lt;a href="http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-two.html" target="_blank"&gt;last post&lt;/a&gt; &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt; extends the &lt;em&gt;IScrollInfo&lt;/em&gt; interface. &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt; has the extra capabilities to react on two basic NUI (Natural User Interface) gestures associated with the Microsoft Surface: &lt;em&gt;Panning&lt;/em&gt; and &lt;em&gt;Flicking&lt;/em&gt;. Both &lt;em&gt;Panning&lt;/em&gt; and &lt;em&gt;Flicking&lt;/em&gt; are common &lt;a href="http://en.wikipedia.org/wiki/Natural_User_Interface" target="_blank"&gt;NUI&lt;/a&gt; gestures but I believe &lt;em&gt;Panning&lt;/em&gt; is the most common and natural thing to do. &lt;/p&gt;  &lt;p&gt;So what is &lt;em&gt;Panning&lt;/em&gt; and &lt;em&gt;Flicking&lt;/em&gt;? If you are not interested in reading my explanation you can skip this section! But &lt;em&gt;Panning&lt;/em&gt; and &lt;em&gt;Flicking &lt;/em&gt;is like moving and object, say an apple. &lt;em&gt;Panning &lt;/em&gt;is equivalent to pick up the apple and placing it back gently on another spot, the movement begins when you pick it up and stops when you place it back down again. You as a user are control of it’s movements. &lt;em&gt;Flicking&lt;/em&gt; is more like throwing the apple. You are directly not in control of it’s movement. It’s the same with &lt;em&gt;flicking&lt;/em&gt;. The moment you release your contact from the Microsoft Surface, the virtual physics kicks in and scrolls the items list until it stops. &lt;/p&gt;  &lt;p&gt;&lt;em&gt;ISurfaceScrollInfo&lt;/em&gt; extends with three new methods, which helps you control the scrolling when Panning and Flicking:&lt;/p&gt;  &lt;ul&gt;   &lt;li&gt;&lt;strong&gt;ConvertFromViewportUnits(origin, offset) : vector&lt;/strong&gt; - Converts horizontal and vertical offsets, in viewport units, to device-independent units that are relative to the given origin in viewport units. &lt;/li&gt;    &lt;li&gt;&lt;strong&gt;ConvertToViewportUnits(origin, offset) : vector&lt;/strong&gt; - Converts horizontal and vertical offsets to viewport units, given an offset in device-independent units that are relative to the given origin in viewport units. &lt;/li&gt;    &lt;li&gt;&lt;strong&gt;ConvertToViewportUnitsForFlick(origin, offset) : vector&lt;/strong&gt; - Converts horizontal and vertical offsets to viewport units, given an offset in device-independent units that are relative to the given origin in viewport units. &lt;/li&gt; &lt;/ul&gt;  &lt;p&gt;I’ve inserted the actual documentation summery from the &lt;a href="http://msdn.microsoft.com/en-us/library/microsoft.surface.presentation.controls.primitives.isurfacescrollinfo_methods.aspx" target="_blank"&gt;MSDN&lt;/a&gt; for each method. What can also be read in the documentation is that the results from the convert to methods are later used when setting the vertical and horizontal offset (using the &lt;em&gt;SetHorizontalOffset&lt;/em&gt; and &lt;em&gt;SetVerticalOffset&lt;/em&gt; methods from &lt;em&gt;IScrollInfo&lt;/em&gt; interface). To be more precise, &lt;em&gt;ConvertToViewportUnits&lt;/em&gt; is called all the time during panning and &lt;em&gt;ConvertToViewportUnitsForFlick&lt;/em&gt; is called once the panning is complete if needed. The documentation isn’t that clear on when &lt;em&gt;ConvertFromViewportUnits&lt;/em&gt; is called by the framework, but it is suppose to reverse the conversion done by the convert to methods. &lt;/p&gt;  &lt;p&gt;So how are these methods implemented in &lt;em&gt;SurfacePagePanel&lt;/em&gt;? The standard implementation should be to just return the offset argument, as it is done in the &lt;a href="http://community.surface.com/blogs/develop_how/archive/2008/06/21/creating-a-continuously-panning-list.aspx" target="_blank"&gt;Continuous Planning List&lt;/a&gt;. But in my case I want to control the panning and flicking. Unlike how the iPhone and Android based phones UI works, I want to constraint the panning movement. The constraint is keeping the currently focused page in the center but you should also be are able to peek at the next item at each side of the page. This constraint I have in the &lt;em&gt;ConvertToViewportUnits&lt;/em&gt; method: &lt;/p&gt;  &lt;div style="font-family: consolas; background: #3f3f3f; color: #e3a23e; font-size: 7pt; font-weight: bold"&gt;   &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 236&lt;/span&gt;&amp;#160;&lt;span style="color: #dfdf84"&gt;public&lt;/span&gt; &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;ConvertToViewportUnits&lt;/span&gt;(&lt;span style="color: #f0dfaf; font-weight: normal"&gt;Point&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;origin&lt;/span&gt;, &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;offset&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 237&lt;/span&gt; {&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 238&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;if&lt;/span&gt; (&lt;span style="color: #dfdfbf; font-weight: normal"&gt;_isMoving&lt;/span&gt; || !&lt;span style="color: #dfdfbf; font-weight: normal"&gt;_panningOrigin&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;HasValue&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 239&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; {&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 240&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;return&lt;/span&gt; &lt;span style="color: #dfdf84"&gt;new&lt;/span&gt; &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt;(&lt;span style="color: #8acccf; font-weight: normal"&gt;0.0&lt;/span&gt;, &lt;span style="color: #8acccf; font-weight: normal"&gt;0.0&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 241&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; }&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 242&lt;/span&gt;&amp;#160;&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 243&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;var&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;absOffset&lt;/span&gt; = &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;Abs&lt;/span&gt;(&lt;span style="color: #dfdfbf; font-weight: normal"&gt;GetScrollOwnerElasticityLength&lt;/span&gt;());&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 244&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;var&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;direction&lt;/span&gt; = &lt;span style="color: #dfdfbf; font-weight: normal"&gt;offset&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;X&lt;/span&gt; / &lt;span style="color: #dfdfbf; font-weight: normal"&gt;absOffset&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 245&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;const&lt;/span&gt; &lt;span style="color: #dfdf84"&gt;int&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;scaleFactor&lt;/span&gt; = &lt;span style="color: #8acccf; font-weight: normal"&gt;4&lt;/span&gt;; &lt;span style="color: #7f9f7f; font-weight: normal"&gt;// trail and error generated factor for better user experience.&lt;/span&gt;&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 246&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;var&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;offsetChoice&lt;/span&gt; = &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;Min&lt;/span&gt;(&lt;span style="color: #dfdfbf; font-weight: normal"&gt;absOffset&lt;/span&gt;, &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Math&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;Log10&lt;/span&gt;(&lt;span style="color: #dfdfbf; font-weight: normal"&gt;absOffset&lt;/span&gt;) * &lt;span style="color: #dfdfbf; font-weight: normal"&gt;scaleFactor&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 247&lt;/span&gt;&amp;#160;&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 248&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;return&lt;/span&gt; &lt;span style="color: #dfdf84"&gt;new&lt;/span&gt; &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt;(&lt;span style="color: #dfdfbf; font-weight: normal"&gt;offsetChoice&lt;/span&gt; * &lt;span style="color: #dfdfbf; font-weight: normal"&gt;direction&lt;/span&gt;, &lt;span style="color: #dfdfbf; font-weight: normal"&gt;offset&lt;/span&gt;&lt;span style="font-weight: normal"&gt;.&lt;/span&gt;&lt;span style="color: #dfdfbf; font-weight: normal"&gt;Y&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 249&lt;/span&gt; }&lt;/p&gt; &lt;/div&gt;  &lt;p&gt;The important code here is that I’m using the logarithmic calculations to keep the constraint as it caps horizontal offset. This is an example how you can alter the panning. &lt;/p&gt;  &lt;p&gt;If we continue with &lt;em&gt;ConvertToViewportUnitsForFlick&lt;/em&gt; you will see that it is not as exciting as &lt;em&gt;ConvertToViewportUnits&lt;/em&gt; :&lt;/p&gt;  &lt;div style="font-family: consolas; background: #3f3f3f; color: #e3a23e; font-size: 7pt; font-weight: bold"&gt;   &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 278&lt;/span&gt;&amp;#160;&lt;span style="color: #dfdf84"&gt;public&lt;/span&gt; &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;ConvertToViewportUnitsForFlick&lt;/span&gt;(&lt;span style="color: #f0dfaf; font-weight: normal"&gt;Point&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;origin&lt;/span&gt;, &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;offset&lt;/span&gt;)&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 279&lt;/span&gt; {&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 280&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdfbf; font-weight: normal"&gt;_hasFlicked&lt;/span&gt; = &lt;span style="color: #dfdf84"&gt;true&lt;/span&gt;;&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 281&lt;/span&gt;&amp;#160;&amp;#160;&amp;#160;&amp;#160; &lt;span style="color: #dfdf84"&gt;return&lt;/span&gt; &lt;span style="color: #dfdf84"&gt;new&lt;/span&gt; &lt;span style="color: #f0dfaf; font-weight: normal"&gt;Vector&lt;/span&gt;(&lt;span style="color: #8acccf; font-weight: normal"&gt;0.0&lt;/span&gt;, &lt;span style="color: #8acccf; font-weight: normal"&gt;0.0&lt;/span&gt;);&lt;/p&gt;    &lt;p style="margin: 0px"&gt;&lt;span style="color: #85ac8d; font-weight: normal"&gt;&amp;#160; 282&lt;/span&gt; }&lt;/p&gt; &lt;/div&gt;  &lt;p&gt;Here I return an empty vector and there is a reason for it, because it prevents the &lt;em&gt;ScrollViewer&lt;/em&gt; to continue scrolling when flicking. I use flicking as one of the methods to indicate to switch page, so I need to control the scrolling myself. In my next and last post of this blog series I will talk about how I finalized my &lt;em&gt;SurfacePagePanel&lt;/em&gt;. &lt;/p&gt;  &lt;p&gt;Oh, by the way. Remember that the arguments to &lt;em&gt;ConvertToViewportUnitsForFlick&lt;/em&gt; are based on the result from &lt;em&gt;ConvertToViewportUnits&lt;/em&gt;. In my solution I got a nasty little side effect. The offset argument to &lt;em&gt;ConvertToViewportUnitsForFlick&lt;/em&gt; can be used to determine the direction of the flick, but due to my calculation in &lt;em&gt;ConvertToViewportUnits&lt;/em&gt; the flick direction was occasionally reversed. Meaning when the user flick to the left, the offset indicates right. I can’t explain why and how it occasionally was reversed, but it did happen. &lt;/p&gt;  &lt;p&gt;So what did I do the implementation of &lt;em&gt;ConvertFromViewportUnits&lt;/em&gt;? Well, I&amp;#160; used the standard implementation and returned the offset argument. As I don’t see any negative side effects in doing that I leave it with that. Secondly I not really sure how I should properly implement it in my case. If you know more about ConvertFromViewportUnits and want to share it with me, feel free to send me an email explaining it! To prevent any spam mails, my email is: first name dot surname at &lt;a href="http://www.connecta.se" target="_blank"&gt;Connecta&lt;/a&gt; dot se. My first name and surname is shown as the author of this post. &lt;/p&gt;  &lt;p&gt;With this, I have gone through the methods in ISurfaceScrollInfo interface. But I feel like writing another blog post to wrap things up with my &lt;em&gt;SurfacePagePanel&lt;/em&gt;. But this post marks the ending of implementing &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt;. Stay tuned to the epilogue of &lt;em&gt;&lt;strong&gt;ISurfaceScrollInfo and You&lt;/strong&gt;&lt;/em&gt; series. &lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-4620500575793077976?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/4620500575793077976/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-three.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/4620500575793077976'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/4620500575793077976'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-three.html' title='ISurfaceScrollInfo and you, Part Three.'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-2844811938368365265</id><published>2009-12-02T22:25:00.002+01:00</published><updated>2009-12-04T07:38:24.174+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='ISurfaceScrollInfo'/><category scheme='http://www.blogger.com/atom/ns#' term='IScrollInfo'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Panel'/><title type='text'>ISurfaceScrollInfo and you, Part Two.</title><content type='html'>&lt;p&gt;It’s been a while since I wrote the last post, but blame on the flu. But now I have the energy to continue this “blog series”. &lt;/p&gt;&lt;p&gt;In the &lt;a href="http://surfacedeveloper.blogspot.com/2009/10/isurfacescrollinfo-and-you-part-one.html" target="_blank"&gt;last post&lt;/a&gt; I talked about how to generally create a custom panel in WPF and I also showed how I implemented &lt;em&gt;MeasureOverride&lt;/em&gt; and &lt;em&gt;ArrangeOverride&lt;/em&gt; for our &lt;em&gt;SurfacePagePanel&lt;/em&gt;. Now I will continue this blog series with a part of the &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt; interface. I will actually start with looking at the &lt;em&gt;IScrollInfo&lt;/em&gt;, which &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt; extends from. &lt;/p&gt;&lt;p&gt;Before diving into the IScrollInfo interface I will post a few reference links which have helped me. Read the reference links because there’s a lot of information there:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://blogs.msdn.com/bencon/archive/2006/01/05/509991.aspx" target="_blank"&gt;IScrollInfo in Avalon part I&lt;/a&gt;, &lt;a href="http://blogs.msdn.com/bencon/archive/2006/01/06/510355.aspx" target="_blank"&gt;part II&lt;/a&gt;, &lt;a href="http://blogs.msdn.com/bencon/archive/2006/01/07/510530.aspx" target="_blank"&gt;part III&lt;/a&gt;, &lt;a href="http://blogs.msdn.com/bencon/archive/2006/12/09/iscrollinfo-tutorial-part-iv.aspx" target="_blank"&gt;part IV&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://msdn.microsoft.com/en-us/library/system.windows.controls.primitives.iscrollinfo.aspx" target="_blank"&gt;IScrollInfo (MSDN)&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://www.switchonthecode.com/tutorials/wpf-tutorial-implementing-iscrollinfo" target="_blank"&gt;WPF Tutorial – Implementing IScrollInfo&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://community.surface.com/blogs/develop_how/archive/2008/06/21/creating-a-continuously-panning-list.aspx" target="_blank"&gt;Creating a Continuously Panning List&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;&lt;em&gt;IScrollInfo&lt;/em&gt;, when implemented, tells a &lt;em&gt;ScrollViewer&lt;/em&gt; how a particular  panel is scrolled. If a panel doesn’t implement &lt;em&gt;IScrollInfo&lt;/em&gt; the &lt;em&gt;ScrollViewer&lt;/em&gt; will scroll the panel according to some default behavior. Before jumping in how to implement &lt;em&gt;IScrollInfo&lt;/em&gt; I want to explain a couple of concepts you need to understand:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;strong&gt;Viewport&lt;/strong&gt; &lt;/li&gt;&lt;li&gt;&lt;strong&gt;Extent&lt;/strong&gt; &lt;/li&gt;&lt;/ul&gt;&lt;p&gt;&lt;em&gt;Viewport&lt;/em&gt; is the area of the panel that is visible to the user. Looking at figure 1 the &lt;em&gt;Viewport&lt;/em&gt; represents the red solid rectangle. For instance, in our case the &lt;em&gt;SurfacePagePanel&lt;/em&gt; is suppose to reside within a &lt;em&gt;SurfaceListBox&lt;/em&gt;. The &lt;em&gt;SurfaceListBox&lt;/em&gt; controls how much we are able to see of it items and thus it’s size will implicitly be our &lt;em&gt;Viewport&lt;/em&gt;.&lt;/p&gt;&lt;p&gt;The &lt;em&gt;Extent&lt;/em&gt; on the other hand is the total area all measured items and it’s seen as the dotted rectangle in figure 1. If we once again look at our case, arranging 10 items horizontally where each item is 300 pixels wide and 300 pixels in height will give us an &lt;em&gt;Extent&lt;/em&gt; which is 3000 pixels wide (10 items times 300 pixels) and 300 pixels in height. In other words, the &lt;em&gt;Extent&lt;/em&gt; is the total area needed to display all items at once.&lt;/p&gt;&lt;p align="center"&gt;&lt;a href="http://lh4.ggpht.com/_5Rl_gMJhoUk/SxbbNg57v7I/AAAAAAAAAFw/_jdGeP65qyo/s1600-h/viewport_extent22.png"&gt;&lt;img style="BORDER-RIGHT-WIDTH: 0px; DISPLAY: block; FLOAT: none; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN-LEFT: auto; BORDER-LEFT-WIDTH: 0px; MARGIN-RIGHT: auto" title="viewport_extent2" border="0" alt="viewport_extent2" src="http://lh4.ggpht.com/_5Rl_gMJhoUk/SxbbOB95P3I/AAAAAAAAAF0/mVlPk6dXnc8/viewport_extent2_thumb.png?imgmax=800" width="244" height="124" /&gt;&lt;/a&gt;&lt;span style="font-size:78%;color:#c0c0c0;"&gt;figure 1: Viewport (red rectangle) and Extent (dotted rectangle).&lt;br /&gt;The gray rectangles represents items.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;If we continue looking at the &lt;a href="http://msdn.microsoft.com/en-us/library/system.windows.controls.primitives.iscrollinfo_members.aspx" target="_blank"&gt;members&lt;/a&gt; of the &lt;em&gt;IScrollInfo&lt;/em&gt; interface we see there’s a lot of them. However, many of the members are scrolling methods (methods which are called for certain user actions):&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;strong&gt;MouseWheelUp()&lt;/strong&gt; &lt;/li&gt;&lt;li&gt;&lt;strong&gt;LineUp()&lt;/strong&gt; &lt;/li&gt;&lt;li&gt;&lt;strong&gt;PageUp()&lt;/strong&gt; &lt;/li&gt;&lt;li&gt;Etc… &lt;/li&gt;&lt;/ul&gt;&lt;p&gt;Considering a Surface context these methods are not that important (mainly because you need a mouse and keyboard to access these methods) so these methods doesn’t have an implementation. &lt;/p&gt;&lt;p&gt;Moving on to the &lt;em&gt;IScrollInfo&lt;/em&gt; members that composes the real scrolling logic:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;strong&gt;ViewportWidth&lt;/strong&gt; – The width of the Viewport &lt;/li&gt;&lt;li&gt;&lt;strong&gt;ViewportHeight &lt;/strong&gt;– The height of the Viewport &lt;/li&gt;&lt;li&gt;&lt;strong&gt;ExtentWidth&lt;/strong&gt; – The width of the Extent &lt;/li&gt;&lt;li&gt;&lt;strong&gt;ExtentHeight&lt;/strong&gt; – The height of the Extent &lt;/li&gt;&lt;li&gt;&lt;strong&gt;VerticalOffset&lt;/strong&gt; – How much the Viewport is offset vertically according to the upper right corner of the Extent &lt;/li&gt;&lt;li&gt;&lt;strong&gt;HorizontalOffset&lt;/strong&gt; – How much the Viewport is offset horizontally to the upper right corner of the Extent &lt;/li&gt;&lt;li&gt;&lt;strong&gt;SetVerticalOffset&lt;/strong&gt; – Sets the Viewports vertical offset &lt;/li&gt;&lt;li&gt;&lt;strong&gt;SetHorizontalOffset&lt;/strong&gt; – Sets the Viewports horizontal offset &lt;/li&gt;&lt;li&gt;&lt;strong&gt;CanVerticalScroll&lt;/strong&gt; – Whether the panel can scroll it’s content vertically &lt;/li&gt;&lt;li&gt;&lt;strong&gt;CanHorizontalScroll &lt;/strong&gt;– Whether the panel can scroll it’s content horizontally &lt;/li&gt;&lt;li&gt;&lt;strong&gt;MakeVisible&lt;/strong&gt; – Scrolls a specific item (specified as a Visual) to a desired location (specified as a rectangle). &lt;/li&gt;&lt;/ul&gt;&lt;p&gt;Now, let’s go through how these methods are implemented in the &lt;em&gt;SurfacePagePanel&lt;/em&gt;. As you might imagine, the Viewport and Extent is calculated during the measuring pass:&lt;/p&gt;&lt;div style="BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  152&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;protected&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;override&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Size&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;MeasureOverride&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Size&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  153&lt;/span&gt; {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  154&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;var&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt; = &lt;span style="color:#dfdf84;"&gt;new&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Size&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;, &lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  155&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;var&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;extent&lt;/span&gt; = &lt;span style="color:#dfdf84;"&gt;new&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Size&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;, &lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  156&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  157&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;foreach&lt;/span&gt; (&lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;UIElement&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;child&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;in&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Children&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  158&lt;/span&gt;     {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  159&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;child&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Measure&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  160&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Max&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  161&lt;/span&gt;                            &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;child&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;DesiredSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  162&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Max&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  163&lt;/span&gt;                             &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;child&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;DesiredSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  164&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;extent&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt; += &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;child&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;DesiredSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  165&lt;/span&gt;     }&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  166&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  167&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt; = &lt;span style="color:#dfdf84;"&gt;double&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;IsPositiveInfinity&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt;) &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  168&lt;/span&gt;                        ? &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt; : &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Width&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  169&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt; = &lt;span style="color:#dfdf84;"&gt;double&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;IsPositiveInfinity&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt;) &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  170&lt;/span&gt;                        ? &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt; : &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;availableSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  171&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;extent&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Height&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  172&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  173&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;if&lt;/span&gt; ((&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewport&lt;/span&gt; != &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;  &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_extent&lt;/span&gt; != &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;extent&lt;/span&gt;) &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  174&lt;/span&gt;         &amp;amp;&amp;amp; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ScrollOwner&lt;/span&gt; != &lt;span style="color:#dfdf84;"&gt;null&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  175&lt;/span&gt;     {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  176&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewport&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  177&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_extent&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;extent&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  178&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  179&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ScrollOwner&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;InvalidateScrollInfo&lt;/span&gt;();&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  180&lt;/span&gt;     }&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  181&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  182&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;return&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;resultSize&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  183&lt;/span&gt; }&lt;/p&gt;&lt;/div&gt;&lt;p align="center"&gt;&lt;span style="font-size:78%;"&gt;Code 1: Viewport and Extent calculated in MeasureOverride.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;I hope you can read the code, but there isn’t much space with this blogspot theme. But if you can read it, the Viewport is simply the availableSize given to us (or the size of the largest child element in case of infinitive availabeSize). The Extent, on the other hand, is actually calculated. Extent’s width is the sum of all the child elements measured width (row 164) and the height is simply the height of the resultSize (row 171) which indirectly is the height of the Viewport (row 176).&lt;/p&gt;&lt;p&gt;When both the Viewport and the Extent is calculated &lt;em&gt;ViewportWidth&lt;/em&gt;, &lt;em&gt;ViewportHeight&lt;/em&gt;, &lt;em&gt;ExtentWidth&lt;/em&gt; and &lt;em&gt;ExtentHeight&lt;/em&gt; are easily implemented as they just return the value of the corresponding properties of &lt;em&gt;Viewport&lt;/em&gt; and &lt;em&gt;Extent&lt;/em&gt;. &lt;/p&gt;&lt;p&gt;As our SurfacePagePanel only can scroll horizontally &lt;em&gt;CanVerticalScroll &lt;/em&gt;is set to false, &lt;em&gt;VerticalOffset &lt;/em&gt;always returns 0 and &lt;em&gt;SetVerticalScroll &lt;/em&gt;is not implemented. Aa a side note: at first I threw a &lt;em&gt;NotImplementedException &lt;/em&gt;from the &lt;em&gt;SetVerticalScroll &lt;/em&gt;method but the fact is &lt;em&gt;SetVerticalScroll &lt;/em&gt;is called at least once by ScrollViewer. So don’t go throwing &lt;em&gt;NotImplementedException &lt;/em&gt;everywhere because you never know if or when it hits you in the face.&lt;/p&gt;&lt;p&gt;Let’s look at the corresponding properties and methods for the horizontal behavior. As you might’ve expected it’s the &lt;em&gt;SetHorizontalOffset&lt;/em&gt; that controls the position of the &lt;em&gt;Viewport&lt;/em&gt;. To control the &lt;em&gt;Viewport&lt;/em&gt; offset a translation transform is used as the panels &lt;em&gt;RenderTransform&lt;/em&gt;. Changing the translation transform also changes what is seen through the &lt;em&gt;Viewport&lt;/em&gt;. As seen in the code below, &lt;em&gt;SetHoriztonalOffset&lt;/em&gt; validates the input and calls the &lt;em&gt;SetViewport&lt;/em&gt; method, which is a general method for setting the &lt;em&gt;Viewport&lt;/em&gt;. &lt;/p&gt;&lt;div style="BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  501&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;public&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;void&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;SetHorizontalOffset&lt;/span&gt;(&lt;span style="color:#dfdf84;"&gt;double&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;offset&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  502&lt;/span&gt; {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  503&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;if&lt;/span&gt; (!&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;CanHorizontallyScroll&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  504&lt;/span&gt;     {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  505&lt;/span&gt;         &lt;span style="color:#dfdf84;"&gt;return&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  506&lt;/span&gt;     }&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  507&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  508&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;if&lt;/span&gt; (&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;offset&lt;/span&gt; == &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewportOffset&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;X&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  509&lt;/span&gt;     {&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  510&lt;/span&gt;         &lt;span style="color:#dfdf84;"&gt;return&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  511&lt;/span&gt;     }&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  512&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  513&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;SetViewport&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;offset&lt;/span&gt;, &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewportOffset&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Y&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px"&gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  514&lt;/span&gt; }&lt;/p&gt;&lt;/div&gt;&lt;p align="center"&gt; &lt;span style="font-size:78%;"&gt;Code 2: Implementation of SerHorizontalOffset.&lt;/span&gt;&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  578&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;private&lt;/span&gt; &lt;span style="color:#dfdf84;"&gt;void&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;SetViewport&lt;/span&gt;(&lt;span style="color:#dfdf84;"&gt;double&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newHorizontalOffset&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  579&lt;/span&gt;                          &lt;span style="color:#dfdf84;"&gt;double&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newVerticalOffset&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  580&lt;/span&gt; {&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  581&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#7f9f7f;" &gt;//Cap the offset values.&lt;/span&gt;&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  582&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newHorizontalOffset&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Max&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  583&lt;/span&gt;                             &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Min&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newHorizontalOffset&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  584&lt;/span&gt;                                      &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ExtentWidth&lt;/span&gt; - &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ViewportWidth&lt;/span&gt;));&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  585&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newVerticalOffset&lt;/span&gt; = &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Max&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#8acccf;" &gt;0&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  586&lt;/span&gt;                             &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Math&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Min&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newVerticalOffset&lt;/span&gt;, &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  587&lt;/span&gt;                                      &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ExtentHeight&lt;/span&gt; - &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ViewportHeight&lt;/span&gt;));&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  588&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  589&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewportOffset&lt;/span&gt; = &lt;span style="color:#dfdf84;"&gt;new&lt;/span&gt; &lt;span style="FONT-WEIGHT: normal;color:#f0dfaf;" &gt;Point&lt;/span&gt;(&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newHorizontalOffset&lt;/span&gt;, &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;newVerticalOffset&lt;/span&gt;);&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  590&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_renderTransform&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;X&lt;/span&gt; = -&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewportOffset&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;X&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  591&lt;/span&gt;     &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_renderTransform&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Y&lt;/span&gt; = -&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;_viewportOffset&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;Y&lt;/span&gt;;&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  592&lt;/span&gt; &lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  593&lt;/span&gt;     &lt;span style="color:#dfdf84;"&gt;if&lt;/span&gt; (&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ScrollOwner&lt;/span&gt; != &lt;span style="color:#dfdf84;"&gt;null&lt;/span&gt;)&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  594&lt;/span&gt;     {&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  595&lt;/span&gt;         &lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;ScrollOwner&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal"&gt;.&lt;/span&gt;&lt;span style="FONT-WEIGHT: normal;color:#dfdfbf;" &gt;InvalidateScrollInfo&lt;/span&gt;();&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  596&lt;/span&gt;     }&lt;/p&gt;&lt;p style="MARGIN: 0px; BACKGROUND: #3f3f3f; FONT-WEIGHT: boldfont-family:consolas;font-size:7pt;color:#e3a23e;"   &gt;&lt;span style="FONT-WEIGHT: normal;color:#85ac8d;" &gt;  597&lt;/span&gt; }&lt;/p&gt;&lt;p align="center"&gt;&lt;span style="font-size:78%;"&gt;Code 3: Implementation  of SetViewport.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;Seen in the code for SetViewport the ScrollOwner is notified about the changes by calling InvalidateScrollInfo. This is important to keep the ScrollViewer in sync with the panels scrolling data.&lt;/p&gt;&lt;p&gt;To summarize this post we talked about the &lt;em&gt;Viewport&lt;/em&gt; and &lt;em&gt;Extent&lt;u&gt; &lt;/u&gt;&lt;/em&gt;and their roll in scrolling a panels content. I also showed the code for how the scrolling, or the placement of the &lt;em&gt;Viewport&lt;/em&gt;, is implemented in the &lt;em&gt;SurfacePagePanel &lt;/em&gt;using translate transforming.&lt;/p&gt;&lt;p&gt;Next post will be about the &lt;em&gt;ISurfaceScrollInfo&lt;/em&gt;, I &lt;u&gt;promise&lt;/u&gt;! &lt;/p&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-2844811938368365265?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/2844811938368365265/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-two.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2844811938368365265'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2844811938368365265'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/12/isurfacescrollinfo-and-you-part-two.html' title='ISurfaceScrollInfo and you, Part Two.'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh4.ggpht.com/_5Rl_gMJhoUk/SxbbOB95P3I/AAAAAAAAAF0/mVlPk6dXnc8/s72-c/viewport_extent2_thumb.png?imgmax=800' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-6212174855575256780</id><published>2009-11-12T16:23:00.001+01:00</published><updated>2009-11-12T16:23:19.942+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Helpinghands'/><title type='text'>Helping Hands</title><content type='html'>&lt;p&gt;The last two months I have been working with a team at Ergonomidesign to create a new Surface Application. It is called Helping Hands and envisions the future of integrated health care. How do you, as a potential patient, prevent your lifestyle from becoming an illness? How can you recognize and prevent e.g. Coronary Artery Disease, before it is too late? Welcome to have a look at the future of patient management and treatment in 2015.&lt;/p&gt;  &lt;p&gt;The application will exhibit at the world’s largest medical trade fair, Medica/Compamed in Germany next week and by then we will be able to say and show a lot more of the application.&lt;/p&gt;  &lt;p&gt;The team creating Helping Hands consists of graphical designers, interaction designers and developers from Ergonomidesign and developers and architects from Connecta.&lt;/p&gt;  &lt;p&gt;Right now I can only show you a glimpse of what’s in the application so more is to come during next week!&lt;/p&gt;  &lt;p&gt;&lt;a href="http://lh3.ggpht.com/_zHNvN5eY_4U/SvwoYuCgBoI/AAAAAAAAAT0/I_qXK10oQyc/s1600-h/Ergonomidesign_Future_of_Health_Care_no_logo%5B3%5D.jpg"&gt;&lt;img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="Ergonomidesign_Future_of_Health_Care_no_logo" border="0" alt="Ergonomidesign_Future_of_Health_Care_no_logo" src="http://lh3.ggpht.com/_zHNvN5eY_4U/SvwoZL-yuaI/AAAAAAAAAT4/SLtoS6RWjZs/Ergonomidesign_Future_of_Health_Care_no_logo_thumb%5B1%5D.jpg?imgmax=800" width="403" height="274" /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;Also check out the extremely cool custom byte tag with the look of a dragon!&lt;/p&gt; &lt;a href="http://lh6.ggpht.com/_zHNvN5eY_4U/SvwoZXx09YI/AAAAAAAAAT8/nqQZpN3f3s4/s1600-h/bild%5B5%5D.jpg"&gt;&lt;img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="bild" border="0" alt="bild" src="http://lh6.ggpht.com/_zHNvN5eY_4U/SvwoZ5YSX6I/AAAAAAAAAUA/w_J1bROwyHY/bild_thumb%5B3%5D.jpg?imgmax=800" width="411" height="316" /&gt;&lt;/a&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-6212174855575256780?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/6212174855575256780/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/11/helping-hands.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6212174855575256780'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6212174855575256780'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/11/helping-hands.html' title='Helping Hands'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh3.ggpht.com/_zHNvN5eY_4U/SvwoZL-yuaI/AAAAAAAAAT4/SLtoS6RWjZs/s72-c/Ergonomidesign_Future_of_Health_Care_no_logo_thumb%5B1%5D.jpg?imgmax=800' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8667139012286375841</id><published>2009-10-29T21:55:00.002+01:00</published><updated>2009-10-29T21:57:30.442+01:00</updated><title type='text'>ISurfaceScrollInfo and you, Part One.</title><content type='html'>&lt;p&gt;Before getting into detail about how to implement the ISurfaceScrollInfo, I want to talk about creating a custom panel. But why create a custom panel? Of course there are several ways (as usual) to accomplish a behavior like the &lt;em&gt;page panel, &lt;/em&gt;but I think creating a new panel is the best way to take advantage of the WPF framework.&lt;/p&gt;  &lt;p&gt;The idea of implementing a custom panel is that we can use it with a ListBox control, SurfaceListBox to be more specific. By implementing a custom panel for a ListBox, we can actually tell the ListBox how we want to layout it’s items. &lt;/p&gt;  &lt;p&gt;Now to creating a custom panel. In general, when a panel displays it’s content it does two things: measuring and arranging. First everything in the panel is measured. Measuring is needed to determine the size of the panel and the size depends on one thing: the sizes of the containing items. It is during measuring we have the chance to determine how much space we need to layout the content. In WPF this is the moment when the items &lt;em&gt;desiredSize&lt;/em&gt; is set. &lt;/p&gt;  &lt;p&gt;After all items are measured, they are arranged. The point of arranging is quite obvious. This is the time when we place each item relatively to each other. Where items are placed depends heavily on their size and that’s why measuring is done before the arrangement. The arrangement is “view independent”, which means you don’t have to think about where you place the items in respect of what is actually viewed to the user. In our case, this is taken care of by SurfaceScrollViewer and that’s the whole point of implementing ISurfaceScrollInfo later on.&lt;/p&gt;  &lt;p&gt;To control the measurement and arrangement there are two methods that needs to be overridden in our custom panel: &lt;/p&gt;  &lt;ul&gt;   &lt;li&gt;protected override Size MeasureOverride(Size availableSize) &lt;/li&gt;    &lt;li&gt;protected override Size ArrangeOverride(Size finalSize) &lt;/li&gt; &lt;/ul&gt;  &lt;p&gt;Big surprise huh? As you see MeasueOverride receives a size which describes the available space we have to layout our items. Constrains with other words. Here’s an example: a ListBox which measures 300 times 80 gives an &lt;em&gt;availableSize&lt;/em&gt; of 298 times 76. The size returned from the method is the space we want (we may or may not get it). In our implementation only basic measurements are done:&lt;/p&gt;  &lt;pre class="csharpcode"&gt;&lt;span class="kwrd"&gt;protected&lt;/span&gt; &lt;span class="kwrd"&gt;override&lt;/span&gt; Size MeasureOverride(Size availableSize)&lt;br /&gt;{&lt;br /&gt;   var resultSize = &lt;span class="kwrd"&gt;new&lt;/span&gt; Size(0, 0);&lt;br /&gt;&lt;br /&gt;   &lt;span class="kwrd"&gt;foreach&lt;/span&gt; (UIElement child &lt;span class="kwrd"&gt;in&lt;/span&gt; Children)&lt;br /&gt;   {&lt;br /&gt;       child.Measure(availableSize);&lt;br /&gt;       resultSize.Width = Math.Max(resultSize.Width, child.DesiredSize.Width);&lt;br /&gt;       resultSize.Height = Math.Max(resultSize.Height, child.DesiredSize.Height);&lt;br /&gt;,    }&lt;br /&gt;&lt;br /&gt;   resultSize.Width = &lt;span class="kwrd"&gt;double&lt;/span&gt;.IsPositiveInfinity(availableSize.Width) ? resultSize.Width : availableSize.Width;&lt;br /&gt;   resultSize.Height = &lt;span class="kwrd"&gt;double&lt;/span&gt;.IsPositiveInfinity(availableSize.Height) ? resultSize.Height : availableSize.Height;&lt;br /&gt;&lt;br /&gt;   &lt;span class="kwrd"&gt;return&lt;/span&gt; resultSize;&lt;br /&gt;}&lt;/pre&gt;&lt;p&gt;It’s important that we call Measure on each child or else we won’t have any desired sizes. We can also see that we tell WPF that we need the same space as given to us to layout our items. (Notice the safety precaution if we get infinite available size. It can happen.)&lt;/p&gt;&lt;p&gt;Now for arranging the items. The argument here is the size that WPF is willing to give us and, as before, it may or may not be equal to the size we wanted earlier. In this implementation all items are placed horizontally. Nothing fancy:&lt;/p&gt;&lt;pre class="csharpcode"&gt;&lt;span class="kwrd"&gt;protected&lt;/span&gt; &lt;span class="kwrd"&gt;override&lt;/span&gt; Size ArrangeOverride(Size finalSize)&lt;br /&gt;{&lt;br /&gt;   &lt;span class="kwrd"&gt;if&lt;/span&gt; (Children.Count == 0)&lt;br /&gt;   {&lt;br /&gt;       &lt;span class="kwrd"&gt;return&lt;/span&gt; finalSize;&lt;br /&gt;   }&lt;br /&gt;&lt;br /&gt;   var startOffset = 0;&lt;br /&gt;   &lt;span class="kwrd"&gt;foreach&lt;/span&gt; (UIElement child &lt;span class="kwrd"&gt;in&lt;/span&gt; Children)&lt;br /&gt;   {&lt;br /&gt;       var destination = &lt;span class="kwrd"&gt;new&lt;/span&gt; Rect(startOffset, 0.0, child.DesiredSize.Width, child.DesiredSize.Height);&lt;br /&gt;       child.Arrange(destination);&lt;br /&gt;       startOffset += child.DesiredSize.Width;&lt;br /&gt;   }&lt;br /&gt;&lt;br /&gt;   &lt;span class="kwrd"&gt;return&lt;/span&gt; finalSize;&lt;br /&gt;}&lt;/pre&gt;&lt;style type="text/css"&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, "Courier New", courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606&lt;/style&gt;Here we return the same size as given to us. The documentation only say: “The actual size used.” but I think this is probably important when doing more advanced layouting. In our case returning the same size works fine.&lt;p&gt;That’s all we need to do for measuring and arranging our items. Next post we will start looking at the ISurfaceScrollInfo interface! Stay tuned. &lt;/p&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8667139012286375841?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8667139012286375841/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/isurfacescrollinfo-and-you-part-one.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8667139012286375841'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8667139012286375841'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/isurfacescrollinfo-and-you-part-one.html' title='ISurfaceScrollInfo and you, Part One.'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5102199509087972030</id><published>2009-10-20T23:52:00.001+02:00</published><updated>2009-10-20T23:52:40.731+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='VS 2010'/><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><title type='text'>Surface developing in Visual Studio 2010</title><content type='html'>&lt;p&gt;Today it was time to install Visual Studio 2010 Beta 2 and my hope was to be able to develop Surface Application on the new and sweet Beta 2. Installation of Visual Studio 2010 on a clean Windows 7 was really smooth and easy. The installation was fast and I installed everything except C++ since it is not my mother tongue. Since Team Explorer now is included in Visual Studio 2010 Ultimate that also is a time saver! Not to mention not having to install SP1 on Visual Studio 2008 and .NET Framework 3.5 that takes a lot of time!&lt;/p&gt;  &lt;p&gt;After the installation of Visual Studio 2010 I installed the XNA Framework Redistributable 2.0. And then it was time to time for Microsoft Surface SDK 1.0 SP1, Workstation Edition. Now to the first problem. In that installation file there is a startup check that needs to be modified. The check looks for Visual Studio 2008 and that can be handled the same way as I handled installing Surface SDK 1.0 on Windows 7 Beta. So read that &lt;a href="http://surfacedeveloper.blogspot.com/2009/01/oh-yes-surface-on-windows-7.html" target="_blank"&gt;post&lt;/a&gt; and download the vbs-file since it will be needed!&lt;/p&gt;  &lt;p&gt;Drag the SurfaceSDKWE-file and drop it on the vbs-file. This will remove the startup-check for Visual Studio 2008 and will let you install the Surface SDK without having Visual Studio 2008.&lt;/p&gt;  &lt;p&gt;After the installation of the Surface SDK is finished you have to copy the templates from \Program Files\Microsoft SDKs\Surface\v1.0\Project Templates\ and \Program Files\Microsoft SDKs\Surface\v1.0\Item Templates and place them in the corresponding folders under \Users\surface.developer\Documents\Visual Studio 2010\Templates\. Just copy the files there and don’t unzip them.&lt;/p&gt;  &lt;p&gt;Start Visual Studio 2010, click on New Project and create a new project based on the Surface Application (WPF) that is placed under Visual C#. Make sure to select .NET Framework 3.5 before clicking OK!&lt;/p&gt;  &lt;p&gt;When I tried to open the project that I’m working on right now I was hit by the project upgrade wizard that wants to upgrade the solution file from 2008 to 2010. This stops med from start using Visual Studio 2010 until the whole team upgrades. This is really sad since it won’t happen at the moment. So the way Visual Studio handles solution files hinders partial team upgrade.&lt;/p&gt;  &lt;p&gt;There still might be things that won’t work when developing Surface applications on Visual Studio 2010 and if you find anything please let me know!&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5102199509087972030?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5102199509087972030/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/surface-developing-in-visual-studio.html#comment-form' title='3 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5102199509087972030'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5102199509087972030'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/surface-developing-in-visual-studio.html' title='Surface developing in Visual Studio 2010'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>3</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8999945285936838579</id><published>2009-10-20T20:52:00.001+02:00</published><updated>2009-10-20T20:52:27.626+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='ISurfaceScrollInfo'/><category scheme='http://www.blogger.com/atom/ns#' term='IScrollInfo'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Panel'/><title type='text'>ISurfaceScrollInfo and you, Part Zero.</title><content type='html'>&lt;p&gt;I’ve been working on this secret project with a colleague of mine, and one part of the project is to create a custom panel for the Surface. So what’s so special about the panel I’m doing? I’m want to replicate the “&lt;em&gt;page panel&lt;/em&gt;” found on &lt;a href="http://www.youtube.com/watch?v=G5F0Ruzwos8#t=4m21s" target="_blank"&gt;the iPhone and the Android phones&lt;/a&gt;. To clarify, I do not know the official name of the panel but I will call it &lt;em&gt;page panel&lt;/em&gt; until someone either tell me the official name or come up with a better name.&amp;#160; &lt;/p&gt;  &lt;p&gt;So what is the definition of a &lt;em&gt;page panel&lt;/em&gt;? I would say these points would define it:&lt;/p&gt;  &lt;ul&gt;   &lt;li&gt;Only one item has focus. Other items might be seen but only one will be focused. I will explain in more detail what focus really mean when the time comes. &lt;/li&gt;    &lt;li&gt;When the focus moves to another item the panel is animated. Just like the mobile versions (see the &lt;a href="http://www.youtube.com/watch?v=G5F0Ruzwos8#t=4m21s" target="_blank"&gt;youtube-link&lt;/a&gt; above). &lt;/li&gt;    &lt;li&gt;The items are arranged on a straight line, either horizontally or vertically. No wrapping with other words. I will implement horizontal support because that’s what I want, but it shouldn’t be any problem implementing vertical arrangement as well, both from a developers and a user experiences point of view. &lt;/li&gt;    &lt;li&gt;Changing the item focus are done by the user using finger contacts (or any contact?). I have proposed to trigger focus change contact up, if the contact is out of a certain bound. We’ll get to this later. &lt;/li&gt; &lt;/ul&gt;  &lt;p&gt;A custom panel with custom scrolling, or to be more concrete: inherit from Panel&lt;em&gt; &lt;/em&gt;and implement the &lt;strong&gt;ISurfaceScrollInfo&lt;/strong&gt; interface. The guys at the Surface Community recommended me to look at the &lt;a href="http://community.surface.com/blogs/develop_how/archive/2008/06/21/creating-a-continuously-panning-list.aspx" target="_blank"&gt;LoopingPanel&lt;/a&gt;, which does exactly that!&lt;/p&gt;  &lt;p&gt;I have decided to split my story into several parts, just to make it more exciting and to avoid writing the longest blog post in the history of man. This part is an introduction. The next part will be about implementing a custom Panel, but later on I will tell you about implementing the &lt;strong&gt;ISurfaceScrollInfo&lt;/strong&gt;. &lt;/p&gt;  &lt;p&gt;To be continued…&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8999945285936838579?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8999945285936838579/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/isurfacescrollinfo-and-you-part-zero.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8999945285936838579'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8999945285936838579'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/isurfacescrollinfo-and-you-part-zero.html' title='ISurfaceScrollInfo and you, Part Zero.'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5210214390462332268</id><published>2009-10-17T12:20:00.001+02:00</published><updated>2009-10-17T12:20:54.100+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='WPF'/><category scheme='http://www.blogger.com/atom/ns#' term='VS 2010'/><title type='text'>Multi touch in WPF 4.0 and VS2010</title><content type='html'>&lt;p&gt;Touch and multitouch is something that has been dear to my heart last year. It all started when Connecta bought a Microsoft Surface table for almost a year ago. Even then, Microsoft talked about the need to work with, and learn multi-touch, and now we see Windows 7 and WPF 4.0 come with native support for multi-touch.&lt;/p&gt;  &lt;p&gt;WPF 4.0 has added a number of events to the UIElement that relates to muti touch. The .NET APIs are based on native Win32 APIs that are available only in Windows 7. UIElement is the base class that defines the essence of visual controls for layout, input and events. The events that exist today (Beta 1 of VS2010) are: ManipulationStarted Event,   &lt;br /&gt;ManipulationCompleted Event,    &lt;br /&gt;Manipulation Delta Event,    &lt;br /&gt;ManipulationInertiaStarting Event and ManipulationBoundaryFeedback Event.&lt;/p&gt;  &lt;p&gt;By default, a UIElement never recieves events relating to manipulation unless Manipulation Mode is set to a value other than None. With the help of Manipulation mode you can control the type of manipulation you can make on an item. It can for instance be translated in X and/or Y axis, rotate, or scale.&lt;/p&gt;  &lt;p&gt;In beta 1 of. NET Framework 4.0 the are events for manipulationare are there but there are not any WPF controls that make use of them. In future versions it will be easy just turn on the touch controls on eg sliders or scrollviewers directly in XAML.&lt;/p&gt;  &lt;p&gt;When the ManipulationDelta event is captured in a Window you get a ManipulationDeltaEventArgs. That can be used to find out what changes have occurred on the item manipulated. With the method GetDeltaManipulation you get a System.Windows.Input.Manipulation which contains all of the transformation data that was available when the event occurred. The information can then be used to perform translatation operations on the object. A bit complex, but a piece of code probably makes it easier to understand!&lt;/p&gt;  &lt;p&gt;Please note that the ManipulationDelta event will never fire with an ordinary mouse. There must be some kind of touch device. With the help of a project on CodePlex called &lt;a href="http://multitouchvista.codeplex.com/" target="_blank"&gt;Multi-Touch Vista&lt;/a&gt; you can simulate the use of multiple touch points with normal mouse or a touch pad.&lt;/p&gt;  &lt;p&gt;In the XAML-file I add an Image to the Canvas. To that I connect a MatrixTransform so that I can access it from code. I also add an event handler for the ManipulationDelta.&lt;/p&gt;  &lt;pre&gt;&amp;lt;Window   x:Class=&amp;quot;WpfApplication13.Window1&amp;quot; xmlns=&amp;quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&amp;quot;&lt;br /&gt;xmlns:x=&amp;quot;http://schemas.microsoft.com/winfx/2006/xaml&amp;quot;&lt;br /&gt;        Title=&amp;quot;Window1&amp;quot; Height=&amp;quot;300&amp;quot; Width=&amp;quot;300&amp;quot; &lt;br /&gt;        WindowState=&amp;quot;Maximized&amp;quot; ManipulationDelta=&amp;quot;Window_ManipulationDelta&amp;quot;&amp;gt;&lt;br /&gt;    &amp;lt;Window.Resources&amp;gt;&lt;br /&gt;        &amp;lt;MatrixTransform x:Key=&amp;quot;InitialMatrixTransform&amp;quot;&amp;gt;&lt;br /&gt;            &amp;lt;MatrixTransform.Matrix&amp;gt;&lt;br /&gt;                &amp;lt;Matrix OffsetX=&amp;quot;200&amp;quot; OffsetY=&amp;quot;200&amp;quot;&amp;gt;&amp;lt;/Matrix&amp;gt;&lt;br /&gt;            &amp;lt;/MatrixTransform.Matrix&amp;gt;&lt;br /&gt;        &amp;lt;/MatrixTransform&amp;gt;&lt;br /&gt;    &amp;lt;/Window.Resources&amp;gt;&lt;br /&gt;    &amp;lt;Canvas&amp;gt;&lt;br /&gt;        &amp;lt;Image Width=&amp;quot;100&amp;quot; Source=&amp;quot;/WpfApplication13;component/Images/Sonicspree.jpg&amp;quot; ManipulationMode=&amp;quot;All&amp;quot; RenderTransform=&amp;quot;{StaticResource InitialMatrixTransform}&amp;quot; &amp;gt;&amp;lt;/Image&amp;gt;&lt;br /&gt;    &amp;lt;/Canvas&amp;gt;&lt;br /&gt;&amp;lt;/Window&amp;gt;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;In the code behind I use DeltaManipulation to move the image based on input:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre&gt;private void Window_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)&lt;br /&gt;{&lt;br /&gt;    var delta = e.GetDeltaManipulation(this);&lt;br /&gt;    var image = e.OriginalSource as Image;&lt;br /&gt;    var matrix = ((MatrixTransform)image.RenderTransform).Matrix;&lt;br /&gt;    var originalCenter = new Point(image.ActualWidth / 2, image.ActualHeight / 2);&lt;br /&gt;&lt;br /&gt;    //Translate on the x and y-axis&lt;br /&gt;    matrix.Translate(delta.Translation.X, delta.Translation.Y);&lt;br /&gt;&lt;br /&gt;    //Get the new center point and rotate around that based on the delta&lt;br /&gt;    var center = matrix.Transform(originalCenter);&lt;br /&gt;    matrix.RotateAt(delta.Rotation, center.X, center.Y);&lt;br /&gt;    center = matrix.Transform(originalCenter);&lt;br /&gt;&lt;br /&gt;    //Scale the matrix based on the delta&lt;br /&gt;    matrix.ScaleAt(delta.Scale, delta.Scale, center.X, center.Y);&lt;br /&gt;&lt;br /&gt;    //Apply the new MatrixTransform&lt;br /&gt;    image.RenderTransform = new MatrixTransform(matrix);&lt;br /&gt;&lt;br /&gt;    e.Handled = true;&lt;br /&gt;&lt;br /&gt;}&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Note the two red dots representing the two mice I have connected to this computer. The code in this example is based on a &lt;a href="http://www.youtube.com/watch?v=0DM7NQJ0NA4" target="_blank"&gt;video&lt;/a&gt; on You Tube that also shows the application in action.&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre&gt;&lt;a href="http://lh6.ggpht.com/_zHNvN5eY_4U/StmagzX1LzI/AAAAAAAAATk/DAI5joZxpXw/s1600-h/MultiTouchVS2010%5B1%5D.jpg"&gt;&lt;img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="MultiTouchVS2010" border="0" alt="MultiTouchVS2010" src="http://lh3.ggpht.com/_zHNvN5eY_4U/StmahQiQG5I/AAAAAAAAATo/lckCUEvAA9o/MultiTouchVS2010_thumb.jpg?imgmax=800" width="404" height="305" /&gt;&lt;/a&gt; &lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre&gt;&amp;#160;&lt;/pre&gt;  &lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5210214390462332268?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5210214390462332268/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/multi-touch-in-wpf-40-and-vs2010.html#comment-form' title='2 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5210214390462332268'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5210214390462332268'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/10/multi-touch-in-wpf-40-and-vs2010.html' title='Multi touch in WPF 4.0 and VS2010'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://lh3.ggpht.com/_zHNvN5eY_4U/StmahQiQG5I/AAAAAAAAATo/lckCUEvAA9o/s72-c/MultiTouchVS2010_thumb.jpg?imgmax=800' height='72' width='72'/><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8708741757277638311</id><published>2009-10-05T20:08:00.003+02:00</published><updated>2009-10-05T20:11:53.247+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><title type='text'>StartupUri and you.</title><content type='html'>&lt;p&gt;Let me start with introducing myself. My name is Joakim Rosendahl and I’ve been at Connecta since April first 2009. Became a member of Connecta’s Surface team a month later. I have an academic background in Computer Science and I’ve mostly been working with WinForms and WPF since 2007. &lt;/p&gt;  &lt;p&gt;Enough about me, because I’m going to talk about something that happened to me in my &lt;a href="http://www.youtube.com/connectaab" target="_blank"&gt;latest Surface project&lt;/a&gt;. I had the ambition to implement a surface project using the &lt;a href="http://msdn.microsoft.com/en-us/magazine/dd419663.aspx#id0090030" target="_blank"&gt;M-V-VM design pattern&lt;/a&gt;. I took the naive approach and removed the StartupUri statement in App.xaml and added code below in the code-behind.&lt;/p&gt;  &lt;pre class="csharpcode"&gt;&lt;span class="kwrd"&gt;protected&lt;/span&gt; &lt;span class="kwrd"&gt;override&lt;/span&gt; &lt;span class="kwrd"&gt;void&lt;/span&gt; OnStartup(StartupEventArgs e)&lt;br /&gt;{&lt;br /&gt; &lt;span class="kwrd"&gt;base&lt;/span&gt;.OnStartup(e);&lt;br /&gt;&lt;br /&gt; var demoViewModel = &lt;span class="kwrd"&gt;new&lt;/span&gt; DemoViewModel();&lt;br /&gt; var demoView = &lt;span class="kwrd"&gt;new&lt;/span&gt; DemoView&lt;br /&gt;                    {&lt;br /&gt;                        DataContext = demoViewModel&lt;br /&gt;                    };&lt;br /&gt;&lt;br /&gt; MainWindow = demoView;&lt;br /&gt; MainWindow.Show();&lt;br /&gt;}&lt;/pre&gt;&lt;br /&gt;&lt;style type="text/css"&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, "Courier New", courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060&lt;/style&gt;The idea is to hook up the view model (DemoViewModel) before showing the main view (DemoView.xaml) which is a SurfaceWindow. This worked fine until I hooked up to the Surface Shell on our surface board. Somehow, when I start the application in the Surface Shell the Shell is on top of my application. When I alt-tab I can see my application running in the background. For some reason my main view doesn’t get incorporated into the Shell as it should do.&lt;br /&gt;&lt;br /&gt;Anyway, I made a workaround, restored the StartupUri property to “DemoView.xaml” and added some non-M-V-MV code. I’ve posted this problem on the Surface Community for a couple of weeks ago. The Surface support has contacted me on email to this matter. But a simple solution would to not make the main SurfaceWindow to a View (as according to the M-V-VM design pattern) but instead to something like the sample code that Dan Cravier posted on his &lt;a href="http://blogs.msdn.com/dancre/archive/2006/09/17/dm-v-vm-part-8-view-models.aspx" target="_blank"&gt;blog&lt;/a&gt; ages ago. I will still update when I get a proper solution from the Surface Support.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8708741757277638311?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8708741757277638311/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/startupuri-and-you.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8708741757277638311'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8708741757277638311'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/startupuri-and-you.html' title='StartupUri and you.'/><author><name>Joakim Rosendahl</name><uri>http://www.blogger.com/profile/02649148691671050551</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='24' height='32' src='http://2.bp.blogspot.com/_5Rl_gMJhoUk/Sq8jBku23kI/AAAAAAAAAEY/BPXA1TdbTjw/S220/n576622131_1254496_9489.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8937000159606628721</id><published>2009-09-23T07:45:00.002+02:00</published><updated>2009-09-23T07:48:53.857+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Videos'/><title type='text'>Nice PoS application in Germany</title><content type='html'>I just found a video of a retail, position of sales, Surface application in Germany. It looks like it is at the telephone company O2 made by Syzygy. When will we see the first publicly available Surface application in Sweden?&lt;br /&gt;&lt;br /&gt;&lt;object width="640" height="385"&gt;&lt;param name="movie" value="http://www.youtube.com/v/BtynfK2sYT0&amp;hl=sv&amp;fs=1&amp;"&gt;&lt;/param&gt;&lt;param name="allowFullScreen" value="true"&gt;&lt;/param&gt;&lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;&lt;embed src="http://www.youtube.com/v/BtynfK2sYT0&amp;hl=sv&amp;fs=1&amp;" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"&gt;&lt;/embed&gt;&lt;/object&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8937000159606628721?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8937000159606628721/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/nice-pos-application-in-germany.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8937000159606628721'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8937000159606628721'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/nice-pos-application-in-germany.html' title='Nice PoS application in Germany'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-1944862670311815851</id><published>2009-09-15T09:41:00.003+02:00</published><updated>2009-09-15T09:49:26.535+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Design'/><title type='text'>360 degree UI – always a good thing?</title><content type='html'>Since Microsoft Surface has the form of a table it offers a unique way of social interaction around a computer. Users can sit around the table and participate on equal terms. To be able to achieve this, the designers and developers must focus very hard on creating a user interface and a user experience that supports 360 degree user interface. This, I would say, is one of the biggest challenges for a team building successful applications for Microsoft Surface and something that we always focus on early in the design process.&lt;br /&gt;&lt;br /&gt;Yesterday I attended a Surface workshop were we planned an application that might have an advisor-client user profile. With that I mean one professional sitting on one side of the table and the client(s) sitting on the other side. It could be in a bank with an employee and a client or at health facility with a physician and a patient. Based on our previous experiences we still focused on a 360 degree user interface but in that context, is that really necessary? Couldn’t it be okay to have the user interface mainly focus the unfrequent users, i.e. the client or patient?&lt;br /&gt;&lt;br /&gt;I think so! And today I saw a video of a banking application that does exactly that. Take a look at Hawanedo Surface from Figlo. They have created an application for the financial industry to offer financial advice on Microsoft Surface. The user interface is entirely facing the two clients at the bank and I believe that is great in that context. If you were to build an application like that with 360 degree user interface chances are that you would end up with a worse outcome.&lt;br /&gt;&lt;br /&gt;So when designing application for Microsoft Surface, think about the physical context of where the application will exist and how your users will be placed around the table when they interact with it. Also don’t just create individual personas but also groups of personas and design the application for them.&lt;br /&gt;&lt;br /&gt;Hopefully I will be able to tell you more about the application that we are planning in the near future.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;object width="560" height="340"&gt;&lt;param name="movie" value="http://www.youtube.com/v/UCEkoKyT75M&amp;hl=sv&amp;fs=1&amp;rel=0&amp;color1=0x2b405b&amp;color2=0x6b8ab6"&gt;&lt;/param&gt;&lt;param name="allowFullScreen" value="true"&gt;&lt;/param&gt;&lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;&lt;embed src="http://www.youtube.com/v/UCEkoKyT75M&amp;hl=sv&amp;fs=1&amp;rel=0&amp;color1=0x2b405b&amp;color2=0x6b8ab6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"&gt;&lt;/embed&gt;&lt;/object&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-1944862670311815851?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/1944862670311815851/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/360-degree-ui-always-good-thing.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1944862670311815851'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1944862670311815851'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/360-degree-ui-always-good-thing.html' title='360 degree UI – always a good thing?'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-1497225767517770147</id><published>2009-09-09T22:15:00.007+02:00</published><updated>2009-09-09T22:52:13.770+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Training'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><title type='text'>Share your Surface experience</title><content type='html'>A good sign for a growing developer community is when new tools pop up and experiences are shared in the open. Lately more and more developers have gotten in touch with Microsoft Surface, and it has resulted in several code projects on Codeplex. I want to digitally high five the teams for sharing their work with us. In my opinion the fastest way to a mature developer community is through sharing knowledge and experience, which is exactly what the Surface and NUI community needs.&lt;br /&gt;&lt;br /&gt;A quite usuful project web is the &lt;a href="http://surfaceacademy2009.codeplex.com/"&gt;Surface Academy 2009 Toolkit&lt;/a&gt;. On the project web the Microsoft Surface Academy has put up a couple of controls and a card game starter kit. Thank you, guys!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-1497225767517770147?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/1497225767517770147/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/share-your-surface-experience.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1497225767517770147'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1497225767517770147'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/share-your-surface-experience.html' title='Share your Surface experience'/><author><name>Jouni Pakarinen</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5109008829283835239</id><published>2009-09-07T16:10:00.003+02:00</published><updated>2009-09-07T16:14:24.492+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Events'/><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Alive again</title><content type='html'>When I wrote my last blogpost about Surface our unit was dead. That was before the summer but now we are back on track again. The unit got replaced by Microsoft and our new SP1-unit is now up and running again at Connectas head quarters in Stockholm. There is still some work to do to get every application installed again but most of the work has already been done by a colleague of mine. Last week I conducted a demo for a group of people at a large Swedish company which was really fun. I think it sparked many thoughts among the participants. Before the demo I Connecta-branded the Music and Photos app and did the final install of Sonicspree.&lt;br /&gt;&lt;br /&gt;Regarding Sonicspree there has been some development over the summer. Some of the work was regarding bug fixes but most importantly, virtual dice! So now the application can be started without the fantastic dice that Ergonomidesign created for Sonicspree to From Business to Buttons. This facilitates a lot because it has previously been a bit sensitive to where we store the dice.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;This fall we will have two more or less public appearances with Surface. The first is at Microsoft Parter Summit on the first of October at Kistamässan in Kista, Stockholm, Sweden. We will be there with our Surface to show Sonicspree to the masses and where we also will attend .NET Awards. I hope that every reader will take a minute to place a vote for us &lt;a href="http://tr.im/y5u5"&gt;here&lt;/a&gt;. Seriously, it takes less than a minute!&lt;br /&gt;&lt;br /&gt;The other event we will attend is Sign Scandinavia in November but more information on that later.&lt;br /&gt;&lt;br /&gt;Internally we have been working on a demo together with SAP on Surface. I personally haven’t been involved in the development of the application but there is some form of SAP/Connecta-event on Wednesday so I think the project should be done really soon.&lt;br /&gt;&lt;br /&gt;This was just a short update to let you all know that we don’t have a dead Surface anymore but one that is alive and kicking.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5109008829283835239?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5109008829283835239/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/alive-again.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5109008829283835239'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5109008829283835239'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/09/alive-again.html' title='Alive again'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-6460527821391473353</id><published>2009-06-25T17:45:00.002+02:00</published><updated>2009-06-26T07:46:30.172+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Broken'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Our Surface is dead!</title><content type='html'>On the last day of the Malmö conference our Surface unit broke down! After shipping it from Stockholm to Malmö (about 600 km/370 miles) everything worked perfect on the press viewing and on the first day of the conference. But on the second day it didn’t boot! &lt;br /&gt;&lt;br /&gt;You can hear the fan start and all the status lights indicate normal running mode but nothing happens on the screen. We checked the project lamp, plugged out BlueTooth usb, plugged in an external monitor but nothing changed. It was dead!&lt;br /&gt;&lt;br /&gt;Last week I got in contact with a Surface Escalation Engineer that tried to help me get access to the registry. There is one setting that says what x-coordinate the display starts at and that might get corrupted if you unplug an external monitor the wrong way. I have seen it happen with the Surface Shell not showing up on the table but never during boot. I think it is a very strange solution that the bios checks the registry for this value. It feels like the table should always boot with the table as main display.&lt;br /&gt;&lt;br /&gt;Anyway, it was impossible to get access to anything on the unit. The I/O panel is completely dead. I don’t get an IP-address and there is no response when I plug in an usb mouse or keyboard. And since I will void the warranty if I try to open the unit and since there are no Surface technicians in Sweden a complete exchange is the only way to solve this issue.&lt;br /&gt;&lt;br /&gt;Microsoft has been really helpful with my case, both from Microsoft Sweden and thru the Surface Community. But I still think it is remarkable that they sell a piece of hardware for +10.000€ with no technicians in the country!&lt;br /&gt;&lt;br /&gt;By the way, I just got the exchange confirmation and the new table will arrive next week. The good thing is that now it is delivered with SP1. The bad thing is that I’m having hours after hours of installing and configuration to get the unit back to where it was when it broke!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-6460527821391473353?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/6460527821391473353/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/our-surface-is-dead.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6460527821391473353'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6460527821391473353'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/our-surface-is-dead.html' title='Our Surface is dead!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-1293408076523997368</id><published>2009-06-25T15:21:00.001+02:00</published><updated>2009-06-25T15:22:56.987+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Projects'/><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><title type='text'>Sonicspree video</title><content type='html'>Our friends at Ergonomidesign have created a short video of Sonicspree.&lt;br /&gt;&lt;br /&gt;&lt;object width="480" height="385"&gt;&lt;param name="movie" value="http://www.youtube.com/v/e6Ftoke-8Ac&amp;hl=sv&amp;fs=1&amp;rel=0&amp;color1=0x3a3a3a&amp;color2=0x999999"&gt;&lt;/param&gt;&lt;param name="allowFullScreen" value="true"&gt;&lt;/param&gt;&lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;&lt;embed src="http://www.youtube.com/v/e6Ftoke-8Ac&amp;hl=sv&amp;fs=1&amp;rel=0&amp;color1=0x3a3a3a&amp;color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"&gt;&lt;/embed&gt;&lt;/object&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-1293408076523997368?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/1293408076523997368/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/sonicspree-video.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1293408076523997368'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1293408076523997368'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/sonicspree-video.html' title='Sonicspree video'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-9165633014216174883</id><published>2009-06-18T08:45:00.001+02:00</published><updated>2009-06-18T10:50:02.056+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Projects'/><category scheme='http://www.blogger.com/atom/ns#' term='Sonicspree'/><title type='text'>Sonicspree</title><content type='html'>&lt;a href="http://1.bp.blogspot.com/_zHNvN5eY_4U/Sjn8tfxQ4DI/AAAAAAAAAPA/0PGrfWg9mHw/s1600-h/Sonicspree-logo-color_800.jpg"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 400px; DISPLAY: block; HEIGHT: 61px; CURSOR: hand" id="BLOGGER_PHOTO_ID_5348583891031613490" border="0" alt="" src="http://1.bp.blogspot.com/_zHNvN5eY_4U/Sjn8tfxQ4DI/AAAAAAAAAPA/0PGrfWg9mHw/s400/Sonicspree-logo-color_800.jpg" /&gt;&lt;/a&gt;&lt;br /&gt;During the last weeks I and some other people from Connecta have been involved in a project together with Ergonomidesign. Our goal was to build something to showcase on the conference From Business to Buttons that took place last week in Malmö, Sweden. Our case was to build an application that could exist in a retail telecom store, attracting customers to the store and making them stay longer.&lt;br /&gt;&lt;br /&gt;Our application, Sonicspree, contains of two sides. On side is called the Store Mode and the other is called the Quiz Mode and both have a clear music focus. The part that we have developed so far is he music quiz.&lt;br /&gt;&lt;br /&gt;While creating Sonicspree we have stayed true to some really important fundamentals of design for Microsoft Surface and that is 360 degrees UI, interaction with physical objects and multi user.&lt;br /&gt;&lt;br /&gt;The game can be played by up to six people at the same time, spread around the table. Each player has a player area where the player score is kept. The game starts when someone rolls two dice to decide genres for the music in the quiz. When the dice are removed album covers start floating around the screen with the back side facing up and a song from one of the two genres starts playing. Each user starts dragging covers to the center of the table where the front side is revealed. When a user finds the matching cover to the song that is playing she drags that cover to her player area.&lt;br /&gt;&lt;br /&gt;The dice and the flip-flop that is used to change from quiz mode to store mode are custom made by Ergonomidesign.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Quiz mode&lt;/p&gt;&lt;br /&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 500px; DISPLAY: block; CURSOR: hand" id="BLOGGER_PHOTO_ID_5348583625085873330" border="0" alt="" src="http://2.bp.blogspot.com/_zHNvN5eY_4U/Sjn8eBC27LI/AAAAAAAAAO4/UJgcPQ0v5ck/s400/PlayMode.jpg" /&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Store mode&lt;/p&gt;&lt;a href="http://4.bp.blogspot.com/_zHNvN5eY_4U/Sjn9hsgqA9I/AAAAAAAAAPQ/-haluFCra04/s1600-h/StoreMode.jpg"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 500px; DISPLAY: block; CURSOR: hand" id="BLOGGER_PHOTO_ID_5348584787804816338" border="0" alt="" src="http://4.bp.blogspot.com/_zHNvN5eY_4U/Sjn9hsgqA9I/AAAAAAAAAPQ/-haluFCra04/s400/StoreMode.jpg" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Custom made dice&lt;/p&gt;&lt;br /&gt;&lt;a href="http://4.bp.blogspot.com/_zHNvN5eY_4U/Sjn9h_wN1SI/AAAAAAAAAPY/1ITsjuoiE0A/s1600-h/SonicSpree+009.JPG"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 500px; DISPLAY: block; CURSOR: hand" id="BLOGGER_PHOTO_ID_5348584792970351906" border="0" alt="" src="http://4.bp.blogspot.com/_zHNvN5eY_4U/Sjn9h_wN1SI/AAAAAAAAAPY/1ITsjuoiE0A/s400/SonicSpree+009.JPG" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Playing the game&lt;/p&gt;&lt;br /&gt;&lt;a href="http://2.bp.blogspot.com/_zHNvN5eY_4U/Sjn9iHD2uRI/AAAAAAAAAPg/14fF39kpnnc/s1600-h/SonicSpree+002.JPG"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 500px; DISPLAY: block; CURSOR: hand" id="BLOGGER_PHOTO_ID_5348584794931771666" border="0" alt="" src="http://2.bp.blogspot.com/_zHNvN5eY_4U/Sjn9iHD2uRI/AAAAAAAAAPg/14fF39kpnnc/s400/SonicSpree+002.JPG" /&gt;&lt;/a&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-9165633014216174883?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/9165633014216174883/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/sonicspree.html#comment-form' title='2 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/9165633014216174883'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/9165633014216174883'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/sonicspree.html' title='Sonicspree'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_zHNvN5eY_4U/Sjn8tfxQ4DI/AAAAAAAAAPA/0PGrfWg9mHw/s72-c/Sonicspree-logo-color_800.jpg' height='72' width='72'/><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-329766860144697743</id><published>2009-06-10T18:00:00.000+02:00</published><updated>2009-06-10T15:07:58.515+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Projects'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Table on tour again</title><content type='html'>In the beginning of May I wrote a blog post about the &lt;a href="http://surfacedeveloper.blogspot.com/2009/05/coolest-project-in-sweden.html" target="_blank"&gt;coolest project in Sweden&lt;/a&gt;. Since then Connecta and Ergonomidesing have been working really hard to finish an application to &lt;a href="http://www.businesstobuttons.com/" target="_blank"&gt;From Business to Buttons&lt;/a&gt; starting in Malmö tomorrow. I have to say that I’m really happy with the result and looking forward to show it to a crowd that probably will be a critical one since the main focus for the conference is user experience. But confident as I am – that will be no problem! The UIX-people on our team has done a great job!&lt;br /&gt;&lt;br /&gt;The application that we have built is a music game and I will get back with more details on that after the conference.&lt;br /&gt;&lt;br /&gt;The table was supposed to get picked up by DHL yesterday but they failed big time. Apparently some delivery guy from DHL went to Connecta yesterday, didn’t find the table, and then went home. I suppose that he had a bad day and I can’t blame him but he certainly ruined my morning. A phone call at 8.30 from my colleague Marcus: “The table is still here as Connecta, is that a problem?” Panic, stress and gastric ulcer!&lt;br /&gt;&lt;br /&gt;DHL says that they are responsible but that they don’t have a car available to drive the table to Malmö. The clock is ticking. A lot of time and money invested in this project. On site set up and deployment today in Malmö and the conference starting tomorrow. What to do?&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Urban Falck to the rescue!&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;A new phone call, this time from another colleague; Urban Falck. Urban is a guy that doesn’t see many problems or obstacles. His solution was: I’ll take the 125 kilo pallet with the Surface table in my tiny car and drive down to Malmö! Hey, it’s only 600 km!&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://3.bp.blogspot.com/_zHNvN5eY_4U/Si-rZC-FoFI/AAAAAAAAAOw/hbXtFGQPuBg/s1600-h/surfaceMalmo.jpeg"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 400px; DISPLAY: block; HEIGHT: 300px; CURSOR: hand" id="BLOGGER_PHOTO_ID_5345679729494433874" border="0" alt="" src="http://3.bp.blogspot.com/_zHNvN5eY_4U/Si-rZC-FoFI/AAAAAAAAAOw/hbXtFGQPuBg/s400/surfaceMalmo.jpeg" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;So, the table is in a car and on its way with Urban. Marcus is on site and responsible for the bits and the dice (more on that later) and I’m still in Stockholm. Tomorrow is last day in Pre School for my oldest daughter and then departure to Malmö.&lt;br /&gt;&lt;br /&gt;Hope to see you at From Business to Buttons on Friday!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-329766860144697743?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/329766860144697743/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/table-on-tour-again.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/329766860144697743'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/329766860144697743'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/06/table-on-tour-again.html' title='Table on tour again'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://3.bp.blogspot.com/_zHNvN5eY_4U/Si-rZC-FoFI/AAAAAAAAAOw/hbXtFGQPuBg/s72-c/surfaceMalmo.jpeg' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7057323190433049343</id><published>2009-05-12T08:25:00.000+02:00</published><updated>2009-05-12T08:42:18.705+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><category scheme='http://www.blogger.com/atom/ns#' term='SP1'/><category scheme='http://www.blogger.com/atom/ns#' term='water'/><category scheme='http://www.blogger.com/atom/ns#' term='custom development'/><category scheme='http://www.blogger.com/atom/ns#' term='Installation'/><title type='text'>Surface SDK SP1</title><content type='html'>&lt;p&gt;Wow! The new visual stuff in SP1 looks really really good!&lt;/p&gt;&lt;ul&gt;&lt;li&gt;An update to the application Water has finally removed the little light in the middle of the pond. Many users tried to touch the light and was expecting for something to happen. Now Water makes a sound when touching and upon first touch the menu assessors in the corners appears. I think this is a really good thing since many users had problems knowing what to do with Water.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt; &lt;/p&gt;&lt;ul&gt;&lt;li&gt;One of the things from the design guidelines that many applications don’t follow is that you should always get feedback from touching the surface. Even if nothing is expected to happen you should get feedback so that you don’t think something is wrong. I have solved it in some applications by using pixel shaders but it is a lot of work behind it. Now it is added to the core functionality of the table. So now, every time you place your finger on the surface you will get feedback. The feedback consists of a little blur effect and a small trail behind your finger as you move it.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt; &lt;/p&gt;&lt;ul&gt;&lt;li&gt;Another thing that confuses a lot of users is resizing. Some controls can’t be resized and some can only be resized to a particular size. Now, in SP1, when you try to resize a control to a size larger than maximum size you will get small rubber bands between your fingers and the control. So you can clearly see that there is a limitation to the size of the control.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt; &lt;/p&gt;&lt;ul&gt;&lt;li&gt;A new menu control that I haven’t played with yet called the Element Menu is now available. This adds a menu on top of an element that works kind of like a context menu for an element. It looks really useful so I’m looking forward to play with that.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt; &lt;/p&gt;&lt;p&gt;Apart from the visual stuff, which there’s more than the once mentioned here, we also get support for Windows Update and some nice tools to support management and testing. The testing tool “Surface Stress” looks cool. It is a command line tool that lets you run a lot of users at the same time just bashing the table. Fingers, blobs and tagged objects flying around trying to mess up your application. Hopefully this will help you find bugs in a lab environment before going into production.&lt;br /&gt;&lt;br /&gt;Now we also get an Identity Tag Printing Tool. This can, not surprisingly, be used to print identity tags for Surface.&lt;br /&gt;&lt;br /&gt;The Microsoft Surface SDK 1.0 SP1, Workstation Edition is now almost double in size compared to the 1.0 version. It has gone from 73 MB to 143 MB. Unfortunately you can’t run both 1.0 and 1.0 SP1 side by side. The setup wizard will detect if you have version 1.0 installed and will upgrade.&lt;/p&gt;&lt;p&gt;I also see support for Windows 7 since it isn’t necessary for &lt;a href="http://surfacedeveloper.blogspot.com/2009/01/oh-yes-surface-on-windows-7.html" target="_blank"&gt;my little tweak &lt;/a&gt;to bypass the OS-version check.&lt;br /&gt;&lt;br /&gt;I will be getting back on this topic as I find more interesting stuff!&lt;/p&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7057323190433049343?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7057323190433049343/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/05/surface-sdk-sp1.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7057323190433049343'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7057323190433049343'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/05/surface-sdk-sp1.html' title='Surface SDK SP1'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-2324436305653294068</id><published>2009-05-08T22:48:00.000+02:00</published><updated>2009-05-08T23:42:39.576+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Projects'/><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><title type='text'>The coolest project in Sweden!</title><content type='html'>&lt;div&gt;Finally it’s settled, we are going to the conference &lt;a href="http://www.businesstobuttons.com/" target="_blank"&gt;From Business to Buttons&lt;/a&gt; in Malmö, Sweden with our Surface-table. It will be placed in the exhibition area together with &lt;a href="http://www.ergonomidesign.se/" target="_blank"&gt;Ergonomidesign&lt;/a&gt;. Now we are about to start to develop an application together with a clear goal in mind – It will run on the table in Malmö in exactly one month later!&lt;br /&gt;&lt;br /&gt;The project kicks off on Monday and the project group consists of a nice mix of designers and developers. &lt;a href="http://www.connecta.se/" target="_blank"&gt;Connecta&lt;/a&gt; will line up some really cool and extremely talented Surface developers and architects and from Ergonomidesign there will be a couple of wizards in User Experience Design and User Interface Design. This will be a great opportunity to try a real Designer/Developer Workflow!&lt;br /&gt;&lt;br /&gt;Of course we will be using Visual Studio on the developer side and all the resources from the designers will be done in xaml using all sorts of tools and of course Expression Blend.&lt;br /&gt;&lt;br /&gt;In Blend 3 Microsoft has finally added the ability to work integrated with source control so we will be using Team Foundation Server for Application Lifecycle Management. The only caveat is that you have to add the project to source control using Visual Studio and you have to bring the solution to the client using Visual Studio of team foundation command line tools. But once that is done Blend will light up the user interface and give the ability to work with source control from context menus in the Project pane.&lt;br /&gt;&lt;br /&gt;The designers will be using SketchFlow in Belnd 3 to create the user experience design and I’m really looking forward to see the results from that. Even if it won’t work 100% with the Surface Simulator we could always build the first user experience prototype as a normal WPF client.&lt;br /&gt;&lt;br /&gt;Earlier this week we had a telephone conference with Mr Surface, Dr Niel Roodyn, from Sydney Australia. We were supposed to use Skype but I hadn’t tried using it with Windows 7 so I couldn’t get the microphone to work – my bad. Dr Neil will be our moral support during the project and will hopefully come with some interesting insights during the progress of the project. First of all we will shot some ideas on him to get help in finding the right path to success. Now I’m using Windows 7 RC and hopefully Skype will work better next time. Otherwise we will have to start paying for the loooong distance calls to Australia.&lt;br /&gt;&lt;br /&gt;So, now if someone is really jealous that Connecta and Ergonomidesign have the coolest project in Sweden right now, I can only say that I totally understand you!&lt;/div&gt;&lt;br /&gt;&lt;a href="http://www.businesstobuttons.com/"&gt;&lt;img style="margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 318px; height: 127px;" src="http://3.bp.blogspot.com/_zHNvN5eY_4U/SgSmprpyFVI/AAAAAAAAAOg/gFnAYpNK_Ao/s400/bg_from_business_3.png" border="0" id="BLOGGER_PHOTO_ID_5333571093736330578" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;div&gt;&lt;/div&gt;&lt;br /&gt;&lt;div&gt;&lt;/div&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-2324436305653294068?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/2324436305653294068/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/05/coolest-project-in-sweden.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2324436305653294068'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2324436305653294068'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/05/coolest-project-in-sweden.html' title='The coolest project in Sweden!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://3.bp.blogspot.com/_zHNvN5eY_4U/SgSmprpyFVI/AAAAAAAAAOg/gFnAYpNK_Ao/s72-c/bg_from_business_3.png' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-880899989481940241</id><published>2009-04-14T14:23:00.000+02:00</published><updated>2009-04-14T14:51:05.442+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Surface on tour</title><content type='html'>Today our Elvis has left the building! I just got an email with a proof of delivery that the messenger service has picked up our Surface table and is expected to deliver it to the Sheraton hotel in Stockholm later tonight. Tomorrow is the first day of Cornerstones conference &lt;a target="blank" href="http://www.cornerstone.se/sv/ExpertZone/developersummit/2009/"&gt;Developer Summit&lt;/a&gt; and Connecta will be in the exhibition together with Microsoft and our Surface table. To this event three of our developers have worked really hard to finish a first version of an application used to present Connecta. I have been promised the final bits on email later today!&lt;br /&gt;&lt;br /&gt;On the table we also have the latest applications from Microsoft, including the three games released last week and the Mobile Connect Sample Application. The later not yet installed but based on the previous installation experiences, it should be no problem. The four games are Chess, Checkers, Tiles and Ribbons.&lt;br /&gt;&lt;br /&gt;The Microsoft Surface Mobile Connect sample application connects a Bluetooth-enabled mobile phone to a Microsoft Surface unit to enable users to interact with data and contacts on their phone. To be able to use the application you have to have an application installed on your phone and you have to have a Bluetooth stack from Microsoft.&lt;br /&gt;&lt;br /&gt;So if you are at Developer Summit 2009, come by the Microsoft booth, say hi and touch the Surface!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-880899989481940241?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/880899989481940241/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/04/surface-on-tour.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/880899989481940241'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/880899989481940241'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/04/surface-on-tour.html' title='Surface on tour'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8356066165716236709</id><published>2009-04-01T22:42:00.000+02:00</published><updated>2009-04-02T13:42:32.689+02:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>iBar from Mindstrom</title><content type='html'>Today I tried the &lt;a href="http://www.mindstorm.com/solutions?category=ibar" target="_blank"&gt;iBar&lt;/a&gt; from &lt;a href="http://www.mindstorm.com/" target="_blank"&gt;Mindstrom&lt;/a&gt;. They say that it is the first commercially available multi-touch, interactive, customisable bar in the world and, as far as I know has similar setup as Microsoft Surface. The form factor is different and that’s what makes the product really interesting but Surface seems way ahead when it comes to the technology side. Microsoft Surface feels more robust and has better 360-degree capabilities. In the demos I saw and tried there was no notion of orientation on the things placed on the bar.&lt;br /&gt;&lt;br /&gt;The iBar is about four feet (120 cm) high and maybe seven feet (210 cm) wide but you can connect several iBars together.&lt;br /&gt;&lt;br /&gt;We have talked about building some sort of podium for our Surface to be able to work at it standing. Today’s demo of the iBar convinced me even more. It is really hard to sit at a Surface-table for a longer period of time since you don’t really have a comfortable way of sitting around it. There is no where to place your legs.&lt;br /&gt;&lt;br /&gt;I’m really looking forward to see what other form factors Microsoft are planning for coming versions of Surface!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8356066165716236709?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8356066165716236709/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/04/ibar-from-mindstrom.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8356066165716236709'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8356066165716236709'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/04/ibar-from-mindstrom.html' title='iBar from Mindstrom'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7989049562328141413</id><published>2009-03-16T14:16:00.000+01:00</published><updated>2009-03-16T14:24:07.230+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='General'/><category scheme='http://www.blogger.com/atom/ns#' term='Installation'/><title type='text'>The table is here!</title><content type='html'>&lt;p&gt;Finally the table is in our hands. It was some time ago that the table arrived but I haven’t had time to write anything about it so far. The table was delivered by UPS and they deliver thru the first door of the house. After that it is you own responsibility to move it to the desired location. There is a Site Readiness Guide and I really recommend reading it carefully, specially the parts about Surface Dimensions and Weight. The shipping crate that the unit comes in is huge! I had just assumed that it would arrive on a pallet of standard size but the pallet was wider and didn’t go thru the door. So I had to unpack the Surface unit outside our office and carry it with bare hands. Well not alone since the table weights almost 90 kg.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;br /&gt;Our setup consists of a wall mounted flat screen monitor as a primary display and a Logitech DiNovo Edge Bluetooth keyboard with integrated touchpad for input. I have also set up Live Mesh to simplify deployment of applications that don’t need an installer but more on that on another post.&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Setting up the table was really easy thanks to the great video on the community site where Greg Swanson and David Nichols unpacks and installs a unit. The video can be found under Training Videos in the downloads-section and is named “Installing a Surface Unit”. When you have placed an order, make sure to ask for access to the Surface community via the Surface Business Desk!&lt;br /&gt;At first I was struggling a bit to be able to set up the primary and secondary monitors correctly. I tried to use my normal plug-in-an-external-monitor-to-Windows-Vista-skills but didn’t realize that there is a shortcut to an application to set up the monitors on the desktop. With that in hand the set up was really easy.&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;a href="http://2.bp.blogspot.com/_zHNvN5eY_4U/Sb5SZqDzwSI/AAAAAAAAAOI/3QnZFv5a6qs/s1600-h/IMG_7263.JPG"&gt;&lt;img style="TEXT-ALIGN: center; MARGIN: 0px auto 10px; WIDTH: 500px; DISPLAY: block; CURSOR: hand" id="BLOGGER_PHOTO_ID_5313775211084235042" border="0" alt="" src="http://2.bp.blogspot.com/_zHNvN5eY_4U/Sb5SZqDzwSI/AAAAAAAAAOI/3QnZFv5a6qs/s400/IMG_7263.JPG" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;p&gt;After setting up the monitors, the administrators account, installing antivirus and hooking the unit to our domain it was time to start the Surface Shell. Excited to try our own unit for the first time I forgot to start Surface Input with the result that nothing happened when interacting with the Surface. Then I remembered Dr. Neil saying “There is nothing wrong with the table. Just start Surface Input first.” Surface Input is started by a shortcut on the desktop and starts an application that activates the cameras and makes the unit ready for input.&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;The last two days the unit has been placed in the reception during some events that we have had with customers and the response is massive. People love it! One thing that I have noticed is that it is really interesting to observe new users from a distance. See what they do and how they try to interact with the applications. A lot try to double click and if they don’t receive feedback on interaction right away they start to touch all over the place. One of our developers has built an application that reads image libraries from our Intranet based on SharePoint. It uses the classic folder metaphor and when a user sees a folder they have to double click! But in this application one click on a folder loads the pictures and the next click on the same folder hides the pictures. So by observing users you can learn a lot! This is of course nothing new but became really obvious when they are not only interacting with a new application but also with a new type of interface.&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Now the unit is going back to the developer cave again and that feels good. It is impossible to sit in a public area and develop and test applications.&lt;/p&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7989049562328141413?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7989049562328141413/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/03/table-is-here.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7989049562328141413'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7989049562328141413'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/03/table-is-here.html' title='The table is here!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://2.bp.blogspot.com/_zHNvN5eY_4U/Sb5SZqDzwSI/AAAAAAAAAOI/3QnZFv5a6qs/s72-c/IMG_7263.JPG' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-2616114920906484532</id><published>2009-02-25T09:25:00.000+01:00</published><updated>2009-02-25T09:27:38.466+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Interview'/><category scheme='http://www.blogger.com/atom/ns#' term='MSDN Radio'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Interviewed on MSDN Radio.</title><content type='html'>I have been interviewed on Swedish MSDN Radio! Last week Dag König, who is a Product Technology Specialist at Microsoft Sweden, talked to me about out Surface in general, Surface development and out plans with Surface at Connecta. The interview is in Swedish and is entitled “We put all the cards on the table with Microsoft Surface.” The show is over an hour and the Surface-stuff starts at about 27 minutes into the show and last for 20 minutes.&lt;br /&gt;&lt;br /&gt;&lt;a target="_blank" href="http://buzzfrog.blogs.com/zabrak/2009/02/msdn-radio-23-feb-vi-lgger-alla-kort-p-bordet-med-microsoft-surface.html"&gt;The interview&lt;/a&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-2616114920906484532?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/2616114920906484532/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/interviewed-on-msdn-radio.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2616114920906484532'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/2616114920906484532'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/interviewed-on-msdn-radio.html' title='Interviewed on MSDN Radio.'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-4850391303193066077</id><published>2009-02-25T06:48:00.000+01:00</published><updated>2009-02-25T07:37:29.044+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Training'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Surface training</title><content type='html'>&lt;a href="http://2.bp.blogspot.com/_zHNvN5eY_4U/SaTcJR4mQGI/AAAAAAAAANY/DBHcxL0Fn8c/s1600-h/Cameras.png"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 200px; height: 175px;" src="http://2.bp.blogspot.com/_zHNvN5eY_4U/SaTcJR4mQGI/AAAAAAAAANY/DBHcxL0Fn8c/s200/Cameras.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5306608312927010914" /&gt;&lt;/a&gt;&lt;br /&gt;When me and Jouni were at the Surface training in Munich Jouni wrote an application that uses the raw images from the cameras. The table consists of five cameras, four cameras that take pictures of the corners and one that takes a picture in the center. Then there is a process that goes from the raw images to a binary version of the image with each pixel either black or white for faster processing. The screen is divided into a grid containing one-inch squares. The next step is to place each frames contact data into shared memory and tell the SDK that data is available and ready to use.&lt;br /&gt;&lt;br /&gt;The fact that cameras are used and not just a touch screen is what makes Microsoft Surface so special. Things that happen on the surface are recognized and even things that happen above the surface are noticed. About one inch above things starts to happen.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://4.bp.blogspot.com/_zHNvN5eY_4U/SaTjuUDEUSI/AAAAAAAAANg/uFF9hyfqb-Q/s1600-h/mtc.jpg"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="http://4.bp.blogspot.com/_zHNvN5eY_4U/SaTjuUDEUSI/AAAAAAAAANg/uFF9hyfqb-Q/s400/mtc.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5306616645744349474" /&gt;&lt;/a&gt;The course that we attended took place at one of Microsoft’s Technology Centers (MTC). There are three MTC in Europe, Dublin, Paris and Munich. On these centers Microsoft have three types of offerings, Strategy Briefing, Architecture Design Session and Proof of Concept Workshop. The center was really great even if the lunch was a logistical challenge. You can read more about the centers here: &lt;a target="_blank" href="http://www.microsoft.com/mtc/default.mspx"&gt;http://www.microsoft.com/mtc/default.mspx&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://1.bp.blogspot.com/_zHNvN5eY_4U/SaTkYuy4oTI/AAAAAAAAANo/dwuF9bWsj8c/s1600-h/IMG_7196.JPG"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="http://1.bp.blogspot.com/_zHNvN5eY_4U/SaTkYuy4oTI/AAAAAAAAANo/dwuF9bWsj8c/s400/IMG_7196.JPG" border="0" alt=""id="BLOGGER_PHOTO_ID_5306617374478737714" /&gt;&lt;/a&gt;I had to try Jounis application and the quality of the images that you get from the cameras with my face. &lt;em&gt;"Thank god they can be cleaned was Dr Niels diagnosis."&lt;/em&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://1.bp.blogspot.com/_zHNvN5eY_4U/SaTkvMruWII/AAAAAAAAANw/DYNLWifqVMQ/s1600-h/bjorn_face.png"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="http://1.bp.blogspot.com/_zHNvN5eY_4U/SaTkvMruWII/AAAAAAAAANw/DYNLWifqVMQ/s400/bjorn_face.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5306617760458889346" /&gt;&lt;/a&gt;&lt;br /&gt;The resulting image&lt;br /&gt;&lt;br /&gt;&lt;a href="http://3.bp.blogspot.com/_zHNvN5eY_4U/SaTlBPZAQjI/AAAAAAAAAN4/Ky3km2A0kUY/s1600-h/IMG_7193.JPG"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 400px; height: 450px;" src="http://3.bp.blogspot.com/_zHNvN5eY_4U/SaTlBPZAQjI/AAAAAAAAAN4/Ky3km2A0kUY/s400/IMG_7193.JPG" border="0" alt=""id="BLOGGER_PHOTO_ID_5306618070423323186" /&gt;&lt;/a&gt;Jouni in action&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-4850391303193066077?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/4850391303193066077/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/surface-training_24.html#comment-form' title='2 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/4850391303193066077'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/4850391303193066077'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/surface-training_24.html' title='Surface training'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://2.bp.blogspot.com/_zHNvN5eY_4U/SaTcJR4mQGI/AAAAAAAAANY/DBHcxL0Fn8c/s72-c/Cameras.png' height='72' width='72'/><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8883843588930093276</id><published>2009-02-23T01:07:00.000+01:00</published><updated>2009-02-23T01:58:32.565+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='attract applications'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='water'/><category scheme='http://www.blogger.com/atom/ns#' term='custom development'/><title type='text'>Love at first sight (at least attraction)</title><content type='html'>A very important new concept with Microsoft Surface is "Attract applications". These types of applications are screen-saver like, and are designed to entice people to the table. A good (and by all means fun) attract application should welcome people to touch and use the Surface table.&lt;br /&gt;&lt;br /&gt;&lt;span style="font-weight: bold;"&gt;Water&lt;/span&gt;&lt;br /&gt;The standard attract application that is shipped with Surface is called “Water”. Water might seem a a bit laggy when it’s run through the simulator, but on the table itself it’s beautiful and runs smoothly.  The Water application can be customized a tad by using the Water configuration tool that comes with the Surface SDK.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHqLXL0kBI/AAAAAAAAABY/CPz09FP1pDU/s1600-h/water_configuration.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 315px;" src="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHqLXL0kBI/AAAAAAAAABY/CPz09FP1pDU/s400/water_configuration.jpg" alt="" id="BLOGGER_PHOTO_ID_5305779316942213138" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;span style="font-style: italic;font-size:85%;" &gt;Water Configuration Tool&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-weight: bold;"&gt;Custom attract applications&lt;/span&gt;&lt;br /&gt;It's pretty challenging to create your own attract applications with the Microsoft Surface Interaction Design Guidelines in mind. However, if you go for it strive for an application with very high interactivity and 360 degrees usability. You have to be able to entice people from all sides of the table - and keeping them there. To create a custom attract application, follow these steps:&lt;br /&gt;&lt;br /&gt;1. Develop a Surface application.&lt;br /&gt;2. Modify the application’s description file. (This XML file most likely has the same title as your project, at least if you’ve created the project by using the Visual Studio templates that comes with the Surface SDK). Change the file to look something like this:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHtC1e2rEI/AAAAAAAAABg/4Qzt3y9inaE/s1600-h/attract_xml.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 149px;" src="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHtC1e2rEI/AAAAAAAAABg/4Qzt3y9inaE/s400/attract_xml.jpg" alt="" id="BLOGGER_PHOTO_ID_5305782468991167554" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;span style="font-style: italic;font-size:85%;" &gt;Description file for an attract application&lt;/span&gt;&lt;span style="font-style: italic;"&gt;.&lt;/span&gt;&lt;span style="font-style: italic;font-size:85%;" &gt; (Note: “ExcecutableFile” is the path to your build Surface application).&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;Another option is to just comment out the &lt;application&gt;"application" section in the description XML file and un-comment the &lt;attractapplication&gt; "attractapplication" section.&lt;br /&gt;&lt;br /&gt;3. Deploy the XML file to "%ProgramData%\Microsoft\Surface\Programs". %ProgramData% is a pre-defined path.&lt;br /&gt;4. The next step involves creating a registry key, so if you’re not familiar with handling the Windows registry make sure you create a back-up of the registry before moving on.&lt;br /&gt;5. Add the following registry key "HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Surface\v1.0\AttractMode"&lt;br /&gt;6. Create a new String value to the key AttractMode (from step 5), and call it "CurrentAttractApplication". Set the value to your new attract application’s xml file name, without the file extension. I.e. the above “MyFirstAttractApplication.exe” would be the value “MyFirstAttractApplication”.&lt;br /&gt;&lt;br /&gt;When you restart the Surface shell or Surface simulator your new attract application should load right way. Don’t worry if it doesn’t. If the registry key points to the wrong file, or you're having any other hard-to-guess error, the default application is loaded (normally “Water”).&lt;br /&gt;&lt;br /&gt;Note: The Surface SDK tells you to “Open the registry and navigate to the HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Surface\v1.0\ModeProfiles\Xxxx\AttractMode key (where Xxxx is the appropriate mode profile).”&lt;span style="font-style: italic;"&gt; I can't get this to work, and also Dr. Neil talked about this at the Surface training I attended. &lt;/span&gt;Below you got an example of the suggested SDK  (wrong) way, and one that works.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHxR_MCocI/AAAAAAAAABo/aJ0F8-yYBh4/s1600-h/sdk_attract_error.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 117px;" src="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHxR_MCocI/AAAAAAAAABo/aJ0F8-yYBh4/s400/sdk_attract_error.jpg" alt="" id="BLOGGER_PHOTO_ID_5305787127341162946" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-style: italic;"&gt;Doesn't work&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHxR7dCbJI/AAAAAAAAABw/Uz7Vm0qvVSo/s1600-h/sdk_attract_correct.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 117px;" src="http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHxR7dCbJI/AAAAAAAAABw/Uz7Vm0qvVSo/s400/sdk_attract_correct.jpg" alt="" id="BLOGGER_PHOTO_ID_5305787126338710674" border="0" /&gt;&lt;/a&gt;&lt;span style="font-style: italic;font-size:85%;" &gt;&lt;br /&gt;Works&lt;/span&gt;&lt;span style="font-family:arial;"&gt;&lt;br /&gt;&lt;/span&gt;&lt;/attractapplication&gt;&lt;/application&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8883843588930093276?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8883843588930093276/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/love-at-first-sight-at-least-attraction.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8883843588930093276'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8883843588930093276'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/love-at-first-sight-at-least-attraction.html' title='Love at first sight (at least attraction)'/><author><name>Jouni Pakarinen</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_CDGzx8s_c-U/SaHqLXL0kBI/AAAAAAAAABY/CPz09FP1pDU/s72-c/water_configuration.jpg' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-8483639595267956808</id><published>2009-02-17T13:23:00.000+01:00</published><updated>2009-02-17T17:39:02.438+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='tagged object'/><category scheme='http://www.blogger.com/atom/ns#' term='Training'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><title type='text'>Surface training</title><content type='html'>On Wednesday last week, me and Jouni (the other writer on this blog) went to Munich in Germany to attend one of the first Surface developer courses outside of Redmond. Teacher was Dr Neil Roodyn from Australia. Dr Neil has been working with the Surface team for almost a year, developing applications and giving training. This was one of three occasions in Europe.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://3.bp.blogspot.com/_zHNvN5eY_4U/SZrnRPqOOGI/AAAAAAAAANI/B0awPUsTgZM/s1600-h/dr+neil.jpg"&gt;&lt;img style="MARGIN: 0px 10px 10px 0px; WIDTH: 307px; FLOAT: center; HEIGHT: 230px; CURSOR: hand" id="BLOGGER_PHOTO_ID_5303805794629597282" border="0" alt="" src="http://3.bp.blogspot.com/_zHNvN5eY_4U/SZrnRPqOOGI/AAAAAAAAANI/B0awPUsTgZM/s320/dr+neil.jpg" /&gt;&lt;/a&gt;&lt;br /&gt;Dr. Neil Roodyn&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;The course was titled Building Applications for Microsoft Surface and lasted two days. We were 16 attendees and had two lovely Surface tables at our disposal.&lt;br /&gt;&lt;br /&gt;Dr Neil talked a lot about the Surface vision and the history about the table, how it all started and how it came to be what it is today. The work with the Surface table started back in 2001 and in 2005 it got the current look and feel. In 2007 the first public pictures appeared and at PDC in 2008 it was made available to the public. If it took Microsoft seven years to get Surface to the public I can’t help thinking about what kind of projects they are starting right now that we will se more of in 2015!&lt;br /&gt;&lt;br /&gt;It is really important to think of Microsoft Surface as something else then just a big touch enabled screen. Cause if touch is all that you are looking for then there are much cheaper solutions! Now the unique thing with Microsoft Surface is the interaction with what happens on and above the surface of the Surface.&lt;br /&gt;&lt;br /&gt;Thanks to the vision recognition system Surface is able to detect things on top of the actual surface. About an inch from the surface things are starting to get picked up by the cameras. This information for instance used to detect fingers and the orientation of the finger.&lt;br /&gt;&lt;br /&gt;As usual when you attend a course and have some knowledge of the subject, the first hours or the first day is not really challenging. Although Dr Neil managed to keep my interest and soon we got to start writing code and play with the tables.&lt;br /&gt;&lt;br /&gt;One interesting thing to see on the table compared to the simulator is when you have recognized a tagged object and move it fast over the surface. The vision recognition system is not able to track that it is a tagged object that moves and it becomes a blob instead. But when you stop moving it is recognized as a tag again and the TagVisualizer is animated to the new spot. On the simulator you can move a tagged object with a TagVisualizer at any speed with no problem.&lt;br /&gt;&lt;br /&gt;One part of the course was focused on unpacking, configuring and setting up the table. This part was really good since we haven’t gotten our table yet. It was also great to talk to Dr Neil about different deployment and development environment strategies. He had some interesting thoughts about how to use Live Mesh with Surface that I will try.&lt;br /&gt;&lt;br /&gt;Anyway a really great course but I would have enjoyed more time coding and hands-on Surface-time!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-8483639595267956808?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/8483639595267956808/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/surface-training.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8483639595267956808'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/8483639595267956808'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/surface-training.html' title='Surface training'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://3.bp.blogspot.com/_zHNvN5eY_4U/SZrnRPqOOGI/AAAAAAAAANI/B0awPUsTgZM/s72-c/dr+neil.jpg' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5712520496672930383</id><published>2009-02-04T23:28:00.000+01:00</published><updated>2009-02-05T00:14:42.090+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='contact'/><category scheme='http://www.blogger.com/atom/ns#' term='wpf layer'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><category scheme='http://www.blogger.com/atom/ns#' term='contact events'/><title type='text'>Touchability by Contact Events</title><content type='html'>An event describes an action which occurs in a specific behavior. To add ‘touchability’ to your Surface controls, contact events has to be registered for them. There are a couple of ways to add such contact handlers. The following examples show how to register a handler for capturing a press-and-hold event:&lt;br /&gt;&lt;br /&gt;&lt;span&gt;XAML:&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-family:courier new;"&gt;&lt;span style="color: rgb(51, 51, 255);"&gt;&lt;&lt;span style="color: rgb(153, 51, 0);"&gt;s:SurfaceSlider&lt;/span&gt;&lt;/span&gt; &lt;span style="color: rgb(255, 0, 0);"&gt;x:Name&lt;/span&gt;&lt;span style="color: rgb(51, 51, 255);"&gt;="MySurfaceSlider" &lt;/span&gt;&lt;span style="color: rgb(255, 0, 0);"&gt;ContactHoldGesture&lt;/span&gt;&lt;span style="color: rgb(51, 51, 255);"&gt;="MySurfaceSlider_ContactHoldGesture" /&gt;&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;&lt;/span&gt;&lt;s:surfaceslider name="MySurfaceSlider" contactholdgesture="MySurfaceSlider_ContactHoldGesture"&gt;&lt;br /&gt;&lt;span&gt;C#, first option:&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-family:courier new;"&gt;MySurfaceSlider.ContactHoldGesture += &lt;span style="color: rgb(51, 51, 255);"&gt;new&lt;/span&gt; &lt;span style="color: rgb(0, 204, 204);"&gt;ContactEventHandler&lt;/span&gt;(MySurfaceSlider_ContactHoldGesture);&lt;/span&gt;&lt;br /&gt;&lt;/span&gt;&lt;br /&gt;&lt;span&gt;C#, second option:&lt;/span&gt;&lt;br /&gt;&lt;span style=";font-family:courier new;font-size:85%;"  &gt;&lt;span style="color: rgb(0, 204, 204);"&gt;Contacts&lt;/span&gt;.AddContactHoldGestureHandler(MySurfaceSlider, MySurfaceSlider_ContactHoldGesture);&lt;br /&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-family:courier new;"&gt;&lt;/span&gt;&lt;/s:surfaceslider&gt;&lt;span&gt;The implementation of the contact event handler:&lt;/span&gt;&lt;s:surfaceslider name="MySurfaceSlider" contactholdgesture="MySurfaceSlider_ContactHoldGesture"&gt;&lt;span style="font-family:courier new;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-family:courier new;"&gt;&lt;span style="color: rgb(51, 51, 255);"&gt;private void &lt;/span&gt;MySurfaceSlider_ContactHoldGesture(&lt;span style="color: rgb(51, 51, 255);"&gt;object &lt;/span&gt;sender, &lt;span style="color: rgb(0, 204, 204);"&gt;ContactEventArgs &lt;/span&gt;e)&lt;/span&gt;&lt;br /&gt;&lt;span style="font-family:courier new;"&gt;{&lt;span style="color: rgb(0, 153, 0);"&gt; /* TODO: Handle Contact Hold Gesture event */&lt;/span&gt; }&lt;/span&gt;&lt;br /&gt;&lt;/span&gt;&lt;br /&gt;There are several events that are possible to capture. The following section lists the contact events that are supported in the Surface SDK (version 1.0):&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactDown&lt;/span&gt;, which triggers when a contact is &lt;span&gt;placed on &lt;/span&gt;a Surface control.&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactUp&lt;/span&gt;, which triggers when a contact is &lt;span&gt;removed from &lt;/span&gt;a Surface control.&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactHoldGesture&lt;/span&gt;, which triggers when a Surface control is subject of a &lt;span&gt;press-and-hold &lt;/span&gt;action. &lt;span style="font-style: italic;"&gt;Note: Is only raised when the contact is of type &lt;a href="http://surfacedeveloper.blogspot.com/2009/01/contact-act-or-state-of-touching.html"&gt;Finger&lt;/a&gt;. &lt;/span&gt;&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactTapGesture&lt;/span&gt;, which triggers when a Surface control is &lt;span&gt;being tapped on&lt;/span&gt;.&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactChanged&lt;/span&gt;, which triggers when a contact that is in touch with a Surface control &lt;span&gt;changes its attributes&lt;/span&gt;, i.e. position.&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactEnter&lt;/span&gt;, which triggers when a contact &lt;span&gt;enters a control’s boundaries&lt;/span&gt;, i.e. if a finger (that is already in touch with the Surface) is moved onto a control.&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight: bold;"&gt;ContactLeave&lt;/span&gt;, which triggers when contacts &lt;span&gt;leaves a control’s boundaries&lt;/span&gt;.&lt;/li&gt;&lt;/ul&gt;I feel the &lt;span&gt;&lt;span style="font-weight: bold; font-style: italic;"&gt;ScatterViewItems’ ContactUp &lt;/span&gt;&lt;span style="font-weight: bold;"&gt;&lt;/span&gt;and &lt;span style="font-weight: bold; font-style: italic;"&gt;ContactDown &lt;/span&gt;events &lt;/span&gt;needs a bit of &lt;span&gt;extra information&lt;/span&gt;. ContactUp/Down are handled internally, which prevents you from raising any of the events. If you forget about this while working with ScatterViewItem this might be somewhat confusing. Another topic to keep in mind is the ScatterViewItems’ property ‘StaysActive’. If the property is set to ‘true’ this may affect the ScatterViewItem when a contact is released from it by the control not being deactivated.&lt;br /&gt;&lt;br /&gt;Lastly I’ve posted a C# example of how to check what kind of contact is triggering a contact event.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_CDGzx8s_c-U/SYoY-LL_BkI/AAAAAAAAABQ/njq7oEdJQIU/s1600-h/ContactDown.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 357px;" src="http://4.bp.blogspot.com/_CDGzx8s_c-U/SYoY-LL_BkI/AAAAAAAAABQ/njq7oEdJQIU/s400/ContactDown.jpg" alt="" id="BLOGGER_PHOTO_ID_5299075367988823618" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;/s:surfaceslider&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5712520496672930383?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5712520496672930383/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/touchability-by-contact-events.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5712520496672930383'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5712520496672930383'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/02/touchability-by-contact-events.html' title='Touchability by Contact Events'/><author><name>Jouni Pakarinen</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_CDGzx8s_c-U/SYoY-LL_BkI/AAAAAAAAABQ/njq7oEdJQIU/s72-c/ContactDown.jpg' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7098502647299139499</id><published>2009-01-26T00:12:00.000+01:00</published><updated>2009-01-26T01:01:18.971+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='wpf layer'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><title type='text'>Surface SDK's WPF layer</title><content type='html'>To quickly get around with developing for Microsoft Surface, and understanding how cool multi-touch applications are, the &lt;span style="font-weight: bold;"&gt;WPF layer &lt;/span&gt;is a good starting point. The WPF layer API of the Surface SDK extends &lt;a href="http://msdn.microsoft.com/en-us/library/ms754130.aspx"&gt;Windows Presentation Foundation &lt;/a&gt;to be used in touch-enabled user interfaces. WPF layer controls are standard WPF controls, but Microsoft Surface enabled.&lt;br /&gt;&lt;br /&gt;The WPF layer is actually really easy to get started with. XAML is used to declaratively define the user interface. Also, many of the controls one is familiar with from WPF also exist for Microsoft Surface, only now prefixed by ‘Surface’. The XAML examples below show two versions of a window with the same functionality, one traditional WPF and the other is Surface.&lt;br /&gt;&lt;br /&gt;Standard WPF:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_CDGzx8s_c-U/SXz7hn0DDkI/AAAAAAAAABA/kjCGN6jK9F4/s1600-h/WpfExample.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 125px;" src="http://4.bp.blogspot.com/_CDGzx8s_c-U/SXz7hn0DDkI/AAAAAAAAABA/kjCGN6jK9F4/s400/WpfExample.jpg" alt="" id="BLOGGER_PHOTO_ID_5295383816922402370" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Surface SDK:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_CDGzx8s_c-U/SXz7h6U2GBI/AAAAAAAAABI/JJKHF9aNYYQ/s1600-h/SurfaceExample.jpg"&gt;&lt;img style="cursor: pointer; width: 400px; height: 126px;" src="http://4.bp.blogspot.com/_CDGzx8s_c-U/SXz7h6U2GBI/AAAAAAAAABI/JJKHF9aNYYQ/s400/SurfaceExample.jpg" alt="" id="BLOGGER_PHOTO_ID_5295383821891803154" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-style: italic;"&gt;Note: Normally ‘Click’ is not a contact event, but for SurfaceButton it is. This is worth keeping in mind for later when you start using ContactDown for other controls.&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;As you can see there is not much that differs the two windows. This makes it very easy to transition to Microsoft Surface development and rapidly create touch-enabled applications. Use these mnemonic rules to get started:&lt;br /&gt;&lt;ul&gt;&lt;li&gt;A Surface control is usually named the same thing as you’re used to from WPF, but prefixed with ‘Surface’.&lt;/li&gt;&lt;li&gt;To add a handler for use interactions, the mouse events are now called contact events.&lt;/li&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7098502647299139499?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7098502647299139499/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/wpf-layer.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7098502647299139499'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7098502647299139499'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/wpf-layer.html' title='Surface SDK&apos;s WPF layer'/><author><name>Jouni Pakarinen</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_CDGzx8s_c-U/SXz7hn0DDkI/AAAAAAAAABA/kjCGN6jK9F4/s72-c/WpfExample.jpg' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5394147636504163073</id><published>2009-01-23T01:51:00.000+01:00</published><updated>2009-01-23T02:00:59.981+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='tagged object'/><category scheme='http://www.blogger.com/atom/ns#' term='contact'/><category scheme='http://www.blogger.com/atom/ns#' term='wpf layer'/><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='finger'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><category scheme='http://www.blogger.com/atom/ns#' term='blob'/><title type='text'>Contact: The act or state of touching</title><content type='html'>While being in contact with the Surface you handle more information than when just placing your finger on a traditional touch-enabled screen.  A &lt;span style="font-weight: bold;"&gt;Contact &lt;/span&gt;in ‘Microsoft Surface language’ is the kind of object that touches your Surface screen. The Surface SDK gives you the possibility to recognize different kinds of objects. The ones you can use are &lt;span style="font-weight: bold;"&gt;Finger&lt;/span&gt;, &lt;span style="font-weight: bold;"&gt;Tagged object &lt;/span&gt;or &lt;span style="font-weight: bold;"&gt;Blob&lt;/span&gt;.&lt;br /&gt;&lt;ul&gt;&lt;li&gt;Finger is self-explanatory; your finger in touch with the touch-enabled screen.&lt;/li&gt;&lt;li&gt;Tagged object are objects with an identity tag placed on them. This makes it possible to interpret exactly which object is being placed on the surface table.&lt;/li&gt;&lt;li&gt;Blob is an arbitrary object placed on the screen. You might have seen the demo with a wine glass with a surrounding aura – voila a blob.&lt;/li&gt;&lt;/ul&gt;Ok, so what to do with contacts. The touch-enabled controls for Surface can handle events from user interactions – that is different states of the contacts on the screen. These interactions are called &lt;span style="font-weight: bold;"&gt;gestures &lt;/span&gt;or &lt;span style="font-weight: bold;"&gt;manipulations&lt;/span&gt;.&lt;br /&gt;&lt;br /&gt;Gestures are user activity which doesn’t work differently on whatever element is affected. A tapping or pressing action is a tap or push whether it’s a button or custom user control. Manipulations on the other hand are interactions that depend on what control is being touched and how. A manipulation user action has a context. That means that for one control a twirling motion means to rotate the control, but for another the same user interaction means to twist the control’s content.&lt;br /&gt;&lt;br /&gt;Using the WPF layer of the Surface SDK the Surface controls are enabled to capture the following events:&lt;br /&gt;&lt;ul&gt;&lt;li&gt;ContactDown&lt;/li&gt;&lt;li&gt;ContactUp&lt;/li&gt;&lt;li&gt;ContactTapGesture&lt;/li&gt;&lt;li&gt;ContactHoldGesture&lt;/li&gt;&lt;li&gt;ContactEnter&lt;/li&gt;&lt;li&gt;ContactLeave&lt;/li&gt;&lt;li&gt;ContactChanged&lt;/li&gt;&lt;/ul&gt;More about the mentioned contact events when we come back to the WPF layer in a coming blog posts.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5394147636504163073?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5394147636504163073/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/contact-act-or-state-of-touching.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5394147636504163073'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5394147636504163073'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/contact-act-or-state-of-touching.html' title='Contact: The act or state of touching'/><author><name>Jouni Pakarinen</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-7022466812181044889</id><published>2009-01-17T19:14:00.001+01:00</published><updated>2009-01-17T19:18:07.066+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>Ordering a Surface Table</title><content type='html'>So how do you do when you want to order a Surface table? The first thing you need to do is to contact your local Microsoft representative. From her/him you will get an order form that you are supposed to send to an email address. After that there is nothing. I didn’t get any reply, no confirmation and no nothing. So I waited for a couple of days and then I contacted the local Microsoft representative again and he contacted the Surface Business Desk and managed to get a delivery date! Or at least a date when our unit will leave the warehouse in Germany. So on the 29th of January it will leave Germany so in the beginning of February it will arrive to Stockholm. I can’t wait!&lt;br /&gt;&lt;br /&gt;In the reply from the Surface Business Desk they also said that the team working with the shipments is working fast and furiously to ramp up and ship units to customers. It would be really interesting to know how many units that are ordered in Sweden and in the rest of Europe.&lt;br /&gt;&lt;br /&gt;I’m still waiting to get the exact shipping details and logistics so that I soon can get my hand on our &lt;a target="_blank" href="http://www.youtube.com/watch?v=CZrr7AZ9nCY"&gt;big ass table&lt;/a&gt;!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-7022466812181044889?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/7022466812181044889/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/ordering-surface-table.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7022466812181044889'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/7022466812181044889'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/ordering-surface-table.html' title='Ordering a Surface Table'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-6178542507432397621</id><published>2009-01-17T18:19:00.000+01:00</published><updated>2009-01-17T18:25:15.640+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><title type='text'>Surface simulator</title><content type='html'>&lt;a href="http://1.bp.blogspot.com/_zHNvN5eY_4U/SXITxgHiUEI/AAAAAAAAANA/FEd3oeyvJJk/s1600-h/Simulator.png"&gt;&lt;img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 400px; height: 332px;" src="http://1.bp.blogspot.com/_zHNvN5eY_4U/SXITxgHiUEI/AAAAAAAAANA/FEd3oeyvJJk/s400/Simulator.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5292314253269815362" /&gt;&lt;/a&gt;&lt;br /&gt;When developing applications for the Microsoft Surface you have a Surface Simulator that gets installed when you install the SDK. This can be used to simulate user input and contact with objects that are placed on the Surface-unit.&lt;br /&gt;&lt;br /&gt;So far I have only tried the sample applications that are installed with the SDK and done some simple applications that don’t use any object recognition. But the simulator seems to work fine so far.&lt;br /&gt;&lt;br /&gt;There are differens buttons button in the simulator that is used to simulate a finger or an object place on the Surface. To simulate the use of two fingers you can hold the left mouse button and then click on the right mouse button to place the finger. It is also possible to plug in two usb-mice to simulate two fingers or two objects.&lt;br /&gt;&lt;br /&gt;Today I noticed a really cool feature. If you use a finger or object representation in the simulator and then scroll on the scroll wheel on the mouse the finger or object is rotated. This will come really handy when you use the simulator to display some sort of graphics around a placed object.&lt;br /&gt;&lt;br /&gt;Just remember to start the simulator before starting the application from Visual Studio. Otherwise you will not get access to these features and your application will start in some other mode that I so far don’t know what it’s used for.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-6178542507432397621?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/6178542507432397621/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/surface-simulator.html#comment-form' title='3 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6178542507432397621'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6178542507432397621'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/surface-simulator.html' title='Surface simulator'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_zHNvN5eY_4U/SXITxgHiUEI/AAAAAAAAANA/FEd3oeyvJJk/s72-c/Simulator.png' height='72' width='72'/><thr:total>3</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-5849951596908378390</id><published>2009-01-14T11:13:00.001+01:00</published><updated>2009-01-14T11:15:46.950+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><category scheme='http://www.blogger.com/atom/ns#' term='Installation'/><title type='text'>Answer from the Surface team</title><content type='html'>I also got an answer from Robert Levy on the Surface team. He said that they &lt;em&gt;don´t have a workaround for this right now but are looking closely at allowing installation of the SDK on Win7 for our next release&lt;/em&gt;. There was no word about when this releas is expected.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-5849951596908378390?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/5849951596908378390/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/answer-from-surface-team.html#comment-form' title='1 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5849951596908378390'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/5849951596908378390'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/answer-from-surface-team.html' title='Answer from the Surface team'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-6701198805949776385</id><published>2009-01-14T10:56:00.000+01:00</published><updated>2009-01-14T11:08:10.613+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><category scheme='http://www.blogger.com/atom/ns#' term='Installation'/><title type='text'>Surface on Windows 7 - Now it works!</title><content type='html'>I had actually given up all hopes to be able to install the Surface SDK on Windows 7. Yesterday I tried to consult two of the sharpest wiz-kids at Connecta and made some progress but after a while it was a dead end. I actually had thrown in the towel and decided to go for a dual boot. So I started the disk manager and shrunk the disk to create a new partition with 20 GB to host Windows Vista. Installed Vista on the new partition and then it was too late in the evening to continue.&lt;br /&gt;&lt;br /&gt;And then, this night, at 00:25 there was a reply from Kurt Brockett at Blendables.com on a post that I made to their forum!&lt;br /&gt;&lt;br /&gt;As I already had assumed the only problem with the failed installation is the OS-check at the beginning. A colleague of mine tried to install the SDK on Windows XP and found out that there is a property missing on advapi32.dll that is one of the core dll’s in Windows. This property is of course present in the Vista version and I assume that it’s also there in the Windows 7 version. So if there was only a way to get around the OS-check…&lt;br /&gt;&lt;br /&gt;What Kurt told me in the post was that there is a way to edit msi-packages with a simple vb-script!&lt;br /&gt;&lt;br /&gt;So to be able to install the Surface SDK on Windows 7 just download the script and place it in the same directory as SurfaceSDKWE.msi. Then drag the msi-file and drop it on the removechk.vbs. This will remove the OS-check and the installation of the SDK will work perfectly!&lt;br /&gt;&lt;br /&gt;Now I have started the Surface Simulator and tried the samples and everything works great on Windows 7! Love it!&lt;br /&gt;&lt;br /&gt;&lt;a target="_blank" href="http://blendables.com/forums/p/314/756.aspx"&gt;The thread on Blendables.&lt;/a&gt;&lt;br /&gt;&lt;a target="_new" href="http://www.msfn.org/board/Remove-Installer-OS-Check-t51694.html"&gt;Link to the vbs-file to remove the check.&lt;/a&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-6701198805949776385?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/6701198805949776385/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/oh-yes-surface-on-windows-7.html#comment-form' title='7 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6701198805949776385'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/6701198805949776385'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/oh-yes-surface-on-windows-7.html' title='Surface on Windows 7 - Now it works!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>7</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-1448112782516214604</id><published>2009-01-12T20:20:00.000+01:00</published><updated>2009-01-12T20:43:28.335+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Surface'/><category scheme='http://www.blogger.com/atom/ns#' term='Windows 7'/><category scheme='http://www.blogger.com/atom/ns#' term='SDK'/><category scheme='http://www.blogger.com/atom/ns#' term='Installation'/><title type='text'>Surface on Windows 7</title><content type='html'>Today I decided to install Windows 7 on my developer machine. First I tried an upgrade but it was unsuccessful since I only had the Enterprise version of Vista and beta 1 of Windows 7 is Ultimate. So instead I tried a clean install and that was really smooth. I started the installation directly from a mounted image in Vista and it was finished after 30 or maybe 45 minutes. No drivers or other installations messing things up. The only thing that didn’t work – so far – was Daemon Tools. Instead I downloaded &lt;a target="_blank" href="http://www.PowerISO.se"&gt;PowerISO&lt;/a&gt; and that worked perfectly. So far I haven’t had any limitations with the unregistered version.&lt;br /&gt;&lt;br /&gt;F-Secure Antivirus, Office 2007 and Visual Studio 2008 was also easy but when it came to the Surface SDK I got some problems. The XNA Redistributable was no problem but right at the beginning of the installation of Microsoft Surface SDK 1.0, Workstation Edition I get an error telling me that I’ve got the wrong Service Pack version for Vista installed. The software requirements say that I have to use Vista Business, Enterprise or Ultimate with Service Pack 1. So I’m stuck!&lt;br /&gt;&lt;br /&gt;I have sent an email to one of the guys on the Surface Team at Microsoft and a &lt;a target="_blank" href="http://nuigroup.com/forums/viewthread/4085/"&gt;post&lt;/a&gt; in the &lt;a target="_blank" href="http://www.nuigroup.com/"&gt;NUI Groups&lt;/a&gt; forum hoping for the best.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-1448112782516214604?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/1448112782516214604/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/surface-on-windows-7.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1448112782516214604'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/1448112782516214604'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/surface-on-windows-7.html' title='Surface on Windows 7'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7107524622185637438.post-3686491760912843036</id><published>2009-01-08T12:58:00.000+01:00</published><updated>2009-01-08T13:04:41.564+01:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='General'/><title type='text'>I'm a Surface Developer, yes I am!</title><content type='html'>This blog, Surface Developer, is about developing for the &lt;a target="_blank" href="http://www.microsoft.com/surface/index.html"&gt;Microsoft Surface&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;The company that I work for, &lt;a href="http://www.connecta.se"&gt;Connecta AB&lt;/a&gt;, finally agreed to let me order a Surface table yesterday. So now we have assigned a Scrum Master, formed a Scrum team, set one person responsible for the business parts and myself as responsible for the technical aspects. I will also be part of the Scrum team as a developer.&lt;br /&gt;&lt;br /&gt;Hopefully I will get someone else from the team to contribute to this blog but I will wait with any deeper presentation of the team members until then.&lt;br /&gt;&lt;br /&gt;I myself also run a blog in Swedish at &lt;a target="_blank" href="http://bjorneriksen.blogspot.com"&gt;http://bjorneriksen.blogspot.com&lt;/a&gt; but my feeling is that this might attract an international horde of readers so I assume that English is a more suitable language.&lt;br /&gt;&lt;br /&gt;Hopefully we will be able to post videos, pictures and stuff about the applications that we develop.&lt;br /&gt;&lt;br /&gt;Right now I'm waiting for a comfirmation of my order and a planned delivery date and it is also time to start planning a kick off!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7107524622185637438-3686491760912843036?l=surfacedeveloper.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://surfacedeveloper.blogspot.com/feeds/3686491760912843036/comments/default' title='Kommentarer till inlägget'/><link rel='replies' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/im-surface-developer-yes-i-am.html#comment-form' title='0 kommentarer'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/3686491760912843036'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7107524622185637438/posts/default/3686491760912843036'/><link rel='alternate' type='text/html' href='http://surfacedeveloper.blogspot.com/2009/01/im-surface-developer-yes-i-am.html' title='I&apos;m a Surface Developer, yes I am!'/><author><name>Björn Eriksen</name><uri>http://www.blogger.com/profile/09832002921122594696</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='21' height='32' src='http://1.bp.blogspot.com/_zHNvN5eY_4U/SWb3Stlm0LI/AAAAAAAAAMo/pzt3Sb5e4kA/S220/Bjoern_DSC_8041.jpg'/></author><thr:total>0</thr:total></entry></feed>
