와이어프레임 도구이란?

페이지 레이아웃과 UI 목업을 빠르게 스케치할 수 있는 기기 기반 와이어프레임 도구입니다. 버튼, 텍스트 블록, 이미지, 입력 필드 등 일반적인 UI 요소를 캔버스에 드래그 앤 드롭하여 와이어프레임을 만들고 PNG 또는 JSON으로 내보낼 수 있습니다.

사용 방법

1. 툴바에서 사각형, 텍스트 블록, 버튼, 이미지 플레이스홀더, 입력 필드 등 UI 요소를 선택한 후 캔버스를 클릭하여 배치하세요.
2. 요소를 드래그하여 위치를 변경하고, 핸들을 당겨 크기를 조절하며, 더블클릭으로 텍스트를 편집하세요. 요소들을 그룹으로 묶으면 더 쉽게 이동할 수 있습니다.
3. 와이어프레임을 공유용 PNG 이미지로 내보내거나, 나중에 다시 불러와 편집을 계속할 수 있도록 JSON으로 저장하세요.

결과

프로덕트 매니저가 로고 플레이스홀더, 이메일 및 비밀번호 입력 필드, 로그인 버튼, 비밀번호 찾기 링크가 포함된 모바일 앱 로그인 화면을 스케치한 후 PNG를 내보내 Slack 채널에 공유합니다.

관련 도구