Services

Design

Structuur, gedrag en een systeem om in te bouwen. Hoe het werkt is hier net zo belangrijk als hoe het eruitziet.

Design gaat hier over werken, niet alleen over mooi

Een scherm kan er prachtig uitzien en toch elke dag drie minuten van iemands tijd kosten. Bijvoorbeeld omdat de knop die je het vaakst nodig hebt onderaan staat. Design is bij ons vooral: wat staat waar, wat gebeurt er als je klikt, en wat ziet iemand als er iets misgaat.

Merk, huisstijl en campagnes doet Mediavisie zelf, dat is de andere tak van hetzelfde bedrijf. Wij pakken hier het ontwerp op van de dingen die je gebruikt: sites, portalen en applicaties.

Voor wie dit is

Voor jou als je medewerkers klagen dat het systeem traag werkt, terwijl het technisch snel is. Meestal zijn het dan te veel klikken, niet te weinig serverkracht. Voor jou als je bezoekers wel op je site komen maar niet doorklikken. En voor jou als je iets groots wilt laten bouwen en het eerst wilt zien voordat je het betaalt.

Dat laatste is het punt van deze fase. Een tekening aanpassen kost een uur. Hetzelfde aanpassen als het al gebouwd is, kost een week.

Wat er in deze groep valt

  • Web- en applicatieontwerp: de schermen zelf. Hoe je site of systeem eruitziet op een laptop en op een telefoon, pagina voor pagina.
  • UX en interactie: UX staat voor de ervaring van de gebruiker. Wat iemand moet doen om zijn doel te bereiken, en hoe je dat van zeven stappen naar drie brengt.
  • Design system: één set bouwstenen, knoppen, kleuren en formulieren, die overal hetzelfde werkt. Nieuwe pagina’s bouw je daarna sneller en ze passen meteen.
  • Prototype en clickdemo: een klikbare versie zonder dat er iets echt werkt. Je collega’s kunnen erdoorheen lopen en zeggen wat er niet klopt.
  • Toegankelijkheid: ook bruikbaar voor iemand die slecht ziet, geen muis gebruikt of in een lawaaiige loods staat. Dat is meer mensen dan je denkt.

Hoe het loopt

Meestal beginnen we met de structuur, dan een paar schermen, en dan een klikbare versie waar jij en je collega’s doorheen lopen. Reken op twee tot zes weken, afhankelijk van hoeveel verschillende schermen er zijn. Bij een applicatie zijn dat er al snel meer dan je vooraf denkt.

Wat hieruit komt gaat rechtstreeks door naar development. En als je nog niet weet welke pagina’s je überhaupt nodig hebt, begin dan bij informatiearchitectuur.

De techniek eronder

Alle techniek

Waar we het mee bouwen.

  • Ontwerp

    Figma

    Waar het ontwerp begint en waar je meekijkt. Componenten sluiten aan op wat we daarna in code bouwen.

  • Ontwerp

    Storybook

    Elk onderdeel los te bekijken en te testen, inclusief de staten die je op de site zelden tegenkomt.

  • Opmaak

    CSS

    Eigen variabelen voor kleur, ruimte en typografie. Eén plek aanpassen verandert de hele site mee.

  • Opmaak

    Sass

    Waar een project er al op draait. Nieuwe sites bouwen we met eigen CSS en variabelen, dat is inmiddels genoeg.

  • Beweging

    GSAP

    Voor animatie die iets uitlegt in plaats van iets opvult. Respecteert de instelling voor minder beweging.

  • Beweging

    Lenis

    Rustiger scrollen zonder het scrollgedrag van de browser te breken. Uit zodra iemand minder beweging heeft ingesteld.

Wij werken onder andere voor

Portret van Rutger Groothedde

Rutger Groothedde Developer

Heb je een uitdaging voor ons?

Vertel wat er gebouwd moet worden, dan denken we mee.

Ontdek jouw mediavisie