Product design dat mensen graag gebruiken.
UX- en UI-design voor SaaS, apps en platformen. We onderzoeken, ontwerpen en testen met echte gebruikers. Daarna bouwen onze eigen developers het ook.
- 5,0 op Google, uit 49 reviews
- 150+ projecten
- 14+ jaar ervaring
Ons werk50 ontwerpen
Werk dat we ontwierpen.
Dashboards, mobiele apps, AI-producten, landingspagina’s en losse componenten. Klik op een ontwerp om het groot te bekijken, in te zoomen en te lezen welke keuzes we maakten.
Een selectie van klantwerk en concepten. Klantnamen laten we weg.
12 van 50
Wat we ontwerpen. Van het eerste gesprek tot de laatste pixel.
Acht vakgebieden, één team. We beginnen bij de mensen die je product gebruiken en eindigen bij schermen die je developer zonder giswerk bouwt.
Voor SaaS, apps, platformen en dashboards en websites.
Elke tegel volgt dezelfde demo: de bestel-app van een bakkerij.
01UX-onderzoek
We praten met je gebruikers en kijken hoe ze werken. Wat we horen, bundelen we tot inzichten waarop je kan beslissen.
Voor je developer: User stories en acceptatiecriteria, rechtstreeks uit het onderzoek.
02UX design
Flows en wireframes: wat ziet iemand, waar tikt die, wat als het misloopt. Eerst de logica, dan de looks.
Voor je developer: Elke flow met alle schermen en randgevallen: leeg, laden en fout.
03UI design
Het definitieve ontwerp: typografie, kleur en details die je merk dragen en rust geven.
Voor je developer: Exacte maten, spacing en tokens in Figma, iconen als SVG.
04Design systems
Eén bibliotheek van componenten en regels, zodat elk nieuw scherm meteen klopt. Ook over meerdere producten heen.
Voor je developer: Tokens als CSS-variabelen, componenten met varianten en states.
05Prototypes
Klikbare schermen die aanvoelen als het echte product. Je test het idee voor er één regel code is.
Voor je developer: Elke overgang met trigger, duur en easing erbij.
- Voorbeeld
06Usabilitytests
Echte mensen doen echte taken, wij kijken waar ze vastlopen. Daarna passen we het ontwerp aan.
Voor je developer: Bevindingen met prioriteit, en het aangepaste scherm erbij.
07Toegankelijkheid
Leesbaar contrast, zichtbare focus en tikvlakken van minstens 24 × 24 pixels. Zo werkt je product voor iedereen.
Voor je developer: WCAG 2.2 AA als vertrekpunt, per component nagekeken.
08Productstrategie-workshops
Met je team rond de tafel: doelen, gebruikers en wat je eerst bouwt. Je gaat naar huis met een plan.
Voor je developer: Een scope voor de eerste versie, met prioriteiten.
Eén design system. Al je schermen blijven kloppen.
Een design system is de gedeelde bouwdoos van je product: kleuren, lettertypes, afstanden en componenten, vastgelegd als tokens. Verander één token en elk scherm volgt. Probeer het hieronder.
Voor je developer: de tokens gaan als CSS-variabelen of als Tailwind-thema mee naar de code. Design en code gebruiken dus exact dezelfde waarden.
Design system/Bakkerij Vennegem
Tokens
Contrast volgens WCAG 2.2 AA
- Tekst op knoppen4,33:1, min. 4,5:1Te weinig contrast
- Merkkleur als tekst4,33:1, min. 4,5:1Te weinig contrast
- Focusring4,33:1, min. 3,0:1AA gehaald
Past de helderheid van je merkkleur net genoeg aan. De tint blijft dezelfde.
Voorbeeld van knoppen, badges, een formulier, een kaart, een melding, een tabbalk en tabelrijen met de gekozen tokens. Verander de tokens om ze te laten meeveranderen.
Demo · Bakkerij Vennegem/* Design tokens voor Bakkerij Vennegem (vereenvoudigd) */:root { --brand: #b5651d; --brand-foreground: #ffffff; --ring: var(--brand); --radius: 14px; --spacing: 0.25rem; --font-sans: ui-serif, Georgia, Cambria, "Times New Roman", serif; --background: #ffffff; --foreground: #15191b; --muted-foreground: #5e676b; --input: #848c90;}.dark { --background: #111618; --foreground: #eceff0; --muted-foreground: #9aa4a8; --input: #6b777c;}Wat een design system je oplevert
- Overal hetzelfde
- Elke knop, elk formulier en elke tabel ziet er hetzelfde uit, op je website, in je app en in je klantenportaal. Je gebruikers leren je product één keer.
- Sneller bouwen
- Developers bouwen met kant-en-klare componenten in plaats van elk scherm opnieuw. Nieuwe schermen staan er sneller en er sluipen minder fouten in.
- Toegankelijk vanaf de basis
- Contrast, focusringen en bediening met het toetsenbord zitten in de componenten zelf. We vertrekken van WCAG 2.2 niveau AA, de internationale richtlijn voor toegankelijk digitaal ontwerp.
- Gedocumenteerd
- Bij elk component staat wanneer je het gebruikt, welke varianten er zijn en hoe het in de code heet. Zo blijft het systeem bruikbaar als je team of je product groeit.
Klik door je product, nog voor er één regel code is.
Een prototype voelt als de echte app: je tikt, bladert en bestelt. Zo zie je na een paar dagen wat werkt en wat niet, terwijl aanpassen nog een uur kost in plaats van weken bouwwerk.
Flowkaart1 · Overzicht
Interactie
Overzicht → Product
- Trigger
- Bij tik
- Actie
- Navigeer naar Product
- Animatie
- Schuif in
- Curve
- Ease out
- Duur
- 300 ms
Voor je developer: dezelfde waarden in CSS
transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);Tik zelf door de app. Tik je naast een knop, dan lichten de klikzones op, net als in een echte prototype-tool.
Van wireframe naar hi-fi
Eerst de structuur, in grijs: wat staat waar en in welke volgorde. Pas als de flow klopt, komen kleur, foto’s en typografie. Zo praat je eerst over wat het doet, en pas daarna over hoe het eruitziet.
Elke toestand ontworpen
Een scherm is meer dan het mooie plaatje. We ontwerpen ook laden, volzet en geen verbinding, zodat je developer niets hoeft te verzinnen en je klant nooit naar een wit scherm staart.
Waarom een prototype
Beslissen op iets tastbaars
Iedereen tikt door hetzelfde prototype. Geen discussie meer over wat er in een document bedoeld werd.
Testen met echte mensen
Je deelt een link, testers klikken op hun eigen gsm. Wat hapert, passen we aan voor er gebouwd wordt.
Zo testen we met echte mensenKlaar voor je developer
Schermen, overgangen en toestanden liggen vast. Je developer bouwt wat je al gezien en goedgekeurd hebt.
Onderzoek en testen
Beslissingen op basis van mensen, niet van smaak.
We praten met je gebruikers voor we iets tekenen, en we kijken hoe ze het ontwerp echt gebruiken voor er één regel code is. Wat ze zeggen, waar ze klikken en waar ze vastlopen, bepaalt het ontwerp. Niet wat wij toevallig mooi vinden.
Wissel zelf tussen de testrondes of schud de notities opnieuw door elkaar.
Onze aanpak
Klein testen, vaak testen.
Je hebt geen groot onderzoeksbudget nodig. Een paar gesprekken en drie korte testrondes halen de grootste problemen eruit, lang voor ze geld kosten in code.
- 5testers
- per testrondeVijf testers vinden al zo’n 85% van de problemen, volgens Jakob Nielsen.
- 3rondes
- testen en verbeterenBeter drie kleine rondes dan één grote: na elke ronde passen we het ontwerp aan.
- 4,5:1
- contrast voor tekstHet minimum voor gewone tekst in WCAG 2.2 AA. Voor grote tekst is het 3:1.
- 24px
- minimale klikzoneNieuw in WCAG 2.2: klikdoelen van minstens 24 × 24 pixels, of genoeg ruimte ertussen.
Wat we inzetten
- Interviews met gebruikers
- Usability-tests, op afstand of bij jou
- Klik- en heatmaps
- Analytics en funnels
- Kaartsortering en boomtests
- UX-audit van je bestaande product
- Toegankelijkheidsaudit
- A/B-tests na de lancering
Toegankelijk vanaf de eerste schets
WCAG 2.2 AA is ons vertrekpunt: contrast, focus, toetsenbord en schermlezers zitten in het ontwerp, niet achteraf. Sinds 28 juni 2025 geldt de European Accessibility Act voor veel digitale diensten aan consumenten, zoals webshops en bankdiensten. Micro-ondernemingen die diensten leveren, zijn vrijgesteld.
Voor je developer: elke bevinding wordt een ticket met een schermafbeelding, de ernst en een voorstel. Geen rapport van veertig pagina’s dat niemand leest.
Bronnen: Nielsen Norman Group (2000) (opent in een nieuw tabblad), W3C, WCAG 2.2 (opent in een nieuw tabblad), Europese Commissie, European Accessibility Act (opent in een nieuw tabblad), MeasuringU, SUS (opent in een nieuw tabblad). Nagekeken op 28 september 2026.
Aanpak
Zo loopt een designproject. Stap voor stap, en jij kijkt mee.
Elk product is anders, dus elke planning ook. De volgorde blijft wel dezelfde: eerst begrijpen, dan schetsen, dan mooi maken, dan testen. Na elke stap zie je wat er ligt en beslis je mee.
Een designbestand met zeven frames, één per stap, en eronder de momenten waarop jij meekijkt.
Stap 1 van 7Kennismaken
Per stap: wat je krijgt, en wat we van je vragen.
- 01
Kennismaken en doelen
We leren je product, je gebruikers en je doelen kennen. Wat moet beter, voor wie, en hoe weten we dat het gelukt is?
Je krijgt
- Een korte briefing op één pagina
- Doelen en succescriteria
- Een planning en een vaste prijs
JijJe vertelt over je product en je klanten, in een gesprek of een workshop.
- 02
Onderzoek en discovery
We praten met echte gebruikers, bekijken je data en je bestaande product, en zoeken waar mensen vastlopen.
Je krijgt
- Interviews en een UX-review
- Inzichten, geclusterd per thema
- Een lijst met de grootste pijnpunten
JijJe brengt ons in contact met een paar klanten of collega’s.
- 03
Flows en wireframes
Eerst de structuur, nog zonder kleur. Welke schermen, welke stappen, wat staat waar. Zo praten we over de logica en niet over smaak.
Je krijgt
- Gebruikersflows
- Wireframes van de belangrijkste schermen
- Een klikbare schets
JijJe geeft feedback: klopt de flow met hoe jullie werken?
- 04
UI design en design system
Nu wordt het mooi. We ontwerpen de schermen in je merk en bouwen tegelijk de bouwstenen: kleuren, typografie, componenten.
Je krijgt
- Uitgewerkte schermen, desktop en mobiel
- Een design system met componenten
- Lichte en donkere modus, als je die wilt
JijJe kiest mee in de richting en keurt de schermen goed.
- 05
Prototype en testen
We maken een klikbaar prototype en laten echte gebruikers taken uitvoeren. Wat niet werkt, passen we aan voor er gebouwd wordt.
Je krijgt
- Een klikbaar prototype
- Testresultaten per taak
- Aanpassingen op basis van wat we zagen
JijJe kijkt mee bij de tests, of je krijgt de opnames.
- 06
Overdracht en bouwen
Onze eigen developers bouwen het, of we dragen alles netjes over aan jouw team. De ontwerpbestanden zijn van jou.
Je krijgt
- Ontwerpbestanden en specificaties
- Design tokens en componenten
- Begeleiding tijdens het bouwen
JijJe kiest: wij bouwen het, of jouw developers.
- 07
Meten en verbeteren
Na de lancering kijken we hoe mensen het echt gebruiken. Wat beter kan, pakken we op in kleine, gerichte verbeteringen.
Je krijgt
- Metingen van de belangrijkste stappen
- Een lijst met verbeteringen
- Nieuwe schermen als je product groeit
JijSamen bepalen we wat eerst komt.
Hoe lang duurt het?
Dat hangt af van je product. Een UX-review kan in een paar dagen, een nieuw platform duurt langer. Na het eerste gesprek krijg je een planning en een vaste prijs.
Bekijk de prijzen
Van design naar code
Van Figma naar code, zonder vertaalverlies.
Wat we ontwerpen, bouwen we ook. Elke knop in het ontwerp bestaat als echte component in de code, met dezelfde namen, dezelfde varianten en dezelfde waarden. Wat je goedkeurt, is wat je krijgt.
Een knopcomponent in een design-inspector, dezelfde knop in React en Tailwind, en het resultaat in de browser.
Eigenschappen
Toegankelijkheid
- Contrast 4,97:1AA vraagt 4,5:1
- Klikdoel 40 px hoogAA vraagt 24 × 24
- Focus zichtbaarfocus-visible outline
Kies zelf een variant, grootte of icoon: ontwerp, code en resultaat veranderen mee.
Hetzelfde team ontwerpt en bouwt
Onze designers en developers zitten samen. Geen overdracht over de muur, geen “zo was het niet bedoeld”.
Gedeelde design tokens
Kleuren, afstanden en afrondingen staan één keer vast, als tokens. Het ontwerp en de code lezen dezelfde waarden.
Componenten met documentatie
Elke component krijgt zijn varianten en voorbeelden op een rij, bijvoorbeeld in Storybook. Zo bouwt je team verder zonder te gokken.
Toegankelijkheid getest in de browser
We controleren contrast, toetsenbord, focus en klikdoelen in het echte product, niet alleen in het ontwerp.
Prijs
Wat kost product design? Per dag, of een vaste prijs.
Voor een audit, een workshop of een sprint werken we per dag. Voor een volledig ontwerp krijg je een vaste prijs, na een gratis gesprek. Je weet het bedrag altijd voor we beginnen.
Design-consultancy
Een ervaren designer die meedenkt en meewerkt, precies zo lang als je nodig hebt.
€ 700
per dag · excl. btw
Bijvoorbeeld voor
- Een UX-audit van je bestaande product
- Een workshop over je productstrategie
- Een UX-review van nieuwe schermen
- Een design sprint, van vraag tot getest prototype
- Een toegankelijkheidscheck volgens WCAG 2.2
- Extra designkracht naast je eigen team
Rekenvoorbeeld
Voorbeeld5 dagen: € 3.500 excl. btw
Zoals een design sprint van 5 dagen
Designproject
Van onderzoek tot overdracht, met één vaste prijs die je vooraf op papier krijgt.
Vaste prijs
na een gratis gesprek · excl. btw
Wat er in zit
- Onderzoek en gesprekken met je gebruikers
- Flows en wireframes
- UI design van elk scherm, desktop en mobiel
- Een klikbaar prototype om te testen
- Een design system met componenten en tokens
- Overdracht aan je developers, of wij bouwen het
- De ontwerpbestanden zijn van jou
Wat de prijs bepaalt
- Aantal schermen en flows
- Web, iOS, Android of alles
- Hoeveel onderzoek en testen
- Nieuw design system of verder op het bestaande
Ook laten bouwen?
Hetzelfde team bouwt wat we ontwerpen. Stel je project samen en je ziet meteen de prijs.
- Alle prijzen excl. btw
- Bedrag vooraf, op papier
- Ontwerpbestanden van jou
- 5,0 op Google, uit 49 reviews
FAQ
Vragen over product design
Wat founders, productteams en developers ons het vaakst vragen. In gewone taal, met één regel voor je developer.
Prijs en planning
Er zijn twee manieren. Voor consultancy, zoals een audit, een workshop of een design sprint, betaal je € 700 per dag, excl. btw. Een volledig designproject krijgt een vaste prijs na een gratis gesprek. We bekijken samen hoeveel schermen, platformen en onderzoek er nodig zijn, en je krijgt het bedrag op papier voor we beginnen. Bekijk de prijzen
Dat hangt af van wat je nodig hebt. Consultancy boek je per dag, dus daar kies je zelf de duur. Voor een project krijg je na het eerste gesprek een planning, met vaste momenten waarop je het ontwerp ziet en feedback geeft. Zo weet je vooraf wanneer wat klaar is. Zo loopt een project
Minder dan je denkt. Vertel ons wat je wilt bereiken en voor wie. Heb je al iets, dan nemen we het mee. Een uitgewerkte briefing is niet nodig: die schrijven we samen.
- Je doel
- Wie je gebruikers zijn
- Je huisstijl, als je die hebt
- Toegang tot je bestaande product
- Gebruikscijfers, als je die hebt
- Een deadline, als die er is
Bestanden en bouwen
Ja, we ontwerpen in Figma. De ontwerpbestanden zijn van jou: je krijgt de Figma-bestanden met alle schermen, componenten en stijlen, zodat jij of een andere partij er later mee verder kan. Net zoals de code en de data van jou zijn als wij bouwen.
Ja. Hetzelfde team ontwerpt en bouwt: apps, software, websites en webshops. Wie het ontwerp maakte, zit mee aan tafel als het gebouwd wordt, dus er gaat niets verloren onderweg. Wil je meteen weten wat bouwen kost, stel dan je project samen in de configurator.
Zeker. Je developers krijgen een ontwerp dat klaar is om te bouwen: een design system met tokens, componenten met al hun toestanden, en duidelijke afspraken over afstanden en gedrag. We lichten het ontwerp toe en blijven beschikbaar voor vragen, per dag als dat nodig is. Van design naar code
Audits, toegankelijkheid en systemen
Ja. We lopen je product door zoals je gebruikers dat doen en zoeken waar mensen vastlopen. We toetsen aan bekende principes voor gebruiksvriendelijkheid en aan WCAG, en kijken naar je cijfers als je die hebt. Je krijgt een overzicht van de problemen, gerangschikt op impact, met een voorstel voor elke oplossing. Een audit boek je per dag.
Altijd. We ontwerpen met WCAG 2.2 niveau AA als vertrekpunt: genoeg contrast tussen tekst en achtergrond, knoppen die groot genoeg zijn om te raken, een zichtbare focus voor wie met het toetsenbord werkt en foutmeldingen die zeggen wat er mis is. Sinds 28 juni 2025 geldt in de EU de European Accessibility Act, onder meer voor webshops en bankdiensten. Micro-ondernemingen die diensten leveren, zijn vrijgesteld, maar een toegankelijk product is voor iedereen makkelijker.
Ja, daar is het voor. Gedeelde tokens voor kleur, typografie en afstanden, en één set componenten, met een eigen thema per product of merk. Zo bouwen je teams sneller en voelt alles als één geheel. Probeer het design system
Staat je vraag er niet bij?
Stel ze gewoon. Je krijgt antwoord van iemand uit het team, binnen 24 uur op werkdagen.
Volgende stap
Klaar voor een product dat mensen graag gebruiken?
Vertel ons over je product in een gratis gesprek. Of mail ons een link, een paar schermen of een korte uitleg. Je krijgt antwoord binnen 24 uur op werkdagen.
Plan een gratis gesprek
30 minuten, online. We luisteren, stellen vragen en zeggen eerlijk wat we zouden doen.
Kies een momentMail je product
Stuur een link, screenshots of een korte uitleg. Een ruwe schets is ook goed.
info@brisk.beStuur een bericht
Liever kort en snel? Stel je vraag via WhatsApp.
WhatsApp (opent in een nieuw tabblad)- Een vaste prijs of een helder dagtarief
- De ontwerpbestanden zijn van jou
- Eén vast aanspreekpunt
- Ontworpen en gebouwd door één team
- Antwoord binnen 24 uur op werkdagen
Brisk · Genk, België