R
R
RafisDesigner2019-07-08 12:31:24
Design
RafisDesigner, 2019-07-08 12:31:24

How to properly prepare a PSD layout for export to SVG?

SVG for layout designer. The site pages are made on separate artboards, everything is laid out in folders. But how to prepare for export to SVG so that the layout looks adequate (clipping masks, text). Please tell a newbie!
PS I don’t know what complexity of the question to choose, but it’s probably elementary for those who know)

Answer the question

In order to leave comments, you need to log in

3 answer(s)
R
RafisDesigner, 2019-07-10
@RafisDesigner

Found the answer
The whole layout in SVG is not necessary. In SVG, only the logo (logo + text), icons, non-standard vector shapes (for example, rectangular, round, do not submit to SVG) are submitted. Rent only custom.
As for clipping masks: you reduce the shape and the image into one layer and submit it as a regular raster, naturally, without SVG.

M
Mikhail Proskurin, 2019-07-08
@mixail_fet

In general, the first piece of advice for any designer: before you start giving layouts for layout and selling them to a client, you need to already understand CSS / HTML at a basic level, because in addition to the subtleties of "how to transfer work to a layout designer", there are still a lot of little things, without knowing them, your layout will always differ from the layout.
Secondly, a designer working in Photoshop is a bad designer, not only do you inconvenience layout designers with Photoshop, you also do not properly prepare layouts. The fact is that Photoshop is a raster editor, and the vector is functionally inserted there, and the web layout is built on the vector.
In addition, using tools such as Figma, Adobe XD and Sketch, you save yourself a lot of time, since all of them are sharpened narrowly for interface development, and all internal functions speed up your work.
Well, about SVG for the layout designer:
1. Why does the layout designer ask you to cut it? He needs to see the indents, the grid, the sizes - this is all done through the source code, according to this logic, he must cut all the objects himself.
2. SVG is a vector, coordinates, and throwing raster images there is not competent, all that is required of you is to export vector objects to SVG, and that's not all, only icons are desirable.
3. Advise your coder Avacode, so he can easily figure out how to cut your layout.

E
Eugene, 2019-07-08
@iamd503

All vector elements (icons, badges, etc.) can be exported to a folder and given to the layout designer. Clipping masks and text are not exported.
Well, in general, so that there are no such questions, go to figma, sketch, adobe xd

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question