Creating a Design in Konfiwear

Before You Begin

Before creating a design in Konfiwear, make sure you have:

• An active Konfiwear account with admin or owner access

• At least one product created in your account

• The product UV or pattern file

• A design SVG file

• A preview image for the design

The SVG file is the main asset used by the customizer. It contains the editable design areas that customers can recolor or personalize.

For the best result, prepare your design from the UV layout of the 3D product.

1. Get the Product UV Layout

Before creating the design, open the 3D product file in Blender.

Go to the UV Editing workspace and select all the garment parts you want to include in the design, such as:

• Front

• Back

• Collar

• Cuffs

• Sleeves

• Other customizable sections

Enter Edit Mode, select all the required UVs, then go to:

UV > Export UV Layout

Recommended export settings:

Export the UV layout and use it as the reference pattern for your design.

2. Create the Design Artboard

Open your design software and create a new document.

Use a square artboard with the following size:

A 2048 × 2048 layout is recommended because it matches the UV export size and provides enough quality for the design.

3. Place the UV Pattern

Drag and drop the exported UV pattern into your design file.

Center it on the artboard.

If you are using a 2048 × 2048 artboard, the center position should be:

The UV pattern is only used as a placement guide. It helps you know where to place each design element so it matches the 3D product correctly.

4. Create the Design Elements

Use the UV pattern as a reference and create your design elements on top of it.

For example, you can create:

• A main background area for the front

• A main background area for the back

• Sleeve areas

• Collar areas

• Cuff areas

• Lines, shapes, logos, or other decorative elements

You can use rectangles, shapes, lines, and custom artwork depending on the design you want to create.

Make sure the design elements correctly cover the UV parts they are intended for.

5. Name the SVG Elements Correctly

Naming is very important.

Each editable element in the SVG should have a clear ID so Konfiwear can recognize it and make it customizable.

Common default names include:

For example, all background elements that should share the same main color can be named primary.

Other decorative elements can be named secondary, accent, or accent2 depending on how you want them to be controlled in the customizer.

6. Add Custom Color Zones if Needed

You can also use custom names for specific design sections.

For example, if you want a logo area to have its own color control, you can name the SVG element:

logo

Then, in Konfiwear, make sure this custom zone exists in your asset settings.

To do this:

1. Go to the customizer settings

2. Open the asset or color zone settings

3. Add a new zone

4. Enter the zone name, such as logo

5. Set its alias if needed

6. Choose where it is used, such as SVG or 3D

7. Assign the allowed colors for that zone

8. Save the settings

Use SVG when the color zone belongs to an element inside the SVG design.

Use 3D when the color zone belongs to a separated part of the 3D model.

7. Remove the UV Reference Before Export

Before exporting the final SVG, remove the UV pattern reference from the design file.

The UV pattern is only used to guide your placement. It should not be included in the final SVG design.

Only the real design elements should remain.

8. Export the Design as SVG

Export the final design as an SVG file.

When exporting, make sure to enable:

Use Artboard

This step is mandatory. If the SVG is not exported using the artboard, the design may not align correctly inside Konfiwear.

Recommended export settings:

Once exported, the SVG is ready to be uploaded into Konfiwear.

9. Navigate to the Designs Page

From your Konfiwear dashboard, go to the Designs section under the Customizer area.

This page shows all existing designs in your account.

10. Create a New Design

Click Create Design.

Enter a clear design name.

Example:

Men Short Sleeve Design 1

You can also add a description if needed.

The source type, status, and other settings can be kept as default unless you need a specific configuration.

11. Upload the SVG File

After the design is created, open the design detail page.

Go to the assets area and upload the SVG file.

The SVG is the most important file because it controls how the design appears and how the editable zones work inside the customizer.

After upload, Konfiwear will use the SVG to display the design on the product.

12. Upload a Preview Image

Upload a preview image for the design.

The preview image appears in the design list and in the customizer design selector.

You can use a screenshot of the design or product as a quick preview.

Supported preview formats include:

• PNG

• JPEG

• WebP

A square preview image is recommended.

13. Assign the Design to Products

Open the Products tab on the design detail page.

Choose which products can use this design.

You can use one of the following options:

Select the option that matches your setup.

If the design is made for a specific UV layout, it is usually better to assign it only to the matching product or product family.

14. Verify the Design in the Customizer

After the SVG and preview image are uploaded and the product assignment is done, open the product in the customizer.

Check that:

• The design appears in the design selector

• The SVG loads correctly on the product

• The design aligns with the 3D model

• The color zones appear correctly

• The editable areas use the correct names

• Custom zones such as logo are available if used

If something does not appear correctly, check the SVG IDs, the artboard export settings, and the product assignment.

Best Practices

When creating a design for Konfiwear:

• Start from the product UV layout

• Use a 2048 × 2048 artboard

• Center the UV pattern correctly before designing

• Use the UV pattern only as a reference

• Remove the UV pattern before exporting

• Name all SVG elements clearly

• Use default names such as primary, secondary, accent, accent2, or accent3 when possible

• Add custom zones in Konfiwear before using custom SVG IDs

• Export the SVG with Use Artboard enabled

• Upload both the SVG and a preview image

• Assign the design only to compatible products

Troubleshooting

The design does not appear in the customizer

Check that the design is active and assigned to the product you are viewing.

The SVG does not align correctly

Make sure the SVG was exported using the artboard and that the artboard size matches the expected layout.

Color zones do not appear

Check that the SVG elements have the correct ID names.

If you are using a custom ID such as logo, make sure the same zone exists in the Konfiwear asset or color zone settings.

The UV pattern appears in the final design

Remove the UV reference layer before exporting the SVG.

The UV pattern should only be used as a guide, not as part of the final design.

Summary

Creating a design in Konfiwear starts with the product UV layout.

The UV layout is used as a guide to build a 2048 × 2048 SVG design. Each editable element must be named correctly so Konfiwear can recognize it.

Once the SVG and preview image are uploaded, assign the design to the correct product and test it in the customizer.

When the design is active and correctly assigned, customers can select it and customize it directly on the product.