Content Erstellung mit Articulate Storyline vs. Articulate Rise
Articulate Storyline oder Articulate Rise – welches Autorentool passt besser zu Ihnen? Damit Sie diese Frage für sich beantworten können, erläutern wir Ihnen im Folgenden die Vor- und Nachteile der beiden Softwares. Wir arbeiten bereits seit vielen Jahren erfolgreich mit Storyline. Um jedem Projekt gerecht zu werden, nutzen wir zudem das Tool Rise. Dieses eignet sich zum Beispiel perfekt für standardisierte Formate.
Eine passende Autorensoftware bildet im Grunde genommen die Basis für Ihren E-Learning Kurs. Daher ist es umso wichtiger, dass diese alle Funktionen enthält um Ihre Vorstellungen umsetzen zu können. Ebenso sollte berücksichtigt werden, wie viele Ressourcen zur Verfügung stehen. Denn eine zu hohe Komplexität kann dem Erfolg Ihres Projekts im Weg stehen. Erfahren Sie also nun, welches Autorentool sich am besten für Ihr Projekt eignet.
Welches Autorentool passt zu mir?
Das hängt natürlich sehr stark davon ab, was genau Sie umsetzen möchten. Je nachdem welche Zielsetzung Sie haben eignet sich Rise oder Storyline mehr – das ist oft eine sehr individuelle Entscheidung. Ebenso spielt dabei Ihr verfügbares Budget eine Rolle. Zudem ist ein Faktor, welcher E-Learning Content umgesetzt werden soll. Wir lassen Sie jedoch nicht im Regen stehen und planen zusammen mit Ihnen das für Sie perfekte Projekt. Denn zusammen mit unseren E-Learning Spezialisten entwerfen wir ein passendes Konzept für Ihren Lernzweck. Sprechen Sie uns doch einfach an!
Nun erhalten Sie zuerst einen groben Überblick darüber, für welche Art von Projekt sich welches Autorentool eignet. Im Folgenden haben wir dann für Sie alle Vor- und Nachteile der Softwares detailliert aufgelistet.
Articulate Storyline
hohe Individualität
umfangreiche Funktionen
geeignet für komplexe, einzigartige Projekte
Articulate Rise
schnelle Produktion
Optimiert für alle Endgeräte
geeignet für kleinere Projekte oder Unterweisungen
Ihre Ansprechpartnerin für Autorentools
Sie haben Fragen, wünschen ein Angebot oder Beratung? Ich helfe Ihnen gerne weiter!
Mit der neusten Version von Storyline (Storyline 360) hat Articulate eine sehr mächtige, aber ebenso sehr komplexe Software auf den Markt gebracht. Im Grunde genommen kann mit diesem Programm fast alles übliches im E-Learning Bereich umgesetzt werden. Storyline ist dabei sehr wandelbar und kann beliebig an Ihre Anforderungen angepasst werden. Ihr Kurs wird mit diesem Tool somit zum einzigartigen Projekt, komplett in Ihrem präferierten Corporate Design. Durch den modularen Aufbau können dabei verschiedene interaktive Übungen umgesetzt werden. Von Drag and Drop, Multiple Choice bis hin zu kompletten Spielen ist fast alles möglich. Zudem können verschiedene Medien wie Audio, Lernvideos oder Grafiken in den Kurs eingebunden werden. Ebenso können Dokumente oder Vorlagen direkt im Kurs hinterlegt werden.
Bei der Arbeit mit Articulate Storyline 360 gibt es allerdings auch einige Nachteile, die nicht von der Hand zu weisen sind. Denn Projekte, die auf diese Weise erstellt werden, sind um einiges komplexer, als Projekte auf Basis von Rise. Dabei ist die Produktion zwar in der kompletten Gestaltung freier und bietet grundsätzlich mehr Funktionen. Sie ist aber auch deutlich aufwändiger und teurer in der Umsetzung. Zudem eignet sich Articulate Storyline nur bedingt für E-Learning Kurse, welche auf einem Smartphone durchgeführt werden sollen – hier ist Rise die bessere Alternative.
Alle Vor- und Nachteile von Articulate Storyline im Überblick:
Vorteile
Extrem anpassbar, sowohl optisch als auch funktional
Vielzahl an Übungstypen & Interaktionen möglich (Drag and Drop, Multiple Choice, individuelle Lernspiele)
Zugriff auf viele, bereits durch uns erstellte Templates
Einbindung von Audio, Video und Grafiken
Abschlussquiz mit Freischaltung der Qualifikationsbescheinigung möglich
Umfangreiche Anpassung der Player Optik und Elemente auf Ihr CI möglich
perfekte Wahl für sehr komplexe und individuelle Projekte
Nachteile
je nach Wünschen deutlich komplexer und aufwändiger, als die Umsetzung mit Articulate Rise
nur bedingt auf mobilen Endgeräten einsetzbar
Content Erstellung mit Articulate Rise
Als Alternative können wir professionelle Kurse auf Basis von Rise erstellen. Dieses ist im Vergleich zu Articulate Storyline in den Funktionen eingeschränkter. Andererseits sind Projekte deutlich schneller umsetzbar und somit günstiger in der Produktion. Es eignet sich zum Beispiel sehr gut für das Erstellen von Online Unterweisungen. Ein weiterer Vorteil von Rise ist die uneingeschränkte Responsiveness. Der Kurs kann also auf jedem beliebigen Endgerät verwendet werden. Egal ob PC, Tablet oder Smartphone, der Output wird immer optimal dargestellt. Mit Rise können jedoch nur vordefinierte Inhaltsblöcke verwendet werden. Das gilt ebenso für Übungen. Es gibt dabei nur vordefinierte Übungstypen. Die Möglichkeit selbst Übungsarten zu erstellen, bietet das Tool nicht. Allerdings ist die Möglichkeit gegeben, beliebige mit Storyline 360 erstellte Bausteine in Rise einzubinden. Dadurch kann das Standardformat auf Wunsch durch komplexe Übungen oder Spiele erweitert werden.
Beim Layout müssen Sie ebenfalls mit Abstrichen rechnen. Zwar kann das System in Ihren CI-Farben grundkonfiguriert werden. Weitere Anpassungen sind allerdings nicht bzw. nur sehr beschränkt möglich.
Alle Vor- und Nachteile von Articulate Rise im Überblick:
Vorteile
schnelle und wenig komplexe Kurserstellung möglich, dadurch kosteneffizienter
uneingeschränkte Nutzbarkeit auf allen Geräten (Desktop, Tablet & Smartphone)
erweiterbar durch Bausteine aus Articulate Storyline
schnell verständliche und simple Führung durch den Kurs
perfekte Wahl für Unterweisungen oder kleinere ELearning Projekte
Einbindung von Audiodateien, Videos und Grafiken möglich
Nachteile
zunächst beschränkt auf Standardbausteine
keine umfangreiche Anpassung des CIs und der Grundoptik des Kurses
keine automatisch ablaufende Vertonung von Texten möglich
Beispielbaustein auf Basis von Articulate Rise
Sie möchten sich einen Beispielbaustein, welcher mit Articulate Rise erstellt wurde anschauen? Kein Problem! Hier finden Sie einen Demokurs, in dem Sie einige Funktionen und Möglichkeiten von Rise direkt ausprobieren können. Wenn Sie Fragen haben, stehen wir Ihnen natürlich gerne zur Verfügung und beraten Sie individuell.
Loading // https://john-dugan.com/javascript-debounce/
var debounce=function(e,t,n){var a;return function(){var r=this,i=arguments,o=function(){a=null,n||e.apply(r,i)},s=n&&!a;clearTimeout(a),a=setTimeout(o,t||200),s&&e.apply(r,i)}}; (function (window, d, debounce) { „use strict“; // Modal pop-up window iframe version 4.1 22-08-2016 // v4.1 – Launch from an anchor link, button or any other not recommended object
// modal title text set by data-modalTitle, image alt or link text.
// Object with .-modal (modalName) with have .-modal-open appended === „-“ + modalName + contentClass // To do – under consideration:
// make lightbox the modal section and code around it?
// perhaps <section class=modal = lightbox
// <div =modal_inner = modal?
// lightbox doesnt need to be in keychain just add onclick to close // To do:
// Option to set an ideal pop-up size eg an image
// – maintain the aspect ratio
// – centre it // Requires:
// SVG definitions for: #icon-cross, #icon-loading
// External functions: debounce() // Assumptions:
// First object in modal is the modal title
// Last object is the modal close link // defaults
var modalName = "modal";
var lightboxClass = "lightbox";
var openClass = "-" + modalName + "-open";
//var modalDesc = "tab or shift + tab to move focus.“;
var modalDesc = „Tab or Shift + Tab to move focus.“; var _setContentObjs = function (isModalOpen) {
var objs = d.getElementsByClassName(„-“ +modalName);
var i = objs.length;
while (i–) {
if (!!isModalOpen) {
objs[i].classList.add(openClass);
if (objs[i].tagName.toLowerCase !== „body“) {
objs[i].setAttribute(„aria-hidden“, „true“);
}
} else {
objs[i].classList.remove(openClass);
objs[i].removeAttribute(„aria-hidden“);
}
}
return !!isModalOpen;
}; var _closeModal = function (e) {
var count = e.target.count; // = lightbox, modal (ESC key), close btn
var modalSection = d.getElementById(modalName + „_“ + count);
var lightbox = d.getElementById(modalName + „_“ + count + „_“ + lightboxClass);
var modalLink;
if (modalSection) {
modalSection.setAttribute(„aria-hidden“, „true“);
lightbox.className = lightbox.className.replace(lightboxClass + „-on“, „“); _setContentObjs(!modalSection.getAttribute(„aria-hidden“));
modalLink = d.getElementById(modalSection.returnId);
d.body.classList.remove(openClass);
modalLink.focus();
document.getElementById(„iframe-course“).src = „https://via.placeholder.com/350“;
document.getElementById(„iframe-course“).src = „https://e-learning.page/wp-content/uploads/Direct_SEWK804_rev_1_0/story_html5.html“; }
}; var _getModalSize = function (modalSection) {
var clone = modalSection.cloneNode(true);
var size = {};
clone.className = modalName;
clone.setAttribute(„style“, „position:fixed;visibility:hidden;transform: none“);
modalSection.parentElement.appendChild(clone);
size.width = clone.clientWidth; // more performant than getBoundingClientRect
size.height = clone.clientHeight; // more performant than getBoundingClientRect
modalSection.parentElement.removeChild(clone);
return size;
}; var _resizeIframes = function () { var size;
var iframes;
var ii; var modals = d.getElementsByClassName(modalName);
var i = modals.length; while (i–) { size = _getModalSize(modals[i]); iframes = modals[i].getElementsByClassName(modalName + „_iframe“);
ii = iframes.length; while (ii–) {
iframes[ii].width = size.width;
iframes[ii].height = size.height;
}
}
}; var _addIframe = function (modalSection) { var size;
var close_lnk;
var frames = modalSection.getElementsByClassName(modalName + „_iframe“);
var iframe;
if (!frames[0]) { iframe = d.createElement(„iframe“); // Don’t display iframe until it’s content is ready
iframe.addEventListener(„load“, function () {
iframe.classList.add(modalName + „_iframe-on“);
iframe.setAttribute(„id“,“iframe-course“)
}, false); iframe.src = modalSection.modalSrc;
iframe.className = modalName + „_iframe“; size = _getModalSize(modalSection);
iframe.width = size.width;
iframe.height = size.height; iframe.setAttribute(„frameborder“, 0);
iframe.setAttribute(„allowfullscreen“, true); // Add iframe before the close button
close_lnk = d.getElementById(modalName + „_“ + modalSection.count + „_lnk_close“);
modalSection.insertBefore(iframe, close_lnk); }
}; var _getTarget = function (obj) {
var target = obj;
var isBodyTag = obj.tagName.toLowerCase() === „body“;
if (isBodyTag) {
return false;
}
if (!obj.modalSrc) {
target = _getTarget(obj.parentElement);
}
return target;
} var _openModal = function (e) { e.preventDefault(); var target = _getTarget(e.target); if (target) { var count = target.count;
var tempId = modalName + „_“ + count;
var tempLightboxClass = modalName + „_“ + lightboxClass;
var modalSection = d.getElementById(tempId);
var lightbox = d.getElementById(tempId + „_“ + lightboxClass); if (modalSection && lightbox) {
if (!lightbox.className.match(tempLightboxClass + „-on“)) {
lightbox.className += “ “ + tempLightboxClass + „-on“;
}
modalSection.setAttribute(„aria-hidden“, „false“);
_addIframe(modalSection); _setContentObjs(!!modalSection.getAttribute(„aria-hidden“)); d.body.classList.add(openClass);
d.getElementById(modalName + „_“ + count + „_title“).focus();
}
}
}; var _keydown_openerObj = function (e) {
// enter or space from the opener object
if (e.which === 13 || e.which === 32) {
e.preventDefault();
_openModal(e);
}
}; var _addOpenModalLinkAttr = function (modalLink) {
modalLink.id = modalLink.id || „modal_“ + modalLink.count + „_lnk“;
modalLink.setAttribute(„aria-controls“, modalName + „_“ + modalLink.count); // test if it’s not a button
var tag = modalLink.tagName.toLowerCase();
if (tag !== „button“) {
modalLink.setAttribute(„aria-role“, „button“);
modalLink.addEventListener(„keydown“, _keydown_openerObj, false);
} // click only requires space and enter activtion too
if (tag !== „a“ || „button“) {
modalLink.tabIndex = 0;
} modalLink.addEventListener(„click“, _openModal, false);
}; var _keydown_modal = function (e) { var target = e.target; // ESC key on anything actionable
if (e.which === 27) {
_closeModal(e);
} // tab key and shift on the h1
if (e.which === 9 && e.shiftKey) {
if (target.classList.contains(modalName + „_title“)) {
e.preventDefault();
//focus on last object in modal (close btn)
d.getElementById(modalName + „_“ + e.target.count + „_lnk_close“).focus();
}
} // tab key and not shift on the close link.
if (e.which === 9 && !e.shiftKey) {
if (target.classList.contains(modalName + „_lnk-close“)) {
e.preventDefault();
//focus on first object in modal – or should it be the modal? Requires testing
d.getElementById(modalName + „_“ + e.target.count + „_title“).focus();
}
} // enter or space on the close link – why again??
if (e.which === 13 || e.which === 32) {
if (target.classList.contains(modalName + „_lnk-close“)) {
e.preventDefault();
_closeModal(e);
}
}
}; var _getTitleText = function (modalLink) {
var alt = „“;
var imgs = modalLink.getElementsByTagName(„img“);
if (imgs && imgs[0]) {
alt = imgs[0].alt;
}
return modalLink.getAttribute(„data-modalTitle“) || alt || modalLink.textContent;
}; var _getModalTitle = function (modalLink) {
var title = d.createElement(„h1“);
title.id = modalName + „_“ + modalLink.count + „_title“;
title.className = modalName + „_title“;
title.tabIndex = 0;
title.textContent = _getTitleText(modalLink);
title.count = modalLink.count;
title.addEventListener(„keydown“, _keydown_modal, false);
return title;
}; var _getModalSVG = function (icon, clss, title) {
var svg = d.createElementNS(„http://www.w3.org/2000/svg“, „svg“);
svg.classList.add(clss);
if (title) {
var t = d.createElementNS(„http://www.w3.org/2000/svg“, „title“);
t.textContent = title;
svg.appendChild(t);
}
var use = d.createElementNS(„http://www.w3.org/2000/svg“, „use“);
use.setAttributeNS(„http://www.w3.org/1999/xlink“, „href“, „#“ + icon);
svg.appendChild(use);
return svg;
}; var _getModalDesc = function (modalLink) {
var desc = d.createElement(„p“);
desc.id = modalName + „_“ + modalLink.count + „_desc“;
desc.className = modalName + „_desc“;
desc.tabIndex = 0;
desc.innerHTML = modalLink.getAttribute(„data-modalDesc“) || modalDesc;
desc.count = modalLink.count;
desc.addEventListener(„keydown“, _keydown_modal, false);
return desc;
}; var _getModalCloseLink = function (modalLink) {
var link = d.createElement(„a“);
link.id = modalName + „_“ + modalLink.count + „_lnk_close“;
link.className = modalName + „_lnk-close“;
link.tabIndex = 0;
link.appendChild(_getModalSVG(„icon-cross“, „svg-close“, „Close modal“));
link.count = modalLink.count;
link.addEventListener(„click“, _closeModal, false);
link.addEventListener(„keydown“, _keydown_modal, false);
return link;
}; var _addModalSection = function(modalLink) {
var section = d.createElement(„section“);
section.id = modalName + „_“ + modalLink.count;
section.count = modalLink.count;
section.returnId = modalLink.id;
section.className = modalName;
section.setAttribute(„aria-hidden“, „true“); // should be on the activating link?
section.setAttribute(„aria-labelledby“, modalName +“_“ + modalLink.count + „_title“);
section.setAttribute(„aria-describedby“, modalName +“_“ + modalLink.count + „_desc“); section.setAttribute(„role“, „dialog“);
section.modalSrc = modalLink.modalSrc; section.appendChild(_getModalTitle(modalLink));
section.appendChild(_getModalSVG(„icon-loading“, „svg-loading“, „Loading“));
section.appendChild(_getModalSVG(„icon-loading“, „svg-loading2“, „“));
section.appendChild(_getModalDesc(modalLink));
section.appendChild(_getModalCloseLink(modalLink)); d.body.appendChild(section);
}; var _addLightbox = function (modalLink) { var count = modalLink.count;
var lightboxDiv = d.createElement(„div“); lightboxDiv.id = modalName + „_“ + count + „_“ + lightboxClass;
lightboxDiv.className = modalName + „_“ + lightboxClass;
lightboxDiv.count = count;
lightboxDiv.returnId = modalLink.id; // mouse / touch only
lightboxDiv.addEventListener(„click“, _closeModal, false); d.body.appendChild(lightboxDiv);
}; var configuration = function (cfg) {
modalName = cfg.modalName || modalName; lightboxClass = cfg.lightboxClass || lightboxClass; // any object with a class -modal will have the class -modal-open added when the modal is open.
//openClass = „-“ + modalName + (cfg.openClass || „-open“);
openClass = cfg.openClass ? „-“ + modalName + cfg.openClass : openClass;
}; var initialise = function (cfg) { configuration(cfg); var modalSrc;
var dataModals = d.querySelectorAll(„[data-“ + modalName + „]“); if (dataModals) {
var i = dataModals.length;
while (i–) { // Link href and iframe src are not always the same!
modalSrc = false; // use the href
if (dataModals[i].hasAttribute(„href“)) {
modalSrc = dataModals[i].href;
} // overwrite src with data-modal content when available
if (dataModals[i].getAttribute(„data-modal“).length) {
modalSrc = dataModals[i].getAttribute(„data-modal“);
} if (modalSrc) {
dataModals[i].modalSrc = modalSrc;
dataModals[i].count = i;
_addOpenModalLinkAttr(dataModals[i]);
_addModalSection(dataModals[i]);
_addLightbox(dataModals[i]);
} } window.addEventListener(„resize“, debounce(_resizeIframes, 250, false)); } }; initialise({
modalName : „modal“, // class name of modal, also used as the base for all classes used except on SVGs.
openClass : „-open“, // is default („-“ + modaName automatically prepended)
lightboxClass : „lightbox“ // is default (modaName + „_“ automatically prepended)
}); }(window, document, debounce));