ralfz123 / human-centered-design-2021

Humand Centred Design • Creating a unique, tailor made Closed Captions experience for people that have a hearing disability

Home Page:https://ralfz123.github.io/human-centered-design-2021/final/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Human Centered Design @cmda-minor-web 2020 - 2021

Badge stating project is licensed under MIT license Badge stating amount of issues open Badges via shields.io

Closed Captions 👂 ❌

Human Centered Design, a course of the minor Web Design & Development. It is a minor of the third year from the study CMD.

Opdracht

Human Centered Design is een methode voor het ontwerpen van gebruiksvriendelijke interactieve toepassingen.

Voor dit vak krijgen we een ontwerp-opdracht die we gaan maken voor 1 specifiek persoon. Wij moeten ons ontwerp 3 keer laten testen door deze gebruiker. Door te testen en te itereren zullen we ons concept verbeteren en meer specifiek voor de persoon maken. Uiteindelijk hebben we een ontwerp dat exclusief gemaakt is voor deze ene persoon. Een exclusive design... Wie is deze persoon dan voor wie je dit gaat maken? Wat vindt deze persoon leuk of juist niet? En hoe bedient deze persoon een computer? Dit lees je hieronder.

Probleem

Voor Darice gaat er enorm veel nuance verloren tijdens het kijken naar een film of een documentaire. Bij veel films worden closed captions aangeboden, maar die zijn zo neutraal als maar kan. Darice mist de ervaring en volgens haar ook soms enige geluiden die niet in beeld zijn, maar zich wel op de achtergrond bevinden.

Oplossing

De oplossing voor dit probleem is een mooie manier van het weergeven van Closed Captions waardoor het voor Darice makkelijk te te onderscheiden is wie er praat, hoeveel verschillende sprekers er in de film zitten, wat voor soort muziek er speelt en de informatie over die muziek, welke (achtergrond)geluiden er spelen en wat de toonhoogte van het volume is in de film door middel van een equalizer.

Live Link 🚀

Link naar live prototype

Testen

Klik hieronder voor de 3 testrapporten.

User scenario

Source image

Darice de Cuba is een 29 jarige Front-end Developer die op haar 26e doof is geworden. Laat-doof wordt dat ook wel genoemd. Zij heeft hier aan het begin onwijs mee gestoeid en wist even niet meer hoe ze verder moest. Overigens had ze altijd al gevoel voor web design en development. En al helemaal voor het stukje Accessibility. Daar is zij zelf een ster in en tegelijkertijd heeft ze er ook moeite mee wanneer ze bijvoorbeeld naar een podcast luistert of een film met Closed Captions krijgt.

Darice wil niks van de podcast/film missen en zit dan dus op het puntje van haar stoel om alles te volgen wat er gezegd wordt. Maar dit gaat moeilijk, omdat niet alle bedrijven er rekening mee houden dat er ook dove mensen aan het kijken zijn. Daarom wil Darice een feature dat zij zonder moeite naar een film kan kijken en de hele experience net zo kan ervaren als een niet-doof persoon.

Omdat Darice niks wil missen van de film en de spanning ervan, is het nu juist zo moeilijk voor haar om die complete ervaring te krijgen. Aspecten zoals achtergrondgeluiden, muziek en sprekers mist zij soms.

Exclusive Design Principles

Study Situation

Het is van hoge nood om echt goed te weten wat Darice nodig heeft om haar films en podcasts goed te kunnen volgen. Omdat wij haar huidige situatie willen verbeteren, betekent het dat wij die situatie wel tot in de puntjes begrijpen en weten. Daarom moeten wij bijna in haar huid kruipen om te beleven wat zij ervaart. Dit is al erg gedaan in de eerste test waarin wij vragen hoe zij hier nu mee omgaat, wat de plus- en minpunten ervan zijn en hoe zij het graag anders ziet. Natuurlijk kun je het zelf ook ervaren door je koptelefoon op te doen en het geluid uit te zetten en de film te bekijken. Dan kun je pas analyseren wat je mist in de film.

Toepassing

Darice heeft erg moeite met het begrijpen van films aan de hand van Closed Captions. De makers van films en platformen houden niet erg rekening met dove mensen. Daarom is het voor Darice heel moeilijk om bepaalde delen van een film te snappen, omdat de CC gewoonweg niet duidelijk genoeg en te neutraal zijn omschreven voor haar. Ze mist de spanning.

Uitwerking

Ignore Conventions

Het zit al in de titel; conventiens. In dit vakgebied zijn een aantal conventies/standaarden vastgesteld waar elke designer zich aan hoort te houden, zodat het voor iedere gebruiker fijn is om een ontwerp te gebruiken. Als dit consistent door designers wordt toegepast, hoeven alle gebruikers uiteindelijk niet meer te zoeken naar een zoekbalk bijvoorbeeld, want die staat bijna altijd rechtsbovenaan.

Tijdens dit project is het de bedoeling dat we juist niet naar deze standaarden gaan luisteren, omdat het product dat wij gaan maken tailor made is voor Darice. Daarom zullen niet alle standaarden voor haar werken en wordt er van ons als designers verwacht dat we daar oplossingen voor creëren.

Toepassing

Echter is Darice niet goed in het negeren van de standaarden. Ze wil juist de richtlijnen van UI design bijvoorbeeld naleven, omdat zij als frontender het ook belangrijk vindt dat het voor iedereen toegankelijk moet zijn. Maar omdat dit ontwerp juist alleen voor Darice is, hoeven we niet naar de standaarden te luisteren. Echter is dit wel onwijs moelijk, want als ik haar een ontwerp voorlegde die afwijkte van de standaarden, stuurde ze me in een richting van de standaard conventies.

Uitwerking

Prioritise Identity

Normaliter maak je een product voor een doelgroep (minimaal 10 mensen). Maar nu maken we een product voor 1 persoon; tailor made. De identiteit van een persoon gaat voorop. Wat zijn haar verlangens, verwachtingen en misschien wel behoeftes? Het is dan ook de bedoeling dat je probeert het hele product op de identiteit van de gebruiker te richten.

Toepassing

Darice houdt erg van minimalistisch design. Less Is More is dan ook een principe wat ik haar vaak heb horen zeggen. Ze wil het liefst dat het product dan ook voor iedereen toegankelijk is, maar dat is niet de essentie van deze opdracht. Het is alleen puur voor Darice.

Uitwerking

Add Nonsense

Zowel elke designer maakt wel is mee dat hij vol zit met ideeën voor een product, maar dat hij/zij ze laat zitten en niet in het product verwerkt omdat ze een beetje "anders zijn dan de rest". Misschien vindt de gebruiker het wel helemaal niks? Misschien gaat de gebruiker mijn product niet meer gebruiken dan? De essentie bij deze opdracht is dan dat je juist gebruik moet maken van deze ideeën. Want je kan deze ideeën dan testen op de testpersoon om te kijken of ze wel echt werken of juist niet. Als gevolg kunnen hier interessante concepten uit rollen.

Toepassing

Bij Darice was dit erg moeilijk, omdat zij graag de UI Guidelines wil volgen en daarbij horen geen nonsense dingen. Tevens hield ze van minimalistisch design, dus overbodige dingen in het scherm moest ik meteen schrappen.

Uitwerking

Conclusie/reflectie op leerdoelen

Dit project was best een lastig project, omdat je je moest focussen op één persoon en soms moest luisteren naar wat zij zei, ookal ben je het er niet mee eens. Dat was soms lastig, maar als ontwerper ging ik dan voor mijzelf na wat de prioriteit heeft en wat niet.

Allereerst vond ik het even zoeken naar wat de link was van de Exclusive Design Principes en de opdracht. Hoe moeten deze samenhangen en in welke mate? Door met mijn teamgenoten hier het over gehad te hebben en zelf nagegaan wat deze principes betekenen, is het voor mij helder geworden wat deze principes voor doel hebben in de opdracht, namelijk: zo exclusief mogelijk design maken voor die ene persoon. Zoals hierboven heb ik alle principes en hun uitwerking in het prototype uitgeschreven.

Vervolgens ging ik kijken naar wie is mijn testpersoon eigenlijk. Wat zijn haar verlangens en behoeftes? Wat wil zij wel en absoluut niet zien in het ontwerp? Daarom heb ik voor de eerste test een "kennismakingstest" gemaakt waarin ik erachter kom hoe Darice haar huidige situatie is. Op basis daarvan probeerde ik deze inzichten mee te nemen in mijn ontwerp, zodat Darice zich helemaal thuis voelt met het ontwerp, omdat haar identiteit erin is verwerkt.

Bovendien hebben we echt geleerd nog beter te testen. We wisten natuurlijk wat testen was en hoe het moet, omdat we dit al echt vaker gedaan hebben, maar niet dat je in zo'n korte tijd een persoon kan leren kennen tot aan het opleveren van een product. Daarbij was het wel echt van belang dat je je aandachtig voorbereidde op de test en dat je van tevoren wist wat je wilde testen en waar je feedback op wilde hebben. Echter hadden we maar 3 testmomenten, waarvan we voor het 1e testmoment erg weinig voorbereiding hadden. Ook duurde elk testmoment maar 10 minuten. Dit was best lastig, want het liefst had ik 10 testmomenten gehad. Wel kwamen er bij elke test bijzondere inzichten en resultaten uit die zowel voor mijn teamleden als mij erg handig waren voor het itereren van het ontwerp. Op deze manier kon ik mijn ontwerp weer verbeteren en dichterbij de behoeftes van de testpersoon krijgen.

Ook was het moeilijk om voor Darice een (out-of-the-box) concept te creëren, omdat zij zelf ook een designer en developer is en ze weet heel goed wat zij wil. Haar feedback was meestal al een richting die zij ons gaf om op te gaan en zo was het voor ons moeilijk om een eigen richting te kiezen. Toch heb ik geprobeerd om haar "van het pad af" te laten wijken, maar ze wist maar al te goed wat ze wilde. Natuurlijk heb ik onzin dingen geprobeerd te testen of dingen die ik daarvoor nooit zou ontwerpen/testen. Daar zijn hele interessante inzichten uitgekomen.

Hoewel ik het een intensief project vind, vind ik het ook zeer interessant en ik heb echt geleerd nog beter te testen. Ik vond het ook leuk om echt voor één persoon een product te maken, want ik kon me dan zo goed focussen op wat die ene persoon wilde. Het lijkt me gaaf om in de toekomst hier meer aandacht aan te besteden, omdat ik het best erg vind dat dit soort mensen "uit de boot" vallen als zij bijvoorbeeld naar een film willen kijken waar geen CC bij zit. Het Web is voor iedereen. zoals Tim Berners Lee dat zei, dus dat geldt ook voor ons als designers en developers.

📁 Sources

Credits to Vasilis && Koop Reynders for giving interesting lectures about Human Centered Design and how to deal with it.

👮 License

License: MIT
This project from Ralf has a MIT © License

About

Humand Centred Design • Creating a unique, tailor made Closed Captions experience for people that have a hearing disability

https://ralfz123.github.io/human-centered-design-2021/final/

License:MIT License


Languages

Language:HTML 46.7%Language:CSS 37.7%Language:JavaScript 15.6%