KICKOFF

De afgelopen maanden heb ik bij GRRR gewerkt aan het ontwerp van de nieuwe app voor de tv-quiz De slimste mens. Vorige week ging 'ie live! 🎉

Voor het eerst ontwierp ik een app met zo'n groot bereik: 2 miljoen accounts, 200.000 actieve gebruikers. Dat was spannend, maar vooral erg leerzaam. Het design/dev team was compact: mijn collega Friso deed UX, het development was in handen van PressPlay en ik dus art-direction en UI. Enorm leuk om aan te werken en ik ben rete trots op wat we hebben bereikt 😊

De oude app was meer dan 8 jaar oud en het design voelde gedateerd. Ook was de app traag en crashte regelmatig. De uitdaging van het redesign was om de enorme groep bestaande gebruikers niet kwijt te raken, maar de app wel een grondige facelift te geven.

Een paar uitgangspunten en details van het ontwerp:

• We zijn zo dicht mogelijk bij de look & feel van het tv-programma gebleven. Dat zie je terug in iconen, kleuren en fotografie. Spelrondes hebben de herkenbare rood-oranje achtergrond.

• Avatars van je tegenspelers staan centraal. Zo zie je snel tegen wie je speelt en kun je makkelijk na iedere ronde wisselen van spel.

• In de spelflow worden de kleuren steeds lichter: het home screen is overwegend donkerblauw, een spel starten heeft een lichtblauwe achtergrond, het spel zelf is rood-oranje en alle elementen die met de uitslag te maken hebben zijn geel.

• Wanneer je de finale wint of verliest, word je getrakteerd op bijpassende gifjes van Philip of Maarten.

• UI-elementen volgen dezelfde kleurprincipes als bij dark mode vaak worden toegepast: de onderste elementen zijn donker en de bovenste elementen licht. Interactieve elementen liggen altijd bovenop en zijn daarom het lichtst.

• Statistieken, winreeksen en rankings bieden inzicht en extra uitdagingen.

De app is te downloaden in de App Store en de Google Play Store. Als je 'm hebt geïnstalleerd, voeg me toe als vriend om een potje te spelen! ⚔️

READING LIST

This amazing AI tool lets you create human faces from scratch — www.fastcompany.com

Generated Photos (de stockphoto-website met AI-gegenereerde portretfoto's) heeft een tool gelanceerd waarmee je de gezichten kunt aanpassen. Beetje meer lachen, hoofd wat draaien, huidskleur wat donkerder... no problem.

How to create a color palette easily? — medium.muz.li

Ik vond dit een leuke manier om tot een kleurpalet te komen; mooie combinatie van formule en randomness.

Pressing flesh against flesh — jenniferdaniel.substack.com

De handenschud-emoji 🤝 is de enige handen-emoji die niet beschikbaar is in verschillende huidskleur-varianten. Why??! Het antwoord en de oplossing lees je hier 🙌

Measuring Web Performance in 2021: The Definitive Guide — requestmetrics.com

Dat je site soepel en snel draait is onzichtbaar maar onmisbaar. Hier lees je alles over web performance.

How Pixar Uses Hyper-Colors to Hack Your Brain — www.wired.com

Pixar heeft een heel leger kleurwetenschappers en -technici die je alle hoeken van het kleurspectrum laat zien. Fascinerend.

IN JE FACE

Jenny B Kowalski ontwierp een variable font die leeft tussen lowercase en uppercase. Op haar Insta deelt ze d'r toffe experiment.

Kun je een machine leren om letters te ontwerpen? Het antwoord is dit AI-gegenereerde font, gevoed met 2674 Google Fonts. Interessant om de generaties te zien waarin het font zich heeft ontwikkeld.

MUST: ARTHUR REINDERS FOLMER

Arthur is letterontwerper als Typearture

Must read

Otl Aicher / Rotis – Over de Duitse vormgever otl aicher en zijn geschiedenis in Rotis (een wijk in Leutkirch im Allgäu, Duitsland) en naamgever van zijn lettertype rotis (een populaire superfamilie van eind jaren tachtig). Een aanrader, want de focus ligt niet op het lettertype, maar vooral op aicher’s ideeën, die altijd zocht naar verbindingen tussen ontwerp, techniek, politiek, sociologie en filosofie.

Must see

Genkse herdenkingstaarten van Denicolai & Provoost – Ik heb ze nog niet in het echt kunnen zien, maar dit is precies mijn ding: Genk is een oude Belgische industriestad die veel te verduren heeft gehad: het verdwijnen van werkgelegenheid, bombardementen, enzovoorts. Het kunstenaarsduo probeert deze momenten met de stad te herdenken. Het lijkt plat, maar door de uitvoering (de persoonlijk verhalen, de selectie, de toegankelijkheid) werkt het waardig en feestelijk, geholpen door een beetje humor.

Must use

Salter – Hier moet ik toch een font toevoegen: Want bij bijna elke klus ben ik nu aan het kijken of ik Salter toch kan gebruiken. Dit lettertype, geïnspireerd door de belettering van boekomslagen uit de vorige eeuw, is een pareltje voor het oog, net als Sharp’s eerdere Ogg trouwens. Het is alsof je een privé letteraar op je computer hebt geïnstalleerd.

PODCAST

Wireframe over nostalgia — creativecloud.adobe.com

Het nieuwe seizoen van Wireframe – Adobe's podcast over design – is begonnen. De eerste is meteen raak met een discussie over de voor- en nadelen van de huidige nostalgia-trend. Met oa. (you guessed it) de Burger King branding.

TOOLS

• Screensizes geeft screen size informatie over alle Apple devices.

• Iconic zijn gratis te downloaden vector-iconen.

• Removal verwijdert achtergronden van foto's.

• PINTR maakt één-doorlopende-lijn-illustraties op basis van foto's.

All caught up.

Tot over twee weken!

Jeroen.