Spline, Webflow, GSAP & More: Dirk Lach Reveals His Secrets

Welcome to Webflow Talk! In this exciting podcast episode, I have Dirk Lach, an experienced web designer, as a guest. We talk about his career in web design, his discovery of Webflow, and how this platform revolutionized his working life.
Dirk shares fascinating insights into developing Spline animations and 3D integrations in Webflow. He also gives us a look at his side project “3 Dimensions” using Spline and Webflow.
We also discuss the use of GSAP and Webflow interactions in his projects and why there is no clear choice between the two.
This episode ends with a discussion about the role of artificial intelligence in web design and how human expertise remains irreplaceable.
‍

Summary: A conversation with web designer Dirk Lach

Hi everyone! In this issue of Webflow Talk, I have the pleasure to welcome Dirk Lach, a talented web designer, as my guest. I've been following Dirk's work for quite some time and I'm really excited to talk to him about his projects and his approach to Webflow.

Dirk's career

Dirk tells us about his career in web design, which began in 2009 with an apprenticeship as a media designer. Even then, he specialized in web design and taught himself the basics of good design. After various positions in advertising and design agencies, he deepened his knowledge in web development before finally discovering Webflow.

Webflow as a game changer

Dirk explains how he first found out about Webflow and how this tool changed his life. Unlike previous web design tools, Webflow generates clean and lightweight code, making work a lot easier. For Dirk, Webflow was the ideal solution for realizing his designs without having to deal intensively with backend programming.

Development in web design technology

Dirk shares his observations on the technical side of web design and how it has developed over the years. In particular, the integration of 3D elements and animations has taken web design to a new level.

Dirk's latest project — 3 Dimensions — Spline and Webflow

Dirk talks about his latest project, where he uses Spline and Webflow to create 3D objects and animations. He gives us insights into his approach and how these two tools form a perfect symbiosis.

Performance and mobile customization

We discuss the challenges of performing and adapting to mobile devices in 3D projects. Dirk explains that his showcase page is focused on desktop optimization for now, as he wanted to focus on presenting the techniques. However, he emphasizes that Spline also enables responsive 3D elements and that performance can be further optimized.

GSAP for animations

Dirk explains how he uses GSAP for animations on his website. He emphasizes that almost all animations come from GSAP and that the 3D objects from Spline are not animated with GSAP. He explains that this isn't as easy in Spline's native Webflow integration and may require custom code.

niceType: A collection of font families

Dirk talked about his side project called “NiceType.” This is an impressive collection of over 64 font families, which he has found attractive and appealing over the years. With NiceType, users can see the fonts in action and understand how they look in their designs. The fonts are not only a source of inspiration, but also a valuable resource for web designers.

Typography as a key to design

In the podcast, Jonas emphasized the importance of typography in web design. He explained that understanding typography and being able to use fonts harmoniously and effectively in designs can add great value to client projects. He recommended that aspiring designers study typography and the hierarchies of texts intensively, as this leaves a lasting impression on many customers.

The motivation behind NiceType

The idea for NiceType came from my own search for a curated collection of high-quality fonts. Dirk wanted to create an archive that would be useful not only for himself but also for other designers. This search for a solution and the desire to support the web design community led to the creation of NiceType.

How to get to an English-language YouTube channel

Another interesting topic was Dirk's move to also publish English-language content on his German YouTube channel. He explained that this is an opportunity to reach new international audiences and gain experience in different languages. This step enables him to make his knowledge and projects available to a wider audience.

The importance of side projects in web design

The discussion ended with the question of why many web designers rarely start side projects. Jonas pointed out that discipline and commitment are crucial to working on such projects. Side projects offer the opportunity to improve your own skills, be creative and build up a portfolio of tailor-made projects. They can also open up unexpected opportunities and attract the attention of the web design community.

GSAP and Webflow Interactions

Dirk Lach explained that he often uses GSAP, an animation library, in projects that require complex timelines with multiple animations. GSAP provides more control and flexibility, particularly when it comes to customizing animations. On the other hand, he uses Webflow interactions for mouse events such as hover animations or mouse click reactions.

He also emphasized the efficiency of GSAP in handling animations in a timeline, particularly animations with many elements that need to be animated one after the other. This provides a scalable solution that is easy to adapt to changes.

Choosing between GSAP and Webflow

Dirk found that there is no clear right or wrong choice between GSAP and Webflow. Both tools can produce impressive results. The choice depends on personal preferences and project requirements. GSAP is often preferred for extensive animations, while Webflow interactions are suitable for simpler tasks.

Technical differences between GSAP and Webflow

Dirk explained that GSAP is widely recognized as an animation library and enables powerful scrolling animations. However, he pointed out that the differences between GSAP and Webflow aren't necessarily obvious in terms of the underlying code. However, Webflow has established itself as a strong alternative that offers good animation performance.

Webflow UI and improvements

We were talking about Webflow's redesigned user interface (UI). Dirk praised the update, but noted that there is still room for improvement, particularly in terms of usability for beginners and the explanation of icons and font sizes.

The role of AI in web design

Finally, we talked about the role of artificial intelligence (AI) in web design. Jonas emphasized that design expertise remains invaluable. While AI is able to provide generic solutions, he still sees AI a long way from being able to create custom and customized designs that meet the specific needs of customers.

With regard to AI support, Dirk emphasizes that AI can be used excellently to generate design ideas and compensate for a lack of knowledge. Yet human expertise is still needed to fine-tune and adapt designs and assess the quality of generated code.

conclusion

Overall, this conversation with Dirk Lach was extremely informative and insightful, and it illustrated the importance of expertise in web design, even in an era in which technology and AI are playing an increasingly important role.