AI로 피그마 상세페이지 만들기 | 잘 만든 레퍼런스 하나로 내 상품 페이지를 완성하는 법

상세페이지를 처음부터 그리지 않고, 잘 만든 상세페이지 하나를 레퍼런스로 골라 그 구성으로 내 상품 상세페이지를 만듭니다. AI 브라우저 어사이드에 네 줄을 요청하면 피그마 파일 안에 상세페이지가 만들어집니다. 사진과 문구는 내가 피그마에 올려 둔 것만 씁니다. 만들어진 페이지를 직접 고치는 장면, 레퍼런스에서 가져와도 되는 것과 가져오면 안 되는 것까지 다룹니다. ■ 타임라인 0:00 레퍼런스를 참고해 만든 내 상세페이지 0:36 잘 만든 페이지에서 시작하기 1:28 피그마에 내 사진과 상품 정보 올려 두기 2:04 어사이드에 네 줄 요청하기 3:12 만들어진 상세페이지 훑어보기 3:57 직접 고쳐 보기 4:52 레퍼런스에서 가져와도 되는 것 5:47 내 디자인 규칙으로 바꾸려면 ■ 어사이드에 보낸 요청 (영상 그대로) (내 피그마 파일 주소) 이 삼성 상세페이지를 레퍼런스로 참고해서, 피그마 파일에 미니 음료수 냉장고 상세페이지를 만들어 줘. (레퍼런스 상세페이지 주소) 구성과 레이아웃, 스타일을 참고하고 사진과 문구는 파일에 올려 둔 내 것만 써. 폭은 860으로, 섹션마다 오토레이아웃으로 짜 줘. (상품 이름과 레퍼런스는 내 상품에 맞게 바꿔서 쓰면 됩니다. 보내기 전에 사진과 상품 정보 메모를 피그마 파일에 먼저 올려 두세요) ■ 레퍼런스를 참고할 때 가져와도 되는 것: 섹션 순서, 여백, 제목과 설명의 글자 크기 가져오면 안 되는 것: 그 회사가 만든 사진, 문구, 로고, 브랜드만의 그래픽 ■ 피그마 기본 개념 (프레임 · 레이어 · 오토레이아웃) 피그마 기본기 | 오토레이아웃까지, AI와 작업할 때 꼭 알아야 할 개념    • 피그마 기본기 | 오토레이아웃까지, AI와 작업할 때 꼭 알아야 할 개념   재생목록 「AI와 일하기 전 필수 개념」    • AI와 일하기 전 필수 개념   ■ 디자인 시스템 만드는 방법 댓글에 「디자인시스템」이라고 남겨 주시면 답글로 보내 드립니다. ■ 시연 환경 2026년 10월 31일, AI 브라우저 Aside, 피그마 무료 계정 한국어 화면. ■ 레퍼런스 출처 삼성닷컴 Bespoke 큐브 냉장고 25L 상세페이지 (samsung.com/sec). 영상에는 구성을 설명하기 위해 화면을 인용했고, 만든 상세페이지에는 삼성의 사진 · 문구 · 로고를 쓰지 않았습니다. #피그마 #피그마상세페이지 #상세페이지만들기 #AI상세페이지 #어사이드