Was Usability hier heißt
Die bewährten Regeln aus Wahrnehmung und Verhalten, nach denen jeder Bildschirm aufgebaut wird, und was Jobbörsen-Zahlen dazu sagen.
Nicht „schön“, sondern: Jeder Mensch erledigt seine Hauptaufgabe ohne Nachdenken, ohne Angst, etwas falsch zu machen, und ohne zu suchen. Aufbau und Übersicht folgen dabei belegten Gesetzen der Wahrnehmung und des Verhaltens:
Was Jobbörsen-Zahlen sagen
- Bewerbungen unter 5 Minuten werden zu 12,5 % abgeschlossen, ab 15 Minuten nur zu 3,6 % (Appcast 2016).
- Bei 50 und mehr Fragen halbiert sich die Abschlussquote gegenüber 25 und weniger (Appcast, über SHRM).
- Rund zwei Drittel der Bewerbungen kommen vom Handy (Appcast 2021 bis 2023), in Handwerk und Industrie eher mehr.
- Deutschland (StepStone): 47 % brechen ab, wenn die mobile Bewerbung hakt; 39 % schreckt ein komplizierter Ablauf ab; 54 % nennen fehlende Rückmeldung als Hauptgrund; 75 % erwarten nach spätestens 14 Tagen eine Antwort.
Richtwerte wie „ein Hauptknopf“ oder „3 bis 5 Blöcke“ sind aus den Prinzipien abgeleitet; eine Studie, die genau diese Zahlen festlegt, gibt es nicht.
Grundsatz: Entwurf B bleibt
Der abgestimmte Entwurf B bleibt; nur falsche Aussagen und Voreinstellungen werden korrigiert. Welche Vorschläge übernommen wurden und welche nicht.
| Vorschlag aus der Usability-Prüfung | Stand | Warum |
|---|---|---|
| Startseite: Einstiegskarten „Ich suche einen Job / Mitarbeiter“ und Zitat-Zeile streichen | nicht übernommen | Der Kunde hat sie gelobt, im Chef-Gespräch hieß es: bleiben. Nur der Satz „Ganz ohne Konto“ wird korrigiert. |
| Aussagen „ohne Konto bewerben“ (Startseite, Stelle) | übernommen | Sie sind falsch, seit Bewerber ein Konto haben. Text wird ersetzt, Aussehen bleibt. |
| „Job-Pakete“ auf der Startseite und in der Fußzeile | übernommen | Gibt es zum Livegang nicht. |
| Zahlenreihe im Vertrauensblock („34 offene Stellen …“) | übernommen | Nur echte Zahlen; bis dahin ausgeblendet. |
| Umkreis-Standard 25 km statt „Nur im Ort“ | übernommen | Voreinstellung, keine Gestaltung; liefert sofort Treffer. |
| Login-Bereiche: Übersicht als „Jetzt wichtig“-Liste statt Zahlen-Kacheln, kein Auswahlfeld und Notizfeld in jeder Zeile, zwei Handlungsknöpfe je Zustand, Status-Wörter aus Bewerbersicht, Stellen der Firma in Gruppen, Stelle anlegen in drei Blöcken mit Selbstspeichern, Rollenwahl beim Anmelden weg | übernommen | Diese Bereiche werden mit echten Funktionen neu gebaut, im Stil von B; der Kunde sieht sie beim Zwischenstand. |
| Startseite: „Neu dazugekommen“ vor „Top-Stellen“ | nicht übernommen | Top-Stellen sind bezahlte Hervorhebung, also gewollt wie Werbung; Reihenfolge bleibt wie in B. |
| Am Handy „Stelle inserieren“ aus dem Kopf ins Menü | übernommen | Am Handy sind fast alle Besucher Bewerber; zwei farbige Knöpfe im ersten Bildschirm lenken ab. |
| Deutschkenntnisse in jeder Stellenzeile; Filter Deutsch und Beschäftigungsart sichtbar statt unter „Weitere Filter“ | übernommen | Für diese Zielgruppe die wichtigste Frage; spart das Öffnen jeder Stelle. Eine kleine Angabe, kein neues Bedienelement. |
| Erklärsätze auf öffentlichen Seiten streichen (z. B. „Top-Stellen stehen oben …“) | übernommen | Weniger Text, gleiche Aussage; Erklärsätze zeigen nur unklare Bedienung. |
| Druck-Knopf aus der Handy-Leiste der Stelle; Teilen am Handy über das Geräte-Menü | übernommen | Am Handy druckt niemand; das Teilen-Menü des Handys kennt jeder. Die Leiste behält nur „Jetzt bewerben“; Merken und Teilen stehen oben als Rand-Knöpfe (3.3). |
| Eine statt zwei Werbeflächen unter den ersten zehn Treffern | nicht übernommen | Werbung ist gewollte Ablenkung und Einnahme des Kunden; bleibt wie in B. |
| Stellenformular mit dem freiwilligen Feld „Gut, aber nicht nötig“ | übernommen | Eingeklappt und freiwillig; trennt Pflicht von Wunsch, damit sich auch Menschen bewerben, die nicht alles erfüllen. |
Entschieden am 22.10. nach dem Maßstab von Nomad: keine Reizüberflutung, Ablenkung nur wo gewollt (Werbung, bezahlte Top-Stellen), für Laien verständlich, gezielte statt vieler Knöpfe.
Laden und Rückmeldung
Was man nach jedem Klick sieht, damit niemand zweifelt, ob er angekommen ist.
Alles, was nach einem Klick Zeit braucht, zeigt das sofort sichtbar an. Niemand soll sich fragen, ob der Klick angekommen ist.
| Fall | Was man sieht |
|---|---|
| Klick auf einen Knopf, der etwas auslöst | Sofort: Der Knopf zeigt „Wird gesendet …“ bzw. „Wird gespeichert …“ mit drei Ladepunkten aus B und ist gesperrt (kein doppeltes Absenden). Danach kurz die Bestätigung im Knopf oder als Hinweis. |
| Wechsel auf eine andere Seite | Ab 0,3 Sekunden ein dünner Ladebalken in Bululu-Orange am oberen Rand; die alte Seite bleibt stehen, bis die neue da ist. |
| Ein Bereich der Seite lädt (z. B. Top-Stellen, Bewerbungen, Postfach) | Platzhalter in der Form des späteren Inhalts im Stil von B (weiße Flächen mit dünnem Rand, ruhig pulsierend); Vorleseprogramme hören „Bereich wird geladen“. Die übrige Seite ist sofort benutzbar. |
| Längere Vorgänge (Bewerbungsmappe erstellen, Datei hochladen, Sammelaktion, Übersetzung) | Fortschritt mit Satz, z. B. „Ihre Bewerbungsmappe wird erstellt, etwa 5 Sekunden“, beim Hochladen mit Prozent; abbrechbar, wo es Sinn hat. |
| Ende eines spürbaren Ladevorgangs | Die Logo-Animation der Startseite aus B (die Puzzleteile „b“ und „ulu“ rasten ein), in kurzer Fassung von etwa einer halben Sekunde. Nur an Ankunfts-Momenten, nicht bei jedem Klick: erster Besuch der Startseite (wie in B), Betreten des eigenen Bereichs nach der Anmeldung, nach dem Absenden einer Bewerbung, wenn eine Mappe oder ein Vorgang fertig ist, der länger als eine Sekunde gedauert hat. |
| Weniger Bewegung im System eingestellt | Die Animation wird gedämpft (kurzes Einblenden statt Einrasten), die Ladeanzeigen bleiben. |
| Laden scheitert | Statt Platzhalter ein Satz mit Grund und „Erneut versuchen“; Eingaben bleiben erhalten. |
Die Animation ist bewusst auf wenige Momente beschränkt: Bei jedem Klick würde sie stören und genau die Reizüberflutung erzeugen, die wir vermeiden wollen.
Auswählen: mehrere Dinge auf einmal
Mehrere Bewerbungen, Stellen oder Nachrichten gleichzeitig bearbeiten, wie man es vom Mailprogramm kennt.
Wo man regelmäßig mehrere Dinge gleich behandelt, geht das so, wie man es vom Mailprogramm und vom Dateiordner kennt. Die Zeile bleibt ruhig: Das Auswahlkästchen erscheint erst beim Überfahren oder Ansteuern mit der Tastatur und bleibt sichtbar, sobald etwas ausgewählt ist. Ein Klick auf die Zeile öffnet weiter das Detail.
| Bedienung | Was passiert |
|---|---|
| Klick auf das Kästchen · Leertaste auf der Zeile | Eintrag aus- oder abwählen |
| Strg-Klick (Mac: Cmd-Klick) auf die Zeile | Eintrag zur Auswahl hinzu oder heraus |
| Umschalt-Klick · Umschalt + Pfeil | alles zwischen dem letzten und diesem Eintrag |
| Mit gedrückter Maus über die Kästchen ziehen; in Kachel-Ansichten einen Rahmen aufziehen | mehrere am Stück markieren |
| Strg + A (Mac: Cmd + A), wenn die Liste den Fokus hat | alle sichtbaren; die Leiste bietet dann „Alle 120 auswählen“. Im Textfeld markiert Strg + A wie gewohnt nur den Text. |
| Kästchen im Tabellenkopf | alle oder keine; halb gefüllt, wenn ein Teil gewählt ist |
| Esc · „Auswahl aufheben“ | Auswahl leeren |
| Entf | nur wo Entfernen die übliche Aktion ist (Merkliste), mit „Rückgängig“ |
| Handy: lange auf eine Zeile drücken | Auswahl beginnt, danach antippen zum Hinzufügen |
Sobald etwas ausgewählt ist, ersetzt eine Auswahl-Leiste die Werkzeugleiste (am Handy fest unten): „3 ausgewählt“ · höchstens zwei Aktionen · weitere hinter „…“ · „Auswahl aufheben“. Vorleseprogramme hören „3 ausgewählt“, jedes Kästchen heißt „Auswählen: <Name>“. Ein Filterwechsel hebt die Auswahl auf und sagt das. Jede Sammelaktion ist ein Auftrag an den Server, meldet „18 von 20 erledigt, 2 nicht, weil …“ und lässt sich 10 Sekunden zurücknehmen.
| Wo | Sammelaktionen |
|---|---|
| Firma: Bewerbungen | „Absagen und E-Mail senden“ (ein Fenster mit der Vorlage und Vorschau „geht an 5 Bewerber, Name wird je Person eingesetzt“) · „…“ mit „als PDF herunterladen“ (Export nie als sichtbare Aktion) |
| Firma: Stellen | verlängern · beenden |
| Bewerber und Firma: Postfach | als gelesen markieren |
| Bewerber: Merkliste | entfernen |
| Verwaltung: Prüfen, Anfragen | freigeben · als erledigt markieren |
Einzeln bleibt, was sich nicht zurücknehmen lässt oder Menschen ohne Vorschau erreicht: Sperren, Löschen, Mail an alle, Einladen (jede Einladung braucht einen eigenen Termin).
Ziehen und Ablegen: Dateien lassen sich (auch mehrere) in jede Hochladen-Fläche ziehen; die Fläche hebt sich beim Darüberziehen hervor. Reihenfolgen (Stationen im Lebenslauf, Unterlagen in der Mappe) ändert man per Ziehen am Griff oder über die Pfeile „nach oben / nach unten“ mit Namen. Text in Anzeigen, Nachrichten und Profilen bleibt markier- und kopierbar; Telefon und E-Mail haben zusätzlich einen Kopieren-Knopf. Mehrfachwahl in Formularen (Fachbereiche, Sprachen) sind Pillen zum Antippen, keine Liste mit Strg-Klick.
Prüfliste für jeden Bildschirm
Zwanzig Ja-Nein-Fragen, die jeder Bildschirm vor der Abnahme bestehen muss.
Wird in Abschnitt 0 an jede Bereichs-Karte gelegt und vor jeder Abnahme beantwortet (Ja oder Nein):
- Gibt es genau eine visuell dominante Hauptaktion?
- Kann ein Fremder nach 5 Sekunden sagen, wofür der Bildschirm da ist?
- Höchstens 5 bis 7 gleichrangige Möglichkeiten je Gruppe?
- Inhalt im ersten Bildschirm in höchstens 3 bis 5 klar getrennten Blöcken?
- Sagt jeder Link oder Knopf, wohin er führt (kein „Mehr“, „Details“, „OK“)?
- Erscheint jedes Ziel nur einmal (außer Kopf und Fußzeile)?
- Sehen gleiche Funktionen gleich aus, und unterscheiden sich Link, Knopf und Status?
- Sind Abstände in Gruppen kleiner als zwischen Gruppen?
- Kann man allein über die Überschriften navigieren?
- Stehen auf Übersichten Aufgaben vor Zahlen, und führt jede Zahl zu einer Handlung?
- Liegt Seltenes eine Ebene tiefer, aber nie eine Hauptaktion?
- Folgt der Aufbau gängigen Jobportal-Mustern?
- Reagieren Filter und Suche in unter 0,4 Sekunden oder zeigen sie einen Ladezustand?
- Nur nötige Felder, Pflicht und freiwillig markiert, Prüfung am Feld?
- Bewerbung in unter 5 Minuten und höchstens 3 Schritten mit Fortschritt?
- Gehen Eingaben bei Abbruch nicht verloren?
- Hauptaktion am Handy unten, Tippfläche ab 44 px, kein seitliches Scrollen?
- Passen die Voreinstellungen für die meisten?
- Sind Vertrauenszeichen am Entscheidungspunkt sichtbar?
- Sagt jede Bestätigung, was als Nächstes passiert und wann?
Bildschirm für Bildschirm
Einleitung zum folgenden Teil, der alle Bildschirme für Besucher, Bewerber, Firmen, Verwaltung und Werbekunden beschreibt.
Alle Bildschirme der Besucher, Bewerber, Firmen, der Verwaltung und des Werbekunden, mit Gefühlslage, Hauptknopf, Aufbau und Begründung. Wo Vorschläge die öffentlichen Seiten von B betreffen, gilt die Tabelle oben.
Bululu: Aufbau und Übersicht jedes wichtigen Bildschirms
Stand 22.10.2026. Grundlage: Entwurf B (entwurf-b/), Bauplan _berichte/PLAN-BACKEND-2026-10-21.html, Bedienregeln NUTZERFREUNDLICHKEIT.md, Kundenwunsch Fragebogen 3.2 („Nah, modern, regional & verlässlich … Fokus auf Schlichtheit, keine Bedienelemente an Stellen, wo sie überfordernd wirken“), 1.6 (StepStone: „nur die wichtigen Bereiche sehen“), 3.7 (Handy zuerst).
Rahmen: Optik von B bleibt (Farben, Schriften, Bausteine, CSS). Hier geht es nur um Aufbau, Reihenfolge, Gewichtung, Sichtbares gegen Klickbares, Wortlaut der Zustände.
0. Die Prinzipien, mit denen hier begründet wird
Jedes Element auf jedem Bildschirm bekommt unten eines dieser Prinzipien als Grund. Wer ein Element später hinzufügen will, muss es mit einem davon begründen können, sonst bleibt es weg (Bedienregel 1.5: „Hinzufügen braucht einen Grund, Weglassen nicht“).
| Kürzel | Prinzip | Ein Satz |
|---|---|---|
| Hick | Hick's Law | Die Entscheidungszeit wächst mit jeder Wahlmöglichkeit. Zwei gleichwertige Knöpfe sind doppelt so langsam wie einer. |
| Jakob | Jakob's Law | Menschen erwarten, dass die Seite so funktioniert wie Indeed, StepStone, ihre Banking-App. Abweichung kostet Denkzeit. |
| Erkennen | Erkennen statt Erinnern (Nielsen) | Der Nutzer soll sehen, nicht wissen müssen: Name der Stelle statt Nummer, Status als Wort statt Farbe. |
| Offenlegung | Progressive Offenlegung | Erst das Nötige, Seltenes erst auf Klick. Nicht verstecken, was täglich gebraucht wird. |
| Gradient | Ziel-Gradient | Je näher das Ziel, desto größer der Antrieb. Darum Fortschritt zeigen („noch 1 Angabe“), nie „Schritt 1 von 7“. |
| Zeigarnik | Zeigarnik-Effekt | Unerledigtes bleibt im Kopf. Angefangenes sichtbar machen („Sie haben eine Bewerbung angefangen“) wirkt stärker als jede Erinnerung. |
| Verlust | Verlustaversion | Ein drohender Verlust motiviert stärker als ein Gewinn: „Stelle läuft in 3 Tagen ab“ wirkt, „Verlängern Sie jetzt“ nicht. |
| Vertrauen | Vertrauenssignal | Echte Zahlen, echte Namen, Telefonnummer, Datenschutz-Satz am richtigen Ort. Nie erfundene Zahlen (Plan: „Zahlen nur, wenn sie echt sind“). |
| F-Muster | F-/Z-Lesemuster | Am Desktop wird oben links begonnen, dann die linke Kante hinunter. Das Wichtigste gehört oben links, der Hauptknopf rechts auf derselben Höhe oder am Ende der Lesebahn. |
| Daumen | Daumenzone (Handy) | Unten mittig ist gut erreichbar, oben rechts schlecht. Der Hauptknopf am Handy sitzt unten, fest (B hat das auf der Stelle schon: Klebeleiste). |
| Shneiderman | Acht goldene Regeln | Einheitlichkeit, Rückmeldung auf jede Aktion, Abschluss-Gefühl am Ende, Fehler vermeiden statt melden, Rückgängig statt „Sind Sie sicher?“, Nutzer hat die Kontrolle, Gedächtnislast klein, Abkürzungen für Vielnutzer. |
| Chunking | Chunking / Miller | Mehr als etwa 5 bis 7 Dinge auf einmal werden nicht mehr überblickt. Formulare in 3 Blöcke, Listen in Gruppen. |
| Standard | Default-Effekt | Was voreingestellt ist, wird meist so gelassen. Eine gute Voreinstellung spart eine Entscheidung. |
| Tesler | Tesler's Law | Komplexität verschwindet nicht, sie wandert nur. Was das System weiß (Firma, Ansprechperson, Ort), trägt es selbst ein. |
| Doherty | Doherty-Schwelle | Rückmeldung unter 0,4 Sekunden hält den Nutzer im Fluss. Speichern ohne Knopf, Toast sofort. |
| Peak-End | Peak-End-Regel | Erinnert wird der Höhepunkt und das Ende. Das Ende der Bewerbung (Bestätigung) und die Absage entscheiden über das Bild von Bululu. |
| Restorff | Von-Restorff-Effekt | Was sich abhebt, wird gesehen. Darum nur EIN farbiger Knopf je Ansicht; zwei farbige heben sich gegenseitig auf. |
| Sichtbar | Sichtbarkeit des Systemzustands (Nielsen 1) | Der Nutzer weiß jederzeit, wo etwas steht: „angekommen“, „vom Betrieb geöffnet“, „Entwurf gespeichert 12:03“. |
1. Die Menschen: Gefühlslage und Ziel
Alles Weitere ist aus diesen fünf Lagen abgeleitet. Wenn ein Element keiner dieser Personen hilft, hat es keinen Platz.
1.1 Der Bewerber: Ahmet, 45, Schweißer, am Handy
- Lage: Abends auf der Couch, Handy, mäßiges Deutsch (liest langsam, versteht Fachwörter wie „Kurzbewerbung“, „Status“, „Gesichtet“ nur halb). Unsicher: „Mache ich etwas falsch? Reicht mein Deutsch für die Stelle? Habe ich den richtigen Knopf gedrückt?“ Hat seinen Lebenslauf als Papier oder als Foto auf dem Handy, selten als PDF. Kennt Indeed und WhatsApp.
- Was er fühlen muss: Hier passiert nichts Schlimmes, wenn ich klicke. Ich sehe sofort, ob die Stelle für mich ist. Und nachher sehe ich schwarz auf weiß: angekommen.
- Seine drei Fragen in dieser Reihenfolge: 1. Passt das zu mir (Ort, Deutsch, Vollzeit, Geld)? 2. Wie bewerbe ich mich, ohne etwas zu schreiben? 3. Ist es angekommen, und was passiert jetzt?
- Folgen für jeden Bildschirm: kurze Wörter, ein Knopf, Deutschkenntnisse immer sichtbar, Foto statt Datei, Status als ganzer Satz, nie zwei Wege zum selben Ziel.
1.2 Der Betriebsinhaber: Herr Peters, Schlosserei, 12 Leute
- Lage: Morgens 6:45 am Handy in der Werkstatt oder abends am PC, fünf Minuten. Will keine Software lernen. Sorge: „Da hat sich einer beworben und ich habe drei Tage nicht geantwortet, jetzt ist er weg.“ Ungeduld mit Formularen; Angst, versehentlich etwas Falsches an einen Bewerber zu schicken.
- Seine Fragen: 1. Wer ist neu? 2. Wem muss ich antworten? 3. Läuft meine Anzeige noch?
- Folgen: Die Startseite des Firmenbereichs ist eine To-do-Liste, keine Statistik. Jede Aktion an den Bewerber ist 10 Sekunden rückgängig zu machen. Alles, was mit einer Stelle zu tun hat, liegt an der Stelle.
1.3 Die Recruiterin: Frau Lenz bei COPLA, Desktop, täglich
- Lage: 8 bis 15 offene Stellen, 40 Bewerbungen die Woche, vergleicht, sortiert, will nichts liegen lassen, arbeitet mit Tastatur. Routine, kein Lernbedarf, aber Wut über jeden unnötigen Klick, der sich 40-mal wiederholt.
- Ihre Fragen: Was ist seit gestern neu, je Stelle? Welche Bewerbung liegt am längsten ohne Antwort? Kann ich die nächste direkt öffnen?
- Folgen: Filter nach Stelle und Status, „seit 3 Tagen ohne Antwort“ an der Zeile, Pfeil „Nächste Bewerbung“ in der geöffneten Bewerbung, Vorlagen beim Einladen und Absagen, mehrere Bewerbungen auf einmal auswählen und absagen (siehe „Auswählen“).
1.4 Der Werbekunde: Werkzeughaus, kein Konto
- Lage: Hat von Bululu gehört, will Azubis als Kunden. Misstrauisch gegen Formulare ohne Preis. Will sehen, WO die Anzeige steht, bevor er etwas eintippt.
- Seine Fragen: Wo erscheint das? Was kostet es? Wie lange dauert die Antwort?
- Folgen: Werbeplanung zeigt die Fläche im echten Seitenbild, dann Format, Zeitraum, Motiv, Anfrage. Keine Preise, bis echte da sind (Plan), dafür die Zusage „Antwort innerhalb eines Werktags“. Kein Konto (Plan: bewusste Ausnahme).
1.5 Die Verwaltung: Verwaltung (3BS) oder Super Admin (Nomad), morgens 10 Minuten
- Lage: Pflichtgefühl, nichts übersehen, Fristen (neue Arbeitgeber binnen einem Werktag, Plan). Interessiert sich erst in zweiter Linie für Zahlen (Fragebogen 1.5: Arbeitgeber und Bewerber auf der Plattform).
- Ihre Frage: Was ist heute zu tun, und was läuft mir weg?
- Folgen: Startseite = Aufgabenliste nach Frist, älteste zuerst; Zahlen darunter.
1a. Die Menschen hinter dem Login der Verwaltung und ohne Login beim Werben
Ergänzt 1.4 und 1.5 des Vorbilds.
1.5a Betreiber-Stufe Super Admin (Nomad): das Team von Nomad, technisch, viele Kunden parallel
- Lage: Bululu ist eines von rund zwanzig Projekten. Morgens zehn Minuten, oft aus einer Mail heraus („neue Firma zu prüfen“). Kennt Admin-Oberflächen, will Tastatur, will nach jeder Entscheidung sofort die nächste, hasst Rückfragen-Fenster. Sorge: eine Frist übersehen (Prüfung binnen einem Werktag), eine Mail-Warteschlange, die seit Stunden steht, eine Übersetzung, die hängt.
- Seine Fragen: 1. Was ist überfällig oder wird es heute? 2. Läuft der Betrieb (Mail, Übersetzung, Bundesagentur, Virenprüfung)? 3. Kann ich die nächste Aufgabe öffnen, ohne zur Liste zurückzugehen?
- Folgen: Aufgabenliste mit Alter und Frist, Betriebs-Zeilen nur für diese Rolle, Pfeil „Nächste“ nach jeder Entscheidung, Tastaturkürzel, jede Mail an die Verwaltung verlinkt direkt in die Aufgabe (nicht auf die Startseite).
1.5b Verwaltung 3BS: Herr Schiffke, nicht technisch, selten drin
- Lage: Kommt alle zwei bis drei Wochen, meist weil eine Mail ihn ruft („Kontaktanfrage von …“, „Werbeanfrage von …“). Hat zwischendurch alles vergessen: wo was liegt, was ein Chip bedeutet, was „Freigeben“ auslöst. Angst, etwas kaputt zu machen oder einem Betrieb versehentlich eine Mail zu schicken. Liest Sätze, keine Symbole.
- Seine Fragen: 1. Was hat sich getan, seit ich das letzte Mal hier war? 2. Was muss ich (und nicht der Betreiber) jetzt tun? 3. Was passiert, wenn ich hier drücke?
- Folgen: Jeder Knopf sagt, was er auslöst („Freigeben und E-Mail senden“), jede Mail-Aktion zeigt vorher den Mailtext, nichts Technisches ist sichtbar (Stufe Verwaltung: in „Einstellungen“ nur die eigenen Verwaltungskonten, keine Betriebs-Zeilen), ein eingeklappter Block „Seit Ihrem letzten Besuch“, Erkennen statt Erinnern bis in die Beschriftungen („Prüfung, Frist bis morgen 9:00“ statt „Pending“). Nichts darf nur per Tastatur oder nur per Überfahren erreichbar sein.
1.4 (vertieft) Werbekunde: Werkzeughaus Kemper, regionaler Betrieb, kein Konto
- Lage: Inhaber oder Marketing-Verantwortliche eines Betriebs in Duisburg (Werkzeughandel, Arbeitsschutz, Bildungsträger, Fahrschule, Steuerberater). Hat Werbung bisher in der Zeitung oder bei Facebook geschaltet. Kennt „Billboard“, „Half Page“, „Native“ nicht und will sie nicht lernen. Misstrauisch gegen Formulare ohne Preis („die wollen erst meine Daten“) und gegen Formulare, nach denen nichts passiert. Will sehen, WO die Anzeige steht, und mit einem Menschen sprechen können.
- Seine Fragen: 1. Wo erscheint das, und wie sieht das aus? 2. Was kostet es, und wie lange dauert die Antwort? 3. Was muss ich liefern, wenn ich kein Motiv habe?
- Folgen: Flächen als Bild der echten Seite in Kundenwörtern („Großes Banner unter der Suche“), Format wird abgeleitet und vorgesagt, Motiv ist freiwillig („später per E-Mail“ oder „wir gestalten es“), Telefonnummer sichtbar, feste Zusage „Antwort innerhalb eines Werktags“ statt Preis, Eingangsbestätigung per Mail in derselben Minute.
Wer sieht was in der Verwaltung (aus dem Plan abgeleitet)
| Bereich | Super Admin (Nomad) | Verwaltung (3BS, Herr Schiffke) |
|---|---|---|
| Übersicht „Heute zu tun“ | alle Zeilen, dazu Betriebs-Zeilen (Mail, Übersetzung, Bundesagentur, Virenprüfung) | nur Prüfen, Anfragen, Werbung, Inhalte |
| Prüfen · Anfragen · Firmen und Nutzer · Werbung · Inhalte | ja | ja |
| Einstellungen | alle Karten, dazu Mail-Versand | nur die Karte Verwaltungskonten mit der eigenen Stufe; die technischen Karten gibt es für sie nicht (nicht gesperrt, sondern nicht vorhanden) |
| Firma löschen, Bewerberkonto löschen, Super-Admin-Konten sehen, Stufe ändern, Kennwort-Link und Faktor für Verwaltungskonten, Neuen Admin ernennen | ja, mit Kennwort | nein (Knopf nicht vorhanden; Super-Admin-Konten erscheinen nirgends, im Protokoll steht „Betreiber“) |
| Bewerbungsunterlagen öffnen | nur mit Grund, protokolliert | nur mit Grund, protokolliert |
| Zweiter Faktor | Pflicht | Pflicht (Plan: „für die Verwaltung erzwungen“) |
Drei Grundregeln nur für die Verwaltung, zusätzlich zu Abschnitt 2 des Vorbilds:
- Jeder Knopf, der eine Mail an Dritte auslöst, trägt es im Namen („Ablehnen und E-Mail senden“) und zeigt die Mail vorher. Herr Schiffke muss wissen, was passiert, der Super Admin will es nicht lesen; darum ist die Vorschau eingeklappt mit einem Satz davor („Die Firma bekommt diese E-Mail: Betreff …“). (Shneiderman: Fehler vermeiden; Offenlegung)
- Nach jeder Entscheidung kommt die nächste Aufgabe ohne Umweg: Pfeil „Nächste“ und Tastatur (→), innerhalb der aktuellen Liste. Vielnutzer-Abkürzung wie bei Frau Lenz in 3.10. (Shneiderman)
- Was das System selbst prüfen kann, zeigt es als Hinweis, nie als Urteil: „E-Mail-Domain passt zum Firmennamen ✓“, „Freemail-Adresse“, „Telefonnummer außerhalb NRW“. Keine Punktzahl, keine Ampel, kein „Risiko 73 %“. Der Mensch entscheidet, das System erspart ihm das Nachschlagen. (Tesler, Erkennen)
2. Grundregeln für alle Bildschirme (abgeleitet)
- Ein Hauptknopf je Ansicht, orange (B:
btn-primary). Alles andere ist Rand-Knopf, Textlink oder sitzt hinter „…“. (Restorff, Hick) - Am Handy sitzt der Hauptknopf unten fest, wie B es auf der Stelle schon macht (
stelle.html:98Klebeleiste). Gilt für Stelle, Bewerben-Fenster, geöffnete Bewerbung der Firma, Stelle anlegen. (Daumen) - Zahlen stehen nie allein in Kacheln. Eine Zahl ist entweder Teil einer Handlungszeile („2 neue Bewerbungen · Ansehen“) oder sie steht in einem ruhigen Block ganz unten. B hat Zahlen-Kacheln als erstes Element in beiden Login-Bereichen (
mein-bereich.html:125,firmen-bereich.html:129); das kehrt sich um. (Lage 1.2, 1.5) - Kein Erklärsatz in der Oberfläche. B hat davon mehrere („Top-Stellen stehen oben und sind markiert“
jobs.html:187, „Status ändern und Notizen festhalten. Notizen sieht nur Ihr Team“firmen-bereich.html:152, „Am Griff ziehen (Maus oder Finger) …“mein-bereich.html:164). Wenn ein Satz nötig scheint, ist das Bedienelement unklar (Bedienregel 5). Jeder dieser Sätze fällt weg oder wandert in eine Beschriftung. - Status ist immer ein Wort oder ein ganzer Satz, nie nur eine Farbe, und auf Bewerberseite aus Bewerbersicht formuliert (siehe 3.6).
- Rückgängig statt Rückfrage bei Absage, Beenden, Löschen (Plan: 10 Sekunden). Nur Konto löschen fragt mit Kennwort.
- Leere Liste = ein Satz + ein Knopf. Nie leer, nie nur „Keine Einträge“.
- Jede Funktion an genau einer Stelle (Plan: „Ein Ding, ein Ort“). Zweitwege nur, wenn sie eine Gewohnheit bedienen (Herz auf der Karte UND auf der Stelle ist so ein Fall).
- Reihenfolge nach Häufigkeit, nicht nach Logik des Systems: Was täglich gebraucht wird, steht zuerst; was einmal im Jahr gebraucht wird (Konto löschen, Daten herunterladen), liegt im Konto-Menü.
- Veraltete Aussagen „ohne Konto bewerben“ stehen in B an vier Stellen (
index.html:93, 157,stelle.htmlüberapp.js:715, 728) und widersprechen dem Plan (Konto beim ersten Bewerben, wie Indeed). Sie werden ersetzt, nicht ergänzt.
3. Die Bildschirme
Je Bildschirm: Hauptaufgabe und Hauptknopf · Aufbau von oben nach unten (Handy zuerst, dann Desktop, dann „nur auf Klick“) mit Prinzip je Element · Was bewusst fehlt · Zählwerte · Abweichung von B mit Datei und Stelle.
Zählwerte-Definition: gleichwertige Knöpfe = Knöpfe gleicher Gewichtung im ersten Bildschirm (Ziel: 1 farbiger, höchstens 2 weitere sichtbare). Entscheidungen = Stellen, an denen der Nutzer zwischen Möglichkeiten wählen muss, um das Ziel zu erreichen (Voreinstellungen zählen nicht). Klicks bis Ziel = ab Betreten des Bildschirms bis zum erledigten Hauptzweck.
3.1 Startseite
Hauptaufgabe: Innerhalb von fünf Sekunden eine Suche starten. Die Startseite ist ein Suchfeld mit Vertrauen drumherum, kein Prospekt.
Hauptknopf: „Jobs finden“ (Suchkarte).
Aufbau Handy, erster Bildschirm (390 × 844):
- Kopf wie B: Logo · Merkliste · Sprache · Burger; „Anmelden“ und „Stelle inserieren“ stehen im Burger-Menü (B blendet beide unter 900 px aus,
style.css:153,:1344), damit im ersten Bildschirm nur ein farbiger Knopf steht. (Restorff, Hick) - Überschrift in einer Zeile („Einfach bewerben, Job finden.“ aus B). (Jakob: Jobbörsen beginnen mit Versprechen + Suche)
- Suchkarte: Was · Wo · Umkreis (Standard „25 km“, nicht „Nur im Ort“; der Standard muss Treffer liefern, sonst ist der erste Eindruck „leer“) · Knopf „Jobs finden“. (Standard, Hick: drei Felder, nicht fünf)
- „Oft gesucht:“ vier Begriffe als Chips (B hat sie). Für Ahmet ist das der Weg ohne Tippen. (Erkennen)
Darunter (scrollen):
- Einstiegskarten „Ich suche einen Job“ (Knopf „Stellen ansehen“) und „Ich suche Mitarbeiter“ (Knopf „Stelle inserieren“), darunter die Zitat-Zeile „Zusammenbringen ist Bululu.“, wie B (
index.html:143bis:161). Entschieden: bleiben (Tabelle „Grundsatz“); nur der Satz „Ganz ohne Konto.“ wird ersetzt. - „Top-Stellen der Woche“ als Karten, darunter im selben Block „Neu dazugekommen“, sechs Zeilen (B
index.html:165bis:177, Reihenfolge wie B). Top-Stellen sind bezahlte Hervorhebung und damit gewollt wie Werbung. „Alle N Stellen ansehen“, Zahl N nur, wenn echt. - Fachbereiche als Kacheln mit Anzahl (B
kat-raster). Für Ahmet der zweite Einstieg ohne Tippen; Kacheln ohne Stellen zeigen „Job-Alarm“ statt „Bald mit Stellen“ (B hat das schon inkategorien.html). (Erkennen, Hick: höchstens 8 Kacheln, Rest hinter „Alle Fachbereiche“) - Werbefläche (Kundenwunsch 4.5), eine, hier und nicht höher. (Kunde)
- „So einfach geht es“, drei Schritte, Texte korrigiert (Schritt 2: „Kurz bewerben: E-Mail, Telefon, Lebenslauf als Datei oder Foto. Ihr Konto entsteht dabei.“ Schritt 3: „Antwort sehen: Sie sehen jederzeit, ob Ihre Bewerbung geöffnet wurde.“). Das beantwortet Ahmets Frage 3 schon vor der ersten Bewerbung. (Vertrauen, Sichtbar)
- Für Arbeitgeber, ein Teaser mit drei Haken und dem Textlink mit Pfeil „Stelle kostenlos inserieren →“ (D-3, entschieden 26.10.: der Knopf wäre das dritte Ziel „Arbeitgeber“ auf der Seite) + Firmen-Raster „Arbeitgeber auf bululu“. Das Raster zeigt nur echte, freigegebene Logos (zum Start COPLA); bei weniger als vier Logos fällt es weg. (Vertrauen: nichts erfunden)
- Vertrauen: Ansprechpartner mit Telefon, Sitz NRW. Zahlen nur echte (Plan). Ohne Foto (offene Frage „bilder“) bleibt die Silhouette, kein Platzhaltername.
- Job-Alarm als letzter Block (Beruf + E-Mail). Wer bis hier gescrollt hat, hat nichts gefunden; das ist der richtige Moment. (Verlust: „Neue Stellen zuerst erfahren“)
Desktop (1440 × 900), erster Bildschirm: Kopf mit Logo · Jobs · Für Arbeitgeber · Sprache · Anmelden (orange, klein) · Stelle inserieren (grün, klein) · Überschrift links, Bühne rechts, Suchkarte über die volle Breite, „Oft gesucht“. Mehr nicht; „Neu dazugekommen“ beginnt unter der Falz. (F-Muster: Blick landet auf Überschrift, läuft zur Suchkarte)
Nur auf Klick: Sprachwahl (nur freigegebene Sprachen, Plan), Burger-Menü (Jobs · Für Arbeitgeber · Merkliste · Kontakt · Anmelden · Stelle inserieren).
Was bewusst NICHT auf die Startseite kommt:
- „Job-Pakete ansehen“ (
index.htmlArbeitgeber-Teaser) und der Fußzeilen-Link „Job-Pakete“: gibt es zum Livegang nicht (Plan). (Plan: „kein Menüpunkt für etwas, das es noch nicht gibt“) - Die Zahlen-Reihe „34 offene Stellen · 10 Berufsfelder · 8 Jahre“ im Vertrauensblock: nur, wenn die Zahl echt und beeindruckend ist. 34 Stellen sind es nicht; ein kleiner Wert schadet mehr als keiner. Zum Start: nur „Seit 2018 in Duisburg“ als Satz, sobald das Jahr belegt ist. (Vertrauen)
- Karte der Region (B zeichnet in
app.js:465eine Karte mit Ortspunkten): bleibt nur, wenn sie in B bereits auf der Startseite sichtbar war; sie ist ein zweites Suchwerkzeug neben der Suchkarte. Wenn sie bleibt: unter „Neu dazugekommen“, nicht darüber.
Zählwerte: gleichwertige Knöpfe im ersten Bildschirm: 1 (Jobs finden) + 4 Chips · Entscheidungen bis zur ersten Trefferliste: 1 (Was oder Chip) · Klicks bis Trefferliste: 1 (Chip) bzw. 2 (tippen + Knopf).
Abweichung von B:
index.html:150(„Ganz ohne Konto.“) und:222(„Ein Konto brauchen Sie erst, wenn …“): Texte ersetzen, s. Regel 10.index.htmlArbeitgeber-Teaser: „Job-Pakete ansehen“ raus; der Knopf „Stelle kostenlos inserieren“ wird Textlink mit Pfeil (D-3, 26.10.). Im Kopf bleibt „Anmelden“ orange.index.html:269Vertrauensblock: Zahlenreihe raus bis echte Zahlen da sind.index.html:262Firmen-Raster: nur echte, freigegebene Logos, unter vier fällt es weg.
3.2 Jobs: Trefferliste
Hauptaufgabe: Aus der Liste die eine Stelle finden, die passt, und sie öffnen.
Hauptknopf: keiner im klassischen Sinn; die Zeilen selbst sind der Weg. Am Handy ist der einzige farbige Knopf „Suchen“ im kompakten Kopf (B style.css:1087); „Filter (2)“ ist ein Rand-Knopf. Am Desktop stehen die Filter offen links.
Aufbau Handy, erster Bildschirm:
- Kompakter Kopf mit Suchzeile Was · Wo · Suchen (B
kompaktkopf), damit die Suche änderbar bleibt, ohne zurückzugehen. (Jakob, Shneiderman: Kontrolle) - Überschrift als Ergebnis-Satz: „23 Stellen „Schweißer“ in Duisburg + 25 km“ (B macht das in
app.js:588). Das ist Rückmeldung und Orientierung zugleich. (Sichtbar) - Werkzeugleiste: links „Filter (2)“ (Rand-Knopf, Zahl aktiver Filter), rechts Sortierung (Passend zuerst · Neueste zuerst · Nächste zuerst, letztere nur mit Ort; Wörter wie TEXTE 1.2). (Hick: zwei Steuerungen, nicht mehr)
- Aktive Filter als entfernbare Chips (B
aktive-filter). (Erkennen: man sieht, was wirkt) - Erste zwei bis drei Stellenzeilen.
Stellenzeile (Baustein stellenkarte), Inhalt in dieser Reihenfolge: Marke „Neu“/„Top“ · Firma · Titel (Link) · Ort · Beschäftigungsart · Deutschkenntnisse · „vor 2 Tagen“ · Herz. Neu gegenüber B: Deutschkenntnisse als viertes Meta-Element; „Homeoffice möglich“ nur, wenn wahr (B so). Begründung: Ahmets erste Frage ist „passt das?“, und in dieser Nische (Fragebogen 1.2, 3.4) ist die Sprachstufe das entscheidende Passungsmerkmal. Ohne sie öffnet er zehn Stellen, um es herauszufinden. (Erkennen, Hick: weniger Öffnen-Schließen)
Darunter: weitere Zeilen; nach dem vierten Treffer eine Werbekarte („Anzeige“ gekennzeichnet), nach Zeile 20 „Mehr Stellen laden“ (echter Link, Plan; 20 je Seite statt 10 in B, die Werbeflächen bleiben nach dem 4. und 10. Treffer). Bei null Treffern: Leerzustand mit genau zwei Wegen: „Umkreis auf 50 km erweitern“ (primär) und „Job-Alarm für diese Suche anlegen“ (B hat beides in app.js:603 bis :609, dazu „Alle Filter zurücksetzen“; drei Knöpfe werden zwei: Zurücksetzen nur, wenn Filter aktiv sind). (Verlust: statt „nichts da“ ein nächster Schritt)
Filter-Blatt (Handy, auf Klick) und Filter-Spalte (Desktop, offen links):
- Sichtbar: Fachbereich (Auswahl, mit Anzahl), Beschäftigungsart (4 Haken), Deutschkenntnisse (3 Haken). Das sind die drei Fragen, die Ahmet und der Kunde (4.3: „Ort & Kategorie am wichtigsten“) haben.
- Hinter „Weitere Filter“: Veröffentlicht (Egal · seit gestern · 7 Tage), Homeoffice. (Offenlegung: selten)
- Fuß des Blatts am Handy: „23 Stellen anzeigen“ (primär, mit Live-Zahl, B hat
data-blatt-fertig) und „Zurücksetzen“ (Text). (Gradient: die Zahl zeigt, was die Wahl bewirkt)
Desktop: Suchzeile oben in voller Breite (B suchleiste), dann dreispaltig: Filter links offen mit den Stadt-Chips „In Ihrer Nähe“ als erster Gruppe „Ort“ (D-4, entschieden 26.10.: zwei Steuerungen über der Liste statt vier; gleiche Chips, anderer Platz), Liste Mitte, in jeder Zeile „{n} km“ nach dem Ort, sobald ein Ort gesucht wurde, rechts die Halfpage-Werbung (B halfpage-huelle, nur Desktop). (F-Muster: Filter an der linken Kante werden gelesen, Werbung rechts stört den Lesefluss nicht)
Was bewusst NICHT auf den Bildschirm kommt:
- Der Hinweis-Satz „Top-Stellen stehen oben und sind markiert. Merken mit dem Herz geht ohne Konto.“ (
jobs.html:187). Die Marke „Top-Stelle“ erklärt sich selbst, das Herz auch. (Regel 4) - Zwei Werbeplätze unter den ersten zehn Treffern (B: Position 5 Karte, Position 11 Textanzeige,
app.js:614, 615). Für einen Leser mit mäßigem Deutsch sieht die Werbekarte wie eine Stelle aus („20 % auf Sicherheitsschuhe“ steht an der Stelle des Titels). Die Werbeflächen bleiben wie in B (Karte nach dem vierten, Textanzeige nach dem zehnten Treffer); die Karte bekommt zusätzlich zum Wort „Anzeige“ keine Herz-Schaltfläche und keinen Firmen-Monogramm-Kreis, damit die Form sich unterscheidet. (Jakob: Google kennzeichnet Anzeigen deutlich; Vertrauen) - Gehalt in der Zeile: nur, wenn angegeben; sonst kein „k. A.“. (Erkennen: leere Werte sind Rauschen)
- Sortierung „Entfernung“ ohne Ort (Plan: erscheint nur mit Ort). (Hick)
Zählwerte: gleichwertige Knöpfe erster Bildschirm Handy: 1 farbig (Suchen) · Rand: Filter + Sortierung · Entscheidungen bis zur geöffneten Stelle: 1 (welche Zeile) · Klicks: 1. Mit Filter: 3 (Filter öffnen, Haken, anzeigen).
Abweichung von B:
jobs.html:130<details class="weitere">: Deutschkenntnisse (:150ff.) und Beschäftigungsart (:132ff.) aus „Weitere Filter“ heraus auf die sichtbare Ebene; Veröffentlicht und Homeoffice bleiben darin.app.js:218metaListe: Deutschkenntnisse als Meta-Element in jede Stellenzeile; Reihenfolge Ort · Art · Deutsch · Zeit.jobs.html:187: Hinweis-Satz löschen.app.js:603bis:609Leerzustand: „Alle Filter zurücksetzen“ nur bei aktiven Filtern anzeigen; Job-Alarm-Link wird zum Rand-Knopf mit vorausgefüllter Suche (job-alarm.html?q=…&ort=…).
3.3 Stelle
Hauptaufgabe: In 20 Sekunden entscheiden „passt das?“ und dann bewerben.
Hauptknopf: „Jetzt bewerben“, am Handy unten fest (B Klebeleiste), am Desktop oben rechts im Kopf UND am Ende des Textes (zweite Stelle ist Lesefluss-Ende, kein Doppelweg im Sinn von Regel 8: wer unten ankommt, soll nicht hochscrollen). (Daumen, F-Muster)
Aufbau Handy, erster Bildschirm:
- Brotkrumen (eine Zeile: Jobs › Fachbereich). (Jakob, Sichtbar)
- Firma (klein) · Titel (H1) · Marken „Neu“/„Top“.
- „Passt das?“-Reihe, neu: vier Fakten als kompakte Kacheln direkt unter dem Titel: Ort · Deutschkenntnisse · Beschäftigung · Gehalt oder Start (Gehalt, wenn angegeben; sonst Start, wenn angegeben; sonst nur drei). Das ist die Antwort auf Ahmets erste Frage, bevor er einen Absatz lesen muss. In B stehen diese Fakten erst in der Seitenleiste „Eckdaten“, die am Handy unter dem ganzen Text liegt (
app.js:733). (Erkennen, Chunking: 4 statt 6) - Herz „Merken“ und „Teilen“ als zwei Rand-Knöpfe in einer Zeile. Am Handy öffnet „Teilen“ das Teilen-Blatt des Geräts (WhatsApp ist dort die Gewohnheit), kein eigenes Menü mit fünf Einträgen. (Jakob, Hick)
- Unten fest: Klebeleiste mit „Jetzt bewerben“, allein.
Darunter:
- Einleitung (2 bis 3 Sätze, wenn vorhanden).
- Ihre Aufgaben · Das brauchen Sie · Das bietet die Firma. Überschrift „Ihr Profil“ wird „Das brauchen Sie“: Ahmet versteht „Profil“ als Konto. Reihenfolge bleibt die bekannte (Jakob), aber: Der Arbeitgeber trennt beim Anlegen (3.11) „nötig“ und „schön wäre“; hier erscheinen die nötigen Punkte zuerst, die weiteren unter einer leisen Zwischenzeile „Gut, aber nicht nötig“. Das senkt die Selbst-Ablehnung bei unsicheren Bewerbern, dem Hauptgrund, warum Fachkräfte mit Migrationshintergrund sich nicht bewerben. (Verlust umgekehrt: nichts, was er nicht hat, wirkt als Sperre)
- Bewerben-Box am Textende: „Passt das zu Ihnen?“ + Satz „E-Mail, Telefon, Lebenslauf als Datei oder Foto. Dauert zwei Minuten.“ + „Jetzt bewerben“. (Gradient: am Ende des Lesens ist die Motivation am höchsten)
- Arbeitgeber-Kasten: Logo/Monogramm, Name, Ort, „Zur Firma“, Ansprechperson mit Namen (Plan: Ansprechperson Pflicht) und, wenn die Person es unter Team freigegeben hat (Standard an), Telefon zum Antippen. Für Ahmet ist ein Name ein Mensch; das senkt die Hürde mehr als jeder Text. (Vertrauen)
- Eckdaten vollständig (B
fakten): Beschäftigung, Ort mit PLZ, Fachbereich, Deutschkenntnisse, Homeoffice, Gehalt, Start, Online seit. Am Handy eingeklappt unter „Alle Eckdaten“, weil die vier wichtigsten schon oben stehen. (Offenlegung) - Werbefläche 300 × 250 (Kunde).
- Ähnliche Stellen, drei (B). (Verlust: wer hier nicht passt, geht nicht leer aus)
- Ganz unten, leise: „Drucken“ · „Anzeige melden“ (Plan: Melden-Knopf). „Link kopieren“ steht nur im Teilen-Ausklapp (Desktop) bzw. im Teilen-Blatt des Geräts (Handy). (Offenlegung: selten; Regel 8)
Desktop: zweispaltig wie B (stelle-layout): links Kopf mit „Passt das?“-Reihe und Text, rechts Seitenleiste Arbeitgeber · Eckdaten · Werbung; „Jetzt bewerben“ oben rechts im Kopf. Teilen am Desktop als Ausklapp (WhatsApp · LinkedIn · Facebook · Xing · Link kopieren, B). „Drucken“ steht nur ganz unten. (F-Muster: Knopf am Ende der ersten Lesezeile)
Zustände, die der Bildschirm kennen muss (Plan), je mit einem Satz und einem Weg:
- *Schon beworben:* Klebeleiste zeigt statt „Jetzt bewerben“: „Beworben am 12.10. · Stand ansehen“ (Link in den Bewerberbereich). (Sichtbar, Shneiderman: Fehler vermeiden)
- *Bewerbung angefangen (Entwurf, 7 Tage):* gelbe Zeile unter dem Titel „Sie haben hier eine Bewerbung angefangen. Weiter“ mit Knopf. (Zeigarnik)
- *Stelle abgelaufen/beendet:* „Diese Stelle ist nicht mehr verfügbar“ + ähnliche Stellen + Job-Alarm (B hat die Seite „gibt es nicht mehr“,
app.js:698). - *Bewerbungsweg „eigene Karriereseite“:* Knopf heißt „Zur Bewerbung beim Betrieb“ mit kleinem Pfeil nach außen; keine zweite Erklärung. (Erkennen)
- *Wartet auf Prüfung (erste Stelle einer neuen Firma):* für Bewerber sichtbar wie aktiv, kein Hinweis (Plan). Nur die Firma sieht den Zustand.
Was bewusst NICHT auf den Bildschirm kommt:
- Der Druck-Knopf in der Handy-Klebeleiste (
stelle.html:98bis:101): am Handy druckt niemand; der Platz gehört dem einen Knopf. Drucken steht nur am Seitenende. - Der Satz „Kurzbewerbung in 2 Minuten, ohne Konto“ unter dem Knopf (
app.js:715) und „Ein Konto brauchen Sie dafür nicht“ (app.js:728): falsch seit Plan. Ersatz siehe Punkt 8. - „Alle Stellen dieser Firma“ als zweiter Link neben „Zur Firma“ (
app.js:732): die Firmenseite zeigt die Stellen ohnehin (Plan: Firmenprofil mit Stellen). Ein Link. (Regel 8) - Teilen-Menü mit fünf Einträgen am Handy. (Hick)
Zählwerte: gleichwertige Knöpfe erster Bildschirm Handy: 1 farbig (Bewerben) + 2 Rand (Merken, Teilen) · Entscheidungen bis Bewerben: 0 · Klicks: 1.
Abweichung von B:
app.js:714nachmetaListe(s, true): neue „Passt das?“-Reihe (4 Fakten) einfügen;app.js:733Eckdaten am Handy einklappbar.app.js:715,:728: Texte ersetzen.app.js:717bis:722: Teilen am Handy übernavigator.share, Ausklapp nur am Desktop.app.js:727: Überschrift „Ihr Profil“ → „Das brauchen Sie“; Unterteilung nötig/schön-wäre, sobald das Stellenformular (3.11) sie liefert.app.js:730bis:732: Ansprechperson in den Arbeitgeber-Kasten, zweiter Link raus.stelle.html:98bis:101: Druck-Knopf aus der Klebeleiste.- Neue Zustände „schon beworben“, „angefangen“ an der Klebeleiste und unter dem Titel.
- Melden-Knopf am Seitenende (fehlt in B).
3.4 Bewerben-Fenster
Hauptaufgabe: In zwei Minuten am Handy eine vollständige Mindestbewerbung abschicken, ohne vorher ein Konto „anzulegen“; das Konto entsteht nebenbei.
Hauptknopf: je Schritt genau einer: „Mit dieser E-Mail weiter“, nach dem Code „Weiter zum Lebenslauf“ · „Weiter zum Absenden“ · „Bewerbung senden“ (Verb mit Ziel, Regel 8). Ab Schritt 2 steht links daneben „Zurück“ als Rand-Knopf wie in B (stelle.html:140), damit man die E-Mail aus Schritt 1 noch korrigieren kann. (Shneiderman: Kontrolle)
Grundform: Fenster über der Stelle (B dialog#bewerbung), am Handy bildschirmfüllend, oben Titel der Stelle und Firma (B), ✕ rechts oben, Esc schließt (Bedienregel 2). Fortschritt als drei Striche, Beschriftung „Schritt 2 von 3“ nur so, nie „von 7“. (Gradient)
Schritt 1, „Ihre E-Mail“ (eine Frage, ein Feld):
- Feld E-Mail. Darunter: Nichts. Kein Vorname, kein Nachname, kein Telefon (B fragt in Schritt 1 vier Felder,
stelle.html:115ff.). - „Mit dieser E-Mail weiter“. Das System schaut nach: Konto vorhanden → Hauptknopf „Code an {mail} senden“, darunter der Textlink „Mit Kennwort anmelden“, der das Kennwort-Feld mit „Kennwort vergessen?“ aufklappt (N-1, entschieden 26.10.: ein Klick schickt den Link sofort an die eingetippte Adresse, das Fenster bleibt offen und sagt „Link unterwegs“; der Link führt zurück in die Stelle mit geöffnetem Fenster in Schritt 2, man verlässt die Bewerbung nicht); hat das Konto einen zweiten Faktor, folgt nach Code oder Kennwort im selben Schritt der zweite Schritt; kein Konto → Vorname, Nachname und ein Haken „Ich stimme den Nutzungsbedingungen zu und habe die Datenschutzhinweise gelesen“, dann „Code an {mail} senden“: Ein 6-stelliger Code aus der E-Mail (dasselbe Code-Feld wie beim zweiten Faktor) bestätigt die Adresse im selben Schritt; kein Kennwort, das Konto entsteht nebenbei ohne Kennwort. Mit dem Code-Feld wechselt die Überschrift auf „Schritt 1 von 3: Code aus Ihrer E-Mail“, Name und Haken schrumpfen zu einer Zeile „Max Muster · ändern“, der Hinweis zeigt die volle Adresse mit dem Textlink „E-Mail ändern“, und nach 60 Sekunden steht der Spam-Hinweis unter dem Feld. (Plan; Jakob: Indeed bestätigt die Adresse genau so mit einem Code im Fenster; Hick: erst eine Entscheidung, dann die nächste)
- Warum zuerst die E-Mail: Sie ist die eine Angabe, die Ahmet sicher weiß, und sie entscheidet den weiteren Weg. Mit ihr ist er „drin“ (Commitment: ein kleiner erster Schritt macht den zweiten wahrscheinlicher).
Schritt 2, „Ihr Lebenslauf“:
- Telefon (Pflicht, Plan; Beschriftung „Telefon, damit der Betrieb Sie anrufen kann“, das ist keine Erklärung, sondern der Grund, der die Eingabe-Bereitschaft erhöht).
- Große Ablage-Fläche: „Lebenslauf wählen oder Foto machen“ (ein Element, zwei Wege des Geräts: Dateiauswahl oder Kamera; PDF, JPG, PNG, HEIC; Word nicht zum Livegang, Plan). Für Ahmet mit Papier-Lebenslauf ist das Foto der normale Weg; das Wort „Foto“ muss auf dem Knopf stehen. (Erkennen, Jakob: WhatsApp-Gewohnheit)
- Darunter, nur wenn ein Profil mit mindestens einer Station existiert: „oder: Mit meinem Bululu-Lebenslauf bewerben“ als zweite Karte (B hat sie,
stelle.html:126ff.). Ohne Profil erscheint sie nicht. Hat das Konto schon eine Datei (Reiter Lebenslauf), ist sie vorgewählt: „lebenslauf.jpg ist ausgewählt“ mit „Andere Datei wählen“. (Offenlegung: keine Wahl, die ins Leere führt) - „Weiter zum Absenden“. Freiwillige Felder gibt es in diesem Schritt nicht.
Schritt 3, „Absenden“:
- Zusammenfassung in drei Zeilen: Stelle · „Lebenslauf: foto_2026.jpg“ · „Kontakt: E-Mail, Telefon“. (Sichtbar, Shneiderman: Fehler vermeiden)
- Eingeklappt: „Nachricht an den Betrieb (freiwillig)“ mit vorbereitetem Text aus der Vorlage (Plan: Anschreiben aus Vorlage, änderbar). Zugeklappt, weil Ahmet sonst denkt, er müsse schreiben. (Offenlegung)
- Haken Einwilligung Weitergabe an den Betrieb (Pflicht, ein Satz, Link Datenschutz).
- „Bewerbung senden“ (orange, voll breit, unten fest). Während des Sendens gesperrt (Plan).
- Vorschau der PDF-Mappe nur, wenn die Mappe aus dem Profil erzeugt wird (Knopf „Mappe ansehen“ in der Zusammenfassung). Bei eigener Datei ist die Datei die Mappe, keine Vorschau. (Hick: ein Schritt weniger für den häufigsten Fall)
Schritt 4, Bestätigung (siehe auch 5.1): eine Fassung; die frühere zweite („Fast geschafft: Bitte E-Mail bestätigen“) entfällt, weil der Code in Schritt 1 die Adresse bestätigt (26.10., C36).
- *Mail bereits bestätigt (Bestandskonto):* Haken, „Ihre Bewerbung ist bei Metallbau Hagedorn angekommen.“ Darunter ein Satz, was jetzt passiert: „Der Betrieb sieht Ihre Bewerbung ab jetzt. Sobald er sie öffnet oder antwortet, sehen Sie das unter Bewerbungen und bekommen eine E-Mail.“ Ein Knopf: „Meine Bewerbungen“. Textlink: „Weitere Stellen ansehen“.
- *B sagt „Ihre Bewerbung ist unterwegs“ und bietet darunter „Konto anlegen“ an (
stelle.html:145bis:151): beides entfällt. (Peak-End: das Ende verspricht nur, was stimmt; mit dem Code in Schritt 1 stimmt „angekommen“ immer.)
Was bewusst NICHT ins Fenster kommt:
- Link „Schon registriert? Anmelden und Daten übernehmen“ (
stelle.htmlSchritt 1): führt aus dem Fenster und aus der Stelle. Die E-Mail-Abfrage ersetzt ihn. (Shneiderman: Kontrolle bleibt beim Nutzer) - Deckblatt-Wahl, Anschreiben-Editor, Profil-Vervollständigung: gehören in den Lebenslauf-Baukasten, nie in den Bewerbungsfluss. (Hick, Gradient: nichts zwischen Bewerber und „Senden“, was warten kann)
- „Konto anlegen“ als Angebot auf der Bestätigungsseite (B): das Konto existiert schon.
- Mehr als ein Pflichtfeld je Bildschirm außer im Registrierungs-Teil (Name, Haken, dann der Code) und Telefon + Datei in Schritt 2.
Zählwerte: gleichwertige Knöpfe je Schritt: 1 · Entscheidungen insgesamt: 2 (Datei oder Foto; Nachricht ja/nein, zugeklappt = nein) · Klicks bis „gesendet“ bei neuem Konto: 7 (E-Mail tippen, Weiter, Name+Kennwort+Haken, Weiter, Telefon+Foto, Weiter, Einwilligung+Senden); mit Konto: 5. Indeed liegt in derselben Größenordnung.
Abweichung von B:
stelle.html:113bis:125Schritt 1: vier Felder → E-Mail allein, zweiter Teil (Kennwort bzw. Name+Kennwort+Zustimmung) im selben Schritt nach Prüfung.stelle.html:126bis:144Schritt 2: Telefon hierher (Pflicht); Ablage-Text „PDF, Word oder Foto“ → „Lebenslauf wählen oder Foto machen (PDF oder Foto)“; „Kurze Nachricht“ und Einwilligung in Schritt 3; Profil-Karte nur bei vorhandenem Profil.- Neuer Schritt 3 Zusammenfassung + Senden.
stelle.html:145bis:154Erfolg: zwei Fassungen, „Konto anlegen“ raus, Knopf „Meine Bewerbungen“.app.js:769Schritt-Titel: „Schritt 1 von 3: E-Mail“ · „2 von 3: Lebenslauf“ · „3 von 3: Absenden“. Gibt es zur Adresse kein Konto, wechselt der Titel sichtbar auf „Schritt 1 von 3: Ihr Konto“ mit dem Satz „Ihr Name, dann ein Code aus Ihrer E-Mail, und es geht weiter“ und der Knopf heißt „Code an {mail} senden“.
3.5 Bewerber-Übersicht (Startseite des Bewerberbereichs)
Hauptaufgabe: In drei Sekunden sehen: Muss ich etwas tun, und hat sich etwas getan?
Hauptknopf: der erste offene Punkt der „Jetzt wichtig“-Liste (z. B. „Einladung beantworten“). Gibt es keinen: „Stellen suchen“.
Aufbau Handy, erster Bildschirm:
- Kopf wie öffentlich, rechts statt „Anmelden“ der Konto-Knopf (Initialen-Kreis; Plan: neu gegenüber B). Darin: Wechsel zur Firma (wenn Mitglied) · Einstellungen · Hilfe und Kontakt · Abmelden. (Jakob: Konto oben rechts; Bedienregel 2)
- Bereichs-Kopf: „Hallo Ahmet“ (ohne Nachnamen, ohne „Ihr Bereich als Bewerber“, der Satz erklärt nichts). Rechts kein Knopf. (Regel 4)
- Reiter (B
reiter, wagerecht scrollbar am Handy): Bewerbungen · Postfach · Lebenslauf · Merkliste · Job-Alarme (Plan: 5). Die Übersicht ist die Startseite des Bereichs, kein eigener Reiter (Plan); zurück führt die Zeile „‹ Übersicht“ über der Überschrift jeder Unterseite und „Mein Bereich“ im Konto-Menü (Abschnitt 4). Reihenfolge nach Häufigkeit; Postfach mit Zahl-Kreis bei ungelesen, Bewerbungen mit Zahl-Kreis bei Statusänderung seit dem letzten Besuch. Zahl-Kreise nur dort, wo wirklich etwas wartet (Bedienregel 2). (Jakob, Erkennen) - „Jetzt wichtig“, Liste aus höchstens 5 Zeilen, jede Zeile = ein Satz + ein Knopf, sortiert nach Dringlichkeit:
- (Zeile „Bitte E-Mail bestätigen, sonst geht Ihre Bewerbung … nicht raus“ entfällt seit 26.10.: der Code im Bewerben-Fenster bestätigt die Adresse, Karte 2a C36)
- „Einladung zum Gespräch bei Induserv, Do 30.10. 9:00.“ → „Zusagen“ (öffnet die Bewerbung)
- „Neue Nachricht von Schlosserei Peters.“ → „Lesen“
- „Ihre Bewerbung bei Prüftechnik Lindner wurde geöffnet.“ (nur Information, kein Knopf; verschwindet nach dem Ansehen)
- „Gemerkte Stelle läuft in 2 Tagen ab: Schweißer, Moers.“ → „Bewerben“ (Verlust)
- „Telefonnummer fehlt im Lebenslauf.“ → „Ergänzen“ (nur, wenn Mindestangabe fehlt)
Diese Liste ist die Übersicht. Sie beantwortet Frage 3 („ist angekommen, was passiert jetzt“) ohne Zahl und ohne Kachel. (Zeigarnik, Sichtbar, Hick: ein Knopf je Zeile)
- Bei leerer Liste: ruhiger Kasten „Alles erledigt. Sobald sich ein Betrieb meldet, steht es hier, und Sie bekommen eine E-Mail.“ + „Stellen suchen“. (Peak-End: Warten fühlt sich nicht wie Stillstand an, wenn gesagt wird, wer den nächsten Zug hat)
Darunter:
- „Ihre Bewerbungen“, die letzten drei Zeilen (wie 3.6), Link „Alle 7 ansehen“.
- „Gemerkt“, die letzten drei gemerkten Stellen mit „Bewerben“, nur wenn etwas gemerkt ist; leer fehlt der Block, der Leer-Satz steht im Reiter Merkliste. Ebenso fehlt „Ihre Bewerbungen“ ohne Bewerbung; dann trägt „Jetzt wichtig“ den Satz und „Stellen suchen“. (Schrittweise zeigen)
- Kein weiterer Block. Die grüne Box „Lebenslauf aktuell?“ aus B (
mein-bereich.html:130) erscheint nur als Zeile unter „Jetzt wichtig“, wenn eine Mindestangabe fehlt, sonst nie. (Regel 3)
Desktop: gleiche Reihenfolge, „Jetzt wichtig“ links breit, „Ihre Bewerbungen“ und „Gemerkt“ rechts als schmale Spalte. (F-Muster: die Handlungsliste an der linken Kante)
Was bewusst NICHT auf den Bildschirm kommt:
- Die drei Zahlen-Kacheln „4 Bewerbungen · 1 Einladung · 0 gemerkte“ (
mein-bereich.html:125bis:129). Eine Zahl beantwortet keine der drei Fragen; „1 Einladung“ als Zahl zwingt zum Klick, als Satz mit Datum und Knopf nicht. (Lage 1.1) - Knopf „Stellen suchen“ oben rechts (
mein-bereich.html:98): „Jobs“ steht im Kopf, die Suchzeile im kompakten Kopf. (Regel 8) - „…“-Menü mit „Daten herunterladen · Konto löschen · Abmelden“ (
mein-bereich.html:103bis:108): wandert ins Konto-Menü oben rechts (Plan). Einmal-im-Jahr-Funktionen stehen nicht neben Täglichem. (Regel 9) - Reiter „Einstellungen“ (
mein-bereich.html:118): Einstellungen gehören ins Konto-Menü (Bedienregel 2: „Einstellungen und Abmelden im Konto-Menü, nicht in der Seitenleiste“). - Werbung: im Login-Bereich keine. Der Kunde hat Werbeflächen auf den öffentlichen Seiten verlangt (4.5), nicht hinter dem Login; dort stört sie das Vertrauen.
Zählwerte: gleichwertige Knöpfe erster Bildschirm: 1 je Zeile, höchstens 5 Zeilen; davon farbig nur der erste · Entscheidungen: 0 (die Liste ist sortiert) · Klicks bis „Stand gesehen“: 0 (steht da); bis Einladung zugesagt: 2.
Abweichung von B:
mein-bereich.html:95bis:110: Kopfzeile ohne Knopf und ohne „…“; Konto-Menü oben rechts (Bausteinkonto-menue, Plan).mein-bereich.html:112bis:119: Reiter neu: Bewerbungen · Postfach · Lebenslauf · Merkliste · Job-Alarme; „Übersicht“ und „Einstellungen“ raus.mein-bereich.html:124bis:135: Kacheln und grüne Box ersetzen durch „Jetzt wichtig“ + „Ihre Bewerbungen“ + „Gemerkt“.app.js:1054ff.meinBereich: Kachel-Zähler (data-kachel-bew,data-kachel-einl,data-kachel-merk) entfallen; stattdessen die Regelliste „Jetzt wichtig“.
3.6 Bewerbungen des Bewerbers (Liste und geöffnete Bewerbung)
Hauptaufgabe: Für jede Bewerbung den Stand in einem Satz verstehen und, wenn etwas zu tun ist, es dort tun.
Hauptknopf (Liste): keiner; die Zeilen sind der Weg. Hauptknopf (geöffnete Bewerbung): hängt vom Zustand ab: „E-Mail erneut senden“ · „Zusagen“ (Einladung) · „Antworten“ (Nachricht) · sonst keiner.
Liste, Aufbau:
- Überschrift „Bewerbungen“ mit Anzahl im Satz: „7 Bewerbungen“. Kein Erklärsatz „Status: Neu, Gesichtet, Eingeladen oder Absage“ (B
mein-bereich.html:137). (Regel 4) - Keine Filter-Pillen bis etwa 20 Bewerbungen: Die Gruppen „Offen“ und „Abgeschlossen (3)“ reichen (gruppieren statt filtern). Erst darüber Pillen „Alle · Offen · Abgeschlossen“. (Hick, Chunking)
- Zeilen, neueste zuerst (Plan). Zeile = Monogramm/Logo · Titel · Firma · Ort · „beworben vor 3 Tagen“ · Status-Chip rechts · Punkt bei ungelesener Nachricht. Abgeschlossene (Absage, Zurückgezogen, Stelle beendet) rutschen nach unten in eine eingeklappte Gruppe „Abgeschlossen (3)“. (Chunking, Verlust: Absagen stehen nicht täglich im Gesicht)
Status-Wörter aus Bewerbersicht (Abweichung vom Plan, begründet): Der Plan verlangt „Status-Namen überall gleich: Neu, Gesichtet, Eingeladen, Zusage, Absage, Zurückgezogen, Stelle beendet“. Für die Firma stimmt das. Für Ahmet ist „Neu“ unverständlich (neu für wen?) und „Gesichtet“ ein Amtswort. Die Zustände bleiben dieselben, nur die Beschriftung auf Bewerberseite ist aus seiner Sicht:
| Zustand (System) | Firma sieht | Bewerber sieht |
|---|---|---|
| Neu | Neu | Angekommen |
| Gesichtet | Gesichtet | Vom Betrieb geöffnet |
| Eingeladen | Eingeladen | Einladung zum Gespräch |
| Zusage | Zusage | Zusage |
| Absage | Absage | Absage |
| Zurückgezogen | Zurückgezogen | Zurückgezogen |
| Stelle beendet | Stelle beendet | Stelle nicht mehr offen |
Das ist keine zweite Benennung desselben Dings für dieselbe Person, sondern eine Übersetzung je Sicht; innerhalb einer Rolle bleibt jedes Wort überall gleich. (Erkennen, Lage 1.1: „ist meine Bewerbung angekommen?“ wird wörtlich beantwortet)
Geöffnete Bewerbung, Aufbau Handy:
- Zurück-Pfeil, Titel, Firma, Ort; Link „Stelle ansehen“.
- Verlauf als Zeitstrahl (neu gegenüber B, dort gibt es keine geöffnete Bewerbung): „Gesendet 12.10. ✓ · Vom Betrieb geöffnet 14.10. ✓ · Einladung ○“. Der Zeitstrahl ist die Antwort auf „was passiert jetzt?“: Er zeigt, welcher Schritt der nächste ist und wer ihn macht. (Gradient, Sichtbar, Jakob: Paketverfolgung)
- Wenn etwas zu tun ist, hier: Einladungs-Karte mit Datum, Uhrzeit, Ort/Link, Ansprechperson, drei Wege: „Zusagen“ (primär) · „Anderen Termin erbitten“ (Rand) · „Absagen“ (Textlink). Nach Zusage: „In Kalender speichern“ (Plan: Kalender-Datei) und „Erinnerung am Vortag“ als Satz. (Hick: ein farbiger Knopf; Verlust: Absagen ist leise)
- Nachrichten mit dem Betrieb: derselbe Verlauf wie im Postfach (ein Ding, ein Ort), Eingabe unten. Nach Absage/Rückzug schreibgeschützt mit einem Satz (Plan).
- Ihre Unterlagen: „Bewerbungsmappe (PDF)“ oder „lebenslauf.jpg“ zum Öffnen. Eingefrorener Stand (Plan). Kein Bearbeiten hier.
- Ganz unten, Textlink: „Bewerbung zurückziehen“ (10 Sekunden rückgängig, dann Mail an die Firma).
Absage, geöffnet: Überschrift „Absage von Schlosserei Peters“, darunter der Text der Firma (Vorlage), kein Rot, kein großes Symbol. Dann sofort: „Diese drei Stellen passen zu Ihrer Suche“ mit drei ähnlichen Stellen und „Bewerben“. (Peak-End, Verlust: der Blick geht nach vorn, bevor die Enttäuschung sich setzt; siehe 5.3)
Was bewusst NICHT auf den Bildschirm kommt:
- Notizen, Bewertung, „Chancen“-Anzeige, Lesebestätigung in Prozent: nichts, was Hoffnung oder Angst erzeugt, ohne dass der Bewerber etwas tun kann.
- Profil-Bearbeitung in der geöffneten Bewerbung (die Mappe ist eingefroren).
- Mehrere Knöpfe gleichwertig: Zusagen ist farbig, die anderen nicht.
Zählwerte: Liste: Knöpfe 0, Entscheidungen 1 (welche Zeile), Klicks bis Stand: 0 (Chip in der Zeile). Geöffnet mit Einladung: 1 farbiger Knopf, Klicks bis Zusage: 1.
Abweichung von B:
mein-bereich.html:136bis:140undapp.js:1060bis:1064: Zeile bleibt, Status-Wörter nach Tabelle, Abgeschlossene in eingeklappte Gruppe, Erklärsatz raus, Zeile klickbar auf die geöffnete Bewerbung (B verlinkt nur auf die Stelle).- Neu: geöffnete Bewerbung mit Zeitstrahl, Einladungs-Karte, Nachrichten, Unterlagen, Zurückziehen. In B existiert sie nicht.
app.js:1043STATUS: um „wartet“, „zusage“, „zurueckgezogen“, „beendet“ ergänzen, mit zwei Beschriftungen je Zustand (Firma/Bewerber).
3.7 Lebenslauf-Baukasten
Zum Livegang (bis Abschnitt 2b): Der Reiter „Lebenslauf“ zeigt nur zwei Karten: Persönliches (Name, Telefon, Wohnort; speichert jedes Feld sofort, die Bewerbungen lesen Name und Telefon von hier) und Ihre Datei („Ihre Datei: lebenslauf.jpg · Andere Datei“, die zuletzt hochgeladene Datei, die das Bewerben-Fenster in Schritt 2 vorwählt). Kein Fortschrittsbalken, keine Stationen. In 2b wächst der Reiter zum Baukasten unten.
Hauptaufgabe: Mit möglichst wenig Tippen die Mindestangaben vollständig bekommen; alles darüber ist freiwilliger Ausbau.
Hauptknopf: die nächste fehlende Mindestangabe („Telefon ergänzen“, „Erste Station eintragen“). Sind alle Mindestangaben da: „Mappe ansehen (PDF)“.
Aufbau Handy, erster Bildschirm:
- Überschrift „Lebenslauf“. Daneben nichts.
- Fortschritt als ein Balken mit Satz: „Mindestangaben: 2 von 3. Es fehlt: Telefon.“ Zählt nur die Mindestangaben (Plan): Name, Telefon, eine Station. Nicht „Profil 37 % vollständig“, das demotiviert und misst Unwichtiges. (Gradient: nahe Ziele motivieren; Zeigarnik: „es fehlt“ bleibt im Kopf)
- Hauptknopf laut oben.
- Bereiche als Karten, jede mit Titel, einer Zeile Inhalt (oder „noch leer“) und Pfeil; in zwei Gruppen mit Überschrift: „Für die Bewerbung nötig“: Persönliches (vorausgefüllt aus Konto: Name, E-Mail; Tesler) · Berufserfahrung · Mappe (Deckblatt-Wahl, PDF); „Mehr über Sie (freiwillig)“: Ausbildung · Qualifikationen und Nachweise (Schweißprüfung, Staplerschein …) · Sprachen · Führerscheine und Kenntnisse · Anlagen. Keine Karte fällt weg. Jede Karte öffnet sich als eigener Bildschirm am Handy, als Ausklapp am Desktop. (Chunking: 3 + 5 Karten statt 8 in einer Reihe; Offenlegung)
Innerhalb eines Bereichs (Beispiel Berufserfahrung):
- Liste der Stationen als Karten: Zeitraum · Position · Betrieb, Ort · eine Zeile Aufgaben. Sortiert nach Datum, neueste oben, automatisch (Plan). Ziehen am Desktop, Pfeile hoch/runter am Handy sichtbar an jeder Karte (B hat Griff und Pfeile,
app.js:1103ff.). Kein Erklärsatz dazu. (Jakob: Pfeile kennt jeder; Regel 4) - Knopf „Station hinzufügen“ (primär innerhalb des Bereichs) öffnet ein Formular in einer Spalte: Betrieb · Ort · Position · von · bis (Haken „bis heute“) · Aufgaben (freiwillig). Speichert jedes Feld sofort (Plan), Rückmeldung „Gespeichert“ 2 Sekunden. (Doherty)
- Beschriftungen in der Sprache des Nutzers, Feld-Hinweis „bitte auf Deutsch“ nur einmal oben im Bereich, nicht je Feld. (Hick, Regel 4)
Mappe (letzte Karte):
- Deckblatt: drei Kacheln Klar · Band · Ruhig (B
deckblaetter), „Klar“ vorausgewählt, damit niemand wählen muss. (Standard) - Knopf „Mappe ansehen (PDF)“ (Plan: 2 bis 6 Sekunden, Ladehinweis mit Satz „Wir setzen Ihre Mappe zusammen“). Das ist der IKEA-Moment: Das Ergebnis der eigenen Arbeit als fertige Mappe zu sehen, erhöht die Bindung an das Profil mehr als jede Erinnerungsmail. (Peak)
- Anschreiben-Vorlage: ein Textfeld „Vorlage für Ihre Nachricht an Betriebe“, vorausgefüllt, freiwillig, eingeklappt. (Offenlegung)
Was bewusst NICHT in den Baukasten kommt:
- Zwei Spalten am Handy (B
zwei-spalteninmein-bereich.html:160ff.): eine Spalte; die Mappe wird eine Karte. - „Bald verfügbar“-Knöpfe (B
data-folgtbei „Station hinzufügen“,mein-bereich.html:163; PDF-Hinweisapp.js:1125): Was es nicht gibt, erscheint nicht (Plan: Freischaltungen). - Foto als Pflicht oder prominent: freiwillig in Persönliches, ganz unten.
- Gehaltswunsch, Wunschort, Verfügbarkeit in der Fortschrittszählung: freiwillig, zählen nicht. (Gradient: das Ziel muss erreichbar sein)
- Prozentzahl.
Zählwerte: erster Bildschirm: 1 farbiger Knopf · Entscheidungen bis Mindestprofil: 0 (die Reihenfolge ist vorgegeben) · Klicks bis erste Station gespeichert: 3 (Karte Berufserfahrung, Hinzufügen, Felder + fertig).
Abweichung von B:
mein-bereich.html:160bis:181: Zwei-Spalten-Aufbau → Fortschritt + Karten in einer Spalte; Deckblatt und PDF in die Karte „Mappe“; „Klar“ vorausgewählt.mein-bereich.html:164: Erklärsatz zum Ziehen raus.mein-bereich.html:163,app.js:1121bis:1126: „Bald verfügbar“ raus, echte Funktion oder nicht sichtbar.- Neu: Fortschrittssatz mit Mindestangaben; Bereiche Persönliches, Ausbildung, Qualifikationen, Sprachen, Kenntnisse, Anlagen (Plan), in B nur Stationen.
3.8 Firmen-Übersicht (Startseite des Firmenbereichs)
Hauptaufgabe: Herr Peters sieht in drei Sekunden: wer ist neu, wem muss ich antworten, läuft meine Anzeige noch. Frau Lenz sieht dasselbe je Stelle.
Hauptknopf: der Knopf der ersten Zeile von „Heute zu tun“; er ist der einzige farbige Knopf. „Neue Stelle“ ist der eine Dauer-Knopf des Bereichs, als Rand-Knopf (btn-rand aus B): am Desktop rechts im Bereichs-Kopf, immer an derselben Stelle (Plan: Knopf, kein Menüpunkt; Jakob: Indeed/StepStone haben „Stelle veröffentlichen“ fest oben rechts), am Handy in der Leiste unten (Daumenzone, Klebeleiste aus B stelle.html:98). Ist „Heute zu tun“ leer, bleibt „Neue Stelle“ Rand-Knopf; bei der ersten Anmeldung ohne Stelle ist „Erste Stelle anlegen“ der farbige Knopf. (Restorff, Hick, Fitts)
Aufbau Handy, erster Bildschirm:
- Kopf mit Konto-Knopf (Initialen). Darin: Wechsel zu Bewerber oder anderer Firma · Einstellungen · Hilfe und Kontakt · Abmelden (Plan).
- Bereichs-Kopf: Firmenname (H1). „Neue Stelle“ steht am Handy als Rand-Knopf in der Leiste unten.
- Reiter: Stellen · Bewerbungen · Postfach · Firmenprofil · Team (Plan: 5). Die Übersicht ist die Startseite des Bereichs, kein eigener Reiter (Plan: „die Übersicht ist die Startseite des Bereichs und kein eigener Punkt“); zurück führt die Zeile „‹ Übersicht“ über der Überschrift jeder Unterseite und „Mein Bereich“ im Konto-Menü (Abschnitt 4). Bewerbungen und Postfach mit Zahl-Kreis bei Neuem. (Hick: 5 statt 6 + 6)
- „Heute zu tun“, höchstens 5 Zeilen, nach Dringlichkeit:
- „3 neue Bewerbungen, davon 2 für Schweißer MAG.“ → „Ansehen“ (öffnet Bewerbungen, Filter Neu)
- „Jonas Weber wartet seit 3 Tagen auf eine Antwort.“ → „Antworten“ (öffnet die Bewerbung) (Verlust: die Tage zählen sichtbar hoch)
- „Stelle „Elektroniker“ läuft in 3 Tagen ab.“ → „Verlängern“ (sofort, Toast, kein Formular) (Verlust)
- „2 ungelesene Nachrichten.“ → „Postfach“
- „Ihr Firmenprofil hat noch kein Logo. Stellen mit Logo werden häufiger geöffnet.“ → „Logo hochladen“ (nur, solange kein Logo; der zweite Satz nur, wenn die Zahl belegt ist, sonst entfällt er)
- „Stelle „Schweißer“ wartet auf Prüfung durch Bululu, in der Regel bis morgen. Bewerber sehen sie schon.“ (Information, kein Knopf; erste Stelle) (Sichtbar)
Nach dem Livegang (Baureihenfolge 2b.9): Hat ein Kollege die Aufgabe schon geöffnet, sagt die Zeile das: „… (Frau Lenz hat das vor 5 Minuten geöffnet)“; ebenso die geöffnete Bewerbung (3.10). Admin und Recruiter teilen den Eingang (Plan), so antwortet niemand doppelt. Eine Rückmeldung, keine neue Funktion. (Sichtbar)
- Leer: „Nichts zu tun. Ihre 3 Stellen laufen, die nächste bis 21.11.“ (ein Satz mit der nächsten Frist, kein Knopf; „Neue Stelle“ bleibt als Rand-Knopf erreichbar).
Darunter:
- „Ihre Stellen“, kompakt: je Stelle eine Zeile Titel · „noch 12 Tage“ · „4 Bewerbungen (2 neu)“, klickbar auf die Stelle im Firmenbereich. Höchstens 5, dann „Alle Stellen“. (Erkennen: die Zahl steht am Ding, nicht in einer Kachel)
- Premium-Hinweis, ein ruhiger Kasten ganz unten: „Mehr Sichtbarkeit: Top-Stellen stehen oben in der Liste.“ + „Premium anfragen“ (Rand). Einmal wegklickbar („Nicht mehr zeigen“); erscheint nie, wenn Premium aktiv ist (Plan). B hat ihn grün in der Mitte der Übersicht (
firmen-bereich.html:134bis:138). (Restorff: Werbung in eigener Sache darf nicht der auffälligste Block sein)
Erste Anmeldung ohne Stelle: Statt To-do-Liste ein Block mit drei Schritten als Haken-Liste: „Konto angelegt ✓ · Erste Stelle anlegen ○ · Bewerbungen empfangen ○“ und einem großen Knopf „Erste Stelle anlegen“. (Zeigarnik, Gradient: 1 von 3 ist geschafft)
Desktop: „Heute zu tun“ links breit, „Ihre Stellen“ rechts, Premium unten. (F-Muster)
Was bewusst NICHT auf den Bildschirm kommt:
- Drei Zahlen-Kacheln „3 aktive Stellen · 2 neue Bewerbungen · 1 läuft bald ab“ (
firmen-bereich.html:129bis:133): werden zu Sätzen mit Knopf. - Reiter „Übersicht“ und „Neue Stelle“ (
firmen-bereich.html:117,:120): Übersicht ist die Startseite, Neue Stelle ist ein Knopf (Plan). - „…“-Menü mit Werbung planen · Nutzer verwalten · Rechnungen · Statistiken · Pakete · Abmelden (
firmen-bereich.html:104bis:112): Nutzer verwalten → Reiter „Team“; Abmelden → Konto-Menü; Werbung planen → öffentlich auf „Für Arbeitgeber“ (Plan); Rechnungen, Statistiken, Pakete → gibt es nicht, also nicht sichtbar (Plan: Freischaltung aus = verschwindet). - Statistik: keine Kurven, keine Vergleiche, keine Statistikseite bis zur Freischaltung (Plan). Die Aufrufzahl als einfache Zahl steht an der geöffneten Stelle (3.9) und in der Ablauf-Mail F08, nicht hier.
Zählwerte: gleichwertige Knöpfe erster Bildschirm: 1 farbig (erste To-do-Zeile) · Rand: „Neue Stelle“ und die Knöpfe der übrigen Zeilen · Entscheidungen: 0 · Klicks bis „neue Bewerbung geöffnet“: 2 (Ansehen, Zeile).
Abweichung von B:
firmen-bereich.html:96bis:113: Kopfzeile ohne „…“, „Neue Stelle“ als Rand-Knopf (am Handy in der Leiste unten); Konto-Menü oben rechts.firmen-bereich.html:116bis:123: Reiter neu: Stellen · Bewerbungen · Postfach · Firmenprofil · Team.firmen-bereich.html:128bis:139: Kacheln + grüne Box → „Heute zu tun“ + „Ihre Stellen“ + leiser Premium-Kasten.- Neu: Zustand „erste Anmeldung ohne Stelle“.
3.9 Stellen der Firma
Hauptaufgabe: Jede Stelle mit Zustand, Restlaufzeit und Bewerbungszahl auf einen Blick; die eine passende Handlung je Stelle ohne Nachdenken.
Hauptknopf: keiner farbig; „Neue Stelle“ als Rand-Knopf wie überall im Bereich (Desktop oben rechts, Handy in der Leiste unten, 3.8). Je Zeile genau ein Rand-Knopf, abhängig vom Zustand.
Aufbau Handy:
- Überschrift „Stellen“ (ohne „Jede Anzeige läuft 30 Tage“, B
firmen-bereich.html:141; die Restlaufzeit steht an jeder Zeile). (Regel 4) - Gruppen statt Filter-Pillen (Plan: Sortierung nach Zustand). Gruppenüberschriften in dieser Reihenfolge, leere Gruppen fehlen:
- Braucht Aufmerksamkeit: Nachbessern, läuft ab (≤ 5 Tage), pausiert seit höchstens 14 Tagen (abgelaufen, jederzeit verlängerbar), Entwurf, wartet auf Prüfung, gesperrt
- Aktiv
- Pausiert
- Beendet (eingeklappt, mit Anzahl)
Für Herrn Peters mit drei Stellen ist das eine kurze Liste ohne Bedienelement; für Frau Lenz mit fünfzehn Stellen bleibt oben, was brennt. Filter-Pillen „Alle · Aktiv · Läuft ab · Pausiert · Beendet“ (B :142 bis :148) erscheinen erst ab 8 Stellen, dazu ein Suchfeld nach Titel. (Hick, Chunking, Offenlegung)
- Zeile: Titel (Link in die Stelle, Firmen-Sicht) · Ort · Art · Zustand als Chip · „noch 12 Tage“ (pausiert: der Chip sagt „Pausiert seit 3.10.“, kein zweiter Text) · „4 Bewerbungen (2 neu)“ als Text (nur im Zustand „aktiv“ ist sie der eine Knopf, siehe unten) · rechts ein Rand-Knopf je Zustand:
- läuft ab / pausiert → „Verlängern“ (sofort, Toast „30 Tage verlängert“, kein Dialog; ohne zeitliche Grenze)
- Entwurf → „Weiter bearbeiten“
- wartet auf Prüfung → kein Knopf, Chip-Text „Prüfung, bis morgen“
- Nachbessern → „Bearbeiten“, Chip „Bitte ergänzen: {grund}“
- gesperrt → kein Knopf, Chip „Gesperrt“ mit Grund
- aktiv → „Bewerbungen (2 neu)“ ist der Knopf
- beendet → „Erneut schalten“ (kopiert als neue Stelle)
Alles andere (Bearbeiten, Kopieren, Beenden, Löschen nur für Admins) hinter „…“ an der Zeile. „Premium anfragen“ steht nur im „…“ der geöffneten Stelle und im Premium-Kasten der Übersicht (Regel 8). (Hick: eine Handlung, der Rest auf Klick; Shneiderman: Rückgängig bei Beenden/Löschen 10 s)
Geöffnete Stelle (Firmen-Sicht), das „ein Ding, ein Ort“-Blatt: Kopf wie öffentlich, darunter Reihe: Zustand · Restlaufzeit · Aufrufe (ab Tag 1 gezählt, Plan; Zahl ohne Kurve) · Bewerbungen. Knöpfe: „Bearbeiten“ (Rand) · „Verlängern“ (nur wenn ≤ 5 Tage, Rand) · „…“ (Kopieren, Beenden, Premium anfragen, Als Top-Stelle, wenn Premium aktiv und ein Top-Platz frei ist, Löschen). Darunter die Bewerbungen dieser Stelle als Liste (3.10). (Plan: „Alles, was mit einer Stelle zu tun hat, erreicht man von der Stelle aus“)
Desktop: gleiche Gruppen, Zeilen breiter (Zustand und Zahl in Spalten). Keine Tabelle mit zehn Spalten.
Was bewusst NICHT auf den Bildschirm kommt:
- Filter-Pillen bei wenigen Stellen (siehe oben).
- Zwei Knöpfe je Zeile.
- Statistiken, Pakete, Rechnungen.
- „Als Top-Stelle“ sichtbar ohne Premium (Plan: Haken erst nach Freischaltung).
Zählwerte: gleichwertige Knöpfe: 1 oben + 1 je Zeile · Entscheidungen: 0 · Klicks bis „verlängert“: 1.
Abweichung von B:
firmen-bereich.html:141: Erklärsatz raus.firmen-bereich.html:142bis:148: Pillen → Gruppen; Pillen nur ab 8 Stellen.app.js:1144bis:1153stellenZeichnen: Zustände Entwurf, wartet auf Prüfung, beendet ergänzen; Knopf je Zustand; „…“-Menü je Zeile; Bewerbungszahl mit „(n neu)“ als Text, im Zustand „aktiv“ als Knopf; Titel-Link auf die Firmen-Sicht der Stelle, nicht aufstelle.html(B:1148).- Neu: geöffnete Stelle in Firmen-Sicht (in B nicht vorhanden).
3.10 Bewerbungen der Firma (Liste und geöffnete Bewerbung)
Hauptaufgabe: Neue Bewerbungen schnell sichten und mit einer Handlung (Einladen oder Absagen) beantworten, ohne Angst, etwas Falsches abzuschicken.
Hauptknopf (Liste): keiner; die Zeilen sind der Weg. Hauptknopf (geöffnete Bewerbung): „Einladen“.
Liste, Aufbau Handy:
- Überschrift „Bewerbungen“, Satz „12 Bewerbungen, 3 neu“.
- Filter in einer Zeile: Auswahl „Stelle: Alle ▾“ und Pillen „Neu · Offen · Alle“ (Standard „Offen“ = Neu + Gesichtet + Eingeladen). Mehr nicht; die Liste ist fest nach „neueste zuerst“ sortiert (ungelesene und „ohne Antwort“ stehen ohnehin oben), am Desktop über die Spaltenköpfe umsortierbar, am Handy ohne Sortierwahl. Kein Sortier-Knopf. (Hick: zwei sichtbare Steuerungen; Frau Lenz braucht „Stelle“, Herr Peters braucht nichts, der Standard reicht)
- Zeile: Initialen-Kreis · Name · Stelle · „heute“ · Status-Chip · Punkt bei ungelesener Nachricht · leise Warnung „seit 3 Tagen ohne Antwort“, wenn Zustand Neu/Gesichtet älter als 2 Tage. (Verlust: Herr Peters sieht, was ihm wegläuft; Erkennen)
- Kein Bedienelement in der Zeile. B hat je Zeile ein Status-Auswahlfeld mit vier Einträgen und ein Notiz-Textfeld (
app.js:1181bis:1183,firmen-bereich.html:151bis:154). Das sind bei zwölf Bewerbungen 48 Wahlmöglichkeiten und zwölf Textfelder auf einem Bildschirm, und jede Status-Änderung löst sofort eine Mail aus (app.js:1187), ohne Vorschau, ohne Rückgängig. Genau die Angst aus Lage 1.2. (Hick, Shneiderman: Fehler vermeiden)
Geöffnete Bewerbung, Aufbau Handy (Reihenfolge = Reihenfolge der Entscheidung):
- Zurück · Name · Stelle · „beworben vor 2 Tagen“ · Status-Chip. Öffnen durch einen Nutzer der Firma setzt „Gesichtet“ ohne Mail; Öffnen durch die Verwaltung setzt nichts (Plan). Nach dem Livegang (2b.9): Hat eine Kollegin oder ein Kollege die Bewerbung kurz vorher geöffnet, steht darunter „Frau Lenz hat das vor 5 Minuten geöffnet“ (wie 3.8).
- Kontakt-Zeile: Telefon (antippen ruft an), E-Mail, beide immer aktuell aus dem Konto des Bewerbers (Plan: Bewerbungsmappe); steht in der Mappe eine andere Nummer, steht daneben „aktuelle Nummer“. Herr Peters ruft an, bevor er schreibt; das ist sein Weg. (Jakob: Handwerk telefoniert)
- Lebenslauf: am Handy und am Desktop gleich: ein großer Rand-Knopf „Lebenslauf öffnen (PDF)“ und darunter, falls aus dem Profil, die Stationen als Text (keine PDF nötig zum Überfliegen). Eine eingebettete PDF-Ansicht am Desktop nur, wenn die Mappe eine eigene Datei ist und es keinen Text gibt. Nachricht des Bewerbers (Anschreiben) darüber, wenn vorhanden.
- Unten fest (Handy) / rechts oben (Desktop): Handlungsleiste je Zustand:
- Neu/Gesichtet: „Einladen“ (orange) · „Absagen“ (Rand)
- Eingeladen: „Zusage“ (orange) · „Neuer Termin“ (Rand) · „Absagen“ (Text)
- Zusage/Absage/Zurückgezogen: keine Leiste, nur Chip mit Datum.
„Zusage“ vor einer Einladung ist selten; sie liegt im Zustand Neu hinter „…“. Der Plan nennt drei Knöpfe; zwei sichtbare reichen im Normalfall. (Hick, Offenlegung)
Jeder Knopf öffnet ein Fenster mit der Vorlage (Plan): Einladen = Datum · Uhrzeit · Ort oder Link · Ansprechperson (Standard: ich) · Text vorausgefüllt · „Einladung senden“. Absagen = Text vorausgefüllt (freundlich, Bedienregel 5) · „Absage senden“. Nach Senden: Toast „Absage gesendet. Rückgängig“ 10 Sekunden; die Mail geht erst danach raus (Plan). (Shneiderman: Rückgängig statt Rückfrage; Tesler: Datum und Ansprechperson vorausgefüllt)
- Nachrichten mit dem Bewerber (derselbe Verlauf wie im Postfach), Eingabe mit „Senden“, „Vorlage einfügen“ als kleiner Textknopf. (Regel 8)
- Notizen fürs Team: ein Textfeld, Beschriftung „Notiz (nur für Ihr Team)“, speichert sofort. Unten, weil Notiz nach der Entscheidung kommt. (Doherty)
- Pfeile „Vorherige / Nächste Bewerbung“ am Ende und per Tastatur (← →), innerhalb des aktuellen Filters. Für Frau Lenz der wichtigste Komfort: 40 Bewerbungen ohne Rückweg in die Liste. (Shneiderman: Abkürzungen für Vielnutzer)
Was bewusst NICHT auf den Bildschirm kommt:
- Status als Auswahlfeld (B). Ein Zustand wird durch eine Handlung erreicht, nicht gesetzt. Das verhindert „Absage“ als Versehen und macht jede Mail bewusst. (Shneiderman)
- Notizfeld und Status in der Liste.
- Bewertungssterne, Ranking, „Match-Score“: nicht verlangt, und falsch bei einem Betrieb mit zwölf Leuten.
Zählwerte: Liste: sichtbare Steuerungen 2, Entscheidungen 1 (Zeile), Klicks bis geöffnet: 1. Geöffnet: 1 farbiger + 1 Rand-Knopf, Klicks bis Einladung gesendet: 2 (Einladen, Senden; Datum eintragen dazwischen).
Abweichung von B:
firmen-bereich.html:151bis:154,app.js:1176bis:1194: Status-Auswahl und Notiz aus der Zeile raus; Zeile klickbar; Filter Stelle + Pillen; Warnung „seit n Tagen ohne Antwort“.- Neu: geöffnete Bewerbung mit Kontakt, Lebenslauf, Handlungsleiste, Nachrichten, Notiz, Pfeile. In B gibt es keine geöffnete Bewerbung.
app.js:1187Toast „Die Person wird per E-Mail informiert“ sofort → Fenster mit Vorlage, Senden, 10 s Rückgängig.firmen-bereich.html:152Erklärsatz raus.
3.11 Stelle anlegen
Hauptaufgabe: Eine vollständige, gut lesbare Anzeige in zehn Minuten veröffentlichen, auch für jemanden, der noch nie eine geschrieben hat.
Hauptknopf: „Veröffentlichen“, unten fest am Handy, am Desktop unter dem Formular; davor steht der Fortschrittssatz („Noch 2 Pflichtangaben: Aufgaben, Ansprechperson“).
Aufbau, eine Spalte am Handy, am Desktop Formular links und Live-Vorschau rechts (B inserat-vorschau):
- Überschrift „Neue Stelle“, rechts klein „Entwurf gespeichert 12:03“ (sobald das erste Feld gefüllt ist; Plan: Zustand Entwurf). Kein Knopf „Zwischenspeichern“ (B
firmen-bereich.htmlFormular, Knopf-Reihe): das System speichert selbst. (Tesler, Doherty, Sichtbar) - Block 1 „Die Stelle“ (Chunking, 5 Felder): Titel mit (m/w/d) (Beispiel als Platzhalter) · Fachbereich (Auswahl) · Beschäftigungsart (4 Pillen, Standard Vollzeit) · Arbeitsort mit PLZ (Standard: Firmensitz, Tesler) · Erforderliche Deutschkenntnisse (3 Pillen, Standard „Grundkenntnisse“; der Standard ist bewusst niedrig, damit Firmen die Hürde nicht gedankenlos hoch setzen; ein Filter wie die Beschäftigungsart).
- Block 2 „Der Text“ (4 Felder): Aufgaben (Liste, je Zeile ein Punkt) · Das brauchen Sie (nötig) · Gut, aber nicht nötig (freiwillig, eingeklappt) · Das bieten wir (freiwillig, vorausgefüllt aus der letzten Stelle oder dem Firmenprofil). „Text von Bululu KI“ als Textknopf über dem Block, nur wenn freigeschaltet (Plan: Standard aus).
- Block 3 „Bedingungen und Bewerbung“: Gehaltsspanne (empfohlen, zwei Felder, daneben die Einheit als Pillen mit „pro Monat“ vorgewählt; freiwillig, bis die Verwaltung sie zur Pflicht macht, Plan) · Start (freiwillig) · Ansprechperson (Auswahl aus dem Team, Standard: ich; ob ihr Telefon in der Anzeige steht, legt die Person einmal unter Team fest, nicht jede Stelle) · darunter zugeklappt „Weitere Angaben (freiwillig)“ mit Befristung, Sozialversicherung (vorausgewählt), Homeoffice (Ja/Nein, Standard Nein) und Bewerbungsweg (Standard „über Bululu“, Alternative „eigene Karriereseite“ mit Adressfeld, das erst auf Wahl erscheint); die Vorgaben passen für die meisten Stellen, wer etwas anderes braucht, klappt auf. (Standard, Offenlegung, Chunking)
- Haken „Als Top-Stelle“ nur, wenn Premium freigeschaltet und ein Top-Platz frei ist; daneben „2 von 3 Top-Plätzen belegt“; sind alle belegt, fehlt der Haken (Plan; B zeigt ihn immer,
firmen-bereich.html:179). - Fortschrittssatz + „Veröffentlichen“. Am Handy daneben ein Rand-Knopf „Vorschau“, der die Anzeige bildschirmfüllend zeigt, wie Bewerber sie sehen; am Desktop ist die Vorschau ständig rechts (B). (Gradient; Sichtbar)
- Nach Veröffentlichen: Seite der Stelle in Firmen-Sicht mit Toast „Online. Läuft bis 21.11.“; bei erster Stelle einer neuen Firma: „Online für Bewerber. Bululu prüft sie bis morgen, dann erscheint sie auch bei Google und im Job-Alarm.“ (Sichtbar: der Wartezustand hat einen Grund und ein Ende)
Pflichtfelder markieren: Freiwilliges trägt „(freiwillig)“, Pflicht ist unmarkiert (B macht das so, bleibt). Fehler beim Veröffentlichen: am Feld, in einem Satz („Hier fehlt noch die Ansprechperson“), und das erste fehlende Feld bekommt den Fokus. (Bedienregel 4)
Was bewusst NICHT auf den Bildschirm kommt:
- Import-Kasten „Vorhandene Anzeige übernehmen (Import per Link)“ als erstes Element (
firmen-bereich.html:157bis:165): zum Livegang gibt es den Import nicht (Plan: nach dem Livegang). Wenn er kommt, steht er als Textlink „Anzeige von einer anderen Seite übernehmen“ über dem Formular, nicht als eigener Block, denn zwei Startwege verdoppeln die erste Entscheidung. (Hick) - Ein einziges großes Textfeld „Anzeigentext: Aufgaben, Profil, Angebot“ (B
n-text): daraus entstehen schlechte Anzeigen und die Stelle kann nicht strukturiert anzeigen. Drei Felder, je eines pro Abschnitt. (Chunking; das ist die Grundlage für 3.3 Punkt 7) - Knopf „Zwischenspeichern“.
- Kategorie-Auswahl mit 30 Einträgen: Fachbereiche sind kurz (Plan).
Zählwerte: gleichwertige Knöpfe: 1 (Veröffentlichen) + Vorschau (Rand, nur Handy) · Entscheidungen: 2 (Fachbereich, Deutschkenntnisse; alles andere hat einen Standard oder ist Text) · Pflichtfelder zu tippen: 4 (Titel, Aufgaben, Das brauchen Sie, Ort nur wenn abweichend) · Klicks bis online: 1 nach dem Ausfüllen.
Abweichung von B:
firmen-bereich.html:157bis:165: Import-Kasten raus (zum Livegang).firmen-bereich.html:166bis:184: Formular in drei Blöcke; Anzeigentext → Aufgaben / Das brauchen Sie / Gut, aber nicht nötig / Das bieten wir; Felder Deutschkenntnisse, Gehalt, Start, Homeoffice, Bewerbungsweg, Ansprechperson ergänzen (Plan); „Zwischenspeichern“ raus, Autosave-Zeile oben; Top-Stelle-Haken nur mit Premium.arbeitgeber.html:188bis:219(öffentliches „Ausprobieren“-Formular): dieselbe Blockstruktur, Knopf „Weiter zur Registrierung“ nimmt die Eingaben als Entwurf mit (Zeigarnik: angefangene Anzeige wird nach der Registrierung fortgesetzt, nicht neu getippt).
3.12 Postfach (Bewerber und Firma)
Hauptaufgabe: Ungelesenes finden und antworten. Das Postfach ist die Liste aller Verläufe; jeder Verlauf gehört zu genau einer Bewerbung (Plan).
Hauptknopf: im Verlauf „Senden“; in der Liste keiner.
Aufbau Handy (einspaltig, Plan):
- Überschrift „Postfach“, Satz „2 ungelesen“. Ein Umschalter „Nur ungelesene“ (Pille), kein Suchfeld unter 10 Verläufen. (Hick, Offenlegung)
- Liste, neueste Nachricht zuerst, ungelesene fett mit Punkt: Firma-Seite: Initialen · Name · Stelle · letzte Zeile · Zeit. Bewerber-Seite: Logo · Firma · Stelle · letzte Zeile · Zeit. (Jakob: jede Messenger-App)
- Tippen öffnet den Verlauf als eigener Bildschirm: Kopf mit Name/Firma, Stelle als Link „Zur Bewerbung“, Zurück-Pfeil. Blasen (B
blase, eigene rechts). Eingabe unten fest mit „Senden“; Anhang-Knopf nur auf Bewerberseite (Plan: Anhänge nur vom Bewerber). Firma: Textknopf „Vorlage“ in der Eingabezeile. Nach Absage/Rückzug: Eingabe ersetzt durch einen Satz „Diese Bewerbung ist abgeschlossen. Nachrichten sind nicht mehr möglich.“ (Plan) - Leer: Bewerber „Hier erscheinen Nachrichten von Betrieben, bei denen Sie sich beworben haben.“ Firma: „Hier erscheinen Nachrichten Ihrer Bewerber. Schreiben Sie ihnen aus der Bewerbung heraus.“ + „Bewerbungen“ (Rand).
Desktop: zweispaltig wie B (chat): Liste links (ein Drittel), Verlauf rechts; erster ungelesener Verlauf vorausgewählt. (Jakob: Mail-Programm)
Was bewusst NICHT ins Postfach kommt:
- Nachrichten an Personen ohne Bewerbung, freie Chats, Gruppen: der Verlauf hängt an der Bewerbung (Plan). Das hält die Liste kurz und jede Nachricht hat Kontext.
- Online-Anzeige, „tippt gerade“, Lesebestätigung mit Uhrzeit: Es ist kein Echtzeit-Chat (Plan, Kundenliste), und für Ahmet wäre „gelesen 14:02, keine Antwort“ ein Angstauslöser. Nur „gelesen“ als stiller Zustand im System.
- Suche und Filter unter 10 Verläufen.
Zählwerte: Liste: 1 Umschalter · Entscheidungen: 1 (Verlauf) · Klicks bis Antwort gesendet: 2 am Handy (Verlauf, Senden), 1 am Desktop.
Abweichung von B:
firmen-bereich.html:196bis:211: Reiter heißt „Postfach“ statt „Nachrichten“ (Plan, ein Begriff überall); Liste mit Ungelesen-Punkt, „Nur ungelesene“, „Zur Bewerbung“-Link im Kopf, Vorlage-Knopf, Schreibschutz-Zustand, Leerzustand. Am Handy einspaltig (B zeigt beide Spalten,chat).- Bewerberseite: in B gibt es kein Postfach; neu nach demselben Baustein.
3.13 Verwaltung-Übersicht
Ausgearbeitet in 3.14.
3.14 Verwaltung-Übersicht („Heute zu tun“)
Hauptaufgabe: In zehn Minuten alles erledigen, was eine Frist hat; sehen, was wegläuft; erst danach Zahlen.
Hauptknopf: der Knopf der ersten Zeile von „Heute zu tun“ (meist „Prüfen“). Kein Dauer-Knopf im Bereichs-Kopf: Die Verwaltung legt nichts von sich aus an (Plan: nur im Supportfall, über Firmen und Nutzer).
Aufbau Desktop (1440 × 900), erster Bildschirm:
- Kopf: Logo · Hauptmenü Prüfen · Anfragen · Firmen und Nutzer · Werbung · Inhalte · Einstellungen (letzter nur Super Admin) · rechts Konto-Knopf (Initialen; darin: Mein Konto mit Kennwort, zweitem Faktor und Benachrichtigungen je Art: Prüfen, Meldungen, Anfragen, Betrieb, Betrieb nur Super Admin · Abmelden). Zahl-Kreise an Prüfen und Anfragen nur bei offenen Posten, an Werbung nur bei „Motiv fehlt“ oder „Anfrage ohne Angebot“. (Jakob; Bedienregel 2: Zahl nur, wo wirklich etwas wartet)
- Bereichs-Kopf: „Verwaltung“ als H1, daneben klein der Rollenname („Super Admin“ oder „Verwaltung“), damit bei zwei Rollen klar ist, wer gerade handelt. Rechts kein Knopf.
- „Heute zu tun“, höchstens 5 Zeilen, die sechste wird „und 4 weitere“ mit Link in den zuständigen Reiter (Chunking). Reihenfolge fest: überfällig → Frist heute → Frist morgen → ohne Frist. Jede Zeile = Subjekt · Zustand · seit wann · Frist · genau ein Knopf:
- „Neue Firma „Rohrbau Kessler“ wartet seit 20 Stunden auf Prüfung. Frist heute 9:00, danach automatisch frei.“ → „Prüfen“
- „Anzeige „Fahrer gesucht“ (Transporte Ilic) gemeldet, Grund: unseriös, seit 2 Stunden.“ → „Ansehen“
- „3 Kontaktanfragen unbeantwortet, älteste seit 2 Tagen (Bewerber, Thema Kennwort).“ → „Anfragen“
- „Premium-Anfrage von Induserv GmbH, seit gestern.“ → „Entscheiden“
- „Werbeanfrage von Werkzeughaus Kemper, seit 3 Stunden. Zusage: Angebot binnen 1 Werktag.“ → „Kampagne anlegen“
- „Kampagne Arbeitsschutz Wenning startet Montag, Motiv fehlt noch.“ → „Motiv anfordern“
- Nur Super Admin: „Mail-Warteschlange: 12 Mails seit 1 Stunde nicht zugestellt.“ → „Ansehen“ · „Übersetzung von 4 Anzeigen fehlgeschlagen.“ → „Erneut starten“ · „Bundesagentur: Übertragung gestern 3:00 fehlgeschlagen.“ → „Ansehen“ · „Virenprüfung gestört seit 40 Minuten, 3 Dateien gesperrt.“ → „Ansehen“
- Nur 3BS, einmalig: „Ratgeber „Lebenslauf“ seit 14 Tagen Entwurf.“ → „Weiter bearbeiten“ (Zeigarnik)
Überfällige Zeilen stehen oben und tragen das Wort „überfällig“ im Satz, nie nur Farbe (Bedienregel 7). Nach dem Livegang (2b.9): Die Zeile einer Aufgabe, die ein Kollege gerade geöffnet hat, sagt das: „…“. (Verlust, Sichtbar, Erkennen)
- Leer: „Nichts offen. Nächste Frist: Firma „Lackiererei Voss“ bis morgen 9:00.“ Ohne nächste Frist: „Nichts offen. Neue Aufgaben erscheinen hier, und Sie bekommen eine E-Mail.“ (Sichtbar: wer den nächsten Zug hat)
- Zahlen, eine ruhige Reihe aus fünf Werten mit Veränderung zur Vorwoche in Worten: Arbeitgeber auf der Plattform · Bewerber auf der Plattform (Fragebogen 1.5, zuerst) · aktive Stellen · Bewerbungen diese Woche · Aufrufe diese Woche (eigene Zählung, Plan). Je Wert ein Satz darunter, der die Zahl einordnet, wenn es ihn gibt („davon 3 neu diese Woche“). Keine Kurve zum Start. Die Monatswerte (C.5) sind kein zweiter Zahlenblock: nur für den Super Admin ein Textlink „Monatswerte“ unter der Reihe, der je Kennzahl einen Satz aufklappt; 3BS sieht nur die Reihe. (Chunking, Regel 3: Zahlen unten)
Darunter:
- „Seit Ihrem letzten Besuch“ (erst nach dem Livegang, Baureihenfolge 2b.9; für Herrn Schiffke die wichtigste Zeile), eingeklappt mit Überschrift und Datum: „Seit 3.10.: 4 Firmen geprüft (3 vom Betreiber, 1 automatisch), 6 Anfragen beantwortet, 1 Kampagne gestartet.“ Darin die Protokoll-Einträge dieses Zeitraums. Für den Super Admin dasselbe Element mit „seit gestern“. Das ist das „Zuletzt passiert“ aus 3.13, nur auf die Person bezogen. (Zeigarnik umgekehrt: Was andere erledigt haben, muss er nicht nachhalten; Sichtbar)
- Nichts weiter.
Handy (390 × 844): dieselbe Reihenfolge einspaltig; Hauptmenü im Burger, Zahl-Kreis am Burger, wenn Prüfen oder Anfragen offen sind. Verwaltung am Handy ist der Ausnahmefall (Mail unterwegs lesen, „Prüfen“ tippen), darum dieselben Bausteine, keine eigene Handy-Logik. Zahlen-Reihe wird 2 + 3 Karten.
Nur auf Klick: Konto-Menü, „Seit Ihrem letzten Besuch“, „und 4 weitere“.
Was bewusst NICHT auf den Bildschirm kommt:
- Diagramme, Vergleichs-Kacheln, Karte, „Top-Firmen“.
- Schnellzugriffe „Stelle anlegen“, „Nutzer anlegen“, „Mail an alle“ (Plan: Verwaltung handelt nur im Supportfall mit Grund).
- Technische Zeilen für die Stufe Verwaltung: Sie kann nichts davon beheben; eine Zeile, die man nicht ändern kann, ist eine Mahnung (Regel aus Abschnitt 4 des Vorbilds).
- Eine Zeile je Kontaktanfrage: Anfragen werden gebündelt („3 Anfragen, älteste …“), sonst füllen sie die fünf Plätze. Prüfungen und Meldungen bleiben einzeln, weil jede eine eigene Frist hat.
- Suchfeld über alles: Suche liegt in „Firmen und Nutzer“ und ist von dort einen Klick entfernt; auf der Startseite wäre sie ein zweiter Einstieg neben der Aufgabenliste (Regel 8).
Zustände:
- *Leer:* siehe 4.
- *Zahlen nicht ladbar:* letzte bekannte Werte mit „Stand gestern 18:00“, kein roter Kasten.
- *Keine Rechte:* nicht möglich, die Übersicht sehen beide Rollen; Betriebs-Zeilen fehlen für 3BS einfach.
- *Zweiter Faktor nicht eingerichtet:* keine Übersicht, sondern die Einrichtungs-Seite (Plan: Verwaltung öffnet sich nur mit bestätigtem Faktor). Satz: „Für die Verwaltung ist der zweite Faktor Pflicht, weil hier Bewerberdaten liegen.“
- *Aus einer Mail gekommen:* nach Anmeldung und Faktor landet man in der Aufgabe, nicht hier (Plan: „Sitzung abgelaufen → danach zurück an dieselbe Stelle“).
Zählwerte: gleichwertige Knöpfe: 1 je Zeile, farbig nur der erste · Entscheidungen: 0 (sortiert nach Frist) · Klicks bis erste Prüfung geöffnet: 1.
Abweichung von B: In B gibt es keine Verwaltung. Sie entsteht aus B-Bausteinen: Kopf und Reiter wie firmen-bereich.html:116 bis :123 (Reiterleiste), Zeilen wie die Stellenzeile (app.js stellenZeichnen :1144 ff.) ohne Herz und Monogramm, Chips, btn-primary/btn-rand, Toast, box. Neu gegenüber Vorbild 3.13: Rollenname im Bereichs-Kopf, Kollegen-Hinweis in der Zeile, „Seit Ihrem letzten Besuch“ statt „Zuletzt passiert“, Bündelung der Kontaktanfragen.
3.15 Prüfen (Liste · neue Firma · gemeldete Anzeige)
Hauptaufgabe: Jede neue Firma binnen einem Werktag und jede Meldung am selben Tag entscheiden, mit so wenig Nachschlagen wie möglich; jede Entscheidung erklärbar (Protokoll) und für die Firma verständlich (Mail).
Hauptknopf (Liste): „Prüfen“ je Zeile. Hauptknopf (geöffnet): „Freigeben“ (neue Firma) bzw. „Erledigt, bleibt online“ (Meldung).
Liste, Aufbau:
- Überschrift „Prüfen“, Satz „4 offen, 1 überfällig“.
- Pillen Alle · Neue Firmen · Meldungen nur, wenn beide Arten vorkommen; sonst keine Pille (Hick). Sortierung fest: älteste zuerst (Plan), überfällige ganz oben. Keine Sortierwahl.
- Zeile: Art-Chip („Neue Firma“ / „Meldung“) · Firma · Stelle (Titel) · Ort · „seit 20 Std.“ · Frist als Satz („heute 9:00“, „überfällig seit 2 Std.“, bei Meldungen „heute“) · bei Meldungen die Zahl „2 Meldungen“ gebündelt (dieselbe Anzeige ist eine Zeile) · rechts „Prüfen“. Hinweise, die das System schon kennt, als leise Wörter vor dem Knopf: „Freemail“, „erneut eingereicht“, „Rückfrage gestellt“. (Erkennen, Chunking)
- Gruppe „Automatisch freigegeben, nachprüfen“ darunter, eingeklappt mit Zahl: Firmen, deren Frist verstrichen ist (Plan: nach einem Werktag automatisch frei, Verwaltung bekommt Erinnerung). Zeile wie oben, Knopf „Prüfen“; „In Ordnung“ schließt sie ohne Mail. Die Frist ist vorbei, die Prüfung nicht: Es geht um Seriosität, nicht um Freischaltung. (Verlust: Vergessenes verschwindet nicht still)
- Leer: „Nichts zu prüfen. Nächste Firma kommt per E-Mail.“ Mit nächster Frist: „Nichts offen. Nächste Frist: … bis morgen 9:00.“ (Vorbild 5.4)
Neue Firma, geöffnet (Desktop zweispaltig, Handy untereinander):
- Kopfzeile: Zurück · „Rohrbau Kessler GmbH“ · Chip „Neue Firma · Frist heute 9:00“ · rechts Pfeile „Vorherige / Nächste“ (Regel 12).
- Links: die Stelle, wie Bewerber sie sehen (derselbe Baustein wie
stelle.html, nur lesend, ohne Bewerben-Knopf). Das ist das Prüfobjekt. Darunter das Firmenprofil in Kurzform (Logo, Beschreibung, Ansprechperson). (Erkennen: man prüft das Ding, nicht eine Tabelle darüber) - Rechts: Prüfkarte in drei Blöcken (Chunking):
- *Firma:* Name · Anschrift · Telefon (antippbar) · E-Mail des Admins · registriert am · „E-Mail bestätigt ✓“ · Nutzer (1).
- *Hinweise vom System* (Regel 13), nur die zutreffenden, als Sätze: „E-Mail-Domain passt zum Firmennamen (rohrbau-kessler.de) ✓“ · „Freemail-Adresse (gmx.de)“ · „Telefonnummer: Vorwahl Duisburg ✓“ · „Anzeige enthält 1 externen Link“ · „Anzeigentext kürzer als 200 Zeichen“ · „Gehalt nicht angegeben“ · „Gleicher Firmenname existiert schon: Rohrbau Kessler (seit 2025)“ (Doppelkonto). Dazu ein Textlink „Im Handelsregister suchen“ (öffnet handelsregister.de mit dem Namen; kostenlos vor bezahlt). Keine Bewertung, keine Summe.
- *Entscheidung:* „Freigeben“ (farbig) · „Ablehnen“ (Rand) · „…“ (Frage an die Firma stellen · Firma sperren · Stelle im Namen der Firma korrigieren → 3.17).
- Unten Notiz „Notiz (nur Verwaltung)“, speichert sofort. (Doherty)
Was die Knöpfe tun:
- Freigeben: sofort. Toast „Freigegeben. Rohrbau Kessler bekommt eine E-Mail. Rückgängig“ (10 Sekunden; die Mail und die Google-Freigabe gehen danach, Plan-Regel für alle Aktionen mit Mail). Mail an die Firma: „Ihre Stelle „Rohrschlosser“ ist geprüft und erscheint jetzt auch bei Google und im Job-Alarm.“ Danach springt die Ansicht auf die nächste Prüfung (Regel 12). Herr Schiffke sieht vorher den eingeklappten Satz „Die Firma bekommt diese E-Mail“ (Regel 11).
- Ablehnen öffnet ein Fenster (nicht sofort, weil die Firma einen Grund braucht): Grund als Pillen, Pflicht: „Kein Betrieb erkennbar“ · „Angaben unvollständig“ · „Inhalt verstößt gegen die Regeln“ · „Doppeltes Konto“ · freier Satz an die Firma (freiwillig, erscheint in der Mail) · Mail-Vorschau eingeklappt · Knopf „Ablehnen und E-Mail senden“. Wirkung: Die Stelle wird „Nachbessern“ (offline, nicht gesperrt), die Firma bleibt aktiv und bekommt Mail F16 mit Grund und Weg. In ihrer Stellenliste steht der Chip „Bitte ergänzen: {grund}“ mit dem Zeilen-Knopf „Bearbeiten“, in „Heute zu tun“ eine Zeile. „Veröffentlichen“ setzt die Stelle wieder auf „wartet auf Prüfung“; sie kommt als „erneut eingereicht“ zurück in die Liste. 10 Sekunden Rückgängig. Ablehnen ist nachbesserbar, Sperren ist hart (3.17); das ist die wichtigste Unterscheidung dieses Bildschirms (5.13).
- Frage an die Firma stellen: Fenster mit Mail-Vorlage („Bevor wir Ihre Stelle freigeben, eine kurze Frage: …“) → „Frage senden“, Mail F17 an die Firma. Zustand der Prüfung wird „Rückfrage gestellt, wartet auf Firma“; die automatische Freigabe pausiert höchstens 3 Werktage (Vorschlag, Abschnitt 7 Punkt 10). Die Firma antwortet mit dem Knopf „Antworten“ in F17: Er öffnet ihr Mailprogramm an die 3BS-Adresse mit dem Betreff „Rückfrage {nummer}“. Bululu erkennt die Antwort nicht; die Verwaltung liest sie im Postfach von 3BS und entscheidet in der Prüfung wie sonst. Nach 2 Werktagen steht in „Heute zu tun“ die Zeile „Rückfrage an Rohrbau Kessler seit 2 Werktagen offen“.
Gemeldete Anzeige, geöffnet:
- Kopfzeile: Zurück · Titel der Stelle oder Name des Firmenprofils (Plan: Melden-Knopf auf Stelle und Firmenprofil) · Chip „2 Meldungen“ · Pfeile.
- Links: die Anzeige, wie Bewerber sie sehen.
- Rechts: *Meldungen* als Karten, neueste oben: Grund (aus der Auswahl des Melders, Wortlaut TEXTE 1.3: „Falsche Angaben“, „Unseriös oder Betrug“, „Benachteiligt Menschen“, „Die Stelle gibt es nicht mehr“, „Etwas anderes“), Text des Melders, Zeit, Absender („Bewerber-Konto Ahmet Y.“ oder „ohne Konto, E-Mail angegeben“ oder „anonym“). *Firma:* Name, seit wann, Stellen (n), „1 frühere Meldung, erledigt am …“ (Erkennen: Wiederholungstäter sieht man ohne Suche). *Entscheidung:* „Erledigt, bleibt online“ (farbig; die meisten Meldungen sind unbegründet, der häufigste Weg ist der Hauptknopf) · „Offline nehmen“ (Rand; Fenster mit Grund-Pillen; die Stelle wird „Nachbessern“ wie nach „Ablehnen“, die Firma bekommt dieselbe Mail F16, ändert die Stelle und veröffentlicht sie erneut) · „…“ (Stelle sperren: hart, die Firma kann sie nicht selbst wieder veröffentlichen, nur die Verwaltung mit „Stelle entsperren“ hier oder in Firmenansicht › Stellen · Firma sperren · dem Melder antworten).
- Der Melder bekommt nach der Entscheidung automatisch die Mail V06 „Danke, wir haben Ihre Meldung geprüft.“ ohne Ergebnis, wenn er eine E-Mail angegeben hat. „Dem Melder antworten“ öffnet das Mailprogramm an seine Adresse. Das Ergebnis betrifft die Firma, nicht den Melder; wer das Ergebnis mitteilt, lädt zu Streit ein. (Vertrauen in beide Richtungen; Vorschlag, Abschnitt 7 Punkt 12)
Was bewusst NICHT auf den Bildschirm kommt:
- Punktzahl, Ampel, „Spam-Wahrscheinlichkeit“: Das System liefert Fakten, der Mensch entscheidet (Regel 13). Eine Ampel würde Herrn Schiffke blind grün drücken lassen.
- Zwei farbige Knöpfe. Ablehnen ist Rand, Sperren liegt hinter „…“ und hat ein eigenes Fenster.
- Pflicht-Freitext bei Ablehnung: Pflicht ist nur die Pille; der Satz ist freiwillig, sonst wird er lieblos (dieselbe Lehre wie 5.3 beim Absage-Grund).
- Bewerbungsunterlagen der Firma: Es gibt bei einer neuen Firma noch keine; bei Meldungen sind sie nicht Gegenstand (Plan: Unterlagen nur im Support- oder Meldefall mit Grund, Protokoll).
- Eine zweite Liste „geprüft“: Erledigtes steht im Protokoll der Firma (3.17) und in „Seit Ihrem letzten Besuch“.
Zustände:
- *Stelle inzwischen von der Firma gelöscht oder beendet:* Zeile verschwindet, Prüfung gilt als erledigt; im Protokoll „erledigt: Stelle beendet“. Die Firma bleibt ungeprüft: Ihre nächste veröffentlichte Stelle wartet wieder auf Prüfung und löst V01 erneut aus. Geöffnet: Satz „Die Stelle wurde inzwischen beendet. Nichts mehr zu tun.“ + „Nächste“.
- *Zwei Personen an derselben Prüfung:* Beide können handeln; wer als Zweiter speichert, bekommt den Hinweis „Inzwischen von einer anderen Person bearbeitet, bitte neu laden“ (Karte 2a C9). Der Satz „hat diese Prüfung geöffnet“ kommt erst mit 2b.9.
- *Freigabe schlägt fehl (Netz, Server):* Satz am Knopf, Eingaben bleiben, „Erneut versuchen“ (Plan).
- *Firma hat Mail nicht bestätigt:* Prüfung erscheint erst nach Bestätigung (sonst prüft man Luft); in der Firmenansicht sichtbar als „unbestätigt“.
- *Keine Rechte:* keine; beide Rollen prüfen.
Zählwerte: Liste: Pillen 0 bis 3, Entscheidungen 1 (Zeile), Klicks bis geöffnet: 1. Geöffnet: 1 farbiger + 1 Rand-Knopf; Klicks bis Freigabe inklusive nächste Prüfung: 1; bis Ablehnung: 3 (Ablehnen, Pille, Senden).
Abweichung von B: Nicht vorhanden in B. Bausteine: Stellenseite aus stelle.html (lesend, ohne Klebeleiste stelle.html:98), Chips, dialog wie das Bewerben-Fenster (stelle.html dialog#bewerbung) für Ablehnen, Toast mit Rückgängig (B hat Toast, app.js; Rückgängig ist neu, kommt aus Vorbild 3.10). Melden-Knopf auf der Stelle fehlt in B (Vorbild 3.3 ergänzt ihn); das Melde-Fenster hat die Grund-Pillen von oben plus Textfeld plus freiwillige E-Mail.
3.16 Anfragen (Kontakt · Premium · Werbung)
Hauptaufgabe: Keine Anfrage länger als einen Werktag ohne Antwort; jede Antwort ohne Formulierungsarbeit; nie zwei Menschen, die dieselbe Anfrage beantworten.
Hauptknopf (Liste): „Öffnen“ je Zeile (bei Werbeanfragen „Kampagne anlegen“). Hauptknopf (geöffnet): „Antwort senden“ (Kontakt) · „Freischalten bis …“ (Premium).
Liste, Aufbau:
- Überschrift „Anfragen“, Satz „5 offen, älteste seit 2 Tagen“.
- Pillen Art: Alle · Kontakt · Premium · Werbung und Zustand: Offen · In Bearbeitung · Beantwortet (Standard „Offen“; Plan: Filter Art). Sortierung älteste zuerst, fest (Plan). (Hick: zwei Pillenreihen, keine Auswahlfelder)
- Zeile: Art-Chip · Absender (Name, Firma) · Rolle („Bewerber“, „Betrieb“, „Sonstiges“ aus
kontakt.html:130ff.) · erste Zeile des Textes · „seit 2 Tagen“ · „übernommen von Nomad“ (nur bei In Bearbeitung) · rechts ein Knopf: „Öffnen“, bei Werbung „Kampagne anlegen“ (führt nach 3.18; die Anfrage wird „übernommen“). (Sichtbar: wer dran ist) - Leer: „Keine offenen Anfragen. Kontaktformular, Premium und Werbung landen hier und zusätzlich per E-Mail bei 3BS.“
Kontaktanfrage, geöffnet:
- Kopf: Zurück · Name · Rolle · „vor 2 Tagen“ · Pfeile „Vorherige / Nächste“.
- Text der Anfrage groß, darunter die Kontaktzeile: E-Mail, Telefon (antippbar, wenn angegeben,
kontakt.html:152), Einwilligung mit Datum (Plan: Einwilligung mit Zeitpunkt). - Zusammenhang, nur wenn vorhanden: „Hat ein Bewerber-Konto seit 12.10., 3 Bewerbungen“ oder „Admin von Lackiererei Voss, 2 aktive Stellen“ mit Link in die Firmenansicht. Spart das Suchen bei „Ich komme nicht in mein Konto“. (Tesler)
- Antwort: Vorlagen-Auswahl als Pillen über dem Feld („Kennwort vergessen“ · „Stelle nicht sichtbar“ · „Konto löschen“ · „Allgemein“ · aus Inhalte › Mailvorlagen, 3.19), Textfeld vorausgefüllt mit Anrede und Dank (Bedienregel 5), „Antwort senden“ (farbig). Mail V05 geht von der Bululu-Adresse, Antwort-Adresse ist die 3BS-Adresse (Plan: Kontaktanfragen zusätzlich an 3BS), weiterer Austausch läuft per Mail. 10 Sekunden Rückgängig. Zustand wird „Beantwortet“. Beim Öffnen wird die Anfrage automatisch „In Bearbeitung, übernommen von …“ (ohne Knopf; das verhindert Doppelantworten). (Doherty, Shneiderman)
- Textlinks darunter: „Ohne Antwort erledigen“ (Spam, Doppelte) · „An den Betreiber weitergeben“ (nur 3BS; setzt die Zeile für den Super Admin in „Heute zu tun“: technische Fragen, die Herr Schiffke nicht beantworten kann). Notiz intern.
Premium-Anfrage, geöffnet:
- Kopf: Firma · „angefragt vor 1 Tag“ · Link in die Firmenansicht.
- Karte: Stellen der Firma (n aktiv, Titel), bisherige Premium-Phasen („Premium bis 30.09. gehabt“), Nachricht der Firma, Ansprechperson mit Telefon. Der Preis wird am Telefon oder per Mail vereinbart (B
arbeitgeber.html:116: „Preise nennen wir Ihnen gern am Telefon“; Paketmodell nach dem Livegang, Plan). - Entscheidung: „Freischalten bis [Datum]“ (farbig; Datumsfeld vorbelegt mit heute + Standard-Laufzeit aus Einstellungen › Fristen, Vorschlag 30 Tage; Feld „Top-Plätze“, vorbelegt mit dem Standard aus Einstellungen › Fristen, Vorschlag 3) · „Angebot geschickt“ (Textknopf, kein Haken; setzt den Zustand In Bearbeitung mit Datum und zeigt danach „Angebot geschickt am 22.10. · Zurücknehmen“; kein Mailversand, die Verhandlung läuft außerhalb) · „Ablehnen“ (Rand; Fenster mit Grund-Pille Pflicht: „Zurzeit nicht möglich“ · „Firma noch zu neu“ · „Sonstiges“ + Satz, Mail-Vorschau, „Ablehnen und E-Mail senden“; Plan: abgelehnt mit Grund).
- Freischalten: Toast „Premium bis 21.11. aktiv. Induserv bekommt eine E-Mail. Rückgängig“. Ab dann sieht die Firma den Haken „Als Top-Stelle“ und „0 von 3 Top-Plätzen belegt“, bis alle Plätze belegt sind (Plan). Ablauf: 5 Tage vorher eine Zeile in „Heute zu tun“ der Firma, am Ablauftag Mail F13, in der Verwaltung keine Zeile (die Firma fragt erneut an, wenn sie will; die Verwaltung soll nicht verkaufen müssen).
Werbeanfrage: wird nicht hier geöffnet, sondern als Kampagne angelegt (3.18; bis Abschnitt 2b mit dem Mindestteil, siehe dort). Die Zeile zeigt Firma, gewählte Flächen („Startseite, 14 Tage ab 3.11.“), „Motiv hochgeladen ✓“ oder „Motiv folgt per E-Mail“, und den Knopf „Kampagne anlegen“. Ein Ding, ein Ort: Die Anfrage ist der Eingang, die Kampagne das Ding.
Was bewusst NICHT auf den Bildschirm kommt:
- Ein Postfach-Chat mit dem Anfragenden: Antwort per Mail, Austausch per Mail (Plan: Kontakt eingegangen → in Bearbeitung → beantwortet). Ein Chat würde Herrn Schiffke an die Oberfläche binden, die er selten öffnet.
- Zuweisen-Auswahl („an wen“): Öffnen übernimmt; „An den Betreiber weitergeben“ reicht als einziger Zweitweg.
- Preisfelder, Rechnung, Zahlungsstatus bei Premium: nach dem Livegang (Plan).
- Antwort-Vorlagen mit Platzhalter-Syntax sichtbar: Platzhalter sind beim Einfügen schon ersetzt (Name, Firma).
Zustände:
- *Leer:* siehe oben.
- *Absender-Adresse kommt zurück (Rückläufer, Plan Betrieb):* Satz in der geöffneten Anfrage „Mails an diese Adresse kommen zurück. Telefon: …“.
- *Spam:* „Ohne Antwort erledigen“ (Textlink); „Zur Sperrliste“ steht hinter „…“ im Kopf der Anfrage (beide Rollen; Sperrliste 3.24), nicht neben den weichen Textlinks.
- *Premium schon aktiv:* die Anfrage zeigt „Premium läuft bis …“, Hauptknopf wird „Verlängern bis …“.
- *Keine Rechte:* 3BS kann alles hier, auch „Zur Sperrliste“; nur IP-Bereiche und unbefristete Einträge fehlen (Karte 3 1.15).
Zählwerte: Liste: 2 Pillenreihen, Entscheidungen 1, Klicks bis geöffnet: 1. Kontakt: 1 farbiger Knopf, Klicks bis Antwort gesendet: 2 (Vorlage, Senden). Premium: Klicks bis freigeschaltet: 1.
Abweichung von B: Kontaktformular bleibt wie kontakt.html:130 bis :165 (Rolle, Name, E-Mail, Telefon freiwillig, Nachricht, Einwilligung); Danke-Satz app.js:911 bleibt. Neu: Eingang in der Verwaltung, Vorlagen, Übernahme beim Öffnen. Das Arbeitgeber-Kontaktformular arbeitgeber.html:248 bis :259 ist dieselbe Anfrage mit Rolle „Betrieb“ vorbelegt und ohne Rollen-Auswahl; der Lead-Satz :238 („Wir beraten Sie zu Paketen, Premium-Anzeigen und Werbeflächen“) verliert „Paketen“ (Vorbild 3.14 alt). Premium-Anfrage: Knopf „Premium anfragen“ an der Stelle (Vorbild 3.9) öffnet ein kleines Fenster mit einem freiwilligen Satz und „Anfragen“; mehr nicht.
3.17 Firmen und Nutzer (Suche · Firmenansicht · Support-Aktionen)
Hauptaufgabe: Bei einem Anruf („Ich komme nicht rein“, „Meine Stelle ist weg“) in 30 Sekunden die Firma oder Person finden und die eine passende Support-Aktion ausführen, ohne Daten zu sehen, die man nicht braucht.
Hauptknopf (Suche): das Suchfeld selbst. Hauptknopf (Firmenansicht): keiner als Dauerknopf; die Aktionen sind Rand-Knöpfe, weil keine davon die Regel ist.
Suche und Liste, Aufbau:
- Überschrift „Firmen und Nutzer“, darunter ein Suchfeld mit Fokus beim Öffnen: „Firma, Name oder E-Mail“. Sucht in Firmenname, Nutzername, E-Mail, Stellentitel (Plan: Name und Mail; Stellentitel dazu, weil Anrufer oft nur die Stelle nennen). Ergebnisse ab dem dritten Zeichen, ohne Knopf. (Jakob: jedes Support-Werkzeug beginnt mit Suche; Doherty)
- Pillen Rolle: Alle · Firmen · Firmennutzer · Bewerber und Zustand: Alle · Aktiv · Gesperrt · Unbestätigt (Plan). Ohne Suche zeigt die Liste „zuletzt aktiv“ (Plan), 25 je Seite.
- Zeile Firma: Logo/Monogramm · Name · Ort · „3 Stellen (2 aktiv)“ · „2 Nutzer“ · Zustand-Chip (Aktiv · Gesperrt · Unbestätigt · Premium bis …) · „zuletzt aktiv vor 2 Tagen“. Zeile Bewerber: Initialen · Name · E-Mail · „3 Bewerbungen“ · Zustand · zuletzt aktiv. Zeile Firmennutzer: Name · E-Mail · Firma · Rolle (Admin/Recruiter). Zeile klickbar, kein Knopf. (Erkennen; Datenschutz: in der Liste nichts über Zahl und Zustand hinaus)
- Leer nach Suche: „Nichts gefunden für „kesler“. Versuchen Sie einen Teil des Namens oder die E-Mail-Adresse.“ Ohne Suche leer (nur am ersten Tag): „Noch keine Firmen. Die erste erscheint nach der Registrierung.“
Firmenansicht, Aufbau Desktop:
- Kopf: Logo · Name · Ort · Chips (Zustand, „Premium bis 21.11.“, „registriert 12.10.“) · rechts die Support-Leiste: „Im Namen von … arbeiten“ (Rand) · „Sperren“ (Text) · „…“ (Premium freischalten/beenden, beim Beenden Mail F13 · Nutzer umhängen · Firma löschen mit Datenexport, nur Super Admin, mit Kennwort). Keiner farbig: Hier ist nichts die Regel. (Restorff: der eine farbige Knopf bleibt den Entscheidungen in Prüfen/Anfragen vorbehalten)
- Abschnitte untereinander, oben Sprungmarken (keine Reiter, keine zweite Menü-Ebene; die Firmenansicht ist eine Detailseite): Stellen · Nutzer · Bewerbungen · Protokoll · Notizen.
- *Stellen:* Liste wie 3.9 in Firmensicht (Zustand, Restlaufzeit, Bewerbungszahl), Zeile öffnet die Stelle lesend; Änderungen nur über „Im Namen von“. Gesperrte Stellen haben an der Zeile den Knopf „Stelle entsperren“ (wieder aktiv, 10 Sekunden Rückgängig).
- *Nutzer:* je Nutzer Name · E-Mail · Rolle · „zweiter Faktor ✓/–“ · zuletzt angemeldet · ein „…“ mit: Kennwort-Link senden · Zweiten Faktor zurücksetzen · In andere Firma umhängen · Rolle ändern · Entfernen (letzter Admin nicht entfernbar, Plan; Knopf fehlt dann).
- *Bewerbungen:* nur Zahlen je Stelle und Zustände („Schweißer: 4, davon 2 neu“), keine Namen, keine Unterlagen. Textlink „Unterlagen öffnen (mit Grund)“ öffnet das Grund-Fenster (Plan: nur im Support- oder Meldefall, protokolliert). (Vertrauen: die Verwaltung sieht nicht nebenbei, wer sich wo beworben hat)
- *Protokoll:* alles, was mit dieser Firma passiert ist (registriert, geprüft von, gesperrt von, Support-Sitzungen mit Grund, Mails gesendet), neueste zuerst. (Sichtbar)
- *Notizen:* ein Feld, speichert sofort.
Support-Aktionen im Einzelnen:
- „Im Namen von … arbeiten“: Fenster mit Grund (Pillen: „Telefon-Support“ · „Fehler beheben“ · „Stelle auf Wunsch der Firma anlegen“ · „Prüfung“ + freiwilliger Satz; Pflicht, Plan) → öffnet den Firmenbereich dieser Firma in derselben Sitzung mit einer Hinweisleiste über dem Kopf, volle Breite, nicht schließbar: „Sie arbeiten als Bululu-Verwaltung im Namen von Rohrbau Kessler. Grund: Telefon-Support. Jeder Schritt wird protokolliert. Beenden“. Die Leiste hat die Signalfarbe von B (Orange auf Hellgrund), damit sie sich vom normalen Firmenkopf (grün) unterscheidet. Der Modus endet mit „Beenden“ oder nach 60 Minuten von selbst. In diesem Modus sind Einladen, Absagen, Zusage und Nachrichten an Bewerber gesperrt (Knöpfe fehlen, Satz an der Stelle: „Nachrichten an Bewerber sind nur für die Firma möglich“): Support repariert Stellen und Profil, spricht aber nie im Namen der Firma mit Bewerbern (Vorschlag, Abschnitt 7 Punkt 11). Jede Änderung erscheint im Protokoll der Firma und als Zeile im Firmenbereich der Firma: „Bululu hat am 22.10. auf Ihren Wunsch die Stelle „Rohrschlosser“ geändert.“ (Vertrauen; Sichtbar)
- Kennwort-Link senden: sofort, Toast „Link an k.kessler@rohrbau-kessler.de gesendet, gültig 1 Stunde“. Nie ein Kennwort setzen oder sehen (Plan). Der Knopf heißt nicht „Kennwort zurücksetzen“, weil das nach „ich vergebe ein neues“ klingt.
- Zweiten Faktor zurücksetzen: Fenster mit drei Sätzen: „Hat die Person ihre Wiederherstellungscodes? Dann braucht sie uns nicht: Codes bei der Anmeldung eingeben.“ · Pflicht-Haken „Identität am Telefon geprüft, Rückruf an die hinterlegte Nummer 0203 …“ · Grund. Knopf „Zurücksetzen in 24 Stunden per Link“ (nur bei der App: ohne Codes erst nach Rückruf oder Identitätsprüfung und 24 Stunden Wartezeit; beim E-Mail-Code „Zurücksetzen per Link“ sofort, 26.10.). Die Person bekommt sofort eine Mail (A08): „Für Ihr Konto wurde das Zurücksetzen des zweiten Faktors beantragt. Das waren nicht Sie? Abbrechen.“ „Abbrechen“ führt auf die Zielseite „Zurücksetzen abgebrochen“ und schreibt eine Zeile ins Protokoll. Nach 24 Stunden der Link (A04). Die Wartemail ist der Schutz, nicht die Wartezeit allein. Bis dahin Chip am Nutzer „Rücksetzung läuft, Link am 23.10. 14:10“.
- Sperren: Fenster mit Grund-Pille Pflicht („Betrug/Spam“ · „Verstoß gegen die Regeln“ · „Auf Wunsch der Firma“ · „Sonstiges“) + Satz + Mail-Vorschau → „Sperren und E-Mail senden“. Wirkung (Plan): Stellen offline, Firmennutzer sehen bei Anmeldung eine Erklärseite mit Grund und Kontakt, Bewerber sehen „Dieser Betrieb ist nicht mehr auf Bululu“. 10 Sekunden Rückgängig. Danach Chip „Gesperrt seit 22.10. von M. Maier: Betrug/Spam“ im Kopf und Knopf „Entsperren“ an derselben Stelle (Status-Wort plus Weg zurück, Bedienregel 7).
- Nutzer umhängen: Auswahl der Zielfirma per Suche, Satz „K. Kessler wird Recruiter bei Kessler Rohrbau GmbH und verliert den Zugang zu Rohrbau Kessler.“ → „Umhängen“. Rollen-Standard im Ziel: Recruiter (Standard: die kleinere Rechte).
- Firma löschen (in der Verwaltung nur Super Admin; im Firmenbereich der Firmen-Admin): Kennwort-Bestätigung (Plan: Unumkehrbares fragt mit Kennwort), vorher automatischer Datenexport als ZIP, Satz mit Folge: „3 Stellen werden beendet, 2 Nutzer verlieren den Zugang zur Firma (ihre Konten bleiben), 14 Bewerbungen bleiben bis zur Frist als Nachweis gesperrt gespeichert (Plan).“ Offene Bewerbungen werden „Stelle beendet“ (B14, neutrale Fassung), alle Firmennutzer bekommen Mail F18.
Bewerberansicht (geöffneter Bewerber): Name · E-Mail · Telefon · registriert · Zustand · „3 Bewerbungen (2 offen)“ als Zahl · Job-Alarme (n) · Einwilligungen mit Datum und Textfassung. Aktionen: Kennwort-Link senden · Zweiten Faktor zurücksetzen · Sperren (Grund, Mail B18; danach „Entsperren“ an derselben Stelle, Mail B19; offene Bewerbungen bleiben bei der Firma sichtbar, ihr Postfach ist schreibgeschützt) · Daten exportieren (auf Wunsch der Person, Plan) · Konto löschen (nur Super Admin, Kennwort). Lebenslauf und Unterlagen nur über „Öffnen (mit Grund)“. Nichts weiter.
Was bewusst NICHT auf den Bildschirm kommt:
- Bewerbernamen in der Firmenansicht, Unterlagen ohne Grund-Fenster.
- Kennwort-Feld, „Kennwort auf 12345 setzen“, Anzeige des zweiten Faktors.
- Ein Dauer-Knopf „Neue Firma anlegen“: Firmen registrieren sich selbst; Support legt höchstens eine Stelle im Namen der Firma an (Plan).
- Sammelaktionen, die sich nicht zurücknehmen lassen (mehrere sperren, Mail an alle); Freigeben und Erledigen geht gesammelt (siehe „Auswählen“).
- Statistik je Firma: keine Kurven, keine Vergleiche, keine Statistikseite bis zur Freischaltung (Plan). Die Aufrufzahl je Stelle steht nur an der Stelle selbst (3.9).
Zustände:
- *Firma unbestätigt (Mail nicht bestätigt):* Chip „Unbestätigt seit 3 Tagen“, Knopf „Bestätigungs-Mail erneut senden“.
- *Gesperrt:* siehe Sperren; Support-Leiste zeigt „Entsperren“ statt „Sperren“, „Im Namen von“ bleibt möglich (zum Aufräumen).
- *Gelöscht:* Firma erscheint 30 Tage mit Chip „Gelöscht, Export vorhanden“, nur Super Admin, nur lesend.
- *Keine Rechte:* 3BS sieht Löschen nicht; Sperren und Sperrliste wie der Super Admin, nur ohne die Pillen IP-Bereich und Unbefristet (sie fehlen, kein Hinweis-Satz); sonst gleich.
- *Rücksetzung des zweiten Faktors läuft:* Chip am Nutzer mit Zeitpunkt, Textlink „Abbrechen“.
Zählwerte: Suche: 1 Feld, 2 Pillenreihen, Klicks bis Firma geöffnet: 1 (tippen + Zeile). Firmenansicht: 0 farbige, 2 Rand/Text + „…“. Klicks bis Kennwort-Link gesendet: 3 (Sprungmarke Nutzer, „…“, Senden). Bis „im Namen von“ aktiv: 3 (Knopf, Pille, Start).
Abweichung von B: nicht vorhanden in B. Bausteine: Reiter, Zeilen, Chips, dialog, Formulare; die Hinweisleiste ist neu und kommt in den Bausteinkatalog (Plan: Konto-Knopf ebenso). Der Firmenbereich in „Im Namen von“ ist derselbe Firmenbereich (3.8 bis 3.12) mit Leiste und ohne Bewerber-Kommunikation.
3.18 Werbung (Verwaltung): Flächen · Kampagne anlegen aus Anfrage · Motiv prüfen · Laufzeit · Klickzahlen
Hauptaufgabe: Aus einer Anfrage ohne Entwickler eine laufende Kampagne machen; jederzeit sehen, was läuft, was startet und wo ein Motiv fehlt; am Ende die Klickzahlen an den Kunden schicken, ohne daran denken zu müssen.
Zum Livegang (Abschnitt 3) gibt es nur den Mindestteil: „Kampagne anlegen“ aus der Anfrage-Zeile oder ohne Anfrage öffnet ein Formular mit Kunde (aus der Anfrage vorbelegt), Fläche, Zeitraum, Motiv hochladen, Zielseite, Text zum Vorlesen und Zustand (von Hand); die Liste zeigt je Kampagne die Zählung (Einblendungen, Klicks). Liegt das Motiv vor, erscheint die Werbung im Zeitraum auf der Fläche; W04 (Start) und W05 (Ende mit Klickzahlen) gehen automatisch. Angebot, Motivprüfung und Änderungen (W02, W03, W06 bis W08) schickt Nomad bis Abschnitt 2b aus dem Mailprogramm mit den Texten aus TEXTE 6.6. Alles Weitere auf diesem Bildschirm kommt in 2b.
Hauptknopf (Liste): je Zeile ein Knopf nach Zustand (unten). Hauptknopf (Kampagne): je Zustand einer: „Angebot per E-Mail senden“ · „Motiv freigeben“ · „Bericht senden“.
Liste „Kampagnen“, Aufbau:
- Überschrift „Werbung“ mit der Liste der Kampagnen; „Flächen und Belegung“ ist ein Eintrag im „…“ oben rechts (keine Reiter, keine zweite Menü-Ebene). Satz unter der Überschrift: „2 laufen, 1 startet Montag, 1 Anfrage offen“.
- Gruppen statt Filter (wie Stellen 3.9), leere Gruppen fehlen:
- Braucht Aufmerksamkeit: Anfrage ohne Angebot (Frist 1 Werktag) · Angebot ohne Antwort seit 5 Tagen · Start in ≤ 3 Tagen ohne freigegebenes Motiv · endet in ≤ 3 Tagen (Verlängerung anbieten)
- Läuft
- Geplant
- Beendet (eingeklappt, mit Zahl)
Filter „Zustand“ als Pillen und Suche nach Kunde erst ab 8 Kampagnen (Plan: Sortierung Startdatum, Filter Zustand). (Hick, Chunking)
- Zeile: Kunde · Fläche und Format in Kundenwörtern („Startseite, großes Banner“) · Zeitraum („3.11. bis 16.11.“) · Zustand-Chip (Anfrage · Angebot · Motiv fehlt · Motiv da · Geplant · Läuft · Beendet; Plan-Lebenslauf) · bei Läuft/Beendet „1.240 Einblendungen · 38 Klicks“ · rechts ein Knopf:
- Anfrage → „Angebot senden“ (öffnet die Kampagne im Angebots-Schritt)
- Angebot → „Als angenommen markieren“ (wenn der Kunde per Mail oder Telefon ja gesagt hat)
- Motiv fehlt → „Motiv anfordern“ (Mail-Vorlage, sofort, Rückgängig)
- Motiv da → „Motiv prüfen“
- Geplant → kein Knopf, Chip-Text „startet Mo 3.11.“
- Läuft → kein Knopf („Pausieren“, „Verlängern“, „Vorzeitig beenden“ hinter „…“)
- Beendet → „Bericht ansehen“; wenn der automatische Versand fehlschlug: „Bericht senden“
(Erkennen: eine Handlung je Zustand; Verlust: „endet in 3 Tagen“ sichtbar)
- Leer: „Keine Kampagnen. Anfragen kommen über „Werbung planen“ auf der Seite Für Arbeitgeber.“ Kein Knopf (die Verwaltung legt Kampagnen nur aus Anfragen an; eine Kampagne von Hand, z. B. nach Telefonanfrage, geht über „…“ oben rechts: „Kampagne ohne Anfrage anlegen“, Offenlegung).
Kampagne, geöffnet (ein Blatt): oben ein Zeitstrahl Anfrage → Angebot → Motiv → Geplant → Läuft → Beendet mit Datum je Schritt; darunter die Abschnitte in der Reihenfolge des Lebenslaufs. Offen ist nur der Abschnitt des aktuellen Schritts; erledigte sind eingeklappt mit einer Zeile („Angebot gesendet am 23.10.“). (Detailansicht mit Zeitstrahl, Chunking)
- Kopf: Kunde · Zustand-Chip · Ansprechpartner mit Telefon und E-Mail · „Anfrage vom 22.10. 10:14“.
- Posten (aus der Anfrage übernommen, Tesler): je Posten eine Karte: Fläche · Geräte · Position (nur Trefferliste) · Suchbegriffe (nur Fläche „Suchbegriffe“) · Laufzeit · Wunsch-Start · Motiv (Miniatur oder „folgt per E-Mail“) oder Textanzeige (Firma, Titel, Text, Knopf). Bearbeitbar. „Posten hinzufügen“ als Textlink.
- Zeitraum: Startdatum (vorbelegt mit dem Wunsch; frühestens in 3 Werktagen) und Ende (aus Laufzeit berechnet). Direkt am Feld die Belegung der gewählten Fläche: „Frei ✓“ oder „Vom 3. bis 10.11. belegt (Arbeitsschutz Wenning). Frei ab 11.11.“ mit Knopf „Ab 11.11. eintragen“. Bei Suchbegriffen je Begriff. (Fehler vermeiden statt melden)
- Angebot: Preis netto (freies Feld, Betrag; die Verwaltung entscheidet, es gibt keine Preistabelle im System, bis echte Preise feststehen, Plan) · Angebotstext aus Vorlage mit den Posten als Liste · Mail-Vorschau eingeklappt · „Angebot per E-Mail senden“ (farbig). Zustand → Angebot. Die Mail enthält Zeitraum, Flächen in Kundenwörtern, Preis, Motiv-Maße, einen Satz „Antworten Sie mit „Ja“ oder rufen Sie an“, Telefon. Nach Annahme: „Als angenommen markieren“ (ein Klick, Datum).
- Motiv: je Format eine Ablage (Maße stehen dran; B
konfigurator.js:592ff.motivSlotliefert Ablage und PrüfungpruefMotiv:532): Datei aus der Anfrage oder Hochladen (die Verwaltung lädt hoch, was der Kunde per Mail schickt). Unter dem Motiv die Vorschau in der echten Fläche (die Nachbildung auskonfigurator.jsvorschau():741ff., Gerät umschaltbar). Daneben die Prüfpunkte als Sätze (Regel 13): „Maße 970 × 250 ✓“ · „Dateigröße 84 KB ✓“ · „Zielseite antwortet ✓ (werkzeughaus-kemper.de)“ · „Bild im Browser neu kodiert, Metadaten entfernt ✓“ (N-2, 26.10.; Plan Sicherheit: der Server prüft Typ, Größe, Maße und Viren). Zielseite ist ein Pflichtfeld (Link, auf den die Anzeige führt). Entscheidung: „Motiv freigeben“ (farbig) · „Änderung anfordern“ (Rand; Pillen „Maße passen nicht“ · „Text unleserlich“ · „Zielseite fehlt oder antwortet nicht“ · „Inhalt“ + Satz + Mail-Vorschau; der Kunde bekommt die Maße und das Angebot „oder schicken Sie uns Ihre Vorlage, wir passen es an“). Textanzeige: Felder mit Zeichengrenzen (BNATIV_MAX:99) und Vorschau in der Liste; Freigabe gleich. - Freigabe und Start: Sobald Angebot angenommen, Motiv freigegeben und Zeitraum frei, zeigt die Kampagne „Geplant, startet Mo 3.11. 0:00“. Start und Ende laufen automatisch. Tag vor Start Mail an den Kunden (3.22 M4). (Sichtbar: der Zustand sagt, wann etwas von allein passiert)
- Laufzeit: „Verlängern“ (Fenster: neue Laufzeit, Preis, Mail als neues Angebot) · „Pausieren“ (sofort, Chip „Pausiert“, Knopf „Fortsetzen“) · „Vorzeitig beenden“ (10 Sekunden Rückgängig, Bericht geht danach wie am regulären Ende). Alles hinter „…“ im Kopf.
- Klickzahlen: je Posten Einblendungen, Klicks, Klickrate; darunter eine Tabelle je Tag (kein Diagramm zum Start). Zählung über den eigenen Weiterleitungslink ohne Cookies (Plan Betrieb). Am Ende automatisch die Mail „Ihre Kampagne ist beendet“ mit den Zahlen (Plan); Zeile „Bericht gesendet 17.11. 8:00 ✓“. Knopf „Bericht senden“ nur, wenn der Versand fehlschlug oder der Kunde ihn zwischendurch möchte („Zwischenstand senden“ hinter „…“).
- Notiz intern und Protokoll (wer wann was, inklusive aller Mails) unten.
„Flächen und Belegung“ (über „…“ oben rechts in der Kampagnen-Liste):
- Sechs Flächen aus
konfigurator.js:49bis:86als Karten: Startseite (Billboard 970 × 250, Handy 320 × 100) · Trefferliste (Anzeige zwischen den Stellen, Textkarte) · Suchbegriffe (Textkarte nur bei bestimmten Begriffen) · Seitenleiste (Half Page 300 × 600, nur Desktop) · Stellenseite (300 × 250) · Ratgeber (728 × 90, Handy 320 × 100). Je Karte: Seite, Formate mit Maßen, Geräte, Belegung der nächsten 60 Tage als einfache Zeitleiste mit Kundennamen, „Frei ab …“. - Je Fläche zwei Einstellungen: „Wenn frei: Eigenwerbung zeigen“ (Standard an; B hat
halfpage-bululu-premium.svgundleaderboard-jobalarm.svgals Eigenmotive, sie verlinken auf „Werbung planen“; aus = Fläche verschwindet vollständig, kein Platzhalter „Hier könnte Ihre Werbung stehen“ auf der Live-Seite) und „Fläche aktiv“ (Schalter; aus = kein Angebot im Konfigurator, Plan: Freischaltungen). (Standard; Plan: aus heißt verschwindet) - Eine Regel pro Fläche, fest im System, nur lesbar: Werbung in der Liste nur an den zwei Stellen aus B (Vorbild 3.2), Kennzeichnung „Anzeige“ immer außerhalb des Motivs (
werbung/EINBAU.md:40), keine Werbung hinter dem Login und auf Über uns, Kontakt, Rechtstexten (EINBAU.md:31bis:32).
Was bewusst NICHT auf den Bildschirm kommt:
- Preistabelle, Rechner, Rabatte, Aufschläge (B
PREISEkonfigurator.js:23bis:37): Preis ist ein freies Feld im Angebot, bis echte Preise da sind (Plan). - Rechnung, Zahlungsstatus, Mahnung: die Rechnung stellt 3BS außerhalb (Annahme, Abschnitt 7 Punkt 14).
- Werbekunden-Konten, Zielgruppen, Geo-Targeting, externer Ad-Server: Bululu liefert selbst aus (Plan).
- Diagramme in den Klickzahlen; Vergleich zwischen Kunden.
- Zwei Knöpfe je Zeile.
Zustände:
- *Belegung kollidiert:* Satz am Datumsfeld mit Alternative (oben). Beim „Als angenommen markieren“ mit Kollision: Fenster „Die Fläche ist im Zeitraum inzwischen belegt (Angebot an Bildungswerk Ruhrort angenommen am …). Zeitraum ändern.“
- *Motiv fehlt 3 Tage vor Start:* Zeile in „Heute zu tun“ (3.14) und Gruppe „Braucht Aufmerksamkeit“; am Starttag ohne Motiv: Start verschiebt sich automatisch um je einen Tag, Chip „wartet auf Motiv, Start verschoben“, Mail an den Kunden nur einmal.
- *Datei nicht lesbar / zu groß / falsches Format:* Satz an der Ablage in Alltagsworten (Vorbild 5.10), „Erneut versuchen“.
- *Zielseite antwortet nicht:* Hinweis, keine Sperre (Warnen statt sperren, Bedienregel 4); Freigabe möglich.
- *Kunde storniert per Mail (Plan: Änderung und Storno per Mail):* „…“ → „Stornieren“ mit Grund-Pille („Kundenwunsch“), Chip „Storniert am …“, bleibt unter Beendet.
- *Keine Rechte:* beide Rollen gleich; „Fläche aktiv“ nur Super Admin.
Zählwerte: Liste: 0 Pillen unter 8 Kampagnen, 1 Knopf je Zeile. Kampagne: 1 farbiger Knopf je Zustand. Klicks von Anfrage bis Angebot gesendet: 3 (Kampagne anlegen, Preis eintragen, Senden). Bis Motiv freigegeben: 2 (Motiv prüfen, Freigeben). Bis Bericht: 0 (automatisch).
Abweichung von B: B hat die Werbe-Seite des Kunden (Konfigurator), nicht die der Verwaltung. Übernommen werden FLAECHEN (konfigurator.js:49 ff.), die Nachbildung (vorschau() :741 ff., belegung() :800 ff.), Motiv-Ablage und Prüfung (:532, :592 ff.), Textanzeige-Felder (:99, :544 ff.) und die Werbemittel-Bausteine (werbung/bausteine.html, werbung.css). Entfällt: PREISE und alles, was rechnet (berechne :123 ff., summe :143). Neu: Zustände, Belegungs-Zeitleiste, Angebots-Mail, Klickzählung, Bericht.
3.19 Inhalte (Fachbereiche · Mailvorlagen · Ratgeber · Rechtstexte · Seitentexte)
Hauptaufgabe: Texte ohne Entwickler ändern (Relaunch-Konzept: „pflegbar ohne Entwickler“), ohne etwas kaputt zu machen; Fachbereiche aufräumen, ohne Stellen zu verlieren.
Hauptknopf: im Editor „Veröffentlichen“; in den Listen keiner (Zeilen sind der Weg), außer „Neuer Artikel“ im Ratgeber (einziger Inhalt, der neu entsteht).
Aufbau:
- Überschrift „Inhalte“, eine Liste mit Art-Pillen Fachbereiche · Mailvorlagen · Ratgeber · Rechtstexte · Seitentexte (Filter, keine Reiter mit eigenen Adressen, keine zweite Menü-Ebene). Listen nach Name (Plan), Filter Sprache als Pillen DE · EN · TR · AR nur bei Inhalten mit Sprachfassungen. (Hick)
- Zeile (alle Arten): Name · Zustand-Chip (Online · Entwurf · „Übersetzung veraltet (EN, TR)“) · zuletzt geändert von, wann · klickbar.
Editor (Mailvorlagen, Ratgeber, Rechtstexte, Seitentexte), gemeinsamer Aufbau:
- Kopf: Zurück · Name · „Entwurf gespeichert 12:03“ (speichert selbst, Tesler/Doherty) · rechts „Veröffentlichen“ (farbig) und „Vorschau“ (Rand).
- Sprach-Reiter DE · EN · TR · AR. Deutsch ist die verbindliche Fassung (Plan). Nach Änderung an DE tragen die anderen den Chip „veraltet“ und der Super Admin bekommt die Zeile „Ratgeber „Lebenslauf“ geändert, 3 Übersetzungen veraltet“ → „Übersetzen“ in „Heute zu tun“ (Plan: der Super Admin übersetzt nach). Knopf „Automatisch übersetzen“ (nur Super Admin, Azure) setzt die Fassung auf „maschinell, nicht geprüft“; „Als geprüft markieren“ nimmt den Chip weg. Bis dahin zeigt die Seite den deutschen Text mit kleinem Hinweis (Plan). (Sichtbar)
- Textfeld: Überschriften (zwei Ebenen), Absatz, Liste, Link, fett. Sonst nichts (Plan: Tiptap mit Überschriften, Absätzen, Listen und Links). Keine Farben, keine Schriftgrößen, keine Tabellen, kein HTML. Beim Speichern ersetzt das System Gedankenstriche nach der Regel für Kundentexte und wandelt Anführungszeichen in „…“ (stille Korrektur, kein Hinweis; wer es wörtlich braucht, hat das Problem nicht in einem Ratgeber).
- Mailvorlagen zusätzlich: Betreff-Feld · Platzhalter als Chips über dem Text in Alltagsworten („Vorname des Bewerbers“, „Firmenname“, „Stellentitel“, „Link zur Bewerbung“), Klick fügt ein; im Text erscheinen sie als Chip, nicht als
{vorname}(Erkennen). Pflicht-Platzhalter (der Link) lässt sich nicht löschen; Versuch zeigt den Satz „Der Link muss in dieser E-Mail bleiben, sonst kommt der Empfänger nicht weiter.“ · „Vorschau mit Beispieldaten“ · „Testmail an mich“. Die Liste der Vorlagen trägt Namen aus Nutzersicht: „Bewerbung angekommen (an Bewerber)“, „Einladung (Vorlage für Firmen)“, „Absage (Vorlage für Firmen)“, „Neue Firma freigegeben“, „Stelle läuft in 5 Tagen ab“, „Angebot Werbung“, „Kampagne beendet, Klickzahlen“ usw.; je Vorlage ein Satz, wann sie geht („geht sofort nach dem Senden der Bewerbung“). Firmen-Vorlagen (Einladen, Absagen) sind die Voreinstellung, die Firmen in 3.10 sehen und je Fall ändern. - Rechtstexte zusätzlich: keine Löschung, „Fassungen“ als Liste mit Datum und „gültig von … bis …“ (Plan: Einwilligungen mit Textfassung). Veröffentlichen fragt hier einmal nach, weil es rechtlich wirkt: „Neue Fassung ab jetzt gültig. Bestehende Einwilligungen bleiben auf der alten Fassung.“ → „Veröffentlichen“. Das ist die eine Ausnahme von „Rückgängig statt Rückfrage“, begründet mit Unumkehrbarkeit (Regel 6 des Vorbilds).
- Ratgeber zusätzlich: Titel, Teaser (2 Sätze), Bild (Hochladen; der Browser verkleinert vor dem Hochladen auf 1600 px und speichert WebP, ohne Hinweis; der Server prüft nur, N-2, 26.10.), Zustand Entwurf/Online, „Online seit“. Reihenfolge auf der Ratgeber-Seite: neueste zuerst, kein Sortieren von Hand. Löschen: 30 Tage Papierkorb (Plan), 10 Sekunden Rückgängig.
- Seitentexte: die kurzen Texte, die im Plan genannt sind (Über uns, Kontakt-Einleitung, Für-Arbeitgeber-Sätze, Leerzustände, die Zusage „innerhalb eines Werktags“). Jeder Seitentext zeigt links daneben, wo er steht („Startseite, Block Für Arbeitgeber“) mit Link auf die Seite. (Erkennen: man ändert nichts, was man nicht einordnen kann)
Fachbereiche (eigener Aufbau):
- Liste: Name · Stellen (n aktiv) · Job-Alarme (n) · Suchbegriffe (Zahl, z. B. „12 Begriffe: Schweißer, welder, kaynakçı …“) · Reihenfolge (Pfeile hoch/runter; die Reihenfolge der Kacheln auf der Startseite ist sonst nach Anzahl, Plan; Pfeile nur, wenn die Verwaltung „feste Reihenfolge“ einschaltet) · Zustand (Aktiv · Ausgeblendet).
- Geöffnet: Name je Sprache · Suchbegriffe als Chips je Sprache (Plan: Begriffslisten je Fachbereich, englische Suche über Begriffe) · Schalter „Auf der Startseite zeigen“ · Aktionen: „Zusammenführen mit …“ (Rand) · „Ausblenden“ (Text, nur bei 0 Stellen). Kein Löschen (Plan: zusammenführen statt löschen, nie mit Stellen gelöscht).
- Zusammenführen-Fenster: Ziel per Auswahl, dann der Satz mit Folgen: „12 Stellen, 3 Job-Alarme und 9 Suchbegriffe wandern nach „Metall und Schweißen“. Der Name „Schweißtechnik“ bleibt als Suchbegriff erhalten.“ → „Zusammenführen“. 10 Sekunden Rückgängig, dann unumkehrbar (im Protokoll). Firmen, deren Stellen gewandert sind, bekommen keine Mail (nichts, was sie tun müssten).
Was bewusst NICHT auf den Bildschirm kommt:
- Layout-Editor, Seitenbaukasten, freies HTML, Bilder in Mails: Das Design ist B und bleibt es (Plan).
- Rollen je Inhalt, Freigabe-Workflow (Vier-Augen): zwei Menschen, kein Verlag. Bei Rechtstexten reicht die Nachfrage.
- Versionsvergleich mit Diff bei Ratgebern; nur Rechtstexte haben Fassungen.
- Neue Fachbereiche anlegen: zum Start gibt es die Liste aus Abschnitt 0 des Plans; „Neuer Fachbereich“ liegt hinter „…“ (selten; ein falscher neuer Fachbereich zersplittert die Suche).
Zustände:
- *Entwurf liegt lange:* Zeile in „Heute zu tun“ der Person, die ihn angefangen hat, nach 14 Tagen (Zeigarnik).
- *Zwei bearbeiten denselben Text:* Hinweis „inzwischen geändert, bitte neu laden“, statt still zu überschreiben (Karte 2a C9).
- *Platzhalter fehlt in einer Sprachfassung:* Chip „Platzhalter fehlt: Link“ an der Sprache, Veröffentlichen dieser Fassung gesperrt mit Satz.
- *Keine Rechte:* beide Rollen; „Automatisch übersetzen“ und „Als geprüft markieren“ nur Super Admin.
Zählwerte: Listen: 0 bis 1 Pillenreihe, Klicks bis Editor: 1. Editor: 1 farbiger + 1 Rand. Klicks bis Text geändert und online: 1 (Veröffentlichen; Speichern passiert von selbst). Zusammenführen: 3.
Abweichung von B: Ratgeber-Seiten ratgeber.html, ratgeber-*.html (6 Artikel) und Rechtstexte impressum.html, datenschutz.html, agb.html liegen in B als feste Dateien; sie werden Inhalte in der Datenbank mit demselben Seitengerüst (Plan: Sprachen und Inhalte). Kontaktformular-Danke app.js:911 wird ein Seitentext. Die Fachbereich-Kacheln kategorien.html bleiben, speisen sich aus den Fachbereichen hier.
3.20 Einstellungen (Super Admin; die Verwaltung sieht nur Verwaltungskonten): Funktionen · Bundesagentur · Übersetzung · KI · Fristen · Betrieb · Mail-Versand · Verwaltungskonten
Hauptaufgabe: Jede Einstellung in einem Satz verstehen, umschalten und die Folge sehen; nichts, was sich still auswirkt.
Hauptknopf: keiner. Jede Einstellung wirkt sofort beim Umschalten (Toast + Protokoll), gefährliche mit 10 Sekunden Rückgängig und einem Satz mit Folge. Einzige Ausnahme mit Knopf: Bundesagentur („Zertifikat speichern“), weil zwei Felder zusammengehören.
Aufbau (Desktop, Karten untereinander; am Handy dieselben Karten):
- Überschrift „Einstellungen“, darunter sieben Karten in dieser Reihenfolge (nach Häufigkeit, Regel 9; Chunking: 7, jede zugeklappt bis auf die erste):
- Funktionen (Plan: Freischaltungen): je Funktion eine Zeile mit Schalter und einem Satz, was sie tut und was passiert, wenn sie aus ist: Lebenslauf-Baukasten („aus: Bewerber bewerben sich nur mit eigener Datei“) · Bewerbungsmappe als PDF · Deckblatt-Auswahl · KI-Texte für Arbeitgeber (Standard aus, Plan) · Übersetzung der Anzeigen · Premium (als Funktion; je Firma unter Firmen und Nutzer) · Werbung · später: Statistik, Bewerberpool (erscheinen erst, wenn gebaut; kein „bald“). Ausschalten einer Funktion mit laufenden Daten zeigt die Folge vor dem Umschalten im Rückgängig-Toast: „PDF-Mappe aus. 14 Bewerber haben eine Mappe im Profil; sie bleibt gespeichert, Bewerben läuft mit eigener Datei. Rückgängig“. (Standard; Sichtbar; Plan: aus = verschwindet vollständig)
- Fristen: jede Frist als Zeile „Name · Wert · Standard · Zurück auf Standard“: Prüffrist neue Firma (1 Werktag) · Stellenlaufzeit (30 Tage) · Ablauf-Mail (5 Tage vorher) · Bewerbungsentwurf (7 Tage) · Bewerbung ohne Antwort der Firma abschließen (6 Monate) · Premium-Standardlaufzeit (30 Tage, Vorschlag) · Top-Plätze je Premium-Freischaltung (3, Vorschlag) · Papierkorb, Import-Rücknahme und Downloads (30 Tage, eine Frist) · Löschfristen: Bewerbungen 6 Monate nach Abschluss, Konten 24 + 3 Monate, Job-Alarme 12 Monate, Protokoll 12 Monate (Plan Sicherheit; der Kunde bestätigt, Mail Punkt 5). Änderung sofort, Satz mit Folge bei Löschfristen („gilt ab dem nächsten Nachtlauf, betrifft heute 23 Bewerbungen“), Rückgängig.
- Übersetzung: Sprachen als Schalter „live“ (DE fest, EN, TR, AR; zweite Welle RO, PL, UK, RU erscheinen erst, wenn Fassungen vorliegen) · Schalter „Anzeigen automatisch übersetzen“ · Zustand des Dienstes („Azure, Europa; letzte Übersetzung vor 4 Minuten ✓“, bei Störung Satz und Zeile in „Heute zu tun“) · „Übersetzung erneut starten“ für die fehlgeschlagenen (Zahl). Eine Sprache ausschalten: Satz mit Folge („TR aus: Sprachwahl zeigt TR nicht mehr, 212 übersetzte Anzeigen bleiben gespeichert“), Rückgängig.
- KI-Texte: Schalter (gleich wie in Funktionen, hier mit Details) · Modell (nur lesbar) · Verbrauch diesen Monat als Zahl (Anfragen, Kosten geschätzt) · Hinweistext, den Firmen am Knopf „Text von Bululu KI“ sehen (Seitentext-Link).
- Bundesagentur (Plan): Zustand oben als Satz („Letzte Übertragung heute 3:00, 48 Stellen ✓“ oder „fehlgeschlagen: Zertifikat abgelaufen“) · Zertifikat (.p12) hochladen · Kennwort eintragen (beides nie wieder angezeigt, nur „hinterlegt am 20.11.“, Plan) · Schalter „Übertragung aktiv“ · Übertragungs-Protokoll (letzte 10, mit Fehlertext aus der Schnittstelle in Originalwortlaut, weil Nomad ihn nachschlagen muss) · „Jetzt übertragen“. Ein Knopf „Speichern“ für Zertifikat + Kennwort gemeinsam.
- Betrieb: Mail (Warteschlange, Rückläufer heute, pausierte Adressen mit „wieder zulassen“) · Virenprüfung (Zustand, gesperrte Dateien) · Sicherung (letzte, Größe, „Wiederherstellungsprobe am …“) · Sitzungen („Alle Verwaltungssitzungen abmelden“) · Fehlerprotokoll (Link auf GlitchTip, Plan) · Wartungsseite („Wartung einschalten“ mit Ende-Zeit, Plan: Hinweisseite mit voraussichtlichem Ende; 10 Sekunden Rückgängig).
- Mail-Versand (nur Super Admin): Zustand des Versands in Sätzen (Server, Benutzer, „Kennwort hinterlegt“, Tagesgrenze, letzte Zustellung, Warteschlange), Felder Absenderadresse, Anzeigename, Antwortadresse, Knopf „Testmail an mich senden“. Die Zugangsdaten selbst stehen nicht hier (Plattform-Variablen); so kann ein Tippfehler den Kennwort-Link, mit dem jeder Ausgesperrte zurückkommt, nicht abschneiden.
- Verwaltungskonten: Liste Name · E-Mail · Stufe (Super Admin/Verwaltung) · zweiter Faktor ✓ · zuletzt angemeldet · „…“ (Stufe ändern, Kennwort-Link senden, Zweiten Faktor zurücksetzen, Entfernen; letztes Super-Admin-Konto nicht entfernbar; nie das eigene Konto). „Einladen“ (Rand): E-Mail + Stufe, Einladung per Link, Faktor-Einrichtung bei der ersten Anmeldung erzwungen. Herr Schiffke sieht dieselbe Karte mit nur seinen Kollegen (Stufe Verwaltung): Einladen und Entfernen (nicht das letzte Konto), kein Super-Admin-Konto in der Liste, statt Kennwort-Link und Faktor ein Satz „Ausgesperrt? Schreiben Sie an post@bululu.de“. (Hick: die Karte hat für ihn zwei Knöpfe, nicht sieben)
Was bewusst NICHT auf den Bildschirm kommt:
- Design-Einstellungen (Farben, Logo, Startseiten-Blöcke): Optik ist B, fest (Plan). Darkmode nicht zum Livegang (Plan).
- Server-Werte (Speicher, CPU), Datenbank-Zugang, Geheimnisse: gehören in den Server, nicht in eine Oberfläche (Plan: Geheimnisse nie im Projekt).
- „Speichern“-Knöpfe außer bei Bundesagentur.
- Alles hier außer Verwaltungskonten für die Stufe Verwaltung: nicht ausgegraut, nicht vorhanden (Plan, Bedienregel „kein Menüpunkt für etwas, das es nicht gibt“ sinngemäß).
Zustände:
- *Keine Rechte:* Herr Schiffke sieht in Einstellungen nur Verwaltungskonten; die anderen Karten gibt es für ihn nicht. Nur eine direkt aufgerufene Aktion antwortet „Dafür ist der Betreiber zuständig. Zur Übersicht“ (Plan: Keine Rechte mit Weg zurück); eine direkt aufgerufene Super-Admin-Seite antwortet wie eine Seite, die es nicht gibt (404).
- *Dienst gestört (Azure, Mail, Virenprüfung):* Satz in der Karte und Zeile in „Heute zu tun“, kein roter Balken oben.
- *Zertifikat läuft ab:* 30 Tage vorher Zeile in „Heute zu tun“ (Verlust).
- *Leer:* Verwaltungskonten mindestens eins (der Erste), sonst keine leeren Listen hier.
Zählwerte: Knöpfe: 0 farbige, 1 „Speichern“ (Bundesagentur), 1 „Einladen“. Entscheidungen je Einstellung: 1. Klicks bis Funktion umgeschaltet: 1.
Abweichung von B: nicht vorhanden in B. Bausteine: Karten (box), Schalter im Stil der B-Haken (check), Zeilen. Die Sprachwahl im Kopf der öffentlichen Seiten (B zeigt acht Sprachen) liest ab hier nur die live geschalteten (Plan, Vorbild 3.1).
3.21 Werbekunde: Werbung planen (Konfigurator aus B, ohne Preise)
Hauptaufgabe: In drei Minuten sehen, wo die eigene Werbung stehen würde, und eine Anfrage abschicken, ohne ein Format kennen oder ein Motiv haben zu müssen.
Hauptknopf: je Schritt genau einer; am Ende „Unverbindlich anfragen“ (B konfigurator.js:679, Wortlaut bleibt: Ohne Preis ist „unverbindlich“ die Zusage, die der Werkzeughaus-Inhaber braucht).
Einstiege (bleiben aus B): arbeitgeber.html:220 bis :231 Block „Werbung auf Bululu“ mit Knopf „Werbung planen“ (:228) · Fußzeile „Werbung schalten“ (:293) · das Eigenmotiv einer freien Fläche, das auf „Werbung planen“ verlinkt und den Konfigurator mit der passenden Fläche öffnet (konfigurator/EINBAU.md Abschnitt 4.4, data-flaeche); eine leere Werbefläche oder einen Platzhaltersatz gibt es nicht (3.18). Der Block auf „Für Arbeitgeber“ steht unter dem Ausprobier-Formular und über dem Kontakt: Werbekunden sind nicht die Hauptzielgruppe der Seite, aber sie müssen den Weg in zehn Sekunden finden (Fußzeile reicht nicht allein).
Grundform: Fenster über der Seite (B wk-Dialog), am Handy bildschirmfüllend, ✕ und Esc. Zwei Stufen wie B (renderStufen :368): 1 Auswählen · 2 Anfragen. Innerhalb von Stufe 1 vier Fragen untereinander in fester Reihenfolge, jede als eigener Block mit Überschrift als Frage (B hat die Blöcke wk-schritt :392 bis :400); rechts (Desktop) die Nachbildung der Bululu-Seite mit markierter Fläche (B wk-buehne :409). Fortschritt als Satz im Fuß: „Noch: Zeitraum“, nie „Schritt 2 von 5“. (Gradient; Erkennen)
Frage 1 „Wo soll Ihre Werbung erscheinen?“
- Sechs Flächen als Karten mit Skizze (B
skizze():441) und Kundenwörtern (Bkurz-Texte:51ff. sind gut und bleiben): „Startseite: großes Banner unter der Suche“ · „Trefferliste: Anzeige zwischen den Stellen“ · „Suchbegriffe: Anzeige nur bei Ihren Begriffen (z. B. „Schweißer“)“ · „Seitenleiste: rechte Spalte der Trefferliste, nur am Computer“ · „Stellenseite: neben der Anzeige“ · „Ratgeber: über den Artikeln“. Klick markiert die Fläche in der Nachbildung und scrollt dorthin. Standard: die Fläche, aus der der Nutzer kam (data-flaeche), sonst Startseite vorgewählt (Standard: eine Wahl weniger). - Darunter ein Satz nur bei Suchbegriffen: Eingabe als Chips, höchstens 5 (B
:469ff.). - Ohne Preisangabe an der Karte (B zeigt „ab 290 €“,
:458).
Frage 2 „Welches Format?“ wird nicht gefragt, sondern beantwortet: „Ihr Motiv: 970 × 250 Pixel (Computer und Tablet) und 320 × 100 Pixel (Handy). Kein fertiges Motiv? Schicken Sie uns Logo und Text, wir gestalten es.“ Das ist eine Zeile unter der gewählten Fläche, keine Entscheidung (Tesler: das System kennt die Formate, der Kunde nicht). Geräte-Haken (B renderGeraete :489 ff. mit Preisanteil-Tooltip :496) wandern hinter einen Textlink „Nur bestimmte Geräte“ (Offenlegung; der Normalfall ist „überall“). Position in der Trefferliste (B drei Radios :505 ff.): zwei Pillen „nach dem vierten Treffer“ (Standard) · „ganz oben“; „weiter unten“ entfällt, weil es nur als billigere Wahl Sinn hatte. (Hick)
Frage 3 „Wann?“: Laufzeit als Pillen 7 · 14 · 30 Tage (B :519 ff., Standard 14 wie B :179), ohne „Ersparnis“-Prozent (:523). Dazu neu: Wunsch-Start (Datum, Standard: nächster Montag, frühestens in 3 Werktagen) und der Satz „Zeitraum ist ein Wunsch; wir bestätigen ihn im Angebot.“ (Sichtbar: der Kunde weiß, was verbindlich ist)
Frage 4 „Ihr Motiv“: je Format eine Ablage mit Maßen (B motivSlot :592 ff.; Dateitypen JPG, PNG, WebP, GIF :107; Größenhinweis :604), Vorschau sofort in der Nachbildung. Darunter als gleichwertige zweite Karte „Später per E-Mail schicken“ (vorgewählt, wenn nichts hochgeladen ist; nie eine Sperre). Für Textanzeigen (Trefferliste, Suchbegriffe): vier Felder Firma · Überschrift · Text · Knopftext mit Zeichengrenzen und Beispiel als Platzhalter (B NATIV_BEISPIEL :100 ff.), Live-Vorschau in der Liste. Maße passen nicht: Satz, keine Sperre („Ihr Bild ist 800 × 200 Pixel, die Fläche braucht 970 × 250. Wir passen es an, oder Sie laden ein anderes hoch.“; Bedienregel 4: warnen statt sperren).
Fuß (Stufe 1): links „Ihre Auswahl: 1 Platz“ (B „Warenkorb: n Plätze · 290 €“ :661; „Warenkorb“ heißt Kauf, hier wird angefragt, darum „Ihre Auswahl“, Jakob), Fortschrittssatz; rechts „Weiter zur Anfrage“ (farbig) und „Weitere Fläche hinzufügen“ (Text; B hat „In den Warenkorb“ als Hauptknopf :666 und „Weiter zur Anfrage“ als Rand :667, das kehrt sich um: Der Normalfall ist eine Fläche). Preiszeile „Dieser Werbeplatz: 290 €“ (:657) und Hinweis „Preise netto, unverbindlich“ (:650) entfallen (Plan).
Stufe 2 „Ihre Anfrage“ (B renderPruefen :1016 ff.):
- Zusammenfassung als Liste je Posten (B
wk-pliste), ohne Betrag (:1023), mit Miniatur und „Bearbeiten“. - Kontakt: Firma · Ansprechpartner · E-Mail (B
:1044bis:1046) + Telefon (freiwillig) neu: Der regionale Betrieb will angerufen werden, und die Verwaltung klärt Preis und Motiv am schnellsten am Telefon (Jakob: so läuft Anzeigenverkauf) · Nachricht (freiwillig, eingeklappt) · Haken „Ich bin einverstanden, dass Bululu meine Angaben zur Bearbeitung der Anfrage speichert“ mit Datenschutz-Link (fehlt in B; die Kontaktseite hat ihn,kontakt.html:162). - Unter dem Formular die Zusage als Satz vor dem Knopf: „Sie bekommen innerhalb eines Werktags ein Angebot per E-Mail oder einen Anruf. Unverbindlich, keine Kosten.“ (Vertrauen: die fehlende Zahl wird durch eine Zusage mit Frist ersetzt)
- „Unverbindlich anfragen“ (farbig, B
:679), „Zurück“ (Rand). Während des Sendens gesperrt (Plan). Summe im Fuß (:673) entfällt.
Danke (B renderDanke :1080 ff.): Haken, „Danke für Ihre Anfrage.“ (bleibt), Satz neu: „Wir melden uns innerhalb eines Werktags mit einem Angebot. Eine Bestätigung mit Ihrer Auswahl ist unterwegs an info@werkzeughaus-kemper.de.“ (B: „Wir melden uns mit Angebot und Freigabe des Motivs.“ :1085, ohne Frist, ohne Bestätigung). Darunter Ansprechpartner mit Telefon (wie arbeitgeber.html:239 bis :245). Knöpfe: „Schließen“ (farbig) · „Weitere Fläche anfragen“ (Text). (Peak-End)
Handy: Fragen untereinander, Nachbildung nicht daneben, sondern über einen Rand-Knopf „So sieht es aus“ bildschirmfüllend (Gerät Handy vorgewählt, Umschalter Computer/Tablet oben). Hauptknopf unten fest. (Daumen)
Was bewusst NICHT ins Fenster kommt:
- Preise, Rechenweg-Tooltips, Rabatte, Gerätanteile, Ersparnis (B
PREISE:23ff.,berechne:123ff.,:458,:496,:523,:650,:657,:661,:673,:1023,:1071): Plan, bis echte Preise feststehen. Keine Platzhalter („Preis auf Anfrage“ an jeder Karte); der eine Satz in Stufe 2 reicht. - Konto, Anmeldung, Kundenbereich (Plan: bewusste Ausnahme).
- Fachbegriffe Billboard, Half Page, Leaderboard, Native (B
formate.name:53ff.): nur Maße und Alltagswörter. Für die Verwaltung bleiben die Fachnamen in 3.18. - „Alle Posten zeigen“-Umschalter in der Nachbildung (B
alleAn:722): nur, wenn mehr als ein Posten gewählt ist. - Zwei farbige Knöpfe im Fuß.
Zustände:
- *Angefangen und geschlossen:* Auswahl bleibt im Browser (B
localStorage:106,:217ff.); beim nächsten Öffnen oben die Zeile „Sie haben eine Planung angefangen: Startseite, 14 Tage. Weiter oder Neu beginnen“. (Zeigarnik) - *Datei zu groß / nicht lesbar:* Satz an der Ablage (B
meldung:633), Eingaben bleiben. - *Netzfehler beim Senden:* Eingaben bleiben, „Erneut senden“ (Plan).
- *Fläche von der Verwaltung abgeschaltet:* Karte fehlt (kein „nicht verfügbar“).
- *Leere Auswahl in Stufe 2:* „Noch nichts ausgewählt. Zurück“ (B
:1028, bleibt). - *Spamschutz:* unsichtbare Falle und Bremse (Plan), nie ein Bild-Rätsel.
Zählwerte: gleichwertige Knöpfe je Stufe: 1 farbig + 1 Text/Rand · Entscheidungen bis zur Anfrage: 2 (Fläche, Laufzeit; Format abgeleitet, Start vorbelegt, Motiv mit Standard „später“) · Klicks bis gesendet: 5 (Fläche, Laufzeit, Weiter, Felder + Haken, Anfragen); B: 6 plus Preise lesen.
Abweichung von B (zusammengefasst, alle in gemeinsam/konfigurator/konfigurator.js): Preise raus (:23 bis :37, :123 bis :152, :458, :496, :523, :650, :657, :661, :673, :1023, :1071) · Flächen-Karten ohne „ab …“ (:455 ff.) · Format als Satz statt Geräte-Haken, Geräte hinter Textlink (:489 ff.) · Position zwei Pillen (:505 ff., POSITIONEN :93 ff. ohne „unten“) · Wunsch-Start neu bei Laufzeit (:519 ff.) · „Später per E-Mail“ als Karte in Motiv (:544 ff.) · Fuß: „Ihre Auswahl“, Hauptknopf „Weiter zur Anfrage“, „Weitere Fläche“ als Text (:647 bis :668) · Stufe 2: Telefon, Nachricht, Datenschutz-Haken, Zusage-Satz (:1016 ff., pruefeKontakt :1055 ff.) · Danke-Text mit Frist und Bestätigungs-Mail (:1084 bis :1085) · Handy: Nachbildung hinter Knopf (wk-buehne :409) · Sendung geht an den Server (B: nur localStorage, :1068 ff.) · konfigurator/EINBAU.md Abschnitt 5 „Preise ändern“ wird gestrichen, nicht ergänzt (Ändern heißt ersetzen).
3.22 Werbekunde: nach der Anfrage (Bestätigung · Angebot · Motiv · Start · Ende mit Klickzahlen)
Der Werbekunde hat nach der Anfrage keinen Bildschirm mehr, nur Mails (Plan: Abstimmung per Mail, Änderung und Storno per Mail, Klickzahlen am Ende per Mail). Mails sind darum hier Bildschirme: Jede hat eine Aufgabe, einen Hauptknopf (oder keinen) und einen Zustand, den sie sichtbar macht. Alle Mails kommen von einer Adresse @bululu.de, mit Namen und Telefon des Ansprechpartners in der Signatur, antwortbar (Antwort geht an die 3BS-Adresse und erscheint nicht im System; Plan). Wortlaut je Mail liegt in Inhalte › Mailvorlagen (3.19) und ist änderbar.
M1 Eingangsbestätigung (sofort, automatisch):
- Betreff: „Ihre Werbeanfrage bei Bululu ist angekommen“.
- Inhalt: Dank in einem Satz · die Auswahl als Liste in Kundenwörtern (Fläche, Zeitraum als Wunsch, Motiv „hochgeladen“ oder „folgt“) · das Vorschaubild der Nachbildung mit markierter Fläche (dasselbe Bild wie im Fenster; für den Inhaber, der die Mail dem Kollegen weiterleitet, ist das Bild die Erklärung) · Zusage „Wir melden uns innerhalb eines Werktags mit einem Angebot“ · Ansprechpartner mit Telefon · Satz „Sie möchten etwas ändern? Antworten Sie einfach auf diese E-Mail.“
- Kein Knopf. (Peak-End für den Moment nach dem Senden: Zweifel „ist es angekommen?“ wird in derselben Minute beantwortet, wie beim Bewerber 5.1)
M2 Angebot (von der Verwaltung aus der Kampagne, 3.18):
- Betreff: „Ihr Angebot: Werbung auf Bululu, 3. bis 16.11.“
- Inhalt: Posten mit Fläche, Zeitraum (bestätigt oder Alternative mit Grund „im Wunschzeitraum belegt“), Preis netto je Posten und gesamt, Laufzeit · die Maße des Motivs noch einmal, wenn es fehlt · eine Handlung: „Antworten Sie mit „Ja“ oder rufen Sie an: 0203 …“ (Hick: kein Formular, kein Link, kein Konto) · Gültigkeit des Angebots (14 Tage) · AGB-Link.
- Zustand im System: Angebot; die Verwaltung markiert „angenommen“ nach dem Ja.
M3 Motiv (zwei Fassungen, nur wenn nötig):
- *Motiv fehlt (Erinnerung, einmal, 5 Werktage vor Start):* Betreff „Ihr Motiv für den Start am 3.11.“, Maße, Dateitypen, Satz „Oder schicken Sie Logo und Text, wir gestalten das Motiv“ · Antwort mit Anhang an diese Mail. Kein Upload-Link zum Livegang (Plan: per Mail; ein signierter Upload-Link ohne Konto ist in Abschnitt 7 Punkt 15 als spätere Ergänzung notiert).
- *Änderung nötig (aus „Änderung anfordern“ 3.18):* Betreff „Eine Änderung an Ihrem Motiv“, der eine Grund als Satz mit Maßen, Angebot „wir passen es an“, Antwort an diese Mail. Nie zwei Gründe auf einmal, nie „abgelehnt“. (5.17)
M4 Startbestätigung (automatisch, am Starttag, W04):
- Betreff: „Ihre Werbung läuft jetzt auf Bululu“.
- Inhalt: Zeitraum · Vorschaubild mit dem echten Motiv in der Fläche · Link auf die Seite, wo sie erscheint (bei Suchbegriffen: Link auf die Suche mit dem Begriff, damit der Kunde sie findet; sonst sucht er und findet sie nicht, und das Vertrauen ist weg) · „Zwischenstand gewünscht? Antworten Sie auf diese E-Mail.“ (Sichtbar; Vertrauen: der Kunde kann selbst nachsehen)
M5 Ende mit Klickzahlen (automatisch, am Tag nach dem Ende; Plan):
- Betreff: „Ihre Werbung auf Bululu: 1.240 Einblendungen, 38 Klicks“. Die Zahlen stehen im Betreff, weil das die Frage ist, die der Kunde hat, und weil die Mail dann auch ungeöffnet ihre Arbeit tut.
- Inhalt: je Posten Einblendungen · Klicks · Klickrate · Zeitraum, als Tabelle; ein Satz Einordnung nur mit echten Vergleichswerten aus mindestens zehn Kampagnen („Bululu-Durchschnitt: 2,1 %“), vorher kein Satz (Vertrauen, keine erfundenen Zahlen) · eine Handlung: „Verlängern oder wiederholen? Antworten Sie auf diese E-Mail oder rufen Sie an.“ · Dank.
- Kein Diagramm, kein PDF-Anhang zum Start; die Tabelle ist die Auswertung. (Peak-End: der letzte Kontakt ist eine Zahl und ein einfacher nächster Schritt)
M6 Rechnung: nicht aus dem System; 3BS stellt sie getrennt (Annahme, Abschnitt 7 Punkt 14). In M2 steht darum „Die Rechnung erhalten Sie von 3BS nach dem Start.“
Storno und Änderung: per Antwort auf eine der Mails (Plan). Die Verwaltung trägt es in der Kampagne ein (3.18 „…“ → Stornieren / Zeitraum ändern), der Kunde bekommt eine kurze Bestätigung aus der Vorlage „Änderung bestätigt“.
Was bewusst NICHT geschickt wird:
- Werbemails an Werbekunden („Jetzt wieder buchen“) ohne Anlass: nur M5 trägt den einen Satz.
- Mails mit zwei Handlungen („Ja klicken oder Formular ausfüllen oder anrufen“).
- Zwischenstände von sich aus: nur auf Antwort; sonst wird die Zahl zum Druckmittel.
- Rechtstexte in voller Länge in der Mail: Links reichen.
Zustände: Mail kommt zurück (Rückläufer, Plan) → Zeile in „Heute zu tun“: „Mail an Werkzeughaus Kemper nicht zustellbar, Telefon: …“ → „Anrufen“ (nur Information mit Nummer). Kunde antwortet nicht auf M2 nach 5 Werktagen → Zeile „Angebot ohne Antwort“ in Werbung › Braucht Aufmerksamkeit; nach 14 Tagen verfällt das Angebot still (kein Mahn-Mailing), Kampagne unter Beendet als „nicht angenommen“.
Zählwerte: Handlungen des Kunden von Anfrage bis laufender Kampagne: 2 (Unverbindlich anfragen, „Ja“ antworten; Motiv ggf. als dritte). Mails insgesamt im Normalfall: 4 (M1, M2, M4, M5).
Abweichung von B: In B endet der Konfigurator mit dem Danke-Zustand (konfigurator.js:1080 ff.); Mails gibt es nicht. Wortlaute kommen in die Mailvorlagen (3.19). Das Vorschaubild in M1 und M4 entsteht aus derselben Nachbildung wie im Fenster (serverseitig gerendert, Plan: PDF-Chromium ohne Netz kann auch das Bild liefern).
3.23 Kurz: drei weitere Bildschirme, die mit den obigen zusammenhängen
Anmelden (anmelden.html): Die Rollenwahl „Ich bin Bewerber / Arbeitgeber“ (anmelden.html:111 ff.) entfällt beim Anmelden: Ein Konto ist ein Konto (Plan: eine Mail-Adresse, Wechsel im Konto-Menü). Beim Registrieren gibt es zwei getrennte Wege mit je eigener Seite: „Konto anlegen“ (Bewerber, meist aus dem Bewerben-Fenster) und „Firma registrieren“ (vom Knopf „Stelle inserieren“, eigenes Formular in zwei Blöcken: „Ihr Betrieb“ mit Firmenname, Straße, PLZ, Ort, Telefon und „Ihr Zugang“ mit Name, E-Mail, Kennwort, Zustimmung; Plan, Chunking). Die Haken-Liste links („Bewerber: … Arbeitgeber: …“, :98 ff.) wird ein Satz. Der Info-Kasten zum zweiten Faktor (:139) fällt weg (Erklärtext; der zweite Faktor wird in den Einstellungen und nach der ersten Firmenanmeldung angeboten). Hauptknopf: „Anmelden“. Entscheidungen: 0 statt 2.
Für Arbeitgeber (arbeitgeber.html): Der Pakete-Block mit drei Karten (:113 ff.) entfällt zum Livegang (Plan: nur „kostenlos“ und „Premium auf Anfrage“) und wird zwei Sätzen mit einem Knopf. Im Kopfbereich bleibt ein farbiger Knopf „Stelle kostenlos inserieren“; „Beratung anfragen“ wird Textlink zum Kontakt-Block. Das Ausprobier-Formular (:188) bleibt, es ist der stärkste Einstieg (Zeigarnik: wer drei Felder gefüllt hat, registriert sich). Werbung (:220): „Werbung planen“ als Rand-Knopf (D-14, entschieden 26.10.: für Betriebe, die inserieren, ist Werbung eine Nebenaufgabe) öffnet die Planung (3.21).
Werbung planen (öffentlich, Konfigurator aus B): siehe 3.21.
3.24 Ergänzungen vom 26.10. (Bedienung der Teile, die nach dem 22.10. in die Karten kamen)
Entscheidungen: alle 13 Änderungen an B und beide Zusatzfunktionen übernommen. D-2 „Anmelden“ bleibt orange · D-3 Teaser-Textlink (3.1) · D-4 Stadt-Chips in der Filter-Spalte (3.2) · D-5 letzter Reiter am Handy angeschnitten sichtbar (A.1) · D-6 Merkliste: die Zeile öffnet die Stelle, das gefüllte Herz ist „Entfernen“ mit Rückgängig, „Jetzt bewerben“ nur als Rand-Knopf an Stellen, die bald ablaufen (Karte 1b 1.9) · D-7 Merkliste: der Hinweis „Ohne Konto …“ ist eine Zeile ganz unten mit Textlink „Konto anlegen“, kein Kasten · D-8 Fußzeile ohne „Cookie-Einstellungen“ (ein Fenster ohne Wahl), der Cookie-Hinweis bleibt (A.1) · D-9 Social-Symbole erst, wenn die Profile da sind · D-10 „Lebenslauf hinterlegen“ erst ab Abschnitt 2b · D-11 Fachbereiche: Spaltenzahl je Breite so, dass keine Kachel allein steht (bei 10 Fachbereichen 2 statt 3 Spalten; Karte 1b 1.1) · D-12 Über uns: drei Abschnitte Wer wir sind, Fachbereiche, Ansprechpartner (Karte 1b 1.7) · D-13 Ratgeber-Titel „Bewerben ohne Anschreiben: Datei oder Foto reicht“, das Wort „Kurzbewerbung“ fällt (Karte 1b 1.5) · D-14 „Werbung planen“ als Rand-Knopf (3.23) · N-1 „Kennwort vergessen?“ im Bewerben-Fenster sendet den Link sofort und führt zurück in die Stelle mit offenem Fenster (3.4, Annahme Karte 2a C34) · N-2 Fotos und Logos verkleinert der Browser des Nutzers vor dem Hochladen, der Server prüft nur Typ, Größe, Maße und Viren · Entfernung „{n} km“ in der Stellenzeile, sobald ein Ort gesucht wurde (3.2, Karte 1a A28). COPLA stellt selbst ein: kein Hinweis an COPLA-Anzeigen.
Die Karten sind die Bauvorlage; hier steht nur, was die Bedienung betrifft, mit der Stelle in der Karte. Alle Teile folgen den Grundregeln aus Abschnitt 2 (ein Hauptknopf, Rückgängig statt Nachfrage, Folgen-Satz, Fokus an der Stelle des gedrückten Knopfes).
- Papierkorb für Firma und Bewerber (Karte 2a 1.17, H131 bis H134): „Löschen“ fragt nicht nach, sondern legt in den Papierkorb und zeigt den Rückgängig-Toast (10 s, Einstellung nach A.6). Der Link „Papierkorb ({n})“ steht klein am Ende der Liste, nicht im Hauptmenü. Im Papierkorb je Zeile „Wiederherstellen“ (Hauptweg, Rand) und „Endgültig löschen“ (Textlink); „Papierkorb leeren“ ist der einzige Knopf mit Fenster, weil es keinen Rückweg gibt. Zeilen tragen das Datum „weg am {datum}“ (30 Tage, dann von selbst endgültig). Recruiter sehen nur eigene Notizen. Leerzustand: „Der Papierkorb ist leer.“ ohne Knopf. Derselbe Aufbau bei der Verwaltung (3.17).
- Pausierte Stellen (Karte 2a 1.11 Nr. 1 und 4, C24): abgelaufene Stellen heißen für den Betrieb „Pausiert“ (Chip mit 1-px-Rahmen, Regel vom 15.10.), stehen in der eigenen Gruppe „Pausiert“ und haben „Verlängern“ als Zeilen-Knopf, beliebig oft, ohne Fenster, Toast „30 Tage verlängert“. In „Braucht Aufmerksamkeit“ nur in den ersten 14 Tagen; danach kein Drängen. Für Besucher ist die Stelle weg (410 mit Job-Alarm-Angebot, 3.3).
- Sperrliste (Karte 3 1.15, H136; ersetzt „Adresse sperren“ in 3.16 und 3.17): ein Ort für IP-Adresse, IP-Bereich, E-Mail-Adresse und Mail-Domain, erreichbar über den Textlink „Sperrliste ({anzahl})“ rechts oben in Firmen und Nutzer und über „Zur Sperrliste“ hinter „…“ einer Anfrage. Eintrag im kleinen Fenster (Art, Wert, Grund, Frist 7/30/90 Tage; „unbefristet“ und IP-Bereiche nur Super Admin), Knopf „Sperren“. Beim Sperren einer Firma oder eines Bewerbers ein Haken „Auch die zuletzt genutzten IP-Adressen sperren“, nicht vorgewählt. Gesperrte Nutzer sehen eine neutrale Meldung ohne Grund (T fehler.gesperrt.neutral). 3BS kann alles außer IP-Bereiche und unbefristet.
- Zweiter Faktor: App oder E-Mail-Code (Karte 2a 1.2, 1.9 Nr. 4, H137, H138): zwei Pillen „Authenticator-App (empfohlen)“ und „Code per E-Mail“ mit je einem Satz; der Code-Schritt bei der Anmeldung hat ein Feld, einen Hauptknopf „Bestätigen“, darunter „Code erneut senden“ (nach 60 s, mit Zähler) und „Wiederherstellungscode nutzen“ als Textlinks. „Auf App umstellen“ bleibt in den Einstellungen sichtbar, solange E-Mail gewählt ist. Verwaltung nur App (D34), ohne Wahl.
- Neues Gerät, Kennwortbestätigung, Kennwort-Regeln (Karte 2a H139 bis H141): Mail A13 „Neue Anmeldung bei Ihrem Konto“ mit einem Knopf „Das war ich nicht“; die Zielseite hat genau ein Ziel (neues Kennwort). Vor heiklen Aktionen ein kleines Fenster „Zur Sicherheit: Ihr Kennwort“ mit einem Feld und „Weiter“, gilt 5 Minuten, ersetzt die bisherigen Kennwortfelder in den Lösch-Fenstern. Kennwort: Länge 10 bis 128 statt Sonderzeichen; nach 3 Fehlversuchen wird „Kennwort vergessen?“ hervorgehoben, keine Kontosperre, nur Wartezeit.
- Prüfstufe „ohne Prüfung“ (Karte 3 D25, H124, H125): in der Firmenansicht der Verwaltung eine Auswahl „Prüfstufe: normal · ohne Prüfung“; Umschalten auf „ohne Prüfung“ nur mit Grund und Mail F10 an die Firma, Protokoll. Für den Betrieb ändert sich nur, dass neue Stellen sofort aktiv sind.
- Firma anlegen durch die Verwaltung, Mitarbeiter-Konten (Karte 3 D26, H126, H127; Karte 2a 1.14 Nr. 2): Verwaltung: „Firma anlegen“ mit vier Feldern und einem Knopf „Anlegen und Einladung senden“; Dublette (Name + PLZ) wird am Feld gemeldet. Firmen-Admin: „Mitarbeiter anlegen“ mit Vorname, Nachname, E-Mail, Rolle (Admin · Recruiter) als zwei Pillen; die Einladung geht per Mail, die Zeile zeigt „eingeladen, wartet“ mit „Zurückziehen“ als Textlink.
- E-Mail-Adresse ändern (Karte 3 1.4a, H135): nur über die Verwaltung (Eintrag im „…“ des Nutzers, Mail an die alte und die neue Adresse); Bewerber und Firmen sehen ihre Adresse in den Einstellungen nur lesend mit dem Hinweis auf den Kontaktweg, kein totes Feld (Selbstbedienung kommt mit 2b.8).
- Befristung und mehrere Beschäftigungsarten (Karte 2a 1.11 Nr. 2, C28): Beschäftigungsart als vier Pillen mit Mehrfachwahl, Vollzeit vorgewählt; Befristung als zwei Pillen „unbefristet · befristet“ ohne Vorwahl, Datumsfeld erscheint erst bei „befristet“. In der Anzeige eine Zeile in den Eckdaten, kein Filter (3.2 bleibt).
- Hilfe-Artikel (Karte 1b 1.8 Nr. 2, Karte 3 D32): „Hilfe für Bewerber“ und „Hilfe für Betriebe“ sind Ratgeber-Artikel mit Rubrik „Hilfe“, verlinkt aus dem Konto-Menü und der Kontaktseite; keine eigene Hilfe-Oberfläche, kein Chat.
- KI-Kennzeichnung (Karte 1b 1.12, H144): nur echte KI-Bilder tragen die kleine Marke „KI-generiert“ unten rechts im Bild (wie Dynora), Stock-Bilder nicht. Maschinell übersetzte Anzeigen zeigen über dem Text den Satz „Mit KI übersetzt. Verbindlich ist die deutsche Fassung.“ mit dem Umschalter „Deutsch zeigen“ / „Übersetzung zeigen“ an Ort und Stelle, ohne Neuladen; der deutsche Titel steht klein darunter. Fehlt die Übersetzung noch, steht der deutsche Text mit „Noch nicht übersetzt“ (B.7).
4. Übersichtsseiten: der gemeinsame Aufbau
Alle drei Login-Startseiten (Bewerber 3.5, Firma 3.8, Verwaltung 3.13) folgen demselben Muster, damit ein Mensch, der zwei Rollen hat (Plan: ein Konto, Wechsel im Menü), nichts neu lernt (Jakob, Shneiderman: Einheitlichkeit):
Kopf (Logo · Reiter · Konto-Knopf rechts)
Bereichs-Kopf: Name (H1) · rechts höchstens ein Dauer-Knopf, nur als Rand-Knopf (nur Firma: „Neue Stelle“; am Handy in der Leiste unten)
1. „Jetzt wichtig“ / „Heute zu tun“ ← Sätze mit Knopf, nach Dringlichkeit, höchstens 5
2. Das eigene Ding ← Bewerber: letzte Bewerbungen · Firma: Stellen · Verwaltung: Zahlen
3. Leises ← Gemerkt · Premium-Hinweis · Protokoll (eingeklappt)
Unterseiten (jeder Reiter, jedes geöffnete Ding): über der H1 die Zeile „‹ Übersicht“
← dasselbe Muster wie die Brotkrumen der Stelle (B stelle.html)
Rückweg zur Übersicht: Eine Überschrift sieht nicht wie ein Link aus, und das Logo führt auf die öffentliche Startseite. Deshalb steht in allen drei Bereichen auf jeder Unterseite über der H1 die Zeile „‹ Übersicht“, und „Mein Bereich“ steht im Konto-Menü auf allen Seiten, nicht nur auf den öffentlichen. Kein neuer Menüpunkt. (Jakob, Erkennen statt Erinnern)
Warum „Was ist zu tun“ vor Zahlen: Eine Zahl ist ein Zwischenergebnis, das der Mensch erst in eine Handlung übersetzen muss („2 neue Bewerbungen“ → „also klicke ich auf Bewerbungen und suche die neuen“). Ein Satz mit Knopf hat diese Übersetzung schon erledigt. Für Herrn Peters mit fünf Minuten und für Ahmet mit mäßigem Deutsch ist diese Übersetzung die eigentliche Hürde, nicht der Klick. Zahlen sind für die Verwaltung sinnvoll (Fragebogen 1.5), aber auch dort erst nach den Aufgaben, weil Aufgaben Fristen haben und Zahlen nicht.
Regeln für die Aufgabenliste:
- Jede Zeile: Subjekt (wer/was) · Zustand (was ist passiert) · seit wann · genau ein Knopf oder kein Knopf (reine Information verschwindet nach dem Ansehen).
- Reihenfolge fest kodiert nach Dringlichkeit, nicht wählbar: Blockierendes (E-Mail bestätigen) → mit Frist (Einladung, Ablauf, Prüfung) → wartend auf mich (Nachricht, neue Bewerbung) → Hinweis ohne Frist (Logo fehlt).
- Höchstens 5 Zeilen; die sechste wird „und 3 weitere“ mit Link in den zuständigen Reiter. (Chunking)
- Leer ist ein Satz, der sagt, wer den nächsten Zug hat, und wann etwa (siehe 5.4).
- Keine Zeile für etwas, das der Nutzer nicht ändern kann (keine „Ihre Bewerbung wurde noch nicht geöffnet“ als Mahnung).
4a. Die Verwaltungs-Übersicht im gemeinsamen Muster (Ergänzung zu Abschnitt 4)
Das Muster aus Abschnitt 4 gilt unverändert; die Verwaltung füllt es so:
Kopf (Logo · Prüfen · Anfragen · Firmen und Nutzer · Werbung · Inhalte · [Einstellungen] · Konto-Knopf) Bereichs-Kopf: „Verwaltung“ · Rollenname · kein Dauer-Knopf 1. „Heute zu tun“ ← nach Frist, älteste zuerst, höchstens 5, Betriebs-Zeilen nur Super Admin 2. Das eigene Ding ← Zahlen (5 Werte, Arbeitgeber und Bewerber zuerst) 3. Leises ← „Seit Ihrem letzten Besuch“ (eingeklappt)
Zusätzliche Regel nur hier: Jede Mail an die Verwaltung verlinkt in die Aufgabe, nie auf die Übersicht. Herr Schiffke kommt aus der Mail, erledigt die eine Sache und geht; die Übersicht sieht er, wenn er „Zurück“ drückt. Für den Super Admin spart es den einen Klick, der sich zwanzigmal am Tag wiederholt. (Jakob: so machen es Ticket-Systeme; Shneiderman: Abkürzung)
5. Die psychologischen Momente, die über Bululu entscheiden
Diese Momente werden erinnert (Peak-End). Sie sind wichtiger als jede Startseite.
5.1 Direkt nach dem Bewerben (Bewerber)
- Gefühl: Erleichterung, dann sofort Zweifel: „Ist es wirklich weg? Habe ich alles richtig gemacht?“
- Was der Bildschirm tut: Ein Haken, ein Satz mit dem Namen der Firma („angekommen bei Metallbau Hagedorn“), ein Satz, was als Nächstes passiert und wer es tut, ein Knopf „Meine Bewerbungen“. Dort steht die Bewerbung sofort mit Chip „Angekommen“. Die E-Mail kommt in derselben Minute mit demselben Wortlaut (ein Wort = ein Ding, Bedienregel 3).
- Fehlerfall: gibt es hier nicht mehr: Die Adresse ist seit dem Code in Schritt 1 bestätigt, „angekommen“ stimmt immer (26.10., Karte 2a C36). Scheitert der Code (5 falsche Eingaben, 10 Minuten vorbei), sagt Schritt 1 das an Ort und Stelle mit „Code erneut senden“.
- Nicht: „Unterwegs“, „in Bearbeitung“, Prozent, Konto-Werbung, weitere Stellen als Erstes (das wirkt, als sei die Bewerbung nichts wert).
5.2 Warten auf Antwort (Bewerber)
- Gefühl: Nach drei Tagen Stille entsteht das Bild „die haben mich aussortiert“ oder „es ist nicht angekommen“. Beides führt zu Doppelbewerbungen oder Resignation.
- Was der Bildschirm tut: Zeitstrahl in der geöffneten Bewerbung; der Schritt „Vom Betrieb geöffnet“ wird sichtbar, ohne Mail (Plan: „Gesichtet“ meldet nichts), aber als Zeile „Ihre Bewerbung bei X wurde geöffnet“ in „Jetzt wichtig“ beim nächsten Besuch. Das ist die wichtigste stille Rückmeldung des ganzen Systems: Sie sagt „ein Mensch hat dich gesehen“.
- Erwartung setzen: Erst wenn echte Daten vorliegen (nach einigen Wochen Betrieb), ein Satz unter dem Zeitstrahl: „Betriebe auf Bululu antworten meist innerhalb von 5 Tagen.“ Vorher kein Satz, keine erfundene Zahl (Vertrauen).
- Doppelbewerbung verhindert: die Stelle zeigt „Beworben am … · Stand ansehen“ statt „Jetzt bewerben“ (3.3).
- Nicht: Push-Mahnungen an den Bewerber („Noch keine Antwort?“), Ranglisten, „12 andere haben sich beworben“ (Angst ohne Handlung).
5.3 Die Absage (Bewerber)
- Gefühl: Kränkung, Scham, bei Ahmet zusätzlich „wegen meinem Deutsch“. Die Gefahr: Er bewirbt sich nirgends mehr über Bululu.
- Was der Bildschirm tut: Zeile in der Liste mit Chip „Absage“ in der neutralen Chip-Farbe (Weiß mit 1-px-Rahmen wie „gesichtet“ und „pausiert“, Regel vom 15.10.; der Rotton aus B entfällt, Rot bleibt Fehlermeldungen), keine Mahnung in „Jetzt wichtig“ (eine Absage ist nichts zu tun). Geöffnet: der Text der Firma aus der freundlichen Vorlage (Bedienregel 5: zugewandt, mit Dank), darunter sofort drei passende Stellen mit „Bewerben“. Nach dem Ansehen rutscht die Bewerbung in „Abgeschlossen“. In der Mail derselbe Text, derselbe Link.
- Vorlage für die Firma so geschrieben, dass sie nicht nach Formbrief klingt und keine Begründung erfindet. Kein Pflichtfeld „Grund“ für die Firma (das erzeugt verletzende Standardgründe).
- Nicht: Symbole wie ✕, Farbe Rot, „leider“ dreimal, Statistik „Sie waren unter 14 Bewerbern“.
5.4 Die leere Liste (alle)
- Gefühl: „Hier ist nichts, also funktioniert es nicht“ oder „hier bin ich falsch“. Leere Fläche wirkt wie ein Fehler (Bedienregel, Nachtrag 09.10.: „Leere wirkt wie ‚hier fehlt etwas‘“).
- Was der Bildschirm tut: Ein Satz, der sagt, warum die Liste leer ist und was der nächste Schritt ist, mit genau einem Knopf. Je Liste festgelegt (Plan verlangt das; hier die Wortlaute für die wichtigsten):
- Bewerbungen (Bewerber): „Noch keine Bewerbung. Wenn Sie sich bewerben, sehen Sie hier, was der Betrieb damit macht.“ → „Stellen ansehen“
- Merkliste: „Noch nichts gemerkt. Tippen Sie bei einer Stelle auf das Herz.“ → „Stellen ansehen“ (B hat das, bleibt)
- Bewerbungen (Firma): „Noch keine Bewerbungen. Ihre Stelle ist seit 2 Tagen online; die meisten Bewerbungen kommen in der ersten Woche.“ (zweiter Satz nur mit echten Daten) → kein Knopf, oder „Stelle teilen“ (WhatsApp/LinkedIn-Link der Stelle, das hilft wirklich)
- Stellen (Firma): die Drei-Schritte-Karte aus 3.8.
- Trefferliste: zwei Wege (3.2).
- Prüfen (Verwaltung): „Nichts zu prüfen.“ + nächste Frist.
- Nicht: leere Tabelle mit Spaltenköpfen, „Keine Einträge“, Illustration ohne Satz.
5.5 Die Einladung (Bewerber)
- Gefühl: Freude und sofort Logistik-Stress: Wann, wo, wie hinkommen, was mitbringen, kann ich antworten?
- Was der Bildschirm tut: Einladungs-Karte mit Datum und Uhrzeit groß, Ort mit Karten-Link oder Online-Link, Name der Ansprechperson, Telefon. Ein farbiger Knopf „Zusagen“, daneben „Anderen Termin erbitten“, Absagen als Textlink. Nach Zusage: „In Kalender speichern“ (Plan) und Satz „Wir erinnern Sie am Vortag per E-Mail“ (Plan). Die Mail enthält dieselbe Karte.
- Nicht: Freitext als einzige Antwortmöglichkeit (für Ahmet eine Schreibhürde), Konfetti.
5.6 Die erste Bewerbung kommt an (Firma)
- Gefühl: Herr Peters: „Oh, es funktioniert“ und zugleich „jetzt muss ich schnell sein, sonst ist er weg“.
- Was der Bildschirm tut: Mail „Ihre erste Bewerbung: Jonas Weber für Schweißer“ mit Link direkt in die geöffnete Bewerbung (nicht auf die Startseite). Dort Telefon zum Antippen als Erstes. In „Heute zu tun“ ab Tag 3 der Satz „wartet seit 3 Tagen auf eine Antwort“ (Verlust). Mail-Benachrichtigung „neue Bewerbung“ ab Werk sofort, umstellbar auf täglich gesammelt (Plan).
- Nicht: Zwang, einen Status zu setzen; Zwang, zu schreiben, bevor man anruft.
5.7 Absage senden (Firma)
- Gefühl: Unbehagen, Aufschieben („mach ich später“), Angst vor dem falschen Ton. Aufgeschobene Absagen sind das, was Bewerber am meisten verletzt (5.2).
- Was der Bildschirm tut: „Absagen“ öffnet die fertige, freundliche Vorlage; ein Klick „Absage senden“; 10 Sekunden „Rückgängig“; keine Rückfrage „Sind Sie sicher?“ (Plan, Bedienregel 6). Der Status in der Liste ändert sich sofort, die Mail geht nach 10 Sekunden. So kostet eine Absage zwei Klicks und null Formulierungsarbeit, und sie wird nicht aufgeschoben.
- Nicht: Pflicht-Grund, Pflicht-Freitext, Bestätigungsfenster.
5.8 Stelle läuft ab (Firma)
- Gefühl: Übersehen, dann Ärger: „Warum ist meine Anzeige weg?“
- Was der Bildschirm tut: Mail 5 Tage vorher (Plan) mit dem Knopf „Um 30 Tage verlängern“: er öffnet eine Seite mit genau einem Knopf, erst der verlängert (ohne Anmeldung, wenn der Link signiert ist; Firmen-Postfächer rufen Links vorab auf, darum wirkt der Link allein nicht, sicherheit.md Nr. 29). In „Heute zu tun“ die Zeile mit „Verlängern“ und dem Textlink „Besetzt? Beenden“; in der Stellenliste Gruppe „Braucht Aufmerksamkeit“, auch dort der Textlink neben „Verlängern“. Nach Ablauf: Chip „Pausiert seit …“, Knopf „Verlängern“ ohne zeitliche Grenze (Plan: dieselbe Stelle, die Bewerbungen bleiben); „Erneut schalten“ gibt es nur bei beendeten Stellen und legt eine Kopie an (3.9). Verlust-Satz nur mit echten Zahlen: „4 Bewerber haben diese Stelle gemerkt.“
- Nicht: stilles Verschwinden; Verlängern über ein Formular.
5.9 Angefangen und abgebrochen (Bewerber)
- Gefühl: Unterbrechung (Anruf, Bus), später vergessen oder Angst, doppelt zu sein.
- Was der Bildschirm tut: Entwurf 7 Tage (Plan); auf der Stelle die gelbe Zeile „Sie haben hier eine Bewerbung angefangen. Weiter“; in „Jetzt wichtig“ die Zeile „Bewerbung bei X ist nicht fertig“ mit „Weiter“. Beim Weitermachen steht alles noch da. (Zeigarnik, Shneiderman: Kontrolle)
- Nicht: Mail-Mahnung am selben Tag; nach 7 Tagen stiller Verfall ohne Hinweis.
5.10 Hochladen schlägt fehl (Bewerber)
- Gefühl: Panik, „jetzt ist alles weg“, Abbruch.
- Was der Bildschirm tut: Fehler am Feld in Alltagsworten („Die Datei ist zu groß (14 MB). Bis 10 MB geht. Tipp: ein Foto je Seite reicht.“), alle anderen Eingaben bleiben, Knopf „Erneut versuchen“ (Plan). Word-Datei: „Word-Dateien können wir noch nicht lesen. Speichern Sie die Datei als PDF oder fotografieren Sie Ihren Lebenslauf.“ mit dem Foto-Knopf direkt daneben.
- Nicht: Fehlercode, roter Balken oben ohne Ort, Zurück auf Schritt 1.
5.11 Erste Stelle wartet auf Prüfung (Firma)
- Gefühl: Misstrauen („Warum muss das geprüft werden? Bin ich verdächtig?“).
- Was der Bildschirm tut: Der Satz nach dem Veröffentlichen: „Online für Bewerber. Bululu prüft neue Betriebe einmal, in der Regel bis morgen; danach erscheint die Stelle auch bei Google und im Job-Alarm.“ Chip „Prüfung, bis morgen“ in der Liste. Mail bei Freigabe (Plan). Der Grund („neue Betriebe einmal“) nimmt den Verdacht.
- Nicht: „Wartet auf Freigabe“ ohne Grund und Ende.
5.12 Kennwort und Registrierung (alle)
- Gefühl: „Nicht noch ein Konto“, Angst vor Regeln („Sonderzeichen, Großbuchstabe …“).
- Was der Bildschirm tut: Mindestlänge 10, keine Zeichenregeln (Plan), Beschriftung sagt das in drei Wörtern, „Zeigen“-Knopf (B hat ihn). Kennwort vergessen: ein Feld, ein Knopf, Bestätigung „Wenn ein Konto existiert, ist der Link unterwegs“ (B hat das, bleibt). Zweiter Faktor: nie beim ersten Kontakt, sondern in den Einstellungen und für Firmen nach der ersten Anmeldung als eine Zeile in „Heute zu tun“ („Schützen Sie Bewerberdaten mit einem zweiten Faktor“ → „Einrichten“, Plan: empfohlen).
- Nicht: Kennwort-Stärke-Ampel, Info-Kasten auf der Anmeldeseite (B
anmelden.html:139).
5a. Die psychologischen Momente in Verwaltung und Werbung (Fortsetzung von Abschnitt 5)
5.13 Eine Firma ablehnen (Verwaltung und Firma)
- Gefühl Verwaltung: Unbehagen, Aufschieben („vielleicht doch echt?“), Angst vor einem bösen Anruf. Aufgeschobene Prüfungen laufen in die automatische Freigabe (Plan) und dann ist eine unseriöse Anzeige live. Gefühl Firma: Kränkung, Verdacht („halten die mich für einen Betrüger?“), bei einem kleinen Betrieb mit Freemail-Adresse besonders.
- Was der Bildschirm tut: Ablehnen ist nachbesserbar und heißt so im Fenster („Die Firma kann die Stelle ändern und erneut einreichen“); der Grund ist eine Pille, keine Formulierungsarbeit; die Mail nennt genau das eine, was fehlt, und den Weg („Ergänzen Sie Ihre Anschrift im Firmenprofil und veröffentlichen Sie die Stelle erneut; wir prüfen dann innerhalb eines Werktags“). Hinweise vom System (Regel 13) nehmen der Verwaltung das Gefühl, aus dem Bauch zu entscheiden. Sperren ist ein anderer Knopf mit anderem Fenster, damit niemand aus Vorsicht die harte Variante wählt.
- Nicht: „abgelehnt“ ohne Grund, Verdachtswörter („unseriös“) in der Mail an die Firma (intern als Pille ja, nach außen „Angaben unvollständig“), Rot, Konto-Sperre als Folge einer Ablehnung.
5.14 Sperre (Firma oder Bewerber)
- Gefühl: Für die Verwaltung die größte Handlung im System; für die Betroffenen ein Schock, wenn sie es beim Anmelden erfahren.
- Was der Bildschirm tut: Grund Pflicht, Mail-Vorschau, Knopf mit Namen „Sperren und E-Mail senden“, 10 Sekunden Rückgängig; Erklärseite beim Anmelden mit Grund, Kontakt und Satz, ob und wie eine Entsperrung möglich ist (Plan: Erklärseite). Bewerber sehen bei gesperrten Firmen nur „nicht mehr auf Bululu“, nie den Grund (Plan). Chip in der Firmenansicht mit Datum und Name der sperrenden Person: Verantwortung ist sichtbar, das senkt leichtfertige Sperren.
- Nicht: stilles Verschwinden, Sperre ohne Mail, Sperre als Folge einer Meldung ohne eigenes Fenster.
5.15 Premium: Anfrage ohne Preis, Ablehnung
- Gefühl Firma: „Ich frage nach Preis und bekomme ein Formular“; nach einer Ablehnung: „die wollen mein Geld nicht?“
- Was der Bildschirm tut: Die Anfrage ist ein Satz und ein Knopf an der Stelle; die Firma sieht in „Heute zu tun“ „Premium angefragt am 21.10., Bululu meldet sich“ als Information mit Ende („in der Regel bis morgen“). Die Verwaltung ruft an oder mailt (Zustand „Angebot geschickt“ als Haken, damit die Zeile nicht liegen bleibt). Freischaltung mit Datum, Mail mit Ende-Datum und dem Satz, was jetzt geht („Haken „Als Top-Stelle“ an jeder Stelle“). Ablehnung selten, mit Grund-Pille, formuliert als Zeitpunkt, nicht als Urteil („zurzeit nicht möglich, gern ab …“).
- Nicht: Preisfeld im Portal, Paketkarten (B
arbeitgeber.html:113ff.), Ablauf ohne Vorwarnung.
5.16 Der Werbekunde wartet ohne Preis
- Gefühl: Misstrauen beim Absenden („warum steht da kein Preis?“), danach Unsicherheit („kommt was?“), nach zwei Tagen Stille Ärger und Abwanderung zur Zeitung.
- Was der Bildschirm tut: Satz mit Frist vor dem Knopf, Eingangsbestätigung in derselben Minute mit Vorschaubild und Telefonnummer, Angebot binnen einem Werktag (die Frist steht als Zeile in „Heute zu tun“ der Verwaltung mit „überfällig“), Angebot mit einer Handlung („Ja“). Die Vorschau in der echten Seite ersetzt den Preis als Vertrauenssignal: Wer sieht, wo seine Anzeige steht, hat das Gefühl, es gibt die Sache wirklich.
- Nicht: „Preis auf Anfrage“ an jeder Karte, Platzhalter-Preise, Danke-Seite ohne Frist (B
konfigurator.js:1085).
5.17 Motiv abgelehnt (Werbekunde)
- Gefühl: Scham („ich bin kein Grafiker“), Aufwand („jetzt muss ich den Neffen fragen“), Abbruch.
- Was der Bildschirm tut: Die Verwaltung wählt genau einen Grund, die Mail heißt „Eine Änderung an Ihrem Motiv“, nennt die Maße und bietet an, es selbst anzupassen (Logo und Text genügen). Warnen statt sperren schon im Konfigurator: falsche Maße werden angenommen, nicht abgewiesen.
- Nicht: „abgelehnt“, Liste von vier Mängeln, Fachwörter (Auflösung, dpi, CMYK).
5.18 Herr Schiffke kommt nach drei Wochen wieder
- Gefühl: Fremdheit, „wo war das nochmal“, Angst vor dem falschen Knopf, Zeitdruck (er wollte nur die eine Mail abarbeiten).
- Was der Bildschirm tut: Die Mail führt in die Aufgabe; jeder Knopf sagt, was er tut; Mails werden vorher gezeigt; „Seit Ihrem letzten Besuch“ erzählt in drei Zeilen, was Nomad inzwischen erledigt hat (so weiß er, dass nichts liegen geblieben ist, ohne nachzufragen); nichts Technisches ist sichtbar. Beschriftungen sind Sätze, Zustände sind Wörter, Fristen sind Zeitpunkte („bis morgen 9:00“), nicht Dauern („24 h“).
- Nicht: Rundgang-Hinweise („Neu hier? Tour starten“), Erklärsätze, Symbole ohne Wort, Tastaturkürzel als einziger Weg.
5.19 Support „im Namen von“ (Verwaltung und Firma)
- Gefühl Firma: Erleichterung („die machen das für mich“) und Unbehagen („was können die alles sehen und tun?“). Gefühl Verwaltung: Angst, versehentlich als Firma einem Bewerber zu schreiben.
- Was der Bildschirm tut: Grund Pflicht, Hinweisleiste in Signalfarbe, Bewerber-Kommunikation in diesem Modus gesperrt, Protokoll in beiden Sichten, Zeile im Firmenbereich „Bululu hat am … auf Ihren Wunsch …“ (Transparenz nimmt dem Zugriff das Heimliche), Modus endet nach 60 Minuten von selbst.
- Nicht: Admin-Zugriff ohne Spur, Zugriff auf Unterlagen ohne Grund-Fenster, Mails im Namen der Firma an Bewerber.
5.20 Die Frist ist verstrichen (Verwaltung)
- Gefühl: Schuld („hab ich verpennt“), Versuchung, die automatisch freigegebene Firma nicht mehr anzusehen.
- Was der Bildschirm tut: Keine Anklage: Die Firma ist frei (Plan), die Prüfung bleibt als eigene, leise Gruppe „Automatisch freigegeben, nachprüfen“ mit „In Ordnung“ als Ein-Klick-Abschluss. Überfällig-Wörter stehen vorher in „Heute zu tun“, und die Erinnerungsmail (Plan) kommt 2 Stunden vor Ablauf, nicht danach.
- Nicht: rote Zähler „3 verpasst“, Mail „Sie haben eine Frist versäumt“ nach der Tat.
6. Prüfliste je Bildschirm vor dem Bau (abgeleitet aus Bedienregel 8)
Jeder Bildschirm wird vor dem Bau mit diesen Fragen gegengelesen; die Antwort steht in der Bereichs-Karte (Plan, Abschnitt 0):
- Welche der fünf Personen steht hier, und welche ihrer drei Fragen beantwortet der erste Bildschirm?
- Was ist der eine farbige Knopf? Gibt es einen zweiten farbigen? Dann weg oder Rand.
- Wie viele Entscheidungen bis zum Ziel? Kann eine davon ein Standard werden?
- Steht eine Zahl allein in einer Kachel? Dann in einen Satz mit Knopf oder nach unten.
- Steht ein Erklärsatz da? Dann Beschriftung ändern, Satz löschen.
- Heißt jedes Ding überall gleich (innerhalb einer Rolle)? „Postfach“, nicht „Nachrichten“ und „Chat“.
- Was passiert bei leer, bei Fehler, bei „schon erledigt“? Je ein Satz und ein Weg.
- Wird etwas Unumkehrbares ohne Rückgängig ausgelöst? Dann 10 Sekunden Rückgängig.
- Was sieht Ahmet am Handy im ersten Bildschirm, ohne zu scrollen? Reicht das für seine erste Frage?
- Was kann noch weg?
7. Abweichungen vom Bauplan, die hier vorgeschlagen werden (zur Entscheidung)
Alles oben folgt dem Plan vom 21.10., außer diesen Punkten; sie sind klein und leicht zurückzunehmen:
- Status-Wörter auf Bewerberseite aus Bewerbersicht („Angekommen“, „Vom Betrieb geöffnet“) statt der Firmen-Wörter („Neu“, „Gesichtet“); innerhalb jeder Rolle bleibt jedes Wort überall gleich (3.6).
- Handlungsleiste der Firma mit zwei sichtbaren Knöpfen je Zustand (Einladen · Absagen; nach Einladung: Zusage · Neuer Termin · Absagen) statt drei immer (3.10).
- Deutschkenntnisse in jeder Stellenzeile und in der „Passt das?“-Reihe der Stelle; im Plan nur als Filter und Eckdatum (3.2, 3.3).
- Stellenformular mit getrennten Feldern Aufgaben / Das brauchen Sie / Gut, aber nicht nötig / Das bieten wir statt „Aufgaben, Profil“ (3.11); „Gut, aber nicht nötig“ ist neu.
- Keine Vorschau der Mappe im Bewerben-Fenster, wenn eine eigene Datei hochgeladen wird; Vorschau nur bei Mappe aus dem Profil (3.4).
- Filter-Pillen und Suchfeld in Listen erst ab einer Mindestzahl (Stellen ab 8, Bewerbungen immer Stelle + Status, Postfach-Suche ab 10) (3.9, 3.12).
- Umkreis-Standard 25 km wie in B; der Plan legt keinen fest (3.1).
- Übersicht ohne Reiter im Firmen- und im Bewerberbereich, erreichbar über „‹ Übersicht“ über der Überschrift jeder Unterseite und „Mein Bereich“ im Konto-Menü (3.5, 3.8, 4).
7a. Abweichungen vom Bauplan, die hier vorgeschlagen werden (Fortsetzung von Abschnitt 7, zur Entscheidung)
- Automatisch freigegebene Firmen bleiben als Gruppe „nachprüfen“ in Prüfen, abschließbar mit „In Ordnung“ (3.15). Plan: nur Erinnerung.
- Rückfrage an die Firma pausiert die automatische Freigabe höchstens 3 Werktage; die Antwort kommt per Mail an 3BS, Bululu erkennt sie nicht (3.15). Plan: feste Frist 1 Werktag.
- „Im Namen von“ sperrt Einladen, Absagen, Zusage und Nachrichten an Bewerber; endet nach 60 Minuten; die Firma sieht eine Zeile in ihrem Bereich (3.17). Plan: Hinweisleiste, Grund, Protokoll.
- Ablehnen ist nachbesserbar, Sperren ist hart, zwei Knöpfe mit zwei Fenstern; der Melder bekommt nur „Danke, geprüft“ ohne Ergebnis (3.15). Plan: Meldung → erledigt oder Sperre.
- Kontaktanfragen werden beim Öffnen automatisch übernommen („In Bearbeitung von …“), Antwort per Mail mit 3BS als Antwortadresse; „An den Betreiber weitergeben“ als Zweitweg (3.16).
- Rechnungen für Premium und Werbung außerhalb des Systems (3BS); im System nur ein freies Preisfeld im Angebot (3.18, 3.22). Plan: Rechnungen im Portal nach dem Livegang.
- Werbekunde: Eingangsbestätigung mit Vorschaubild sofort, Startbestätigung am Vortag, Klickzahlen im Betreff; signierter Motiv-Upload-Link ohne Konto als spätere Ergänzung notiert (3.22). Plan: Angebot und Klickzahlen per Mail.
- Konfigurator: „Warenkorb“ wird „Ihre Auswahl“, Hauptknopf „Weiter zur Anfrage“, Geräte hinter Textlink, Position zwei statt drei, Wunsch-Start, Telefon und Datenschutz-Haken, Zusage-Satz mit Frist (3.21). Plan: ohne Preise, Fläche, Format, Zeitraum, Motiv, Anfrage.
- Flächen-Einstellung „Eigenwerbung wenn frei“ je Fläche, Standard an: Das Eigenmotiv verlinkt auf „Werbung planen“; aus heißt, die Fläche verschwindet. Einen Platzhalter „Hier könnte Ihre Werbung stehen“ gibt es in keinem Fall (3.18).
- Premium-Standardlaufzeit 30 Tage als Frist in den Einstellungen, Freischalten mit vorbelegtem Datum (3.16, 3.20).
- Rechtstexte veröffentlichen fragt einmal nach (Unumkehrbarkeit wegen Einwilligungs-Fassungen); sonst überall Rückgängig (3.19).
- „Seit Ihrem letzten Besuch“ ersetzt „Zuletzt passiert“ auf der Verwaltungs-Übersicht (3.14).
- Jede Mail an die Verwaltung verlinkt direkt in die Aufgabe (4a).
Offen für Abschnitt 0 des Plans (keine Entscheidung hier, nur Hinweis): Wortlaut der Grund-Pillen und aller Mails (Mailvorlagen), ob Werbung von anderen Jobbörsen zugelassen wird (Prüfpunkt „Inhalt“ in 3.18), ob 3BS Kampagnen ohne den Super Admin stornieren darf (hier: ja).
Entschieden am 22.10.2026: Alle Punkte aus 7 und 7a sind übernommen. Bei Punkt 8 gilt eine Linie für alle Bereiche: Die Übersicht ist die Startseite des Bereichs und kein eigener Menüpunkt. Für Rechnungen (Punkt 14) gilt das nur bis zum Livegang; danach entscheidet die Entscheidung über die Abrechnung.
Barrierefreiheit, andere Sprachen, Messen nach dem Livegang
Einleitung zum zweiten großen Teil über Barrierefreiheit, Sprachen und Auswertung.
Bululu: Barrierefreiheit, Sprachen, Messen
Ergänzung zu usability-bildschirme.md (gleicher Stand 22.10.2026). Grundlage: Bauplan _berichte/PLAN-BACKEND-2026-10-21.html (Architektur, Sprachen, Sicherheit, Betrieb, Bauordnung), Entwurf B (entwurf-b/*.html, assets/style.css, assets/app.js), Recherche _berichte/recherche/sprachen.md und uebersetzung.md.
Rahmen wie im Usability-Konzept: Die Optik von B bleibt. Alles hier ist so gebaut, dass es ohne sichtbare Änderung auskommt; wo eine Regel nur mit sichtbarer Änderung erfüllbar ist, steht das als Entscheidung in Abschnitt D.
Kurzfassung
- Ziel WCAG 2.1 AA (Plan), technische Norm dahinter EN 301 549. Ob das BFSG gilt, klärt die eine Sammel-Anfrage an den Kunden am Ende (Dokument „Offene Fragen zum Abschluss“, R5); bis dahin wird so gebaut, als gälte es. 44 px Zielgröße ist eine eigene, strengere Vorgabe (AA verlangt in 2.1 keine Mindestgröße).
- Kontrast, 52 Farbpaare aus
style.cssgerechnet. Text auf Orange und Grün ist mit der Tinte-Schrift sehr gut (8,1 und 9,4 : 1). AA verfehlen: das grüne Hero-Wort „Job finden.“ (#C4D667 auf Weiß, 1,60 : 1, nötig 3 : 1), der Platzhaltertext in Feldern (#7A8374 auf Weiß, 3,94 : 1, nötig 4,5 : 1), dunkelgrüne Links auf grüner Fläche (4,49 : 1, knapp unter 4,5), der Fokusring auf dunklen Flächen (Fuß, Toast: 2,09 : 1, nötig 3 : 1) und die Fortschrittsstriche im Bewerben-Fenster (aktiv 1,60 : 1, inaktiv seit dem „Grau wird Weiß“-Umbau vom 15.10. unsichtbar). Vier davon lassen sich ohne sichtbare Änderung lösen; das Hero-Wort bekommt dunkle Schrift mit grünem Markerstreifen. - Rückgängig 10 s reicht für Screenreader-Nutzer nicht, wenn „Rückgängig“ nur im Toast unten steht. Lösung: Der Fokus landet nach der Aktion auf einem „Rückgängig“-Knopf an genau der Stelle, wo der gedrückte Knopf war, und die Frist ist fest 10 Sekunden; 2.2.1 ist erfüllt, weil der Rückgängig-Knopf den Fokus bekommt und die verzögerte Mail auch ohne Toast noch 10 Sekunden abbrechbar bleibt.
- Arabisch: B hat rund 117 Stellen mit fester Links/Rechts-Angabe im CSS, keine arabische Schrift und negative Laufweite in Überschriften (zerreißt arabische Buchstabenverbindungen). Nach der Bauordnung „Ändern heißt ersetzen“ ist der saubere Weg, diese Stellen im B-CSS auf richtungsneutrale Angaben umzustellen (sieht auf Deutsch gleich aus), statt eine RTL-Zusatzdatei mit Überschreibregeln anzulegen (Entscheidung D2).
- Türkisch: Wortlänge ist selten das Problem, aber zwei Fallen: Großschreibung (i → İ, ı → I) und Endungen an Platzhaltern („Hagedorn'a“). Übersetzer schreiben Sätze so, dass Namen ohne Endung stehen.
- Messen ohne Cookies und ohne IP: Bewerber-Trichter aus Tagessummen (Zähler im Browser per Beacon), Firmen-Trichter und Antwortzeit direkt aus den Fachdaten (keine Zählung nötig). Fünf Monatszahlen auf der Verwaltungs-Startseite unter „Zahlen“ (nur für den Super Admin, aufklappbar); getrennt nach Sprache und Gerät in der Monats-Mail, damit man sieht, ob Türkisch oder Arabisch schlechter durchkommt.
Barrierefreiheit
Wie Bululu mit Tastatur, Vorlesegerät, Vergrößerung und reduzierter Bewegung bedienbar wird, Bildschirm für Bildschirm.
A.0 Was B schon richtig macht (übernehmen, nicht neu bauen)
| Was | Wo in B |
|---|---|
| Sprungmarke „Zum Inhalt“ | .skip, style.css:62, auf allen Seiten |
Seitensprache <html lang="de">, Sprachnamen in der Sprachwahl mit eigenem lang | index.html:2, :65 |
| Sichtbarer Fokus, 3 px Ring Dunkelgrün mit Abstand | style.css:59 |
Bewerben-Fenster als echtes <dialog> mit showModal(), Fokus beim Schließen zurück auf den auslösenden Knopf, je Schritt Fokus ins erste Feld | app.js:764 bis :781 |
Fehler am Feld mit aria-invalid und eigener Fehlerzeile, erster Fehler bekommt den Fokus | app.js:389, :788 |
| Toasts in einer Live-Region | index.html:392, app.js:27 |
Logo-Intro für Vorlesegeräte ausgeblendet (aria-hidden), unter 5 s | index.html:56 |
| Bewegung reduzieren: Übergänge fast null, Puzzle über Deckkraft statt Bewegung, Intro kürzer und ohne Verschwimmen | style.css:804, :1056, :1210, :1444 |
| Felder mit schwarzem 1-px-Rahmen (18,6 : 1) seit 15.10. | style.css:1457 |
| Fast alle Knöpfe 44 px oder höher | .btn 48, .icon-btn 44, Reiter 52, Pillen 44 |
| Zoomen nicht gesperrt | <meta name="viewport" content="width=device-width, initial-scale=1"> |
A.1 Gemeinsame Bausteine (gelten auf jedem Bildschirm)
Kopf und Konto-Menü
- Reihenfolge per Tab: Sprungmarke · Logo · Jobs · Für Arbeitgeber · Sprache · Anmelden bzw. Konto-Knopf · Stelle inserieren. Am Handy: Logo · Merkliste · Sprache · Menü (B-Reihenfolge,
style.css:1220). - Konto-Knopf (neu) als Ausklapp-Knopf mit
aria-expanded, darin eine Liste normaler Links, kein ARIA-„menu“ (das verlangt Pfeiltasten-Bedienung, die hier niemand erwartet). Esc schließt und gibt den Fokus an den Knopf zurück. Name: „Konto von Ahmet Yılmaz“, nicht nur die Initialen. - Handy-Menü: beim Öffnen Fokus auf den ersten Eintrag, Esc und der Menü-Knopf schließen, Inhalt dahinter
inert. B setztbody.menue-offen { overflow: hidden }, das bleibt.
Reiter in den Login-Bereichen
- In B sind die Reiter ARIA-Tabs mit Inhaltsfeldern auf einer Seite (
firmen-bereich.html:116). Im Neubau ist jeder Reiter eine eigene Adresse (/mein-bereich/bewerbungen, Karte 2a Teil 1). Darum:<nav aria-label="Bewerberbereich">mit Links undaria-current="page", keine Tabs. Die CSS-Regel.reiter [role="tab"][aria-selected="true"]wird auf.reiter [aria-current="page"]umgeschrieben, die Optik bleibt. - B blendet die Scrollleiste der Reiter aus (
scrollbar-width: none,style.css:626). Am Handy sieht man dann nicht, dass rechts weitere Reiter liegen. Darum (D-5, entschieden 26.10.): der letzte Reiter wird am rechten Rand angeschnitten gezeigt (kein rechter Innenabstand der Reiterleiste, Überlauf sichtbar), der aktive Reiter wird beim Laden in den sichtbaren Bereich gescrollt, und die Liste ist per Tab vollständig erreichbar. - Zahl-Kreis am Reiter: Vorlesetext „Postfach, 2 ungelesen“, nicht „Postfach 2“.
Seitenwechsel
- Jede Seite hat einen eigenen Titel in der Sprache des Nutzers, Muster „Bewerbungen · Firmenbereich · bululu“ (2.4.2). B hat auf
stelle.htmlnur „Stellenanzeige | bululu“; im Neubau steht der Stellentitel darin. - Nach einem Wechsel innerhalb der Login-Bereiche bekommt die
h1den Fokus (tabindex="-1", kein sichtbarer Ring, so wie B es bei.u-kopf h1:focusmacht). Next.js meldet den Seitentitel zusätzlich selbst. - Feste Kopfzeile (76 bzw. 66 px) und Klebeleiste unten (rund 72 px) dürfen ein fokussiertes Feld nicht verdecken:
scroll-padding-topund auf Seiten mit Klebeleistescroll-padding-bottomsetzen. Unsichtbar, nur beim Tabben wirksam.
Fenster (Dialoge)
- Immer natives
<dialog>mitshowModal(): fängt den Fokus, Esc schließt, Hintergrund ist gesperrt. Beim Öffnen Fokus auf die Überschrift des Fensters (nicht ins erste Feld), damit Vorlesegeräte zuerst sagen, wo man ist; beim Schließen zurück auf den Auslöser (B macht das). aria-labelledbyauf die Überschrift,aria-describedbyauf die Zeile darunter (z. B. „Schweißer MAG · Metallbau Hagedorn“).- Schließen per Klick auf den Hintergrund (B,
app.js:781) nur, wenn im Fenster nichts eingegeben wurde; sonst verliert man mit einem Fehltipp Eingaben. Am Handy ist das Fenster bildschirmfüllend, dort gibt es keinen Hintergrund.
Toast und Rückgängig siehe A.6.
Formularfelder (überall)
- Jedes Feld hat eine sichtbare Beschriftung als
<label>; Platzhalter sind nur Beispiel, nie Beschriftung. autocompletefür Name, E-Mail, Telefon, Kennwort, Anschrift (1.3.5):given-name,family-name,email,tel,new-passwordbzw.current-password,postal-code,address-level2. Am Handy füllt das Gerät dann selbst aus; für Ahmet die größte Erleichterung überhaupt.- „(freiwillig)“ steht in der Beschriftung (B), Pflicht zusätzlich als
required. - Fehler: Text am Feld, verknüpft per
aria-describedby,aria-invalid="true", erster Fehler bekommt den Fokus. Keine Fehlerfarbe ohne Text. - Auswahl-Pillen (Beschäftigungsart, Deutschkenntnisse, Deckblatt) sind echte Radio-Knöpfe in
<fieldset>mit<legend>; B macht das bei.takt__optionschon so. - Die unsichtbare Bot-Falle (Plan: Spamschutz) bekommt
aria-hidden="true",tabindex="-1"undautocomplete="off". Sonst füllen Vorlesegeräte-Nutzer sie aus und werden als Bot abgewiesen.
Live-Meldungen: eine Tabelle für alle Bildschirme
| Anlass | Art | Wortlaut (DE) |
|---|---|---|
| Ergebniszahl nach Filter oder Suche | höflich (polite), 500 ms nach der letzten Änderung | „23 Stellen“ |
| Gemerkt / entfernt | höflich | „Gemerkt: Schweißer MAG“ |
| Gespeichert (Lebenslauf, Entwurf) | keine Meldung, nur sichtbar | (keine) |
| Speichern fehlgeschlagen | dringend (alert) | „Nicht gespeichert. Keine Verbindung. Ihre Eingabe bleibt hier.“ |
| Datei hochgeladen | höflich | „lebenslauf.jpg hochgeladen, 2,1 MB“ |
| Datei abgelehnt | dringend | „Die Datei ist zu groß (14 MB). Bis 10 MB geht.“ |
| Aktion mit Rückgängig | Fokus wandert auf „Rückgängig“, dazu höflich | „Absage an Jonas Weber wird gesendet. Rückgängig möglich.“ |
| Rückgängig ausgeführt | höflich | „Rückgängig gemacht. Es wurde nichts gesendet.“ |
| Reihenfolge geändert (Lebenslauf) | höflich | „Schweißer, Hagedorn: jetzt Position 1 von 4“ |
| Senden läuft | höflich | „Wird gesendet“ |
Es gibt genau eine Live-Region für Toasts je Seite. B setzt role="status" zusätzlich an jeden einzelnen Toast in einem schon lebenden Behälter (app.js:32 plus aria-live in index.html:392); das führt bei manchen Vorlesegeräten zu doppelter Ansage. Im Neubau nur der Behälter.
A.2 Je Bildschirm
Startseite
- Tastaturweg: Sprungmarke · Kopf · Suchfeld „Was“ · „Wo“ · Umkreis · „Jobs finden“ · Oft-gesucht-Begriffe · „Neu dazugekommen“ (je Stelle: Titel-Link, Herz) · „Alle Stellen“ · Fachbereiche · Werbefläche · Für Arbeitgeber · Job-Alarm · Fuß. Die Suchkarte liegt in B optisch über dem Bild; im Quelltext muss sie direkt nach der
h1stehen, damit Tab-Reihenfolge und Lesereihenfolge gleich sind. - Vorschläge im Suchfeld („Was?“, Berufeliste): Muster „Combobox mit Liste“: Pfeil runter öffnet und wählt, Enter übernimmt, Esc schließt, Vorlesen sagt „5 Vorschläge“. Ohne dieses Muster ist die Vorschlagsliste per Tastatur nicht erreichbar.
- Vorlesen, Gliederung:
h1„Einfach bewerben, Job finden.“ ·h2Neu dazugekommen ·h2Top-Stellen der Woche ·h2Fachbereiche ·h2So einfach geht es (h3je Schritt) ·h2Für Arbeitgeber ·h2Ihr Ansprechpartner ·h2Job-Alarm. Stellentitel in Karten alsh3. Suchkarte als<form role="search">mit Name „Stellensuche“. Werbefläche als<aside aria-label="Anzeige">ohne Überschrift, damit Überschriften-Sprünge sie überspringen. - Karte der Region (falls sie bleibt): Die Stadt-Chips sagen dasselbe; die Karte wird
aria-hidden, die Punkte sind nicht fokussierbar. Sonst müsste jeder Punkt einen Namen wie „Duisburg, 12 Stellen“ bekommen und ist doppelt. - Kontrast: Hero-Wort „Job finden.“ in dunkler Schrift (Tinte, 14,9 : 1) mit grünem Markerstreifen in #C4D667 darunter.
- Bewegung: Logo-Intro bleibt (1,3 s, unter 5 s,
aria-hidden). Es läuft nur, wenn man von außen kommt (Verweis-Adresse nicht bululu.de), nicht bei jeder Rückkehr zur Startseite; das geht ohne Speicher im Browser. - Werbemotive: keine Animation länger als 5 s, nichts blinkt mehr als dreimal pro Sekunde (2.2.2, 2.3.1). In der Verwaltung unter Werbung ist „Text zum Vorlesen“ ein Pflichtfeld je Motiv (wird zum
alt).
Jobs (Trefferliste)
- Tastaturweg: Suchzeile · „Filter (2)“ (Handy) bzw. Filter-Spalte (Desktop) · Sortierung · aktive Filter (je Chip ein Knopf „Filter entfernen: Vollzeit“) · Stellen (Titel-Link, Herz) · „Mehr Stellen laden“.
- Filter-Blatt am Handy ist ein Fenster (A.1): fängt den Fokus, Esc schließt, Fokus zurück auf „Filter (2)“. Der Fuß-Knopf „23 Stellen anzeigen“ ändert seine Zahl beim Anhaken; die Zahl wird höflich angesagt, nicht bei jedem Haken sofort.
- Filter-Spalte am Desktop wirkt sofort: Fokus bleibt am Haken, die neue Ergebniszahl kommt als höfliche Meldung. Die Überschrift wird neu geschrieben, aber nicht selbst als Live-Region (sonst liest sie jedes Mal die ganze Zeile).
- „Mehr Stellen laden“: nach dem Laden Fokus auf den Titel der ersten neuen Stelle. Sonst steht der Fokus auf einem verschwundenen Knopf und springt an den Seitenanfang.
- Vorlesen:
h1ist der Ergebnissatz („23 Stellen „Schweißer“ in Duisburg + 25 km“). Liste als<ol>, Stellentitel alsh2(direkt unter derh1). Meta-Angaben (Ort, Art, Deutsch, Zeit) als Liste mit Wort vor dem Wert, z. B. „Deutsch: Grundkenntnisse“, nicht nur ein Symbol. Herz-Knopf: Name „Merken: Schweißer MAG bei Metallbau Hagedorn“ mitaria-pressed; zehn gleichnamige „Merken“-Knöpfe sind beim Durchspringen nicht unterscheidbar. Werbekarte: erstes Wort „Anzeige“, keinh2, kein Herz (Usability 3.2). - Kontrast: Marken „Neu“ (6,27 : 1) und „Top“ (12,19 : 1) erfüllen AA.
Stelle
- Tastaturweg: Brotkrumen · Titel · „Jetzt bewerben“ (Desktop oben rechts) · Merken · Teilen · Text · Bewerben-Box · Arbeitgeber-Kasten (Zur Firma, Telefon) · Eckdaten · Ähnliche Stellen · Drucken · Link kopieren · Anzeige melden. Am Handy steht die Klebeleiste im Quelltext direkt nach dem Titelblock, optisch unten fest.
- Vorlesen:
h1Titel; „Passt das?“-Reihe als Beschreibungsliste<dl>(Ort, Deutschkenntnisse, Beschäftigung, Gehalt);h2Ihre Aufgaben ·h2Das brauchen Sie (darinh3„Gut, aber nicht nötig“) ·h2Das bietet die Firma ·h2Arbeitgeber ·h2Eckdaten (am Handy<details>) ·h2Ähnliche Stellen. Teilen-Ausklapp am Desktop mitaria-expanded, am Handy über das Teilen-Blatt des Geräts (von sich aus barrierefrei). - Übersetzte Anzeige: Der übersetzte Text bekommt
lang="tr"usw., der deutsche Titel darunterlang="de". Sonst liest das Vorlesegerät deutschen Text mit türkischer Stimme vor (3.1.2, siehe B.7). - Zustände: „Beworben am 12.10. · Stand ansehen“ und „Sie haben hier eine Bewerbung angefangen. Weiter“ stehen als Text am Platz des Knopfes, nicht nur farbig.
- Zielgröße: Telefon im Arbeitgeber-Kasten als Link mit mindestens 44 px Höhe.
Bewerben-Fenster
- Tastaturweg: Öffnen über „Jetzt bewerben“ · Fokus auf die Fenster-Überschrift „Schritt 1 von 3: Ihre E-Mail“ · E-Mail · „Mit dieser E-Mail weiter“. Nach jedem Weiter-Knopf wechselt der Inhalt; der Fokus geht auf die neue Schritt-Überschrift (B setzt ihn ins erste Feld,
app.js:770; dann hört man den Schritt-Titel nicht). Esc oder ✕ schließen; der Entwurf bleibt 7 Tage (Plan), Schließen verliert also nichts. - Schritt 1: E-Mail (
autocomplete="email",inputmode="email"). Erscheint danach der Code-Knopf oder das Namensfeld im selben Schritt, wird das höflich angesagt („Konto gefunden. Code an {mail} senden oder mit Kennwort anmelden.“) und der Fokus geht auf das neue Element; nach „Code senden“ geht er ins Code-Feld. Kennwort-Zeigen-Knopf mitaria-pressedund Name „Kennwort zeigen“. - Schritt 2: Die Ablage „Lebenslauf wählen oder Foto machen“ ist ein echtes
<input type="file" accept="application/pdf,image/*">mit Beschriftung; Ziehen und Ablegen ist nur Zusatz. Fortschritt beim Hochladen als<progress>mit Namen. Ergebnis und Fehler laut Tabelle A.1. - Schritt 3: Zusammenfassung als
<dl>. „Nachricht an den Betrieb (freiwillig)“ als<details>. „Bewerbung senden“ wird während des Sendens nichtdisabled(dann verschwindet er aus der Tab-Reihenfolge und das Vorlesegerät verliert den Fokus), sondernaria-disabled="true"mit Text „Wird gesendet“. - Bestätigung: Fokus auf die Überschrift „Ihre Bewerbung ist bei Metallbau Hagedorn angekommen.“ (eine Fassung, der Code in Schritt 1 hat die Adresse bestätigt, C36). „Code erneut senden“ in Schritt 1 ist die ersten 60 Sekunden nicht
disabled, sondern erreichbar mit dem Zusatz „in 60 Sekunden möglich“; ein Klick davor sagt das noch einmal, statt nichts zu tun. - Fortschritt: Die drei Striche sind Schmuck (
aria-hidden), die Information steht im Text „Schritt 2 von 3“. Kontrast der Striche siehe A.4. - Fehlervermeidung (3.3.4): Schritt 3 mit Zusammenfassung vor dem Senden erfüllt „prüfen vor dem Absenden“.
Lebenslauf-Baukasten
- Tastaturweg: Überschrift · Fortschrittssatz · Hauptknopf (nächste fehlende Angabe) · Bereichs-Karten (je eine Karte ein Link am Handy bzw. ein Ausklapp-Knopf mit
aria-expandedam Desktop) · in einem Bereich: Stationen · „Station hinzufügen“. - Reihenfolge ändern ohne Maus: Ziehen ist nur Zusatz; die Pfeile „hoch/runter“ an jeder Station (B,
app.js:1103) sind der Weg für alle. Name: „Station nach oben: Schweißer, Hagedorn“. Nach dem Verschieben bleibt der Fokus am selben Knopf der verschobenen Station, Meldung „jetzt Position 1 von 4“. Der Griff zum Ziehen ist nicht fokussierbar. - Vorlesen:
h1Lebenslauf; Fortschritt als Satz plus<progress value="2" max="3">mit Namen „Mindestangaben“; Bereiche alsh2; Stationen als<ol>(die Reihenfolge ist Inhalt), je Station Überschrift „Schweißer, Metallbau Hagedorn, 2019 bis heute“. - Felder: „von/bis“ als je zwei Auswahlfelder Monat und Jahr mit Beschriftung (
type="month"fehlt in Safari am Mac). Haken „bis heute“ sperrt „bis“ und sagt das an. Der Hinweis „Bitte auf Deutsch“ steht einmal oben im Bereich und ist peraria-describedbymit jedem Textfeld verknüpft. Eingabefelder für deutschen Text bekommenlang="de", dann prüft auch die Rechtschreibhilfe des Geräts auf Deutsch. - Speichern: jedes Feld sofort (Plan); „Gespeichert“ nur sichtbar, keine Ansage; Fehler laut.
- Mappe: Deckblatt als Radio-Gruppe mit
legend„Deckblatt“, Bild-Vorschau mitalt„Deckblatt Klar: weißes Blatt, Name oben links“. „Mappe ansehen (PDF)“ öffnet in neuem Tab, steht im Namen: „Mappe ansehen (PDF, öffnet neues Fenster)“. Während der 2 bis 6 s Erzeugungaria-busyund Meldung „Wir setzen Ihre Mappe zusammen“.
Bewerbungen der Firma (Liste und geöffnete Bewerbung)
- Liste, Tastaturweg: Auswahl „Stelle“ · Pillen Neu/Offen/Alle · Sortieren · Zeilen (je Zeile ein Link auf den Namen, die ganze Zeile klickbar per Maus, aber nur ein Tab-Halt).
- Liste, Vorlesen:
h1Bewerbungen, Satz „12 Bewerbungen, 3 neu“ als höfliche Meldung nach Filterwechsel. Zeile: Name · Stelle · „heute“ · Status als Wort · „seit 3 Tagen ohne Antwort“ als Text · ungelesen als verstecktes Wort „ungelesene Nachricht“, nicht nur der Punkt (1.4.1). Pillen als Knöpfe mitaria-pressed, nur einer gedrückt. - Geöffnete Bewerbung, Tastaturweg: Zurück · Name · Telefon · E-Mail · Lebenslauf öffnen · Handlungsleiste (Einladen, Absagen) · Nachrichten · Notiz · Vorherige/Nächste. Die Handlungsleiste steht im Quelltext direkt nach dem Kopf, optisch am Handy unten fest und am Desktop oben rechts.
- Pfeiltasten ← → für die vorige/nächste Bewerbung nur, wenn der Fokus nicht in einem Textfeld steht (Notiz, Nachricht). Dazu sichtbare Knöpfe mit Namen „Nächste Bewerbung: Murat Kaya“.
- Vorlesen:
h1Name;h2Kontakt, Lebenslauf, Nachricht des Bewerbers, Nachrichten, Notiz fürs Team. Eingebettete PDF (nur am Desktop und nur, wenn es keinen Text aus dem Profil gibt, 3.10) als<iframe title="Lebenslauf von Jonas Weber (PDF)">und daneben immer der Link „PDF öffnen“; eingebaute PDF-Betrachter sind für Vorlesegeräte unzuverlässig. - Einladen-Fenster: Datum (
type="date"), Uhrzeit (type="time"), Ort oder Link, Ansprechperson, Text; alle beschriftet. Nach „Einladung senden“ das Rückgängig-Muster aus A.6.
Stelle anlegen
- Tastaturweg: Überschrift · Block 1 Die Stelle · Block 2 Der Text · Block 3 Bedingungen und Bewerbung (mit aufklappbarem Teil „Weitere Angaben (freiwillig)“) · Fortschrittssatz · Veröffentlichen · (Handy) Vorschau.
- Live-Vorschau am Desktop (B
inserat-vorschau) ist ein Abbild und bekommtinertundaria-label="Vorschau, so sehen Bewerber die Anzeige". Sonst springt der Tab-Weg in die Links und Knöpfe der Vorschau. - Vorlesen:
h1Neue Stelle; je Blockh2; Pillen-Gruppen als<fieldset>mit<legend>(Beschäftigungsart, Deutschkenntnisse, Gehalts-Einheit, Homeoffice, Bewerbungsweg). Listen-Felder „Aufgaben“ usw.: ein Textfeld, eine Zeile je Punkt; Hinweis „ein Punkt je Zeile“ steht in der Beschriftung, nicht als Platzhalter. - „Entwurf gespeichert 12:03“: sichtbar, keine Ansage. Fortschrittssatz „Noch 2 Pflichtangaben: Aufgaben, Ansprechperson“ wird nicht bei jedem Tastendruck angesagt, nur nach Klick auf Veröffentlichen.
- Fehler beim Veröffentlichen: am Feld, erstes fehlendes Feld bekommt den Fokus (Usability 3.11); zusätzlich eine dringende Meldung „2 Angaben fehlen“.
- „Text von Bululu KI“ (wenn freigeschaltet): Ergebnis landet im Feld, Meldung „Text eingefügt, bitte prüfen“; Rückgängig wie überall.
Postfach
- Tastaturweg Handy: Umschalter „Nur ungelesene“ · Liste (je Verlauf ein Link) → Verlauf: Zurück · „Zur Bewerbung“ · Nachrichten · Eingabe · Anhang (nur Bewerber) · Senden.
- Desktop zweispaltig: Auswahl eines Verlaufs links setzt den Fokus auf die Überschrift des Verlaufs rechts. In der Liste trägt der offene Verlauf
aria-current="true"(B so). - Vorlesen:
h1Postfach; Liste<ul>, ungelesen als Wort („ungelesen“), nicht nur fett mit Punkt. Jede Nachricht als<article>mit Absender und Zeit vorn („Schlosserei Peters, 12.10., 14:02“); eigene Nachrichten mit dem versteckten Vorsatz „Sie:“, weil „rechts und grün“ beim Vorlesen nicht ankommt. Eingabe beschriftet „Nachricht an Schlosserei Peters“. - Nach dem Senden: Fokus bleibt in der Eingabe, Meldung „Gesendet“. Kein Echtzeit-Chat (Plan), also keine Live-Region für eingehende Nachrichten.
- Schreibgeschützt: der Satz „Diese Bewerbung ist abgeschlossen. Nachrichten sind nicht mehr möglich.“ ersetzt Eingabe und Knopf ganz (kein ausgegrautes Feld).
Verwaltung
- Tastaturweg: Hauptmenü (Prüfen, Anfragen, Firmen und Nutzer, Werbung, Inhalte, Einstellungen) · „Heute zu tun“ (je Zeile ein Knopf) · Zahlen · „Seit Ihrem letzten Besuch“ (
<details>). - Vorlesen:
h1Heute zu tun; jede Zeile ein Listeneintrag, „überfällig“ als Wort am Anfang (Usability 3.13). Zahlen als<dl>(Wert und Bezeichnung zusammen). Listen am Desktop als echte Tabellen mit<th scope="col">, am Handy als Karten (Plan); Sortieren über Knöpfe im Spaltenkopf mitaria-sort. - „Im Namen von“ (Support): die Hinweisleiste oben ist eine Region mit Namen „Sie handeln im Namen von Rohrbau Kessler“ und steht im Quelltext vor dem Inhalt.
- Zweiter Faktor: Code-Feld mit
autocomplete="one-time-code",inputmode="numeric"; ein Code des vorigen 30-Sekunden-Fensters wird noch angenommen, damit niemand gegen die Uhr tippt. - Feste Höchstdauer der Sitzung (Plan): 2 Minuten vorher ein Fenster „Sitzung endet in 2 Minuten · Verlängern“ (2.2.1), Fokus auf „Verlängern“. Ist sie abgelaufen, bleiben Eingaben erhalten (Plan).
- Editor für Texte (Tiptap): Überschriften, Listen, Links sind per Tastenkürzel und Werkzeugleiste erreichbar; Werkzeugleiste als
role="toolbar"mit Pfeiltasten. Der Editor erzwingt eine Überschriften-Reihenfolge ohne Sprünge (keineh4direkt nachh2), damit Ratgeber und Rechtstexte richtig gegliedert bleiben.
A.3 Zoom, Umbruch, Textabstand
- Umbruch bei 320 px Breite (1.4.10): B hat Regeln bis 360 px (
style.css:1215), die Umbruchstellen 900/700 px bleiben. Neue Teile werden bei 320 px gebaut und geprüft; kein waagerechtes Scrollen außer den Reiter-Leisten. - Textabstand (1.4.12): Status-Marken und Knöpfe haben
white-space: nowrap(.status,.btn). Mit größerem Zeilen- und Buchstabenabstand oder langen Übersetzungen laufen sie über. Regel: Status-Marken stehen am Handy in eigener Zeile (B macht das für.zeile__rechtsunter 700 px schon); Knöpfe in Spalten dürfen umbrechen (white-space: normalgibt B bei.band .btnschon vor,style.css:1066). - Ausrichtung (1.3.4): nirgends auf Hoch- oder Querformat festgelegt.
A.4 Kontrast: alle Farbpaare aus B gerechnet
Rechnung nach WCAG (relative Leuchtdichte). Grenzen: normaler Text 4,5 : 1; großer Text (ab 24 px oder ab 18,66 px fett) 3 : 1; Bedienelemente und Zustände (1.4.11) 3 : 1. Logos sind ausgenommen. Werte aus style.css inklusive der Änderung vom 15.10. (--grau und --grau-2 = Weiß, style.css:1456).
Text auf Orange #FAAF72 und Varianten
| Paar | Verwendung | Verhältnis | AA |
|---|---|---|---|
| Tinte #1F2A1C auf Orange #FAAF72 | Hauptknopf, Merk-Zähler | 8,14 | ja |
| Tinte auf Orange-Hover #F59D55 | Hauptknopf beim Überfahren | 6,99 | ja |
| Text #2E3A2A auf Orange | (falls Fließtext auf Orange) | 6,52 | ja |
| Grau-Text #5C6657 auf Orange | nicht verwendet | 3,27 | nein (nur großer Text) |
| Weiß auf Orange | nicht verwendet | 1,84 | nein |
| Tinte auf Orange-50 #FEF4EA | Bewerben-Box, Kästen | 13,76 | ja |
| Grau-Text auf Orange-50 | Bewerben-Box Satz (.bewerben-box p) | 5,54 | ja |
| Tinte auf Orange-100 #FDE4CC | Marke „Top“, Zahl-Kreis am Reiter | 12,19 | ja |
| Orange-dunkel #9A4A0E auf Orange-100 | Status „läuft ab“ | 5,10 | ja |
| Grau-Text auf #FCDBBD | Einstiegskarte Betrieb | 4,58 | ja, knapp |
| Tinte auf #FEF0E3 | Hover in Ausklapp-Listen | 13,36 | ja |
Text auf Grün #C4D667 und Varianten
| Paar | Verwendung | Verhältnis | AA |
|---|---|---|---|
| Tinte auf Grün #C4D667 | „Stelle inserieren“, Job-Alarm-Block, Bänder | 9,36 | ja |
| Tinte auf Grün-Hover #B6CB52 | grüner Knopf beim Überfahren | 8,29 | ja |
| Dunkelgrün #4E5E12 auf Grün | Standard-Linkfarbe, wenn ein Link in einen grünen Block kommt | 4,49 | nein (0,01 zu wenig) |
| Grau-Text auf Grün | nicht verwendet | 3,77 | nein (nur großer Text) |
| Weiß auf Grün | nicht verwendet | 1,60 | nein |
| Tinte auf Grün-50 #F6F9E9 | Slogan-Zeile, Kästen | 13,97 | ja |
| Grau-Text auf Grün-50 | Nebentext in grünen Kästen | 5,62 | ja |
| Dunkelgrün auf Grün-50 | Links in grünen Kästen | 6,70 | ja |
| Dunkelgrün auf Grün-100 #EEF3D2 | Marke „Neu“, Status „eingeladen/aktiv“ | 6,27 | ja |
| Grau-Text auf Grün-100 | Nebentext | 5,26 | ja |
| Grau-Text auf #E2ECB6 | Einstiegskarte Bewerber (fällt laut Usability weg) | 4,84 | ja |
Text auf Weiß
| Paar | Verwendung | Verhältnis | AA |
|---|---|---|---|
| Tinte auf Weiß | Überschriften, Knöpfe mit Rand | 14,93 | ja |
| Text #2E3A2A auf Weiß | Fließtext | 11,97 | ja |
| Grau-Text #5C6657 auf Weiß | Nebentext, inaktive Reiter, Status „archiviert“ | 6,01 | ja |
| Dunkelgrün #4E5E12 auf Weiß | Links, Textknöpfe | 7,16 | ja |
| Fehlerrot #A1261B auf Weiß | Fehlermeldungen | 7,48 | ja |
| Orange-dunkel auf Weiß | (Herz-Strich) | 6,25 | ja |
| Hero-Wort #C4D667 auf Weiß | „Job finden.“ in der h1 (style.css:180) | 1,60 | nein, auch nicht als großer Text (3 : 1) |
| Platzhalter #7A8374 auf Weiß | Beispieltext in Feldern (style.css:208) | 3,94 | nein |
| Logo-Grün #93AD2A, Logo-Orange #EF8A36 | Logo | 2,55 / 2,51 | ausgenommen (Logo) |
Status-Marken und dunkle Flächen
| Paar | Verhältnis | AA |
|---|---|---|
| Status „neu“ #2D5266 auf #E6EEF2 | 7,12 | ja |
| Status „Absage“ in B #8A2A1E auf #F7E3DF (Bululu zeigt die Absage neutral, 5.3) | 7,00 | ja |
| Weiß auf Tinte (Toast, aktive Pille, Fußlinks) | 14,93 | ja |
| #D9DED2 auf Tinte (Fußtext) | 10,90 | ja |
| Grün auf Tinte (Toast-Link, aktiver Fußlink) | 9,36 | ja |
Bedienelemente und Zustände (3 : 1)
| Paar | Verhältnis | AA |
|---|---|---|
| Fokusring Dunkelgrün auf Weiß | 7,16 | ja |
| Fokusring auf Orange / auf Grün | 3,90 / 4,49 | ja |
| Fokusring Dunkelgrün auf Tinte (Fußzeile, Toast-Link, dunkle Pille) | 2,09 | nein |
| Feldrahmen #15130F auf Weiß | 18,55 | ja |
| Schalter „an“ Dunkelgrün auf Weiß | 7,16 | ja |
| Fortschrittsstrich aktiv Grün auf Weiß | 1,60 | nein; inaktiv Weiß auf Weiß: unsichtbar |
| Rahmen #E0E3D8 an Rand-Knöpfen und Zeilen | 1,30 | nicht nötig: Knöpfe sind über ihren Text erkennbar |
| Herz gemerkt: Füllung Orange auf Weiß / Strich Orange-dunkel | 1,84 / 6,25 | knapp: Zustand zusätzlich über Namen und aria-pressed |
Vorschläge ohne Optikänderung
- Platzhalter #7A8374 → #676F62 (5,21 : 1). Derselbe graugrüne Ton, eine Spur dunkler; neben dem schwarzen Feldrahmen nicht als Änderung wahrnehmbar. Alternativ der vorhandene Grau-Text #5C6657 (6,01 : 1), dann ohne neuen Farbwert (Bauordnung: „kein neuer Farbwert“ spricht für diese Variante).
- Links auf Grün: Regel „auf grünen Flächen sind Links Tinte und unterstrichen“ (9,36 : 1). B macht das bei
.artikel-schluss .btn-textschon so; im Neubau kommt z. B. der Datenschutz-Link in den Job-Alarm-Block, dort gilt die Regel. - Fokusring auf dunklen Flächen (Fuß, Toast, aktive Pille): Ringfarbe Grün #C4D667 (9,36 : 1). Sichtbar nur beim Tabben, also keine Änderung im normalen Bild.
- Fortschrittsstriche: Die Information steht im Text „Schritt 2 von 3“, die Striche sind Schmuck; damit ist AA erfüllt. Dass inaktive Striche seit dem 15.10. unsichtbar sind, ist ein Nebeneffekt von „Grau wird Weiß“; nach derselben Regel vom 15.10. („weiße Fläche, 1 px schwarzer Rahmen“,
style.css:1457) bekommen sie den Rahmen. Gleiches gilt für Status „gesichtet“ und „archiviert“ (Hintergrund jetzt Weiß, ohne Rahmen sehen sie aus wie Fließtext). - Nie verwenden (als Regel in die Bauordnung): Grau-Text auf Orange oder Grün, Weiß auf Orange oder Grün.
- Hero-Wort: ohne sichtbare Änderung nicht lösbar, siehe D1.
A.5 Bewegung (prefers-reduced-motion: dämpfen, nicht abschalten)
B dämpft bereits (A.0). Für den Neubau:
- Regel: Bei reduzierter Bewegung keine Verschiebung über 8 px, kein Skalieren über 1,1, keine Unschärfe; Deckkraft-Übergänge bis 200 ms bleiben (so arbeitet B).
- Lücke in B: das „Plopp“ des Herzens (
.herz.pop svg { animation: pop .35s },style.css:333) steht nicht im Dämpfen-Block, weil der nur Übergänge kürzt, keine Animationen. Ergänzen: bei reduzierter Bewegung kurzes Aufhellen statt Wachsen. - Neu und betroffen: Handy-Menü (gleitet 8 px), Klebeleiste, Fenster am Handy (fährt von unten ein), Zeitstrahl der Bewerbung, Fortschrittsbalken im Lebenslauf, „Gespeichert“-Einblendung, Filter-Blatt. Alle mit derselben Regel.
scroll-behavior: smoothaus (B macht das).- Werbemotive: siehe Startseite.
A.6 Zeitlimits: Rückgängig in 10 Sekunden
Das Problem: Absage senden, Einladung senden, Bewerbung zurückziehen, Stelle beenden, Löschen wirken sofort; 10 s lang gibt es „Rückgängig“, danach geht die Mail raus (Plan). Steht „Rückgängig“ nur im Toast unten am Bildschirm, braucht ein Vorlesegerät-Nutzer zuerst die Ansage (3 bis 4 s), dann viele Tab-Schritte bis zum Toast am Ende der Seite. 10 s reichen dafür nicht. WCAG 2.2.1 verlangt bei Zeitgrenzen: abschaltbar, mindestens zehnfach verlängerbar oder vorher Warnung mit Verlängerung.
Lösung, ohne die 10 s für alle zu ändern:
- Rückgängig dort, wo man gerade ist. Nach der Aktion ersetzt ein Knopf „Rückgängig“ genau den Knopf, der gedrückt wurde (Handlungsleiste der Bewerbung, Zeilen-Knopf in der Stellenliste), und bekommt den Fokus. Das Vorlesegerät sagt „Absage an Jonas Weber wird gesendet. Rückgängig, Schaltfläche.“ Ein Enter reicht. Der Toast erscheint zusätzlich für Sehende.
- Zeit fest 10 Sekunden. Der Server verschickt nach dieser Zeit (die Warteschlange kennt die Einstellung je Nutzer).
- Keine laufende Sekundenanzeige für Vorlesegeräte: ein sichtbarer Balken darf schrumpfen, ist aber
aria-hidden; keine Ansage je Sekunde. - Toast bleibt stehen, solange die Maus darüber ist oder der Fokus darin liegt; Info-Toasts ohne Rückgängig stehen 6 s statt 3,4 s (B,
app.js:42). Was in einem Toast steht, steht immer auch an anderer Stelle (Status in der Zeile, Merk-Zähler im Kopf).
Weitere Zeitgrenzen:
- Bewerbungsentwurf 7 Tage, Bestätigungslink 7 Tage: über 20 Stunden, keine Pflicht nach 2.2.1, Hinweis vorher per Mail (Plan).
- „E-Mail erneut senden“ nach 60 s: keine Zeitgrenze, nur eine Wartezeit; Umsetzung siehe Bewerben-Fenster.
- Sitzung abgelaufen: Eingaben bleiben, nach Anmelden zurück an dieselbe Stelle (Plan). Verwaltung siehe dort.
A.7 Zielgröße 44 px
Stellen in B unter 44 px und die Lösung ohne Optikänderung (unsichtbar vergrößerte Trefferfläche, das Bild bleibt gleich):
| Stelle | Größe heute | Lösung |
|---|---|---|
Kennwort „Zeigen“ im Feld (.passwort button, style.css:616) | 40 px hoch | Höhe 44 px; das Feld ist 52 px hoch, der Knopf ist durchsichtig, sieht gleich aus |
Stadt-Chips in der Schnellfilter-Leiste (.schnellfilter .stadt-chip, :841) | 40 px | Trefferfläche per unsichtbarem Rand auf 44 px; Abstand zwischen Chips bleibt mindestens 8 px |
„Anmelden“ im kompakten Kopf (.kompaktkopf .btn-anmelden, :1342) | 40 px | wie oben |
Sprach-Flagge im kompakten Kopf (.kompaktkopf .sprache-flagge, :1351) | 40 × 40 px | wie oben |
Link im Toast („Merkliste ansehen“, .toast a) | Texthöhe | Trefferfläche 44 px hoch innerhalb des Toasts |
Haken in .check (Einwilligung) | Kästchen 20 px | die ganze Beschriftung ist klickbar; Zeile mindestens 44 px hoch |
Neue Teile: Herz, ✕, „…“-Menü je Zeile, Pfeile im Lebenslauf und „Vorherige/Nächste Bewerbung“ als .icon-btn (44 px); Zeilen in Listen mindestens 64 px (B .chat__liste button); Status-Marken sind nicht klickbar und dürfen kleiner bleiben (30 px). Links im Fließtext sind ausgenommen.
A.8 Barrierefreiheitserklärung (falls das BFSG gilt)
Gilt es? Einschätzung, keine Rechtsberatung: Das BFSG erfasst seit 28.06.2025 Dienstleistungen im elektronischen Geschäftsverkehr, die Verbraucher zum Abschluss eines Vertrags nutzen. Ein kostenloses Bewerberkonto mit Nutzungsbedingungen kann darunter fallen. Ausgenommen sind Kleinstunternehmen (weniger als 10 Beschäftigte und höchstens 2 Mio. € Jahresumsatz oder Bilanzsumme). Ob 3BS darunter fällt, beantwortet der Kunde mit der Größe des Unternehmens (Dokument „Offene Fragen“ R5); die Erklärung hat Nomad vorbereitet (RECHTSTEXTE P-5050-RT, Abschnitt 6).
Wenn ja, was hinein muss (BFSG § 14 mit Anlage 3):
- allgemeine Beschreibung der Dienstleistung (was Bululu macht, für wen),
- Erläuterungen, die man zur Nutzung braucht (Anmelden, Bewerben, Postfach),
- wie die Anforderungen erfüllt werden: Grundlage WCAG 2.1 AA / EN 301 549, Stand der Prüfung mit Datum, bekannte Lücken (voraussichtlich: maschinell übersetzte Anzeigen, von Bewerbern hochgeladene Anlagen in der Mappe, eingebettete PDF-Ansicht),
- Kontakt für Hinweise auf Barrieren (Mail und Telefon von 3BS),
- die zuständige Marktüberwachungsbehörde: Marktüberwachungsstelle der Länder für die Barrierefreiheit von Produkten und Dienstleistungen (MLBF) in Magdeburg; Anschrift beim Schreiben von deren Seite übernehmen.
Wo: eigene Seite „Barrierefreiheit“ unter Rechtliches im Fuß (neben Impressum, Datenschutz, AGB), Verweis darauf in den AGB. In allen freigegebenen Sprachen, gepflegt in der Verwaltung unter Inhalte › Rechtstexte (Plan). Die Seite selbst ist schlicht (Überschriften, Listen), damit sie das Erklärte auch einhält.
Aufwand: Erstfassung von Nomad (27.10., RECHTSTEXTE P-5050-RT), anwaltliche Prüfung empfiehlt Nomad bei der Übergabe. Gilt das BFSG nicht, ist die Seite freiwillig; das AA-Ziel bleibt (Plan).
A.9 Barrierefreie PDF-Mappe
Ja, getaggt, für den Teil, den Bululu erzeugt (Deckblatt, Anschreiben, Lebenslauf). Die Mappe ist ein Dokument, das der Bewerber über den Dienst erhält und selbst herunterlädt; gilt das BFSG, gehört sie dazu. Die Firmenseite ist B2B, dort zählt es für Mitarbeiter mit Behinderung.
Wie:
- Chromium erzeugt getaggte PDFs (Druck-Schnittstelle mit Option für Tags und Lesezeichen; in Puppeteer/Playwright die Optionen
taggedundoutline). Die Qualität hängt am HTML der Vorlage: echte Überschriften (h1Name,h2Berufserfahrung usw.), Listen als Listen, keine Layout-Tabellen, Schmuck (Kreise, Bänder der Deckblätter) als CSS-Hintergrund, damit er nicht vorgelesen wird,lang="de", Dokumenttitel „Bewerbung Ahmet Yılmaz, Schweißer MAG“ in den Metadaten, Foto mitalt„Bewerbungsfoto von Ahmet Yılmaz“. - Anlagen (Zeugnisse, Fotos, fremde PDFs) bleiben, wie sie hochgeladen wurden; sie lassen sich nicht nachträglich zugänglich machen. Beim Anhängen gehen Tags gern verloren. Darum: zuerst testen, ob die Zusammenführung die Tags des Bululu-Teils erhält; wenn nicht, liegen die Anlagen in der Firmenansicht als einzelne Dateien neben der Mappe, und die Mappe nennt sie mit Lesezeichen. In der Erklärung (A.8) als bekannte Grenze.
- Arabische oder türkische Zeichen in Namen: Die PDF-Schrift braucht Ersatzschriften (Noto Sans Arabic), sonst erscheinen Kästchen.
- Prüfung: veraPDF (Prüfprofil PDF/UA-1) als Test beim Bau auf dem Server, dazu einmal von Hand mit VoiceOver. Vollständiges PDF/UA ist mit Chromium nicht garantiert; Ziel ist „getaggt, richtige Lesereihenfolge, Lesezeichen, Sprache, Titel, Prüfung ohne schwere Fehler“.
Aufwand:
| Teil | Tage |
|---|---|
| Vorlage semantisch bauen (fällt beim Bau der Mappe ohnehin an, nur Mehraufwand) | 0,5 |
| Tags und Lesezeichen in Chromium einschalten, Metadaten | 0,25 |
| Anlagen anhängen ohne Tag-Verlust testen, sonst Ausweichweg | 1 |
| veraPDF in die automatische Prüfung (Java im Bau-Container, nur beim Bau) | 0,5 |
| Einmal von Hand prüfen und nachbessern | 0,5 |
| Summe | rund 2,5 bis 3 Tage |
Die Mappe liegt im Abschnitt 2b (nach dem Livegang bis 15.12.); die 2,5 bis 3 Tage gehören dorthin.
Andere Sprachen in der Bedienung
Einheitliche Begriffe je Sprache, Längen von Knöpfen, Arabisch von rechts nach links und wie Bewerber die Sprache wählen.
B.0 Grundregeln für alle Sprachen
- Seitensprache und Richtung kommen aus der Adresse:
/tr/…→<html lang="tr" dir="ltr">,/ar/…→<html lang="ar" dir="rtl">(next-intl, Plan). - Teile in anderer Sprache bekommen ihr eigenes
lang: deutsche Anzeige auf türkischer Oberflächelang="de", Sprachnamen in der Auswahl (B so). Das ist zugleich WCAG 3.1.2 und Voraussetzung für richtiges Vorlesen, Silbentrennung und Rechtschreibhilfe. - Keine Texte im CSS: B hat
content: "Anzeige"(style.css:352) undcontent: "Weiterlesen"(:990). Die wandern in die Sprachdateien, sonst bleiben sie auf jeder Sprache deutsch und werden von Vorlesegeräten uneinheitlich gelesen. - Mengen immer als ICU-Mehrzahl (next-intl kann das):
{anzahl, plural, one {# Bewerbung} other {# Bewerbungen}}. Arabisch hat sechs Formen (null, eins, zwei, wenige, viele, andere), Türkisch setzt nach Zahlen keine Mehrzahl („3 başvuru“). Nie „Bewerbung(en)“, nie Zahl + Wort zusammengesetzt im Code. - Datum, Uhrzeit, Zahl, „vor 2 Tagen“ über
Intlmit der Sprache des Nutzers (Intl.RelativeTimeFormatliefert „2 gün önce“, „منذ يومين“, „2 days ago“). - Ein Wort, ein Ding, je Sprache (Bedienregel 3): Glossar in
sprachen/<sprache>/glossar.json, Übersetzer halten sich daran.
| DE | EN | TR | AR |
|---|---|---|---|
| Stelle | Job | İlan | وظيفة |
| Bewerbung | Application | Başvuru | طلب |
| Betrieb (Bewerbersicht) | Employer | İşveren | الشركة |
| Lebenslauf | CV | Özgeçmiş | السيرة الذاتية |
| Postfach | Inbox | Mesajlar | الرسائل |
| Merkliste | Saved jobs | Kaydedilenler | المحفوظة |
| Job-Alarm | Job alert | İş alarmı | تنبيه الوظائف |
| Deutschkenntnisse | German level | Almanca seviyesi | مستوى الألمانية |
| Konto | Account | Hesap | الحساب |
| Kennwort | Password | Şifre | كلمة المرور |
| Anmelden | Sign in | Giriş yap | تسجيل الدخول |
Alle TR- und AR-Wörter in diesem Teil sind Vorschläge; gegengelesen wird vor dem Livegang von einem Muttersprachler (Karte 0 E13; wer bei 3BS mitliest, steht in der Sammel-Anfrage am Ende, Z8).
B.1 Türkisch
- Länge: Kurze Bedienwörter sind auf Türkisch meist so lang wie auf Deutsch oder kürzer („İlan ver“ statt „Stelle inserieren“). Lang werden zusammengesetzte Endungen („Başvurularınızı“, 15 Zeichen) und Fügungen mit „için“. Planwert: +30 % auf die deutsche Länge bei Knöpfen.
- İ/ı und Großschreibung: Türkisch hat i/İ und ı/I. Großschreibung per CSS (
text-transform: uppercasein.ueber,.einstieg__ueber,.anzeige-nativ__label,.vorschau-karte__label) ist nur richtig, wenn das Elementlang="tr"trägt; dann macht der Browser aus „bilgi“ korrekt „BİLGİ“. Im Code nietoUpperCase()/toLowerCase()auf Oberflächentext, sonderntoLocaleUpperCase("tr"). - Suche: Die Anzeigen sind deutsch. Eine türkische Tastatur macht aus „Iserlohn“ beim Kleinschreiben mit türkischer Regel „ıserlohn“. Darum wird der Suchbegriff immer mit deutscher Regel verglichen und vorher ı → i, İ → i umgesetzt, im Code und in der Datenbank (
lower()hängt sonst an der Sortierregel der Datenbank). - Initialen-Kreis: Name so nehmen, wie eingetippt; nur wenn der erste Buchstabe klein ist, mit der Sprache des Bewerbers groß machen (aus „ilker“ wird „İ“, nicht „I“).
- Endungen an Platzhaltern: „Metallbau Hagedorn'a başvurdunuz“ braucht je nach letztem Laut des Namens -a, -e, -ya, -ye. Das kann kein Platzhalter. Regel: Sätze so bauen, dass der Name ohne Endung steht: „Başvurunuz ulaştı: Metallbau Hagedorn“ oder „İşveren: Metallbau Hagedorn“.
- Anrede: durchgehend „siz“ (entspricht „Sie“).
- Schriften: Outfit und Manrope haben die türkischen Zeichen im Zeichensatz „latin-ext“. B lädt sie heute von Google; beim Selbst-Ausliefern (Plan) muss die latin-ext-Datei mitkommen, sonst erscheinen ğ, ş, ı, İ in einer Ersatzschrift. Einmal sichtbar prüfen: „İŞ İLANI ĞÜŞIÖÇ“ in Outfit 600.
B.2 Arabisch (von rechts nach links)
Was sich spiegelt:
- Seitenaufbau: Logo rechts, Menü-Knopf links; Lesefluss, Textausrichtung, Reihenfolge in Zeilen (Monogramm rechts, Herz links).
- Spalten: Filter-Spalte rechts, Seitenleiste der Stelle links; Postfach Liste rechts, Verlauf links.
- Richtungs-Symbole: Zurück zeigt nach rechts, Weiter nach links; der Pfeil von
.mehr-link::after(„→“) wird „←“; Brotkrumen-Trenner „›“ wird „‹“; Pfeil „zur Karriereseite“ ↗ wird ↖; Auswahlpfeil im Auswahlfeld (background-position: right 14px) wandert nach links. - Fortschritt: Striche und Balken füllen sich von rechts.
- Schalter: „an“ ist links.
- Eigene Nachrichten im Postfach links, fremde rechts.
- Zeitstrahl der Bewerbung (waagerecht am Desktop) läuft von rechts nach links; am Handy senkrecht, dort ändert sich nur die Seite der Linie.
- Fenster: ✕ oben links.
- Pfeiltasten ← → für die nächste Bewerbung folgen dem Bild: in AR ist ← die nächste.
- Einstiegs-Puzzle und alle
translateX-Bewegungen (12 Stellen in B) mit umgekehrtem Vorzeichen.
Was sich nicht spiegelt:
- Logo und Wortmarke „bululu“, Flaggen, Fotos (Bühne, Menschen, Firmenlogos), Karte der Region.
- Zahlen, Gehälter („3.200 €“), PLZ, Telefonnummern, E-Mail-Adressen, Internet-Adressen, Datum: immer von links nach rechts, als eigenständiger Einschub (
<bdi>bzw.dir="ltr"). Ziffern: westliche (0 bis 9), wie in der verbindlichen deutschen Anzeige und in der Mappe (Intl.NumberFormat("ar-u-nu-latn")). Datum als „12.10.2026“, keine Monatsnamen (die unterscheiden sich zwischen Syrien und Ägypten). - Lupe, Uhr, Herz, Haken, Teilen-Symbol, Play.
- Wiedergabe von Medien und der Ladekreis.
Gemischter Text: Firmennamen, Stellentitel und Orte sind deutsch (lateinische Schrift) mitten in arabischen Sätzen. Ohne Einschub-Isolierung springen Klammern und Satzzeichen: „Schweißer (m/w/d)“ erscheint sonst als „(Schweißer (m/w/d“. Regel: Jeder Platzhalter in einer Übersetzung wird in <bdi> gesetzt; next-intl erlaubt das über Rich-Text-Bausteine. Eingabefelder für Name, Nachricht und Freitext bekommen dir="auto", Felder für Telefon, E-Mail, PLZ, Internet-Adresse dir="ltr".
Schrift: Outfit und Manrope haben keine arabischen Zeichen. Ohne eigene Schrift nimmt jedes Gerät eine andere (iPhone Geeza Pro, Android Noto Naskh), das passt nicht zu B. Vorschlag: Noto Sans Arabic, selbst ausgeliefert, nur auf /ar/… geladen, und so eingereiht, dass lateinischer Text weiter in Manrope/Outfit erscheint: :lang(ar) { font-family: "Manrope", "Noto Sans Arabic", system-ui } (Manrope hat keine arabischen Zeichen, darum fällt nur Arabisch auf Noto). Dazu für :lang(ar): Laufweite 0 (B setzt bei Überschriften −0,015 bis −0,025 em und bei Kleinüberschriften +0,08 em; Laufweite zerreißt arabische Buchstabenverbindungen), Zeilenhöhe 1,8 statt 1,6, Schrift 1 px größer, keine Großschreibung (gibt es im Arabischen nicht), keine Kursive.
Anrede: Arabisch unterscheidet „du“ männlich und weiblich; es gibt kein geschlechtsneutrales „Sie“. Regel für Übersetzer: Bedientexte unpersönlich oder als Hauptwort („تم إرسال الطلب“, „Der Antrag wurde gesendet“), Knöpfe als Infinitiv-Hauptwort („إرسال“ statt „أرسِل/أرسلي“).
Name im Lebenslauf: Die Mappe ist deutsch. Hinweis am Namensfeld in AR: „اكتب اسمك بالأحرف اللاتينية كما في جواز السفر.“ („Name in lateinischer Schrift wie im Pass.“)
Mails: Mails in AR mit dir="rtl" am Rahmen der Mail; Knöpfe als Tabellen, damit Mailprogramme die Richtung nicht verlieren.
CSS-Aufwand: In style.css stehen 36 × left:, 27 × right:, 10 × margin-left, 5 × margin-right, 7 × padding-left, 10 × padding-right, 8 × text-align mit Richtung, 2 × background-position: right, 12 × translateX; dazu Inline-Stile in den HTML-Dateien. Der Plan schätzt 2 bis 3 Tage, Arabisch steht auf der Rückfall-Liste. Weg siehe Entscheidung D2.
B.3 Englisch
- Meist kürzer als Deutsch; lang sind „Apprenticeship“ (14), „Applications“ (12), „Opened by employer“ (18).
- Einheitlich US-Schreibweise, weil die Sprachwahl die US-Flagge zeigt.
- Einfache Sätze, „you“ ohne Umgangssprache; Zielgruppe sind auch Menschen mit Englisch als Zweitsprache (Indien, Rang 7 der Beschäftigten laut Recherche).
B.4 Je Bildschirm: wo es eng wird
Annahmen für die Rechnung: Handy 390 px, Seitenrand 16 px (B unter 700 px), also 358 px Inhalt; Manrope fett 16 px etwa 8,8 px je Zeichen, 15 px etwa 8,3 px, 13 px etwa 7,4 px. Arabisch ist meist kürzer in Zeichen, braucht aber 1 px mehr Schrift.
| Bildschirm | Stelle | DE (Zeichen) | EN | TR | AR | eng? |
|---|---|---|---|---|---|---|
| Kopf Desktop 900 bis 1100 px | Für Arbeitgeber · Stelle inserieren | 15 · 17 | For employers · Post a job | İşverenler için · İlan ver | لأصحاب العمل · انشر وظيفة | nein, keine Sprache länger als DE |
| Startseite Suchkarte | Umkreis-Auswahl (120 px breit, am Handy 108 px) | „Nur im Ort“ 10 | „This town only“ | „Sadece bu şehir“ 15 | „المدينة فقط“ | ja, schon auf Deutsch: Platz für etwa 6 Zeichen. Werte nur als Zahl: „0 km · 10 km · 25 km · 50 km · 100 km“, in jeder Sprache gleich |
| Startseite | Jobs finden | 11 | Find jobs | İş bul | ابحث عن وظيفة | nein (Knopf am Handy voll breit) |
| Jobs | Filter (2) · Sortierung | 10 | Filters (2) | Filtreler (2) | الفلاتر (2) | nein |
| Jobs | Sortier-Werte | Passend zuerst · Neueste zuerst · Nächste zuerst | Best match · Newest · Distance | En uygun · En yeni · Mesafe | الأنسب · الأحدث · الأقرب | nein |
| Jobs, Stellenzeile | Meta „Deutsch: Grundkenntnisse“ | 24 | German: basic | Almanca: temel | الألمانية: أساسية | knapp; Meta-Elemente dürfen umbrechen, je höchstens 22 Zeichen |
| Jobs | Mehr Stellen laden | 18 | Load more jobs | Daha fazla ilan | عرض المزيد | nein |
| Stelle | Klebeleiste „Jetzt bewerben“ | 14 | Apply now | Hemen başvur | قدّم الآن | nein |
| Stelle | Zustand „Beworben am 12.10. · Stand ansehen“ | 33 | Applied 12.10. · View status | Başvuru 12.10. · Durumu gör | تم التقديم 12.10. · عرض الحالة | knapp (Platz etwa 34): höchstens 30 |
| Stelle | „Passt das?“-Kacheln (2 × 2, je etwa 170 px) | Grundkenntnisse 15 | Basic | Temel düzey | أساسية | nein, Wert höchstens 16 |
| Bewerben-Fenster | Schritt-Titel | Schritt 2 von 3: Lebenslauf | Step 2 of 3: CV | Adım 2 / 3: Özgeçmiş | الخطوة 2 من 3: السيرة الذاتية | nein, darf umbrechen |
| Bewerben-Fenster | Ablage | Lebenslauf wählen oder Foto machen 34 | Choose CV or take a photo | Özgeçmiş seç veya fotoğraf çek | اختر السيرة الذاتية أو التقط صورة | nein, Fläche, zweizeilig erlaubt |
| Bewerben-Fenster | Bewerbung senden | 16 | Send application | Başvuruyu gönder | إرسال الطلب | nein |
| Bewerberbereich | 5 Reiter, Summe | 48 (Bewerbungen · Postfach · Lebenslauf · Merkliste · Job-Alarme) | 39 (Applications · Inbox · CV · Saved jobs · Job alerts) | 53 (Başvurular · Mesajlar · Özgeçmiş · Kayıtlı ilanlar · İş alarmları) | 51 (الطلبات · الرسائل · السيرة الذاتية · المحفوظة · تنبيهات الوظائف) | ja: scrollt am Handy in jeder Sprache; je Reiter höchstens 14 Zeichen, aktiver Reiter wird in Sicht gescrollt (A.1) |
| Bewerberbereich | Status-Marke, längste | „Einladung zum Gespräch“ 22 | Interview invitation 20 | Görüşme daveti 14 | دعوة إلى مقابلة | ja, schon auf Deutsch (nicht umbrechend, 13 px): höchstens 22, am Handy eigene Zeile |
| Bewerberbereich | Filter-Pillen | Alle · Offen · Abgeschlossen | All · Open · Closed | Tümü · Açık · Tamamlanan | الكل · مفتوحة · منتهية | nein, je höchstens 12 |
| Lebenslauf | Station hinzufügen | 19 | Add job | Deneyim ekle | إضافة خبرة | nein |
| Lebenslauf | Mappe ansehen (PDF) | 19 | View file (PDF) | Dosyayı gör (PDF) | عرض الملف (PDF) | nein |
| Firmenbereich | 5 Reiter | Stellen · Bewerbungen · Postfach · Firmenprofil · Team | Jobs · Applications · Inbox · Company profile · Team | İlanlar · Başvurular · Mesajlar · Firma profili · Ekip | الوظائف · الطلبات · الرسائل · ملف الشركة · الفريق | nein, scrollt am Handy wie DE |
| Bewerbungen Firma | Auswahl „Stelle: Alle“ + Pillen Neu · Offen · Alle in einer Zeile | etwa 380 px | ähnlich | ähnlich | ähnlich | ja, schon auf Deutsch: am Handy Auswahl in eigener Zeile, Pillen darunter |
| Bewerbungen Firma | Handlungsleiste unten, zwei Knöpfe (je etwa 118 px Text) | Einladen · Absagen | Invite · Decline | Davet et · Reddet | دعوة · اعتذار | nein, je höchstens 12 |
| Bewerbungen Firma | nach Einladung: drei Wege | Zusage · Neuer Termin · Absagen | Offer · New date · Decline | Kabul · Yeni tarih · Reddet | قبول · موعد جديد · اعتذار | knapp: je höchstens 10 |
| Stelle anlegen | Beschäftigungsart, 4 Pillen | Vollzeit · Teilzeit · Ausbildung · Praktikum | Full-time · Part-time · Apprenticeship · Internship | Tam zamanlı · Yarı zamanlı · Mesleki eğitim · Staj | دوام كامل · دوام جزئي · تدريب مهني · تدريب عملي | ja in TR/EN: zwei Zeilen; Pillen dürfen umbrechen, je höchstens 14 |
| Stelle anlegen | Veröffentlichen · Vorschau (unten fest) | 15 · 8 | Publish · Preview | Yayınla · Önizleme | نشر · معاينة | nein |
| Stelle anlegen | „Entwurf gespeichert 12:03“ neben der Überschrift | 25 | Draft saved 12:03 | Taslak kaydedildi 12:03 | تم حفظ المسودة 12:03 | am Handy unter die Überschrift |
| Postfach | Nur ungelesene | 14 | Unread only | Okunmamış | غير المقروءة | nein, höchstens 14 |
| alle | Toast mit Rückgängig | Absage gesendet. Rückgängig | Declined. Undo | Ret yanıtı gönderildi. Geri al | تم إرسال الاعتذار. تراجع | nein, Toast bis 420 px |
Status-Wörter je Sprache (Bewerbersicht, Usability 3.6):
| DE | EN | TR | AR |
|---|---|---|---|
| E-Mail bestätigen | Confirm email | E-postayı onaylayın | تأكيد البريد الإلكتروني |
| Angekommen | Received | Ulaştı | وصل الطلب |
| Vom Betrieb geöffnet | Opened by employer | İşveren açtı | فتحته الشركة |
| Einladung zum Gespräch | Interview invitation | Görüşme daveti | دعوة إلى مقابلة |
| Zusage | Offer | Olumlu yanıt | قبول |
| Absage | Not selected | Olumsuz yanıt | لم يتم الاختيار |
| Zurückgezogen | Withdrawn | Geri çekildi | تم السحب |
| Stelle nicht mehr offen | Job closed | İlan kapandı | الوظيفة مغلقة |
Firmensicht: Neu · Gesichtet · Eingeladen · Zusage · Absage · Zurückgezogen · Stelle beendet = New · Viewed · Invited · Offer · Declined · Withdrawn · Job closed = Yeni · Görüldü · Davet edildi · Olumlu · Olumsuz · Geri çekildi · İlan kapandı = جديد · تمت المشاهدة · تمت الدعوة · قبول · رفض · تم السحب · الوظيفة مغلقة.
„Absage“ ist auf Bewerberseite bewusst weich übersetzt („Not selected“, „لم يتم الاختيار“, „nicht ausgewählt“), passend zu Usability 5.3.
B.5 Regeln für Übersetzer
Höchstlänge je Element (Zeichen, gilt für jede Sprache; was darüber liegt, wird gekürzt, nicht kleiner gesetzt):
| Element | Höchstens | Grund |
|---|---|---|
| Hauptknopf voll breit (Klebeleiste, Fenster, Suchen) | 28 | 300 px Text am Handy |
| Knopf halb breit (zwei nebeneinander) | 12 | 118 px Text |
| Knopf in einer Zeile (Rand, klein) | 14 | Zeile darf nicht umbrechen |
| Dreier-Leiste (Zusage · Neuer Termin · Absagen) | 10 je Knopf | 358 px für drei |
| Reiter | 14 | scrollt; ein Reiter nie breiter als 40 % des Handys |
| Filter-Pille, Auswahl-Pille | 12 (Stelle anlegen: 14, umbrechen erlaubt) | drei je Zeile |
| Status-Marke | 22 | bricht nicht um |
| Marke „Neu“, „Top“ | 10 | |
| Kopf-Link Desktop | 17 | Kopf 900 bis 1100 px |
| Umkreis-Werte | 6 (nur Zahl + km) | 120 px Auswahlfeld |
| Meta-Angabe in der Stellenzeile | 22 | umbrechen erlaubt |
| „Passt das?“-Wert | 16 | Kachel 170 px |
| Toast-Text / Rückgängig | 60 / 12 | |
| Feldbeschriftung | 32 | umbrechen erlaubt |
Seitentitel (<title>) | 60 | Suchergebnis, Tab |
| Mail-Betreff | 60 | Vorschau am Handy |
Weitere Regeln:
- Glossar (B.0) einhalten; ein Wort, ein Ding.
- Platzhalter nie verändern, nie mit Endung versehen (TR), immer isoliert (AR,
<bdi>setzt der Code). - Jede Menge als ICU-Mehrzahl mit allen Formen der Sprache (AR: sechs).
- Anrede: DE „Sie“, TR „siz“, EN „you“, AR unpersönlich (B.2).
- Keine Abkürzungen, die das Deutsche nicht auch hat.
- Anführungszeichen nach Sprache: DE „…“, TR “…”, AR «…», EN “…”. Kein Gedankenstrich als Satzzeichen (Textprüfung-Regel, gilt für alle Sprachen).
- Rechtliches (Einwilligungen, Datenschutz-Satz im Fenster) übersetzt nur Super Admin nach Freigabe des deutschen Texts; verbindlich bleibt Deutsch (Hinweis darunter).
- Jede Übersetzung wird einmal im Handy-Bild geprüft.
B.6 Hinweis „Bitte auf Deutsch eintragen“
Steht einmal oben in jedem Lebenslauf-Bereich mit Freitext und einmal über „Nachricht an den Betrieb“ im Bewerben-Fenster, verknüpft mit den Feldern (A.2). Zweiter Satz nimmt die Angst vor Fehlern (Ahmet, Usability 1.1).
| Sprache | Langfassung (oben im Bereich) | Kurzfassung (an einzelnen Feldern, wenn nötig) |
|---|---|---|
| DE | „Bitte auf Deutsch eintragen. Die Betriebe lesen Ihren Lebenslauf auf Deutsch. Einfache Sätze reichen.“ | „Bitte auf Deutsch“ |
| TR | „Lütfen Almanca yazın. İşverenler özgeçmişinizi Almanca okur. Basit cümleler yeterli.“ | „Lütfen Almanca“ |
| AR | „يُرجى الكتابة باللغة الألمانية. تقرأ الشركات سيرتك الذاتية بالألمانية. الجمل البسيطة تكفي.“ | „بالألمانية من فضلك“ |
| EN | „Please write in German. Employers read your CV in German. Simple sentences are fine.“ | „Please write in German“ |
Die Felder selbst bekommen lang="de" (Rechtschreibhilfe auf Deutsch) und in AR zusätzlich dir="ltr", damit deutscher Text beim Tippen nicht springt.
B.7 Sprachwahl
Wo:
- Im Kopf auf jeder Seite, Desktop und Handy (B: Flaggen-Knopf zwischen Merkliste und Menü,
style.css:1220). Der Vorlesename ist zweisprachig, damit ihn auch findet, wer Deutsch nicht liest: „Sprache: Deutsch. Language“ bzw. auf TR „Dil: Türkçe. Language“. - In der Liste jede Sprache in ihrer eigenen Schrift mit
lang(B so), nur freigegebene Sprachen (Plan: von acht in B bleiben vier). - Im Konto: Einstellungen › „Sprache für Oberfläche und E-Mails“.
- Nicht im Bewerben-Fenster (ein Wechsel dort würde das Fenster neu laden).
- Erster Besuch: Kommt jemand mit türkischer Browsersprache auf eine deutsche Seite, erscheint über dem Kopf eine Zeile in seiner Sprache: „Bu sayfa Türkçe de var. Türkçe göster · ✕“. Kein automatisches Umleiten: Ein auf WhatsApp geteilter deutscher Link bleibt deutsch. Nur die Startadresse „/“ leitet nach Browsersprache weiter (Plan:
proxy.ts).
Wie gemerkt:
- Die Adresse ist die Wahrheit (
/tr/…); alle Links behalten die Sprache. - Angemeldet: im Konto auf dem Server, gilt für Mails (Plan).
- Ohne Konto: ein notwendiges Cookie „sprache“ (1 Jahr), nur gesetzt nach ausdrücklicher Wahl, nur für die Weiterleitung von „/“. Notwendig, weil vom Nutzer angefordert; keine Einwilligung nötig, steht in der Datenschutzerklärung unter „notwendig“. Geschrieben über den Gerätespeicher-Baustein (Plan).
- Job-Alarm ohne Konto speichert die Sprache am Alarm (für die Mail).
Gemischte Sprache (Oberfläche TR, Anzeige DE):
- Feste Felder (Ort, Beschäftigung, Deutschkenntnisse, Gehalt, Start) kommen aus den festen Übersetzungen, nie aus der Maschine (Recherche: Zahlen laufen nie durch eine Maschine).
- Freitext der Anzeige: die im Hintergrund erzeugte Übersetzung (Plan), darüber in TR: „Otomatik çevrildi. Bağlayıcı olan Almanca metindir. Almanca aslını göster“. Der Umschalter tauscht den Text an Ort und Stelle (keine eigene Adresse, Plan und Recherche).
- Titel: übersetzt groß, darunter klein der deutsche Titel mit
lang="de". Bewerber begegnen dem deutschen Titel in der Mail, in der Mappe und im Gespräch; sie müssen ihn wiedererkennen. - Firmenname, Ort, Ansprechperson: nie übersetzt.
- Fehlt die Übersetzung noch: deutscher Text mit Hinweis „Bu ilan henüz Türkçe değil.“ (Plan).
- Bewerben-Fenster, Status, Mails: in der Sprache des Bewerbers. Mappe: immer deutsch (Plan).
- Nachrichten im Postfach werden nicht übersetzt. Über dem Eingabefeld des Bewerbers in TR/AR/EN die Kurzfassung „Bitte auf Deutsch“ (B.6).
- Firmenbereich: in der Sprache des Firmennutzers; Lebensläufe und Anschreiben kommen deutsch an. Die Verwaltung ist nur deutsch (Plan).
Messen nach dem Livegang
Welche Zahlen nach dem Start ausgewertet werden, welche Ziele gelten und was bei schlechten Werten geändert wird.
C.0 Grundsatz
- Keine Cookies, keine IP-Adressen, keine Nutzerkennung, kein fremder Dienst. Gespeichert werden nur Tagessummen („am 03.12. wurde 41-mal das Bewerben-Fenster geöffnet, Sprache TR, Handy“). Es entsteht kein Datensatz je Person; damit gibt es nichts, was einer Einwilligung bedarf, und nichts, was gelöscht werden müsste. Der Cookie-Hinweis bleibt bei „notwendig“ (Plan); der Schalter „Statistik“ aus B (
app.js:1440) entfällt. - Zwei Quellen:
- Zähler im Browser für alles, was vor dem ersten gespeicherten Datensatz passiert (Suche, Stelle angesehen, Fenster geöffnet, Schritt fertig). Ein kleiner Beacon an
/api/zmit Ereignisname und wenigen festen Merkmalen. - Fachdaten, die das System ohnehin speichert (Bewerbung, Entwurf, Firma, Stelle mit Zeitpunkten). Daraus sind Firmen-Trichter und Antwortzeiten exakt berechenbar, ganz ohne Zählung.
- Folge des Verzichts: Der Bewerber-Trichter ist ein Verhältnis von Tagessummen, kein Weg einzelner Personen. Für die Frage „wo bricht es ab?“ reicht das; für Einzelwege bräuchte es eine Kennung, also Einwilligung. A/B-Tests gibt es darum nicht; verglichen wird vorher/nachher (C.7).
C.1 Trichter Bewerber
| # | Schritt | Ereignis | Quelle, wo im Code | Merkmale |
|---|---|---|---|---|
| 1 | Suche gestartet | suche | Browser, bausteine/suche/ beim Absenden und beim Tippen auf einen Oft-gesucht-Begriff | quelle (start, jobs, chip, fachbereich), treffer (null, wenig = 1 bis 9, viele = 10+) |
| 2 | Treffer bekommen | (Merkmal treffer von 1) | ||
| 3 | Stelle geöffnet | stelle_aufruf | Browser, Seite Stelle (Plan: dienste/zaehler/aufrufe.ts, ab Tag 1) | stelle_id, quelle (liste, google, alarm, aehnliche, firma, direkt; aus der Verweis-Adresse nur als Klasse, die Adresse selbst wird nicht gespeichert) |
| 4 | Bewerben geöffnet | bewerben_geoeffnet | Browser, Bewerben-Fenster beim Öffnen; bei Karriereseite der Klick auf „Zur Bewerbung beim Betrieb“ (Plan: zählt den Klick) | weg (bululu, karriereseite) |
| 5 | Schritt 1 fertig (E-Mail, Konto) | bewerben_schritt | Browser, nach erfolgreichem „Weiter“ | schritt = 1, konto (neu, bestand) |
| 6 | Schritt 2 fertig (Telefon, Datei) | bewerben_schritt | wie oben | schritt = 2, art (datei, foto, profil) |
| 7 | abgeschickt | aus Fachdaten: Bewerbung angelegt | Server, fachlich/bewerbung/ | Sprache, Gerät am Datensatz der Bewerbung |
| 8 | bestätigt (Mail) | aus Fachdaten: Zeitpunkt „E-Mail bestätigt“ | Server | Dauer bis Bestätigung |
Begleitende Ereignisse: hochladen_fehler (Server, dienste/dateien/; grund: zu_gross, format, word, virus, netz), jobalarm_angelegt (quelle: leer, start, stelle, firma), sprache_gewechselt (von, nach), entwurf_verfallen (aus Fachdaten nach 7 Tagen).
Jedes Ereignis trägt sprache (de, en, tr, ar) und geraet (handy, tablet, desktop nach Fensterbreite: unter 700, 700 bis 899, ab 900 px). Mehr nicht.
C.2 Trichter Firma (vollständig aus Fachdaten)
| # | Schritt | Fachdatum | Neu im Datenmodell? |
|---|---|---|---|
| 1 | Registriert | Firma angelegt am | nein |
| 2 | Mail bestätigt | Konto bestätigt am | nein |
| 3 | Erste Stelle angelegt (Entwurf) | erste Stelle angelegt am | nein |
| 4 | Erste Stelle veröffentlicht | erste Stelle „aktiv ab“ | nein |
| 5 | Prüfung abgeschlossen | Prüfung erledigt am (Plan: Frist 1 Werktag) | nein |
| 6 | Erste Bewerbung eingegangen | erste Bewerbung bestätigt am | nein |
| 7 | Bewerbung geöffnet | „Gesichtet“ am | ja: geoeffnet_am an der Bewerbung |
| 8 | Erste Antwort | erste Einladung, Absage, Zusage oder Nachricht der Firma | ja: erste_antwort_am an der Bewerbung |
Antwortzeit = erste_antwort_am minus Zeitpunkt der bestätigten Bewerbung, in Werktagen. Die beiden neuen Felder kommen in Abschnitt 0 ins Datenmodell; sie dienen zugleich der Zeile „wartet seit 3 Tagen auf eine Antwort“ (Usability 3.8, 3.10).
C.3 Startziele
Eigene Annahmen ohne Vergleichszahlen; nach drei Monaten aus echten Daten neu festgelegt. Bewertet wird erst ab 30 Fällen im Monat, darunter stehen nur Zahlen ohne Urteil.
| Kennzahl | Startziel |
|---|---|
| Suchen ohne Treffer | unter 15 % |
| Stellenaufrufe aus der Liste je Suche | mindestens 0,6 |
| Stelle geöffnet → Bewerben geöffnet | mindestens 8 % |
| Bewerben geöffnet → Schritt 1 fertig | mindestens 75 % |
| Schritt 1 → Schritt 2 fertig | mindestens 80 % |
| Schritt 2 → abgeschickt | mindestens 90 % |
| Bewerben geöffnet → abgeschickt (gesamt) | mindestens 55 % |
| abgeschickt → bestätigt (neue Konten) | mindestens 85 % in 24 h, 90 % in 7 Tagen |
| Fehler beim Hochladen | unter 5 % der Versuche |
| TR, AR, EN gegen DE, je Schritt | höchstens 10 Prozentpunkte schlechter |
| Firma registriert → erste Stelle veröffentlicht | mindestens 60 % binnen 14 Tagen |
| Prüfung neuer Firmen | Median höchstens 1 Werktag (Plan) |
| Bewerbung geöffnet | 80 % binnen 3 Werktagen |
| Erste Antwort der Firma | Median höchstens 3 Werktage; ohne jede Antwort nach 14 Tagen höchstens 20 % |
C.4 Wo im Code gezählt wird, und wie gespeichert
dienste/zaehler/ereignisse.ts: die einzige Liste erlaubter Ereignisnamen und ihrer Merkmale, als TypeScript-Typ. Ein Ereignis, das dort nicht steht, lässt sich nicht zählen (Typprüfung); damit bleibt die Liste kurz und es landet nie Freitext in der Zählung.dienste/zaehler/zaehlen.ts: serverseitigzaehle(ereignis, merkmale), erhöht die Tagessumme (eine Zeile je Tag × Ereignis × Merkmalskombination, „+1“ per Upsert). Wird auch fürhochladen_fehlerdirekt indienste/dateien/aufgerufen.dienste/zaehler/aufrufe.ts: Stellenaufrufe (gibt es im Plan schon), nutztzaehlen.ts.bausteine/zaehler/imBrowser.ts:zaehleImBrowser(ereignis, merkmale)pernavigator.sendBeacon, bricht ab, wennnavigator.webdrivergesetzt ist. Aufgerufen ausbausteine/suche/, der Stellen-Seite und dem Bewerben-Fenster.app/api/z/route.ts: nimmt Beacons an, prüft gegen die Liste, verwirft bekannte Bots anhand der Browserkennung (wird gelesen, nicht gespeichert), Bremse gegen Massenaufrufe im Arbeitsspeicher (nicht in der Datenbank).- Warum im Browser und nicht beim Ausliefern der Seite: Google liest „Mehr Stellen laden“ als echte Links (Plan); serverseitige Zählung würde jeden Besuch des Suchroboters als Suche zählen.
- Tabellen:
zaehler_tag(Tag, Ereignis, Merkmale, Anzahl), 25 Monate aufbewahrt;suchwort_monat(Monat, Suchwort klein geschrieben, Treffer-Klasse, Anzahl) nur für Suchen ohne Treffer, Wörter mit Ziffernfolgen ab 5 Stellen oder „@“ werden nicht gespeichert (keine Telefonnummern, keine Mails), höchstens 40 Zeichen, gezeigt nur ab 3 Nennungen im Monat, 13 Monate aufbewahrt. - Monatslauf: eine Hintergrundaufgabe (pg-boss) am 1. jeden Monats um 6:00 rechnet die Monatswerte (C.5) aus Zählern und Fachdaten, legt sie in
monatswerteab und schickt sie per Mail an Super Admin und Verwaltung. - Datenschutzerklärung: ein Absatz „Wir zählen Seitenaufrufe und Schritte im Bewerbungsablauf ohne Cookies und ohne Speicherung von IP-Adressen. Gespeichert werden nur Tagessummen.“
C.5 Auswertung in der Verwaltung: die fünf Zahlen
Ort: Verwaltungs-Startseite, kein zweiter Zahlenblock: unter der Reihe „Zahlen“ (Usability 3.14) nur für den Super Admin ein Textlink „Monatswerte“, der je Kennzahl einen Satz aufklappt; 3BS sieht nur die Reihe. Kein eigener Menüpunkt (Plan: höchstens 6 Hauptpunkte, alle vergeben). Je Satz: Wert, Vormonat, Startziel, Urteil als Wort („Bewerbungen fertig: 58 %, Vormonat 52 %, Ziel 55 %, im Ziel“; sonst „unter Ziel“, „zu wenige Fälle“), keine Ampelfarbe allein. Die Aufteilung nach Sprache und Gerät steht nur in der Monats-Mail (C.4), nicht auf dem Bildschirm.
- Bewerbungen fertig: Anteil der geöffneten Bewerben-Fenster, die abgeschickt wurden; darunter der schwächste der drei Schritte in einem Satz („Am meisten verloren in Schritt 2, Lebenslauf: 31 %“).
- E-Mail bestätigt: Anteil neuer Konten, die ihre Bewerbung binnen 7 Tagen bestätigt haben, und Median der Dauer.
- Suchen ohne Treffer: Anteil, dazu die zehn häufigsten Suchwörter ohne Treffer.
- Firmen gestartet: Anteil der Firmen, die im Monat registriert wurden und binnen 14 Tagen eine Stelle veröffentlicht haben.
- Antwortzeit der Betriebe: Median der ersten Antwort in Werktagen und Anteil der Bewerbungen ohne jede Antwort nach 14 Tagen; darunter die fünf Firmen mit den meisten unbeantworteten Bewerbungen (nur Namen und Zahl, für den Anruf).
C.6 Rhythmus
- Erste 8 Wochen nach dem Livegang: wöchentlich montags 10 Minuten (Nomad): Hochladen-Fehler, E-Mail-Bestätigung, Suchwörter ohne Treffer. Das sind die Stellen, an denen Technik versagen kann (Mailzustellung über das neu hochgefahrene
mail.bululu.de, Plan). - Danach monatlich: am 1. kommt die Mail mit den fünf Zahlen; Nomad liest sie, 30 Minuten, und schickt 3BS drei Sätze: was gut ist, was schlecht ist, was geändert wird.
- Nach drei Monaten: Startziele durch Werte aus den eigenen Daten ersetzen (z. B. Median der ersten drei Monate plus 10 %).
- Je Änderung: eine Zeile im Messprotokoll (Datum, was, welche Zahl soll sich bewegen), Vergleich vier Wochen davor gegen vier Wochen danach. Nie zwei Änderungen am selben Schritt gleichzeitig.
C.7 Was bei schlechten Werten getan wird
| Zahl unter Ziel | Zuerst nachsehen | Dann ändern (Bildschirm) |
|---|---|---|
| Suchen ohne Treffer | die zehn Suchwörter ohne Treffer | Begriffslisten je Fachbereich ergänzen (Plan: „Schweißer“ findet „Schweißfachmann“), englische Begriffe ergänzen; Umkreis-Standard prüfen (Usability 3.1: 25 km); Leerzustand der Trefferliste (Umkreis vergrößern, Job-Alarm) |
| Stelle → Bewerben geöffnet | Aufteilung nach Quelle und Gerät | „Passt das?“-Reihe und Deutschkenntnisse vollständig? Gehalt angegeben? Klebeleiste am Handy sichtbar? Danach als Vorschlag: der Satz der Bewerben-Box („Datei oder Foto reicht, zwei Minuten“) als Zeile über der Klebeleiste, solange noch nicht beworben (sichtbare Änderung an B, nur nach Freigabe). |
| Schritt 1 (E-Mail, Konto) | konto neu gegen bestand | neu schlecht: Kennwort-Hürde, Wortlaut; bestand schlecht: „Kennwort vergessen“-Weg prüfen |
| Schritt 2 (Lebenslauf) | hochladen_fehler nach Grund, art | zu groß: Fotos automatisch verkleinern; Word: Hinweis und Foto-Knopf deutlicher (Usability 5.10); Foto-Weg zuerst zeigen |
| Schritt 2 → abgeschickt | Einwilligungs-Satz, Senden-Fehler | Satz kürzen, Netzfehler mit „erneut senden“ (Plan) |
| E-Mail bestätigt | Rückläufer, Spam-Einordnung, Dauer | Mail-Zustellung prüfen (SPF, DKIM, DMARC, Rückläufer-Postfach, Plan); Betreff und Knopf in der Sprache des Nutzers; Erinnerung nach 24 h |
| Eine Sprache 10 Punkte schlechter als DE | derselbe Schritt in DE | Übersetzung dieses Schritts vom Muttersprachler gegenlesen lassen; Längen nach B.5 prüfen; im Handy-Bild ansehen |
| Firmen gestartet | wo sie stehen bleiben (Entwurf, nie angelegt) | 3BS ruft neue Firmen nach 3 Tagen an (10 Minuten); Ausprobier-Formular auf „Für Arbeitgeber“ (Usability 3.14); „Das bieten wir“ vorausfüllen |
| Antwortzeit | die fünf Firmen mit den meisten offenen | Zeile „wartet seit 3 Tagen“ (gibt es), Sammelmail statt sofort umstellen lassen, Absage-Vorlage zeigen (zwei Klicks, Usability 5.7); 3BS ruft an |
| Prüfung neuer Firmen über 1 Werktag | wer prüft (Frage aus dem Plan) | Erinnerung an die Verwaltung früher; Zuständigkeit klären |
Entscheidungen und Änderungen am Plan
Zwei entschiedene Gestaltungsfragen und die kleinen, unsichtbaren Anpassungen, die ohne Entscheidung übernommen wurden.
Zur Entscheidung (Vorschlag A ist meiner):
- Hero-Wort „Job finden.“. Entschieden A: Wort in Tinte, darunter ein grüner Markerstreifen in #C4D667 (Text 14,9 : 1, das Grün bleibt das auffällige Element); umgesetzt in
entwurf-b/assets/style.css(.hero__kopf h1 span) und Karte 1a 1.1 Nr. 1. Verworfen: dunkleres Grün (#8B9D2A oder #6E7D22) und „so lassen“. - Arabisch im CSS von B. A: Die rund 117 festen Links/Rechts-Angaben werden in
style.cssdurch richtungsneutrale ersetzt (margin-inline-startusw.); auf Deutsch sieht alles gleich aus, Arabisch spiegelt von selbst. Das berührt die Regel „B-CSS unverändert übernehmen“, folgt aber „Ändern heißt ersetzen“. B: Zusatzdatei nur für Arabisch mit Überschreibregeln; widerspricht „keine Überschreib-Regel“.
Übernommen ohne Entscheidung, weil unsichtbar oder nach bestehender Regel (Annahmen, jederzeit änderbar):
- Platzhalterfarbe auf den vorhandenen Grau-Text #5C6657.
- Fokusring auf dunklen Flächen in Grün #C4D667.
- Fortschrittsstriche, Status „gesichtet“ und „pausiert“ bekommen den 1-px-Rahmen nach der Regel vom 15.10.
- Links auf grünen Flächen in Tinte und unterstrichen (A.4); alle vier Kontrast-Korrekturen stehen als Prüfregel in der Bauordnung des Plans.
- Rückgängig-Hinweis mit fester Zeit von 10 Sekunden für alle; Rückgängig-Knopf mit Fokus an der Stelle des gedrückten Knopfes.
- Umkreis-Werte nur als Zahlen („0 km“ statt „Nur im Ort“).
- Datenmodell:
geoeffnet_amunderste_antwort_aman der Bewerbung. - Cookie-Hinweis ohne „Statistik“-Schalter; Messen ohne Einwilligung nach C.0.
- Getaggte PDF-Mappe in Abschnitt 2b, rund 2,5 bis 3 Tage zusätzlich.
- Barrierefreiheits-Seite im Fuß unter Rechtliches, sobald der Kunde das BFSG bejaht.
Weitere Teile
Verweis auf die eigenen Dokumente mit allen Texten und Mails und mit dem Test durch echte Menschen.
- Alle Texte und Mails im Wortlaut (1.240 Oberflächentexte, 59 Mails)
- Testablauf mit echten Menschen (Aufgaben, Beobachtungsbogen, Einverständnis)