WIN wk12 / H7 / User interface

User interface
Programmeren basis-II
Hoofdstuk 7 / Week 12
1 / 29
suivant
Slide 1: Diapositive
ICTMBOStudiejaar 1

Cette leçon contient 29 diapositives, avec diapositives de texte et 1 vidéo.

time-iconLa durée de la leçon est: 120 min

Éléments de cette leçon

User interface
Programmeren basis-II
Hoofdstuk 7 / Week 12

Slide 1 - Diapositive

Cet élément n'a pas d'instructions

Deze week
  • Terugblik weekcheck 'douane data'

  • Hoofdstuk 7: 
  • Een echt gebruiksvriendelijk programma maken (UI / UX)

Slide 2 - Diapositive

Cet élément n'a pas d'instructions

Deze week
  • Terugblik weekcheck 'douane data'

  • Hoofdstuk 7: 
  • Een echt gebruiksvriendelijk programma maken

  • Tip: dit heb je 1-op-1 nodig bij PRA. Wat je bij A3 moet doen, leer je bij Native. Je moet wel zélf de puzzelstukjes (patronen) toepassen om een werkend programma te krijgen.

Slide 3 - Diapositive

Cet élément n'a pas d'instructions

Terugblik weekcheck

Slide 4 - Diapositive

Linkse voorbeeld: werkt, maar is inefficient. Drie keer je hele lijst door. Duurt lang als je duizenden items in lijst hebt!

Rechtse voorbeeld: mooi gebruik beschrijvende variabele-namen. Daardoor erg goed leesbaar.
Opdracht: bekijk programma en antwoord
  1. Wat gebeurt er precies op r1?
  2. Wat zou gebeuren als je r9/10 weghaalt?
  3. Wat doet r15 precies?
  4. Voor welke dieren wordt r17 uitgevoerd?
  5. Wat is het datatype van 'averageValue'
  6. Bereken je gemiddelde waarde van álle dieren of alleen van het ingevulde land?
  7. Welke regels vormen samen het patroon om een CSV te openen + omzetten naar list-of-dicts?





Klaar?
Neem het programma over in een nieuwe file in VS code, en test uit of je vragen 1 en 2 goed had. Je moet het programma meerdere keren uitvoeren hiervoor.
timer
10:00
Stilte, werk voor jezelf
Overleg met buur is ok
Werk in groepjes
Klik en zoom

Slide 5 - Diapositive

Vragen laten beantwoorden in textdocumentje en daarna "cold call" vragen in de klas.
Tip: patronen in het boekje
Ook deze week gaan we programma's maken die een CSV inlezen. Je hoeft dat (nog) niet uit je hoofd te kunnen.

Als je een opdracht krijgt, moet je simpelweg de juiste patronen bij elkaar zoeken en toepassen (!= kopiëren).

Patronen over CSV staan in H6, en zie ook de index.

Slide 6 - Diapositive

Patroon toepassen is wat anders dan rücksichtslos kopiëren.

"Kopiëren-plakken-nadenken"
We gaan steeds complexere programma's maken. Het moet voor de gebruiker prettig blijven werken!

Slide 7 - Diapositive

Cet élément n'a pas d'instructions

We gaan steeds complexere programma's maken. Het moet voor de gebruiker prettig blijven werken!


UI: User Interface
Hoe het programma eruit ziet.
Wat voor input je kunt geven.
Dat je output overzichtelijk is.

Slide 8 - Diapositive

Cet élément n'a pas d'instructions

We gaan steeds complexere programma's maken. Het moet voor de gebruiker prettig blijven werken!


UI: User Interface
Hoe het programma eruit ziet.
Wat voor input je kunt geven.
Dat je output overzichtelijk is.





UX: User eXperience
De ervaring, dat het programma  je gebruiker niet frusteert.
Nette foutmeldingen.

Slide 9 - Diapositive

Cet élément n'a pas d'instructions

4

Slide 10 - Vidéo

Voorbeeld van de weekcheck, om te laten zien waar we naartoe werken qua UI / UX.

Slide 11 - Diapositive

Demo: de docent doet voor hoe je een keuzemenu opstelt.
00:09
  • Eerste bericht is uit beeld verdwenen, focus op de input

Slide 12 - Diapositive

Cet élément n'a pas d'instructions

01:13
  • Heldere foutmelding voor gebruiker

Slide 13 - Diapositive

Cet élément n'a pas d'instructions

00:03
  • Terminal-commando's zijn niet meer in beeld
  • Mooi welkomstbericht

Slide 14 - Diapositive

Cet élément n'a pas d'instructions

00:30
  • Duidelijke vraag, verder niets in beeld

Slide 15 - Diapositive

Cet élément n'a pas d'instructions

Aan de slag

Lees + maak paragraaf 2 t/m 4.

Eérst zelf proberen, als het echt niet lukt even spieken.

Zie bladzijde 49 van
moduleboekje





Klaar? Verder lezen + maken vanaf paragraaf 5.

Als de timer afloopt: opdracht 4 is klaar, klassikaal bespreken.
timer
20:00
Stilte, werk voor jezelf
Overleg met buur is ok
Werk in groepjes

Slide 16 - Diapositive

Docent; dia's hierna zijn vragen over de opdracht. Dat is de manier van bespreken.

Slide 17 - Diapositive

Demo: de docent doet voor hoe je het 'cls'-commando gebruikt.
cls - Clear Screen

Slide 18 - Diapositive

Cet élément n'a pas d'instructions

Aan de slag

Lees + maak paragraaf 5 t/m 7.

Groen = lezen
Blauw = maken

Zie bladzijde 51 van
moduleboekje





Klaar? Verder lezen + maken vanaf paragraaf 8.

Als de timer afloopt: opdracht 7 is klaar, klassikaal bespreken.
timer
20:00
Stilte, werk voor jezelf
Overleg met buur is ok
Werk in groepjes

Slide 19 - Diapositive

Docent; dia's hierna zijn vragen over de opdracht. Dat is de manier van bespreken.

Slide 20 - Diapositive

Cet élément n'a pas d'instructions

Slide 21 - Diapositive

Cet élément n'a pas d'instructions

Slide 22 - Diapositive

Cet élément n'a pas d'instructions

Slide 23 - Diapositive

Cet élément n'a pas d'instructions

Slide 24 - Diapositive

Cet élément n'a pas d'instructions

Slide 25 - Diapositive

Cet élément n'a pas d'instructions

Slide 26 - Diapositive

Cet élément n'a pas d'instructions

Slide 27 - Diapositive

Cet élément n'a pas d'instructions

Aan de slag


  1. Lees + maak H7, par. 8 t/m 11.
  2. Daarna de weekcheck.
  3. PRA A3





Klaar?
  • Bonusopdracht ✔ weekcheck
  • Herhalingsopdrachten H7
  • Herhalingsopdrachten H1 t/m 6
  • Huiswerk ander vak
Stilte, werk voor jezelf
Overleg met buur is ok
Werk in groepjes

Slide 28 - Diapositive

Cet élément n'a pas d'instructions

Aan de slag

  1. Lees + maak H8, par 3 t/m 7
  2. Zorg dat alle weekchecks t/m hoofdstuk 7 zijn voldaan (veel moeten nog dingen verbeteren!)
  3. Werk aan PRA A3 + stel vragen

Ik vond het makkelijk: bonusopdr.
Ik vind het lastiger: herhalingsopd.
+ opdrachten in H6 en H7




(weekcheck H8 bewaren we voor volgende week)

Echt helemaal klaar?
  1. Bedenk-een-vraag
  2. HW ander vak (taal, rekenen, keuzedeel, etc.)
Stilte, werk voor jezelf
Overleg met buur is ok
Werk in groepjes
Volgende week doen we een eindjaarsquiz tussen alle klassen. Bedenk een leuke quizvraag en je hebt meteen een streepje voor, want die vraag heb je sowieso goed! Het moet een meerkeuzevraag zijn. De categorieën zijn:
  • Inhoudelijk: WIN
  • Inhoudelijk: WEB
  • ICT-nieuws uit 2021
  • Ken-je-docenten

Slide 29 - Diapositive

Cet élément n'a pas d'instructions