connystrauss-blog

[connystrauss-blog]

Unser fertiger interaktiver Handschuh im direkten Einsatz!

Mit @kleinekathi und @connystrauss

[connystrauss-blog]

So sah unser erster Prototyp aus - ohne fertiges Design, um die Funktionalität des Codes zu testen.

mit @kleinekathi und @connystrauss

[connystrauss-blog]

Hier findet ihr die Präsentation unseres Physical Interfaces. Entstanden ist dieses Projekt auf Basis der Sorgenfresser App, und in Kooperation zwischen @kleinekathi , @connystrauss und mir!

Sorgenfresser Connect

Der interaktive Handschuh erlaubt es dem Nutzer - egal ob Groß und Klein - direkt mit dem Sorgenfresser auf dem Bildschirm zu interagieren. Die eingebauten Sensoren nehmen verschiedenste Bewegungsabläufe wahr und übertragen sie auf den Computer. Durch kindgerechte und logische Verknüpfungen kann der Sorgenfresser Essen, Schlafen und Springen. Die Bewegungen sind so gewählt, dass sie Kinder sofort übernehmen und selbst ausführen können. Beim Bau des Prototypen war uns auch ein cooles Design ein anliegen. Wir verwendeten einen schwarzen Sporthandschuh als Grundmaterial. Die Kabeln sind in der Kontrastfarbe Orange und am Handrücken fixiert. Geplant war ein autarkes System, mit einem tragbaren Akku am Oberarm und einer kabellosen Verbindung zum Computer. Leider konnten wir dies aufgrund fehlender Teile nicht umsetzen.

Interaktionen

So veranlasst das Zusammenführen von Daumen und Mittelfinger den Sorgenfresser dazu, eine Sorge zu essen. Das Kippen der Hand bringt ihn dazu, hoch in die Luft zu springen und ein Zusammenführen beider Hände, schaltet in den Nacht-Modus um, und der Sorgenfresser kann schlafen gehen. Verantwortlich dafür zeichnen sich verschiedenste Sensoren, die direkt in den Handschuh integriert wurden. Um den Sorgenfresser springen zu lassen, wurde ein Kippsensor vernäht, der die Haltung der Hand erfasst. Wenn der Nutzer nun seine Hand kippt, empfängt der Computer den Impuls des Kippsensors und kann durch den entsprechenden Code den Sorgenfresser hüpfen lassen. Die Tag- und Nachtzeit gelingt durch einen Helligkeitssensor in der Handinnenfläche. Macht der Nutzer eine Faust oder führt beide Hände zusammen, kommt weniger Licht auf den Sensor und der Nachtmodus wird aktiviert. Das Essen wird durch das Zusammenführen von Daumen und Mittelfinger aktiviert. Lässt der Nutzer dabei alle Finger beisammen, ergibt sich automatisch eine Essensbewegung, die Kinder sofort erkennen und mit dem essenden Sorgenfresser assoziieren. Durch Fingerschlaufen an beiden Fingern, an denen leitendes Material vernäht ist, kommt ein Stromfluss zugange, der die Interaktion auslöst.

[connystrauss-blog]

Endabgabe

https://invis.io/5YF9WNVTR

[connystrauss-blog]

User Testing:

SUS Auswertung:

ATTRAKDIFF Auswertung:

User Tests:

Feedback:

- der Startbildschirm war viel zu kurz - Warenkorb Piktogramm unklar

[connystrauss-blog]

Feedbackrunde 12.01.

Betty: - das i in der bottom nav passt nicht so ganz zu den anderen Icons - header etwas zu groß - bei Standortabfrage “back” unnötig - bei ehemalige Bestellungen ev. nicht die Restaurants, sondern die Bestellungen an sich anzeigen - bei Profil und Filter in den Buttons alles groß beginnen - bei der Bestellung auch einen Button erstellen, der einen wieder zurück führt

Marlene:  - header hat zu viel Schatten - bottom nav Schatten zu hart - bottom nav - Text zu Icons? - bei Filter ruhig bei Kleinbuchstaben bleiben - bottom nav i etwas kleiner darstellen

Dani: - bei ehemalige Bestellungen die Option “erneut bestellen” einbauen - Alert/Pop Up mit “Bestellung erhalten” damit man auch zu dem Beginn der App zurückkehrt - i passt nicht so ganz so den anderen icons

Dena: - statt “Profil ändern” zu “Allergene ändern” - Abstände bei den Buttons im Profil viel zu groß - Warenkorbicon bei Speisekarte soll direkt zur Bestellübersicht führen - extra Icon für Gruppenbestellung statt bei Profil

Eva: - Standort “back” weg - Schatten bei header UND drunter (Suche) zu viel - Filter automatisch anwenden und vorne anzeigen - bei Allergene den orange Hintergrund weg oder bis zum Rand ziehen - bei Profil unter die Icons schreiben, was es bedeutet - bei Trennungen konsistent bleiben - Standort Hausicon ausgrauen - Schrift nicht komplett schwarz gestalten

Sebastian: - Kante bei den Favs schirch, Strich eher durchziehen - Profil erstellen - Textfeld breiter

[connystrauss-blog]

Sketchnotes Microinteractions

[connystrauss-blog]

Invision

Klickbarer Prototyp: https://invis.io/5YF9WNVTR

[connystrauss-blog]

[connystrauss-blog]

Gamification

Gamification:

1 Gamification

2 3 Missing Ingredients

3 Getting it right

Make-believe+Rules+Challenges

Goals + Feedback

Free, safe play space + share toy objects

Points (tracking, feedback)

Meaning - meaningful story - Danger: messing with social meanings

Mastery - the fun of learnings in games - create interesting challenges - clear, visually present goals - structured flow of goals - scaffolded challenges ( gets increasingly more difficult) - not just more of the same - excessive positiv feedback - Danger: emergent behaviors

Autonomy - no strings attached - shared goals, individual pursuit - informational feedback - unexpected rewards - Danger: The perils of extrinsic rewards …. play is voluntary, beware of curbing autonomy,

Getting it right:

read the rules, know your users, prototype, playtest, iterate -  bring in the data -

[connystrauss-blog]

Screendesign

[connystrauss-blog]

User Testing

1. User Testing mit Dani:

Danis Vorschläge:

- Das Profil zu personalisieren (Name, ev. Foto) - Bei Reservierungsmöglichkeit ein Namensfeld und ev. Angabe, ob Kinder mitkommen - Bei Lieferoption Anzeige, wie lange die Lieferzeit beträgt & Verfolgung der Bestellung

Dani ist in der App ihrer Meinung nach sehr gut zurecht gekommen und hat die Funktionen verstanden.

User Testing mit Dominic:

Dominics Feedback:

Die Funktionen hat er grundsätzlich verstanden, allerdings ist er mit dem Overlay, das die Möglichkeit einer Profilerstellung mit den Allergenen anzeigt, überhaupt nicht zurecht gekommen. Er ist der Meinung, dass das Icon rechts oben reicht und nicht noch extra angezeigt werden muss. 

Die Anzeige der “erlaubten” Speisen im Bereich der Speisekarte findet er ausgesprochen sinnvoll und auch die schnelle Bestellung oder Reservierung erscheint ihm gut gelöst.

User Testing mit Betty:

Bettys Vorschläge:

Betty findet die App klar strukturiert und fühlt sich gut durch die App geführt. Das Reservieren, bestellen und so funktioniert für sie super. 

Jedoch ist auch sie von dem Overlay irritiert. Es ist für sie unverständlich, warum sie zuerst schon Restaurants sieht, obwohl sie noch gar nicht auf sie abgestimmt sind und findet es besser, wenn man bei der ersten Nutzung die Möglichkeit der Einstellung hat und danach sollte es klar sein mit dem Icon rechts oben. 

[connystrauss-blog]

Wireframes + Einarbeitung Feedback

https://invis.io/68EUK69WA

[connystrauss-blog]

Wireframes

Meine Wireframes habe ich mit dem Programm Omnigraffle erstellt und dann in Invision klickbar gemacht. Hier der Link: https://invis.io/APEMQY6UV 

Informationsarchitektur:

[connystrauss-blog]

Physical Interface

Ideen für eine Interfacelösung passend zum Semesterprojekt...

Idee 1:

Man kann sich nicht genau zwischen Speisen entscheiden? Man ist sehr heikel und möchte das Restaurant sehen bevor man dort bestellt? Man möchte das Restaurant besuchen aber den besten Tisch im Restaurant haben, aber weiß noch nicht, welcher das sein soll? Mithilfe einer VR Brille werden die Gerichte teilweise auch während der Zubereitung gezeigt. Der Kellner führt einen durch das Restaurant und zeigt den besten Tisch.

Idee 2:

Man fühlt sich körperlich schon etwas länger nicht mehr gut. Die Vermutung ist da, dass man bestimmte Lebensmittel nicht verträgt. Eine App die beim Bestellen und Restaurantfinden trotz Allergene hilft ist ja gut und schön, aber davor müsste man eben wissen, welche Allergene auf einen zutreffen. Die Atemluft wird mit einem Gerät gemessen und innerhalb von Sekunden ein Profil mit den ausgemessenen Daten in der App angelegt, damit man gleich drauf los bestellen kann.

Idee 3:

Alexa ist für dich da. Sie hört dein Magenknurren und weiß, dass du schon mega schlechte Laune deswegen hast. Je nach Berechtigung bzw. Einstellung bestellt sie gleich etwas mithilfe der App und gibt dir Bescheid, wann die Lieferung bei dir sein wird. Selbstverständlich kannst du diese Gerichte trotz deiner Allergene essen. Sollte die Berechtigung nicht gegeben sein, öffnet sie dir die App und gibt dir Vorschläge damit du mit einem Klick bestellen könntest.

[connystrauss-blog]

Animiertes Storyboard mit Einarbeitung des Feedbacks...

[connystrauss-blog]

animated storyboard