Pixelmator - Create Vector Graphics From Scratch

Design vector based icons, glyphs, logos, posters, user interfaces and more.
4.7 (28 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
456 students enrolled
Instructed by Joe Marshall Design / Graphic Design
25% off
Take This Course
  • Lectures 36
  • Length 3 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 9/2014 English

Course Description

Learning to create vector icons, logos, user interfaces, buttons, and more is a growing trend for both the web and mobile devices. This course focuses on abstract and flat-design techniques using Pixelmator's Shapes. Shapes allow you create icons, glyphs, logos, posters, and more in a vector format that is scalable without losing image quality at any size. Once a Shape is created, you can reuse it allowing you to never re-create that shape from scratch again.

This course is taught in a relaxed, conversational, unscripted style. Recorded to capture what it is like to hear a designer's thoughts as the designing unfolds. No slides, PowerPoint presentations, or scripts are used. The course is lean, trimmed, and fast-paced but you can still learn at your own pace. The lessons are taught in Pixelmator and the techniques and tools used are presented as you need to know them.

By the end of the course you will have the knowledge to create your own Shapes from scratch using Pixelmator. You will also understand the process to create and deliver icons, logos, posters, user interfaces, buttons, and more. Plus over 60 Pixelmator Shapes included.

Techniques and topics covered include:

  • Vector vs. bitmap graphics
  • Working with Pixelmator Shapes
  • Style attributes that add details to Shapes created in Pixelmator
  • Editing Shapes using nodes and handles
  • Using existing Shapes to create custom shapes
  • Building complex Shapes
  • Implement the latest design trends in flat-design
  • Applying masks and clipping masks to Shapes in Pixelmator
  • Organizing and ordering layers
  • Applying gradients and color palettes to Shapes
  • Saving Shapes to the Shapes palette to reuse or share with others
  • Working with Text in Pixelmator
  • Includes instruction on Pixelmator's Pen Tool and Freeform Pen Tool
  • Lesson on how to utilize the Effects Browser
  • Converting Fonts to Shapes to create custom typography and Shapes
  • Just-in-time-learning to not overwhelm the student with Pixelmator's many features
  • And a lot more tips, keyboard shortcuts, and tricks along the way

Over 100 Pixelmator Shapes will be added to the course throughout the year!

What are the requirements?

  • Apple computer
  • A FREE 30-day trial of Pixelmator for Mac

What am I going to get from this course?

  • Master the skills and techniques involved in making icons, logos, glyphs, posters, and more using Pixelmator Shapes
  • 35 plus Pixelmator Shapes and a lot more coming...
  • Complete working knowledge of the Pixelmator Vector Tool Set
  • Apply trendy design techniques such as long shadows, flat design, and blurred backgrounds
  • Most students will be able to use Pixelmator as a replacement to Photoshop and Illustrator for everyday common graphic design tasks

Who is the target audience?

  • Anyone wanting to learn flat design and create vector-based graphics using Pixelmator
  • Anyone wanting to learn more about Pixelmator's vector tools
  • Anyone wanting to add a relevant design skill to offer to clients
  • Anyone with a basic eye for design, but want to learn more

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Introduction And Downloading Software

What we will cover in the course.


After downloading Pixelmator version 3.2 Sandstone or 3.3 Limestone you are ready to take this course.


By downloading Pixelmator 3.2 Sandstone or 3.3 Limestone you will be able to follow along with either version just fine. New students will obviously be using 3.3 but all features covered in the course are identical in operation.


Students will understand how to create presets to speed up workflows and understand the basic layout of Pixelmator.


Shift + Command + "V" is the mode we will use through out the remainder of the course. Pixelmator's "Vectormator mode" allows us to work with all the vector tools in a custom interface built into to Pixelmator.


Understanding the difference between a bitmap graphic and a vector based graphic is an essential element in taking this course. Students will have a firm understanding of the differences moving forward.

Section 2: Creating An Icon and Working With Shapes

We'll see how fast and easy it is to create a basic vector based icon in Pixelmator.


Importing more shapes from the Pixelmator website and putting them in our shapes palette.


Shape presets and styles can effect the way a shape looks and could cause unexpected results. In this video we cover ways to the shape looking the way we intended it to look from the beginning.

Section 3: Layers, Styles, Gradients, and Custom Shapes

Get a handle on layers and staying organized while creating graphics in Pixelmator.


Learn to use, create, and save your own layer styles. Layer styles allow you to easily apply a certain look to a layer instead of always recreating that look from scratch each time.


Using, creating, saving gradients in Pixelmator.


Creating, saving, exporting custom shapes to share in Pixelmator. Students will understand what goes into creating hundreds of glyphs, icons, or shapes for fun or for profit.

Section 4: Using Edit Mode To Create Custom Shapes

The secret to making any shape you can think up... Nodes and handles.


The long shadow is a popular design trend and we learn how to do it in Pixelmator.


Learn what is involved in working with complex shapes and creating long shadows.


In this lesson we learn about about smoothing paths the create a rounded look for our trophy shape.


We'll create a sail boat by simply flipping and rotating basic shapes and applying a few edits to them.

Section 5: Advanced Shapes - A Lighthouse And An Owl

Our shapes palette grows as we learn how to create a lighthouse and search light too.


Create a custom dusk sky gradient and use pre-exsisting shapes to create an owl night scene icon.

Section 6: Vector Compositions

Pixelmator updates to 3.3 Limestone.


Create a vector based ocean scene in Pixelmator using the shapes we created individually through out the course.


Pixelmator is great for vector based UI design for mobile apps or web based applications. We create a "record" button in this lesson.


Pixelmator can take text and convert it to shapes to be manipulated. Take a popular font and customize it to be a reusable shape.


Create text based logos quickly and easily using Pixelmators Vectomator Mode.

Section 7: Pixelmator Effects - Mixing Vector Graphics And Bitmap Graphics

Create a web form vector based in Pixelmator


Apply effects and learn about effects that can be applied in Pixelmator.

Section 8: Pixelmator Pen Tools

Single clicking method for creating straight lines in Pixelmator using the pen tool.


The click and drag method of creating lines with the pen tool.


A real world example of using the pen tool to create straight lines and curved lines in Pixelmator.


Learn to use the free form pen tool. It is like using a real pen!


A real world example of using the free from pen tool and the trade offs it can bring to your design workflow.

Section 9: Conclusion - More free Shapes

Thank you all for taking the course and completing it. Go make some awesome vector based graphics!

Section 10: Course Shapes Download

Course shapes and additional layer styles are contained as a download with this video.

Section 11: Extras: Student Q&A

The difference between scaling vs zooming is one of magnification. Zooming in on the canvas is like having a magnifying glass allowing us to see the make up of the elements better. In this case pixels on a computer screen. Scaling a vector based image such as a diamond is a "recalculation" of the image size regardless of what scale we are zoomed in on the vector image at.


If the corner radius isn't showing up when you drag the blue node go to "Pixelmator > Preferences> and check the box that says "Show Information Labels" that will get the label to show up.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Joe Marshall, iOS Developer & Designer

I started my design journey at a Fortune 500 company in print and publishing where I critiqued designs for quality and matching the clients needs as a final inspection before work was sent to clients. Since then I have gone on to consult on icon design, App Store submissions, and user experience, and even article writing. Some of my more recent work has included development on a kids game to help children learn numbers and letters. That app was voted #1 App-Of-The-Week. I also recently did design on an app for depression that was part of a Cambrige program in the United Kingdom. I consulted on an article about App Store Search for a blog on living well and being productive. I am currently designing icons for a Udemy course involving Pixelmator.I have three games in the Apple App Store, and I am working on my fourth game now, and an update to the first and second. Other projects are currently under non-disclosure agreements. I have been using Unity, Xcode, Blender, and Pixelmator as my go-to software applications on a daily basis for some time now and have plans to create courses on each in the future.

Ready to start learning?
Take This Course