How to Design Flat Icons in Affinity Designer: Introduction

Welcome to How to Design Flat Icons in Affinity Designer, a four-part video series to help you learn how to design flat icons in Affinity Designer.

How to Design Flat Icons in Affinity Designer: Introduction

Find more incredible Design & Illustration Courses on ThemeKeeper Tuts+. And get amazing vector resources for your projects on ThemeKeeper Market.

Course Introduction

Icon design is an essential skill every designer should learn. With this knowledge, you can create amazing symbols and characters for any design or illustration project. This is an ideal series for beginners to app design, and you can later program these icons with special functions.

In this course, instructor Yulia Sokolova will show you the step-by-step process of creating a set of colorful shopping icons using the software Affinity Designer.

How to Design Flat Icons in Affinity Designer: Introduction

Learn how to create these icons using simple shapes and tools, while exploring different methods for combining and modifying these shapes. Enjoy a complete set of six icons you can use for various projects!

How to Create a Shopping Bag Icon

Let’s begin with the very first icon, the shopping bag. In this lesson, Yulia Sokolova will use the Draw Persona function to create vector graphics in Affinity Designer.

Create a new Web file at 800×600 pixels.

Use the Rectangle Tool (M) to draw a pink rectangle. Modify the shape of the rectangle by selecting the upper left and right nodes and using the Transform panel to push them inward.

How to Design Flat Icons in Affinity Designer: Introduction

Then use the Ellipse Tool (L) to create the holes for the handles of the bag.

Follow up with the rounded handle, using the Pen Tool (P) to create the shape. Convert it to a rounded shape, and modify the nodes for a taller handle.

How to Design Flat Icons in Affinity Designer: Introduction

Add details to the shopping bag using the Rectangle Tool (M) once again. Place it into a bright, light blue circle and create a trendy long shadow effect to complete the first icon.

How to Design Flat Icons in Affinity Designer: Introduction

Want More?

Congratulations on your first icon! Let’s continue with the second design in the next lesson. There we’ll learn how to create a colorful discount badge icon with a few simple shapes.

Find creative assets for your designs on ThemeKeeper Elements.

And for more amazing lessons on Affinity Designer, check out these tutorials:

  • How to Design Flat Icons in Affinity Designer: Introduction
    Icon Design
    How to Create Flat Profession Avatars in Adobe Illustrator
    Yulia Sokolova

     

  • How to Design Flat Icons in Affinity Designer: Introduction
    Affinity Designer
    How to Create a Set of Flat Hiking Icons in Affinity Designer
    Yulia Sokolova