Monthly Archive for November, 2009

Idee: Flash als Fallback für Silverlight

Die Entscheidung für Flash oder Silverlight wird häufig auf Grund der Verbreitung der jeweiligen Laufzeitumgebung getroffen und da hat momentan Flash ganz eindeutig die Nase vorne. Doch es gibt Szenarien in denen Silverlight trotz dieses Mankos eine sinnvolle Alternative ist. Umso wichtiger ist es dann, auf das Fehlen des Plug-Ins vorbereitet zu sein.

Adobe bettet Flash-Inhalte entweder per JavaScript oder Kombination aus Object- und Embed-Tag in eine HTML-Seite ein. Microsoft beschränkt sich hier Standardkonform für Silverlight auf das Object-Tag. Und das Schöne an diesem Object-Tag ist, dass, wenn der Browser damit nichts anfangen kann, das nächste Kindelement angezeigt wird. Bei Silverlight ist das üblicherweise ein Bild mit Link zur Installation von Silverlight.

1
2
3
4
5
6
7
8
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
  <param name="source" value="ClientBin/silverlight.xap" />
  <param name="minRuntimeVersion" value="3.0.40818.0" />
  <param name="autoUpgrade" value="true" />
  <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none">
    <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" />
  </a>
</object>

Dieses Verhalten kann man aber auch dafür nutzen, anstelle des Bildes Flash anzuzeigen. Wenn man Beispielsweise Silverlight für die Wiedergabe eines Videos bevorzugt, dann könnte als Fallback ein Flash-Video-Player erscheinen – es unterstützen ja beide H264, so dass sogar das gleiche Video zum Einsatz käme. Dafür ist es von Vorteil, wenn Flash auch den Standardweg gehen würde, was mit ein paar Modifikationen am Object-Tag auch klappt.

1
2
3
<object data="flash.swf" type="application/x-shockwave-flash" width="100%" height="100%">
  <param name="movie" value="flash.swf" />
</object>

Und da hier auch das kaskadierende Verhalten bei einem fehlenden PlugIn stattfindet, kann somit Flash als Fallback für Silverlight dienen und sollte auch Flash fehlen, dann kann beispielsweise ein Downloadlink wahlweise für Silverlight oder Flash geboten werden.

1
2
3
4
5
6
7
8
9
10
11
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
  <param name="source" value="ClientBin/silverlight.xap" />
  <param name="minRuntimeVersion" value="3.0.40818.0" />
  <param name="autoUpgrade" value="true" />
  <object data="flash.swf" type="application/x-shockwave-flash" width="100%" height="100%">
    <param name="movie" value="flash.swf" />
    <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none">
      <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" />
    </a>
  </object>
</object>

Flash CS4 Grundlagen: Interaktive Anwendungen ohne Vorkenntnisse erstellen

[vimeo 7782849 500 282]

Hier noch der Programmcode für einen einfachen Mausverfolger (Mouse Follower):

1
2
3
4
5
6
7
// Lausche dem Ereignis ENTER_FRAME ähnlich einem Metronom
addEventListener(Event.ENTER_FRAME, enterFrameHandler);
// Nähere Objekt dem Mauszeiger wenn das Ereignis stattfindet
function enterFrameHandler(event:Event):void {
	follower.x += follower.mouseX/16;
	follower.y += follower.mouseY/16;
}

Designer-Developer-Workflow Slides

Nach drei spannenden Tagen auf der WebTech Konferenz in Karlsruhe habe ich mich heute morgen sehr darüber gefreut, dass es doch so viele Leute zu meinem Vortrag zum Thema Designer-Developer-Workflow geschafft haben. Es hat mir wieder sehr viel Spaß gemacht.

Für alle, die sich selber ein Bild vom Inhalt machen möchten, sind hier nun die Folien als PDF:

  • Folien zum Designer-Developer-Workflow als PDF
  • Die Beispiele für Flex/Flash und Silverlight finden sich hier als ZIP:

  • Silverlight 3
  • Flex 3
  • Sobald die Aufzeichnung des Vortrags verfügbar ist, sage ich Bescheid. Einzelne Teile wie z. B. die kurze Beschreibung des Presentation Models in Flex, Prototyping mit SketchFlow und den einen oder anderen Tipp rund um Silverlight und Flash möchte ich noch als Screencast nachliefern, sobald mal wieder etwas mehr Zeit übrig ist. Und über Kritik, Anregungen und Wünsche freue ich mich sehr.