Illustrationen - oliverbra/Projekt1_HCI_TeamCMTO GitHub Wiki
Angefertigt wurden die Illustrationen in Adobe Illustrator. Für den ersten Versuch wurden Zeichnungen der drei Stadien des Löwenzahns angefertigt. Diese wurden abfotografiert und in eine Illustrator-Datei eingefügt. Mithilfe des Kurvenzeichner Werkzeuges wurden erst einmal die Blätter nachgezeichnet. Der Stiel wurde als einzelnes Element erstellt. Die erste Variante der Löwenzahnblätter wurde verworfen. In einer zweiten Recherche wurde explizit nach einem Löwenzahnblatt gesucht, um die Konturen nochmals in Adobe Illustrator nachzuzeichnen. Das gezeigte Bild zeigt die Vorlage, nach der das Blatt angefertigt wurde.
Im weiteren Schritt wurden die Knospe und der Blätterkranz angefertigt. Die Knospe wurde nach Vorlage folgender Abbildung angefertigt. Für den Blätterkranz wurde eine Ellipse genutzt. Einer der vier vorhandenen Ankerpunkte wurde zu einem Eckpunkt konvertiert.
Im nächsten Schritt wurde der blühende Löwenzahn erstellt. Auch hierzu wurde eine Vorlage genutzt, um die Blüte nachzuzeichnen. In einem weiteren Schritt wurden mit dem Pinsel-Werkzeug einzelne Blütenblätter ergänzt. Weiter wurden einzelne Konturen angepasst, indem sie verzogen und dadurch neu angeordnet wurden. In der folgenden Abbildung werden die einzelnen Ebenen und Elemente der Blüte deutlich.
Im letzten Schritt wurde die Pusteblume erstellt, welche sich durch ihre weißen Samen charakterisiert. Der Kopf mit den Samen sollte weich und transparent aussehen. Hierfür wurde zuerst eine Pinselspitze in Form des charakteristischen Samens erstellt, siehe Abbildung. Diese wurden in verschiedenen Größen und Transparenzen um einen gegebenen Mittelpunkt angeordnet. Ergänzend wurde in Adobe Photoshop ein Kreis mit starken, weichen Kanten erstellt, welcher über den Mittelpunkt gelegt wurde und somit den harten Übergang der einzelnen Samen verdeckt.
Auch für die Florfliege wurde nach Bildern recherchiert. Das folgende Bild wurde als Vorlage für die Illustration genommen. Wie beim Löwenzahn wurden hier die Konturen des Bildes nachgezeichnet und mit Farbe gefüllt.
Die Illustrationen für das Onboarding orientieren sich an dem Storytelling. Die einzelnen Elemente sollen den Text visuell unterstützen und dem Nutzer so die Möglichkeit für ein schnelles und besseres Verständnis bieten. Am Beispiel der Abbildung ist zu sehen, dass es sich um einzelne Zeichnungen mit dem Touchpad handelt. So wurde unter anderen der Schmetterling wie auch die Blumen gezeichnet. Ergänzt werden die unregelmäßigen Zeichnungen mit den regelmäßigen Linien der Rechtecke, welche die Blumentöpfe ergeben.
