WIN wk12 / H7 / User interface

User interface
Programmeren basis-II
Hoofdstuk 7 / Week 12
1 / 28
volgende
Slide 1: Tekstslide
ICTMBOStudiejaar 1

In deze les zitten 28 slides, met tekstslides en 1 video.

time-iconLesduur is: 120 min

Onderdelen in deze les

User interface
Programmeren basis-II
Hoofdstuk 7 / Week 12

Slide 1 - Tekstslide

Deze slide heeft geen instructies

Deze week
  • Terugblik weekcheck 'douane data'

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

Slide 2 - Tekstslide

Deze slide heeft geen instructies

Deze week
  • Terugblik weekcheck 'douane data'

  • Hoofdstuk 7: 
  • Een echt gebruiksvriendelijk programma maken

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

Slide 3 - Tekstslide

Deze slide heeft geen instructies

Terugblik weekcheck

Slide 4 - Tekstslide

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 - Tekstslide

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 - Tekstslide

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 - Tekstslide

Deze slide heeft geen instructies

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 - Tekstslide

Deze slide heeft geen instructies

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 - Tekstslide

Deze slide heeft geen instructies

4

Slide 10 - Video

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

Demo: de docent doet voor hoe je een keuzemenu opstelt.

Slide 11 - Tekstslide

Deze slide heeft geen instructies

00:09
  • Eerste bericht is uit beeld verdwenen, focus op de input

Slide 12 - Tekstslide

Deze slide heeft geen instructies

01:13
  • Heldere foutmelding voor gebruiker

Slide 13 - Tekstslide

Deze slide heeft geen instructies

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

Slide 14 - Tekstslide

Deze slide heeft geen instructies

00:30
  • Duidelijke vraag, verder niets in beeld

Slide 15 - Tekstslide

Deze slide heeft geen instructies

Aan de slag

Lees + maak paragraaf 2 t/m 7.

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

Zie bladzijde 47 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 - Tekstslide

Docent; dia's hierna zijn vragen over de opdracht. Dat is de manier van bespreken.
Demo: de docent doet voor hoe je het 'cls'-commando gebruikt.

Slide 17 - Tekstslide

Deze slide heeft geen instructies

Aan de slag

Lees + maak paragraaf 5 t/m 7.

Groen = lezen
Blauw = maken

Zie bladzijde 49 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 18 - Tekstslide

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

Slide 19 - Tekstslide

Deze slide heeft geen instructies

Slide 20 - Tekstslide

Deze slide heeft geen instructies

Slide 21 - Tekstslide

Deze slide heeft geen instructies

Slide 22 - Tekstslide

Deze slide heeft geen instructies

Slide 23 - Tekstslide

Deze slide heeft geen instructies

Slide 24 - Tekstslide

Deze slide heeft geen instructies

Slide 25 - Tekstslide

Deze slide heeft geen instructies

Slide 26 - Tekstslide

Deze slide heeft geen instructies

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 27 - Tekstslide

Deze slide heeft geen instructies

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 28 - Tekstslide

Deze slide heeft geen instructies