LogoLogo
  • 👋Welkom!
  • Introductie
    • Over MediaMonks
    • Aanleiding
    • Focus
    • Design challenge en deelvragen
  • Onderzoek
    • Vooronderzoek
      • Interview
      • Huidige tools
    • Het probleem
    • Stakeholders
    • Gebruikersonderzoek
      • Survey
      • Interviews
        • Interview monks met weinig problemen
        • Interview monks met problemen
    • Personas
    • User journey
    • User story
  • Ideegeneratie
    • Design principes
    • Design pattern search
      • Layout
      • Geavanceerd zoeken
      • Wow factor
    • Comparison chart
    • Best, good and bad practices
      • Best practices
      • Good practices
      • Bad practices
  • Conceptontwikkeling
    • Conceptualisatie
      • Crazy 8-ish
      • Peer review
      • Expert interview
      • Inspiratie
    • Programma van wensen
    • Concepten
      • Harris profile
    • Concept MMHUB 1.0
    • Style moodboard
      • MM huisstijl
      • MM concept huisstijl
      • MM Shift website
  • Prototyping
    • Concept bespreking
      • Tweede zoekfunctie
    • Peer review
    • Concept MMHUB 2.0
    • Use cases
      • Struikelpunten interview
    • Wireframe versies
      • v1 Lo-fi
      • v2 Lo-fi
      • v3 Hi-fi
      • v4 MMHUB 2.0 Lo-fi
      • v5 Hi-fi
      • v6 Hi-fi
      • v7 Hi-fi
      • Eindversie
    • Userflow
    • Prototype versies
      • v1
      • v2
      • v3
      • Eindversie
    • Iteraties
  • Testen
    • Initiële test MMHUB 2.0
      • Notities
      • Resultaten
      • Conclusies
    • 'A/B test' filter feature
      • Resultaten
      • Conclusies
    • Validatie test
      • Notities
      • Resultaten
      • Conclusies
  • MMHUB
    • Functies
    • Design keuzes
      • Per scherm
    • Management
  • Afronden
    • Vervolgstappen
    • Conclusie
      • Beantwoordde deelvragen
  • Opleveringen
    • CMD opleveringen
      • Afstudeervaardigheden
      • Project voorstel
      • Design Brief
      • Feedback Frenzy
      • Groenlicht materiaal
      • Product biografie
      • Design rationale
      • Reflectie verslag
      • Product video
      • Product
  • Overig
  • 📖Bibliografie
  • 📋Woordenlijst
  • 🗓️Planning
Powered by GitBook
On this page
  • Begin scherm
  • Resultaten scherm
  • Monk details
  • Project details
  • Departement details
  • Cliënt details
  • Kantoor details

Was this helpful?

Export as PDF
  1. Prototyping

Iteraties

14 oktober

PreviousEindversieNextInitiële test MMHUB 2.0

Last updated 4 years ago

Was this helpful?

Hier laat ik in een overzicht zien wat ik sinds de eerste hi-fi versie en de eindversie heb veranderd. Door de schermen naast elkaar te zetten worden de verschillen duidelijk uitgelicht, door middel van nummers leg ik uit wat er is veranderd.

Begin scherm

Nummer

Eerste hi-fi

Eind versie

1 - MMHUB

Te prominent in het scherm.

Het is minder opvallend maar toch aanwezig om het te herkennen.

2 - Slogan

De slogan is niet heel erg passend, meer een placeholder.

De slogan definieert de doel van de tool.

3 - Zoekbalk

Eerst klikken op de zoekbalk om naar de zoekpagina te gaan om daarna te kunnen typen.

Automatisch typen zorgt ervoor om naar de zoekpagina te gaan.

4 - Wereldbol

De wereldbol is plat en saai.

3D-achtige wereldbol dat beter bij de stijl past en een beter idee dat het echt een interactieve 3D wereldbol wordt als je erop klikt om de locaties van de kantoren te bekijken.

Resultaten scherm

Nummer

Eerste hi-fi

Eind versie

1 - Terug knop

Onduidelijk dat de terug knop het kruisje is of "MMHUB".

Duidelijke terug knop die consistent op dezelfde plek zit in het zoekgedeelte.

2 - Wereldbol

Laat de locaties van monks en kantoren zien.

Verwijderd omdat departementen, cliënten en projecten geen locatie hebben en om de ruimte nuttiger te gebruiken.

3 - Categorieën

Horizontaal scrollbaar, kleine kleur highlight om de categorieën aan te geven, verder wordt daar nog niks mee gedaan.

Kleur meer prominent en komt terug in de items.

4 - Resultaten items

Overal een afbeelding bij en gebruik van verschillende vormen. Hierdoor is het niet duidelijk welk item wat is.

Niet elk item heeft een afbeelding beschikbaar, alleen monks een afbeelding. De opstelling is hetzelfde voor elk item voor meer consistentie. Er staat met de categorie kleur erbij wat het item is.

Monk details

Nummer

Eerste hi-fi

Eind versie

1 - Terug knop

Links boven, hiervoor moet de hele witte balk altijd in beeld zijn.

Consistent aan de linkerkant, nu hoeft alleen het icoon mee te scrollen.

2 - Naar begin scherm

Wanneer er op MMHUB geklikt wordt, gaat de gebruiker helemaal terug naar het beginscherm.

Als je op het kruimelpad op "Find" klikt ga je terug naar de resultatenscherm, vanuit daar kun je naar de begin pagina gaan zodat je niet per ongeluk je zoekopdracht verliest.

3 - Informatie

De lettertypes zijn erg groot, de gebruiker ziet niet goed dat de departement en locatie navigeren naar andere pagina's.

Voor elk gedeelte waar je navigeert naar een andere pagina, consistent de categorie kleur als een knop aangegeven.

4 - Shortcuts

Herkenbare iconen met de tekst ernaast, neemt veel ruimte in.

Alleen de herkenbare iconen gebruikt, zo hoeft het minder ruimte in te nemen. De knoppen staan nu op elke pagina op dezelfde plek.

5 - Projecten lijst

Wanneer er lange titels erin stonden was er weinig ruimte tussen de 5 items. Ook de foto nam veel ruimte in terwijl deze niet beschikbaar is.

Geen foto meer en maar 4 items naast elkaar. Gebruik maken van alfabetische indicatoren voor navigatie. De naam van de cliënt staat erboven zodat hier ook op gezocht kan worden.

Project details

Nummer

Eerste hi-fi

Eindversie

1 - Tweede keer zoeken

Door te klikken op de kantoren en departementen worden de monks gefilterd, hierdoor kon de gebruiker niet genavigeerd worden naar een kantoor of departement.

Door middel van de zoekbalk met tags, kunnen gebruikers typen om te filteren en op de items klikken om te navigeren naar de detailpagina.

2 - Departementen

Als er te veel items waren komen ze in een dropdown.

Door middel van een lijst waarin gescrolld kan worden is het makkelijker wanneer er heel veel inhoud in die lijst zit.

3 - Monks

De foto is het grootste gedeelte van de item. Hierdoor zijn de naam, locatie en departement niet heel opvallend

De foto is minder groot in beeld, de naam is nu hoger in de hiërarchie met kleuren kan de gebruiker de locatie en departement herkennen.

Departement details

Nummer

Eerste Hi-fi

Eindversie

1 - Informatie

De informatie staat in een zwart blok waardoor het de ruimte limiteert.

Nu ik weet dat een departement veel leads kan hebben, geef ik de informatie, met name de namen van de leads, veel ruimte.

2 - Tweede keer zoeken

Ook als de gebruiker hier op de kantoren klikt worden de monks gefilterd.

Door de zoekbalk krijgt de gebruiker suggesties voor namen en kantoren wanneer er getypt wordt. Door het aan te klikken van de tag wordt er gefilterd.

Cliënt details

Nummer

Eerste hi-fi

Eindversie

1 - Informatie

Naast de naam en een korte omschrijving over de cliënt, had ik hier ook een foto toegevoegd voor herkenning.

De foto is weg vanwege dit niet beschikbaar is, voor nu.

2 - Shortcut website

In deze versie is deze optie aanwezig.

Voor de cliënten die een website hebben is deze knop, zo kunnen gebruikers snel naar hun website voor inspiratie of meer over de cliënt te weten komen.

3 - Projecten per monk

In deze versie is deze optie aanwezig.

Deze feature is ontworpen om snel een ervaren monk te vinden voor deze cliënt. De gebruiker kan zien wie de meeste projecten heeft en kan ook filteren op departement.

Kantoor details

Nummer

Eerste hi-fi

Eindversie

1 - Informatie

De afbeelding gebruikte ik als banner, en de rest heeft ook erg veel ruimte op de pagina.

De informatie heeft nu de ruimte wat beter benut.

2 - Zoeken

In deze versie is deze optie aanwezig.

De gebruiker kan in de lijst met monks zoeken op voor- en achternaam. In de lijst met projecten op titel of cliënt.

Afbeelding 1 - Vergelijking begin schermen
Afbeelding 2 - Vergelijking resultaten schermen
Afbeelding 3 - Vergelijking monk details schermen
Afbeelding 4 - Vergelijking project details schermen
Afbeelding 5 - Vergelijking departement details schermen
Afbeelding 6 - Vergelijking cliënt details schermen
Afbeelding 7 - Vergelijking kantoor details schermen