User Interface

De user interface (UI) is een grafisch vormgegeven scherm waarmee gebruikers en apparaten met elkaar kunnen communiceren. Een user interface heeft twee doelen: de gebruiker in staat stellen het apparaat te bedienen en het systeem de mogelijkheid geven om informatie te presenteren aan de gebruiker.

Het 'apparaat' kan een fysiek apparaat of een machine zijn, maar ook een computerprogramma of bestursingssysteem, een app of een website.

Introductie opdracht User Interface

Beschrijf 3 User Interfaces die je dagelijks gebruikt.

- Waar gebruik jij het voor?

-Benoem de functionaliteiten van de interface 

-Beschrijf waarom je het gebruikt en of je het fijn vindt werken

> Gebruik drie screenshots of foto's om je tekst te illustreren

Plaats de tekst en afbeeldingen op je blog

Les 2

In de tweede les gaan we verder in op de geschiedenis en de verschillende grafische elementen die je veel terug ziet komen in een User Interface. Download en bekijk onderstaand bestand voor meer informatie over User Interfaces of als je de klassikale les gemist hebt. Je kunt ook onderstaand filmpje bekijken voor meer informatie.

Opdracht 2

Zoek samen met een klasgenoot (in duo's) een User Interface waarin ten minste twee verschillende vormen van elke soort grafische elementen voorkomt.​

​Input Controls, Navigatie en Informatie​

  • Maak een screenshot van deze User Interface en wijs met behulp van Paint, Photoshop of Illustrator aan waar je welke elementen in de User Interface kunt terugvinden. ​

  • Zet er een cirkel omheen of pijl bij in de kleur die bij het soort element hoort.​

  • Zet de bewerkte screenshot, dus met jouw pijlen of cirkels, op je blog.​

  • Benoem elk omcirkeld element (in totaal ten minste zes verschillende elementen) en beschrijf waar dit element voor dient en wat er gebeurt als je het gebruikt.

Les 3

Je gaat deze les zelf een User Interface tekenen. 

Opdracht 3

Je krijgt van de docent een formulier met daarop de afbeelding van een smartphone waarop niets te zien is op het scherm. Je gaat zelf in het scherm een gebruikersomgeving tekenen waardoor je kunt bellen. Download de opdracht hieronder voor het formulier.  

Opdracht: Teken een User Interface op het scherm die het mogelijk maakt om te kunnen bellen.

Belangrijk!

Bedenk eerst welke knoppen en functies je hiervoor nodig hebt en schrijf deze op. Hoe zien deze knoppen eruit? Welke kleur hebben ze? Hoe groot zijn ze afgebeeld?


Les 4

Als je Opdracht 3 getekend hebt verwerk je deze op de computer. Je gebruikt hiervoor het online programma  www.mockflow.com. Hieronder kun je een handleiding downloaden voor dit programma.

De digitale versie van jouw telefoon User Interface plaats je op jouw blog.

Download hieronder de MockFlow Tutorial!

Eindopdracht User Interface

Als eindopdracht voor IT 13 User Interface ga je jouw eigen User Interface ontwerpen. Je werkt hiervoor samen in duo's. 

De user interface maak je in Mockflow. Dat is een online programma. Je kunt hierboven de tutorial downloaden. Je maakt uiteindelijk drie pagina's die via links aan elkaar verbonden zijn. Hoe meer je zelf tekent en ontwerpt (bijvoorbeeld in photoshop, illustrator of paint) hoe beter het cijfer. 

Zorg dat je een publieke link op jouw blog plaatst! Hoe je dit moet doen staat in de tutorial.

Je hebt 4 weken de tijd voor deze Eindopdracht. Al de resultaten lever je zelf in op je eigen website. Aan het einde schrijf je ook een reflectie op jouw werk. 

De eindopdracht en het invulformulier kun je hieronder downloaden. Succes! 

Beoordeling User Interface

In de laatste les gaan jullie elkaar beoordelen. Download de Beoordelingsmatrix hieronder en open deze in Excel. Je vult deze in voor een ander groepje. Schrijf dat duidelijk in de linker bovenhoek. 
Excel rekent automatisch het cijfer uit. 

Sla het Excel bestand op, geef het bestand de namen van het groepje dat je beoordeelt. Zet het bestand op jouw blog, en mail het naar de docent.