You can make the whole website design in Affinity Designer in quite more elegant way than Photoshop. You can export it to PSD, but there’s an issue – texts are outlined which make developers quite frustrated.
I found one way how to prepare PSD until now, it’s not elegant, not always perfect, but it’s easy to do it. Unfortunately you still need Adobe Illustrator. I have my CS 5.5 so i was working on this version.
Here’s a simple step by step tutorial, how to prepare website design from Affinity Designer to PSD file with text embedded.
When you’re ready with your design, go to export, choose PDF (for web) and make sure fonts are embedded. (step 01)
If you check PDF file in Acrobat, you can select text. (step 02)
Go to Illustrator and drag PDF into it. Sometimes you can notice, that some fonts might not work (like Font Awesome in my case). What to do next is selecting the content, release clipping mask and delete the frame, repeating until you don’t have that choice anymore. (step 03)
Go to File > Export and choose Photoshop and check Use Artboards. (step 04)
Choose Color model (RGB), Screen (72 ppi) and Write layers. (step 05)
Now you have PSD file with text embedded and you can try in studio.psdetch.com for example, which can show you font data. (step 06)
I will continue to experimenting and trying to find better way. If anyone has any suggestion for improvement or better solution, please let me know. 🙂