[Pre-course] 웹 퍼블리싱 : 퍼블리싱, Figma

퍼블리싱

: Figma, Photoshop 등의 그래픽 리소스를 html + css + js 로 변환해 브라우저에 표현하는 것

 

디자인 리소스란

: Sketch, Zeplin, Figma, Protopie 처럼 최근 많이 사용되는 프로토타이핑 틀까지 많은 소프트웨어를 통해 디자인하는 것

 

퍼블리싱에 대한 개념

: 디자이너가 제작한 그래픽 데이터를 웹 브라우저 위에서 표현하기 위핸 가장 기초적인 작업이며, 퍼블리싱은 크게 마크업과 스타일링으로 나뉜다. 개발자가 미리 정의한 기능이 있을 경우 Javascript 작업을 통해 스타일링을 마친 뒤 부가 기능을 추가하기도 한다.

 

• 마크업 : HTML을 통해 기본 뼈대를 만든다.
• 스타일링 : CSS로 마크업에 색상 등의 속성을 입혀 스타일을 지정한다.
• 부가 기능 : Javascript로 특정 요소에 기능을 만들어 부여한다.

 

Figma

: Sketch + Zeplin 과 더불어 많이 사용되는 디자인/프로토타이핑 툴. Figma는 하나의 툴로 기획, 와이어프레임, 디자인, 프로토타이핑까지 수행할수 있는 장점이 있다.

 

• 좌측 레이어 영역 : 포토샵에서의 레이어 영역과 동일
• 가운데 영역 : 실제 구현된 디자인 요소 미리보기
• 우측 영역 : 현재 선택한 요소의 세부 속성