Page Layers
Your rating: Now say why...

(4) 4.125

Convert website into Photoshop layers.   Commercial ($28.99)
Add to my Watch List
Email me when discounted
Page Layers saves your Web site as layered Photoshop image. The Mac app is unique in its capability to export pixel-perfect Web site screenshots featuring a masked layer for every page element. And it can capture traditional website screenshots, too. Converting a website to PSD format allows to import existing pages into design tools like Photoshop or Pixelmator. This enables you to rapidly prototype and sketch ideas while redesigning and improving existing Web page designs. The conversion process is fully automated:
  • Navigate to the page you want to capture.
What's New
Version 1.8.2:
  • Fixed a bug where Page Layers could hang for pages with SVG elements in some cases
Requirements
Intel, OS X 10.6 or later



MacUpdate - Page Layers







  • Ondesoft Scree...
    +9

  • Layers
    +5

  • Softmatic WebL...
    +3

  • Paparazzi!
    +2

  • Klik
    +1

  • Web2PDF
    +1
Page Layers User Discussion (Write a Review)
ver. 1.x:
(4)
Your rating: Now say why...
Overall:
(4)

sort: smiles | time
burypromote
-1

-53
Mac-Mail commented on 08 Jan 2014
$28.99?
Paparazzi! is free and does the samething. Anyone can convert a jpg to layer in Photoshop. All you need is the software to capture the entire webpage into jpg/Tiff files. As I said,
Paparazzi! IS FREE!

That's my 2 cents.
[Version 1.8.2]


burypromote
+1

+65
NotUsed commented on 22 Jun 2012
Not sure why this has more than doubled in price. It was barely worth $12 a version ago... absolutely not worth $30 now.
[Version 1.6.1]


burypromote

+72

Irradiated-Software reviewed on 13 Dec 2011
Wonderful tool. I use this to help design AB Tests for my website. Just snap your current page, rearrange in Photoshop, then slice out the layers you need for the new test layout. Great time saver.
[Version 1.6]


burypromote
+4

+659
Cowicide commented on 11 Nov 2011
$30.00 without a trial demo? Such a shame, if I could test this and it worked properly with multiple websites, then I'd buy it.
[Version 1.5]

1 Reply

burypromote
Ralf Ebert (developer) replied on 14 Nov 2011
Maybe this helps: On the product support page there are some example files available that were captured with the app; these demonstrate what the app does accurately.
burypromote
+1

+82

Martin reviewed on 01 Nov 2011
I also have spent the money to buy Page Layers after I’ve seen the sample Photoshop files on the developer’s website.
For the two pages I have tested it since, it worked fine and produced what it says on the tin.
If you need that functionality (every element of a website on a separate Photoshop layer) to fiddle around, analyze or test different designs, Page Layers is a great help.

It would be even better, if you have an option to generate Photoshop text layers out of the text in the website so you can alter the text in your design more quickly.
[Version 1.5]

2 Replies

burypromote
+1

+659
Cowicide replied on 12 Nov 2011
> if you have an option to generate Photoshop text layers out of the text
> in the website so you can alter the text in your design more quickly.

Ugh... this doesn't convert the text to text layers in Photoshop? Lame. Glad I didn't buy this only to find out afterwards.
burypromote
Ralf Ebert (developer) replied on 14 Nov 2011
Not rendering text layers is done on purpose, as it is impossible to render CSS text in a pixel-perfect way using the Photoshop text engine. None the less I'm currently considering it for a future update of Page Layers as it is asked for every now and then.
burypromote

+65

NotUsed reviewed on 23 Aug 2011
I blew the $12... a demo would have prevented me from doing so. This does actually place every element on a layer in Photoshop. Every BLOCK element. There's no live text. Text is placed on a layer as pixels. There's no reading of image dimension only block level dimensions. So.... say you have a png with a transparent background inside a div tag. You get essentially a screenshot of the div tag on its own layer. That means the png AND anything behind it. Not just the png. Think of it as if you took a standard screen shot of a page then just selected and broke up pieces in Photoshop without using any masking. If you have, say a paragraph of text with internal anchor tags. Each anchor tag is placed on it's own layer and the rest of the text is placed on a layer. HTML live text, as already posted, is brought in as pixels. However, only live text will not have a background from the page. All other elements have no transparency even if there was transparency on the actual web site. Overall.. it does what it says... but it's not elegant or great. Might save a fraction of time but it's not hugely useful if you've already got Layers or Klik
[Version 1.4]

2 Replies

burypromote
+1
Ralf Ebert (developer) replied on 23 Aug 2011
Thanks for your feedback. I agree, anchor/markups in paragraphs should better be captured together with the outer element. I'll see how I can improve that. I cannot comprehend your comment about a transparent PNG image being captured together with the block level background - this is one of my basic test cases that the app passes without problem. Do you have a page URL where I can see the issue that you describe? Text layers would be a great feature indeed, I am considering these for an upcoming version.
burypromote
+1

+65
NotUsed replied on 23 Aug 2011
Okay.. CORRECTION.. seems I tested a page that was not what I thought it was. Seems images ARE INDEED SAVED CORRECTLY. So the primary issue, for me, would be text -- specifically how inline anchor tags are handled. Although, in most cases text would simply be replaced with live text. And I don't know that you can change things if an inline anchor tag were to use an image or image background or separate background color, etc.
burypromote
+1

+82
Martin commented on 31 Jul 2011
I would be happy to try this piece of Software as it really looks interesting to me. But without a demo, I’m left with a “eat or die“ kind of choice of the MAS.

I like the Mac App Store as a platform to buy software but this shouldn lead to tons of developers who are not providing any demo version of their sofware.
[Version 1.3]

2 Replies

burypromote
+1

-21
Archiethearchiver replied on 23 Aug 2011
You might try "Layers". It is a very similar app and does provide a demo.

http://layersapp.com/
burypromote

+82
Martin replied on 23 Aug 2011
Thanks for your hint. I already own Layers but haven’t noticed it’s web capture ability. However, in contrast to »Page Layers« it captures all web elements into one Photoshop layer, while Page layers creates a new layer for every Element of the web page.

So while they share a subset of features (capturing the whole page), Page Layers is still a different kind of beast.
There are currently no troubleshooting comments. If you are experiencing a problem with this app, please post a comment.


leeked rated on 05 Aug 2013

[Version 1.7.2]


Downloads:1,999
Version Downloads:132
Type:Development : HTML
License:Commercial
Date:08 Jan 2014
Platform:Intel 64 / Intel 32 / OS X
Price: $28.99
Overall (Version 1.x):
Features:
Ease of Use:
Value:
Stability:
Displaying 1-7 of 7
Displaying 1-1 of 1
-
-
-
Please login or create a new
MacUpdate Member account
to use this feature
Watch Lists are available to
MacUpdate Desktop Members
Upgrade Now
Install with MacUpdate Desktop.
Save time moving files & cleaning
up space wasting archives.
Page Layers saves your Web site as layered Photoshop image. The Mac app is unique in its capability to export pixel-perfect Web site screenshots featuring a masked layer for every page element. And it can capture traditional website screenshots, too. Converting a website to PSD format allows to import existing pages into design tools like Photoshop or Pixelmator. This enables you to rapidly prototype and sketch ideas while redesigning and improving existing Web page designs. The conversion process is fully automated:
  • Navigate to the page you want to capture.
  • Pick the screen size: full page - scrolled from top to bottom, or visible browser area only
  • Drag the PSD icon to any folder to convert the page HTML to PSD with layers for all page elements or drag the PNG icon to any folder to create a traditional website screenshot.


    - -