Making an Integrator

There are still a lot of names for it but I’m going with ‘Integrator.’ I’m not sure exactly who coined this but I tend to like it. But what is an Integrator? At least in the context of the WPF/Silverlight world an Integrator tends to be some one that sits between a design team and the developer team at least initially when a company first gets someone to fill the integrator role. In the long term the Integrator becomes more the designer as part of an integrated team where there is not a design team or a developer team and we get into this Agile sort of cross discipline team that is building better UX faster in order of magnitude then anything before. There are lots of things that have come together of the past few decades to make this kind of team possible. We are going to focus on the Integrator but let take a quick look at the cross discipline team that the integrator role tends to move teams towards.

The New UX team tends to be on one spectrum a developer that can do dev work in the data base, in the web services space and then into the .NET and WPF. This developer might be a software architect with expanded data modeling an application modeling etc but tends to also be able to do some light reasonable UI and knows what good design looks like. The next team member might be an IA or Information Architect. Granted the Software Architect might have some IA skills and if so might even be a UX Architect. So the IA helps make sure the data and the flow of the IA in the IA are solid on the up take for the team but on the end the IA is making sure the user experience is good and doing user testing and other interfacing with users to make sure what they see makes since and works well.

From IA we start to get into the Integrator role, the Integrator will have a sound understanding of IA, UX and be able to write code but most importantly they are able to visually decompose what they see into Xaml and do design and design integration. Going Past the Integrator is the pure designer then might live in more disconnected tools. But as a team evolves into this sort of zen state each role including the dev’s, the IA, the architects, the designers and integrators tend to take on some of the skills of all the others. When everyone can do a little bit of everything the team is able to functional more tightly than ever before using some version of Agile and WPF/Silverlight todo more better and faster than before. It is even possible to take this even further and bring in the PM (Project Manager) to be able to work with customers and take on much of the skills of the IA.

In a way the Integrator can become kind of a seed that when planted in the fertile soil of a dev team that loves design and a design team that loves to see their hot designs alive over time turns the team into a UX monster (in a good way). Here is where we see the best innovation and the hottest UX (User eXperiences) at least in my experience.

Integrators are not born though they have to be grown (again in my experience). Now we get to the point of the article… how do you grow, build or otherwise make and Integrator?
So there seems to be two kinds of coal for building the integrator: The Designer and The Developer. In either case there are good points and bad points about each kind of ‘coal’…
For the Developer (especially/mainly the WPF/Silverlight developer) the good points are if they are already comfortable with Xaml and building WPF/Silverlight applications jumping into blend and becoming technically proficient is relatively straight forward but on the downside… if a developer doesn’t have any design sense at all… really give up now before you hurt someone. The hardest part of making a rock star integrator is getting a design sense, point 8 Helvetica is NOT the same as point 9 Ariel and if there is a question over it then you need to start again. Ok so we then make a huge assumption that you have some design sense. How do you cultivate it? Well ideally working in blend with some hot designers (and no this does not mean ‘hot’ looking although that is good too). But here is a good reading list for the dev aspiring ‘Design Integrator’

• Presentation Zen (really you must stop making crappy slides) http://www.amazon.com/Presentation-Zen-Simple-Design-Delivery/dp/0321525655/ref=sr_1_1?ie=UTF8&s=books&qid=1259022426&sr=8-1

• A Whole New Mind by Daniel Pink http://www.amazon.com/Whole-New-Mind-Right-Brainers-Future/dp/1594481717/ref=sr_1_1?ie=UTF8&s=books&qid=1259022506&sr=1-1

• Foundation Expression Blend 3 with Silverlight By Victor Gaudioso (http://www.amazon.com/Foundation-Expression-Blend-Silverlight-Foundations/dp/1430219505/ref=sr_1_1?ie=UTF8&s=books&qid=1259021904&sr=8-1 )

• Neuro Web Design – What makes them click? by Weinschenk http://www.amazon.com/Neuro-Web-Design-Makes-Click/dp/0321603605/ref=sr_1_1?ie=UTF8&s=books&qid=1259022564&sr=1-1

• Information Architecture by Wodtike and Govella http://www.amazon.com/Information-Architecture-Blueprints-Web-2nd/dp/0321600800/ref=sr_1_2?ie=UTF8&s=books&qid=1259022633&sr=1-2

• MVVM for tards (http://tard.codeplex.com/ )

• Foundation Silverlight 3 Animation by Jeff Paries http://www.amazon.com/Foundation-Silverlight-Animation-Jeff-Paries/dp/143022407X/ref=sr_1_1?ie=UTF8&s=books&qid=1259022673&sr=1-1

Once you get this or in the process of getting this along with working with a designer is learning how to talk to designers. More than any other thing is team dynamics and team dynamics is primarily about good communication. Outside of the basics of good communication is when coming from the dev world to the design world you need to get in touch with the vernacular as much as possible. Working with designers you can get it from osmosis to some degree assuming you don’t piss them off, part of this means that when you talk to designers about changing their process understand that you probably don’t understand their world and that you can’t be condescending with really you probably don’t know what you are talking about when it comes to design. As an example designer typically don’t’ name and group elements in the same way that a dev is going to need them. When you talk to designers about naming conventions you need to be nice and explain why you need their help to have things grouped and named in the assets even from Photoshop and Illustrator.

What about making a designer into an integrator?

In this case the biggest problem tends to be getting past the normal design tools to looking at Xaml at times, wiring up a basic event and some basic code. Understanding the basics of how to work with dev’s is secondary to getting the new design integrator up to speed. While the designer brings the most critical skill to the Integrator role (being a design sense) they have a huge learning curve to wrap their mind around Xaml and Code. While a designer doesn’t need to code an Integrator needs too at least a bit. Much like the dev needing to understand design at a certain level the same goes for the designer to understand some coding in the context of Xaml and Visual Studio.

So how do you get a Designer to be able to write a method in Visual Studio? I would say to start with the most obvious and that is blend. The designer has to be interested in being an Integrator. If the designer is not passionate about learning to make their designs real then they are going to have a hard time. Starting with Blend the tool is designed to at least on some level be straight forward for designers and for starters they can focus on the WYSIWYG. For example all the short cut key codes are the same or mostly the same as Photoshop and the tool is great for doing WYSIWYG sort of ‘design’ but the native format is Xaml. Once the designer gets to the point of being limited then introducing Xaml to the designer is a great next step. So building on this to being able to wire up and event in code and launching in VSTS is about the limit. Here is where the sweet spot kind of happens and this like the dev being an integrator works best when it is a composite designer developer team.

From a learning standpoint the reading list might be:

• Foundation Silverlight 3 Animation by Jeff Peries http://www.amazon.com/Foundation-Silverlight-Animation-Jeff-Paries/dp/143022407X/ref=sr_1_1?ie=UTF8&s=books&qid=1259022673&sr=1-1

• Foundation Expression Blend 3 with Silverlight By Victor Gaudioso (http://www.amazon.com/Foundation-Expression-Blend-Silverlight-Foundations/dp/1430219505/ref=sr_1_1?ie=UTF8&s=books&qid=1259021904&sr=8-1 )

• MVVM for tards (http://tard.codeplex.com/ )
• A Whole New Mind by Daniel Pink http://www.amazon.com/Whole-New-Mind-Right-Brainers-Future/dp/1594481717/ref=sr_1_1?ie=UTF8&s=books&qid=1259022506&sr=1-1

• Neuro Web Design – What makes them click? by Weinschenk http://www.amazon.com/Neuro-Web-Design-Makes-Click/dp/0321603605/ref=sr_1_1?ie=UTF8&s=books&qid=1259022564&sr=1-1

• Information Architecture by Wodtike and Govella http://www.amazon.com/Information-Architecture-Blueprints-Web-2nd/dp/0321600800/ref=sr_1_2?ie=UTF8&s=books&qid=1259022633&sr=1-2

So let us go back to what is an Integrator?

The Integrator needs to appreciate design and to do good design and recognize good design. An Integrator needs to be able to be able to visually decompose a design and build it in Blend as Xaml. An Integrator needs to learn how to talk to designers and developers and be able understand the needs of both. Dev’s need names, designers need design time data and that sort of thing. Most of all the Integrator needs to help facilitate the communication dynamic between design and development and that is what makes the magic juice you see in some of the high end UX companies building on the Microsoft Stack.

Lastly one of the key aspects of getting companies to buy off on supporting the transition from traditional approaches to composite teams (of designers, developers and integrators and IA’s and anyone else we can get our hands) is ROI for better UX. Companies need to see how better UX can increase productivity, increase sales and user satisfaction and more. And they need to see how the composite team using designers, developers and integrators using the Microsoft WPF/Silverlight stack (Xaml, .NET 4, Visual Studio, Expression Suite) saves development costs, time to market and enable the better UX in general. That is the job of the integrator…

MSDN Webcast: geekSpeak: Composite Application Development (Level 200)

Start Date: Wednesday, August 19, 2009 12:00 PM Pacific Time (US & Canada)
Duration: 60 minutes
Audience: developer

In this geekSpeak, Microsoft Most Valuable Professional (MVP) David Kelley discusses composite application development in Microsoft Silverlight and Windows Presentation Foundation (WPF). He covers the Silverlight Designer/Developer workflow, tooling, design patterns, anti-practices, and working with distributed teams. Your hosts for this geekSpeak are Glen Gordon and Mithun Dhar.

The geekSpeak webcast series brings you industry experts in a "talk-radio" format hosted by developer evangelists from Microsoft. These experts share their knowledge and experience about a particular developer technology and are ready to answer your questions in real time during the webcast. To ask a question in advance of the live webcast, or for post-show resources, be sure to visit the geekSpeak blog.

Guest Presenter: David Kelley, Senior Software Architect, IdentityMine

David Kelley is a Microsoft Most Valuable Professional (MVP) for Microsoft Silverlight, and he has been building Web-based, distributed applications for more than ten years. He is a Silverlight user experience architect at IdentityMine, and his passion is building user experiences that are elegant and easy to use. David's career highlights include a Silverlight demonstration with Bill Gates at TechEd 2008, and developing the "Entertainment Tonight" Web site for the Silverlight 1 launch and Emmy Awards. In his spare time, David is the executive officer of the Seattle Designer Developer Interaction Group.


Click Here to Register

Simon a case study part 1 - designer developer work flow

So I while back a friend of mine and whom is another person that shows up to the local designer developer Interaction group and myself were talking about a simple demo app we could do that would show case a number of things, our goal was a good sample she could use on her resume and be a good sample application that could show case designer developer work flow and composite application development. Her idea was todo a simple Simon says game that we would have in Silverlight. As a team (such that two people being a designer and UX dev can be) we had our 'business requirement' but we needed to build on that with a comp or visual vision of what we wanted and a story (use case brief, scenario or other excuse for the same). Our user story went something like this:

John doe wants to play a game like Simon says. John sees link on a web page that says 'Simon says.' John clicks link and he doesn't have Silverlight installed so he gets a 'install me' link with a faded image of Simon. John can see from the faded image that Simon is what he is looking for and decided to install Silverlight. John then go to the Simon link and Simon comes up. John can click the new button to start a game and play a traditional game of Simon says buy following the sound and light patterns and clicking the appropriate game pads. John is able to use the high score button to see his high score. John has fun with and easy to use game and spends to much time playing the game.

with this as our user story, Ariel (the designer, names changed to protect the innocent or not) put together a wonderful bit of Xaml. Ariel being familiar with working with dev's took into account that things needed to be groups, and names reasonable or I would have a hard time working with the asset. For me the first thing I did was load the project and start to wire it up. One would think that Simon shouldn't be too complicated and at first it wasn't. A few events, and a game timer using a story board and we are good. Being the retentive dev that I am, I've had to learn to let go of that when it comes to Xaml as this tends to hamper or slow down the design to the point of just not being worth the time invested.

That all being the case we soon had a working game. Part of learning to work together and further learning to work on the same code at the same time that Silverlight and by extension WPF (actually that might be the other way around) is having the designer and dev work from source control. I know allot of dev's will have a cow about letting designer touch source control but its really not that hard. check out file, check in file... really even a designer can get the hang of it when their tool (Blend 3) supports it now. So we put this in source control (http://Simon.codeplex.com/). the one little detail we had to over come though was Silverlight 2 vs Silverlight 3 and we both were on opposite sides of the fence. This probably was our biggest issue we had to work out where we disagreed. And any time there is a designer and developer on the same project you tend to have at least one disagreement. We ended up eventually on Silverlight 3 as it supports more, the tools are better and it is being released next week. But generally deciding on any issue should be done based on the requirements and when the requirements don't provide enough bases then other reasons should come into play. The key then is to communicate. granted we hear that in everything from time immemorial but really how much do we have to tell people before the get it. 'TALK' things through and normally logic will dictate the best solution.

moving on...

Once in source and having the app running we would start building the application out. Ariel can muck with the design in more detail and focus on the finer points of the design to it was pixel perfect and I could play with game logic and function and we both could do it at the same time. Truly a zen moment for designer developer relations.

Xaml Guidelines, Part 1

Check out Jonathan, Jared and Nathan on Xaml Guidelines on Channel 9. I know this is focused alot of WPF but as suggested on their post it applies to Silverlight AND wpf.

http://channel9.msdn.com/shows/Continuum/XAML-Guidelines-Part-1/Default.aspx?wa=wsignin1.0

Silverlight 2 Performance Best Practices

Here is some more 'content' summary info from my Architectural Best Practices presentation at DevTeach.

As to performance best practices… use the following as a good starting place:

· Don’t stretch things including Images, videos, or paths. Stretching things is going to cause more processing. Create assets at the size that they will be used and life will be much easier.

· Don’t use ECMA Script or the Anti-Pattern Silverlight 1.0.

· Don’t use windowless mode.

· Remove event handlers and set them to null before removing the element from the visual tree.

· Set MediaElement sources to null before removing them from the tree.

· Don’t use opacity if you just need to make things disappear, instead use the visibility property.

· Do use ‘IsHitTest’ and set it to false when doing drag and drop do hit testing only happens on the elements that are drag targets. This also allows you to keep visual elements from interfering with role over related events such as Mouse Enter and Mouse Exit events.

· Don’t have 1000 thousand elements in the same Visual Tree…

· If something is going to take a while tell the user or show the user that we are waiting.

· Don’t use ‘findName’ if you don’t have too as this causes a walk through the visual tree.

At least following these rules for Architecture and Performance your application won’t fall on its face.

Architectural Best Practices for Silverlight 2.0

these will or could change when people that are smarter then me publish material I'm sure but in my work on everything from the emmy site for the SL 1.0, lauch or Crossfader for the BG keynote, or innovate on or msn or the mix 08 stuff etc this all seems to be a nice bulleted list of best practices for Silverlight 2. we will see what happens when there is a Silverlight 3.o so with much ado:

Underlying Silverlight architecture helps us abstracted UI from logic and we need to take into account this toolability story that Silverlight enables as this can provide more ROI and shorter time to market for application development if designers and developers can work at the same time without the whole ‘through it over the fence’ approach. From a design pattern standpoint I recommend pMVP or Proxy Model View Presenter as the ‘better’ design patterns I know of require more upfront development as Silverlight doesn’t support the underlying infrastructure for these patterns. pMVP keeps it simple and the simplest solution is usually the best.
For Architectural best practices lets bullet out our best practices:

· Design Pattern pMVP (Proxy Model View Presenter) which is a clean, simple design pattern to implement that gives better abstraction.

· Make use of designer developer workflow enabled by Xaml UI separation.

· Don’t impose artificial Xaml coding conventions on designers or yourself as this slows productivity. Just let Blend go with it.

· Agree on Naming conventions, coding conventions (maybe standard WPF conventions might be a good place to start) and the like as you like but be consistent so that it is easier to support and pick up again later. This improves readability and helps the whole designer developer interaction.

· For the most part doing event bindings in Xaml, the more in Xaml the better however use common sense. If the designers are using Photoshop and converting the Xaml maybe just do the bindings in code so that you can have the designer just do a new conversion to generate new Xaml if they might make changes.

· Build at lest the Presenter logic in a separate Silverlight library.

· Build generic custom controls in a library.

· Consider putting the presenter code in a separate library or at least its own folder.

· Build Views with Blendablity in mind. Break up complex user controls that build the View into its component parts so that the elements can be more easily worked with in Blend.

· Use Gobal Styles and Templates and other resources in the App.xaml only when they are truly global in the application. Don’t clutter up the global resources with elements that are not really global.

· Use best practices with other connected technologies such as WCF or SQL or IIS/ASP.NET. Best practices in Silverlight wont’ do you much good if everything else is a mess.

· IF you build controls that rely on the DOM bridge encapsulate the ECMA related resources either in a Xap or right into the control so the ‘user’ as the simplest method to use the control.

· Consider the install experience to encourage users to install Silverlight so they can use your Silverlight application. Just using the default badge is boring.

· Consider Search Engine Optimization if it is a public site, such as control element names and the HTML on the Silverlight page etc. event the names of Xaml elements as a lot of this will be in the Xap that will at some point be parsed by search engine spiders.

That gives us a nice list of best architectural best practices. Following these simple rules lets you approach Silverlight architecture and application design with ease. Now we didn’t go into a lot of the application ‘Design’ aspects of ‘Designing’ applications such as UML etc but the focus here is strictly on Silverlight.

VS Power Commands

If your into this sort of thing in Visual Studio...

http://code.msdn.microsoft.com/PowerCommands

very cool stuff.

Dev Teach 2008 Toronto Canada

I'm doing at least 3 sessions at DevTeach Dec 1-5th in Toronto Canada so far the 3 sessions I'm doing are:

Building Silverlight Controls
David J Kelley - SLV467
Designed primarily for Developers. This technical presentation walks through a number of senerios for building Silverlight Controls including user controls and custom panels. The usage of properties, dependency properties, events, reusability, and encapsulated control architecture is reviewed in detail. In the presentation we will build a custom chart control based on a user control and built custom panels and review dispatch timer and multi threading in the context of controls.

Hacking Silverlight 2 - For Designers and Developers
David J Kelley - SLV469
Designed for Designers and Developers. This engaging presentation gets the audience involved in bridging the gap between design teams and software development using Silverlight and the Silverlight toolablity story. The presentation is full of audience participation and skits that get audience members up out of their seats and excited about Silverlight. The basics of team work using Microsoft tools for design and development are used and the audience is shown some of the coolest Silverlight hacks that can make Silverlight applications really shine. With the “Coming out of the closet” skit the audience is shown sexy UI using Silverlight, learning about speed of development and why we care about Sexy engaging Web 2.0 experiences.

SilverLight 2.0 Achitectural Best Practices
David J Kelley - SLV421
Designed Developers and Architects or people wanting to understand Silverlight archtecture. This presentation startings with a detailed technical review of Silverlight control, application architecture and design patterns. Design patterns as applied to Silverlight application development and general best practices are reviewed in detail. The presentation includes learning from the trenchs of building Silverlight apps on a large scale including horror stories and ‘Anti-Patterns’ or things ‘not to do’ are reviewed.

check out http://www.devteach.com/Session.aspx for more information

Tools and the Silverlight Tool-ability Story

Yea, yea enough with the corporate marketing ‘fu fu’, just remember I learned real manly man programming on a Mac in ANSI C that happened to be a 68k series Mac in code warrior using the mac tool box in the 80’s and if you even know what that means then you might really ask why all the devotion to Microsoft and Silverlight. And for that matter why write a book for developers AND designers? So here is my case.

I have built some cool things in tools like flash, and by all means this is cool stuff. One of my favorite things about flash in particular is that it runs anywhere on any reasonable browser even my current old fashion PPC phone or my friends Mac or my other friends Linux box. It’s just cool what you can do. But have done my share of action script it really reminds me of a comparison between ‘classic’ ASP and ASP.NET. It is a fundamental shift. Take the Emmy site we did at IdentityMine, this web app had to mix and match video, allow users to play producer suck up numerous feeds running off of Linux box’s using Perl scripts to build out UI elements in Xaml and do drag and drop different kinds of video scrubbing depending on the state of the application and the mode it was in and really provide a rich Web 2.0 experience and by all means there are some things that flash does that Silverlight doesn’t but building this complicated system in 8 days would have been just impossible at least for any dev team I have dealt with in Flash. The tools just are not there.

Granted I probably would not even considered doing it and it really was laughable when first presented to me but hey the money was in line with what it would take to give up 8 days of my life and we had a reputation for doing the impossible so what the heck we would try to do it. And 8 agonizing days later I’ve changed religions as it were and now I’m writing a book and live a breath Silverlight.

Getting back to this tool ability story around Silverlight when I first went to collage I studied photography and computer science for a year and a half. In high school I loved computers but having been music and art I loved beautiful things. I would spend hours rearranging this at my apartment to the point that they would look out of a magazine and I would make my own deco to get the right look and would obsess of design. Photography as opposed to other art allowed me to get to the level or precision in my art that I loved. I’m not Michelangelo so hand drawings and the like I could never get to the level of perfection that my OCD (obsessive compulsive disorder) needed to not send me into some kind of break down.

So in photography I found a home, I loved the idea of lines of composition and building form and contrast and the like but when it came to deciding I felt that my best path was to focus on one, namely computer science and programming in particular. In this case my code became my art but I kept this obsession for perfection in design and when my designer friends got me hooked on using Expression blend on one side and Visual Studio on the other… I was hooked. Truly Zen has been achieved in a superior design tool and Visual Studio at the same time. What more could I want from a toolability story.

Silverlight 2.0 Asset Enumeration

I did a post a while back about a cool trick to download bits in a zip file and save it all in an enumeration in the base application class that is built dynamically without knowing exactly what is in the zip. The earlier post was strickly Silverlight 1.0 javascript so here it is in Silverlight 2.0 C#.

So first I created some private properties in the base class:

private Downloader _DL = new Downloader();
private string _AssetEnumerationPath = "http://localhost:58377/TestSite/Assets.zip";
private AssetItem[] _AssetSourceEnum = null;
private string _Errors = string.Empty;
private Canvas _Item1 = null;
public Downloader AssetEnum = null;

So also instead of being industries and using JSON the index file is a CSV in the sample. So bascially I put a CSV file and three bits of xaml for the test project. Then in Page_Loaded we use a downloader, associate a few events and fire off the event at our zip file like this:

_DL.Open("GET", new Uri(_AssetEnumerationPath));
_DL.Completed += new EventHandler(_DL_Completed);
_DL.DownloadFailed += new ErrorEventHandler(_DL_DownloadFailed);
_DL.Send();

in our _DL_Completed then we pull out the index and we know what todo with whats in the file. In this case we save it at the root so it can be used or bound to things and we also can muck around with it in this case we pull out all the Xaml source and put it into an array. Anyway the entire mess can be downloaded as one zip and we don't have to muck with it. Each control we build can go grab what it needs out of the zip or out of some other array we cached at the root.

try
{
Downloader TempDL = sender as Downloader;
string[] NameArray = TempDL.GetResponseText("Assets/index.csv").Split(',');
_AssetSourceEnum = new AssetItem[NameArray.Length];
for (int x = 0; x < NameArray.Length; x++)
{
_AssetSourceEnum[x] = new AssetItem();
_AssetSourceEnum[x].Name = NameArray[x];
_AssetSourceEnum[x].Xaml = TempDL.GetResponseText("Assets/" + NameArray[x].ToString());
}
AssetEnum = TempDL;
}
catch (Exception E)
{
_Errors = E.Message;
}

simple nice and dirty.

Silverlight Sidebar Gadgets in 64bit Vista

As a matter of 'fact' Silverlight doesn't run in a 64bit IE browser... ok fine but if your running 64bit Vista you probably won’t see this as an issue as the default is the 32bit version that runs fine. And I'm sure at some point Silverlight will work in 64bit version of Vista. But the side bar gadget framework is in fact paired with the OS type so on a 64bit version of Vista... no Silverlight for you.

Ok so I'm not really that patient with waiting for the new wiz bang 2.0 version of silverlight that is 64bit so I have this little hack... installer that will correct the problem and allow 'Silverlight' to run in the side bar of a 64bit version of Vista.

If you are not running a 64bit version of Vista then this email is not important. No need to read farther.

So I started to go down the road of mucking up my regestry to do this but that proved to time consuming so I have built this simple code base (and silverlight gadget) so I can get my silverlight gadgets to run in my sidebar on my 64bit version of vista.

http://www.HackingSilverlight.net/Samples/Sidebar32on64.Codebase.zip

and gadget:

http://www.HackingSilverlight.net/Samples/Blender.Gadget

So basically there are two binaries. One will search the running processes and kill the sidebar process and then spins up the 32bit version. The next basically installs the other and sets it up to run each time a user logs in so they get the 32bit version of the side bar that actually supports Silverlight.

VS TFS Hack...

Here is a little hack for Visual Studio that is useful if you are using Team Foundation Server (TFS) and Visual Studio 8 and dont' want VS to auto connect...

I got this from another friend (WPF guy) Karim H.

"Below is a registry setting which will prevent VS from attempting to automatically connect to TFS on launch. Instead you will need to hit the refresh button in Source Control Explorer, or open a solution with bindings to TFS."

[HKEY_CURRENT_USER\SOFTWARE\Microsoft\VisualStudio\8.0\TeamFoundation]
"AutoLoadServer"=dword:00000000

ASP.NET Server Controls in VS 2008 and .NET 3.5 and Sharepoint

Today is going to be a bit of a rant. Background on the issue is that in VS 2005 I have written server controls for ASP.NET and Web Parts for Share Point. Typically for building Share Point web parts I like to developement them as server controls to so I have this nice easy structure to work with until I have something that does basically what I want. The trick with a server control is basically basic C# stuff. First you make a class and inherit from your base control and then you overwrite a method and add some declaritive stuff and then you can use it on your page by using a register in the ASPX. Then you can use your tag to create an instance of your control. Also this can then be put into its own dll and added to VS's toolbar and you can pass the dll around to friends etc and everyone can have this cool dll. Now to turn the control into a web part basically you change the base class, add a few using statements and change the output method name, make sure its all in a dll and your good. So far so good right?
For a server control, the class basically looks like this:

[ToolboxData("<{0}:SomeName id=\"\" runat=\"server\" />")]
public class SomeName: System.Web.UI.WebControls.WebControl
{ protected override void Render(HtmlTextWriter writer)
{
writer.Write(PresentHTML()); // some method we make...
}
}

We also add a few bindable properties like id or width or title or something that might look like this:

private string _Id = string.Empty;

[Bindable(true), Category("Appearance"), DefaultValue("")]

public string id
{
get
{ return _Id;
}
set
{ _Id = value;
}
}

Again straight forward stuff. right? We also might add other functionality of course and we have it in a name space but this is the key bits above. Now to turn this into a 'WebPart' we make it look something like this:

[DefaultProperty("Text"),
ToolboxData("<{0}:MyWebPart runat=server>"), XmlRoot(Namespace = "MyWebPart")]
public class MyWebPart : WebPart
{
private string _Id = string.Empty;
[Bindable(true), Category("Appearance"), DefaultValue("")]

public string id
{
get
{ return _Id;
}
set
{ _Id = value;
}
}

protected override void RenderWebPart(HtmlTextWriter writer)
{
writer.Write(PresentHTML()); // our private method that does the real work...
}
}
not a big change and again pretty straight forward. I dont' show all the properties and methods like the one reference to 'PresentHTML' which is just a private method that returns a string. This is the basic stuff needed for sharepoint. The one other thing is to make sure you have the using statements that reference all our Sharepoint bits:

using Microsoft.SharePoint.Utilities;
using Microsoft.SharePoint.WebPartPages;
using Microsoft.SharePoint.WebControls;

and of course the sharepoint dll that your building to needs to be referenced. So to use the server control version you have to create a Register tag in your ASP.NET that looks like this:

<%@ Register TagPrefix="prefix" Namespace="ControlNameSpace" %>

then in the ASPX page we can add the tag for our control to test it without all the jumping around you need todo with Share Point. In this case it might look like this:

This is 'All Good' in VS 2005 but the other day (earlier this morning) I had to make it work in VS 2008 for embededing a webpart 'Silverlight' control into Sharepoint. So I got to the test page of the silverlight project and do basically the above and make a web part that writes out all my Silverlight stuff (actually it was Devin's Silverlight app). This way we care wire up bits that the web part needs to pass into the Silverlight class todo its thing for when it actually has to live in Sharepoint. I would have thought this easy enough...

So I add the class and set it up as a server control. I add the references, and the register for the tag prefix and namespace reference and then add a tag to the control that should create the silverlight app. I compile it and try to run it and it blows up entirely. After fighting with this for some time it turns out that you need to have an 'Assembly' reference in the register tag in VS 2008/.NET 3.5 for a server control to be able to run in ASP.NET 3.5. So then it looks something more like this:

<%@ Register TagPrefix="prefix" Namespace="ServiceNamespace" Assembly="SilverlightApp" %>

The part that bothered me is that if the class is in the same assembly as the rest of the site and we call out the name space and class specifically it should be able to find the default assembly since its run in that assembly... but alas I was wrong. Not that, that is a surprise but it always seems to surprise me when I am. :)

Silverlight 1.1 As A Sharepoint Web Part

Recently I did a project where I had to embed a Silverlight web part into sharepoint. You would think this is easy if you haven't done web parts before. At least thats what I thought. Granted I have done web parts but it always surprises how much jumping around I had todo. I found what worked best for me was to create the 1.1 project as a silverlight based server control in a web site that ran all the bits and then to install that in the same domain as the sharepoint server. At first I tried to make the web part duplicate what the server control did but for some reason Sharepoint would make it render is such a way that the silverlight ended up hidden... I tried a few things but decided to use an iframe. This way the web part only outputs a iframe pointed at the controls default page that loads the silverlight interface. Works like a charm too. :) That sounds good but the steps ended up being something like this:

Silverlight Site Configuration

1. Copy the Silverlight Website folder to Server Location.
2. Open IIS Manager (Start-> All Programs -> Administrative Tools -> Internet Information Services (IIS) Manager)
3. Open Server Node (local Computer)
4. Open ‘Web Sites’ node.
5. Open Default running web site node
6. Right Click web site node and select New -> Virtual Directory
7. When the Virtual Directory Creation Wizard comes up click next
8. Enter the correct Alias ‘[some name]’
9. Click ‘Next’
10. Click ‘Browse’ and find the physical location of the site directory by drilling down in the ‘Browse For Folder’ and then select ‘OK’
11. Click ‘Next’
12. Select ‘Run Scripts’ check box
13. Click ‘Next’
14. Click ‘Finish’

Web Part Configuration

1. Make sure the wep part project is compiled.
2. Copy the project to the Sharepoint server.
3. Copy the WebPart.dll to the bin directory under the wwwroot.
4. From the VS command prompt navigate to the bin directory under wwwroot.
5. gacutil the dll which should look something like this: gacutil –i WebPart.dll
6. from this same location in the VS command prompt use the command: sn –T WebPart.dll to find the strong name key. For example: 7dd6db7c5d0189b7
7. Find the Sharepoint Web.config by opening up the IIS Manager and selecting the core site and then right click on the web.config and file the file location.
8. Add a ‘safecontrol’ node to the safecontrols section like this:
Assembly="WebPart, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=7dd6db7c2d0088b7"
Namespace="[some name space]"
TypeName="*"
Safe="True"
/>

9. Make sure the dwp file has a valid public token.
10. Go to the Sharepoint home page.
11. Click Site Actions and select ‘Show Page Editing Toolbar’
12. Click Page button in the toolbar.
13. Select ‘Add Web Parts’ -> Import
14. Click Browse and find the dwp file in the project.
15. Click ‘Upload’
16. Select ‘Add to: Top Zone’
17. Click ‘Import’
18. Close the import right hand bar
19. Select publish from the toolbar

So I'm not saying this is the right method or the best way todo it but it worked for me in my case... abit of a hack but well its Sharepoint :)

Silverlight - Associating Files in Visual Studio

So here is a Visual Studio trick I picked up from Josh in WPF land that applies to Silverlight. One issue we found in Silverlight was when we were building big Silverlight applications and custom user controls that the XAML and .js files were not associated to each other. But in Visual Studio if you know what todo its pretty straight forward. Then yoru 'XAML files can have JavaScript code files even if created seperating with different names.

Here is how you do it. When you silverlight solution and project is open in Visual Studio Right click on the project in the visual studio solution explorer. Click 'Unload Project'. If the solution is tied to Source control you will get a dialog 'Attempt to unload projects with shared checkouts' and you can select the option you want. So assuming you select 'continue' then the project is unloaded. Right click on the project and select Edit [project filename].csproj. You will see the project file open up in a raw xml edit mode. Fine the 'itemgroup' collection that has the file you want to make dependent on another file. Add a 'DependentUpon' node to the node that is your file and put the name of the file you want your file to be under. Save and close the project file. Then you right click the project and click 'reload' the project.
Its a cool trick and sure helped me clean up a few huge messy projects.

Silverlight, JSON and Automatic Design Asset Zip and index generation...

Lets say we have a huge silverlight application. And lets say that we have a lot of images, xaml and media that we use in our application. Silverlight does a great job of allowing us to use downloaders and catch events and deal with it but lets say we want to just do it once. Download everything in one file and then apply our assets. We also don't want all of the loose assets floating around our Silverlight apps directory structure...

From an architectural stand point this is a much cleaner method of keeping additional assets packaged especially when there is a lot of xaml and images etc and keep it as small as possible over the wire. Silverlight allows us to address all that by being able to download zip files. On the downside there is not dynamic way to know what is in the zip file and plus it is a pain to have to do it on your own. So this is how I addressed it.

First I built a windows application project in Visual Studio without any windows. I added directories with all my design assets and set them to be content and show up in the output directory. When you compile the project it builds out the executable and copies all the folders and assets added to the project to the output directory. From here Visual Studio starts the application. Although it doesn't have a UI persay it starts by looking for any zips that might be in the directory and deletes them.

Now the cool part happens... it looks at all the diretories and creates an index JSON file for each folder. It saves these all in the root of each directory and then proceeds to create zip files for each directory automatically. All I need todo is then have this projects zip files that are generated in the output folder be copied to my Silverlight project directory structure as a pre or post build event and I'm good. All these additional assets are kept nicely packaged and out of the main project. And I didn't have to mess with it on my own.

Also note that the attached project doesn't have the zip.exe that builds the zip via console commands passed to it. You can use the command line version of any thing like pkzip etc but you will have to edit the source of the main application to make it work. I have my own licensed copy of this command line tool that (pkzipc.exe) which is what the argument structure is designed for.