Development By Simon Sterne 3 days ago Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an experienced freelancer, a team of hardened developers, or a small business owner, a well-structured plan is critical for success. In this post, I’ll give you the benefit… Continue reading How to Plan Your First Successful Website
Category: Web Development
Creating an Interactive 3D Bulge Text Effect with React Three Fiber
In this tutorial, we’ll explore how to generate a engaging bulge effect on text using React Three Fiber. For the past few weeks, I’ve been experimenting with mixing 3D and 2D to create compelling effects. Today, I’ll guide you through replicating this bulge effect on text. To streamline the process and maintain a structured approach… Continue reading Creating an Interactive 3D Bulge Text Effect with React Three Fiber
On-Scroll 3D Stack Motion Effect
Oh boy, when I saw this amazing NFT cards Dribbble shot by Renat Muratshin, I was literally drooling all over my keyboard! What a masterpiece of motion! Have a look for yourself: Clearly, something this stunning can only serve as inspiration! So, I’ve got tons of ideas swirling in my head, and there’s one in… Continue reading On-Scroll 3D Stack Motion Effect
Exploring 3D Effects with 2D Optical Illusions
Today we will explore how to create an engaging animation using simple CSS and an animation library, like GSAP, to achieve a 3D effect through basic optical illusions. While many of these animations can be crafted using plain CSS, I prefer utilizing JavaScript (GSAP) for its efficiency, allowing me to produce the desired effects swiftly… Continue reading Exploring 3D Effects with 2D Optical Illusions
15 Great Tools & Resources for Designers & Agencies in 2024
Posted · Category: Design, Tools It’s 2024 and the number of web design resources and tools on the market seems overwhelming. That’s good news since you need the right tools and resources to come up with competitive designs. The bad news is, rather than sifting through thousands of products to get the ones that best… Continue reading 15 Great Tools & Resources for Designers & Agencies in 2024
Reflection Scroll Effect | Codrops
The other day I was marvelling over this amazing animation by Jurica Koletic that he made for Hot Type. It’s very much skeuomorphic and sorry, but I’m a total sucker for that! So I tried recreating this little effect on a grid where we show a reflection at the top of the page. It’s really… Continue reading Reflection Scroll Effect | Codrops
The Art of Engineering AI Prompts
AI By Louise North 3 days ago In the rapidly evolving world of artificial intelligence, the ability to communicate effectively with AI tools has become an indispensable skill. Whether you’re generating content, solving complex data problems, or creating stunning digital art, the quality of the outcomes you receive is directly influenced by the prompts you… Continue reading The Art of Engineering AI Prompts
10 Awesome WordPress Themes to Check Out in 2024
Posted · Category: Design, Tools <!– –> The good news is there is no shortage of awesome WordPress themes that can help you create an engaging and well-functioning website. The not-so-good news is that the options open to you can be overwhelming because of the thousands of great WordPress themes available. Finding one you can… Continue reading 10 Awesome WordPress Themes to Check Out in 2024
Layouts in Astro — SitePoint
This introduction to layouts in Astro is excepted from Unleashing the Power of Astro, available now on SitePoint Premium. While each .astro page (route) has the potential to contain a fully-fledged HTML document, it’s inefficient to duplicate that structure, especially when certain elements—such as <meta> and <title> elements—may vary depending on the currently viewed page.… Continue reading Layouts in Astro — SitePoint
Layouts in Astro — SitePoint
This introduction to layouts in Astro is excepted from Unleashing the Power of Astro, available now on SitePoint Premium. While each .astro page (route) has the potential to contain a fully-fledged HTML document, it’s inefficient to duplicate that structure, especially when certain elements—such as <meta> and <title> elements—may vary depending on the currently viewed page.… Continue reading Layouts in Astro — SitePoint
Experimental On-Scroll Text Animations with SVG Clip-Path
You may have come across those design elements with knockout “text”, revealing an image or pattern behind it. Sometimes, it doesn’t even look like text, but more like shapes: Or like the one seen on the website of Newfolk. I find that these elements can really contribute a nice dynamic touch to a design. I… Continue reading Experimental On-Scroll Text Animations with SVG Clip-Path
Rock Solid WordPress Security: Keeping Your Business Safe
Development By Simon Sterne Today WordPress is the web’s favourite CMS (content management system), renowned for its low-entry level and vast array of themes and plugins. WordPress’s open-source nature allows for endless flexibility, catering to diverse needs and technical skills. Unfortunately, 10,950,000 websites are hacked yearly, and 4,708,500 of those belong to small businesses. WordPress’s… Continue reading Rock Solid WordPress Security: Keeping Your Business Safe
Top 7 Must-Read Books for Every Student in Search of Inspiration Graphic Design Junction
When you need to design success and achieve peace of mind both in your studies and daily life, you should turn to books that will help you to become inspired. Some books will help you to gain confidence, while others will bring tears to your eyes as you read about someone’s story that will hit… Continue reading Top 7 Must-Read Books for Every Student in Search of Inspiration Graphic Design Junction
Creating Audio-Reactive Visuals with Dynamic Particles in Three.js
In this tutorial, you will learn how we at ARKx crafted the audio-reactive visuals for Coala Music’s website. We’ll walk through the concepts and techniques used to synchronize audio frequencies and tempo, creating a dynamic visualizer with procedural particle animations. Getting Started We will initialize our Three.js scene only after the user interacts; this way,… Continue reading Creating Audio-Reactive Visuals with Dynamic Particles in Three.js
30 Free Xmas Graphics
Compilations By Louise North 4 days ago We’ve reached that time of year when all marketing is on a singular theme: snow, presents, and turkey (or nut roast, if that’s your preference). These last few weeks running up to the Christmas break can be an endless trudge through grey, cold weather if you’re in the… Continue reading 30 Free Xmas Graphics
Creating an Interactive Mouse Effect with Instancing in Three.js
Mind-blowing effects that require thousands, possibly millions of objects like hundreds of paper planes, brains made out of triangles, or a galaxy of stars, push the limits of the GPU. However, sometimes it’s not because the GPU cannot draw enough, at times it’s bottlenecked by how much information it’s receiving. In this tutorial, we’ll learn… Continue reading Creating an Interactive Mouse Effect with Instancing in Three.js
30 Most Exciting New Tools for Designers, 2023
Compilations By Paddi MacDonnell Today As we near the end of 2023, we wanted to take a look back over all the tools we collected over the past year, to pick out our favorites. It was a tough job, as there has been a lot of great new stuff released. We’ve covered design tools, developer… Continue reading 30 Most Exciting New Tools for Designers, 2023
How to Create Animated GIFs from GSAP Animations — SitePoint
In this article, I’m going to explain how you can convert animations created using GSAP into animated GIFs using modern-gif. Here’s a sneak peek of one I made earlier. 👇 On the links below, you’ll find a live preview and all the code I’ll be referencing throughout this article: There are two “pages” in the… Continue reading How to Create Animated GIFs from GSAP Animations — SitePoint
15 Best New Fonts, November 2023
Fonts By Ben Moss 2 days ago 2023 is almost over, and the new fonts are still coming thick and fast. This month, we’ve found some awesome variable fonts, some revivals, and one or two novelty fonts to get you through the holiday promotion work. Enjoy! Dash Dash is the result of detailed scientific study… Continue reading 15 Best New Fonts, November 2023
30 Amazing Chrome Extensions for Designers and Developers
Compilations By Robert Reeve 2 days ago Searching for a tool to make cross-platform design a breeze? Desperate for an extension that helps you figure out the HTML code of that fantastic color palette? Looking for a trick that will supercharge your productivity this year? We’ve got you covered. Chrome extensions are the bread and… Continue reading 30 Amazing Chrome Extensions for Designers and Developers
Dynamic Tooltip Reveal Animations | Codrops
The other day I stumbled across this awesome Dribbble shot by Michael Crawford for one of his invented projects Adult Protection Agency, a playful reminder that the art of growing up is becoming an endangered skill in our ever-devolving world 🙂 A wonderful integration of the Minesweeper game concept gave me this small idea of… Continue reading Dynamic Tooltip Reveal Animations | Codrops
From Image Adjustments to AI: Photoshop Through the Years
Tech By Max Walton 2 days ago Remember when Merriam-Webster added Photoshop to the dictionary back in 2008? Want to learn how AI is changing design forever? Join us as we delve into the history of Photoshop, from its early beginnings right through to the dawn of artificial intelligence. Photoshop is nothing short of a… Continue reading From Image Adjustments to AI: Photoshop Through the Years
15 Best New Fonts, October 2023
Fonts By Ben Moss Yesterday We’re entering the final quarter of 2023, and even in the pre-holiday lull, there are still plenty of fonts to get excited about. In this month’s edition of our roundup of the best new fonts for designers, there are lots of revivals, some excellent options for logo designers, and some… Continue reading 15 Best New Fonts, October 2023
Exciting New Tools for Designers, October 2023
Compilations By Paddi MacDonnell 2 days ago Welcome to our all treats-no tricks, October tools collection. This month, we have a whole bag of goodies for designers, developers, and designevelopers alike. (Yes, we did just make up a new word.) There are some great new assets, apps, and resources for boosting your creativity and speeding… Continue reading Exciting New Tools for Designers, October 2023