Alle Beiträge von Immanuel Pelzer

Technische Reflektion

Die von uns verwendeten Technologien werden hier noch einmal kurz kritisch auf ihre Zukunftssicherheit betrachtet.

Ionic Framework für das Frontend

Das Ionic Framework stellt viele nützliche Dinge bereit. Unter anderem sind oft benötigte Elemente, wie z.B. Listen, Modals, Buttons usw. leicht einsetzbar und funktionieren auf anhieb.

Es werden außerdem eine beträchtliche Anzahl an hochwertigen Icons direkt mitgeliefert und durch das Aufbauen auf AngularJS kann eine Vielzahl an externen Libraries ohne große Umstände eingesetzt werden.

Der Schwerpunkt für das Einsatzgebiet liegt jedoch in der Entwicklung von simplen Single-Page Apps. Eine Anwendung wie floradex lässt sich zwar auch damit entwickeln, es müssen aber an vielen Stellen Umwege und Hindernisse in kauf genommen werden. Hier stellt sich die Frage, ob es nicht sinnvoller ist auf Ionic zu verzichten und nur AngularJS zu verwenden. Besonders bei Verwendung der bereitgestellten Komponenten nicht 100% in dem vorgesehen Kontext kam es zu unüberbrückbaren Problemen. (Wie z.B. das Springen des Popovers bei Auswahl eines Merkmals im Menü) H

Zum Zeitpunkt der Auswahl waren unsere Kenntnisse in Angular nicht ausreichend um in der kurzen Zeit eine fertige Anwendung zu schreiben. Jetzt hingegen wäre es effektiver diese direkt darin zu schreiben.

JSON als Dateiformt

Die Daten werden als einfache JSON Dateien gespeichert und komplett eingelesen. Dies funktioniert bei 35 Pflanzen sehr gut ist aber natürlich keine Lösung für größere Mengen. Hier wäre eine richtige Datenbank angemessen.

WebApp

Das Dynamic Binding (Listener auf Variablen und Funktionen ändern die Seite bei Veränderung dieser) in AngularJS ist zwar extrem hilfreich, sorgt aber dafür, dass größere Anwendungen wie Floradex immer langsamer werden, umso mehr Funktionalität hinzukommt.

Entweder muss dieser Prozess besser gehandhabt werden (Also die Listener Events von Hand senden, falls dies möglich ist?) oder die Anwendung sollte direkt als Native Anwendung geschrieben werden.

Zwar habe ich eingesehen, dass WebApps ein plausibler Weg sind um Anwendungen zu schreiben, aber sie haben einen Anwendungfall, der eingehalten werden muss. Kleine Anwendungen mit klaren Wegen und gut getrennter Funktionalität lassen sich so leicht auf mehrere Platformen übertragen.  Eine Anwendung wie Floradex, bei der immer sehr viel gleichzeitig auf einer Seite passiert leidet sehr unter den Limitierungen von HTML und JS.

Fazit

Dies mag alles sehr kritisch klingen, aber ich bin mit dem Ergebnis in dieser kurzen Zeit sehr zufrieden. Der Weg den wir eigeschlagen haben mag zwar nicht perfekt gewesen sein, aber ich habe sehr viel hinzugelernt.

 

Erster funktionaler Prototyp

Floradex basiert momentan auf einem Gerüst aus Ionic, AngularJS und JSON Dateien. Diese JSON Datein werden von einem eigenen Java Programm erstellt. Dieses Tool vereint die Daten des Herbariums (Katalog, Daten und Bilder) mit den Klassifizierungen der jeweiligen Pflanzen von Tropicos.org und unserem eigenen Pflanzenformat.

Grundsätzlich benötigt floradex für jede Pflanze eine Liste der Pflanzenmerkmale. Diese Merkmale sind leider in keiner Datenbank für uns automatisch abgreifbar und müssen von Hand gesammelt werden. Für diesen Zweck haben wir ein Dateiformat entwickelt.

Screenshot_10_06_15_13_30

Dieses Format wird von einem Tool ausgelesen und steht diesem dann als Baum zur Verfügung. Dieses Format wird außerdem direkt als JSON ausgegeben um das Menü mit Daten zu füttern.

Außerdem unternehmen wir im Moment Anstrengungen einen Parser zu schreiben, der diese Merkmale automatisch aus einer Seite zu diesem Thema ausließt.

Für alle durch dieses Format bereitgestellten Pflanzen werden dann offline aus dem XML Katalog des Herbariums die passenden Pflanzen ausgelesen und unter Verwendung der bereitgestellten ID (wie z.B. B100000001 für die Pflanze Asyneuma compactum var. eriocarpum Parolly) die Metadaten über den online Service des BGBM heruntergeladen und hinzugefügt. Diese ID wird auch in der Anwendung selbst verwendet um einzelne Pflanzen zu identifizieren und die Verbindung zwischen verschiedenen Daten herzustellen.

Zusätzlich werden diese Pflanzendaten durch Infomationen von Tropicos.org angereichter. Diese Seite stellt die Taxonomie für Pflanzen bereit und ermöglicht zugriff über ein API.

java-tools

Als Möglichkeiten für die Bereitstellung dieser gesammelten Daten kamen eine Datenbank und feste Dateien in Frage. Eine Datenbank wäre langfristig leichter mit Daten zu ergänzen, würden aber auch den Arbeitsaufwand erhöhen. Aus diesem Grund haben wir uns im Rahmen des Hackathons dafür entschieden die Daten einfach als JSON zu speichern und diese in der Anwendung einzulesen. Dies hat zwar ein paar offensichtliche Nachteile (Gesamte Daten müssen bei Start der Anwendung eingelesen werden, neue Daten ersetzen immer alte komplett, keine SQL Magie, usw.) ist aber für unseren kleinen Datensatz kein Problem. Die WebApp wurde so gestaltet, dass der Datenursprung bei Bedarf auch nachträglich  verändert werden kann.

java-tools

Zusätzlich zu den Metadaten werden auch die von der BGBM bereitgestellten Bilder (Und damit der im Rahmen des Coding Da Vinci genutzte Datensatz) heruntergeladen, zu einem Rechteck gestutzt und in dem Format 25×25, 50×50, 100×100 und 200×200 gespeichert (Auch hier wird die ID der einzelnen Pflanzen verwendet um die Bilder zu benennen und sie so benutzbar macht). Diese werden in der WebApp als Thumbnails für die Ergebnisse genutzt, damit die (sehr großen) Bilder der BGMG .

thumbs

Diese gesammelten Daten (Alle Pflanzendaten und deren Merkmale, die Menüstruktur und die Thumbnails) werden dann von der WebApp eingelesen.

Diese WebApp verwendet das Framework Ionic, welches auf AngularJS basiert (welches wiederum HTML, CSS und JS verwendet).

 

zuordnungdatenDort wird die JSON Datei der Liste aller Pflanzenmerkmale verwendet um das Menü unten mit Daten zu füttern. Bei Auswahl eines Merkmals werden alle Pflanzen die diesem Merkmal zugeordnet wurden in der rechten Ergebnisleiste angezeigt. Diese besteht aus den Thumbnails und verwendet je nach Anzahl der Ergebnisse eine andere Größe dieser, damit immer alle Ergebnisse sichtbar sind.

Die Auswahl mehrerer Merkmale schließt Pflanzen nicht aus, sonder fügt immer mehr den Ergebnissen hinzu. Jedes Ergebnis hat ein Gewicht welches durch die Anzahl der zutreffenden Merkmale charakterisiert wird. So kann die passende Pflanze auch gefunden werden, obwohl man ein falsches Merkmal ausgewählt hat.

Die Auswahl eines Ergebnisses legt eine modale Ergebnisseite über die Anwendung, in welcher die Metadaten der Pflanzen  und das Hochauflösende Bilder der BGBM angezeigt werden.

Zum vollständigen Prototyp fehlen noch die Bilder für die Baukasten-Vorschau-Ansicht in der Mitte, welche helfen solle, die ausgewählten Merkmale besser zu identifizieren und die Bildchen für das Menü im Unteren Bereich.

Der aktuelle (lauffähige) Prototyp kann immer hier eingesehen werden.

Interview & erste Gedanken über Daten

In diesem Beitrag reiße ich das (eher schwache) Interview kurz an und bespreche dann kurz die Daten des Botanischer Garten und Botanisches Museum Berlin-Dahlem.

Interview mit einer Abiturientin

Janina 22  mach im Moment Fernabitur. Ich hatte mir erhofft, dass Sie aufgrund des vorhandenen Biologie Unterrichts mit den Daten etwas anfangen könne. Leider war dies nicht der Fall.
Das Interview kreiste eher um die allgemeine Auseinandersetzung mit ähnlichen Daten, dem Erkennen und Klassifizieren von Pflanzen und dem damit verbundenen Aufwand.

Sie zeigte Interesse an einer Möglichkeit dies digital zu unterstützen.

Die Möglichkeiten und Herausforderungen der Daten

Bei den Daten handelt es sich um einen Katalog von Pflanzen, ihren Metadaten und ein Bild für die meisten Pflanzen.

Unabhängig von der am Ende ausgearbeiteten Idee präferiert unser Team im Moment eine Anwendung auf einem Mobilgerät.
Um diese Anwendung auf allen Gerätetypen (Apple/Android/Tablets/PC) verfügbar zu machen bietet sich eine Web-Anwendung an. Hier wäre z.B. JavaScript zu verwenden eine Möglichkeit.

Die Daten an sich sind sehr groß (Allein 40mb für den Katalog; einzelne Metadaten nicht eingerechnet) und können deswegen nicht auf dem Gerät selbst liegen. Hier wäre es z.B. möglich die Daten in eine MySQL Datenbank zu kopieren.

Die Bilder der Pflanzen werden über eine URL  angeboten und sind relativ groß. Um viele Bilder performant anzeigen lassen zu können ,wäre es nötig Thumbnails zu erstellen und diese (möglicherweise direkt über die Datenbank) bereitzustellen. Insgesamt wären diese ca 1GB groß.

Auf dem Gerät selbst läge dann nur noch die Datenstruktur der Taxonomie und die eigentliche Anwendung. Falls diese zu groß sind muss ein Wrapper (wie z.B. Phonegap) her, der genug Platz bereitstellt.

Diagramm Aufbau Technisch App

 

Natürlich handelt es sich hier um erste Gedanken zu dem Thema und über Feedback freue ich mich natürlich!