Pixel Paranoia the UX Podcast

In deze aflevering gaan we diep in op alles rondom accessibility, zowel in het UX traject als in het Front-end traject. Verder behandelen we Hostile CSS, of beter, hoe scope je design system componenten binnen je CSS? En bespreken we een boek dat alles uitlegt over shaders voor het web.

• 0:58 - Hostile CSS - https://medium.com/@kevinmpowell/hostile-css-fortifying-system-styles-against-inherited-properties-8aa2e9f0fa3d\
• 8:28 - The Book of Shaders - https://thebookofshaders.com/
• 13:46 - Inclusive Design - https://inclusivedesignprinciples.org/nl/
• 19:45 - Kleurenblind mannen - https://nieuws.specsavers.nl/dit-is-wat-8-procent-van-de-mannen-niet-ziet/
• 29:20 - Label your icons - https://uxdesign.cc/label-your-icons-e2bd57366d37
• 35:36 - Is het B1? - https://www.ishetb1.nl/
• 36:40 - WCAG 2.1 - https://www.w3.org/TR/WCAG21/
• 60:05 - Formula 1: Drive to Survive - https://www.netflix.com/nl/title/80204890
• 61:55 - Klokje rond Autoweek - https://www.youtube.com/watch?v=aY_DvQczSAw&list=PL6E7F0986F7F49DEB

Deze aflevering is wat anders dan anders. We gaan het hebben over de soms wat opmerkelijke keuzes die organisaties zoals Adobe en Microsoft maken. Waarom kunnen ze niet bijbenen met concurrerende software? Waarom houden ze zo vast aan hun eigen bedachte patronen terwijl er andere partijen het tegendeel al bewezen hebben? Kortom, geniet van deze aflevering waar Rick en Michele helemaal de diepte ingaan op Adobe, Microsoft Teams maar ook over de Belastingdienst en Total Webhosting Solutions.

• 1:25 - CSS Focus-visible - https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
• 4:36 - CSS :not selector (donut scope) - https://css-tricks.com/weekly-platform-news-focus-rings-donut-scope-ditching-em-units-and-global-privacy-control/#the-enhanced-css-not-selector-enables-donut-scope
• 70:32 - F1TV (25% korting met de code "F1TV25") - https://www.formula1.com/en/subscribe-to-f1-tv.html#nl-NL
• 74:00 - Frontend Horse - https://frontend.horse/

In deze aflevering hebben we weer een hele fijne gast. Rogier is Pattern Design Lead bij Centraal Beheer. Gezien de complexe organisatie en de vele aanpassingen heeft Centraal Beheer een proces bedacht waarbij het Design System de bron van alle informatie is geworden. Rogier neemt ons mee in hoe dit proces eruit ziet en welke valkuilen er kunnen zijn. Verder bespreken we over een aantal handige tips rondom de devtools van browsers, een accessibility test suite van Microsoft en Flotato, waarbij je van elke tab een app kunt maken.

• 1:58 - Flotato - https://www.flotato.com/
• 7:15 - Useful devtools tips - https://www.smashingmagazine.com/2021/02/useful-chrome-firefox-devtools-tips-shortcuts/
• 13:25 - Accessibility test suite - https://accessibilityinsights.io
• 78:00 - Tesla’s strategie om bitcoin te kopen - https://www.youtube.com/watch?v=F1P7JrY1JFw
• 80:25 - Welke karakters ondersteund een lettertype? - https://wakamaifondue.com/
• 81:30 - The Queen's Gambit - https://www.netflix.com/nl/title/80234304
• 82:20 - Ted Lasso - https://tv.apple.com/nl/show/ted-lasso/umc.cmc.vtoh0mn0xn7t3c643xqonfzy

In deze aflevering bespreken Rick en Michele een zeer handige color picker genaamd Pika, de gebruiksvriendelijke schoen van Nike, namelijk de Nike Go FlyEase en bespreken we de Twitter accounts van mensen die je moet volgen op het vlak van UX/UI en Front-end!

• 0:50 - Pika - https://github.com/superhighfives/pika
• 4:15 - Nike Go FlyEase - https://www.nike.com/nl/flyease/go-flyease
• 8:02 - Lynn Fisher (Front-end) (@lynnandtonic) 
• 10:07 - Steve Schoger (UX/UI) (@steveschoger)
• 11:09 - Sara Soueidan (Front-end/Accessibility) (@SaraSoueidan)
• 13:59 - Hakim El Hattab (Front-end/UI) (@hakimel)
• 17:29 - Adam Argyle (Front-end) (@agyleink)
• 21:04 - Andy Budd (UX) (@andybudd)
• 22:58 - Pablo Stanley (UX/UI) (@pablostanley)
• 27:00 - Jared Spool (UX) (@jmspool)
• 29:57 - Heydon Pickering (Front-end/Accessibility) (@HeydonWorks)
• 32:55 - Peter Paul Koch (Front-end) (@ppk)
• 35:38 - Wes Bos (Front-end) (@wesbos)
• 38:45 - Vasilis Van Gemert (UX/UI/Accessibility) (@vasilis)
• 40:59 - Steve Troughton Smith (iOS/UI) (@stroughtonsmith) 
• 43:15 - Foone (manus van alles, hardware/software hacker) (@foone)
• 46:10 - Brad Frost (Atomic Design, Front-end) (@brad_frost)
• 47:20 - Paul Irish - (Front-end) (@paul_Irish)
• 48:20 - Eric Myer (Front-end) (@meyerweb)
• 49:21 - SwiftOnSecurity (Security) (@swiftonsecurity)
• 51:38 - UXDesign.cc (https://uxdesign.cc)
• 53:18 - Pabo Stanley’s Figma Crash Course (https://www.figmacrashcourse.com/)

In deze aflevering bespreken Rick en Michele hoe je doormiddel van Lottie JS animated SVG’s kunt maken, het zeer bijzondere hyperscreen van Mercedes-Benz User Experience en super handige UX, UI en Front-end resources!

• 0:46 - Lottie JS - https://airbnb.io/lottie/#/
• 4:55 - Mercedes-Benz User Experience hyperscreen - https://www.youtube.com/watch?v=OF2lp7loN3E
• 11:38 - CSS Tricks - https://css-tricks.com/
• 15:49 - CoDrops - https://tympanus.net/codrops/
• 17:41 - Codepen - https://codepen.io
• 20:52 - Stackoverflow - https://stackoverflow.com
• 24:53 - Sidebar.io - https://sidebar.io
• 24:53 - Web platform News - https://webplatform.news/
• 25:07 - Dribbble - https://dribbble.com
• 29:44 - Behance - https://www.behance.net
• 33:32 - Awwwards - https://awwwards.com
• 39:04 - Smashing Magazine - https://www.smashingmagazine.com
• 43:45 - Nielsen Norman Group - https://www.nngroup.com
• 49:30 - CSS day & Design day - https://cssday.nl/
• 52:04 - CSS conf, JS conf - http://cssconf.org/ https://jsconf.com/
• 56:02 - Refresh Conference - https://www.refreshconference.nl/
• 58:16 - Smashing conference - https://smashingconf.com/
• 59:50 - Meetup - https://www.meetup.com/nl-NL/
• 62:00 - Fronteers - https://fronteers.nl/
• 64:26 - Enter key hint - https://mixable.blog/ux-improvements-enterkeyhint-to-define-action-label-for-the-keyboard-of-mobile-devices/
• 65:45 - Three.js Online Course - https://threejs-journey.xyz/

Deze aflevering hebben we een gast, namelijk Jasper! Jasper is UX designer bij FBTO. We bespreken gezamenlijk het effect van GIFjes in e-mails, het veelbesproken redesign van de CIA website en waarom Design Decks handig zijn. We stellen vervolgens Jasper de volgende vraag: waarom is UX zo essentieel bij verzekeraars en is het niet enorm saai om voor een verzekeraar te werken?

 

Animated GIFs in emails: https://www.nngroup.com/articles/gif-emails/

CIA rebranding: https://www.cia.gov

Design Decks by Femke: https://www.youtube.com/watch?v=9pMuuzFC0FE

FBTO: https://www.fbto.nl

HEX test: https://madebyshape.co.uk/hex-test/play/

Web platform News: https://webplatform.news/

MKBHD: https://www.youtube.com/user/marquesbrownlee

Deze aflevering bespreken Rick en Michele de nieuwe UI update die Tesla uitgebracht heeft, de erg handige Open Source design tools die Discord heeft ontwikkeld en onze meest favoriete en gebruiksvriendelijke apps van 2020

Discord open source design tools: https://blog.discord.com/building-open-source-design-tools-to-improve-discords-design-workflow-9a25c29f9143

• 12:30 - Tweetbot 5 for Twitter (iOS)
• 14:50 - Apollo (iOS)
• 17:40 - Scoupy (Android, iOS)
• 19:27 - Outlook (Android, iOS)
• 23:52 - Flitsmeister (Android, iOS)
• 29:38 - ING (Android, iOS)
• 33:58 - Delta (Android, iOS)
• 36:19 - Monument Valley 1 en 2 (Android, iOS)
• 38:17 - Adobe Lightroom (Android, iOS)
• 41:35 - Numi (MacOS)
• 44:50 - Plex TV (Android, iOS, Windows, MacOS, Chromecast, etc.)
• 51:43 - Revolut (Android, iOS)
• 55:13 - Telegram (Android, iOS, Windows, MacOS)
• 57:50 - Corona App (Android, iOS)
• 59:10 - Instagram (Android, iOS)
• 62:12 - Amazon Alexa (Android, iOS)
• 65:09 - Eneco App (Android, iOS)
• 67:01 - 1password (Android, iOS, Windows, MacOS)
  
• 78:29 - briefs.video (by Heydon Pickering)
• 79:42 - Frontend Guidelines Questionnaire (o.a. door Brad Frost)

Deze aflevering bespreken Rick en Michele welke UX tools het populairst zijn in 2020, het stilletjes overlijden van Adobe Flash en functional CSS frameworks zoals Tailwind CSS.

• UX Tools 2020 Survey: https://uxtools.co/survey-2020
• Adobe Flash EOL (End-of-life) 31-12-2020: https://www.adobe.com/nl/products/flashplayer/end-of-life.html
• Tailwind CSS: https://tailwindcss.com/
• Tailwind CSS Best Practice Patterns: https://www.youtube.com/watch?v=J_7_mnFSLDg
• Tachyons: https://tachyons.io
• Bootstrap: https://getbootstrap.com
• Tailwind UI: https://tailwindui.com
• Pablo Stanley: https://twitter.com/pablostanley
• Blush Illustrations: https://blush.design
• Miro: https://miro.com

Deze aflevering bespreken Rick en Michele een artikel (7 Practical Tips for Cheating at Design), Apple Airpods Max en de gebruiksvriendelijkheid (User Experience) van domotica.

• 7 Practical Tips for Cheating at Design: https://medium.com/refactoring-ui/7-practical-tips-for-cheating-at-design-40c736799886
• Steve Schoger: https://twitter.com/steveschoger
• Apple Airpods Max: https://www.apple.com/nl/airpods-max/
• Onderzoek naar het lettertype Dyslexie: https://www.yumpu.com/nl/document/read/19850288/sanne-kuster-en-tom-braams-anna-bosman
• Philips Hue: https://www.philips-hue.com/nl-nl
• Ikea TRÅDFRI: https://www.ikea.com/nl/nl/cat/slimme-verlichting-36812/
• KlikAanKlikUit: https://klikaanklikuit.nl/
• Lidl Smart Home: https://www.lidl.nl/smart-home
• Homey: https://homey.app/nl-nl/
• UX advent calendar: https://ux.christmas/
• Oculus Quest 2: https://www.oculus.com/quest-2/

Deze aflevering bespreken Rick en Michele het Atkinson hyper legible font, inspiratie website CoDrops en alles rondom browsers.

• Atkinson Hyper legible font: https://brailleinstitute.org/freefont
• CoDrops: https://tympanus.net/codrops/
• Browserstack: https://www.browserstack.com/
• Brave browser: https://brave.com/
• Electron: https://www.electronjs.org/
• The five best design links, every weekday: https://www.sidebar.io
• The Ranch: https://www.netflix.com/nl/title/80077977