投稿日：2019年07月24日

こんにちは。山根です。
今回は業務で使用しているChromeウェブストアの拡張機能perfectpixelについて紹介したいと思います。

アドオンのインストールは簡単で、chrome ウェブストアのページにアクセスし、追加ボタンをクリックするだけで完了します。

インストールが完了したらコーディングデータを確認したいwebページにアクセスし、ブラウザ右上のアイコンをクリックして画像を選択するUIを表示します。

あらかじめjpg等の画像で書き出しておいたデザインカンプを選択する、もしくはUI上にドラッグ&ドロップすることで画像を登録できます。

画像が登録されたら位置や透明度を調整してコーディングデータとデザインカンプを比較します。
画像の位置を決めたら施錠のアイコンをクリックして固定し、検証でコーディングしていきます。

このツールを使うことによってデザインの位置や間隔が正確にコーディングする事が出来ます。

では、毎度の写真コーナー7月編
七夕天の川伝説

奈良 室生湖

奈良 廃校


奈良 カフェ楓