[CSS] 자신이 만든 디자인을 CSS로 변환시켜주는 플러그인

2018.04.26 comment

outdated post는 지우려고 했는데, 그냥 역사(!)로 남겨두기로 한다.

지금은 웹 디자인을 포토샵보다는 스케치로 많이 할 뿐더러 전달 방식도 제플린을 통해 수치값을 가이드 없이 작업자가 편하게 확인할 수 있다.

~2015년 중반 : 디자이너가 없어서 외주 디자이너의 PSD를 직접 전달받아서 혼자 수치 다 확인하면서 퍼블리싱, 에셋도 직접 다 뽑음

2015년 후반 : 디자이너분이 스크린샷 위에 수치값을 적어서 문서로 전달 + 여전히 PSD 파일 필요, 에셋을 직접 뽑기도 함

2016년 : 아보코드라고 PSD의 수치값을 비교적 쉽게 확인할 수 있는 툴을 잠깐 사용

2017년 : 디자인을 스케치 파일로 하기 시작하면서, 최종 산출물을 제플린으로 받음 에셋도 제플린을 통해서 추출 PSD 거의 쓰지 않음

2019년 : Figma로 디자인-코드확인을 동시에 하기도 함

2020년 : 지금도 역시 제플린을 가장 많이 사용하고 있음

---

아래 사이트에서 다운받아서 알려준 방식으로 플러그인을 설치하고

포토샵을 열어 원하는 부분을 선택 후 변화시켜주면 css로 생성해줍니다.

 

 

http://css3ps.com/