Figma for Beginners: Design Your First App Screen Today

You do not need a degree in graphic design or a fancy computer to start designing beautiful app screens. Figma is free, runs right in your browser, and thousands of designers across Nigeria and Africa are using it to land freelance gigs, remote jobs, and client projects in 2026. Today, you are going to design your very first app screen, and it is going to be easier than you think.

What Is Figma and Why Should You Learn It?

Figma is a cloud-based design tool that lets you create user interfaces for mobile apps, websites, and digital products. Unlike older design tools that require you to download heavy software, Figma works directly in your web browser. That means whether you are using a laptop in Lagos, a desktop in Nairobi, or even a borrowed computer at a tech hub in Accra, you can open Figma and start designing right away.

So why is Figma such a big deal in 2026? Here are a few reasons:

• It is completely free for individual use and students, so you do not need to spend a single naira to get started.
• It is the industry standard. Most tech companies, startups, and design agencies list Figma as a required skill when hiring UI/UX designers.
• It supports real-time collaboration, meaning you and a teammate can work on the same design file at the same time, just like Google Docs.
• There is a massive community of designers sharing free templates, plugins, and tutorials, which makes learning faster.

If you want to earn money online as a designer, Figma is the single most important tool you need to learn. Freelance platforms like Upwork, Fiverr, and Contra are filled with clients looking for designers who know Figma. Learning this tool puts you in a position to start earning within weeks, not years.

Setting Up Figma and Getting Comfortable

Let us get you set up. Head over to figma.com and create a free account using your email or Google sign-in. Once you are in, you will see your Figma dashboard. This is where all your design files will live. Click the "New design file" button, and you will be taken to a blank canvas. Do not let the empty screen intimidate you. Think of it as a blank piece of paper waiting for your ideas.

Before you start designing, take a minute to look around the interface. Here are the key areas you need to know:

• The toolbar at the top gives you access to shapes, text, frames, and other essential tools.
• The layers panel on the left shows every element you place on the canvas, organized like a stack.
• The properties panel on the right lets you adjust colors, sizes, fonts, spacing, and other details of any selected element.
• The canvas in the center is your design playground where everything comes together.

Spend a few minutes clicking around. Draw a rectangle. Type some text. Change a color. Getting comfortable with where things are is half the battle. Figma is designed to feel intuitive, so trust the process and explore without fear of breaking anything. You can always undo with Ctrl+Z.

Designing Your First Mobile App Screen Step by Step

Now for the fun part. We are going to design a simple login screen for a mobile app. This is one of the most common screens in any app, and it is a perfect starting project because it teaches you the fundamentals of layout, typography, color, and buttons.

Step 1: Create a phone-sized frame. Select the Frame tool from the toolbar (or press the F key). On the right panel, you will see preset sizes. Choose "Android Small" or "iPhone 14" to get a realistic phone screen size. A frame will appear on your canvas. This is your artboard.

Step 2: Add a background color. Click on the frame, then go to the Fill section on the right panel. Change the color to a clean white (#FFFFFF) or a soft off-white (#F5F5F5). Simple backgrounds keep your design looking professional.

Step 3: Add a logo or app name. Select the Text tool (press T), click near the top of your frame, and type your app name. Make it bold, bump the font size up to 28 or 32, and center it. You can use a font like Inter, which is already built into Figma and looks modern and clean.

Step 4: Create input fields. Use the Rectangle tool (press R) to draw two rectangles, one for the email field and one for the password field. Make them about 320 pixels wide and 48 pixels tall. Round the corners to 8 pixels using the corner radius setting in the properties panel. Add a light gray border to each. Then use the Text tool to add placeholder text like "Email address" and "Password" inside each field.

Step 5: Design a button. Draw another rectangle below your input fields. This time, fill it with a bold color like blue (#2563EB) or green (#16A34A). Make it the same width as your input fields and about 48 pixels tall. Add white text that says "Log In" and center it inside the button. Round the corners to 8 pixels for a friendly look.

Step 6: Add finishing touches. Below the button, add a text link that says "Forgot password?" in a smaller font size. You can also add a line of text at the bottom that says "Don't have an account? Sign up" to make it feel like a real screen.

Congratulations! You have just designed your first mobile app screen in Figma. It might seem simple, but this exercise teaches you the core skills that every UI designer uses daily: working with frames, shapes, text, colors, and alignment.

What to Do Next on Your Figma Journey

Designing one screen is a great start, but turning this into a real skill that earns you money takes consistent practice and learning. Here is how to keep building momentum in 2026:

• Redesign apps you already use. Pick your favorite app, screenshot a screen, and try to recreate it in Figma. This is one of the fastest ways to improve.
• Learn about components and auto layout. These are powerful Figma features that help you design faster and keep your work organized.
• Study design fundamentals like color theory, typography, spacing, and visual hierarchy. Great design is not just about tools. It is about understanding what looks good and why.
• Build a portfolio. Even your practice projects can go into a portfolio. Potential clients and employers want to see what you can do, not just what certificates you have.
• Join design communities online. Twitter (X), LinkedIn, and Discord groups are full of African designers sharing tips, job leads, and feedback on each other's work.

The design industry is booming across Africa, and companies around the world are hiring remote designers. Figma is your gateway into this world. You do not need permission to start. You do not need expensive tools. You just need to open Figma, start creating, and keep showing up every day.

The fact that you read this far tells me you are serious about learning. That energy is exactly what separates people who talk about tech from people who actually build careers in tech. Keep going. Your future self will thank you.