Skip to content

Commit

Permalink
Update INSTRUCTIONS.md
Browse files Browse the repository at this point in the history
  • Loading branch information
KoopReynders authored Aug 30, 2024
1 parent ee69083 commit 4542775
Showing 1 changed file with 0 additions and 103 deletions.
103 changes: 0 additions & 103 deletions docs/INSTRUCTIONS.md
Original file line number Diff line number Diff line change
Expand Up @@ -47,109 +47,6 @@ Deze leertaak wordt behandeld in de eerste week van sprint 1 met verschillende w







## Visuele hiërarchie en Breakdown schets (Woensdag)

<!-- Uitleg opdracht, aanpak per fases van de DLC en bronnen. -->

Dit gaat over de ontwerpfase:

1. Hiërarchie bepalen
Pak je (laatste) ontwerpschets en vraag jezelf eens af: “Wat moeten mensen als eerste zien?” Omcirkel de belangrijkste informatie, belangrijke details en achtergrondinformatie.
2. Variaties schetsen
Schets minimaal 8 verschillende versies waarin je visuele hiêrarchie aanbrengt door middle van grootte, positie op het scherm, witruimte en kleur/contrast.
3. Feedback
Bespreek al je schetsen in groepjes van 3. Leg bij elke schets uit hoe je visuele hiërarchie hebt toegepast. Geef elkaar tips en tops en schrijf dit op.
4. Nieuwe versie schetsen
Schets een nieuwe versie van je visitekaartje en maak een breakdown



[Joshua Porter](http://bokardo.com/principles-of-user-interface-design/) schrijft in zijn artikel over _principles of user interface design_:
> A strong visual hierarchy is achieved when there is a clear viewing order to the visual elements on a screen. Most people don't notice visual hierarchy but it is one of the easiest ways to strengthen (or weaken) a design
Visuele hiërarchie is belangrijk in webdesign. Het vertelt mensen waar ze moeten kijken en welke dingen op het scherm het belangrijkst zijn.
Visuele hiërarchie kun je op verschillende manieren bereiken, zoals grootte van tekst of elementen, kleur gebruik en contrast, witruime en positie van elementen op het scherm.

Herontwerp je visitekaartje waarbij je goed rekening houdt met de visuele hiërarchie. Je leert wat visuele hiërarchie is en hoe je het kan toepassen in web design.

### Ontwerpen
In de ontwerpfase neem je ontwerpbeslissingen en zorg je dat je precies weet wat je moet gaan bouwen.

#### Aanpak schetsen

Visuele hiërarchie schetsen

1. Hiërarchie bepalen -
Pak je (laatste) ontwerpschets en omcirkel de belangrijkste informatie, belangrijke details en achtergrondinformatie (wat moeten mensen als eerste zien?)

2. Variaties schetsen -
Schets minimaal 8 verschillende versies waarin je door middel van grootte, kleur/contrast, witruimte en/of positie van de informatie visuele hiêrarchie aanbrengt.

3. Feedback -
Bespreek al je schetsen in groepjes van 3. Leg bij elke schets uit hoe je visuele hiërarchie hebt toegepast. Geef elkaar tips en tops en schrijf dit op.

4. Uitwerken -
Schets een nieuwe definitieve versie van je visitekaartje. Schrijf op wat de belangrijkste informatie, belangrijke details en achtergrondinformatie is en hoe je visuele hierarchie hebt toegepast.

#### Materiaal ontwerpfase

- [Design Principles: Dominance, Focal Points And Hierarchy](https://www.smashingmagazine.com/2015/02/design-principles-dominance-focal-points-hierarchy/)
- [Communicating a Message Through Visual Hierarchy](https://designmodo.com/visual-hierarchy/)
- [Visual Hierarchy: How Well Does Your Design Communicate?](http://vanseodesign.com/web-design/visual-hierarchy/)
- [Korte video over layout en compositie @ YouTube](https://www.youtube.com/watch?v=a5KYlHNKQB8)

#### Breakdown Schets

Introduction HTML: https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML
https://developer.mozilla.org/en-US/docs/Web/HTML

- [HTML semantics @ YouTube](https://www.youtube.com/watch?v=bOUhq46fd5g)



Deze opdracht is done als:

- [ ] Je schetsen staan in de wiki van je visistekaartje-repository, per schets is beschreven hoe de visuele hierarchie is toegepast
- [ ] Breakdown gemaakt met HTML





## Javascript en Interactie (Donderdag)

Uitleg opdracht, aanpak per fases van de DLC en bronnen.

Dit gaat over de Bouwfase en testen(?):

Iets met javascript doen

en een mini PE introductie





## Code/Design Review visitekaartje (Vrijdag)

Uitleg opdracht, aanpak per fases van de DLC en bronnen.

Dit gaat over de testfase:

Waarop checken?

Hoe schrijf je een issue

Wat doe je hiermee?





## Definition of Done

Deze opdracht is done als:
Expand Down

0 comments on commit 4542775

Please sign in to comment.