Missing QOL Features and Annoyances

[Mario662629]

Merging Layers:

• There is no right-click context menu on the layers that allows you to merge them, unlike in Photopea. There should be an option like this to allow you to combine multiple layers into one. For example, on a road sign (e.g. https://upload.wikimedia.org/wikipedia/commons/6/6b/MUTCD_W1-1R.svg), you should be able to put all the black in one layer and all the white in another without it messing up the image itself. When done in Photopea, it "cancels out" overlapping parts of the vector layers.

Vectorizing Pixel Art:

• There is no "snapping rectangle tool" that could be used or vectorizing pixel art. It is sort of possible if you go to File > Preferences, enable the grid, and set the grid gaps to 1x1. However:
  • Because exporting PNG pixel art results in bilinearly-scaled images even when interplotation is set to nearest neighbor, I keep having to switch between Photopea and Vectorpea to get the colors and pixels correct.
  • The eyedropper tool doesn't work properly as the overlay doesn't show up, unlike Photopea.
• The rectangle tool doesn't have layering options, and it puts each rectangle on a new layer, unlike Photopea.
• There is no "Canvas Size" option to change the canvas size to a specified resolution in File > Edit, unlike Photopea.

PDF to SVG Resolution Bug:

• When saving a PDF as an SVG, it is exported at double resolution compared to what was entered (e.g. 36x36 turns into 72x72). You can see this by saving a PDF page as an SVG, then opening the exported copy in Vectorpea and preparing to export that. Look at the resolution values.

[photopea]

Merging layers: What exactly do you want to do to that SVG? There are four shapes, one covering another. Can any software do what you want to do? Which software? It makes no sense to me what you describe. Also, there are no white objects, just black and yellow.

Vectorizing Pixel Art: I have added the "Vectorize Bitmap" button to the top menu (appears when you select a bitmap layer)

PDF to SVG Resolution: I am a bit confused, what should I do to see this problem?

[Mario662629]

Original image to use as a reference: W01-01L Horizontal Alignment - Turn 36x36 2024.pdf

---

Merging layers: What I mean is merging the black layers into one layer to compact the SVG structure, while not messing up the image itself. For example, fusing all the selected layers of black in the example below into a single layer with only the black outline and the arrow, without the yellow turning black.

Here's the issue about the overlapping shapes causing issues when layers are merged in Photopea. The first image is the original, the second one merges the two layers forming the arrow, and the third merges all of the black layers. Please ignore the ads in these images; they are not part of this issue report.

---

PDF to SVG resolution: Using the linked file, open it in Vectorpea, then select File > Export as... > SVG. Set the measurements to inches, change it to 36x36 in, then select Save. Open the exported document in a new tab in Vectorpea, then select File > Export as... > SVG; the size doubled to 72 in. This only seems to happen at certain sizes, as it doesn't happen when exported at the initial 49.05-inch size.

---

New issue: While testing, I noticed that the lack of a right-click context menu on layers makes me unable to duplicate them without copying and pasting them. I also can't right-click a layer to activate a clipping mask, resulting in me having to go to Object > Clipping Mask > Enable or pressing Ctrl+7.

---

Additional note: While doing this testing, I noticed that the "Did you know, that for $5 a month, you can remove ads on the right side and support Photopea?" notice came up 3 TIMES IN A ROW when I was saving the images. It seems to come up randomly, what is the chance?

[photopea]

I have fixed the issue with a size of the imported PDF (and exporting it as an SVG).

I have fixed the issue with a message about buying Premium.

Merging layers in Photopea: I think Photopea does exactly what Photoshop would do. You should set a boolean operation to each path of the shape. It is described e.g. here: https://www.photopea.com/learn/vg-structure

Merging layers in Vectorpea: I think you can not merge the black arrow, that is fully inside a black square, with that square, and expect the yellow color to appear between the arrow and the square. If you can do it in some software, please, show us what you get, so that I can get a clue of what you want to achieve.

[Mario662629]

Merging Layers in Vectorpea: Still can't merge paths from one layer into another (like what was done in Photopea) via right-clicking the layers. In addition, I found out a way to merge the black arrow in Photopea, that I can't do in Vectorpea:

1. Select all the layers that make up the arrow, then select the paths in those layers.
2. Set the Fill Rule to Unite.
3. Select "Merge Layers".

Still can't merge the black border because it's under the yellow part, and I'll have to turn that part of this layer transparent in order for it to work completely! What I mean is turning the black square behind the yellow square into a border with everything that is on top made transparent, basically masking the merge to only visible parts of the layer. You can see what I'm trying to accomplish here with Path 3 in the following image with the outline: W03-02 Yield Ahead 36x36.pdf

In addition, more issues were found in both Photopea and Vectorpea:

• Exporting from a PDF in Photopea yields the image on a white background instead of a transparent one.
• When cropping contents outside of a PDF in Vectorpea and then selecting "Fit to Artwork Bounds", the canvas doesn't scroll enough to the left and it zooms in on the original center of the document. To reproduce, select content entirely outside the main canvas, delete all other layers, then fit to artwork bounds. Example document to try this on: Wa-001L.pdf
• The color palette doesn't display when layers with multiple colors are selected and the "?" is shown in place of the color. It should show the color palette so that you can change the colors of all of those layers at once, especially with me having to figure out which layers are which color shades.
• When grouping layers, it doesn't open up to the folder, which makes me have to manually open the folders or click the layers to find them.
• Dragging a folder into Photopea or Vectorpea causes "Loading" to get stuck on the screen when you drag in another file after that, causing another softlock and resulting in the need to reload.
• When vectorizing bitmap with pixel art, the image got smoothened. I want it to stay pixelated in this case. Even when setting it to Polygon, it's not accurate to the pixel art! This happens in Photopea as well. This can currently only be avoided by upscaling the image.

Polygon Enabled:

Polygon Disabled:

Image used in the above example:

[photopea]

"Still can't merge the black border because it's under the yellow part" - as I said, I dont think it can be done automatically, by a computer. If you think some program / computer can do it, tell me which one (as a proof that it is possible).

PDF White / transparent background - how do you tell if a PDF file has a white or a transparent background? What software do you use for that?

[Mario662629]

Try exporting W01-01L Horizontal Alignment - Turn 36x36 2024.pdf as SVG in both Vectorpea and Photopea. Here's the difference (top exported via Photopea, bottom exported via Vectorpea). If you insert the one exported in Photopea into Vectorpea, you'll notice a "<Clipping Path>" layer that turned the background white. While doing so, I noticed the imported PDF size bug not patched in Photopea as well.

You can see the white background when it is exported as PNG:

High Priority Fixes (see above):

• Add right-click context menu on layers in Vectorpea for merging layers and clipping masks, at least. The "still can't merge the black border" will be managed later.
• Fix scrolling and zooming bugs when using "Fit to Artwork Bounds" on content outside a PDF's canvas.
• Fix inability to change colors of multiple selected layers of different colors.
• Fix vectorize bitmap issue for pixel art on Photopea and Vectorpea.
• Fix softlock when dragging a folder onto Photopea or Vectorpea.

[photopea]

What is "add right-click context menu on layers"? Do you mean on layers in the canvas, or on layers in the Layers panel? We want Vectorpea to work the same as Adobe Illustrator, and there is no right-click context menu in Illustrator.

[Mario662629]

On layers on the Layers panel.

[photopea]

We want Vectorpea to work as Illustrator, not as Photopea, and there is no such menu in Illustrator.

[Mario662629]

Here are the other issues:

• Add right-click context menu on layers in Vectorpea for merging layers and clipping masks, at least. The "still can't merge the black border" will be managed later.
• Fix scrolling and zooming bugs when using "Fit to Artwork Bounds" on content outside a PDF's canvas.
• Fix inability to change colors of multiple selected layers of different colors.
• Fix vectorize bitmap issue for pixel art on Photopea and Vectorpea.
• Fix softlock when dragging a folder onto Photopea or Vectorpea.

[photopea]

• I have fixed the zooming / scrolling when the artboard is moved far from the original location
• You can change colors of multiple shapes with different colors at once
• "softlock" - I guess you mean drag-and-dropping a folder from your computer into an opened document. Now, Photopea should tell you that you can not open folders.

If both the width and the height of the image is 32 pixels or less, it is considered to be a "pixel art". When you vectorize pixel art, now, it should only trace around pixels, without trying to create any curves.

To combine multiple shapes together, in Vectorpea or in Adobe Illustrator, you should use the Pathfinder tool. See https://helpx.adobe.com/illustrator/using/combining-objects.html

[Mario662629]

There are object sprites that are larger than 32 pixels in either direction that can still create curves at the original resolution. Examples from Super Mario games include:

In-game pixel logos from retro games

The logos on the title screens in retro games.

• Super Mario Bros. (176x88): https://www.mariowiki.com/File:SMB_In-game_Logo.png

Sprites of large objects

Sprites of objects that are longer than 2 tiles in width and/or height. 1 tile is 16x16 pixels.

Super Mario Bros.

• Fortress (80x80): https://www.mariowiki.com/File:SMB_Fortress.png

Super Mario World

• Bowser (64x96): https://www.mariowiki.com/File:SMW-Bowser_in_Koopa_Clown_Car.gif

Super Mario Maker

• Grinder (SMB style) (48x48): https://www.mariowiki.com/File:SMM-SMB-Grinder.png
• Skewer (SMB style) (64x64): https://www.mariowiki.com/File:SMM-SMB-Skewer.png

Sprites of long or tall objects

Sprites of objects that can be variable in length that are longer than 2 tiles in height (vertical) or length (horizontal)

Super Mario Bros.

• Goal Pole at full length (24x168): https://www.mariowiki.com/File:SMB_Goal_Pole.png (Can be avoided by vectorizing the top and bottom separately, putting them at the top and bottom of an artboard, then adding a single green rectangle of accurate length in between)
• Warp Pipes longer than 2 tiles in height, including those that are multi-way: https://www.mariowiki.com/File:SMBWarpPipeForked.png

Super Mario Bros. 2

• Vases longer than 2 tiles in height: https://www.mariowiki.com/File:Vase_SMB2_Sprite.png

[photopea]

I am confused. Why would anybody vectorize images and expect each pixel to be turned into a vector square? Nobody ever asked us about this feature. Raster graphics, which consists of pixels, should be stored as PNG files, not inside SVG or vector formats.

[Mario662629]

To make pixel art scalable.

[photopea]

What does it mean?

[Mario662629]

It means making sprites from retro video games scalable without being blurry. This currently can be done with PNG files in Photopea to upscale them, but you'll have to create versions for many different resolutions or apply a large multiplier to the scaling. It also can be accomplished by putting Photopea and Vectorpea side-by-side and "redrawing" the sprite using the Rectangle Tool in Vectorpea, copying and pasting the hex colors from Photopea into Vectorpea. However, there are two annoyances; there is no grid display in Vectorpea, and I keep having to color-pick, open the palette, and copy the color in Photopea then paste it into Vectorpea.

Demonstration

Original sprite, 10x size:

Upscaled sprite, same size:

Original sprite put in Vectorize Bitmap:

---

In addition, I noticed a few more issues:

• I can't split layers in Vectorpea, especially when a layer consists of multiple shapes. Things tried:
  • Copying a layer (or parts of it) using Ctrl+C, and pasting it onto a new one using Ctrl+V doesn't work.
  • There is no "Release to Layers" option to split the layers.
  • There is no option to copy layers.
  • There is no option to create a new layer.
• When a window is open, tabs won't change or close. This includes the Color Picker and the "Confirm" dialogs, alongside others.
• Sometimes, Photopea thinks that you are using an adblocker and starts nagging you about it when you are actually not. This often happens at schools that block the Google Ad Services domain.
• I've recently gotten Photopea abruptly redirected to this several times, usually with a "Leave site?" dialog preceding it:

[photopea]

Your "blurry mario" is caused by using a bilinear interpolation when upscaling. You just need to set a different upscaling method, e.g. "nearest neighbour". Every software which upscales raster images should allow you to choose the upscaling method.

To prevent same colors from merging into one layer during "Vectorize", you should turn off "Merge colors" at the top.

Could you clear your cache in Photopea? I think then, these ads should not appear anymore.

[Mario662629]

• The initial blurry Mario image was the original 12x16 PNG without Photoshop/Photopea upscaling, using GitHub's built-in upscaling.

• This happened with "Merge colors" off:

• These redirecting ads occur randomly. Even if I start a new incognito window after closing all the others (to clear the data in that profile), it still occurs after a little while.

• I can't split layers in Vectorpea, especially when a layer consists of multiple shapes. Things tried:

  • Copying a layer (or parts of it) using Ctrl+C, and pasting it onto a new one using Ctrl+V doesn't work.
  • There is no "Release to Layers" option to split the layers.
  • There is no option to create a new layer.
  • There is no option to duplicate a layer.

[photopea]

"Merge colors" will put all shapes of the same color into one layer. If you turn it off, each vector part will be in a separate layer. Do you know what I mean? It does not change the way it looks in front of you!

[Mario662629]

I do know what you mean, but the sprite is still outputted with all these diagonal parts!

Once again, there's this issue:

• I can't split layers in Vectorpea, especially when a layer consists of multiple shapes. Things tried:
  • Copying a layer (or parts of it) using Ctrl+C, and pasting it onto a new one using Ctrl+V doesn't work.
  • There is no "Release to Layers" option to split the layers; that is an option in Illustrator.
  • There is no option to create a new layer.
  • There is no option to duplicate a layer. (Edit: You can do that by dragging a layer onto the canvas while holding Alt, there's just no regular option)

Additionally, Ctrl+S saves the project as a new AI file instead of saving to the document if it exists on the computer, rather than only saving as AI if the file doesn't exist on the computer.

[photopea]

As I said, Vectorize is for vectorizing raster graphics into vector graphics (converting pixels to curves). It will not convert every pixel to a vector square. I tihnk such a feature is useless, nobody ever asked us about such a feature.

To "Merge" and "Unmerge" paths in Adobe Illustrator, you should use Object - Compound Path - Make / Release. I have added this feature to Photopea.

You can duplicate layers by pressing Ctrl+C and Ctrl+V, or Edit - Copy, Edit - Paste. Unless you use Firefox, which is really a bad web browser and nothing works in it properly.