Funktionales Konzept Verteilerplattform mobiler Anwendungen mit Gemeinnutzen/ BMI

Funktionales Konzept

Verteilerplattform mobiler Anwendungen mit
Gemeinnutzen/ BMI

1. Startseite

Header
Der Header beinhaltet Logo, Hauptnavigation, Suchfeld und den Link zur erweiterten Suche. Scrollt der
Nutzer nach unten fährt der Header mit – er ist stets als obere Grenze der Seite zu sehen.
    •   Hauptnavigation:
        o   Themen: Per Mouse-Over erhält der Nutzer eine Vorschau aller Themen und kann durch
            Auswählen einer der Vorschläge auf die Suchergebnis-Seite mit entsprechend aktiviertem
            Filter kommen.
        o   Regionen: Per Mouse-Over kann der Nutzer in einer Vorschau unter vorgeschlagenen
            Regionen seine eigene auswählen und kommt anschließend auf ein entsprechend
            gefiltertes Suchergebnis.

o   Berechtigungen: Per Mouse-Over erhält der Nutzer eine Übersicht aller Berechtigungen,
        die eine App einfordert. Wählt er eine dieser Berechtigungen aus, kommt er auf eine
        Unterseite, die ihm Details zu dieser Berechtigung erklärt.
•   Suchfeld: Gibt der Nutzer ein Suchwort ein, werden ihm im Type-Ahead-Fenster relevante
    Ergebnisse vorgeschlagen.
•   Per Klick auf die erweiterte Suche fährt ein Layer nach unten aus und der Nutzer kann weitere
    Parameter in seiner Suche angeben, unter anderem: Preis, Berechtigung und Plattform.

                                                                      Startseite mit aktivem Drop-Down Menü

                          Verteilerplattform - Funktionales Konzept 2e.docx 2 / 15

Startseite mit Type-Ahead-Funktion

Verteilerplattform - Funktionales Konzept 2e.docx 3 / 15

Zugriff auf erweiterte Suche über Detailseite

Verteilerplattform - Funktionales Konzept 2e.docx 4 / 15

Slider
Im Slider können beliebig viele Slides eingebaut werden, die über die Pfeiltasten bedient werden. Wir
empfehlen 3 bis maximal 5 Slides. Slides können Bilder, Text und Call-to-Action Elemente enthalten. Der
Slider kann genutzt werden, um zum Beispiel neue oder besondere Apps vorzustellen oder die Funktionen
und Hintergründe der Webseite zu erklären.

Neuste Apps
In diesem Fenster verweisen Teaser auf Apps, die neu in die Webseite mitaufgenommen wurden. Per
Pfeiltaste kann der Nutzer schnell durch die Apps stöbern (Per Slider). Zu jeder App werden entsprechende
Berechtigungen angezeigt. Kostenpflichtige Apps sind mit einem Euro-Symbol gekennzeichnet.

Schnellauswahl
Möchte der Nutzer eine Auswahl zu Thema, Region und/ oder Plattform der gesuchten App treffen, kann
er dies unkompliziert und schnell über die Dropdown Buttons tun. Klickt der Nutzer auf „übernehmen“
kommt er auf eine entsprechend gefilterte Suchergebnisseite. Einzige Ausnahme: Wählt er nur eine der
Berechtigungen aus, kommt der Nutzer auf die Übersichtsseite dieser Berechtigung.

Footer
Im Footer befinden sich Logo des BMI und Metanavigation. Die Metanavigation führt zurück zur Startseite
und zu den statischen Seiten „Über uns“, „Kontakt“, „Impressum“, AGB“ und „Datenschutz“.

2. Suchergebnis-Seite

Nach Eingabe eines Suchwortes, einer erweiterten Suche, oder der Auswahl mehrerer Filter über die
Schnellauswahl kommt der Nutzer auf eine Suchergebnisseite mit zugehörigen Apps. Die Suche kann über
verschiedene Filter in der Sidebar weiter eingeschränkt werden. Werden neue Filter ausgewählt legt sich
ein Modalfenster über das Suchergebnis, während sich das Suchergebnis aktualisiert. Die Inhalte der Seite
verändern sich so, ohne dass die gesamte Seite neu geladen werden muss.

                              Verteilerplattform - Funktionales Konzept 2e.docx 5 / 15

Suchergebnis-Seite zum Suchwort „Politik“

Verteilerplattform - Funktionales Konzept 2e.docx 6 / 15

Suchergebnis-Seite nach Änderung der Filter-Einstellungen

Verteilerplattform - Funktionales Konzept 2e.docx 7 / 15

Share-Funktion
Der Nutzer kann die Seite über gängige Social-Media-Kanäle teilen oder per E-Mail versenden. Dies wird
in einem Zwei-Klick-Verfahren durchgeführt um vor einer Bestätigung des Users keine Daten an die
entsprechenden Social-Media-Plattformen zu senden.

Liste: Suchergebnis
Alle Apps, die zu den eingegebenen Suchwörtern passen, werden nach Relevanz in einer Liste aufgeführt.
Möchte der Nutzer eine andere Sortierung der Apps vornehmen, so kann er sie über die Sortierungs-
Buttons alternativ nach Preis oder Name ordnen.
Neben Titel, Bild und Einführungstext wird über Icons angezeigt auf welchen Plattformen die App
verfügbar ist und auf welche Berechtigungen die App zugreifen kann/will. Ein Euro-Symbol hinter dem
Titel der App markiert kostenpflichtige Apps.

Filter-Module
In den Filtermodulen in der Sidebar kann der Nutzer nach seinen Präferenzen filtern:
    •   Themen: Inhaltliche Bereiche, die ihn interessieren.
    •   Preis: Hier kann der Nutzer einen Preisrahmen für das Suchergebnis festlegen.
    •   Plattform: Der Nutzer kann nach Plattform filtern, auf der die App verfügbar sein soll.
    •   Berechtigungen: Der Nutzer kann filtern, welche Art von Zugriff die App auf sein Gerät haben
        soll.
    •   Region: Der Nutzer kann die Suche nach der Verfügbarkeit in einer bestimmten Region filtern.

Jedes Mal, wenn der Nutzer eine neue Filterung vornimmt, wird ihm über ein Overlay über dem
Suchergebnis signalisiert, dass sich nun sein Suchergebnis entsprechend anpasst.
Die Filtermodule können per Klick auf den Pfeil ein-/ausgeklappt werden. Um ein visuelles Gleichgewicht
von linker zu rechter Seite herzustellen, empfehlen wir, bestimmte Filterfunktionen eingeklappt zu laden
oder die Anzahl der Suchergebnisse zu erhöhen.

                               Verteilerplattform - Funktionales Konzept 2e.docx 8 / 15

3. Berechtigung-Übersicht

Wählt der Nutzer über die Hauptnavigation oder Schnellauswahl einer der Berechtigungen aus, kommt er
auf eine Übersichtseite, die die jeweilige Berechtigung erläutert und dem Nutzer wichtigste Fakten zum
Thema gibt. In zwei Listen werden dem Nutzer Beispielapps und neueste Apps vorgestellt, die die
entsprechenden Plattformen der App anzeigt. In der Sidebar werden die Berechtigungen aufgeführt. Der
Nutzer kann per Klick so direkt auf die Übersicht einer anderen Berechtigung kommen.

                              Verteilerplattform - Funktionales Konzept 2e.docx 9 / 15

4. Detailseite

Jede App hat eine Detailseite auf der Informationen und Vorschau-Screens gezeigt werden und die auf die
entsprechenden Anbieterplattformen verweist, auf denen die App heruntergeladen werden kann.

Breadcrumb-Navigation
Die Breadcrumb-Navigation zeigt dem Nutzer die Verknüpfung der Seite innerhalb der Sitemap an.

Auswahl: Plattform
Der Nutzer kann wählen, für welche Plattform er sich interessiert. Wählt er zum Beispiel „Android“ aus,
ändern sich alle Informationen zur App entsprechend der ausgewählten Option. Plattformen, für die die
App nicht verfügbar ist, werden ausgegraut angezeigt, um Vollständigkeit zu zeigen, und/oder, um später

                             Verteilerplattform - Funktionales Konzept 2e.docx 10 / 15

einen Hinweis und Formular zu zeigen, mit dem der User auf seinen Plattform-Wunsch aufmerksam
machen kann.

Share-Funktion
Der Nutzer kann die Seite über gängige Social-Media-Kanäle teilen oder per E-Mail versenden. Dies wird
wie oben beschrieben über eine Zwei-Klick-Lösung umgesetzt.

Informationen zur App
Neben Logo, Titel und Untertitel gibt es einen Einführungstext, der die Funktionen der App beschreibt.
Klickt der Nutzer auf „mehr“ fahren unterstehende Elemente nach unten und der gesamte Infotext wird
sichtbar. Ein Button verlinkt zum entsprechenden App-Download-Anbieter.

Modul „Ähnliche Apps“
In diesem Modul werden inhaltlich ähnliche Apps angeteasert. Klickt der Nutzer auf den Pfeil-Button, kann
er/sie direkt weitere Ergebnisse anzeigen (Slider).

Sidebar
    •   Berechtigungen: Die unterschiedlichen Symbole geben an, auf welche Rechte die App bei
        Anwendung zugreifen darf/ möchte. Optionen sind: Zugriff auf Ort (Lokalisierung),
        Telefonbuch und Kamera des Nutzers, sowie SSL Verschlüsselung bei der Übertragung von
        Daten und Cloud-basierte Datenspeicherung. Per Mouse-Over werden die unterschiedlichen
        Optionen in einem kurzen Tooltipp erklärt. Das Fragezeichen gibt zusätzlich Informationen
        über die Berechtigungen von Apps und Datenschutz-Vorgaben in Deutschland.
    •   Ein Fakten-Modul zeigt das Thema, den letzten Stand der Aktualisierung, die Größe der App
        und die verfügbaren Sprachen an.
    •   Region: Hier wird angezeigt, in welchen Regionen die App verfügbar ist, bzw. für welche
        Regionen die App optimiert ist. Klickt der Nutzer auf den Link, kommt er auf die Übersicht aller
        Angebote in dieser Region.
    •   Autor: Hier wird in wenigen Worten der Autor der App beschrieben. Möchte der Nutzer den
        Herausgeber der App kontaktieren, ist das über den Button „Feedback senden“ möglich.

                              Verteilerplattform - Funktionales Konzept 2e.docx 11 / 15

Detailseite mit Tooltipp zur Berechtigungs-Option

Verteilerplattform - Funktionales Konzept 2e.docx 12 / 15

5. Responsive Design

Um die Verteilerplattform auch auf mobilen Endgeräten optimal nutzen zu können, basiert sie auf
Responsive Design: Ob Laptop, Tablet oder Smartphone - die Struktur der Seite passt sich so stets an die
Display-Größe des Nutzers an.
Wird die Suchergebnis-Seite auf einem Smartphone-Display geladen, wird die Filter-Sidebar durch einen
„Filtern“-Button ersetzt. Klickt der Nutzer auf diesen Button öffnet sich ein Overlay-Fenster mit Akkordeon-
Menü, über das auf einzelne Filter zugegriffen werden kann.
Es ist angedacht, die technische Umsetzung auf Basis von „twitter Bootstrap“ herzustellen.

                                     Startseite – mobile Version

                              Verteilerplattform - Funktionales Konzept 2e.docx 13 / 15

Suchergebnis - mobile Version             Filterung – mobile Version                    Filterung – mobile Version

                            Verteilerplattform - Funktionales Konzept 2e.docx 14 / 15

Detailseite – mobile Version

Verteilerplattform - Funktionales Konzept 2e.docx 15 / 15