WebToLayers
WebToLayers はウェブサイトを Photoshop ドキュメントに変換します。つまり、このアプリは、各要素を個別のレイヤーとして保持したまま、ウェブページのスクリーンショットを取得できます……
概要
WebToLayers はウェブサイトを Photoshop ドキュメントに変換します。つまり、このアプリは、各要素を個別のレイヤーとして保持したまま、ウェブページのスクリーンショットを取得できます。既存のウェブページの再設計や改善作業において、大幅な時間短縮が可能です。その他の機能:Safari 拡張機能、カスタムページサイズ、カスタムウェブエージェント、JavaScript インジェクション。本バージョンは macOS High Sierra 以降に対応するよう最適化されています。また、アプリケーションは 7 カ国語(英語、フランス語、ドイツ語、スペイン語、イタリア語、日本語、中国語)に対応しています。フィードバックはアプリ内から直接送信できます。これにより、ご要望や改善案について、わずか数回のクリックで当社へお知らせいただけます。
新機能(バージョン 1.4.0):
問題修正:全体的なパフォーマンスおよび機能性を向上させるため、いくつかの軽微な問題を修正しました。
システム要件:Intel 64 ビットプロセッサ、macOS 11.0 以降。
スクリーンショットに関する注意:広告ブロッカーをご利用の場合、当サイトをホワイトリストに登録してご支援ください。広告収入こそが、高品質なコンテンツ提供を支える原動力です!または、こちらを読んで当社を支援する方法をご確認ください。
ありがとうございます!
サイズ:7.3MB;以前のバージョン
編集部確認情報
既存 Web Page を Annotation/再配置可能な PSD にしたい UI/Web Designer、PM、Document Team に推奨します。権利確認→Account/Payment Data 除外→URL、Viewport、Scale、User Agent、言語、Font 固定→完全 Load→PSD+PNG/JPEG→対象 Editor で比較→有用 Layer の Rename/Group→Text/Button/Component は Design System から再構築→Canvas/iframe/Animation 制限記録→manifest/SHA-256 保存、の順です。Bitmap 精修は Photoshop、軽量編集は Pixelmator Pro/Acorn を比較します。
長所
- Web Page 全体を PSD に移し、Flat Screenshot より Layer ごとの提案、Annotation、再配置、Prototype に適します。PNG/JPEG を比較に使えます。Page Size/User Agent で Desktop/Tablet/Mobile を模擬し、Safari Extension、Cache Clean、Force Reload、JavaScript Injection もあります。小型で目的が明確で、既存 Page の Review/Redesign に便利です。公式は macOS 11+ と M1 最適化を明記します。
短所
- Render Page は可逆的な Design Source ではなく、CSS、Canvas、Video、iframe、Shadow DOM、Pseudo Element、Composite が Raster/Merge/欠落する場合があります。Font/CORS も Text を変えます。保守可能な HTML/CSS、DevTools、Figma Component、Design System の代替ではありません。Session、CAPTCHA、Consent、地域制限、Lazy Load は再現性を下げ、長い Page は Memory と Layer Noise を増やします。Injection は Risk があり、古い 1.4.0 は現行環境で先に検証が必要です。
インストール手順
- サイト版は WebToLayers 1.4.0、公式要件は macOS 11.0 以降です。1.3.2 から M1 最適化、Intel 64-bit にも対応します。Applications に配置し、ログイン不要の公開 Static Page で基準試験します。HTTPS URL、Page Size/User Agent を設定し、Resource 読込後に PSD と比較用 PNG/JPEG を出力します。Photoshop、Pixelmator Pro、Acorn で Canvas、Layer 数/順序、Transparency、Text/Image 位置を確認します。JavaScript Injection は信頼できる Script を非機密ページの複製で試します。反復 Capture は Viewport、Scale、言語、Session、Font を固定し、URL、時刻、SHA-256 を記録します。
アンインストール手順
- 削除前に PSD、比較 PNG/JPEG、URL、Viewport/User Agent、Capture 時刻、Note、必要な License 記録を保存します。重要 PSD は manifest/SHA-256 を作り、対象 Editor で再度開いて Layer 編集を確認します。Dynamic Page は再現できないため、必要なら PDF/Browser Archive も残します。Cookie、Token、個人情報、Injection Script は梱包しません。Export を Project に移し、Safari Extension を設定から無効/削除して App を削除します。Preference/Cache 清掃前に設定を記録し、他の NeededApps 製品の共有 Data は消さないでください。
よくあるエラーと解決策
- Blank/Resource 欠落は同じ URL を Safari で確認し、TLS、地域制限、Lazy Load 完了後に再試行します。Login、CAPTCHA、Consent、SPA は現在の Render State のみ取得するため Window、Session、Scroll を固定します。Font 置換は Local Font、Web Font CORS、読込未完を確認します。Canvas、Video、iframe、Shadow DOM、CSS Composite、Pseudo Element は個別 Layer にならない場合があります。これは視覚的 PSD であり HTML/CSS Source ではありません。失敗時は Page Height を減らし Animation/Video を止め、Cache Clean/Force Reload。長い Page は Memory を消費します。Injection は機密ページで使いません。
今回の更新内容
- 公式 1.4.0 は全体の Performance/Functionality を改善する複数 Issue の修正です。直前 1.3.2 は macOS 11 Icon、M1 最適化、Clean Cache/Force Reload、Interface 修正を追加しました。核心は Web Page 全体の PNG/JPEG Capture、HTML Element を可能な範囲で別 Layer にする PSD、Page Size/User Agent 設定です。1.4.0 以降の再設計は含めません。
