Dev Design Brew 005

Sponsor: Quick testing across devices with this browser built for web developers.

Sip happens ☕, but how are you? 👋

We had many web tech updates last week. I list them here so you can Keep your eyes peeled for these changes! We want to make sure you're up-to-date with the latest website design and development.

I also shared a Coolify tutorial for WordPress installations. As a result, I need to use another service for phpMyAdmin and FTP.

Also read about: design for task switching, T-shapes vs. V-shapes designers, visual testing, design engagement and integrating developer mindset.

Enjoy!

Inspiration Website

kanaknaturals
Cool of scrolling animation website. The website was built using Astro and GSAP for the animation.

spark.fr
Another cool scroll animation using GSAP and Three.js. The website built using Nuxt for the framework.

Reads

🐳 How To Add phpMyAdmin and FTP to the Coolify Docker Compose
The default Coolify is feel not enough, what if you need FTP and phpMyAdmin? Here is how I add them to the Docker compose.

🔘 Designing for Task Switching: Enhancing User Experience
Clinical psychologists have conducted extensive research showing that people can only focus on one task at a time. We are good at switching back and forth quickly, but we are not multitasking.

🤓 T-Shaped vs. V-Shaped Designers
Job listings often have long, strict requirements. But could this miss out on 'V-shaped' designers who innovate by working across different areas?

🧪 Visual testing: The greatest trick in UI development
making sure everything looks right is as important as making sure it works. Visual tests are image snapshot tests that solve this.

↩️ Design for Engagement: User Retention Thoughts & Lessons from Nutrition and Streak-Based Apps
Have you been thinking: how can you keep users attached to your app once the habit is formed?

🤔 Integrating Developer Mindsets into Design for Scalable and Efficient Products
An effective and efficient product can be built by applying cross-disciplinary knowledge. Here is Orolade Olawale's experience building scalable, efficient, and robust products.

Tools

🗃️ Liveblock
Liveblocks is the platform for adding collaborative editing, comments, and notifications into your application.

🧱 Formbrick
Formbricks provides a free and open-source surveying platform. Gather feedback at every point in the user journey with beautiful in-app, website, link, and email surveys. Build on top of Formbricks or leverage prebuilt data analysis capabilities.

💽 pgweb
Pgweb is a web-based database explorer for PostgreSQL, written in Go, and works on Mac, Linux and Windows machines. Distributed as a simple binary with zero dependencies. Very easy to use and packs just the right amount of features.

Tech Updates

We had a lot of front-end tech updates to share with you last week.

Workspace Inspirations

Videos

Gears

Logitech mouse has a dedicated "AI" button