Vorbereiten
Zuletzt geändert von Veronika Kocher am Donnerstag, 03 Sep. 2026 9:34
.arsn-phase {
max-width: 1400px;
margin: 0 auto;
color: #322f2b;
}
.arsn-phase * {
box-sizing: border-box;
}
.arsn-eyebrow {
font-size: 12px;
font-weight: 700;
letter-spacing: .075em;
text-transform: uppercase;
}
.arsn-card {
border-radius: 11px;
box-shadow: 0 1px 3px rgba(0,0,0,.035);
}
.arsn-hero-image {
height: 138px;
overflow: hidden;
border-radius: 11px 11px 0 0;
background: #f1eee9;
}
.arsn-hero-image img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.arsn-progress {
position: relative;
display: grid;
grid-template-columns: repeat(3, minmax(0,1fr));
gap: 14px;
margin: 0 0 26px 0;
padding: 4px 0 0 0;
}
.arsn-progress:before {
content: "";
position: absolute;
top: 21px;
left: 9%;
right: 9%;
height: 2px;
background: #e9cfc2;
z-index: 0;
}
.arsn-step {
position: relative;
z-index: 1;
text-align: center;
}
.arsn-step-dot {
width: 14px;
height: 14px;
margin: 0 auto 7px auto;
border-radius: 50%;
border: 3px solid #fff;
box-shadow: 0 0 0 1px #d5cfc7;
background: #d8d2ca;
}
.arsn-step.active .arsn-step-dot {
background: #e94b13;
box-shadow: 0 0 0 1px #e94b13;
}
.arsn-step.done .arsn-step-dot {
background: #8c837a;
box-shadow: 0 0 0 1px #8c837a;
}
.arsn-step-label {
font-size: 11px;
font-weight: 700;
letter-spacing: .06em;
color: #746d65;
}
.arsn-step.active .arsn-step-label {
color: #7d4a37;
}
.arsn-step-desc {
margin-top: 3px;
font-size: 13px;
color: #6a655e;
}
.arsn-focus-grid {
display: grid;
grid-template-columns: repeat(3, minmax(230px,1fr));
gap: 12px;
}
.arsn-focus-group {
padding: 13px 14px;
background: rgba(255,255,255,.52);
border: 1px solid #cfe8ef;
border-radius: 8px;
}
.arsn-focus-group strong {
display: block;
margin-bottom: 6px;
color: #2f5661;
}
.arsn-focus-group ul {
margin: 0 0 0 17px;
padding: 0;
color: #365862;
}
.arsn-focus-group li {
margin: 4px 0;
}
.arsn-outcome-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
gap: 10px;
}
.arsn-outcome {
position: relative;
padding: 12px 13px 12px 36px;
background: #fcfbf8;
border: 1px solid #e3ded6;
border-radius: 8px;
color: #4f4a44;
}
.arsn-outcome:before {
content: "✓";
position: absolute;
left: 13px;
top: 10px;
color: #e94b13;
font-weight: 800;
}
.arsn-area-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(310px,1fr));
gap: 18px;
align-items: stretch;
}
.arsn-area {
display: flex;
flex-direction: column;
overflow: hidden;
border: 1px solid #e3ded6;
border-radius: 11px;
background: #fcfbf8;
box-shadow: 0 1px 3px rgba(0,0,0,.035);
}
.arsn-area-head {
padding: 18px 19px 12px 19px;
}
.arsn-area-body {
padding: 3px 19px 19px 19px;
}
.arsn-area-label {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 5px 8px;
margin-bottom: 9px;
border-radius: 5px;
font-size: 12px;
font-weight: 700;
letter-spacing: .065em;
}
.arsn-area-number {
opacity: .72;
}
.arsn-area-action {
margin-left: 2px;
font-weight: 600;
opacity: .74;
letter-spacing: .02em;
text-transform: none;
}
.arsn-area h4 {
font-size: 19px;
line-height: 1.3;
margin: 0 0 7px 0;
color: #2f2b27;
}
.arsn-area p {
margin: 0;
line-height: 1.5;
color: #625d56;
}
.arsn-topic {
display: block;
margin: 6px 0;
padding: 10px 11px;
border: 1px solid #e9e4dc;
border-radius: 6px;
background: #fffdf9;
color: #252321;
text-decoration: none;
font-weight: 600;
transition: transform .08s ease, box-shadow .08s ease, background .08s ease;
}
.arsn-topic:hover,
.arsn-topic:focus {
background: #fff7f1;
text-decoration: none;
transform: translateY(-1px);
box-shadow: 0 2px 5px rgba(0,0,0,.06);
}
.arsn-resource-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
gap: 12px;
}
.arsn-related-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
gap: 8px;
}
.arsn-related-link {
display: block;
padding: 9px 10px;
border: 1px solid #e9e4dc;
border-left: 3px solid #e94b13;
border-radius: 6px;
background: #fffdf9;
color: #252321;
text-decoration: none;
font-weight: 600;
}
.arsn-related-link:hover,
.arsn-related-link:focus {
background: #fff7f1;
text-decoration: none;
}
.arsn-tip {
padding: 12px 15px;
border: 1px solid #c7e5ed;
border-left: 4px solid #21b6d7;
background: #eaf6f9;
border-radius: 7px;
color: #365e68;
font-size: 13px;
}
.arsn-tip strong {
color: #2d5661;
}
@media (max-width: 800px) {
.arsn-focus-grid {
grid-template-columns: 1fr;
}
}
@media (max-width: 700px) {
.arsn-progress:before {
display: none;
}
.arsn-progress {
grid-template-columns: 1fr;
gap: 8px;
}
.arsn-step {
text-align: left;
display: grid;
grid-template-columns: 24px 1fr;
column-gap: 8px;
align-items: center;
}
.arsn-step-dot {
margin: 0;
}
.arsn-step-desc {
grid-column: 2;
}
}
1 · VORBEREITEN
Planen & einrichten
2 · ARBEITEN & VERWALTEN
Durchführen & dokumentieren
3 · PUBLIZIEREN & TEILEN
Publizieren, erhalten & übergeben
JETZT WICHTIG
Worauf sollte ich mich jetzt konzentrieren?
Du musst vor dem Start nicht jedes Detail festlegen. Es braucht aber genügend gemeinsame Entscheidungen, damit das Projekt umsetzbar, verantwortungsvoll und gut weiterführbar ist.
Projekt
- Was ist der Umfang des Projekts und wer ist für welche Entscheidungen verantwortlich?
- Welche Fördermöglichkeiten und Förderbedingungen gelten?
- Welche Daten, Materialien und Outputs werden erzeugt, gesammelt oder nachgenutzt?
- Brauche ich einen Datenmanagementplan?
Rechte & Verantwortlichkeiten
- Welche Urheberrechte, Genehmigungen oder Lizenzen müssen geklärt werden?
- Werden personenbezogene, sensible, vertrauliche oder ethisch komplexe Materialien verwendet?
- Welche Entscheidungen sollten von Beginn an dokumentiert werden?
- Wer ist für gemeinsame Accounts, Zugriffe und die Übergabe verantwortlich?
Arbeitsumgebung
- Wie sollen Dateien und Ordner organisiert und benannt werden?
- Wo werden Materialien gespeichert und gesichert?
- Wer soll Zugriff haben?
- Welche Infrastruktur, Services und Tools sind geeignet?
AM ENDE DIESER PHASE
Du solltest eine tragfähige Projektstruktur haben
einen klaren Projektumfang und benannte Verantwortlichkeiten
einen grundlegenden Plan für Daten, Materialien und erwartete Outputs
zentrale Fragen zu Rechten, Ethik und Schutzbedarf identifiziert
vereinbarte Regelungen für Speicherung, Backup, Zugriff und Zusammenarbeit
IN DIESER PHASE
Vier Bereiche, um dein Projekt startklar zu machen
Beginne mit dem Bereich, der zu dem passt, was du jetzt entscheiden oder einrichten musst.
01 HIER STARTEN · Orientieren
Orientiere dich und wähle den passenden Planungsumfang für dein Projekt
Nutze diese Seiten, wenn du gerade startest, unsicher bist, welche Themen relevant sind, oder für ein kleineres Projekt eine praktikable Grundstruktur brauchst.
02 PLANEN & ORGANISIEREN · Entscheiden
Lege fest, was das Projekt braucht und wie es organisiert wird
Kläre vor Beginn der aktiven Arbeit Umfang, Verantwortlichkeiten, Förderbedingungen, erwartete Materialien und Outputs sowie den grundlegenden Datenmanagement-Ansatz.
03 SCHÜTZEN & KLÄREN · Prüfen
Rechte, Genehmigungen, Schutzbedarf und Verantwortlichkeiten klären
Identifiziere rechtliche, ethische oder datenschutzbezogene Fragen früh genug, um Genehmigungen einzuholen, Vereinbarungen zu treffen und spätere unnötige Einschränkungen zu vermeiden.
04 INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN · Vorbereiten
Schaffe eine Arbeitsumgebung, die das Projekt tatsächlich nutzen kann
Lege fest, wo Projektmaterialien liegen, wie sie gesichert und geschützt werden, welche Tools geeignet sind und wie Zugriff und Zusammenarbeit funktionieren.
NÄCHSTE PHASE
Weiter zu Arbeiten & Verwalten
Die hier getroffenen Grundentscheidungen sollen das Projekt leiten, sind aber nicht für immer unveränderlich. Während der aktiven Projektarbeit organisierst, dokumentierst, sicherst und überprüfst du, wie das Projekt tatsächlich funktioniert.
Weiter zu Arbeiten & VerwaltenNÜTZLICHE MATERIALIEN
Praktische Ressourcen
Info-Blätter
IN VORBEREITUNG
IN VORBEREITUNG
Kurze Orientierungshilfen für häufige Fragen und Entscheidungen.
Anleitungen
IN VORBEREITUNG
IN VORBEREITUNG
Schritt-für-Schritt-Anleitungen für konkrete Aufgaben und Abläufe.
Checklisten & Vorlagen
IN VORBEREITUNG
IN VORBEREITUNG
Wiederverwendbare Hilfsmittel zum Planen, Dokumentieren und Überprüfen deiner Projektstruktur.
Tipp · Eine hilfreiche Faustregel: Plane früh, dokumentiere Entscheidungen und überprüfe sie, wenn sich das Projekt verändert. Eine einfache Projektstruktur, die tatsächlich genutzt wird, ist meist wirksamer als ein komplexer Plan, der nie aktualisiert wird.
[data-sn-equal-height-managed],
[data-sn-first-section-aligned]{
box-sizing:border-box;
}
(function(){
"use strict";
var MOBILE_MAX=767;
var ROW_TOLERANCE=6;
var MIN_W=150;
var MIN_H=36;
var MAX_PARENT_CHILDREN=16;
var SEARCH_DEPTH=5;
var root=
document.getElementById("xwikicontent")||
document.querySelector(".xwiki-rendering-content")||
document.querySelector("main")||
document.body;
if(!root)return;
var heightManaged=new Set();
var sectionManaged=new Set();
var originalMinHeight=new WeakMap();
var originalMarginTop=new WeakMap();
var raf=0;
function num(v){
var n=parseFloat(v);
return Number.isFinite(n)?n:0;
}
function visible(el,minW,minH){
if(!el||el.nodeType!==1)return false;
var s=getComputedStyle(el);
if(
s.display==="none"||
s.visibility==="hidden"||
Number(s.opacity)===0
){
return false;
}
var r=el.getBoundingClientRect();
return (
r.width>=(minW||1)&&
r.height>=(minH||1)
);
}
function excluded(el){
return (
!el.matches||
el.matches(
"button,input,select,textarea,option,label,img,svg,canvas,table,thead,tbody,tfoot,tr,td,th,summary,script,style,noscript,template,.btn,.chip,[role=button]"
)
);
}
function namedLikeBox(el){
var c=
typeof el.className==="string"
? el.className
: "";
return /(^|[s_-])(box|card|tile|panel|role|check|service|source|call|area|detail|resource|topic|warn|info)([s_-]|$)/i.test(c);
}
function boxLike(el){
if(!visible(el,MIN_W,MIN_H)||excluded(el))return false;
var s=getComputedStyle(el);
var r=el.getBoundingClientRect();
var border=
num(s.borderTopWidth)+
num(s.borderRightWidth)+
num(s.borderBottomWidth)+
num(s.borderLeftWidth);
var radius=Math.max(
num(s.borderTopLeftRadius),
num(s.borderTopRightRadius),
num(s.borderBottomLeftRadius),
num(s.borderBottomRightRadius)
);
var bg=
s.backgroundColor&&
s.backgroundColor!=="rgba(0, 0, 0, 0)"&&
s.backgroundColor!=="transparent";
var shadow=
s.boxShadow&&
s.boxShadow!=="none";
return (
namedLikeBox(el)||
border>=1||
(bg&&radius>=3)||
(shadow&&r.width>=180)
);
}
function saveOriginal(el,map,property){
if(map.has(el))return;
map.set(el,{
value:el.style.getPropertyValue(property),
priority:el.style.getPropertyPriority(property)
});
}
function restoreOriginal(el,map,property){
var original=map.get(el);
if(original&&original.value){
el.style.setProperty(
property,
original.value,
original.priority||""
);
}else{
el.style.removeProperty(property);
}
}
function reset(){
heightManaged.forEach(function(el){
restoreOriginal(
el,
originalMinHeight,
"min-height"
);
el.removeAttribute(
"data-sn-equal-height-managed"
);
});
sectionManaged.forEach(function(el){
restoreOriginal(
el,
originalMarginTop,
"margin-top"
);
el.removeAttribute(
"data-sn-first-section-aligned"
);
});
heightManaged.clear();
sectionManaged.clear();
}
function pickTarget(child){
if(!visible(child,MIN_W,MIN_H))return null;
if(boxLike(child)){
return child;
}
var cr=child.getBoundingClientRect();
var q=[];
Array.from(child.children||[]).forEach(function(el){
q.push({el:el,depth:1});
});
var best=null;
var bestScore=-Infinity;
while(q.length){
var item=q.shift();
var el=item.el;
if(!visible(el,MIN_W,MIN_H))continue;
var r=el.getBoundingClientRect();
if(
r.width>=cr.width*.68&&
boxLike(el)
){
var widthFit=
1-Math.min(
1,
Math.abs(cr.width-r.width)/
Math.max(1,cr.width)
);
var topFit=
1-Math.min(
1,
Math.abs(cr.top-r.top)/100
);
var score=
widthFit*6+
topFit*3+
Math.min(r.height,900)/450+
Math.min(r.width*r.height,900000)/900000;
if(score>bestScore){
best=el;
bestScore=score;
}
}
if(item.depth0;});
if(widths.length<2)return false;
var minWidth=Math.min.apply(Math,widths);
var maxWidth=Math.max.apply(Math,widths);
return (
maxWidth/
Math.max(1,minWidth)<=
1.9
);
}
function normalizeText(text){
return String(text||"")
.replace(/s+/g," ")
.trim()
.toUpperCase();
}
function exactKnownFirstSection(el){
var text=normalizeText(el.textContent);
return (
text==="HIER STARTEN"||
text==="ORGANISIEREN & DOKUMENTIEREN"||
text==="ENTSCHEIDEN"||
text==="START HERE"||
text==="GET STARTED"||
text==="ORGANISE & DOCUMENT"||
text==="ORGANIZE & DOCUMENT"||
text==="DECIDE"
);
}
function visuallyFirstSectionBar(card){
var cardRect=card.getBoundingClientRect();
var candidates=[];
Array.from(
card.querySelectorAll(
"div,p,span,strong,h3,h4,h5,h6"
)
).forEach(function(el){
if(!visible(el,20,6))return;
if(excluded(el))return;
var r=el.getBoundingClientRect();
var relativeTop=r.top-cardRect.top;
if(
relativeTop<45||
relativeTop>cardRect.height*.72
){
return;
}
var widthRatio=
r.width/
Math.max(1,cardRect.width);
if(
widthRatio<.55||
widthRatio>1.05||
r.height>54
){
return;
}
var text=normalizeText(el.textContent);
if(
text.length<2||
text.length>90
){
return;
}
var style=getComputedStyle(el);
var bg=
style.backgroundColor&&
style.backgroundColor!=="rgba(0, 0, 0, 0)"&&
style.backgroundColor!=="transparent";
var border=
num(style.borderTopWidth)+
num(style.borderRightWidth)+
num(style.borderBottomWidth)+
num(style.borderLeftWidth);
var mostlyUpper=
text.length>=3&&
text===text.toUpperCase();
var exact=exactKnownFirstSection(el);
var score=
(exact?20:0)+
(bg?6:0)+
(border>=1?2:0)+
(mostlyUpper?4:0)+
(num(style.fontWeight)>=600?1:0);
if(score>=7){
candidates.push({
el:el,
relativeTop:relativeTop,
width:r.width,
score:score
});
}
});
if(!candidates.length)return null;
candidates.sort(function(a,b){
if(a.score!==b.score)return b.score-a.score;
if(Math.abs(a.relativeTop-b.relativeTop)>3){
return a.relativeTop-b.relativeTop;
}
return b.width-a.width;
});
// For exact known labels always prefer the earliest exact match.
var exacts=candidates.filter(function(c){
return exactKnownFirstSection(c.el);
});
if(exacts.length){
exacts.sort(function(a,b){
return a.relativeTop-b.relativeTop||b.width-a.width;
});
return exacts[0].el;
}
// Generic fallback: earliest high-confidence bar.
candidates.sort(function(a,b){
return a.relativeTop-b.relativeTop||b.score-a.score||b.width-a.width;
});
return candidates[0].el;
}
function alignFirstSections(cards){
var rows=
cards.map(function(card){
var bar=
visuallyFirstSectionBar(card);
if(!bar)return null;
var cardRect=
card.getBoundingClientRect();
var barRect=
bar.getBoundingClientRect();
return {
card:card,
bar:bar,
relativeTop:
barRect.top-cardRect.top,
label:
normalizeText(bar.textContent)
};
});
// Conservative: only align when every card in the horizontal row
// has a reliable first section bar.
if(
rows.some(function(row){
return !row;
})
){
return null;
}
var targetTop=
Math.max.apply(
Math,
rows.map(function(row){
return row.relativeTop;
})
);
rows.forEach(function(row){
var delta=
targetTop-
row.relativeTop;
if(delta<=1)return;
saveOriginal(
row.bar,
originalMarginTop,
"margin-top"
);
var currentMargin=
num(
getComputedStyle(
row.bar
).marginTop
);
row.bar.style.setProperty(
"margin-top",
(
currentMargin+
delta
)+"px"
);
row.bar.setAttribute(
"data-sn-first-section-aligned",
"4"
);
sectionManaged.add(row.bar);
});
return {
labels:
rows.map(function(row){
return row.label;
}),
targetRelativeTop:
Math.round(targetTop)
};
}
function applyGroup(group){
if(!validHorizontalGroup(group)){
return null;
}
var cards=[];
var seen=new Set();
group.entries.forEach(function(entry){
if(!seen.has(entry.target)){
seen.add(entry.target);
cards.push(entry.target);
}
});
if(cards.length<2)return null;
var firstSection=
alignFirstSections(cards);
// The section alignment can change natural card heights.
// Measure only afterwards.
var maxHeight=0;
cards.forEach(function(card){
maxHeight=Math.max(
maxHeight,
card.getBoundingClientRect().height
);
});
maxHeight=Math.ceil(maxHeight);
if(maxHeight=2&&
parent.children.length<=MAX_PARENT_CHILDREN
);
});
var touched=new Set();
parents.forEach(function(parent){
var entries=[];
Array.from(parent.children).forEach(function(child){
if(!visible(child,MIN_W,MIN_H))return;
var target=pickTarget(child);
if(!target)return;
entries.push({
target:target,
rect:target.getBoundingClientRect()
});
});
if(entries.length<2)return;
groupsByVisualRow(entries).forEach(function(group){
if(!validHorizontalGroup(group))return;
var signature=
group.entries.map(function(entry){
return entry.target;
});
if(
!signature.some(function(el){
return !touched.has(el);
})
){
return;
}
var applied=
applyGroup(group);
if(applied){
signature.forEach(function(el){
touched.add(el);
});
}
});
});
}
function schedule(){
if(raf)cancelAnimationFrame(raf);
raf=requestAnimationFrame(function(){
raf=requestAnimationFrame(function(){
raf=0;
run();
});
});
}
addEventListener("resize",schedule,{passive:true});
addEventListener("load",schedule,{once:true});
root.addEventListener(
"click",
function(){
setTimeout(schedule,0);
},
true
);
Array.from(root.querySelectorAll("img")).forEach(function(img){
if(!img.complete){
img.addEventListener("load",schedule,{once:true});
}
});
if(document.fonts&&document.fonts.ready){
document.fonts.ready.then(schedule);
}
schedule();
setTimeout(schedule,200);
setTimeout(schedule,650);
setTimeout(schedule,1400);
})();