Ich bin gerade auf ein witziges (Amateur-)Werbevideo von Google gestossen. Eine Hauptrolle darin spielt eine imposante Ansammlung von 34 GSA GB-9009 (die aber offensichtlich nicht laufen, sonst wär's wohl nicht so ruhig im Video).
Eine Box kann 30 Millionen Dokumente indexieren, mal 34 gibt etwas mehr als eine Milliarde. Das ist in etwa sowiel, wie google.com im Jahr 2000 im Index hatte. Das ist zwar schon 10 Jahre her, aber wenn man bedenkt, dass man dafür heute keine Schar Informatiker mehr braucht und das relativ einfach im Keller installieren kann, finde ich das schon noch ziemlich beeindruckend.
Heute darf ich bei der HSLU über Social Media und die Auswirkung auf interne Kommunikation und Kultur in Unternehmen aus meiner persönlichen Erfahrung reden. Frau Dr. Jacqueline Holzer, Institut für Kommunikation und Marketing, stellt im Dialog auch kritische Fragen, die in der Praxis auftauchen.
Die Zahlen, die ich von Sabine Dufaux hab, spiegeln, dass Social Media in unserem Alltag einfach stattfindetoffline und online / intern und extern / privat und geschäftlich. Dazu hab ich mir ein paar Thesen überlegt (Danke an meinen Sparringpartner Jürg für die Idee) So konnte ich der eher klassischen Agenda 'soziales Leben' einhauchen.
1. Menschen kommunizieren, generieren Inhalte
2. Realität ist auch online
3. Privat und Geschäft verschmelzen
4. Intern wird extern und umgekehrt
5. Mauern und Hierarchien fallen
Aus der Praxis gibts Jans Geburtstagskuchen (der Teil der Kultur ist und zum Kommunikationsinhalt wird) und eine interne Frage von Samuel Peyer, die auf Twitter (extern) beantwortet wird. Wie aus einem Mitarbeiterprojekt wiederum externe Kommunikation wird, erzähl ich am I like Beispiel. Danke Mihi Risch für die 100 Aufkleber, die ich verschenken darf.
Mein Fazit ist: Kommunikationsleute werden künftig noch weniger trennen zwischen interner und externer Kommunikation und die Unternehmenskultur wird mehr vom Dialog geprägt. Persönliche Meinungen bereichern die bisherigen Botschaften oder ersetzen sie gar. Ich denke, die Herausforderungen für Firmen liegen beim Verstehen und Respektieren der neuen Kommunikation, der Sozialkompetenz (die zur Medienkompetenz gehört), Vertrauen und Transparenz. Aber all meine Gedanken dazu kann ich hier nicht wiedergeben. Wer spontan noch dabei sein möchte, ist herzlich eingeladen (heute, 18.30 Uhr), ein Kommentar hier und ein Zugticket nach Luzern reichen. Sonst ist die Präsi hier.
Wenn Ihr noch Ideen habt, nehme ich die gerne bis 17.30 Uhr in die Präsi auf.
Dann hat das leider nichts mit neuen Feiertagen zu tun.
Obwohl, eigentlich gibt es schon etwas zu feiern:
Der Kult-Taschen-Hersteller Freitag bringt eine neue Kollektion mit dem schönen Namen "Reference Line" heraus. (persoenlich.com berichtet). Die neue Linie besticht durch Eleganz, wobei sich die Marke ihrer Grundsubstanz treu bleibt und weiterhin auf LKW-Planen setzt.
Eine schöne Micosite macht Lust auf die neuen Taschen (man muss nur ein wenig Geduld mitbringen, dann "entblättert" sich der Text). Umgesetzt wurde die Microsite übrigens von Namics ;-)
Nein, nicht die Emex war für mich gut investierte Zeit. Eine Messe mit Werbeartikeln, Verpackungsfirmen und ein paar „geschulte Verkäufer-Sprüche". Die erinnerten mich leicht an die E-Mail-, Facebook- und XING-Wucht der Veranstalter. Es dürfte gerne etwas weniger davon in meinen Inboxen landen. Aber die Online Ecke war für mich den Besuch wert.
Nicht nur, weil ich gerade so die Präsi von Thomas Lang sehen durfte, gespickt mit fetzigen Beispielen, wie zugara. Dort kann ich dank Augmented Reality tatsächlich Kleidungsstücke virtuell probieren und dann gings noch um Online Wine Handel. Da war ich vom Flickrn und Twittern abgelenkt.
Dann kamen Marcel Albertin und Felix Kaiser mit ihrer Prezi. Hab ich die eigentlich das erstemal live gesehen? Präsi und Prezi haben mich beeindruckt und Wandersocken für 39.90 CHF (!) auch. Im Dialog zeigten die Jungs Visionäres und den Praxis-Check für E-Commerce. Jetzt versteh ich, warum ich Multichannel und PIM (Product Information Management) bei uns oft in einem Atemzug mit E-Commerce höre.
Die beiden Referenten (die ich spontan Namics Pirates taufte) waren zu bescheiden, einen Vortrag ein zweites Mal zu posten. Drum mach ich das jetzt.
jQuery ist ein mächtiges Framework welches das Arbeiten mit JavaScript stark erleichtert. Mittlerweile ist jQuery mit Abstand das verbreitetste JavaScript Framework der Welt. Ganze UI-Elemente wie Tabs, oder Funktionsblöcke wie etwa eine Bildergalerie sucht man jedoch - bei jQuery selber - vergeblich. jQuery stellt lediglich zahlreiche mehr oder minder kleine Helfer zur Verfügung, welche es ermöglichen, solche Dinge mit geringem Aufwand zu erstellen.
Nun ist es natürlich nicht praktisch komplexe Funktionen wieder und wieder - und für jedes Projekt neu - zu schreiben. Hier kommen die "jQuery Plugins" ins Spiel. Ein jQuery Plugin ist in der Regel eine Erweiterung von jQuery und kann beliebig komplexe Funktionen - von History Handling über UI-Elemente bis zu Lightboxen - bereitstellen.
Aufbau eines Plugins
Die jQuery Plugin API dient dazu, jQuery um neue Funktionen zu erweitern:
Plugins sind meist sehr ähnlich aufgebaut. Sie werden in der Regel auf ein Set von HTML Elementen angewendet und man kann das Verhalten des Plugins mit Optionen etwas beeinflussen. In etwa so:
var options = {
activeTab: 2
};
$('div.tabs').tabsPlugin(options);
Damit würde man etwas HTML Code...
...in ein Modul verwandeln das etwa wie folgt aussieht:
Das Plugin hat dabei meist eigene Optionen, sogenannte Defaults. Diese werden durch die Optionen, welche der Benutzer dem Plugin beim Aufruf mitgegeben hat ergänzt:
var options = $.extend({}, $.fn.tabsPlugin.defaults, userOptions);
Innerhalb des Plugins, wird danach die entsprechende Plugin-Funktion auf jedem einzelnen der übergebenen Elemente ausgeführt. Dabei muss darauf geachtet werden, dass die Funktion nur auf das jeweilige Element Einfluss hat, damit mehrere Elemente auf der Seite die gleiche Funktionalität haben können.
var $tabSets = $(this);
$tabSets.each(function(){
// Auf jedem Element die gewünschte Funktion ausführen
var $tabSet = $(this); // Aktuelles Tab-Set
...
});
Nun soll's ein bisschen anders sein...
Ein Problem vieler Plugins ist, dass sie zwar meist ihre Aufgabe gut erledigen, nicht selten auch viele Optionen mitbringen, aber nicht flexibel oder erweiterbar sind. Nehmen wir ein Plugin, das aus einem Set an HTML Elementen ein Tab-UI generieren soll. Dieses Plugin übernimmt das Sammeln der Tabs und zugehörigen Panels, sowie das Ein- und Ausblenden der Panels beim Klick auf ein Tab. Ausserdem bringt es noch einige Optionen mit, womit der Benutzer festlegen kann, welche Klassen die ausgewählten Tabs haben sollen und welches Tab zu Beginn aktiviert werden soll. Ist doch Perfekt, nicht?
Was nun, wenn der Inhalt des Panels beim Aufruf der Seite noch nicht vorhanden ist sondern erst nachgeladen werden soll, wenn man das entsprechende Tab aktiviert? Herkömmliche Plugins versagen hier oft und gewünschte Funktionalität muss direkt im Plugin eingefügt werden. Dabei geht die Update-Fähigkeit verloren und es leidet die Wiederverwendbarkeit und Sicherheit des Projekts. Im Wissen, dass der Benutzer vielleicht mit dem Plugin noch weiter Anwendungsfälle hat neigt der Autor des Plugins dazu, möglichst viele Funktionen in sein Plugin zu stecken, da er es ja flexibel halten möchte. Damit wird es gross, schwerfällig und unübersichtlich und verfügt über eine Menge Funktionen, welche viele unter Umständen gar nicht brauchen. Der Autor des besagten Tab-Plugins muss dabei an Tastatur-Bedienbarkeit, Ajax- und History-Fähigkeit sowie vieles mehr denken.
Evented jQuery Plugins = flexibel & erweiterbar
Eine Lösung für dieses Problem lautet Custom Events oder kürzer - Evented. Dabei muss sich der Plugin Autor überlegen, welche grundlegende Funktionen das Plugin benötigt und stellt diese in einer möglichst schlichten Form zur Verfügung.
Ein Tab-UI-Element hat im Grossen und Ganzen eine Funktion: Beim Klick auf ein Tab, soll das zugehörige Panel aktiviert und alle anderen deaktiviert werden. Wir brauchen also eine "activate" Funktion. Ausserdem müssen zu Beginn alle Tabs gesucht, und die zugehörigen Panels gespeichert werden. Dazu benötigen wir eine "setupTabs" Funktion. Des weiteren sollten die Panels wissen, zu welchem Tab sie gehören: "setupPanels". Beim Aufruf der Seite sollen diese beiden Funktionen ausgeführt werden und das erste Tab aktiviert werden, dazu brauchen wir noch eine letzte Funktion, die "initialize" Funktion.
Diese Funktionen sind "Events". Jedes übergebene Set an HTML Elementen wird mit diesen Events versehen. Da der Event damit immer zu einem Tab-Element gehört, kann damit auch das Problem von allfälligen Konflikten mit anderen Tab-Elementen einfach gelöst werden. Wenn auf einer Seite zwei Tab-Elemente vorhanden sind, beeinfluss Tab-Verbund eins den zweiten Tab-Verbund nicht, wenn darauf der activate Event ausgeführt wird:
Der Trick besteht nun darin, dass diese Funktionen nicht einfach fest in das Plugin integriert sind, sondern das jede einzelne Funktion in ein Array gepackt wird, welches über ein Objekt customEvents von aussen Zugänglich ist. Die Funktions-Array können dadurch ergänzt, oder gar ganz überschrieben werden, bevor das Plugin auf ein Set von HTML Elementen angewendet wird.
Im unserem Beispiel wollten wir, dass der Inhalt des Panels erst vom Server geladen wird, wenn das Tab aktiviert wird. Die Vorgehensweise ist nun denkbar einfach, man fügt einfach vor der Plugin-Standard-Funktion eine neue Funktion hinzu, welche den Inhalt des Panels via Ajax vom Server lädt. Dabei muss man zu keiner Zeit das Plugin selber verändern. Wenn der Plugin Autor ein Bug-Fix veröffentlich, kann das Plugin einfach aktualisiert werden - die Grundfunktionen werden die gleichen bleiben und die Erweiterung wird nicht tangiert da sie sich ausserhalb des Plugins befindet.
// Neue Funktion vor die bestehende
// activate Funktion schieben:
customEvents.activate.unshift( function(options) {
// Die Erweiterung auf das Grund-Element
// (nicht die einzelnen Tabs) binden:
this.bind("activate." + options.namespace,
function(e, selectedTab) {
// Den Inhalt des Tabs hier
// per Ajax in das Panel laden:
var url= selectedTab.href;
$(selected).data('$panel').load(url);
});
});
Der Kern des Plugins ist dabei lediglich dafür verantwortlich, dass die Default Einstellungen mit den Benutzer-Optionen ergänzt werden und dass danach alle Tab-Elemente die Custom Events erhalten.
Hello World!
Nachdem man dieses erweiterbare und flexible Tabs-Plugin geschrieben hat, ist es natürlich schön, wenn sich der Rest der Welt auch daran erfreuen kann. In meinem nächsten Post werde ich zeigen, wo und wie man ein eigenes Plugin veröffentlichen kann und was dabei zu beachten ist.
Gestern bei ECO im TV: Eine schöne, ausführliche Reportage über Sika und was das Unternehmen so macht. Obwohl weltweit aktiv und in mehreren Feldern der Spezialchemie Weltmarktführer scheint Sika nicht so bekannt zu sein, es sein müsste.
Was vor 100 Jahren mit dem ersten Gothard-Tunnel begann, geht heute mit dem neuesten Gotthard-Projekt (dem längsten Tunnel der Welt!) in eine erfolgreiche Zukunft.
Mehr zu Jörg Schlumpf und seinem Gotthard-Projekt kann man übrigens in seinem blog erfahren.
Leider lässt die Reportage ein wenig die weiteren Wirkungsfelder vermissen. Ein paar interessante Insights aus der Sicht von Studenten, Berufsanfängern und Sika-Mitarbeitern gibt es im Experience-blog.
Dort gibt es auch mehr Infos zur Geschichte der Sika.
Wer sich für das ganze Sika 100 Jahre Projekt interessiert. Hier gehts zum Projekt, das wir mit viel Spass und Freude mit der Sika umsetzen durften.
Da sind sie wieder, die Apokalyptiker und Integrierten, deren Dialoge mit verträglicher Regelmäßigkeit die Geschichte der Massenmedien bereichern. Dem aufgeklärten Leser ist diese Unterscheidung nicht fremd. Umberto Eco hat so die Vertreter der medienkritischen und medienschaffenden Zunft voneinander unterschieden (Apokalyptiker und Integrierte. Zur kritischen Kritik der Massenkultur).
Diese Woche reflektieren Chris Anderson und Michael Wolff beide Positionen in einem bemerkenswerten Artikel auf Wired. „Das Web ist tot" (genauer genommen: der Browser) stellen sie mehr oder weniger wehmütig fest. Für beide Autoren ist der Browser das Symbol einer individualistischen lean-forward Kommunikation, die durch Monopolisierung und Standardisierung von geschlossenen Systemen (Facebook und Apple) gefärdet ist. Zweispaltig stellen sie die Verantwortlichen gegenüber: uns selbst auf der einen Seite, das System (den Kulturkapitalismus) auf der anderen.
„It is the cycle of capitalism. The story of industrial revolutions, after all, is a story of battles over control. A technology is invented, it spreads, a thousand flowers bloom, and then someone finds a way to own it, locking out others. It happens every time
[ ... und wir sind froh, dass es uns die Monopolisten so einfach machen, denn wir sehnen uns so oft nach Standards und so selten nach Komplexität ...] As much as we intellectually appreciate openness, at the end of the day we favor the easiest path." (Chris Anderson) „So it's not shocking that Jobs' iPad-enabled vision of media's future looks more like media's past. In this scenario, Jobs is a mogul straight out of the studio system." (Michael Wolff)
So gesehen erscheint die Frage nach dem Verursacher der Lean-Back-Renaissance wie die Frage nach Henne oder Ei. Auch im monopolistischen Kapitalismus gehören immer mindestens zwei Faktoren dazu eine Situation zu schaffen: Angebot und Nachfrage.
Hinter den Spiegeln
Die Frage hinter dieser Diskussion ist dieselbe, wie die des medienkritischen Diskurses am Ende des letzten Jahrtausends: Welchen Wert hat individuelle Selbstbestimmung, Schaffenskraft und Kreativität gegenüber großen monopolartiger (Medien-)Unternehmungen, die zu einer fragwürdigen Nivellierung von Informationen und Möglichkeiten führen und gleichzeitig Abhängigkeiten schaffen, die auch den aufgeklärtesten Menschen in Unmündigkeit halten können.
Apokalyptiker warnen vor dieser Nivellierung und Unmündigkeit und bauen dabei beständig Widerstände gegen den kapitalistischen Fortschritt in seinem Lauf auf. Gleichzeitig gleiten die Integrierten mit systemkonformer Performance durch die schöne neue Welt und schaffen befreit von Reflexion einen Fortschritt nach dem Anderen.
Michael Wolffs Vergleich von Steve Jobs als einem Mogul aus dem Studio-System aus der Medien-Vergangenheit ist in dieser Hinsicht treffen, aber auch der Vergleich selbst entstammt einer Position aus der Zeit von One-Way-Massenmedien: in diesem Moment ist Wolff ein Apokalyptiker.
Dass nicht hinter jeder individualistischen Position ein so kluger Kopf steckt zeigt die aktuelle Diskussion über google Street View in Deutschland. Hier werden Biedermänner zum Sand im Getriebe und nehmen in der Tiefe des Sommerlochs eine apokalyptische Position ein.
Auch wenn fundamentalistische Kulturkritik aus der Mode gekommen ist, macht es in Anbetracht der oben beschriebenen Diskussionen durchaus Sinn, die Positionen von Apokalyptikern und Integrierten beizubehalten.
Das Modell erweitern
Die Entwicklung im Bereich der sozialen Medien führen neben den Polen von Apokalyptikern und Integrierten zu einer weiteren Unterscheidung, die von David White als Präzisierung des Begriffs „Digital Natives" eingeführt wurde, und von Peter Kruse in dem sehenswerten (!!!) Vortrag auf der re:publica 2010 eindrucksvoll veranschaulicht und empirisch gestützt wurde: die Unterscheidung in „Digital Visitors" und „Digital Residents". Kruse sieht hier einen Diskurs unterschiedlicher Werte, der sich in der Frage unterscheiden, ob Menschen das Internet als gleichwertigen Kommunikationsraum in jeder Beziehung verstehen und nutzen.
Kruse sieht die „Residents" als Befürworter und Nutzer des sozialen Netzes und offener Standards, die Kontrolle und Hierarchien ablehnend. „Visitors" beschreibt er als Menschen, die in der Entwicklung und Offenheit des sozialen Netzes eine Gefahr sehen. Residents sind so gesehen eher Integrierte, Visitors eher die Apokalyptiker.
(Lesenswert unter diesem Aspekt das Gespräch zwischen Ilse Aigner und Sascha Lobo „Sie werden wieder überheblich" (http://www.spiegel.de/spiegel/0,1518,708305,00.html))
Fruchtbarer ist es jedoch Apokalyptiker und Integrierte als eigenständige Dimension zu betrachten- „Visitors" und „Residents" als eine weitere. Es ergibt sich eine Matrix mit vier Idealtypen, die sich auf Grund der oben beschriebenen vier Pole zuordnen lassen.
Es entstehen neben den oben beschriebenen vier Polen vier Typen, die im Folgen als Prototypen beschrieben werden:
Digitale Skeptiker:
Können sich dem Medium nicht ganz verweigern, beurteilen die Entwicklung jedoch generell kulturpessimistisch und nutzen das Internet nur so wie es gerade notwendig ist. (E-Mail, Nachrichten, Recherche) Street View ist ein guter Aufhänger neuen Medien die Grenzen aufzuzeigen.
Digitale Konsumisten:
Nutzen soziale Medien bestenfalls als „Flagge zeigen" aber nicht als Alternative zur alltäglichen Kommunikation. Orientieren sich an Standards, kaufen online ein, schauen Filme etc. Street View wird eine tolle neue Möglichkeit Informationen zu gewinnen.
Digitale Anarchisten:
Sind ausgesprochen aktiv in sozialen Medien und dem Mainstream gefühlt immer eine Plattform voraus. Bewerten geschlossene Systeme und Monopolbestrebungen negativ. Haben in der Regel kein iPhone und ihr Facebook Profil in den letzten zwei Monaten zunehmend vernachlässigt. Stehen Themen wie Street View nicht wegen der Privatsphäre sondern der Allgegenwärtigkeit von google skeptisch gegenüber.
Digitale Konformisten:
Neben alles was kommt und sind spätestens dann auf einer Plattform vertreten, wenn die im heute Journal einen Beitrag mit „früher war es mySpace und SecondLife - heute ist es ..." einleitet. Konformisten streben nach Standards, Sicherheit und Kontinuität. Sie haben verstanden, dass ihre Privatsphäre online genauso sicher ist wie offline. Schnelle Konformisten haben Bilder aus ihrer Strasse schon längst an google und ihren Facebook Account gesendet.
Definitiv ins Blaue gedacht. Mir macht es grade Spaß meine Freunde, Mitarbeiter und Prominenz in die Schubladen zu stecken ...
Wie nutzen Spitäler ihr Intranet? Dieser Frage ging ich im Rahmen meiner Masterarbeit nach. Als fünfter und letzter Teil einer Serie (Teil 1 - Teil 2 - Teil 3 - Teil 4) ziehe ich in diesem Beitrag das Fazit meiner Untersuchung.
Der Informatiker Dick Stenmark meint, dass wenn ein Intranet zur Unterstützung des Wissensmanagements in Gebrauch genommen werden möchte, drei Perspektiven Berücksichtigung finden sollten: Zum Ersten die „information perspective", zum Zweiten die „awareness perspective" und zum Dritten die „communication perspective". Das heisst, ein Intranet sollte nicht nur aktuelle Informationen und wichtige Dokumente bereitstellen, sondern die Mitarbeitenden auch unterstützen mit der täglichen Informationsflut umgehen zu können. Sprich: Funktionalitäten bereitstellen, die die Mitarbeitenden auf neu hinzugefügte Informationen aufmerksam macht, ihnen ermöglicht Favoriten zu setzen oder Seiten zu abonnieren. Mit der „awareness perspective" ist zudem gemeint, dass Fähigkeiten und Expertisen der Mitarbeitenden eingesehen werden können bzw. auch entsprechend nach Kompetenzen gesucht werden kann. Die Suche ist dann auch ein weiteres Element, das unter diese Perspektive fällt und die in den Intranets der Spitäler entweder gar nicht vorhanden ist oder aber nur unzureichende Suchresultate liefert.
Da ein Intranet nebst dem Wissensmanagement auch noch andere Aufgaben zu erfüllen hat, habe ich nebst den Perspektiven von Stenmark die „support perspective" eingeführt. Genau dieser Perspektive kommt insbesondere im Spitalumfeld grosse Bedeutung zu. So geben die Spitalmitarbeitenden mehrheitlich an, dass ein ihre Tätigkeit optimal unterstützendes Intranet ein digitales Instrument zur Unterstützung der Arbeitsprozesse sei. Auch konnte gezeigt werden, dass jene Spitalmitarbeitenden, die das Intranet regelmässig nutzen, auch stärker bei der Arbeit unterstützt werden als andere (siehe Teil 3). Grösstenteils werden die Spitalmitarbeitenden allerdings noch immer nur „teilweise" durch das Intranet bei der Arbeit unterstützt. Intranets bieten demnach im Spitalumfeld viel Potential die Mitarbeitenden bei der Arbeit zu unterstützen - allerdings wird es noch nicht ausgeschöpft. Rasche Verbesserung dürften hier Online-Formulare, -Aufträge, -Bestellprozesse oder dergleichen bringen.
Insgesamt kann der Schluss gezogen werden, dass bei den Intranets im Spitalumfeld derzeit vor allem die „information perspective" im Vordergrund steht. Die Intranets sind für die Spitalmitarbeitenden grundsätzlich ein Instrument, um auf Informationen und Dokumente zuzugreifen. Sie nehmen es also vorwiegend als Speichermedium in Gebrauch. Die drei anderen Perspektiven finden nur wenig bis gar keine Berücksichtigung, das heisst das Intranet wird weder dazu verwendet die Mitarbeitende auf Inhalte aufmerksam zu machen, sie bei der Arbeit zu unterstützen noch um in synchroner oder asynchroner Weise mit Kollegen zu kommunizieren oder mit ihnen zusammenzuarbeiten. Oft unzureichend ist zudem die Benutzerfreundlichkeit der Intranets. So bemängeln viele Mitarbeitenden die Struktur und Übersichtlichkeit der Intranets. Dennoch: Die Intranets der Ostschweizer Spitäler bilden grösstenteils eine gute Basis, um die Mitarbeitenden an die Möglichkeiten und Funktionalitäten eines Intranets heranzuführen. Eine weitere Erkenntnis meiner Masterarbeit ist nämlich, dass sich eher diejenigen Mitarbeitenden mehr Möglichkeiten im Intranet wünschen, die bereits mit einem etwas ausgereifteren Intranet arbeiten. Getreu dem Motto: Der Appetit kommt beim Essen.
Wenn die Situation für viele der Verlage nicht so tragisch wäre, könnte man als Realsatiere darüber lachen. Für mich ist der Artikel aber ein traurige Irrung mit vielen Fehlern drin.
Über diese irreale Forderung, welche Grundprinzipien der freien Marktwirtschaft widerspricht, will ich gar nicht gross reden. Viel tragischer finde ich, dass die NZZ einen so tendenziösen Artikel abdruckt.
So soll das Internet nach Neiniger ein rechtsfreier Raum sei. Nein, nicht rechtsfrei aber sehr kompliziert, so wie die globale Wirtschaft (und das richtige Leben) selbst. Unterschiedliche Rechtsprechungen in verschiedenen Ländern. Es wird nie eine Schweizer Grenze im Web geben -- oder es ist nicht das Web. Und ausserdem sei Wikipedias Ziel nicht die Vermehrung des Wissens, sondern das Erheischen von Marktanteilen, Umsatz und Ertrag. Wo kommt den so was her?
Spannend finde ich auch, dass Verlage über das "Verschenken von Inhalten", "in Unkenntnis der Mechanismen des neuen elektronischen Aufmerksamkeitsmarkts" und wegen dem nicht-funktionieren des Geschäftsmodells der Werbung ganz arg in Bedrägnis geraten sind. Doch am Ende desselben Artikel steht dann, dass "böse" Firmen wie Twitter oder Facebook Milliarden über Werbung einnehmen. Hmm. Welche Unkenntnis und weshalb sind die, die wenig Geld mit Werbung machen die Guten und die, welche viel Geld damit verdienen die Bösen?
Eine schöne Wortkreation finde ich auch das "parasitären Geschäftsmodell" so wie bei Google oder Yahoo. Ist es nicht so, dass diese einen Mehrwert bieten, welcher die User schätzen und anderswo (z.B. beim "Google-Killer" News1.ch [inkl. Herrn Neininger]) nicht finden. Eine Analyse dazu bietet beispielsweise Prof. Stefan Michel vom IMD.
Und nun der zentrale neinigerische "Lösungsvorschlag": Wir ziehen eine Wand hoch und verbieten alles und machen einen auf "Paid Content". Sehr innovative und ein netter Ansatz in einer Welt die von Netzwerkeffekten lebt.
Kritische Leser errinnern sich möglicherweise noch an die Aussage im Artikel, dass Verlage in "Unkenntnis der Mechanismen des neuen elektronischen Aufmerksamkeitsmarkts" agierten. Bingo und zurück zu Feld eins.
Wie im letzten Post veranschaulicht, setzt Terrific im HTML/CSS Part voll auf OOCSS. In Sachen JavaScript beschreitet Terrific jedoch völlig eigene Wege.
Was bringt's?
Die Hauptvorteile des JavaScript Systems von Terrific sind:
Leichtgewichtige Architektur
Terrific strukturiert die JavaScript-Entwicklung ohne dabei die Entwickler einzuschränken. So können Entwickler weiterhin ihr gesamtes jQuery - Knowhow voll einsetzen und profitieren gleichzeitig von den zahlreichen Features und Möglichkeiten von Terrific.
Modulare Entwicklung
Die gesamte JavaScript-Entwicklung wird durch Terrific modularisiert. So können sämtliche Module einzeln entwickelt und getestet werden und - was noch viel wichtiger ist - ohne Seiteneffekte miteinander kombiniert werden.
Skalierbarkeit
Die Seite wird mit wachsender JavaScript-Grösse nicht durch unzählige DOM-Operationen und Events verlangsamt. Es wird wirklich nur der Code ausgeführt, welcher wirklich von den Terrific-Komponenten benötigt wird.
Einfache Integration
Mit Terrific entwickelte Frontends lassen sich mühelos in die verschiedensten Backendsysteme und CMS integrieren. So kann die Frontendentwicklung komplett vom entsprechenden Zielsystem entkoppelt werden.
Dies erlaubt es Terrific, einen einheitlichen Bootstrapping-Mechanismus zu verwenden - egal ob es sich dabei um einfache Seiten mit wenig JavaScript-Funktionalität oder komplexe Applikationen handelt.
(function($) {
var application = new Nx.Application($('.page'));
application.registerModules();
application.startAll();
})(Nx.$);
That's it! Abgesehen von dem "Drumherum" - ein klassischer 3-Zeiler ;-)
Die einzelnen Zeilen haben es jedoch ganz schön in sich.
var application = new Nx.Application($('.page'));
Diese Zeile instanziert eine neue Terrific-Application. Was auffällt ist, dass Terrific den NamespaceNx (für Namics) verwendet. So kann Terrific auch parallel zu bestehenden oder durch das Backendsystem vorgegebenen JavaScript-Funktionalitäten verwendet werden.
Der Parameter $('.page') gibt den Context der Applikation an - .page ist nach OOCSS-Konvention der Seitencontainer.
application.registerModules();
registerModules übernimmt den Hauptteil des Bootstraps. Die Methode durchsucht den DOM-Tree nach Modulen - nach OOCSS-Konvention besitzen sämtliche Module die Klasse .mod - und instanziert per Namenskonvention die entsprechenden Module. Zum Beispiel wird für die Klasse .modNews das JavaScript Modul Nx.Module.News instanziert.
Als Pendant zu den OOCSS-Skins bietet Terrific JavaScript-Skins an - welche im Grunde nichts anderes als Module Decorators sind.
Auch die Dekoration der Module geschieht - wie könnte es auch anders sein - per OOCSS-Namenskonvention. Besitzt ein DOM-Node die Skin-Klasse .skinNewsHighlighted so wird das Nx.Module.News Modul mit dem Nx.Module.News.Highlighted Skin dekoriert.
Um eine Kommunikation zwischen den Modulen zu ermöglichen - ohne mit dem Loose Coupling Gedanken zu brechen - werden in der registerModules-Methode auch noch per Namenskonvention definierte Kommunikationskanäle zwischen den Modulen aufgebaut.
Nachdem also alle Module inkl. Skins und Connectors in der Application registriert sind, kommt der Bootstrap in die letzte Phase.
application.startAll();
Mit startAll wird die Initialisierung der Module gestartet. Jedes Modul durchläuft dabei potentiell vier Phasen, welche nach Bedarf durch die entsprechende Hook-Methode implementiert werden können.
dependencies - Nachladen von Libraries, Plugins etc. via Ajax
beforeBinding - Daten per Ajax holen, DOM Manipulationen etc.
onBinding - Events binden
afterBinding - Default State herstellen, Events triggern etc.
In den häufigsten Fällen werden jedoch nicht alle Phasen, sondern nur die onBinding-Phase benötigt. Terrific kümmert sich dabei um das Timing und die sequentielle Abarbeitung der vier Module-Phasen.
Beispiel gefällig?
Greifen wir das Modul-Beispiel aus dem "letzten Post":"http://blog.namics.com/2010/07/terrific-oocss-part2.html wieder auf.
Das Currency Converter Module hat folgende Funktionalitäten:
Ajax Live-Convertion
Non-JavaScript Variante mit Convert Button
Automatische Erstberechnung des aktuellen Werts
dependencies
Da nicht nach jedem Tastendruck eine Ajax-Berechnung ausgelöst werden soll, sondern nur sobald der Benutzer aufhört zu tippen, benötigen wir das jQuery throttle / debounce Plugin von Ben Alman.
/**
* Hook function to load the module specific dependencies.
*
* @method dependencies
* @return void
*/
dependencies: function() {
this.require('jquery.throttle-debounce.min.js', 'plugin', 'onBinding');
}
Der dritte Parameter - in unserem Beispiel "onBinding" - gibt an, in welcher Phase die dependency benötigt wird. Terrific kümmert sich um das Timing und die entsprechenden Callbacks. Zudem stellt Terrific sicher, dass von mehreren Modulen benötigte dependencies nicht doppelt nachgeladen werden.
beforeBinding
Alternativ zur Live-Convertion bietet die Non-JavaScript Variante einen zusätzlichen Convert Button. Dieser kann in der JavaScript Variante versteckt werden. DOM Manipulationen werden - um unnötiges Flackern zu vermeiden - in der beforeBinding-Phase durchgeführt.
/**
* Hook function to do module specific stuff before binding the events (i.e. fetching some data).
*
* @method beforeBinding
* @param {Function} callback the callback function which must be called at the end
* @return void
*/
beforeBinding: function(callback) {
$(':submit', this.$ctx).hide();
callback();
}
Durch die Verwendung von this.$ctx (this.$ctx enthält den Module-DOM-Node) als zweiten Parameter im jQuery-Selector, werden die Events nur auf die aktuelle Modulinstanz gebunden. So können Module also auch problemlos mehrmals auf einer Seite verwendet werden.
onBinding
In der onBinding-Phase werden die Events gebunden.
/**
* Hook function to bind the module specific events.
*
* @method onBinding
* @return void
*/
onBinding: function() {
var that = this;
// disable the standard action on submit
$('.converter', this.$ctx).bind('submit', function() {
return false;
});
// bind the keyup event to start the convertion. To reduce the number
// of ajax calls, the debounce plugin is used.
$('.amount', this.$ctx).keyup($.debounce(250, function() {
var $this = $(this).closest('form');
var url = $this.attr('action') + '?' + $this.serialize();
// ajax stuff etc.
...
return false;
}));
}
In unserem Beispiel wird durch return false - da die Live-Convertion nicht per Enter, sondern automatisch nach Beendigung der Eingabe ausgelöst werden soll - die Standard-Submitaktion unterbunden.
Im keyup-Eventhandler kommt das in der dependencies-Phase nachgeladene debounce-Plugin zum Einsatz. Dadurch kann die Anzahl Ajax-Requests stark reduziert werden, da die Berechnung erst nach 250ms Idle-Time ausgelöst wird.
afterBinding
Damit dem Benutzer gleich zu Beginn eine aktuelle Berechnung präsentiert werden kann - zum Beispiel der aktuelle Eurokurs - wird in der afterBinding-Phase die Initialberechnung ausgelöst.
/**
* Hook function to do module specific stuff after binding the events (i.e. triggering some events).
*
* @method afterBinding
* @return void
*/
afterBinding: function() {
$('.amount', this.$ctx).trigger('keyup');
}
Was kann Terrific sonst noch?
Obwohl die Modul-Funktionalität den Hauptpart des Terrific JavaScript Systems darstellt, hat Terrific noch zahlreiche weitere JavaScript Features zu bieten, die das Programmiererleben erheblich erleichtern. Einige der Funktionen, die Terrific mit sich bringt:
Skins - Module Decorators
Layouts - seitenweite Funktionalitäten, z.B. Drag'n Drop von Modulen etc.
Connectors - ermöglichen die Kommunikation zwischen Modulen über konfigurierbare Kanäle
Sandbox - Bezug von Ressourcen, Zugriff auf andere Modulinstanzen etc.
Logging-Architektur
Zentrales Errorhandling
...
Die Terrific-Funktionalitäten sind also ziemlich umfassend ;-). Bis jetzt konnten wir alle Kundenwünsche mit den Bordmitteln von Terrific umsetzen. Neue, anspruchsvolle und herausfordernde Frontends sind also herzlich willkommen!
Real World Beispiele?
Das Intranet von Repower wurde komplett mit Terrific umgesetzt. Integriert wurde das Ganze in das Enterprise Wiki Atlassian Confluence. Wiki? Anspruchvolles Frontend? Wie man dies unter einen Hut bringen kann, zeigen wir im nächsten Terrific-Post!
