Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Werken in stijl

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.

Werken in stijl

Avatar for Sybren Wartna

Sybren Wartna

June 25, 2015
Tweet

More Decks by Sybren Wartna

Other Decks in Technology

Transcript

  1. IK BEN SYB •  Front-end designer •  Afgestudeerd in 2011

    •  Responsive design •  Typografie
  2. DE PAPIEREN STYLEGUIDE •  Visual Design kijkt er vrij weinig

    naar •  Binnen 3 maanden al out of date •  FED heeft doorontwikkeld •  FED kijkt er ook weinig naar
  3. COMPONENTEN- LIBRARY •  Alles moet handmatig •  Veel extra werk

    •  Geen documentatie voor backend •  Visual Design kijkt er niet naar
  4. ALGEMENE PROBLEMEN •  Documenten niet in sync •  Heel veel

    uur werk PDF •  Klant kijkt wel naar styleguide
  5. EEN ANDER PROJECT •  Scrum •  Iedereen betrokken •  Nieuwe

    site, nieuwe stijl •  Voorbereiding op rebranding
  6. ONLINE STYLEGUIDE •  Designen in de browser & Photoshop • 

    VD & IO hadden ook andere deliverables •  Alles op één URL te vinden •  Toegankelijker
  7. HEEL VET •  Reclamebureau gebruikte het als basis •  Klant

    gebruikte het in meetings •  Collega’s wilden het ook gebruiken
  8. DYNAMIC STYLEGUIDE •  Eindelijk automatisch •  Visual design •  Interaction

    design •  Documentatie voor backend •  Basis voor testen
  9. DYNAMIC STYLEGUIDE •  Meer web based •  Sneller •  Nóg

    toegankelijker •  Realistisch ontwerp tonen
  10. JE HEBT GEEN CONTROLE OVER HOE HET DESIGN ERUIT KOMT

    TE ZIEN Het web van nu kan & hoeft niet pixel perfect
  11. RESPONSIVE DESIGN •  Photoshop is niet meer genoeg •  Alles

    moet schaalbaar zijn •  Componenten veranderen in het proces
  12. AUTOMATISEREN •  Veel werk is hetzelfde in projecten •  Testen

    vergemakkelijken •  Bugs sneller oplossen •  Meer tijd voor vette dingen
  13. WAAROM NIET? •  Te technisch •  Weinig aansluiting gebruikte tools

    •  Afhankelijkheid van derden •  Aanpasbaarheid lastig •  …
  14. STANDAARD •  Kleuren & typografie •  Formulieren •  Hoe zet

    je het project op? •  Varianten van een component? •  Responsive states