Rätoromanisch ist die vierte Landessprache der Schweiz – aber sie ist (noch) kaum digitalisiert. Zwar gibt es Webseiten und Apps, mit denen man online mit der Sprache in Berührung kommt, allerdings wird hierbei Rumantsch Grischun verwendet, eine 1982 konstruierte Schriftsprache. Das Rätoromanische besitzt aber fünf Idiome, die unterschiedlicher nicht sein können. Das Idiom mit der grössten Sprecherzahl ist das Sursilvan.
Arbër Shala und ich haben uns deshalb entschlossen, eine multimediale Begriffssammlung namens «Juna – la SursilvApp» auf Sursilvan zu konzipieren. Zusätzlich zeigen wir euch Schritt für Schritt auf, wie solche Projekte angegangen werden.
Hier könnt ihr den Prototypen für den Desktop ansehen.
Zum Namen an sich: Wir haben uns schon relativ früh Gedanken gemacht, wie unsere App eigentlich heissen soll. Da wir es als unser Baby ansehen, haben wir einfach mal nach romanischen Babynamen gesucht. Wir fanden schliesslich den Namen Juna treffend. Der Name ist wahrscheinlich keltischen Ursprungs und bedeutet so viel wie «die Erwünschte», «die Freundliche», «die Blühende» und «die Junge». Ausserdem geht Juna vermutlich auch auf die römische Mythologie und die Göttin der Fruchtbarkeit, Geburt und Fürsorge «Juno» zurück. SursilvApp ist schliesslich ein Kofferwort und besteht aus «Sursilvan» und «App».
1. Ausgangslage/Ideenfindung
Die Frage ist durchaus berechtigt: Wozu braucht es eine rätoromanische Begriffssammlung für Sursilvan? Die Antwort: Stell dir vor, du sitzt als Schüler*in im Rätoromanisch-Unterricht und musst mit Lehrmitteln arbeiten, die älter sind als du selbst. Das ist nicht gerade prickelnd. Mit unserer Web-App möchten wir dem entgegenkommen.
2. Need-Finding
Wie oben bereits erwähnt, kennen wir diese Situation bestens. Im Austausch mit elf Personen eines Rätoromanisch-Sprachkurses haben wir nach den Bedürfnissen (Needs) gefragt und sie notiert. Diese waren u. a.:
• zeitgemässes Nachschlagewerk auf Sursilvan
• Wörter im Kontext (z. B. gebräuchliche Sätze) lernen
• Verbensammlung
• Aussprachefunktion
• Open-Data, offline und mit dem Browser zugänglich.
3. Research/Konkurrenzanalyse
Es ist nicht schlecht, sich umzusehen, was Mitbewerber schon umgesetzt haben. Wir haben dafür zwölf sich konkurrierende Web-Applikationen angeschaut und sie in einer SWOT-Analyse evaluiert. Aus diesen Erkenntnissen wurde eine Value-Map erstellt, um daraus den Mehrwert zu definieren.
Wie viele Nutzer können so erreicht werden? Wir haben herausgefunden, dass unser Marktpotenzial bei bis zu 9000 Personen liegt. Diese Zahl nehmen wir aus der Anzahl Klicks des Online-Angebots von RTR (Radio Televisiun Rumantscha) hervor.
4. Personas
Welche Art von Nutzer werden unsere Web-App brauchen? Auf den ersten Blick haben wir diese aufgelistet:
• SuS, die mit Tablets im Unterricht arbeiten
• Menschen, welche die Sprache autodidaktisch und auch online lernen möchten
Damit es noch ein wenig fundierter wird, sind hierfür Personas von Vorteil. Personas sind archetypische Nutzer, die aus den Resultaten von beispielsweise 20 befragten Personen basieren. So sehen schliesslich unsere Personas aus:
5. Process-Map und Informationsarchitektur
Um die genauen Abläufe einer Web-App nachvollziehen zu können, wird eine Process-Map erstellt. Die Process Map bildet die Abläufe ab, welche die Nutzer durchlaufen. Die Prozessschritte werden dabei visuell und schrittweise abgebildet. Sie macht den Gesamtprozess der Anwendung verständlich. Sie enthält auch Entscheidungen, in welchen sich Gabelungen und neue Navigationswege bilden.
Für die Erstellung einer Informationsarchitektur verwenden wir die Card-Sorting Methode. Aufgrund dieser Methode entsteht das Endprodukt der Informationsarchitektur.
6. Wireframes und Mockups
Diese Begriffe werden fälschlicherweise oft gleichgesetzt. Daher erklären wir sie kurz:
Bei Wireframes handelt es sich um skizzierte, visuelle Anleitungen, welche aufzeigen, wie das Grundgerüst einer Webseite oder einer App aussehen könnte. Bei Mockups handelt es sich dann um Vorführmodelle bzw. Attrappen einer Webseite oder einer App, in der auch das Design und die Funktionen dargestellt werden.
Ein Beispiel unserer anfänglichen Wireframes:
Ebenfalls ein Beispiel unserer anfänglichen Mockups welches wir mit Adobe XD umsetzten:
Bezüglich der Buttons: Die Buttons sollten vorzugsweise unten in der Nähe der Daumen platziert werden und sich ihrer Grösse orientieren.
Es handelt sich hier allerdings noch nicht um das endgültige Design, das wird im nächsten Schritt beschrieben.
7. Design
Farben: Wir wollten schauen, mit welchen Farben Graubünden assoziiert wird:
Schliesslich haben wir uns für folgende Farbpalette entschieden:
Die etwas helleren Farben sind ansehnlich und ermüden die Augen nicht.
Logo: Das Logo assoziiert die Termini «Graubünden», «Surselva» und etwaige Wahrzeichen wie den Steinbock. Das gibt dem ganzen einen Wiedererkennungswert. Als Inspiration dient uns ein selbst erstelltes Moodboard:
Das Logo könnt ihr aus dem Beitragsbild entnehmen.
Schriftart: Die Schrift sollte online gut leserlich sein und die Augen nicht ermüden. Nach ein paar Sucheinheiten haben wir uns deshalb für «Tw Cen MT» entschieden:
Die Schrift ist serifenlos und zeitgemäss. Die Laufweite der Schrift (der Raum zwischen den Buchstaben) und der Weissraum fanden wir zudem sehr stimmig. Tw Cen MT ist ausserhalb von Adobe verfügbar. Zur Grösse der Schrift: Zu beachten gilt, dass die kleinste Schriftgrösse nicht unter 17pt liegen soll – sonst wird es für die User sehr mühsam zum Lesen.
Styleguide und Minipatternlibrary
Barrierefreiheit
Artboards des Prototypen für Mobile
Artboards des Prototypen für Desktop
8. Usability Testing
Das Usability Testing umfasst das Testen des Prototypen an ausgewählten Testpersonen. Diese ähneln jeweils unseren Personas der zuvor definierten Zielgruppe. Das Usability Testing ist besonders wichtig um Fehler frühzeitig zu erkennen und zu beheben. Wir hielten fest, dass die App noch nicht ausgereift war. Das Ziel des Testings ist es, ein authentisches Feedback zu erhalten und die Benutzerfreundlichkeit unserer Web-App feststellen zu können. Fragen waren dabei folgende:
• Wie gehen sie mit der Web-App um?
• Mit welchen Menüpunkten und Buttons interagieren sie?
• Was halten sie vom Design?
Ausserdem helfen Interviewleitfäden mit kleinen Aufgaben die Evaluationsziele des Testings zu erreichen. Fragen waren für uns folgende:
• Sind die Prozessschritte nachvollziehbar?
• Können die einzelnen Aufgaben umgesetzt werden?
• Sind die visuellen Elemente der App ansprechend?
• Sind alle Menüpunkte logisch geordnet oder fehlt noch etwas?
• Wie ist der Gesamteindruck der App?
Wurden die Feedbacks eingeholt, werden die Ergebnisse daraus ausgewertet und beim Prototypen angepasst.
