This is a glossary about the most common design terms we are using so that we are on the same page.
The term advertorial is a portmanteau of the words “advertisement” and “editorial.”
It’s an article in a magazine, newspaper, or website, a TV, radio, or podcast segment providing information on a product, and a strategically placed CTA. The advertised brand usually pays the publisher for its content to be featured. The term was first coined in 1946, according to Merriam-Webster.
The purpose is to provide in-depth information about a product for a potential customer; the advertorial is generally more detailed than a general advertisement. Advertorials are usually written by an agency or by the client.
In most countries, magazines, TV, or radio stations are obliged by law to declare the advertorial as paid advertising.
Accessibility in Design means that it is accessible to all potential consumer groups. The emphasis is on making the design accessible to the target user, the non-target group, and users with disabilities such as visual, motor, cognitive, speech, or hearing impairments.
Accessibility laws ensure that content is accessible to all users with or without impairment; a designer’s role and responsibility is to implement these laws in everyday design.
The graphic and UI design must be easy to understand and navigate for the largest group of people.
The WCAG has defined four official principles for accessibility:
Improving the accessibility of your design strengthens your brand and improves website ranking and SEO.
“Good [accessible] design happens when you view your [design] from many different perspectives or lenses.” The Art of Game Design: A Book of Lenses.
The Alpha Channel indicates the transparency of an image or video footage. It is also used in 3D graphics to create additional textures for the reflectivity, bump,
displacement, or visibility properties influencing the rendered texture of a 3D model. The Alpha Channel contains no color information, only transparency information. It is visualized in the channel as a black and white image.
The value of Alpha can be measured as a real value, a percentage, or an integer: The full transparency is defined as 0.0 ; 0% or 0, visualized in the Alpha Channel as pure black, the full opacity is defined as 1.0, 100%, or 255, visualized in the Alpha Channel as pure white.
If you, for example, reduce the opacity of the overlying layer to alpha = 60%, the color of the underlying layer will become visible at 40% opacity in the areas where both layers overlap. The resulting color-blending effect will create the illusion of an entirely new color tforthe viewer.
The image formats that contain the Alpha Channel are generally composed of the following components:
R = Red Channel
G = Green Channel
B = Blue Channel
A = Alpha Channel
Read more: What is the Alpha Channel ->
A tool found inside the Arrange Tab. It allows you to line up two or more layers against each other, or line up layers to the edges of an Artboard or group.
Read more: How to align objects in Vectornator ➞
Anchor Point (or Bèzier Node)
Points that connect paths on a vector tool.
Read more: Editing Bèzier Nodes ➞
Artboards are a layer type that displays different pages of your design in a fixed frame on the canvas. You don’t need to switch documents if you want to view different pages of your designs. This function is handy for many design projects, especially web design and designing business cards.
Read more: Using Artboards in design ➞
An ascender in typography is the upward portion of a lowercase letter that extends beyond the main line and x-height of a typeface. These ascending extensions are also called arcs, stems, or hooks, depending on the shape of the shape they reflect. Typical letters that have ascenders are b, d, f, h, i, k, l, and t. The ascender level is the level reached by ascenders, and it is called the "Ascending Line." Uppercase letters do not have ascenders.
For most typefaces, the height of ascenders is a crucial element. In typography, ascenders improve legibility and make it easier for the reader to recognize and read letters.The ascenders of some fonts are long and extend beyond the centerline; in others, they are short and extend only slightly beyond. Short ascenders tend to make letters appear wider.
Some ascenders may be straight, while others are slanted. In cursive and calligraphy, swirls and loops are twisted and extend beyond other letters. These ascenders that extend beyond the x-height hinder the readability of the text.
The Aspect Ratio of an image is the ratio of its width to its height, it can be displayed as a ratio or as a decimal number. It is expressed with two numbers separated by a colon, such as 16:9, sixteen-to-nine.
The Aspect Ratio in a broader sense means the ratio of at least two sides of a polygon or a two-dimensional surface. Most often, it is used to indicate the ratio of the width of a rectangle to its height. For the x:y Aspect Ratio, the image is x units wide and y units high.
Aspect Ratio width = x Aspect Ratio height = y
The Aspect Ratio width to height is specified in the format x: y, but in cinema y: x, i.e. height to width. The Aspect Ratio is frequently defined for screens as a fraction x:y (e.g.16:9), generally this fraction is also normalized to 1 and rounded if necessary (e.g. 1.78:1).
Frequently occurring ratios are 1.85:1 and 2.39:1 in cinematography, 4:3 and 16:9 in television photography, and 3:2 in still photography. A square has an Aspect Ratio of 1:1.
Display Aspect Ratio
The Display Aspect Ratio (DAR) initially only indicates the ratio of the width to the height (in length units, such as cm) of the image on the output medium. However, it is typically also used to refer to the ratio of the width to the height of the part of the output medium on which an image is to be displayed (undistorted) (correctly called Original Aspect Ratio or OAR).
Pixel Aspect Ratio
Pixel Aspect Ratio (PAR) is the ratio of the width of a pixel (usually abbreviated to x) to its height (usually abbreviated to y). The Pixel Aspect Ratio can be determined from the ratio of the display of an image DAR (DisplayAspect Ratio) (e.g. 16:9) and the ratio of the image resolution SAR(Storage Aspect Ratio) (e.g. 1440:1080).
Read more: What is the Aspect Ratio ➞
Turning an image into vectors with just one tap. The Auto Trace feature enables you to convert any raster image (JPEG or PNG) into vector artwork.
With this feature, you can create a completely new image based on an existing piece of artwork or a reference photo without having to draw the vector shapes by hand. You can trace a sketch that you have drawn on paper into vector artwork.
Read more: How to vectorize an image ➞
Bézier Curves is the mathematical name used to create curves in almost all graphic design software and that can be defined by the the "Start" and "End" point, and the type of Handles of each Bézier Node.
Each Path goes from the "Start" point to the "End" point while the Node Handles define its curvature, giving it the name of "Curves".
Most design tools allow you to draw Bézier curves thanks to the Pen Tool and let you define those 4 parameters:
- Bézier Nodes (often called simply points)
We refer to "nodes" as all the points that compose a path.
Any curves can preferably be composed by a minimum of 2 nodes.
The Handles are used to control the curve direction and will define the shape's path.
Lines are the connection between 2 single points (without handles).
Read more: Creating curves with the Pen tool ➞
They allow you to create new paths and complex shapes. The term “boolean” describes how shapes are combined, using values such as “and”, “or,” “not,” or a combination of these.
At its core, “Boolean” is a logic term that can be either “true” or “false,” and is commonly used in computer programming. In terms of graphics design, the meaning is quite similar. We use “boolean” to describe how shapes are combined, using values such as “and”, “or,” “not,” or a combination of these. Getting too technical?
Simply put, Boolean operations are a very powerful tool for any product or graphic design project. A complicated-looking shape can be constructed in no time using the five Boolean operations present in Vectornator, namely Union, Subtract, Intersect, Difference, and Divide. You’ll find these operations at the top of the Path Tab.
Creating complex shapes is something you’ll inevitably come across in your design process, so let’s take a deeper look at how these 5 options works in a vector design software as Vectornator:
Brand Guide/ Style Guide
The brand guide is a tool to collect and organize the style elements of the brand identity of a company, product, or institution. The brand guide is an orientation for freelancers and employees on representing the company and maintaining visual consistency.
Brand colors (usually cataloged with hex numbers, RGB values for screen display, and CMYK values for print) are essential aspects that will be defined. Additionally outlined are the color combination rules, the font type(s), formatting, capitalization, logo, layout, style, spacing, the tone of voice of the copy, and the guidelines for graphics, images, and videos.
Sometimes, the brand guide can contain additional technical, ethical, or legal specifications such as non-disclosure agreements. The brand or style guide makes your brand recognizable and identifiable, as the visual and legible representation follows rules that ensure visual consistency.
A brand guide is of utmost importance in establishing a brand or rebranding an existing company, product, or institution.
A tool used for drawing freeform paths with variable widths, also known as tapered paths. You can find it inside the Toolbar (left side, sixt icon from the top) or by pressing the ~key~ B ~key~ keyboard shortcut.
Read more: How can I draw Brush Strokes?
The color wheel was created by Newton so that relationships between colors were easier to define and identify. He decided to display the color spectrum in a circle because he felt that indigo (the last color in the color wheel) was similar to the first color, red.
This wheel is comprised of three main color categories:
- Primary colors: red, yellow, and blue
- Secondary colors: orange, green, and violet
- Tertiary colors: red-orange, yellow-orange, yellow-green, blue-green, blue-violet, and red-violet
Read more: Using the Color Wheel to Create Designs ->
A compound path consists of two or more paths that are connected. Compound paths are used when you need to show a part of an underlying object through a hole or intersection in another shape; for example, you have created a complex shape using Boolean Operations.
For example, when you perform the Boolean Operation Subtract ~ic-boolean-subtract~~ic-boolean-subtract~, you create a new compound path consisting of the upper and the underlying shape, removing the intersecting path area of the underlying shape from the newly created compound path.
All the paths included in the compound path will behave as a unit. For example, you can combine paths that will then automatically share their color properties. All components in the compound path take on the properties of the bottom-most object in the stacking order.
To create a compound path in Vectornator, tap/click the button Combine Path~ic-combine-path~~ic-combine-path~ located in the Inspector (on the right side of your screen). When you select the compound path, the whole compound path will be selected, as you cannot view individual components of the compound path in the Layers Tab. However, you can select and move the path components if you tap/click directly on a single path (not on the fill) and even edit its shape using the Node Tool.
To split a compound path into its original separate paths, you can use the button Separate Path ~ic-separate-path~~ic-separate-path~ in the Paths section of the Inspector in Vectornator.
CTA (call to action)
A call to action is a short sentence to encourage the reader to buy or browse a specific product, subscribe to a newsletter, download an asset, visit a link or increase overall conversion rates. The sentence should be short and use strong verbs. The call of action is mainly included at the end of a landing page, general text body, or marketing post.
A descender is the portion of a letter that descends below the baseline.
Read more: What is a Descender ➞
Decay & Radius (Spiral)
A spiral or helical line is a curve that circles a point or axis and moves away from or closer to that center, depending on the viewer's perspective.It is a curve that emits from a central point, moving further away as it rotates around the central point. The Spiral is circling in a continuous and gradually widening (or tightening) curve, either around a central point on a flat plane or around a vertical or horizontal axis. A spiral can rotate clockwise or counterclockwise. The spiral curve can be found frequently in nature.
A spiral can be either two-dimensional or be three-dimensional. The three-dimensional variation of the spiral is called the Helix. (The Double-Helix Structure of DNA is an example of a three-dimensional spiral.)
The amount of the progressive widening (or tightening) of the curve is called decay. The decay indicates how fast the spiral tapers to its rotation point. The larger the amount of decay, the faster the spiral is tapered to the central point and vice versa. If a spiral has an initial radius, it signifies that the starting point of the tapering rotation does not begin at the central point. The delayed rotation in the center of the shape creates an inner emptiness radius that is defined as the initial radius.
If you want to know more about spirals in Vectornator, you can read more here ->
PPI (pixels per inch) refers to the pixel density of a digital image. It signifies how many pixels are placed within a 1-inch line. The PPI metric is used with digital cameras, monitors, screens, scanners, displays, and projectors.
The following attributes define the PPI metric:
- The color value can range from 1-48 bit
- Fixed-size per pixel
- Every pixel is filled with a singular color
There’s no PPI set for vector images, as vectors do not consist of pixels but on a mathematical equation. Nevertheless, a target printing size (DPI) must be defined before printing the vector file.
DPI is an abbreviation for dots per inch. It’s a measurement used in video scanners, image scanners, or printing. It signifies the number of dots placed in a line within an inch. DPI denotes the dot density of an image when it is reproduced in the physical world, as a printed paper f.e.x. It refers to the output resolution of a printer, video scanner, or image scanner.
You can calculate the DPI resolution with the following equation: DPI = dots/length (inch) = dots/in = dots * 25.4 mm/mm
The terms emboss or deboss originated from printing, where a protruding (emboss) or indented (deboss) pattern, shape, or letter is printed on paper. The technique is often used in marketing material to give it a luxurious and haptic feel. Thick materials are optimal in making the effect visible when printed.
In some cases, the embossing or debossing technique is called a 3D effect or a bevel effect if the design protrudes. In digital art and design, the embossing or debossing effect can be created on shapes or letters digitally by adding strategically placed shadows, highlights, or inner visual lines on shapes or letters.
As the name suggests, freeform paths can be drawn freely without setting Anchor Points by clicking or tapping on the canvas, like when using the Pen Tool. The behavior of a freeform path can be compared to a pen or brush drawing freely on paper. Freeform paths can be drawn with variable widths. In Vectornator, you can draw freeform paths with the Pencil Tool or the Brush Tool. The Bézier Curves of these paths can be edited by selecting the path and activating the Node Tool.
Learn more about paths in Vectornator →
The Golden Ratio is a mathematical formula that yields the number 1.618. When used effectively, it creates designs that can achieve a balance of beauty whether you're designing typography, UI/UX, or a logo.
Read more: What is the Golden Ratio ➞
A gradient consists of an interpolated range of mixed colors (two or more) to make design elements visually more striking. You can create a visual emphasis with gradients and subtly beautify an interface. Gradients are an ideal way to add depth and dimension to your design.
There are different types of Gradients; the most commonly known are the Linear Gradient, the Radial Gradient, and the Angle (Cone) Gradient.
In a Linear Gradient, the colors flow in a single direction, from left to right or top to bottom. In digital graphics, the Radial Gradient creates a gradient that emanates from the center of a circle. This gradient type is optimal to use for round or circular shapes.
With a conic gradient, the colors transition as if spun around the center of a circle, starting at the top. In a Radial Gradient, the colors emanate from the center outward in all directions.
Read more: Gradients in Vectornator ➞
The Hero image is the first image or banner that greets you when you visit a website landing page. The image is commonly placed at the front and center of the website landing page. It generally covers the complete width of a webpage and leaves only space for navigation bars and CTAs.
The Hero image can consist of an image with added text or can be dynamic ( carousel images, f.ex.) or static. This is the image that every visitor sees before he starts scrolling down the landing page or visiting site menu links. It’s the business card of the website of your company. The placement of Hero images gives you the advantages of visual appeal, readability, interactivity, and storytelling.
Every company only has a few seconds to leave a positive impression or spark the visitor's interest with a presumably short attention span; that’s why a hero image's resolution and overall aesthetic quality need to be outstanding. A compelling Hero image lets people remain on your site and possibly turn them into future customers.
HSB (hue, saturation, brightness)
HSB stands for hue, saturation, and brightness in color theory and graphic design. In some cases, it is HSV (hue, saturation, and value) or HSL (hue, saturation, and lightness).
The hue is the main property of color, a number between 0 and 360. Hue is the color it most resembles on the color wheel, from 0° to 360°. As an agreement, the hue for red is set to 0° for most color spaces with a hue. The hue is measured in degrees on the color wheel. In painting, the hue is the pure color pigment without added white or black pigment.
Saturation is the richness and intensity of a color. The saturation of a colorcan be measured with a number between 0 and 100. 100% is the richest, most saturated version of a color, 0% will be a light gray for light colors and a dark gray for dark colors.
The brightness of color can be measured with a number between 0 and 100. 0% brightness is defined as pure black, 100% brightness is defined as pure white.
In graphic design programs, the HSB values are generally organized with three sliders:
In Vectornator, you can access the HSB values (B) by clicking directly on a Color Well and pick the Color Slider (A).
Read more: Adjusting the HSB values in Vectornator ➞
The Isolation State is used to edit objects or paths within a mask, compound path, or group. When you enter the Isolate State, anything not within the isolated object will appear dimmed out. To enter Isolate State you can simply double-tap / click the object you want to edit. Then, repeat the action to exit.
Read more: Editing masks in Isolate State ➞
The amount of space between two letters and the process of adjusting that space.
Read more: What is Kerning ➞
Leading / Line Height
The spacing between the baselines of the typeface.
Read more: What is Leading ➞
The general term logo signifies all marks that represent a brand.
When designing a logo, one of the most important questions is if you want to design it as a logomark or logotype.
The difference between these two terms is that the logomark is a symbolic icon, a pictorial logo. Some of the most known examples are the Apple shape with the bite mark by Apple and the bluebird from Twitter.
A logotype, often called a wordmark or lettermark, is the logo in letter form. Two well-known examples are Google and Coca-Cola.
A combination logo is a logomark combined with a logomark. The pictorial logo is firmly implemented with the logotype, both elements are necessary to identify the company brand. An example of a combination logo is the Dove logo.
Margin and Padding
The terms margin and padding are specific layout terms. The layout term margin signifies the empty space around an element. The layout term padding signifies the space between the element content and its child elements or inner borders.
The implementation of margin and padding in layouts assures the clear structure and readability of the content. The correct margin and padding placement prevent the UI from becoming too crowded or empty.
Read more: Layout Design
Masks are used to define which parts of a shape are visible. The overlying Clipping Mask shape defines the visibility of the underlying shape.
Read more: Masking Objects in Vectornator ➞
A mockup is a presentation of a product that showcases it in action. Mockups are often used in presentations or design and product proposals. The purpose of a mockup is to communicate to team members, potential clients, or investors the final version of the product before starting the design and production process.
The main advantages of creating a mockup are:
- Inform and convince clients to purchase the product.
- Pitch your product to investors
- Communicate your product vision to team members for clarification
- Visualize the final version of your product
- Create a visual library for marketing assets.
These are the most predominantly used mockup types:
- Print mockups
- Device mockups
- Branding mockups
- Packaging mockups
- Product mockups
- Social media mockups
While using the iPad, you can work on more than one app or document simultaneously. With iPadOS, you have three following Multitasking Modes available:
1. The Split View
The Split View Button
The apps are arranged side-by-side on your screen, and you can drag the slider, the so-called app divider, that appears between the app windows to the left or to the right, to adjust the screen view.
In Vectornator, you can use the Split view to import an image via drag & drop, visualize two documents at the same time, or even drag and drop color palettes from Procreate.
Read more in our Learning Hub on how you can import an image into Vectornator via Split Screen view.
This feature is also very useful if you want to drag & drop color palettes directly from Procreate into the Color Palettes Menu of Vectornator.
2. The Slide Over View
The Slider Over Button:
One app or several apps appear in a smaller floating window on the screen. If you have multiple apps opened, you can use your finger to swipe and bring a specific window to the top of the window stack.
3. The Center Over View
The Center Over Button:
The Center Over View displays a selected element in the center of your screen. The Center Over View view is only applicable with apps that support this feature. In Vectornator, for example, it’s used when you tap on Learning Content. You can start Multitasking on your iPad by using the Multitasking Menu, the Dock, or the Spotlight.
Read more about the steps on how to activate the different Multitasking Modi in the Apple documentation ->
Native advertising is sponsored content that adapts to the platform it’s presented on. It functions similarly to an advertorial; the word native signifies the seamless blending of the advertising into the media type. For potential consumers, it can be challenging to identify the presented content at first.
Contemporary platforms of native advertising are promoted articles, videos, commentary, music, and many more.
To prevent the potential consumer from being deceived, the content must be disclosed as such. Commonly used terms to identify the displayed content as a native advertisement are “Advertisement,” “Ad,” “Promoted,” “Sponsored,” “Featured Partner,” or “Suggested Post,” “Promoted by [brand],” “Sponsored by [brand],” or “Presented by [brand]” in the corner or bottom of ads or subtitles.
The currently most commonly used native advertising can be found in the in-feed of apps.
In-feed native advertising in apps. Due to the dramatic increase in native advertising on social media platforms and blogs, the Federal Trade Commission released specific Endorsement Guidelines in 2009 for consumers to identify native advertising.
Node Types are created by handles that extend from a Bézier Node when set as either Single, Mirrored, Asymmetric or Disconnected
If you activate the Bézier Curve function, your Node converts into a Bézier Node. Once the Node has been converted into a Bézier Node, you can choose between four different Bézier Node Types: The Single Node, the Mirrored Node, the Asymmetric Node, and the Disconnected Node. These Node Types are created by the handles that extend from the Bézier Node and their orientation and behaviour.
Read more: Changing Node Types ➞
See term Margin ->
The outline of a vector shape between two vector points. Paths are vector lines made of a minimum of two points connected by a straight line segment.
- They can be created by using the Line Tool or tapping anywhere on the canvas with the Pen Tool to create connected anchor points.
- You select paths for editing with the Selection Tool in the Toolbar or by pressing <key>P<key>. A bounding box will appear around the entire path, and this will also activate the Quick Actions menus (available only on iPad or iPhone).
- The Direct Selection (also called the Node Tool) can also be used to select instead the Bézier Nodes that compose your path.
- We often refer to `paths` as any line (straight or curved) that links two nodes.
Read more: Vector Paths ➞
A tool used for creating custom paths. You can find it inside the Toolbar (left side, fifth icon from the top) or by pressing the ~key~ P ~key~ keyboard shortcut.
The Pen Tool allows you to create Bézier curves (also known as vector paths) that you can draw, curve, edit, and close. Their direction and angle are determined by the position of the node handles.
Read more: What is the Pen Tool ➞
A tool used to create freehand paths. You can find it inside the Toolbar (left side, fifth icon from the top) or by pressing the ~key~ W ~key~ keyboard shortcut.
The Pencil Tool works like a freehand tool and allows you to create a vector path that follows the path of your hand. It can follow it precisely, or follow it with a more consistent line, depending on the Smoothness you set.
Read more: Drawing vector paths with the Pencil Tool ➞
Photobashing is a technique where you paint, blend and merge 3D assets and photos into a new composition. Important are the correct alignment lines of the assets and photos and the angle of light incidence to create a convincing final artwork.
The 3D assets will be rendered and exported as images from the 3D software and will be imported and blended with imported photos into an image editing software.
Some commonly used software applications for photo bashing are Photoshop, Inkscape, GIMP, Krita, XPaint, and many more.
Photo bashing was developed by concept artists, matte painting artists, and game environment artists to speed up the creation of landscape or background visualizations significantly. The technique can create matte paintings much faster than classic ones painted from scratch.
The difference between photoshopping, digital art and photobashing is that photoshopping alters an image but keeps the underlying structure intact. Photobashing composes and merges several images of different origins, like photography and 3D. Digital art on the contrary is created from scratch without the addition of outside imported images.
The Pivot Point is the center of rotation of an object.
This can be compared to a wheel that rotates around its own axis, the axis here is the Pivot Point of the wheel.
In graphical programs, the Pivot Point is generally located in the center of the object by default. This can be seen when an object or a shape is selected and the transform functions are activated. The bounding box will be automatically displayed with a small circle in the middle. The circle indicates the Pivot Point of the object or shape.
In most graphics programs, the pivot can be shifted from the center of the bounding box to any place in the document. It is normally sufficient to simply select the Pivot Point and then tap/click onto a new position. The object will now rotate around the newly positioned Pivot Point.
Watch the video: How to Rotate Shapes in Vectornator changing the Pivot Point.
Rule of Thirds
The rule of thirds is a design rule for the composition of a frame in graphic design, UX/UI design, traditional painting, film, or photography. This design technique was first written down by John Thomas Smith in 1797.
The rule of thumb is to divide the frame into nine evenly spaced parts; the image is separated by two equally spaced horizontal lines and two evenly spaced vertical lines. It is proclaimed that arranging the visible objects within the frame along those vertical and horizontal lines creates a more visually appealing composition.
Read more about when to break and follow the rule of thirds
The Scissor Tool can be used to split an existing shape or paths between two bézier nodes.
A shadow is a dark area where light emitted from a light source is blocked by an opaque object.
Shadows are shaped because light cannot transit through the opaque object. The object blocks the light and forces it to move past the blocking object and onto the next surface. The resulting shadow is a two-dimensional shape or a reverse projection of the object blocking the light. The size of a shadow depends on the distance between the light source and the object blocking it. The closer the item is to the light source, the more it obstructs the light, resulting in a bigger, softer shadow. If the object is more distant, the shadow becomes sharper and smaller.
Natural Shadows: They are created by sunlight. The angle of the sunshine supply determines the length of the shadow. At sunrise and sunset, the low angle of the sun makes the longest shadows. The shortest shadows area is unit shaped at high noon, once the sun is highest within the sky.
Artificial Shadows: This includes all shadows that are created by an artificial light source.
Not all shadows are black. This attribute sets the color of your shadow, it will change what color the shadow is (in case you don't want to use the default grayish color). In Vectornator, as with any other design software, you can set the color of your shadow. Read more about it in our Learning Hub →
The Shadow Offset value changes the location of the shadow in relation to the element's frame.
You can offset the shadow to change the direction the shadow is cast - how far from the shadow-casting layer and in which direction. That means we have two controllable Offset properties:
- Distance from the shadow to the shadow-casting object
- Direction of the shadow to the shadow-casting object.
In most programming languages, there are two values to set the shadow offset. <offset-x> generally specifies the horizontal distance, <offset-y> generally specifies the vertical distance.
In Vectornator you can adjust the distance of the shadow to the shadow-casting object with the Offset Slider, the direction of the Shadow Offset can be adjusted with the Shadow Rotation Wheel.
The shadow opacity will define how opaque the shadow is.
The Shadow Opacity can be adjusted in Vectornator by clicking on the Shadow Color Well and then moving the Transparency Slider.
Read more: How to add Shadows in Vectornator ->
The Shape Tool allows you to create pre-made geometric shapes, such as rectangles, circles, polygons, or straight lines, but also stars and spirals.
Read more: How to create pre-made shapes ->
In digital design, a style that mimics materials and dimensionality to create a connection to real life objects. It can guide customers to follow intended actions and imply usage through familiarity. For example, some desktop operating systems use a trash can or recycle bin icon to represent the deletion of files. Or, Skeuomorphic Icons (also called 3D icons) are designed to imitate their real-life counterparts.
Skeuomorphism started receding in popularity after Apple introduced a flat redesign of their mobile operating system in iOS 7.
Read more: Skeuomorphism in Icon Design ->
A type of image made up of points connected by paths. Can scale to any size without losing quality. They can be open or closed: Shapes are vector elements made of closed paths, meaning all the anchor points on the path are connected to each other.
Shapes can be created using the Shape, Pencil, Pen, and Brush Tools.
Read more: What is a vector? ➞