Launching a new website can be exciting—but it’s easy to overlook key details that affect how your site performs, looks, or even gets found in search engines. I recently launched a site and was reminded how critical a launch checklist really is. Here are five important things to check before your website goes live. 1. …
Video Category: Design
In this walkthrough, I’m going to take a local business website and show you how small, thoughtful tweaks can significantly improve the overall layout and design. I’ll be using a Figma plugin called HTML to Design, which turns a live website into a fully editable Figma file. Pulling the Website into Figma The site I’m …
Now more than ever, we need to be designing websites with accessibility in mind. As a web designer or developer, one of the easiest yet most crucial aspects of web accessibility you can control is ensuring the color contrast on your site meets accessibility guidelines and standards. Proper color contrast is essential for readability, especially …
If you’ve been designing websites for a while, you may have come across the term “clamp” for font sizing. It’s a modern CSS technique that allows for a smooth transition in font sizes, automatically adjusting between a minimum and maximum size based on the viewport width. This eliminates the typical jarring jumps in font size …
When you’re building out a website, you might come across an option to adjust letter spacing in your chosen editor or builder. Letter spacing refers to the horizontal space between the characters in a line of text. This feature is crucial in web design but is often confused with kerning, which deals with the spacing between two individual …
Learning keyboard shortcuts is one of the easiest ways to speed up your workflow in Figma. Today, I want to introduce you to 10 keyboard shortcuts that I use regularly to streamline my design process. 1. T for Text Tool The first shortcut is one of the simplest but most frequently used: T for Text. Press T on …
If you watched my recent video on setting up color styles in Figma, today I’m going to show you how to do the same thing for your text styles. Setting up text styles has the same advantages as color styles: you can set them up once and then edit them globally throughout your designs in …
As a follow-up to my previous video on setting up guides in Figma, I wanted to take a step back and walk you through my process when creating a new design for a website mockup. One of the very first things I do is create my color palette and set up my color styles. This …
Within the past year, I transitioned from using Adobe XD to Figma. As a total beginner, I had to learn everything from scratch. Today, I’m here to teach you one of the basics: setting up a layout grid in Figma. I highly recommend using layout grids because they make the transition from design to development …
When it comes to designing a strong logo, three key elements are crucial: choosing the right color palette, embracing simplicity, and opting for custom design. Whether you’re creating a new logo or refining an existing one, focusing on these aspects will help ensure that your logo effectively represents your brand and connects with your audience. …