Sie sind hier: Infothek / Tools / Simulationen mit Wink  / Wink im eigenen Design
05-09-2010

So gestalten Sie das Wink-Layout individuell

 

Wenn Sie nicht nur simple Aufzeichnung/Wiedergabe Softwaretrainings erstellen wollen, sondern qualitativ gute Lernsequenzen, dann sind sowohl das einheitliche Design der Seiten als auch die einfache Handhabung ein zentrales Thema. Im folgenden lernen Sie die wichtigsten didaktischen Hinweise kennen und wie Sie diese in Wink umsetzen.

Der Bildschirmaufbau einer Lernsequenz

Neben der reinen Inhaltsdarstellung ist es in Lernsequenzen immer wichtig, dass Ihre Lerner wissen, wo Sie sich gerade befinden, was Sie auf der aktuellen Seite tun können und wie es weiter, zurück oder an den Anfang (oder das Ende) der Lernsequenz geht.

Sie benötigen hierzu ein ansprechendes Design, das die Orientierung und Bedienung durch ein gleiches Aussehen einfach macht. Hierzu benötigen Sie:

  1. Eine Titel-/Orientierungsleiste, in der ersichtlich ist, wo man sich gerade befindet

  2. Eine Darstellungsfläche, die meist geteilt ist in Text- und Präsentations-/Interaktionsbereich

  3. Einen Navigationsbereich zum Bewegen in den Lerninhalten.

Üblicherweise ist diese Dreiteilung von oben nach unten eingehalten:

Titel und Orientierung (Seite 1 von 1)




Präsentationsbereich





Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text


Navigation

Es gibt auch die Variante, den Text rechts oder links neben die Präsentationsfläche zu stellen, eine Variante mit der ich sehr gerne arbeite:

Titel und Orientierung (Seite 1 von 1)





Präsentationsbereich








Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text


Navigation

Eine Variante, die sich vor allem bei Simulationen durchzusetzen scheint, ist die des bildschirmfüllenden Präsentationsbereiches mit einem markanten Textbereichs (in Wink z.B. in gelb), der dann nicht durch die gleiche Position, sondern durch das gleiche Aussehen hervorsticht. Für Lerner ist das springen der Erläuterung durch den Bildschirm  gewöhnungsbedürftig, allerdings ist die Erläuterung „nah am Geschehen“.

Ich würde es dennoch vermeiden und dem Text eine ruhige und gleiche Position geben, damit die Lerner wissen, wo die Erläuterungen sind und wo die Präsentationen.

Vorlagen in Wink

Egal welche Variante Sie wählen, Wink unterstützt Sie dabei, diese als Vorlage abzulegen und für all Ihre Lernsequenzen schnell wiederzufinden. Dabei können Sie folgende Elemente über die Menü-Option Projekt -> Vorlage verwenden speichern und wieder in ein neues Projekt laden.

Wichtig dabei ist, dass Sie in Ihrem Autorenleitfaden eine Bildschirmgröße für Ihre Projekte festlegen, da die Positionierung der Vorlagenelemente darauf aufbaut. Je nach Anwendungsgebiet sollten Sie Standardbildschirmgrößen wählen, also z.B. 800x600, wenn Sie damit rechnen, dass die Inhalte auch auf Beamern gezeigt werden oder 1024 x 768, wenn Sie von normalen Nutzern ausgehen. Wenn Sie Ihre Inhalte für spezielle Poweruser oder für Anwendungen erstellen, die eh nur mit einer höheren Bildschirmauflösung sinnvoll funktionieren (Grafik/CAD Programme, umfangreiche CRM Systeme etc.), dann können Sie die Auflösung entsprechend hoch setzten.

Das eigene Design als Hintergrundbild-Vorlage

Um den von Ihnen gewählten Bildschirmaufbau als Vorlage verwenden zu können, benötigen Sie ein Grafik oder Bildbearbeitungsprogramm. Erstellen Sie sich ein Hintergrundbild, das die wichtigsten Designs (Rahmenfarbe, definierter Bereich für Titel, Präsentations und Textfläche sowie Navigation) und binden Sie es über die Option Projekt –Hintergrundbild wählen in Ihr aktuelles Projekt ein.

Erstellen Sie gleich auch die passenden Weiter und Zurück Buttons dazu und speichern Sie diese ebenfalls als Datei ab. Die Buttons können Sie mit dem Bild Symbol in der Werkzeugleiste auswählen.

Fügen Sie nun ein Textfeld ein, klicken Sie auch hier auf Eigenschaften und wählen Sie entweder ein passendes Textfeld aus oder erstellen Sie sich in Wink eine neue Form und Farbe.

Als Ergebnis erhalten Sie in kurzer Zeit einen Gesamtrahmen, der Ihre Lerninhalte unverwechselbar macht:

Auch Ihre Textfelder können Sie individuell gestalten. Klicken Sie hierzu auf das Textfeld und dann in der Autorenwerkzeugleiste auf das Symbol der Sprechblase für Eigenschaften. In dem Auswahlfeld für Textfelder suchen Sie sich nun ein Beispiel aus, das Ihrer Idee sehr nahe kommt, legen mit dem Schalter „Kopie erstellen“ eine Kopie an und wählen dann Bearbeiten.

Nun erscheint ein Auswahlmenü, in dem Sie jedes einzelne Objekt, sei es Linie, Kurve, Polygon oder Textfeld ändern, ergänzen und anpassen können.

Wählen Sie zum Ändern die entsprechende Form oben rechts in der Liste aus oder erstellen Sie über die Symbolleiste neue Formen. Sie können jede Form auch in der Form ändern oder bei Polygonen die Punkte bearbeiten. Die Farbe der Linien und Flächen Ihrer Formen bestimmen Sie rechts unten in dem Auswahlmenü.

Die Bedienung ist, wie Sie sehen, ein wenig umständlich, aber es lohnt sich, das Ergebnis ist ein eigenes Textfeld-Layout, das Ihre Lernsequenzen auszeichnet.

Auch der Cursor ist änderbar. Klicken Sie hierzu in Ihren Autorenwerkzeugen in der Liste zunächst auf den Cursor und dann auf Eigenschaften und Sie sehen ein Cursorauswahlmenü.

Hier können Sie entweder einen Standard-Cursor wählen oder selbsterstellte importieren.

Flash-Preloader oder Steuerleisten Elemente ändern

Sie können sogar die Preloader-Seite von Wink und die Flash-Kontrollen an Ihre Wünsche anpassen. Gehen Sie hierzu in Projekte –> Einstellungen und klicken Sie nun neben der Preloader oder der Steuerleiste auf „Wählen“. In dem nun erscheinenden Fenster können Sie das Hintergrundbild aus Bilddateien importieren und entsprechend zu einem neuen Gesamtbild zusammensetzen. Bei der Preloader-Ansicht ist das einfach, da Sie nur ein Hintergrundbild importieren und dann noch ein paar wenige Einstellungen in dem Fenster machen müssen:

Etwas mehr Aufwand ist es bei der Steuerleiste, da Sie hier sehr viele Einzelbilder erstellen müssen hier geht es vor allem darum, die von Ihnen erstellten Bilder, wie ein Puzzle wieder zu einem sinnvollen Ganzen zusammenzufügen:

Und das war's auch schon. von jetzt an können Sie in jeder Softwarepräsenttion und in jeder Lernsequenz Ihr eigenes Design als Rahmen verwenden und jeder Software - zumindest in der Präsentation - Ihren Stempel aufdrücken.

Viel Spaß beim experimentieren und ich freue mich über interessante Layouts und Links zu Layout oder Lernsequenzen.