/human-centered-design

Uploaden en inzoomen van Afbeeldingen. Probleem: Hoe kan ik het process van een afbeelding uploaden & bewerken eenvoudiger maken voor Eric? Oplossing: het bewerken van geuploade afbeeldingen makkelijker maken door simpele interacties.

Primary LanguageVue

Her - Human Centered Design

App Screen SHot

Assignment

Uploaden en inzoomen van foto's

Voor het plaatsen van foto's in een app of website zijn verschillende handelingen nodig. Eric redt zich hier wel mee, hij kan foto's uploaden en plaatsen, maar de interactie zou voor hem wat makkelijker kunnen. Ontwerp voor Eric een functionaliteit waarmee hij eenvoudig een foto kan uploaden en bewerken, zoals inzoomem, een uitsnede maken, draaien en/of in een kader plaatsen.

Onderzoeksvraag

Hoe kan ik het process van een afbeelding uploaden & bewerken eenvoudiger maken voor Eric?

Rubic

Criteria
Readme In de beschrijving van het project staat de opdracht uitgelegd, is het probleem duidelijk beschreven en hoe het probleem is opgelost.
Design Principles Student laat zien hoe de Exclusive Design Principles zijn toegepast in het ontwerp. De principes study situation, prioritise identity, ignore conventions en add nonsense zijn goed uitgelegd. Aan de hand van de principes wordt duidelijk gemaakt hoe deze hebben bijgedragen aan het verbeteren van het ontwerp.
User Needs Er is een user scenario geschreven dat aansluit bij de identiteit van de test persoon. Er is een duidelijk en volledig user scenario geschreven dat antwoord geeft op de 4 w-vragen: Who? What? How? en Why?
Testen Er is elke week getest. Er is een verslaglegging van de tests gedaan waarin de test-opzet wordt behandeld en er is een duidelijke conclusie beschreven met do's en dont's over hoe je goed kan testen.
Testresultaten Aan de hand van de tests wordt duidelijk gemaakt hoe deze hebben bijgedragen aan het verbeteren van het ontwerp of hoe dit een volgende keer beter of anders kan.

Probleemdefinitie

Hoe kan ik het process van een afbeelding uploaden & bewerken eenvoudiger maken voor Eric?

Oplossing

Het bewerken van geuploade afbeeldingen makkelijker maken door simpele interacties.

Ik heb het probleem opgelost door het bewerken van afbeeldingen makkelijker te maken voor Erik. Door de moeite die Erik heeft met de fijne motoriek heb ik een image cropper ontwikkeld waarbij alle handelingen die nodig zijn toegepast worden door een durk op de knop.

Prototype

Documentatie van de Design Principles, User Needs, Testen en Testresultaten.

The Exclusive Design Principles

  1. Study situation In order to become specialist designers for all kinds of people with all kinds of disabilities we have to study different, individual situations.

  2. Ignore conventions The current conventions are designed by, and thus for, designers. Not all of these conventions work for non-designers. If we want to include non-designers, and especially people with disabilities, we should reconsider these conventions, after we studied their situations.

  3. Prioritise identity

    Including excluded people into our design process, by seeing them as co-designers rather than study objects, can help in coming up with new, and relevant, conventions.

  4. Add nonsense

    Designing for people with disabilities is in large part uncharted territory. Nonsense can be a useful tool to investigate the unkown. And it’s fun.

study situation

Door de specifieke situatie van Eric te bestuderen, waarbij het uitvoeren van verschillende gebruikers-onderzoek methodes helpt bij het begreipen van de Eindgebruiker. Zodat er een passend product ontworpen kan worden.

ignore conventions

De standaarden die vaak gebruikt worden zijn niet altijd voor iedereen toegankelijk. Bij een Afbeelding cropper worden vaak swipe handelingen gebruikt om de afbeelding aan te passen, omdat Eric moeite heeft met de fijne motoriek zal ik de bepaalde handelingen die voor de meeste mensen als standaart worden ervaren moeten koppelen aan andere handelingen die voor Eric beter toegankelijk zijn.

prioritise identity

Door een gebruiker mee te nemen in het ontwerp process wordt deze gezien als co-designer in plaats van studie object, dit kan helpen met het bedenken van nieuwe, relevante ideeën & oplossingen. Hierdoor zal het eindproduct ook beter op de gebruiker aansluiten.

add nonsense

Onzin toevoegen kan een handig hulpmiddel zijn om het onbekende te onderzoeken. Hierdoor kan je verder denken dan alleen de basis functionaliteiten. Waardoor je weer een tot een unieke en creatieve oplossing kan komen.

User Scenario

How User Scenarios Help To Improve Your UX

Who is the user I’m designing for?

Eric is een veelgebruiker van social media, SMS, Bellen, Signal, Teams, Twitter of Instagram, die man is unstopable, hij is een rijdend sociaal medium ... Interfaces van deze apps zijn over het algemeen bruikbaar maar niet specifiek ontworpen voor mensen met een motorische beperking. Eric heeft niet de beschikking over de fijne motoriek.

What does this user want?

Eric is opzoek naar een makkelijke manier om geüploade afbeeldingen te bewerken.

Voor het bewerken van deze afbeeldingen zijn de volgende onderderdelen van toepassing:

  • Afbeelding Uploaden
  • Afbeelding Bewerken
    • Inzoomen
    • Croppen
    • Draaien
    • Frame

How is this user going to achieve his goals?

Om Eric te helpen zijn doelen te bereiken heb ik besloten om het bewerken van geuploade afbeeldingen makkelijker te maken voor Eric.

Why does this user come to my site?

Omdat Eric moeite heeft met de fijne motoriek zal het bijsnijden van afbeeldingen met swipe beweginen lastig blijven. Ik heb deze handelingen makkelijker gemaakt door deze met knoppen te doen in plaats van swipe beweigingen.

Test Plan

Doel

Het doel van deze test is om de functionaliteiten en de handelingen van de afbeelding cropper te controleren zodat het duidelijk word wat goed gaat en wat verbeterd kan worden.

De Taak voor deze test:

Upload & Bewerk je profielfoto en sla deze op wanneer je tevreden bent met het resultaat.

Gewenste handelingen voor deze test:

  • Upload een afbeelding
  • Afbeelding Inzoomen
  • Afbeelding Draaien
  • Afbeelding Bijsnijden
  • Afbeelding Opslaan & Downloaden.

Results

Het was duidelijk waar Eric zijn profiel foto moest aanpassen, omdat de test op mijn apparaat is uitgevoerd heb ik een afbeelding voor eric gekozen zodat hij deze kan bewerken. Tijdens het bewerken van de afbeelding heeft Eric aangegeven dat niet alle knoppen even duidelijk zijn. Wel vind eric het fijn er knoppen aanwezig zijn in plaats van alleen swipe bewegingen zoals in de meeste apps. Eric geeft aan dat de knoppen iets groter mogen en dat hij het wel prettig zou vinden als er een label bij de knoppen word toegevoegt over de werking, in plaats van alleen een icoon van de handeling. Tijdens het bespreken van de test geeft Eric ook aan bepaalde knoppen te willen groeperen, zoals draaien/flippen, en croppen/bewegen. Eric vind het fijn dat er knoppen aanwezig zijn op een klein scherm.

Wensen

  • Knoppen Groter
  • Uitleg Knoppen
  • Handelingen groeperen
    • Draaien & Flippen
    • Croppen & Bewegen
  • Undo/Redo