Building Better Figma Files

This week I continued building my confidence in Figma, moving on from the basic layout tools and starting to understand how designs can be made more structured and reusable. The main areas I focused on were components, auto layout, a small amount of prototyping, and making better use of my assets file with icons, flags, avatars and other reusable design elements.

One of the biggest things I worked on was components. I started to understand why they are useful, especially when designing a website with repeated elements. Instead of creating the same button, card, navigation item or section again and again, components allow me to create something once and reuse it properly. This makes the design feel more consistent and also makes it easier to update later. If I change the main component, the other versions can update with it, which feels much more organised than manually changing every part of a design.

I also spent time learning more about auto layout. At first, auto layout felt slightly confusing because it changes how elements behave inside a frame. Once I started using it more, I could see how important it is for spacing, alignment and responsive design. It helped me think less about placing things randomly and more about how content should sit together. I used it to control gaps, padding, direction and the way sections resize. This made my layouts feel cleaner and more deliberate.

Another part of the week was using my asset file more properly. I have started building up a useful collection of icons, flags, avatars and other visual elements that I can bring into my designs when needed. This made me realise how helpful it is to have a working design library, even at a basic level. Instead of searching for the same type of icon or visual every time, I can start pulling from a set of assets that already fit the style of the project. It also makes the design process feel quicker and more professional.

I also touched on prototyping. I have not gone too deep into it yet, but I started experimenting with linking screens and making simple interactions. This helped me understand how a static design can start to feel like a real website or app. Even basic prototype links make it easier to test how someone would move through a page or click between sections. I can see how this will become useful when presenting ideas or testing a user journey before anything gets built.

The most useful thing I learned this week is that good Figma work is not just about making something look nice. It is about building designs in a way that makes sense. Components, auto layout and reusable assets all help make a file cleaner, easier to change and easier for someone else to understand. I am starting to see that the way a Figma file is organised matters just as much as the final visual design.

The difficult part was getting used to the rules of auto layout and understanding when to use it. Sometimes I wanted to move something freely, but auto layout would control the position. That was frustrating at first, but it also showed me that I need to think more carefully about structure before designing. I also need to keep practising components so I understand variants, overrides and how to build them properly.

Next week, I want to keep improving how I structure my Figma files. I want to use components more confidently, make my spacing more consistent, and start using auto layout naturally rather than only adding it afterwards. I also want to build more clickable prototypes so I can test how pages connect and make my designs feel closer to real websites.