Digitalt design: web, app, UX, programmering

Teknikfag A · HTX · A-niveau · Specifik teknologi

⚙️ Digitalt design og udvikling (Teknikfag A)

Dette teknikfag fokuserer på digitale produkter — apps, websites, software.

Web-udvikling

• HTML: struktur (overskrifter, paragraffer, billeder)
• CSS: design (farver, layout, fonte)
• JavaScript: interaktivitet (klik, animationer, data)
• Frameworks: React, Vue, Next.js (forenkler udvikling)

App-udvikling

• Native: Swift (iOS), Kotlin (Android) — fuld adgang til telefon
• Cross-platform: React Native, Flutter (én kodebase til både iOS og Android)
• Progressive Web Apps: web der virker som app

UX (User Experience)

• Wireframes: lo-fi tegninger af layout
• Mockups: hi-fi designs (Figma, Sketch)
• Prototypes: interaktive (Figma kan klikkes igennem)
• Usability testing: 5 brugere tester → finder 80% af problemerne

Designprincipper (Nielsen's 10 heuristics)

1. Vis system-status (loading-indikator)

2. Tal brugerens sprog (ikke jargon)

3. Lad brugeren kontrollere (fortryd-knap)

4. Konsistens

5. Forhindre fejl

6. Genkendelse over hukommelse

7. Fleksibilitet (shortcuts)

8. Minimalistisk design

9. Hjælp brugere med fejl

10. Hjælp og dokumentation

Programmering — populære sprog

• Python: data, AI, automation
• JavaScript: web, full-stack
• Swift: iOS
• Kotlin: Android
• C#: spil (Unity)
• Rust: systemer, performance

Versionsstyring

• Git: standard for kodeversioner
• GitHub/GitLab: cloud-baseret samarbejde
• Branches: arbejd parallelt uden konflikter

DevOps

• CI/CD: automatisk test + deployment
• Cloud: AWS, Google Cloud, Azure

Læringsmål

• Forstå forskel mellem native og cross-platform app-udvikling
• Lave en simpel website med HTML+CSS+JS
• Anvende Nielsen's usability-heuristics på et produkt
• Bruge Git til version-styring

Sådan kan du arbejde med emnet

• Lav en simpel skitse til en app eller hjemmeside, der løser et selvvalgt problem
• Forklar hvad UX betyder, og hvorfor det er vigtigt i digitalt design
• Skriv pseudokode for en funktion, der er central for din app eller hjemmeside

Træningsforslag

• Lav en personlig hjemmeside og deploy på GitHub Pages
• Tag Codecademy's Web Development kursus
• Lav prototype i Figma og test med 5 brugere