Collective #587
Publikováno: 6.2.2020
Accessible autocomplete control * Octomments * Flow Fields * Binary Search
Collective #587 was written by Pedro Botelho and published on Codrops.
Inspirational Website of the Week: Illuminating Radioactivity
A fantastic project with a great scrollable design made by the folks of tubik.
.design: A better Domain for Designers
Add a professional touch to your website with a .design domain name. Get 1 year free today!
Building an accessible autocomplete control
Learn how to design and build an accessible autocomplete control from scratch in this article by Adam Silver.
How To Create A Headless WordPress Site On The JAMstack
Sarah Drasner’s and Geoff Graham’s hands-on tutorial where you’ll learn how to create a real headless WordPress site on the JAMstack.
Octomments
A plugin by Krasimir Tsonev that lets you use GitHub issues as a comment system.
Binary Search
Practice programming challenges with others on Binary Search. Create a room, invite your friends, and race to finish the problem.
Flow Fields
Generative artist Tyler Hobbs explains the basics of flow fields and how to use different variations with tips on how to improve the visual result.
GLTFJSX tool
A major release of the tool that turns GLTF’s to JSX components. See it in action in this tweet. By Paul Henschel.
Flowing Image – How To
Louis Hoebregts shows the concept behind transforming a painting into a field of particles.
The design systems we swim in.
Some interesting thoughts on the way the industry talks about design systems.
Improved accessible routing in Vue.js (updated)
An article that aims to show how to implement an improved approach to accessibility in Vue.js, using vue-router.
Design Systems, Agile, and Industrialization
Picking up on Jeremy Keith’s concerns about design systems, Brad Frost shares his thoughts on the topic.
Kinetic slider
A WebGL powered slideshow using PixiJS and GSAP. By Hadrien Mongouachon.
Light and dark themed SVG favicon using the CSS prefers-color-scheme media feature
Catalin Red shows how to use an SVG as a favicon for your website, considering the light and dark theme detection in the browser using the CSS prefers-color-scheme media feature, with PNG and ICO fallbacks.
Could browsers fix more accessibility problems automatically?
Hidde de Vries’ write-up of his talk at the Web We Want session at View Source in Amsterdam.
DarkModeJS
DarkModeJS detects the user’s time for easy dark theme switching.
Free Font: LL BAGUIO
A lovely font with an interesting inspiration made by Lloyd Zapanta.
Pixel 4 and Pixelbook Go mockups
A free set of Google devices mockups in Sketch, Figma, and Photoshop file formats.
Newton’s Light Bulbs
A great demo by Jhey Tompkins where he uses the MorphSVG plugin by GreenSock.
Image Dragging Effects
A set of playful dragging effects for images using various techniques.
Crafting a Cutout Collage Layout with CSS Grid and Clip-path
Learn how to code up an interesting design with a cutout image look using CSS Grid and clip-path.
Collective #587 was written by Pedro Botelho and published on Codrops.