fix: add lesson files
This commit is contained in:
115
Samenvattingen/Les05-Samenvatting.md
Normal file
115
Samenvattingen/Les05-Samenvatting.md
Normal file
@@ -0,0 +1,115 @@
|
||||
# Les 5: AI voor Content en Asset Generation
|
||||
|
||||
## Hoofdstuk
|
||||
**Hoofdstuk 2: Intermediate** (Les 4-9)
|
||||
|
||||
## Beschrijving
|
||||
AI-gegenereerde visuals en assets voor professionele webprojecten.
|
||||
|
||||
---
|
||||
|
||||
## Te Behandelen
|
||||
|
||||
### Image Generation Tools Vergelijking
|
||||
- DALL-E 3 (via ChatGPT Plus)
|
||||
- Leonardo.ai
|
||||
- Ideogram
|
||||
- Midjourney alternatives
|
||||
|
||||
### Prompt Engineering voor Images
|
||||
- Style descriptors
|
||||
- Mood en colors
|
||||
- Composition
|
||||
- Aspect ratios
|
||||
- Negative prompts
|
||||
|
||||
### Asset Generation Workflow voor Web
|
||||
- Hero images
|
||||
- Icons
|
||||
- Illustrations
|
||||
- Backgrounds
|
||||
|
||||
### Image Optimization voor Web
|
||||
- Compression
|
||||
- Formats (WebP, AVIF, etc.)
|
||||
- Responsive images
|
||||
|
||||
### Copyright & Licenties
|
||||
- Copyright overwegingen bij AI-generated content
|
||||
- Wat mag wel/niet
|
||||
|
||||
### Integratie in Next.js
|
||||
- Next.js Image component optimalisatie
|
||||
- Best practices
|
||||
|
||||
---
|
||||
|
||||
## Tools
|
||||
- DALL-E 3 (ChatGPT Plus)
|
||||
- Leonardo.ai
|
||||
- Ideogram
|
||||
- Next.js Image component
|
||||
|
||||
---
|
||||
|
||||
## Lesopdracht (2 uur)
|
||||
|
||||
### Complete Visual Identity Challenge
|
||||
|
||||
**Kies thema voor fictieve SaaS landing page:**
|
||||
- Project management
|
||||
- Fitness app
|
||||
- Educational platform
|
||||
- Of eigen keuze
|
||||
|
||||
**Genereer complete asset set:**
|
||||
|
||||
| Asset | Specificaties |
|
||||
|-------|---------------|
|
||||
| Hero image | 16:9 landscape |
|
||||
| Feature icons | 6 stuks, consistent style, SVG-ready |
|
||||
| Custom illustraties | 2 stuks voor sections |
|
||||
| Background pattern | Seamless texture |
|
||||
| Favicon | Multiple sizes |
|
||||
|
||||
**Vereisten:**
|
||||
- Alle assets visueel consistent (coherent color palette, matching style, professional look)
|
||||
- Geoptimaliseerd voor web (<200KB per image, correct formats)
|
||||
- Geïntegreerd in Next.js landing page met Tailwind CSS
|
||||
- Proper Image component usage
|
||||
|
||||
---
|
||||
|
||||
## Huiswerk (2 uur)
|
||||
|
||||
### Portfolio Project Visual Refresh
|
||||
|
||||
**Opdracht:**
|
||||
- Kies een bestaand project uit eerdere lessen (of bouw nieuw landing page project)
|
||||
- Vervang ALLE placeholder images met professioneel AI-gegenereerde assets
|
||||
- Doel: cohesieve visual identity die eruitziet als professional design work
|
||||
|
||||
**Case Study Blog Post (400 woorden):**
|
||||
|
||||
Schrijf over:
|
||||
- Prompts die werkten
|
||||
- Iteratie proces
|
||||
- Challenges encountered
|
||||
- AI vs stock photos/Unsplash comparison
|
||||
- Time saved estimate
|
||||
- Quality assessment
|
||||
- Zou je dit in productie gebruiken?
|
||||
- Tips voor anderen
|
||||
|
||||
**Include:** Before/after screenshots
|
||||
|
||||
---
|
||||
|
||||
## Leerdoelen
|
||||
Na deze les kan de student:
|
||||
- Verschillende image generation tools vergelijken
|
||||
- Effectieve prompts schrijven voor image generatie
|
||||
- Consistente visual assets genereren voor webprojecten
|
||||
- Images optimaliseren voor web performance
|
||||
- Copyright overwegingen bij AI-generated content begrijpen
|
||||
- Assets integreren in Next.js met proper optimization
|
||||
Reference in New Issue
Block a user