Mobile App – Vollständige Anleitung zur mobilen Interaktion

STARTSEITE

So navigierst du hier

Beim App-Start:

1. Suche das App-Symbol auf dem Homescreen deines Geräts
   
   
2. Tippe einmal auf das Symbol mit deinem Finger oder Daumen
   
   
3. Warte, bis die App startet
   
   
4. Der Homescreen erscheint automatisch als erster Bildschirm
   
   

Von jedem anderen Bildschirm in der App:

Methode 1 – Über das Hamburger-Menü:

1. Schau auf die obere linke Ecke deines Bildschirms
   
   
2. Tippe einmal auf die drei horizontalen Linien (≡)
   
   
3. Ein Navigationsmenü rutscht von links herein und überdeckt etwa 75 % des Bildschirms
   
   
4. Die rechte Seite wirkt abgedunkelt
   
   
5. Tippe auf „Home" (erste Option mit Haus-Symbol 🏠)
   
   
6. Das Menü rutscht zu und du navigierst zum Homescreen
   
   

Methode 2 – Über Logo-Tap:

1. Tippe auf den Text oben in der Mitte der meisten Bildschirme
   
   
2. Der Bildschirm navigiert zurück zum Homescreen
   
   
3. Hinweis: Das funktioniert nur, wenn du NICHT bereits auf dem Homescreen bist
   
   

So erkennst du visuell, dass du auf dem Homescreen bist:

• Hamburger-Menü-Symbol (≡) oben links sichtbar
  
  
• Logo mittig oben
  
  
• Vier farbige rechteckige Karten übereinander gestapelt
  
  
• Weißer/heller Hintergrund ohne Tabs
  
  

Seitenelemente & Detaillierte Mobile Interaktionen

Steuerelemente der oberen Leiste

Hamburger-Menü-Symbol (≡)

Position: Oben links, etwa 16–20 Pixel von den Rändern entfernt

Visuelles Erscheinungsbild:

• Drei waagerechte Linien, gleichmäßig angeordnet, dunkelgrau
  
  
• Jede Linie etwa 20–24 Pixel lang
  
  
• Die Tippfläche ist größer als das sichtbare Symbol (mindestens 48 × 48 Pixel)
  
  

So tippst du es auf dem Mobilgerät an:

1. Halte dein Gerät bequem mit einer oder beiden Händen
   
   
2. Positioniere deinen Daumen oder Zeigefinger über dem Symbol
   
   
3. Tippe einmal mit einer kurzen Druck- und Loslassbewegung
   
   
4. Die Tippfläche erstreckt sich über die sichtbaren Linien hinaus für einfacheres Tippen
   
   

Was passiert:

• Ein halbtransparenter dunkler Overlay bedeckt den aktuellen Bildschirm
  
  
• Ein weißes Panel gleitet von links nach innen
  
  
• Das Drawer deckt etwa 75 % der Bildschirmbreite ab
  
  
• Das Drawer zeigt: Logo oben, Menüoptionen vertikal, Einstellungen unten
  
  
• Die rechte Seite bleibt dunkel und ist nicht interaktiv
  
  

Inhalte des Navigations-Drawers:

• Logo – Oben, nur Branding
  
  
• Home – Hauassymbol, zurück zum Dashboard
  
  
• Inbox – Umschlağsymbol, öffnet Bewertungen/Nachrichten/Social
  
  
• Publish – Ebenen-Symbol, öffnet Beitragsverwaltung
  
  
• Location – Pin-Symbol, öffnet Standortliste
  
  
• Settings – Zahnradsymbol unten, öffnet Einstellungen
  
  

Alternative Geste (Wischen vom Rand):

1. Platziere deinen Finger am linken Rand des Bildschirms (innerhalb von 20 Pixeln)
   
   
2. Wische mit einer schnellen Bewegung nach rechts über den Bildschirm
   
   
3. Das Drawer folgt deinem Finger während du wischst
   
   
4. Heben ab, wenn das Drawer vollständig sichtbar ist
   
   

So schließt du das Drawer:

• Tippe auf den dunklen Bereich auf der rechten Seite
  
  
• Wische nach links über das Drawer
  
  
• Tippe auf eine Menüoption (schließt sich automatisch nach der Navigation)
  
  
• Drücke die Android-Zurück-Taste
  
  

„App"-Logo

Standort: Obere Mitte, etwa 40–60 Pixel von der oberen Kante entfernt

Visuelles Erscheinungsbild:

• Text: Name
  
  
• Farbe: Mittleres bis dunkles Grau
  
  
• Schriftgröße: 16–20 Pixel, alles in Kleinbuchstaben
  
  
• Kann ein kleines Symbol links daneben enthalten
  
  

So interagierst du damit:

1. Tippe einmal direkt auf den Logo-Text
   
   
2. Der tippbare Bereich umfasst den Text plus etwa 10 Pixel Abstand
   
   
3. Text kann beim Tippen kurz dunkler werden
   
   

Was passiert:

• Falls du bereits auf dem Startbildschirm bist: Nichts passiert
  
  
• Falls du auf einem anderen Bildschirm bist: Bildschirm wechselt zurück zum Haupt-Dashboard
  
  

Anwendungsfall: Schnelle Rückkehr zum Hauptbildschirm ohne das Menü zu öffnen

Bereich Quick Actions

Layout auf dem Mobilgerät:

• Vier rechteckige Karten, vertikal gestapelt
  
  
• Jede Karte erstreckt sich über nahezu die gesamte Bildschirmbreite (16–20 Pixel Ränder)
  
  
• 12–16 Pixel vertikaler Abstand zwischen Karten
  
  
• Scrollbar, falls die Bildschirmhöhe begrenzt ist
  
  
• Abgerundete Ecken (8–12 Pixel Radius)
  
  
• Subtiler Schatten oder Rand
  
  

Struktur jeder Karte:

• Linke Seite: Symbol (48–64 Pixel) – Stern-, Nachrichten-, Standort- oder Dokument-Symbol
  
  
• Rechte Seite: Zwei Textzeilen
  
  
  • Titel: Fett, 18–20 Pixel Schrift
    
    
  • Beschreibung: Hellgrau, 14–16 Pixel Schrift
    
    
• Hintergrund: Sehr helles Grau
  
  
• Die gesamte Karte ist tippbar – ein einheitliches Touch-Ziel
  
  

1. Karte „Auf Bewertungen antworten"

Visuelle Erkennung:

• Position: Erste Karte oben
  
  
• Symbol: Stern- oder Bewertungssymbol (gelb/goldene Farbe)
  
  
• Titel: „Auf Bewertungen antworten" in Fettdruck
  
  
• Beschreibung: „Auf Kundenfeedback antworten" oder ähnlich
  
  

So tippen Sie:

1. Suche die erste Karte direkt unter der Kopfzeile
   
   
2. Positioniere deinen Daumen oder Finger irgendwo auf der Karte
   
   
3. Du kannst tippen auf: das Symbol, Titeltext, Beschreibung oder leeren Platz in der Karte
   
   
4. Drücke herunter und lasse schnell los (normales Tippen)
   
   

Visuelles Feedback:

• Kartenhintergrund wechselt zu etwas dunklerer Schattierung
  
  
• Karte kann leicht nach innen drücken (subtile Skalierungsanimation auf ca. 98 %)
  
  
• Haptische Vibration auf unterstützten Geräten
  
  
• Welleneffekt kann vom Tippunkt aus ausbreiten
  
  

Navigationsablauf:

1. Karte kehrt nach dem Loslassen in den Normalzustand zurück
   
   
2. Startbildschirm gleitet nach links oder verblasst
   
   
3. Möglicherweise werden kurz ein Lade-Indikator oder weißer Bildschirm angezeigt
   
   
4. Inbox-Modul wird geladen
   
   
5. Registerkarte „Bewertungen" ist automatisch aktiv
   
   

Du landest bei:

• Kopfzeile: Hamburger-Menü, Logo
  
  
• Registerkarten: Bewertungen (aktiv/Fettdruck), Nachrichten, Sozial
  
  
• Suchleiste: „Suche und filtere deine Bewertungen" mit Such- und Filtersymbolen
  
  
• Inhalt: Scrollbare Liste von Bewertungskarten mit:
  
  
  • Kreisförmiger Avatar mit Anfangsbuchstabe des Bewerters
    
    
  • Name des Bewerters
    
    
  • Sternbewertung (1–5 Sterne)
    
    
  • Bewertungstext-Auszug
    
    
  • Standortname mit PIN-Symbol
    
    
  • Zeitstempel (z. B. „vor 1389 Tagen")
    
    
  • Plattformsymbol (Google, Facebook usw.)
    
    

Anwendungsfälle:

• Überprüfe Bewertungsmitteilungen unterwegs
  
  
• Antworte schnell auf negative Bewertungen
  
  
• Überwache Kundenfeedback während der Geschäftszeiten
  
  

2. Karte „Deine Nachrichten prüfen"

Visuelle Identifikation:

• Position: Zweite Karte, unter „Auf Bewertungen antworten"
  
  
• Symbol: Sprechblase oder Umschlag
  
  
• Titel: „Deine Nachrichten prüfen" in Fettdruck
  
  
• Beschreibung: „Kundenanfragen anzeigen" oder ähnliches
  
  

Falls die Karte nicht sichtbar ist:

1. Platziere deinen Finger in der Mitte des Bildschirms
   
   
2. Wische nach oben (schnelle Bewegung)
   
   
3. Der Inhalt scrollt nach unten und gibt die zweite Karte frei
   
   
4. Die erste Karte scrollt nach oben aus dem Sichtbereich
   
   

So tippst du:

1. Stelle sicher, dass die gesamte Karte sichtbar ist (nicht oben/unten abgeschnitten)
   
   
2. Platziere deinen Finger überall auf der Kartenfläche
   
   
3. Beste Tipp-Zonen:
   
   
   • Kartenmitte: Am zuverlässigsten
     
     
   • Symbolbereich: Gut für Rechtshänder
     
     
   • Textbereich: Größere Zielfläche
     
     
4. Tippe einmal mit festem, schnellem Druck
   
   
5. Vermeiden: Zu leicht (kann unerkannt bleiben) oder zu lange (kann einen langen Druck auslösen)
   
   

Touch-Feedback:

• Karte leuchtet sofort auf
  
  
• Hintergrund wechselt zu gedrücktem Zustand
  
  
• Wellenanimation breitet sich vom Tipp-Punkt aus
  
  
• Karte kann sich leicht vergrößern
  
  
• Haptisches Feedback-Puls
  
  

Navigationsablauf:

1. Karte kehrt zur normalen Farbe und Größe zurück
   
   
2. Startbildschirm wird beendet (Wisch- oder Überblendungseffekt)
   
   
3. Möglicherweise wird ein Lade-Indikator oder Skeleton-Screen angezeigt
   
   
4. Das Postfach-Modul wird geladen, mit der aktiven Registerkarte „Nachrichten"
   
   

Du landest bei:

• Header: Hamburger-Menü, Logo, drei Registerkarten
  
  
• Aktive Registerkarte: Nachrichten (Fettdruck/unterstrichen)
  
  
• Suchleiste: „Deine Nachrichten durchsuchen und filtern"
  
  
• Inhalt: Scrollbare Liste der Nachrichten-Threads mit:
  
  
  • Kreisförmiges Profilbild (Kundeninitialen oder Foto)
    
    
  • Kundenname (Fettdruck)
    
    
  • Plattformsymbol (Facebook, Google)
    
    
  • Nachrichtenvorschau (2 Zeilen, möglicherweise mit „…" abgekürzt)
    
    
  • Zeitstempel (z. B. „vor 835 Tagen" oder „14:34 Uhr")
    
    
  • Standortname mit Pin-Symbol (falls zutreffend)
    
    
  • Statusindikatoren (grünes Häkchen bei Antwort)
    
    

Verfügbare Funktionen:

• Durch Nachrichten nach oben/unten scrollen
  
  
• Suchleiste antippen (Tastatur wird angezeigt)
  
  
• Filtersymbol antippen (öffnet Filterpanel)
  
  
• Nachrichtenkarte antippen (öffnet Unterhaltung)
  
  
• Von oben nach unten ziehen zum Aktualisieren
  
  

Anwendungsfälle:

• Antworte auf Kundenanfragen per Mobilgerät
  
  
• Überprüfe wichtige Anfragen während der Geschäftszeiten
  
  
• Kümmere dich unterwegs um Kundenservice
  
  

3. Karte „Standorte anzeigen"

Visuelle Erkennung:

• Position: Dritte Karte im vertikalen Stapel
  
  
• Symbol: Standortnadel/Marker (📍)
  
  
• Titel: „Standorte anzeigen" in Fettdruck
  
  
• Beschreibung: „Deine Geschäftsstandorte verwalten" oder ähnlich
  
  

Zum Anzeigen scrollen:

Standardscroll-Methode:

1. Finger auf den mittleren/unteren Bildschirmbereich legen (Header vermeiden)
   
   
2. Mit moderater Geschwindigkeit nach oben wischen
   
   
3. Inhalte scrollen sanft nach unten
   
   
4. Erste und zweite Karte scrollen nach oben
   
   
5. Dritte Karte kommt in den Blick
   
   
6. Finger heben, wenn die Karte zentriert ist
   
   

Flick-Scroll-Methode:

1. Schnelle Aufwärtsbewegung
   
   
2. Bildschirm scrollt nach dem Abheben des Fingers weiter (Schwung)
   
   
3. Bildschirm antippen, um den Scroll zu stoppen, falls er zu weit geht
   
   
4. Falls nötig, leicht nach oben zurückscollen
   
   

Scroll-Indikatoren:

• Dünne vertikale Leiste erscheint beim Scrollen am rechten Rand
  
  
• Leiste verschwindet nach 1–2 Sekunden Inaktivität
  
  
• Inhalte federn leicht oben/unten ab (Elastik-Effekt)
  
  

So tippst du:

1. Bestätige, dass die gesamte Karte sichtbar und zentriert ist
   
   
2. Finger irgendwo auf der Karte platzieren
   
   
3. Einmal fest und schnell antippen
   
   
4. Haptic Feedback spüren
   
   

Touch-Feedback:

• Kartenhintergrund wird dunkler
  
  
• Subtile Druck-Animation
  
  
• Welle breitet sich vom Druckpunkt aus
  
  
• Karte wird leicht größer
  
  

Navigationsabfolge:

1. Startbildschirm blendet aus
   
   
2. Standort-Modul wird geladen
   
   
3. Bildschirm mit Standortliste wird angezeigt
   
   

Du landest bei:

• Header: Hamburger-Menü, Logo
  
  
• Suchleiste: „Standortnamen oder Kennung suchen…" mit Suchsymbol
  
  
• Inhalt: Scrollbare Liste von Standortkarten, von denen jede folgende Informationen zeigt:
  
  
  • Kreisförmiges Bild/Logo (Geschäftslogo oder Standard-Symbol)
    
    
  • Standortname (Fettdruck, z.B. „[Geschäftsname]")
    
    
  • Vollständige Adresse (z.B. „[Straße], [Postleitzahl] [Stadt], [Land]")
    
    

Funktionen der Standortliste:

• Alle Standorte durchblättern (nach oben/unten wischen)
  
  
• Suchleiste antippen, um einen bestimmten Standort zu finden
  
  
• Jede Standortkarte antippen, um das detaillierte Profil zu öffnen
  
  
• Von oben nach unten ziehen, um die Liste zu aktualisieren
  
  

Anwendungsfälle:

• Alle Geschäftsstandorte durchsuchen
  
  
• Bestimmten Standort nach Name finden
  
  
• Auf Standortdetails zugreifen, um Öffnungszeiten oder Adresse zu aktualisieren
  
  
• Standortinformation überprüfen, während du unterwegs bist
  
  

4. „Beitrag erstellen"-Karte

Visuelle Identifizierung:

• Position: Vierte und letzte Karte in Schnellaktionen
  
  
• Symbol: Dokument-, Ebenen- oder Beitragssymbol
  
  
• Titel: „Beitrag erstellen" in Fettdruck
  
  
• Beschreibung: „Teile Updates mit Kunden" oder ähnlich
  
  

Scrollen zum Anzeigen:

1. Möglicherweise musst du weiter nach unten von der dritten Karte scrollen
   
   
2. Wische auf dem Bildschirm nach oben
   
   
3. Dritte Karte scrollt nach oben
   
   
4. Vierte Karte scrollt in den Ansicht
   
   
5. Möglicherweise siehst du den unteren Bildschirmrand (Ende des Schnellaktionen-Bereichs)
   
   

So tippst du darauf:

1. Stelle sicher, dass die Karte vollständig sichtbar ist
   
   
2. Tippe überall auf der Kartenfläche
   
   
3. Normales schnelles Tippen (drücken und loslassen)
   
   

Taktiles Feedback:

• Karte hebt sich hervor
  
  
• Visuelles Zustand „Gedrückt"
  
  
• Wellen-Animation
  
  
• Haptisches Feedback
  
  

Navigationsabfolge:

1. Startbildschirm wird ausgeblendet
   
   
2. Veröffentlichungsmodul lädt
   
   
3. Reiter „Letzte Beiträge" wird standardmäßig angezeigt
   
   

Du landest bei:

• Header: Hamburger-Menü, Logo
  
  
• Reiter: Letzte Beiträge (aktiv), Vorlagen
  
  
• Inhalt: Liste vorhandener Beiträge mit Statusindikatoren
  
  
• Floating Action Button (FAB): Schaltfläche „+" in der unteren rechten Ecke
  
  

Beitragsliste zeigt:
Jede Beitragskarte zeigt:

• Statusindikator:
  
  
  • 🔴 Roter Kreis mit X: Beendet/abgelaufen
    
    
  • ✅ Grüner Haken: Veröffentlicht
    
    
  • 🕐 Uhr-Symbol: Genehmigung erforderlich/ausstehend
    
    
• Beitragstitel/Text
  
  
• Plattformsymbol (Google, Facebook usw.)
  
  
• Datum/Zeitstempel (z. B. „TT.MM.JJJJ (GMT+XX:00)")
  
  
• Weitere Informationen:
  
  
  • Standort-Symbol für standortspezifische Beiträge
    
    
  • Stern-Symbol für hervorgehobene Beiträge
    
    
  • „An X Standorte gepostet" für Beiträge an mehreren Standorten
    
    

Verfügbare Aktionen:

• Tippe auf eine Beitragskarte, um Details anzuzeigen/zu bearbeiten
  
  
• Tippe auf die Schaltfläche „+", um einen neuen Beitrag zu erstellen
  
  
• Wechsle zum Reiter „Vorlagen"
  
  
• Scrolle durch die Beitragsliste
  
  
• Ziehe nach unten zum Aktualisieren
  
  

Anwendungsfälle:

• Erstelle Social-Media-Beiträge unterwegs
  
  
• Veröffentliche Google Posts schnell
  
  
• Überprüfe den Status geplanter Beiträge
  
  
• Verwende Vorlagen für einheitliche Botschaften
  
  

NAVIGATIONSMENÜ (Hamburger Drawer) – Detaillierte Mobile-Interaktionen

Schublade öffnen

Methode 1 – Symbol antippen:

1. Tippe auf das Hamburger-Symbol (≡) oben links
   
   
2. Die Schublade gleitet von links herein
   
   
3. Das Öffnen dauert etwa eine halbe Sekunde
   
   

Methode 2 – Von der Kante wischen:

1. Platziere deinen Finger am äußersten linken Rand des Bildschirms (innerhalb der ersten 20 Pixel)
   
   
2. Halte deinen Finger auf dem Bildschirm
   
   
3. Wische nach rechts mit gleichmäßiger Bewegung
   
   
4. Die Schublade folgt der Bewegung deines Fingers
   
   
5. Wische weiter, bis die Schublade etwa 75 % des Bildschirms überquert hat
   
   
6. Hebe deinen Finger
   
   
7. Die Schublade öffnet sich automatisch vollständig
   
   

Schubladenanzeige wenn vollständig geöffnet:

• Linkes Panel (75 % Breite): Weißer Hintergrund mit Menüoptionen
  
  
• Rechtes Panel (25 % Breite): Abgedunkelter aktueller Bildschirm, nicht interaktiv
  
  
• Schatten/Erhöhung: Dunkler Schatten entlang der rechten Kante der Schublade
  
  
• Inhalt: Scrollbar falls viele Menüelemente vorhanden sind
  
  

Menüstruktur

Von oben nach unten:

1. Logo mit kreisförmigem Symbol – Branding, keine Tippfunktion
   
   
2. Startseite – Haussymbol 🏠
   
   
3. Posteingang – Umschlagsymbol ✉️
   
   
4. Veröffentlichen – Ebenen-/Dokumentsymbol
   
   
5. Standort – Stecknadelsymbol 📍
   
   
6. Einstellungen – Zahnradsymbol ⚙️ (unten, möglicherweise Scrolling erforderlich)
   
   

Aussehen jedes Menüelements:

• Linke Seite: Symbol (24–32 Pixel)
  
  
• Rechte Seite: Textbezeichnung in Dunkelgrau
  
  
• Höhe: Jede Zeile ca. 48–56 Pixel hoch
  
  
• Volle Breite: Gesamte Zeile ist tippbar
  
  
• Abstand: 8–12 Pixel zwischen Zeilen
  
  

Menüpunkt-Interaktionen

So tippst du auf eine Menüoption:

1. Wenn die Schublade vollständig geöffnet ist, suche den gewünschten Menüpunkt
   
   
2. Tippe auf eine beliebige Stelle der Zeile (Symbol oder Textbereich funktionieren beide)
   
   
3. Das Touch-Ziel erstreckt sich über die gesamte Breite der Schublade
   
   

Visuelles Feedback beim Tippen:

• Der Zeilenhintergrund wechselt zu hellem Grau oder einer Hervorhebungsfarbe
  
  
• Kurze Druckzustand-Visualisierung
  
  
• Ripple-Animation kann sich über die Zeile ausbreiten
  
  
• Haptisches Feedback auf unterstützten Geräten
  
  

Was nach dem Tippen passiert:

1. Die Zeile bleibt kurz hervorgehoben
   
   
2. Die Schublade beginnt zu schließen (nach links)
   
   
3. Gleichzeitig erfolgt der Bildschirmwechsel zum ausgewählten Modul
   
   
4. Die Schublade verschwindet vollständig
   
   
5. Der neue Bildschirm wird vollständig geladen
   
   

1. Home-Menüoption

So geht's:

1. Tippe auf die Zeile „Home" (erste Option, Haus-Symbol)
   
   
2. Schublade schließt sich
   
   
3. Bildschirm wechselt zum Home-Dashboard
   
   

Ergebnis:

• Du siehst die vier Quick-Action-Karten
  
  
• Gleiche Ansicht wie beim App-Start
  
  
• Falls du bereits auf Home bist, kann sich der Bildschirm kurz aktualisieren
  
  

Anwendungsfall: Von jeder Sektion aus zum Haupt-Dashboard zurückkehren

2. Inbox-Menüoption

So geht's:

1. Tippe auf die „Inbox"-Zeile (Briefumschlag-Symbol)
   
   
2. Die Schublade schließt sich sanft
   
   
3. Inbox-Modul wird geladen
   
   

Ergebnis:

• Drei Reiter erscheinen: Bewertungen, Nachrichten, Soziale Medien
  
  
• Der zuletzt aktive Reiter wird standardmäßig geöffnet (oder Bewertungen beim ersten Besuch)
  
  
• Suchleiste und Filteroptionen sind sichtbar
  
  
• Inhaltsliste wird gefüllt
  
  

Anwendungsfall: Greife auf Kundenbewertungen, Nachrichten oder Social-Media-Kommentare zu

3. Publish-Menüoption

So verwendest du es:

1. Tippe auf die Reihe „Publish" (Ebenen-/Dokumentsymbol)
   
   
2. Schublade gleitet nach links zu
   
   
3. Publish-Modul wird geladen und angezeigt
   
   

Ergebnis:

• Zwei Registerkarten werden angezeigt: Aktuelle Beiträge, Vorlagen
  
  
• Registerkarte „Aktuelle Beiträge" ist standardmäßig aktiv
  
  
• Schaltfläche „+" für schwebende Aktionen sichtbar in der unteren rechten Ecke
  
  
• Liste der Beiträge mit Statusanzeigen wird angezeigt
  
  
• Scrollbarer Inhaltsbereich
  
  

Anwendungsfall: Verwalte Social-Media-Beiträge, erstelle neue Beiträge oder greife auf Beitragsvorlagen zu

4. Standort-Menüoption

So verwendest du es:

1. Tippe auf die Reihe „Location" (Pin-Symbol)
   
   
2. Schublade schließt sich mit Wisch-Animation
   
   
3. Standort-Modul wird geladen
   
   
4. Möglicherweise sehen Sie kurz einen Lade-Indikator
   
   

Ergebnis:

• Suchleiste erscheint: „Standortnamen oder Kennung suchen…"
  
  
• Scrollbare Liste aller Geschäftsstandorte
  
  
• Jede Standortkarte zeigt: Logo, Name und vollständige Adresse
  
  
• Alle Karten sind tippbar für detaillierte Profilansicht
  
  

Anwendungsfall: Standorte durchsuchen, nach einem bestimmten Standort suchen oder auf Standortprofile zugreifen

5. Einstellungsmenü-Option

Position: Unten im Menü (möglicherweise musst du in der Schublade nach unten scrollen)

So verwendest du es:

1. Wenn das Menü viele Elemente hat, scrolle innerhalb der Schublade nach unten
   
   
2. Suche „Einstellungen" unten (Zahnradsymbol)
   
   
3. Tippe auf die Einstellungszeile
   
   
4. Die Schublade schließt sich
   
   
5. Das Einstellungsmodul wird geladen
   
   

Ergebnis:

• Benutzergruß wird angezeigt: „Hallo, [Benutzername]"
  
  
• Fünf Hauptoptionen aufgelistet: Account, Sprache, Sicherheit, Benachrichtigungen, Rechtliches
  
  
• Abmelden-Schaltfläche unten
  
  
• App-Versionsnummer angezeigt (z. B. „2.4.0")
  
  

Anwendungsfall: Account verwalten, Sprache ändern, Benachrichtigungen anpassen, rechtliche Informationen anzeigen oder dich abmelden

Schublade schließen ohne Navigation

Methode 1 – Außenbereich antippen:

1. Schau auf die dunkle rechte Seite (25% des Bildschirms)
   
   
2. Tippe überall in diesem dunklen Bereich
   
   
3. Schublade gleitet sofort nach links zu
   
   
4. Du bleibst auf dem aktuellen Bildschirm
   
   

Methode 2 – Nach links wischen zum Schließen:

1. Lege deinen Finger auf die offene Schublade
   
   
2. Wische nach links zum Rand
   
   
3. Schublade folgt deinem Finger
   
   
4. Hebe deinen Finger, wenn die Schublade den linken Rand erreicht
   
   
5. Schublade beendet die Schließungsanimation
   
   

Methode 3 – Zurück-Taste (Android):

1. Drücke die Zurück-Taste (Dreieck-Symbol oder Geste)
   
   
2. Schublade schließt sich, ohne die Bildschirme zu wechseln
   
   

Methode 4 – Hamburger-Symbol erneut antippen:

1. Tippe auf das Hamburger-Symbol (jetzt als drei Linien oder X-Symbol sichtbar)
   
   
2. Schublade schaltet zu geschlossen
   
   

INBOX-MODUL – Detaillierte Mobile-Interaktionen

Zur Inbox navigieren

Methode 1 – Über Startseiten-Schnellaktionen:

• Tippe „Auf Bewertungen antworten" → Öffnet die Inbox mit aktivem Reiter „Bewertungen"
  
  
• Tippe „Überprüfe deine Nachrichten" → Öffnet die Inbox mit aktivem Reiter „Nachrichten"
  
  

Methode 2 – Über Hamburger-Menü:

1. Öffne das Hamburger-Menü (≡)
   
   
2. Tippe „Inbox"
   
   
3. Letzter aktiver Reiter öffnet sich (oder Bewertungen als Standard)
   
   

Registernavigation (Bewertungen / Nachrichten / Soziale Medien)

Register-Layout:

• Drei Register horizontal oben angezeigt
  
  
• Unterhalb der Kopfzeile positioniert
  
  
• Jede Registerbezeichnung ist anklickbar
  
  
• Das aktive Register zeigt eine visuelle Unterscheidung
  
  

Visuelles Erscheinungsbild:

• Aktives Register: Fettdruck, Unterstreichung oder Hervorhebung, dunklere Farbe
  
  
• Inaktive Register: Normales Gewicht, graue Farbe, keine Unterstreichung
  
  
• Registerhöhe: Etwa 48 Pixel (einfaches Erreichen mit dem Daumen)
  
  
• Register spannen die volle Breite des Bildschirms (jeweils etwa 33% Breite)
  
  

So wechselst du Register:

1. Lokalisiere die drei Registerbezeichnungen oben
   
   
2. Identifiziere, welches Register derzeit aktiv ist (fett/unterstrichen)
   
   
3. Tippe direkt auf den gewünschten Registerbezeichnungstext
   
   
4. Du kannst überall im rechteckigen Bereich des Registers tippen
   
   

Was beim Wechsel passiert:

• Der angetippte Register-Text wird sofort fett
  
  
• Unterstreichung oder Hervorhebung gleitet zum neuen Register
  
  
• Das vorherige Register kehrt zu normalem Gewicht und Grau zurück
  
  
• Der Inhaltsbereich darunter wird sofort aktualisiert
  
  
• Alter Inhalt wird ausgeblendet oder gleitet weg
  
  
• Neuer Inhalt wird eingeblendet oder gleitet herein
  
  
• Eine kurze Ladungsanimation kann erscheinen, wenn Daten abgerufen werden
  
  
• Scrollbare Liste wird mit neuem Inhalt gefüllt
  
  

Touch-Rückmeldung:

• Register kann beim Antippen kurz dunkler werden
  
  
• Sanfte Animation zwischen Registern
  
  
• Kein vollständiges Neuladen der Seite (schneller Wechsel)
  
  

REITER BEWERTUNGEN – Detaillierte Mobile-Interaktionen

Screen-Layout

Von oben nach unten:

1. App-Header – Hamburger-Menü (links), Logo (Mitte)
   
   
2. Registerkartenleiste – Bewertungen (aktiv), Nachrichten, Sozial
   
   
3. Suchleiste – Mit Suchsymbol (links) und Filtersymbol (rechts)
   
   
4. Bewertungskarten – Scrollbare Liste, die den verbleibenden Bildschirmplatz ausfüllt
   
   

Suchleisten-Interaktionen

Visuelles Erscheinungsbild:

• Vollbreites abgerundetes Rechteck (mit Seitenrändern)
  
  
• Hellgrauer oder weißer Hintergrund
  
  
• Platzhaltertext: „Bewertungen durchsuchen und filtern" in Grau
  
  
• Lupe auf der linken Seite (in der Leiste)
  
  
• Filter-/Schieberegler-Symbol auf der rechten Seite (in der Leiste)
  
  
• Höhe: Ca. 48 Pixel
  
  
• Rahmen oder subtiler Schatten
  
  

So aktivierst du die Suche:

1. Tippe überall auf die Suchleiste (außer auf das Filter-Symbol)
   
   
2. Der gesamte Leistenbereich ist tippbar – außer dem Filter-Symbol ganz rechts
   
   

Was passiert beim Antippen:

1. Die Tastatur fährt von unten auf dem Bildschirm hoch
   
   
2. Sie nimmt etwa die Hälfte der Bildschirmhöhe ein
   
   
3. Der Cursor erscheint im Suchfeld und blinkt
   
   
4. Der Platzhaltertext verschwindet
   
   
5. Tastaturtyp: Standard-Texttastatur mit Such-/Eingabetaste
   
   
6. Die Suchleiste kann sich erweitern oder einen Focus-Highlight erhalten
   
   

Eine Suche eingeben:

1. Verwende die Tastatur, um Suchbegriffe einzugeben
   
   
2. Du kannst nach Folgendem suchen:
   
   
   • Kundennamen
     
     
   • Standortnamen
     
     
   • Schlüsselwörter aus Bewertungstexten
     
     
   • Teilwörter (wenn du „foo" eingibst, wird „food" gefunden)
     
     
3. Die Ergebnisse werden während der Eingabe in Echtzeit gefiltert
   
   
4. Bewertungen, die nicht passen, werden ausgeblendet oder verschwinden
   
   
5. Übereinstimmende Bewertungen bleiben sichtbar
   
   
6. Die Trefferanzahl wird möglicherweise angezeigt (z. B. „5 Bewertungen gefunden")
   
   

Die Suche abschließen:

1. Tippe die Taste „Suche" oder „Eingabe" auf der Tastatur, um abzuschließen
   
   
2. ODER tippe überall außerhalb der Suchleiste
   
   
3. Die Tastatur fährt runter und verschwindet
   
   
4. Die gefilterten Ergebnisse bleiben sichtbar
   
   
5. Der Suchbegriff bleibt in der Leiste
   
   

Die Suche löschen:

1. Achte auf das Symbol „X" oder Löschen, das in der Suchleiste erscheint, wenn Text vorhanden ist
   
   
2. Tippe das Symbol „X" einmal
   
   
3. Der Suchtext wird sofort gelöscht
   
   
4. Alle Bewertungen erscheinen wieder in der Liste
   
   
5. ODER lösche den Text manuell mit der Rücktaste
   
   

Suchleiste im Hoch- vs. Querformat:

• Hochformat: Vollbreite mit Rändern
  
  
• Querformat: Kann sich leicht verkleinern, um den breiteren Bildschirm zu berücksichtigen
  
  

Filter-Icon-Interaktionen

Speicherort: Rechte Seite der Suchleiste (innerhalb der Leistengrenze)

Visuelles Erscheinungsbild:

• Schieberegler-Symbol (zwei oder drei horizontale Linien mit kreisförmigen Knöpfen)
  
  
• App-Theme-Farbe
  
  
• Etwa 24–32 Pixel großes Symbol
  
  
• Touch-Ziel: 48×48 Pixel (reicht über das sichtbare Symbol hinaus)
  
  

So tippst du:

1. Schau auf das rechte Ende der Suchleiste
   
   
2. Tippe direkt auf das Schieberegler-Symbol
   
   
3. Das Touch-Ziel ist großzügig – kleine Abweichungen werden trotzdem erkannt
   
   

Visuelles Feedback:

• Das Symbol kann kurz dunkler werden oder aufleuchten
  
  
• Ein Ripple-Effekt kann von dem Symbol ausgehen
  
  
• Haptisches Feedback-Impuls
  
  

Was passiert:

1. Das Filter-Panel gleitet von unten nach oben vom Bildschirm
   
   
2. ODER gleitet von rechts herein
   
   
3. Die Animation dauert etwa eine halbe Sekunde
   
   
4. Die Hauptbewertungsliste wird im Hintergrund abgedunkelt oder unschärfer
   
   
5. Das Filter-Panel überlagert die Bewertungsliste
   
   

Filter-Panel-Erscheinungsbild:

• Nimmt 60–80 % der Bildschirmhöhe ein (oder volle Höhe)
  
  
• Weißer oder heller Hintergrund
  
  
• Abgerundete Ecken oben (wenn von unten hereinkommt)
  
  
• Schatten- oder Elevationseffekt
  
  
• Kopfzeile zeigt den Titel „BEWERTUNGEN" mit Zurück-Pfeil auf der linken Seite
  
  

Detaillierte Interaktionen des Filterpanels

Panelstruktur von oben nach unten:

1. Header: „BEWERTUNGEN"-Titel mit Zurück-Pfeil (←)
   
   
2. Filteroptionen: Fünf Reihen mit Dropdown-Menüs
   
   
3. Unterer Bereich: Kann „Anwenden"- oder „Zurücksetzen"-Schaltflächen enthalten
   
   

Filterbereiche:

• Standort
  
  
• Verzeichnisse
  
  
• Bewertungen
  
  
• Beantwortet
  
  
• Zeitraum
  
  

Darstellung jeder Filterreihe:

• Symbol auf der linken Seite (Stift, Globus, Stern, Häkchen, Uhr)
  
  
• Filtername-Label
  
  
• „Wähle einen Filter"-Text auf der rechten Seite (wenn nichts ausgewählt ist)
  
  
• Pfeil nach unten (▼), der ein Dropdown anzeigt
  
  
• Die gesamte Reihe ist anklickbar
  
  
• Höhe: Etwa 56–64 Pixel
  
  

Filterpanel schließen

Zurück-Schaltfläche:

1. Tippe auf den Zurück-Pfeil (←) oben links im Filterpanel
   
   
2. Das Panel rutscht herunter oder hinaus (Umkehrung der Öffnungsanimation)
   
   
3. Rückkehr zur Hauptbewertungsliste
   
   
4. Alle angewendeten Filter bleiben aktiv (werden beim Schließen nicht gelöscht)
   
   

Verwendungsfall: Filterpanel verlassen, nachdem du Filter angewendet hast oder wenn du dich entscheidest, nicht zu filtern

Ortsfilter

So interagierst du:

1. Tippe überall auf die Zeile „Ort"
   
   
2. Die gesamte Zeile ist tipbar (Symbol, Text oder rechte Seite)
   
   

Das passiert:

1. Die Zeile hebt sich kurz hervor
   
   
2. Ein Dropdown-Menü erscheint unter der Zeile
   
   
3. ODER eine Vollbild-Auswahl fährt von unten auf
   
   
4. Eine Liste aller deiner Geschäftsstandorte wird angezeigt
   
   

Dropdown-/Auswahldarstellung:

• Scrollbare Liste bei vielen Standorten
  
  
• Jeder Ort zeigt Namen und möglicherweise Adresse
  
  
• Kontrollkästchen oder Optionsschaltfläche links oder rechts
  
  
• Aktuelle Auswahl kann angekreuzt oder hervorgehoben sein
  
  

Einen Ort auswählen:

1. Scrolle durch die Liste, indem du nach oben/unten wischst
   
   
2. Tippe auf den gewünschten Ortsnamen
   
   
3. Der Ortsname wird angekreuzt oder hervorgehoben
   
   
4. Das Dropdown-Menü schließt sich und kehrt zum Filterfenster zurück
   
   
5. Die Ortszeile zeigt jetzt den ausgewählten Ortsnamen anstelle von „Filter auswählen"
   
   

Mehrere Orte auswählen (falls unterstützt):

1. Tippe auf den ersten Ort – das Kontrollkästchen wird angekreuzt
   
   
2. Tippe auf den zweiten Ort – das zweite Kontrollkästchen wird angekreuzt
   
   
3. Beide bleiben ausgewählt
   
   
4. Du kannst antippen, um die Auswahl aufzuheben
   
   

Ortsfilter löschen:

1. Suche nach der Schaltfläche „Löschen" oder „X" neben dem Ortsnamen
   
   
2. Tippe zum Löschen
   
   
3. Kehrt zum Status „Filter auswählen" zurück
   
   

Verzeichnisse-Filter

Zweck: Bewertungen nach Quellplattform filtern (Google, Facebook, usw.)

So interagierst du:

1. Tippe auf die Reihe „Verzeichnisse" im Filterfenster
   
   
2. Ein Dropdown-Menü oder eine Auswahl wird angezeigt
   
   

Das wird angezeigt:

• Liste aller verbundenen Plattformen/Verzeichnisse
  
  
• Beispiele: Google, Facebook, Yelp, Tripadvisor
  
  
• Plattformsymbole können neben den Namen angezeigt werden
  
  
• Kontrollkästchen für die Mehrfachauswahl
  
  

Verzeichnisse auswählen:

1. Blättere durch die verfügbaren Plattformen
   
   
2. Tippe, um eine oder mehrere auszuwählen
   
   
3. Häkchen werden auf ausgewählten Elementen angezeigt
   
   
4. Schließe das Dropdown-Menü, indem du außerhalb tippst oder die Schaltfläche „Fertig" betätigst
   
   
5. Die Verzeichnisreihe wird mit den ausgewählten Plattformen aktualisiert (z. B. „Google, Facebook")
   
   

Ergebnis nach Anwendung:

• Nur Bewertungen von ausgewählten Plattformen werden in der Liste angezeigt
  
  
• Bewertungen von anderen Plattformen werden ausgeblendet
  
  

Bewertungsfilter

Zweck: Bewertungen nach Sternbewertung filtern (1–5 Sterne)

So interagierst du:

1. Tippe auf die Zeile „Bewertungen"
   
   
2. Es öffnet sich ein Modal-Popup (überlagert das Filterpanel)
   
   

Darstellung des Modals:

• Weiße Hintergrund-Karte/Dialog
  
  
• Zentriert auf dem Bildschirm oder von unten hochgefahren
  
  
• Kopfzeile: Titel „Bewertungen" mit X-Schließen-Button oben rechts
  
  
• Link „Alle löschen" oben rechts (neben oder unter dem X)
  
  
• Fünf Kontrollkästchen-Optionen vertikal angeordnet
  
  
• Button „Filter anwenden" unten (lila, vollständige Breite)
  
  

Fünf Kontrollkästchen-Optionen:

1. ⭐ (1 Stern)
   
   
2. ⭐⭐ (2 Sterne)
   
   
3. ⭐⭐⭐ (3 Sterne)
   
   
4. ⭐⭐⭐⭐ (4 Sterne)
   
   
5. ⭐⭐⭐⭐⭐ (5 Sterne)
   
   

So wählst du Bewertungen aus:

1. Tippe auf eine beliebige Sternbewertungszeile
   
   
2. Das Kontrollkästchen auf der linken oder rechten Seite wird angekreuzt
   
   
3. Du kannst mehrere Bewertungen auswählen
   
   
4. Jeder Tipp schaltet das Kontrollkästchen an/aus
   
   
5. Visuell: Angekreuzte Kästchen zeigen ein Häkchen oder ein ausgefülltes Quadrat
   
   

Button „Alle löschen":

1. Tippe auf den Link „Alle löschen" oben rechts
   
   
2. Alle Kontrollkästchen werden sofort deaktiviert
   
   
3. Ermöglicht ein schnelles Zurücksetzen ohne einzelnes Deaktivieren
   
   

Button „Filter anwenden":

1. Nach Auswahl der gewünschten Bewertungen zum Ende des Modals scrollen
   
   
2. Tippe auf den Button „Filter anwenden"
   
   
3. Der Button erstreckt sich über fast die gesamte Breite des Modals
   
   
4. Der Button kann zeigen, wie viele Filter angewendet werden (z. B. „2 Filter anwenden")
   
   

Was passiert nach dem Anwenden:

1. Das Modal schließt sich und verschwindet
   
   
2. Zurück zum Filterpanel
   
   
3. Die Bewertungszeile wird aktualisiert, um die ausgewählten Bewertungen anzuzeigen (z. B. „1, 2, 3 Sterne")
   
   
4. Die Bewertungsliste wird sofort gefiltert, um nur die ausgewählten Bewertungen anzuzeigen
   
   

Schließen ohne Anwenden:

1. Tippe auf den X-Button oben rechts im Modal
   
   
2. Das Modal schließt sich
   
   
3. Es werden keine Filter angewendet
   
   
4. Frühere Auswahlen bleiben unverändert
   
   

Filter „Beantwortet"

Zweck: Nach Antwortenstatus filtern (beantwortet/nicht beantwortet)

So verwendest du es:

1. Tippe auf die Zeile „Beantwortet"
   
   
2. Dropdown oder Auswahldialog wird angezeigt
   
   

Typischerweise verfügbare Optionen:

• Alle Bewertungen
  
  
• Beantwortet (Bewertungen mit Antworten)
  
  
• Nicht beantwortet (Bewertungen ohne Antworten)
  
  

Eine Option auswählen:

1. Tippe auf die gewünschte Option
   
   
2. Option wird ausgewählt/angehakt
   
   
3. Dropdown schließt sich
   
   
4. Zeile „Beantwortet" wird aktualisiert, um deine Auswahl anzuzeigen
   
   

Ergebnis:

• Die Liste wird gefiltert, um nur Bewertungen mit dem ausgewählten Status anzuzeigen
  
  

Zeitraumfilter

Zweck: Bewertungen nach Datumsbereich filtern

So funktioniert es:

1. Tippe auf die Zeile „Zeitraum"
   
   
2. Eine Datumsauswahl oder Voreinstellungsoptionen erscheinen
   
   

Häufige Voreinstellungsoptionen:

• Heute
  
  
• Letzte 7 Tage
  
  
• Letzte 30 Tage
  
  
• Letzte 90 Tage
  
  
• Letztes Jahr
  
  
• Gesamter Zeitraum
  
  
• Benutzerdefinierter Bereich
  
  

Wähle eine Voreinstellung:

1. Tippe auf die gewünschte Zeitraum-Option
   
   
2. Option wird hervorgehoben oder aktiviert
   
   
3. Auswahl wird geschlossen
   
   
4. Zeitraumzeile wird mit der Auswahl aktualisiert (z. B. „Letzte 30 Tage")
   
   

Benutzerdefinierter Bereich (falls verfügbar):

1. Tippe auf die Option „Benutzerdefinierter Bereich"
   
   
2. Kalenderauswahl wird angezeigt
   
   
3. Tippe auf das Startdatum im Kalender
   
   
4. Tippe auf das Enddatum im Kalender
   
   
5. Bestätige die Auswahl
   
   
6. Benutzerdefinierter Bereich wird angezeigt (z. B. „1. Jan – 31. Jan")
   
   

Ergebnis:

• Nur Bewertungen im ausgewählten Zeitraum werden in der Liste angezeigt
  
  
• Ältere/neuere Bewertungen werden ausgeblendet
  
  

Mehrere Filter anwenden

So funktionieren Filter zusammen:

1. Wähle einen Standortfilter (z. B. „Standort A")
   
   
2. Wähle einen Bewertungsfilter (z. B. „1, 2 Sterne")
   
   
3. Wähle einen Zeitraum (z. B. „Letzte 30 Tage")
   
   
4. Alle Filter werden mit UND-Logik kombiniert
   
   
5. Ergebnis: Zeigt nur 1-2-Stern-Bewertungen von Standort A aus den letzten 30 Tagen an
   
   

Aktive Filter anzeigen:

• Filterbereich-Zeilen zeigen ausgewählte Werte statt „Filter wählen"
  
  
• Das Filtersymbol auf dem Hauptbildschirm kann ein Abzeichen anzeigen (z. B. „3" für 3 aktive Filter)
  
  
• Die Bewertungsliste zeigt gefilterte Ergebnisse an
  
  

Alle Filter löschen:

1. Kehre zum Filterbereich zurück
   
   
2. Suche nach der Schaltfläche „Alle zurücksetzen" oder „Filter löschen" (falls verfügbar)
   
   
3. ODER lösche jeden Filter manuell einzeln
   
   
4. Die Bewertungsliste zeigt wieder alle Bewertungen an
   
   

Bewertungsliste – Karteninteraktionen

Listenverhalten:

• Vertikale Scrolling-Liste
  
  
• Jede Bewertung ist eine separate Karte
  
  
• Karten haben Abstände zwischen sich (8–16 Pixel)
  
  
• Volle Bildschirmbreite (mit Seitenrändern)
  
  

Jede Bewertungskarte zeigt:

Linke Seite:

• Rundes Avatar (48–64 Pixel Durchmesser)
  
  
• Enthält Profilfoto des Bewerters ODER ersten Buchstaben des Namens
  
  
• Hintergrundfarbe, wenn Buchstabe verwendet wird
  
  

Rechte Seite (Hauptinhaltsbereich):

• Zeile 1: Name des Bewerters in Fettdruck (z. B. „[Kundenname]")
  
  
• Zeile 2: Sternbewertung – 5 Sternsymbole, je nach Bewertung gefüllt
  
  
  • 5 Sterne: Alle gold/gelb
    
    
  • 4 Sterne: 4 gefüllt, 1 leer/grau
    
    
  • 1 Stern: 1 gefüllt, 4 leer
    
    
• Zeile 3–5: Auszug aus dem Bewertungstext (kann gekürzt sein)
  
  
  • Zeigt erste 2–3 Zeilen
    
    
  • Kann mit „…" enden, wenn länger
    
    
  • Vollständiger Text nach dem Antippen sichtbar
    
    
• Untere Zeile: Metadaten-Zeile
  
  
  • Standort-Pin-Symbol + Standortname (z. B. „[Standortname]")
    
    
  • Zeitstempel