Das Unsichtbare sichtbar machen: LCD-Explorer
Seit über 110 Jahren erforscht und entwickelt das Unternehmen Merck KGaA erfolgreich Flüssigkristalle für Displays und hat maßgeblich dazu beigetragen, dass die Flüssigkristallanzeige (Liquid Crystal Display, LCD) heute als die führende Flachbildschirm-Technologie gilt – und Merck globaler Marktführer der Branche ist. Nur leider liegt die Technologie im Verborgenen.
LCD-Explorer
Es lag nahe ein Werkzeug zu entwickeln, dass die unsichtbare Funktionsweise eines Flüssigkristalldisplays sichtbar macht. Es war eine besondere Herausforderung die Umsetzung von wissenschaftlichen Modellen in eine für den Laien verständliche Darstellung umzuwandeln.
LCD-Explorer
Story
Das Ergebnis ist ein interaktives Werkzeug mit dem die Funktionsweise eines Flüssigkristalldisplays herausgefunden und die verschiedenen LCD-Technologien entdeckt werden können.
Der Besucher fliegt virtuell in einen LCD-Bildschirm hinein. Dies wird durch eine interaktive dreidimensionale Darstellung einer einzelnen herausgeschnittenen Zelle (umgangsprachlich auch Bildpunkt oder Pixel genannt) möglich. An einem LC-Molekül angekommen, steuert der Besucher die darzustellende Farbe und entdeckt dabei die von der Technologie abhängigen Bewegungen der Flüssigkristalle.
Der LCD-Explorer ist eine interaktive Visualisierung zur Funktionsweise eines LCD-Displays und findet sich im Internet-Angebot von Merck unter folgendem Link oder als App in den gängigen AppStores.
Story
App Entwicklung
Gegen Ende des Web Projektes, kam noch die Anforderung hinzu, die Anwendung auf Smartphones, iOS und Android zu bringen. Nach gründlicher Recherche kristalisierte sich immer mehr heraus das Cordova hier eine gute Wahl ist. Apache Cordova, bietet einen ein simples Gerüst, um seine Webanwendung relativ einfach in ein natives Gerüst zu packen. Dieses Konstrukt nennt man "Hybrid App" da dieses wie eine Web App, auf HTML, CSS und eventuell Javascript Code basiert, aber in nativem Code verpackt wird. Cordova bietet der Anwendung somit alle Schnittstellen, die einer nativen App zur Verfügung stehen. Durch Cordova hatten wir also die Möglichkeit, mit Hilfe des bereits fertigen Codes für die Webanwendung ohne viel Aufwand, eine App für verschiedene Endsysteme zu kompilieren. Zur Sicherstellung der Funktionalität wurde die App auf verschiedenen Endgeräten getestet. In kürzester Zeit haben wir somit eine Webanwendung in eine App verwandeln können, die auf verschiedenen Betriebsystemen läuft. Überzeugen Sie sich selbst und laden Sie sich die App auf Ihr Smartphone.
App Entwicklung
Programmierung Web und App
Hier nochmal eine Übersicht über die Komponenten zur Programmierung für Web und Apps mithilfe von HTML, JavaScript und Cordova. Diese bieten eine flexible und effektive Lösung für die Entwicklung plattformübergreifender Anwendungen.
- HTML bildet das Grundgerüst einer Website und in diesem Fall auch der App und ermöglicht die Strukturierung und Darstellung von Inhalten.
- Mit JavaScript (eine leistungsstarke Skriptsprache) haben wir den Modularen Aufbau, die 3D-Visualisierung, die Interaktivität und Funktionalität der Anwendung umgesetzt.
- Zur 3D-Visualisierung wurde die JavaScript-Bibliothek Three.js eingesetzt, mit der 3D-Modelle, Szenen, Lichter, Texturen und Animationen erstellt und gerendert werden.
- Cordova ermöglichte uns, wie bereits oben beschrieben, Webtechnologien wie HTML und JavaScript zu verwenden, um native mobile Apps zu erstellen. Cordova stellt eine Brücke zwischen dem Web-Code und den Gerätefunktionen eines mobilen Betriebssystems her. Dadurch können Entwickler eine einzige Codebasis verwenden, um Apps für verschiedene Plattformen wie iOS, Android und Windows Phone zu erstellen.
Ein großer Vorteil der Programmierung mit HTML, JavaScript und Cordova besteht darin, dass Entwickler vorhandene Webentwicklungsfähigkeiten nutzen können, um plattformübergreifende Apps zu erstellen. Dies spart Zeit und Ressourcen, da nicht separate Teams für die Entwicklung von nativen Apps auf verschiedenen Plattformen erforderlich sind. Achtet man bei der Entwicklung der Webseite von Beginn an auf ein mobil bedienbares und darstellbares Design sind auch nur wenige Anpassungen für die APP Version nötig.
Programmierung Web und App
