There are almost no limitations to uploading PSD files to RapidUI, but there are some simple and quick guidelines that we highly recommend you to follow when working with Photoshop - it will help you achieve better results faster!
It is important to remember that the designs you are making in Photoshop will be turned into a fully functioning live website - they are the source layers for your web site. Work tidily - organize groups, layers and names, and try not to use unnecessary objects.
Every visible layer in Photoshop will be uploaded to your web.
It is better to delete unnecessary layers before uploading your PSD. Invisible layers will not appear in your site, but they will lengthen the uploading time.
Make sure every object on your page has a separate layer. Two objects on the same layer will function as one in RapidUI.
There is no need to upload several photos to the same spot (one on top of the other - usually for sliders, galleries, etc.). It will only slow down the upload process and will upload unnecessary photos. Simply use one image, and after turning it into a slider in RapidUI, add the other images to the slider.
Blend modes, clipping & masks:
Most blend modes & clippings are supported in RapidUI, yet some of them might look different or even stop the PSD upload.
RapidUI does not support folder effects (blend modes, clipping, masks, etc). Instead, use the effects on a specific layer, or merge the folder layers.
If your PSD upload doesn't complete or doesn't look exactly like your Photoshop design, try one of these options (only one needed):
- Merge the clipped / blend layers (without affecting the object's appearance) - the best option. If this option doesn't work, try one of these options:
- Rasterize clipped / blend layers (not text layers).
- Convert layers into smart objects (not text layers).
After trying one of the options above, upload your design once again.
It is very important to use the right text settings (styling) before uploading your PSD file to RapidUI.
Your text settings (font family, font size, line height, color, etc.) in Photoshop is what allows us to create your web - if they are defined exactly as they should, your site will be pixel-perfect.
The first thing to remember is to never convert text layers!
Don’t rasterize text, don’t convert it to a shape or a smart object, avoid changing the layer type - if it is not a text layer, it won’t upload as a text layer.
Second, keep the text settings right - not only visually. The text settings you use set the text settings in your site, they’re relevant even if they visually look fine, so make sure that text sizes make sense.
For example - a title’s text layer can have a font size of 18px, but a line height of 98px (obviously copied and pasted from a different title). In that case, the line height in your web will be 98px - which you do not want to happen of course.
Make sure that the text direction is always set properly, not just visually. If your text direction is left-to-right, it will be the same in RapidUI (but can be changed).
Always use the same text settings for the same text type - if you are using the same looking headline several times in your site - make sure that their settings (styles) are the same.
Changes in Photoshop
Any changes made in Photoshop (after uploading your design to RapidUI) will not be updated automatically. However, there are two ways to upload changes from your design file / upload a new design onto the platform:
1. Upload your file as a whole, and show only the layers you wish to upload (hide the layers you wish to be hidden in the platform)
2. Create a container in the platform - and upload your PSD/Sketch file containing only the new layers.
Here are our links on how to upload another design, and how to add a container.
RapidUI only supports the RGB color model. Do not use CMYK, LAB or HSB.