Eigene kreative Menüs mit Captivate erstellen

Sie möch­ten meh­re­re Pro­jek­te über ein frei gestal­te­tes Menü zusam­men­füh­ren? Im heu­ti­gen Blog­ar­ti­kel zei­ge ich Ihnen, wie Sie sich ein eige­nes Menü mit den Bord­mit­teln von Captivate erstel­len können.

Zu die­sem Tutorial

Pro­gramm: Adobe Captivate 4, 5, 5.5

Schwie­rig­keits­grad: Fortgeschrittene

Bear­bei­tungs­emp­feh­lung: Dies ist ein Fortgeschrittenen-Artikel und setzt bereits Grund­kennt­nis­se in Adobe Captivate 5 oder 5.5 vor­aus, ins­be­son­de­re im Umgang mit erwei­ter­ten Aktio­nen. Wenn Sie mein Buch Adobe Captivate 5 – Erfolg­rei­che Screen­casts und E-Learning-Anwendungen erstel­len besit­zen, emp­feh­le ich Ihnen vor­ab das Kapi­tel Varia­blen & erwei­ter­te Aktio­nen nut­zen (S. 348-353) zu bearbeiten.

Ziel: In die­sem Tuto­ri­al ler­nen Sie, wie Sie in Captivate ein eige­nes krea­ti­ves Menü erstellen.

Benö­tig­te Zeit: ca. 10-15 Minu­ten (exklu­si­ve Design des Menüs)

Kreatives Menü
Krea­ti­ves Menü

Hin­weis: Um das bes­te Ergeb­nis zu erzie­len, soll­ten alle Pro­jek­te, die Sie ver­bin­den möch­ten, die glei­che Auf­lö­sung haben, z. B. 640 x 480 px.

Menüleiste gestalten

Begin­nen wir mit der Gestal­tung der Menü­leis­te. Gehen Sie hier­zu wie folgt vor:

  1. Erstel­len Sie ein neu­es Pro­jekt, wel­ches eine grö­ße­re Auf­lö­sung als die zu ver­bin­den­den Pro­jek­te hat, so dass Sie genü­gend Platz für den Navi­ga­ti­ons­be­reich haben, z. B. 960 x 540 px.
  2. Gestal­ten Sie sich Ihre Menü­leis­te mit allen Mit­teln, die Ihnen Captivate zur Ver­fü­gung stellt. Sie kön­nen hier­zu auch Gra­fi­ken einbinden.
  3. Ver­län­gern Sie die Anzei­ge aller Ele­men­te der Menü­leis­te bis zum Ende der Folie: Mar­kie­ren Sie alle Objek­te und wäh­len Sie im Bedien­feld Eigen­schaf­ten unter Timing Anzei­gen für: rest­li­che Folie.

    Timing Anzeigen für: Restliche Folie
    Anzei­gen für: rest­li­che Folie
  4. Fügen Sie für jeden Menü­punkt eine Schalt­flä­che oder ein Klick­feld ein. Das Ergeb­nis könn­te wie in der fol­gen­den Abbil­dung gezeigt aussehen. 

    Schaltflächen einfügen
    Schalt­flä­chen einfügen

Captivate-Projekte einfügen

Vor­aus­set­zung: Für die fol­gen­den Schrit­te müs­sen Sie die Pro­jek­te, die Sie über das Menü ver­bin­den möch­ten, bereits als Flash (SWF) ver­öf­fent­licht haben.

Nun kön­nen wir uns dem funk­tio­na­len Teil des Menüs wid­men. Gehen Sie hier­zu wie folgt vor:

  1. Ver­ge­ben Sie für jede Schalt­flä­che, die Sie ein­ge­fügt haben, im Bedien­feld Eigen­schaf­ten einen Objekt­na­men (z. B. „SF1“, „SF2“, „SF3“ etc.). 

    Objektname der Schaltflächen
    Objekt­na­me einer Schaltfläche
  2. Fügen Sie die ver­öf­fent­lich­ten Captivate-Projekte ein: Wäh­len Sie jeweils Ein­fü­gen > Ani­ma­ti­on.
  3. Ver­ge­ben Sie für jede Ani­ma­ti­on im Bedien­feld Eigen­schaf­ten einen spe­zi­fi­schen Objekt­na­men (z. B. „A1“, „A2“, „A3“ etc.).
  4. Ver­ber­gen Sie alle Ani­ma­tio­nen: Deak­ti­vie­ren Sie jeweils im Bedien­feld Eigen­schaf­ten die Opti­on Sicht­bar. Dadurch wer­den die ein­zel­nen Pro­jek­te nicht auto­ma­tisch angezeigt. 

    Eigenschaften der Animationen
    Eigen­schaf­ten der Animationen
  5. Posi­tio­nie­ren Sie alle Ani­ma­tio­nen an der glei­chen Stel­le unter­halb Ihrer Menüleiste.
    Tipp: Ver­wen­den Sie dazu am bes­ten das Werk­zeug Aus­rich­ten.
  6. Mar­kie­ren Sie alle Schalt­flä­chen Ihrer Menü­leis­te und rücken Sie die­se in den Vor­der­grund: Rechtskli­cken Sie dazu und wäh­len Sie im Kon­text­me­nü Anord­nen > In den Vor­der­grund.

    In den Vordergrund
    In den Vordergrund

Erweiterte Aktionen erstellen

Um Captivate mit­zu­tei­len was beim Drü­cken einer Menü-Schaltfläche gesche­hen soll, müs­sen wir nun Erwei­ter­te Aktio­nen erstellen:

  1. Öff­nen Sie die Erwei­ter­ten Aktio­nen: Pro­jekt > Erwei­ter­te Aktio­nen.
  2. Legen Sie eine Mas­ter­ak­ti­on an: Ver­ge­ben Sie den Akti­ons­na­men „Mas­ter“.
  3. Dop­pel­kli­cken Sie in das ers­te Feld in Aktio­nen und erstel­len Sie die Akti­on: Gehe zu Folie 1 Sli­de 1.
  4. Erstel­len Sie für jedes Pro­jekt, wel­ches Sie impor­tiert haben, einen wei­te­ren Akti­ons­teil: Aus­blen­den A1, Aus­blen­den A2, Aus­blen­den A3 etc.

    Masteraktion
    Die Akti­on Master
  5. Spei­chern Sie die Aktion.
  6. Dupli­zie­ren Sie die Mas­ter­ak­ti­on: Wäh­len Sie dazu die Mas­ter­ak­ti­on aus und kli­cken Sie auf Akti­on duplizieren.

    Aktion duplizieren
    Akti­on duplizieren
  7. Ändern Sie die Teil­ak­ti­on Aus­blen­den A1 in Ein­blen­den A1.
  8. Spei­chern Sie die Akti­on unter dem Akti­ons­na­men: Animation1_ein.

    Animation1_ein
    Die Akti­on Animation1_ein
  9. Dupli­zie­ren Sie die Mas­ter­ak­ti­on erneut.
  10. Ändern Sie nun die Teil­ak­ti­on Aus­blen­den A2 in Ein­blen­den A2.
  11. Spei­chern Sie die Akti­on unter dem Akti­ons­na­men: Animation2_ein.

    Animation2_ein
    Die Akti­on Animation2_ein
  12. Wie­der­ho­len Sie die Schrit­te 8-9 für alle wei­te­ren Menü-Schaltflächen.

Erweiterte Aktionen zuweisen

Im letz­ten Schritt müs­sen wir nur noch die Schalt­flä­chen des Menüs mit den Erwei­ter­ten Aktio­nen belegen:

  1. Mar­kie­ren Sie die ers­te Schalt­flä­che Ihres Menüs und wäh­len Sie im Bedien­feld Eigen­schaf­ten unter Akti­on Bei Erfolg die Opti­on Erwei­ter­te Akti­on aus­füh­ren.
  2. Wäh­len Sie das Skript Animation1_ein.

    Aktion zuweisen
    Akti­on zuweisen
  3. Mar­kie­ren Sie die zwei­te Schalt­flä­che Ihres Menüs und wäh­len im Bedien­feld Eigen­schaf­ten unter Akti­on Bei Erfolg die Opti­on Erwei­ter­te Akti­on aus­füh­ren.
  4. Wäh­len Sie das Skript Animation2_ein.
  5. Wie­der­ho­len Sie die Schrit­te 3-4 ent­spre­chend für alle wei­te­ren Schalt­flä­chen Ihrer Menüs.

Sie haben nun ein eige­nes Menü erstellt.
Hin­weis: Wir haben ein Bei­spiel für Sie erstellt, wel­ches Sie hier betrach­ten können.

Kreatives Menü
Krea­ti­ves Menü

Tipp: Wenn Sie das Pro­jekt ver­öf­fent­li­chen möch­ten, emp­fiehlt es sich, die Ani­ma­tio­nen aus­zu­la­gern, da die Menü-SWF ansons­ten sehr groß wer­den kann. Öff­nen Sie dazu die Vor­ein­stel­lun­gen (Bear­bei­ten > Vor­ein­stel­lun­gen) und akti­vie­ren Sie in der Kate­go­rie Pro­jekt im Bereich Ver­öf­fent­li­chungs­ein­stel­lun­gen unter Res­sour­cen exter­na­li­sie­ren die Opti­on Ani­ma­tio­nen.

Animationen externalisieren
Ani­ma­tio­nen externalisieren

 

Übri­gens: Wenn Sie gene­rell mehr über Captivate mit prak­ti­schen Bei­spie­len erfah­ren möch­ten, emp­feh­le ich Ihnen mein Buch zu Captivate 5 – wenn es spe­zi­el­ler und noch detail­lier­ter sein soll: Eine Schu­lung bei uns. Kon­tak­tie­ren Sie uns ein­fach und wir stel­len Ihnen einen indi­vi­du­el­len Fahr­plan zusammen.

Ähn­li­che Themen
Neu in Captivate 5: Erwei­ter­te Aktionen

3 Kommentare zu “Eigene kreative Menüs mit Captivate erstellen

  1. Sehr schön erklärt,

    es ist immer wie­der span­nend, jeden Don­ners­tag die­sen sehr nütz­li­chen und her­vor­ra­gend gestal­te­ten Blog anzusehen.

    Gruß
    M. Pracht

  2. Genau, da muss ich dem Kol­le­gen Pracht ganz ein­deu­tig zustim­men! Ich den­ke, es gibt vie­le (lei­der) „kom­men­tar­lo­se Kon­su­men­ten“ wie mich, die hier eine gan­ze Men­ge inter­es­san­te Tipps finden.
    Auch fin­de ich es gut, dass sich nach der 5.5-Reihe jetzt wie­der vie­le Tuto­ri­als mit der Ver­si­on 5 nach­voll­zie­hen lassen.
    Wei­ter so!

    Vie­le Grü­ße vom Bodensee
    Jörg Weißenborn

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht.