- Halfvet
- Posts
- Halfvet #106
Halfvet #106
Mobile navigation patterns
KICKOFF
Ontwerpen voor apps lijkt voor het grootste deel op ontwerpen voor websites, maar er zijn een paar duidelijke verschillen, vooral qua navigatie. Ook lijsten (table views), date pickers, switches en notificaties zijn anders. Ik heb zelf niet heel veel ervaring met app-design; de grootste waar ik aan werkte was de app van De Slimste Mens, zo’n twee jaar geleden. De komende tijd gaan we bij Bravoure een app ontwikkelen voor een device dat de luchtkwaliteit in ruimtes meet, dus ik las met gespitste oren (ogen?) Modern iOS Navigation Patterns van Frank Rausch.
In het artikel geeft Frank een overzicht van de meest voorkomende navigatie patterns, zoals drill-downs, modals, pyramids en sequences. Ik kende alleen modals, dus er was een hoop te leren 🙂 Deze patterns worden uitgebreid uitgelegd:
Structural Navigation
Drill-Down
Flat
Pyramid
Hub-and-Spoke
Overlay Navigation
High-Friction Modal
Low-Friction Modal
Non-Modal
Embedded Navigation
State Change
Step-by-Step
Content-Driven
Ik vond het artikel zeer verhelderend en super bruikbaar. Frank Rausch noemt het zelf een onofficieel bonushoofdstuk van Apple’s Human Interface Guidelines. Zo is het. Lees ‘m helemaal op frankrausch.com/ios-navigation
En als je gaat app-designen, dan komen deze twee ook vast van pas:
READING LIST
Ook Spotify krijgt een TikTok-esque revamp. Minder statisch artwork en meer discovery door snippets, previews en personalized AI. Klinkt als een logische stap.
Frontend developer Josh Collinsworth geeft tien tips over hoe je perfecte microanimaties en transities maakt. Must read voor developers én designers!
Wist jij dat het contrast tussen de kleurvulling van een button en de achtergrond waarop de button staat óók minstens 4.5:1 moet zijn? Ik niet 🙂 En Oliver Schöndorfer ook niet dus weet hij er een artikel en video aan.
IN JE FACE
In de nieuwe identity die Base ontwierp voor The Rock & Roll Hall of Fame reageert typografie op geluid. Dat levert mooie lettervormen op. De witte letters, het serif logo-font en de animatie op basis van geluid doen me wel een beetje veel denken aan Collins werk voor de San Francisco Symphony…
De vorige keer liet ik de very shiny button van Alex Widua zien. Jordan Singer maakte dit antwoord: a reflective UI. Tiny trend geboren?
MUST
Teunis Marseille
Teunis is Halfvetter, visual designer en muziekproducer.
Portfolio om je vingers bij af te likken:
Héél vet vind ik het werk van Jason Galea, de 8e Beatle van King Gizzard. 3D met een prehistorische Playstation-look, glitchy video synthese en eindeloos gedetailleerde grafische posters.
Interessante AI-toepassing:
Stel je maakt met AI een plaatje van een LP, print die vervolgens uit en speelt hem af op de pickup. Dat is wat Riffusion doet, zonder fysiek spul.
Dit brengt de nerd in mij naar boven:
De nieuwe Geometry Nodes feature in Blender. Je bouwt zonder te coderen een systeem dat graphics genereert. Zo heb ik bijvoorbeeld een oneindige serie posters gemaakt, volgens een bepaalde set regels. Als je eenmaal iets ontwerpt of animeert op deze manier, kan je niet meer zonder.
FRESH FONTS
JOBS
Jouw vacature in Halfvet? Voeg ‘m toe.
Voor in de rij bij sollicitaties? Join de Halfvet Talent Collective.
TOOLS
Type Design Resources verzamelt kennisbronnen en tools over letterontwerpen.
Watermark Remover verwijdert het watermerk van stockphotos.
Lord Icon zijn customizable animerende iconen.
Use Animations zijn ook animerende iconen, maar dan voor Lottie.
HeadshotPro AI-genereert een hele serie portretfoto’s op basis van selfies.
👋
Vorige week was de soft launch van twee musea-websites die we bij Bravoure ontwierpen: die van het Limburgs Museum en de Oude Kerk in Amsterdam. Trots op m’n team!
Tot over twee weken,
Jeroen.
Reply