Freelance Designer 101: Design Process & Figma File Organization

Hey guys! 👋

In my previous posts, I covered the first contact with your client, pricing strategies, and project proposal.

In this edition, I’ll show you how I approach the design process and organize Figma files for efficiency and collaboration.

Ready? Let's dive in.

The design process for freelance projects is a little different from what you might be used to as a product or UX designer. There’s usually less data, fewer insights, and minimal user analysis to work with, so you have to stay flexible and think on your feet. That said, I still try to gather as many insights as I can from whatever sources are available.

Here’s what my typical freelance design process looks like:

As you can see, I combine research with moodboarding. The reason is simple: for many projects — especially for new brands just starting out — there’s little to no data or insights to rely on.

For redesign projects, I usually have something to work with, like user behavior insights, feedback, Google Analytics data, or even session recordings. But when a company is just beginning its digital journey, the input is often very limited.

So, how do I make sure I have at least some direction? The answer lies in combining competitor research, public data, and client input. 

Looking at competitors is a great way to get a sense of the industry. It helps you identify common patterns, trends, and visual languages that are working for others. Sure, their decisions might not always be backed by solid data or proper research, but it still paints a helpful picture of what’s happening in their space.

Publicly available data is another goldmine for gathering insights. It’s not always perfect, but it can give you clues about what customers in a particular industry struggle with or expect. Before diving into competitor research, I’ll often look up industry trends, market research, or reports on sites like statista.com. A quick Google search for “[industry] mobile usage” can also be incredibly useful.

Don’t underestimate your client’s knowledge. They know their industry, work with their customers directly, and can provide valuable insights into their audience. Their input often helps shape the visual language and approach for the project.

I like to create two moodboards for each project:

This moodboard is based on the client’s input. It might include examples they’ve shared, websites they admire, or any references and ideas they’ve provided. 

The second moodboard comes from my own research and findings, including insights from competitor research, public data, and industry trends.

By combining these two moodboards, I can visually explain how the client’s input and my research come together to shape the project. It’s an effective way to show how everything aligns with their goals and the proposed visual direction. This collaborative process not only builds trust but also ensures we’re on the same page before moving forward.

Visual directions are one of the most crucial steps in the design process. This is where you set the tone for the entire project, aligning with the client’s expectations and establishing the vibe and feel that will guide everything moving forward.

I avoid focusing on a single direction and prefer to explore a few options instead. Sharing multiple visual directions with clients has two major benefits:

When presenting visual directions, I always include my thought process, along with notes and comments to explain the rationale behind each option. For larger projects, I prefer to book a call to walk the client through the concepts, giving me the chance to explain the ideas in detail and answer any questions.

I prefer an iterative process that incorporates client feedback at every step, which is why I always include project milestones — even for smaller projects. Milestones help us stay aligned by breaking the project into manageable steps and closing each one before moving to the next.

For example, in a website redesign project, the homepage might serve as the first milestone (after selecting the visual direction). Once the homepage is finalized through a few rounds of feedback, I align with the client one last time before starting on the next milestone.

This approach not only reduces the risk of major changes when the project is nearly finished but also gives clients a stronger sense of progress and control throughout the process.

Asking for feedback is a skill in itself. You can’t just send clients a bunch of links, prototypes, or moodboards with a casual “Hey, your thoughts?” and expect meaningful input.

You need to guide your clients through the feedback process. This means:

Teaching clients how to give constructive feedback not only streamlines the process but also avoids unnecessary revisions and misunderstandings.

I’m planning to dive deeper into this topic in a future post, covering how to ask for feedback, manage project communication, and handle negative feedback effectively.

It wouldn’t be me if I skipped creating a design system (DS). Even for smaller projects, I make it a habit to save styles (like colors and typography) and create simple components.

Why? It keeps my files organized and makes it easy to revisit projects later — because let’s be honest, I’m not going to remember all the styles or final design system details months down the line. 😅 Plus, once it becomes a habit, it significantly speeds up your workflow.

For bigger projects or any branding work, I also prepare a style guide for my clients. This is a simpler and more client-friendly version of the design system and usually includes:

Having a design system or style guide isn’t just about keeping things neat; it’s a tool for consistency and efficiency — for both you and your clients.

When the project wraps up, I make sure to prepare all the final assets for my clients — or their developers. To keep things simple, I use Google Drive to organize everything into folders and share a single, easy-to-access link.

For a website redesign, I typically include:

I also often prepare a Figma file with Loom instructions explaining how to update and edit banners, templates, or visuals I’ve created. This ensures that clients (or their teams) can make small updates on their own without feeling stuck.

When I work with a developer, I take extra care to organize my Figma file differently. I include more detailed notes and user flows to ensure it’s crystal clear what the entire user journey looks like.

In some cases, I’ll also create Loom instructions to explain how to optimize images for performance and approach more complex or challenging design elements.

Ideally, I’ll schedule a handoff call with the developer to review everything together. This gives them a chance to ask questions and ensures they have all the screens, assets, and notes they need to move forward confidently.

Once all the assets and instructions are prepared, I like to schedule a final chat to ensure there are no questions and everything is clear.

For Webflow design projects, I also include a separate training session to walk clients through making basic updates and changes on their own — so they don’t feel stuck or have to rely on me for every tweak.

This final call is also the perfect time to gather feedback on the overall project and end things on a positive note.

Afterward, I wrap up with a few final steps:

My Figma file organization mirrors my design process. For most projects, I start with research and moodboarding, move on to creating visual directions, incorporate feedback after each milestone (e.g., hero section, homepage, or sign-up flow), and finally collect all deliverables in one place.

I use a few templates depending on the project’s type and size. Some files are less polished (and never shown to clients), while others are structured with developer or client handoff in mind.

For a typical mid-sized design project — like a website or mobile app — I create the following pages:

Now, do you think this is the same file I share with my clients? Hell, no!

This file, while it contains everything I’ll eventually share with my clients, is strictly for me. It’s the project’s behind-the-scenes: full of history, drafts, and experiments. It’s chaotic, unorganized, and very much a work-in-progress.

When I need client feedback directly in Figma, or if I want to share a prototype or visuals through a Figma link, I prepare a separate clean file. This version is distraction-free and client-friendly — because let’s face it, no one wants to see your design mess. 😅

By the end of each project, I usually have two Figma files:

But here’s the catch: to maintain this level of organization, you need to pay for Figma team. And be careful — if you invite clients or anyone else to your team, you’ll end up paying for their seats too.

To avoid this, I provide .fig files along with Loom instructions for my clients instead of inviting them to collaborate or comment directly in my Figma team. This way, they get exactly what they need without adding unnecessary costs to my workflow.

And that’s a behind-the-scenes look at my design process and Figma file organization. From research and moodboarding to creating clean, client-ready files, every step is about working smarter, not harder.

The key takeaway? A well-organized workflow doesn’t just save you time — it builds trust with your clients, ensures smoother communication, and helps you deliver better results. Whether it’s managing chaotic drafts, exploring clear visual directions, or preparing thoughtful handoffs, staying organized is your biggest ally as a freelance designer.

That’s all for today! If you found the newsletter interesting, don’t forget to share it with your friends 😉. And if you have any cool links to share - drop them my way. 📮

See you next time!
Kristina

P.S. To ensure you don't miss any future editions, consider adding my email to your contacts, primary inbox or whitelisting it. I promise, no spam - just a good cup of Designer's Coffee each month! ☕