Wat zeg je allemaal lieverd?
Stel je voor: Je probeert je moeder uit te leggen wat je doet als designer (of developer), en na de derde zin zie je haar ogen al glazig worden. Dat is het moment dat je weet: ze snapt er helemaal niets van.
Welkom bij "Design voor je moeder," waar we de mysterieuze taal van designer en developers vertalen naar koffiepraat.
Hier geen 'gebruikersinterface-optimalisatie' of 'responsive design', maar gewoon, hoe je het aan je moeder zou uitleggen.
Dus pak een kopje koffie (of iets sterkers, afhankelijk van je laatste design-review), en duik met ons in de wereld van design en code, uitgelegd op een manier die zelfs je moeder zou boeien - en dat zegt wat!
#
80/20 Regel
80% van de uitkomsten kan verklaard worden door 20% van de oorzaken. Toepasbaar op vanalles (website functies, productiviteit, je garderobe)
A
A/B test
Onderzoekstechniek waarbij je meerdere varianten test met gebruikers. Bijvoorbeeld testen of variant A of Variant B beter werkt voor gebruikers.
Accessibility
Zie ‘Toegankelijkheid’
Acceptatieomgeving
Dit is net een generale repetitie, maar dan voor software. Hier test je de software in een omgeving die heel erg lijkt op de echte wereld, om te zien of alles goed werkt voordat het echt gebruikt gaat worden. Zie ook ‘Staging’ en ‘Testomgeving’.
AI
Kunstmatig intelligentie, maar niet zo intelligent als je hoopt. Zie ook 'ChatGPT'
Agile
Project klein houden.
Analytics
Statistieken van gebruikersgedrag op je website of App. Zie ook 'Google Analytics 4'.
Affordance
Werkt het zoals het er uit ziet dat het werkt?
After Action Report
Zie 'Retrospective'.
Archetype
Herkenbaar karakter-type voor je merk gebaseerd op karaktereigenschappen om mensen aan te spreken.
B
Backlog
Een technisch woord voor takenlijst voor je website.
Backend
De code en functionaliteiten achter een digitaal product
Branding
Zie 'Merkidentiteit'.
Briefing
Wat jij denkt wat je nodig hebt om een project goed aan te pakken. Zie ook 'Debrief'.
Breadcrumb
Ook broodkruimels genoemd, is een vorm van navigatie op je website die aangeeft waar je bent en hoe je er bent gekomen. Belangrijk voor SEO en gebruiksvriendelijkheid
Bug
Een bug is een fout op je website of app. Door een bug werkt je website niet zoals het moet. Er gaat iets mis.
C
Call To Action (CTA)
Een link of knop met overtuigende tekst zodat jij er op gaat klikken.
Case
Voorbeeld van eerder werk en samenwerkingen.
Checkout
Online kassa.
Cialdini
De goeroe op gebied van beïnvloedingsprincipes en hoe je mensen kan overtuigen. Hij heeft 7 principes: Sociale Bewijskracht, Autoriteit, Schaarste, Commitment & consistentie, Sympathie, Wederkerigheid en Eenheid.
CI/CD (Continuous Integration/Continuous Delivery)
Dit is een beetje zoals een lopende band in een fabriek, maar dan voor software. Elke keer als iemand iets aan de software verandert, controleert het systeem automatisch of alles nog werkt en brengt het de nieuwste versie uit.
ChatGPT
De digitale sidekick die je nooit wist dat je nodig had, maar nu niet meer zonder kunt - denk aan een kruising tussen Sjoerd (lees: een menselijke bibliotheek) en die ene vriend (Tom de tester) die altijd te veel weet bij trivia-avonden. (Geschreven door ChatGPT zelf 😉)
CMS
Content management system. Het systeem waar de inhoud van je website staat en waarin je tekst en plaatjes kunt aanpassen. Bijvoorbeeld Wordpress of Statamic
CMYK
De code voor printkleuren, niet te verwarren met RBG, en staat voor de kleuren Cyan (blauw), Magenta (een mix van rood en blauw), Yellow (geel) en Key.
Concept
Een goed idee.
Concept7
Het beste idee
Content
Inhoud, zoals tekst, afbeeldingen of video.
Conversie
Een actie die ertoe leidt dat de website bezoeker iets koopt of hun gegevens achterlaat (of wat voor een doel je ook maar gedefinieerd hebt).
Conversieratio
Het aantal mensen dat een actie heeft uitgevoerd op je website, gedeeld door het aantal totale bezoekers. Het liefst wil je dat dit percentage hoog is, en het kan altijd beter.
Copy
Copy is als de pindakaas op je broodje communicatie: het smeert alles lekker uit en zorgt ervoor dat de boodschap blijft plakken.
Copy
CRO
Conversion Rate Optimization. Aan allemaal knoppen draaien op je website totdat je conversie het hoogst is en je bezoekers zich beter aangesproken voelen.
Crawling
Het proces van zoekmachines waar kleine ‘bots’ of digitale spinnen je website scannen om te bepalen hoe relevant je website inhoud is.
CSS
Een document met code dat bepaalt hoe je website er uit ziet.
CTR
Click Through Rate, hoeveel mensen ergens op klikken gedeeld door het aantal mensen die het hebben gezien.
Customer Experience (CE)
De volledige ervaring van je klant met je product of dienst
Customer Journey
Wat je klanten allemaal doen in relatie tot je product en dienst in plaats van wat jij wilt dat ze doen. Ook wel Klantreis genoemd.
Customer Journey Mapping
Customer journey mapping is het maken van een route voor je klanten, zodat ze de snelweg naar tevredenheid kunnen nemen zonder verdwaald te raken in het doolhof van verwarring.
D
Debuggen
De developers gaan als detectives aan de slag: zoeken en oplossen van wat er fout is gegaan in de software of op een website.
Deliverable
Wat wij opleveren tijdens projecten
Design challenge
Zie 'ontwerpuitdaging'.
Design Review
Feedback krijgen en geven op het ontwerp om te checken of het goed ontworpen is of klopt volgens de eisen.
Design sprint
In een week een idee bedenken, uitwerken en testen.
Design thinking
Verdiepen, Praten en testen met je doelgroep voordat je iets maakt.
Debrief
Wat wij denken dat je nodig hebt.
DPI
Dots Per Inch, een eenheid van resolutie ivm afbeeldingen, zie ook 'PPI'.
E
E-commerce
Online winkelen en webshops.
Eye track
Een onderzoeksmethode om te kijken naar waar anderen naar kijken op een website.
Expert review
Je product laten beoordelen en analyseren door iemand die er verstand van heeft.
F
Feature Creep
Hoe langer een product of website bestaat, hoe meer functies er in sluipen
Figma
Het programma dat wij gebruiken om (visuele) ontwerpen te maken van je website en app
Feedback
Commentaar en terugkoppeling. Soms onderbouwd, soms niet.
Fold
De ‘vouw’: het eerst zichtbare stuk van je website of app. Kan voor elke gebruiker weer anders zijn en is daarom een beetje verouderde metafoor uit de krantenwereld.
Frontend
Uitwerking van het visuele ontwerp in code.
Font
Een specifieke stijl van een lettertype. Mag je ook prima door elkaar gebruiken, wij worden echt niet boos.
Footer
De onderkant van je website met tekst en linkjes naar verschillende pagina’s.
Functionaliteit
Een functionaliteit zegt iets over hoe je een website of digitaal product kan gebruiken. Bijvoorbeeld een specifiek taak of actie zoals: Contactinformatie opzoeken.
Funnel
Engels voor 'trechter'. Dat ding wat je ook wel in de keuken gebruikt voor bijvoorbeeld water. Die heb je ook voor website, alleen gooi je daar bezoekers in zodat zij gaan converteren (zie 'Conversie').
G
Grafisch ontwerp
Zie 'Visual Design'. Niet te verwarren met Grafisch design of DTP (drukwerk).
Gebruiker
Persoon die zich altijd net wat anders gedraagt dan je denkt (:
Gebruikersonderzoek
Vragen aan je klanten of ze begrijpen wat je bedacht hebt en wat zij nodig hebben.
Gebruiksvriendelijkheid&
Hoe gemakkelijk een digitaal product gebruikt kan worden door de vermoedelijke gebruiker(s).
Gestalt
Psychologische principes over hoe je dingen ervaart.
Golden circle
Waarom bestaat je bedrijf? (Een oefening van Simon Sinek)
Google Analytics 4 (GA4)
De nieuwere versie van Google Analytics met een overzicht van statistieken over je website, bijvoorbeeld hoeveel gebruikers welke pagina’s hebben bekeken.
Google Tag Manager (GTM)
Een manier om verschillende tracking codes (zie 'Tracking (2)') op een plek te houden en doelen in te stellen voor je website die via Google Analytics worden bijgehouden.
Google Search Console
Een overzicht van hoe je website gevonden wordt in Google.
Gradient
Een kleurverloop tussen 2 of meer kleuren
Grid
Een raster dat helpt om elementen goed neer te zetten in een layout
H
Heatmap
Een kaart dat klikacties of bewegingen op een pagina weergeeft door kleuren, rood voor warm (veel kliks, veel beweging) en blauw voor koud (weinig kliks of weinig beweging).
Heuristieken
De gouden regels van Sjoerd Walinga voor hoe je een website goed kan ontwerpen.
Hobson + 1
Één keuze is geen keuze. Je voegt een extra optie toe naast de keuze / actie die er al is. De extra keuze is vaak minder belangrijk of interessant, zodat de bezoeker voor de eerste optie kiest.
Holacracy
Manier van aansturen van je bedrijf waar zelfsturing centraal staat. Soms liefdevol geïnterpreteerd als "Zoek het zelf maar uit"
Hotjar
Een programma om gebruikersonderzoek via je website uit te voeren
HTML
Afkorting van HyperText Markup Language. Technisch verhaal. De standaard opmaaktaal (of code) van het web. De taal die b.v. zegt wat een titel en een paragraaf is van een webpagina.
Human Centered Design (HCD)
Ontwerpen door eerst te kijken naar de behoeftes van de mensen die je product gaan gebruiken.
Huisstijl
De visuele richtlijnen van je merk.
Holacracy
Informatiearchitectuur
Indeling, labeling en ontsluiting van content en pagina’s op je website.
Innovatie
Nieuwe dingen bedenken, maken en testen.
Interactie-ontwerp
Een technische schets dat aangeeft hoe iets moet werken.
Iteratie
Nog een keer maar dan beter.
IXD
Zie 'Interactie-ontwerp'
K
Klant
Afnemer van onze producten of diensten. Werken we mee samen en luisteren we goed naar. Maar niet zo goed als naar je gebruikers.
Kanalen
Twitter / Linkedin / briefje bij de Albert Heijn.
Kick-off
Gezamenlijke start van een project. Dit doen we intern met het team en daarna met de klant.
Kerning
De r u i m t e tussen individuele letters in een woord.
KPI
Key Performance Indicator. Een meetbaar punt dat belangrijk is voor je bedrijf.
L
Label
De vragen in een formulier waarvan je wilt dat iemand die gaat beantwoorden.
Layout
Ontwerp en opzet van een pagina
Leading
Extra ruimte tussen tekstregels
Lean
Maak het klein.
Lettertype
Een ‘familie’ van fonts. Arial is een lettertype, Arial bold in 12 punten is een font.
Look & Feel
Het ontwerp in kleur en vorm
M
MBTI
Myers-Briggs Type Indicator. Een methode om te kijken naar hoe mensen beslissingen maken. Is best interessant, lees onze artikelen over MBTI eens!
Merkidentiteit
Wat je uitstraalt als merk, in kleur, lettertypes en verhaal.
Metric
Iets wat gemeten kan worden en bijgehouden.
Merge Request
Een merge request is als je jouw stukje van een groepsproject wilt toevoegen aan het hele project, maar dan met code.
Microcopy
Een korte maar overtuigende tekst, vaak in combinatie met een CTA-button.
Mockup
Lijkt net echt, is het niet. Bijvoorbeeld een afbeelding van je website.
Mobile first
Het website ontwerp wordt gemaakt voor mobiele beeldschermen eerst, en pas daarna voor desktop.
MVP
Minimale versie van je product waarmee je live kunt gaan.
N
NFC
De techniek van b.v. contactloos pinnen
NPS
Zwaar overschatte metric. Kan je direct weer vergeten.
O
Onboarding
Maak het de eerste keer makkelijk voor je nieuwe klanten in hun ontmoeting met je product.
Online strategie
Helpt je om keuzes te maken wat je online moet doen om mensen te betrekken en betrokken te houden.
Ontwerpuitdaging
Formulering van het kernprobleem dat je voor je gebruikers op moet lossen
Ontwerp-principes
Uitgangspunten voor een goed en consistent ontwerp.
P
Pipeline
Een technische route waarmee stukken code samengevoegd worden en van de laptop naar jouw scherm getransporteerd worden
PPI
Pixels per Inch, een vorm voor resolutie. Meer = scherper beeld.
Prototype
Snel op te zetten testbaar model van je idee. Bijvoorbeeld een klikbaar versie van je website opgezet in Figma zonder code.
Persona
Fictief voorbeeld-personage uit je doelgroep.
Product owner
Beslisser in het project.
Propositie
Wat je wilt communiceren met je bezoekers en waarom zij bij jou moeten zijn. Geschreven vanuit de behoefte van je bezoekers.
Photoshop
Ontwerpprogramma voor designers die veel met afbeeldingen werken.
Q
Quality assurance (QA)
Zorgen dat het ontwerp gemaakt wordt zoals het is ontworpen.
R
Resolutie
Hoeveel pixels er getoond worden op een scherm.
Respondent
Iemand die (vaak tegen kleine vergoeding) meedoet aan gebruikersonderzoek.
Responsive
Je website schaalt goed naar alle schermformaten, desktop, mobiel en tablet.
Retrospective
Terugkijken op het project of de sprint, wat ging goed, wat ging niet goed en hoe kunnen we het beter doen.
RGB
(Red, Green & Blue) Digitale kleurcode.
Roadmap
Een overzicht van het project voor de komende 12 maand, in lijn met je online strategie
ROI
Return On Investment: maar levert het ook wat op?
S
Sans-serif
Lettertype zonder schreef. Vaak moderner.
SCRUM
Werk opdelen in kleine blokjes
Scope
Wat de omvang of bereik van het project is. Wat valt wel binnen de afspraken en wat niet (buiten scope).
SEO
SEO is als het spelen van verstoppertje met Google, waarbij je constant roept "Hier ben ik!" om ervoor te zorgen dat je als eerste gevonden wordt. Staat voor Search Engine Optimization, of Zoekmachineoptimalisatie.
Serif
Lettertype met schreef. Vaak klassieker.
Sketch
Ontwerpprogramma dat niemand meer gebruikt nadat Figma geïntroduceerd werd.
Slack
Chatten over werk en communicatiekanaal met je klanten.
Social Proof
Sociale bewijskracht, een van de 7 Cialdini principes. Mensen vertrouwen mensen, en zien daarom graag ervaringen van echte mensen.
Sprint
Keihard werken in korte tijd.
Staging
Dit is de laatste check voordat het live gaat. In de staging-omgeving wordt de bijna-finale versie van de code getest om zeker te weten dat alles perfect werkt voordat het naar de echte gebruikers gaat.
Statamic
Hét CMS dat wij gebruiken bij de meeste klanten.
Studenten.net
Een internetonderneming uit de begin jaren 2000 waar John het nog vaak over heeft.
SEO
T
Template
Een sjabloon, bijvoorbeeld een generiek ontwerp voor een pagina
Tester
Een bijzonder type dat bij Concept7 werkt en zich bezighoudt met het testen (lees: slopen) van websites van klanten. Ze zijn nooit tevreden, en vinden alles slecht, maar zorgen daarmee wel voor topkwaliteit van een digitaal product
Testomgeving
Zie de testomgeving als een oefenterrein. Het is een veilige plek waar ontwikkelaars nieuwe dingen kunnen uitproberen en testen voordat ze echt in gebruik worden genomen.
Toegankelijkheid
De mate waarin alle bezoekers op je website, ongeacht visuele, auditieve, motorische of cognitieve beperkingen, je website kunnen gebruiken.
Tooltip
Een kleine hint die verschijnt als iemand klikt op een ‘i’, waarin extra informatie staat.
Toptaak
De meest voorkomende reden voor mensen om je website te bezoeken.
Toptakenenquête
Methode voor gebruikersonderzoek via een tool zoals Hotjar. Wie komen naar je website en waarom.
Tracking (1)
Het groter of kleiner maken van alle ruimte tussen letters
Het volgen van bezoekers op je website met bijvoorbeeld Google Tag Manager.
Typografie
Het toepassen van lettertypes in je ontwerp
U
Usability
UI/User Interface
Grafische weergave waarmee gebruikers en apparaten met elkaar communiceren. Soms uitgesproken als 'Goewie' (GUI).
User journey
Zie 'Customer journey'.
User research
Bedenk het niet zelf, vraag het eens aan je gebruikers.
User story
Verhaal over wat iemand moet kunnen op je website. Een functionaliteit uitgelicht vanuit het perspectief van de gebruiker.
UX
User Experience - wat je ervaart tijdens en na het gebruiken van een product. Vaak gebruikt men dit als een verzamelwoord voor het uitwerken van wireframes en de informatiearchitectuur van je website.
V
Valideren
Testen of iets wel klopt of werkt
Visual Design
De visuele kant van het ontwerp: typografie, kleurgebruik, plaatjes etcetera.
Vector
Digitale informatie over een punt in een ontwerp. Ontwerpen in vector maakt het schaalbaar tot in sint-juttemis
Viewport
Het zichtbare stuk van een webpagina.
W
Waterval
In 1 x van A naar Z werken. Tegenstelling van Agile werken
WCAG
Wireframe
Bouwtekening in zwart, wit en grijs van een digitaal product.
Witruimte
Bewust extra ruimte in je layout, bijvoorbeeld tussen tekst en afbeeldingen.
Meld je aan voor onze nieuwsbrief en ontvang maandelijks praktische inzichten, tips en tricks om je op weg te helpen naar online groei!
Vul hieronder jouw e-mail in en ontvang direct een handig weetje 🙂