실행 가능한 사용자: 모든 사용자
사용 가능한 플랜: 모든 플랜
사용 가능한 플랫폼: 브라우저, 데스크톱, 모바일
프로토타이핑 라이브러리를 사용하여 Miro 캔버스에 직접 프로토타입 레이아웃을 구축하세요. 이 라이브러리는 초기 단계에서 흐름을 시각화하고 아이디어 구조화에 도움을 주는 화면, UI 구성 요소, 아이콘을 포함합니다.
프로토타이핑 라이브러리를 사용해 정적 프로토타입을 만들 수 있습니다. 고급 구성 요소, 커넥터 라인, 인터랙티브 미리보기와 같은 기능은 Miro 프로토타입 애드온이 필요합니다.
프로토타이핑 라이브러리는 미로에서 단일 및 다중 화면 흐름을 수동으로 만드는 데 필요한 모든 것을 제공합니다
프로토타이핑 라이브러리 열기
- 캔버스에서 생성 도구 모음에서 툴, 미디어 및 통합 (
)을 클릭하세요.
- 프로토타입을 검색한 후 프로토타입 라이브러리를 클릭하세요.
- 프로토타입 라이브러리 패널이 열립니다.
프로토타입 라이브러리에 무엇이 있는가
프로토타입 라이브러리는 탭으로 구성되어 있습니다. 모든 사용자가 화면, UI 구성 요소, 아이콘을 사용하여 정적 프로토타입 레이아웃을 구성할 수 있습니다.
💡 AI로 생성된 프로토타입과 인터랙티브 플로우의 경우, Miro Prototypes와 함께 프로토타이핑 라이브러리를 사용하세요.
화면
화면은 프로토타이핑 플로우를 위한 준비된 프레임입니다. 사용자는 모바일, 태블릿 또는 데스크탑 화면을 캔버스에 추가하고 UI 요소를 끌어다 놓아 레이아웃을 구성할 수 있습니다.
화면 작업
- 스크린 크롬 표시 또는 숨기기 (기기 프레임처럼 보이거나 단순한 프레임으로 보일 수 있음)
- 스크린 회전
- 스크린 크기 조정 (세로만 확장 가능)
UI 컴포넌트
UI 컴포넌트는 버튼, 입력창, 내비게이션 바, 폼 요소 등 화면에 드래그하여 사용할 수 있는 일반적인 인터페이스 요소입니다.
다음을 할 수 있습니다:
- 컴포넌트를 화면에 드래그
- 컴포넌트 크기 조정 및 재배치
- 컨텍스트 메뉴에서 텍스트 및 기본 스타일 편집
✏️ 선택한 요소에 따라 상황에 맞는 메뉴 옵션이 다릅니다.
Miro Prototypes 애드온이 활성화되면 일부 UI 구성 요소가 미리보기 모드에서 인터랙티브하게 됩니다. 예를 들어 버튼, 슬라이더, 입력 필드 및 드롭다운 메뉴는 정의된 커넥터 라인에 따라 사용자 동작에 반응합니다.
고급 구성 요소와 같은 일부 구성 요소 세트는 Miro Prototypes 애드온이 있어야만 사용할 수 있습니다. 만약 이 애드온이 활성화되지 않았다면, 이러한 구성 요소는 라이브러리에서 표시기로 표시될 수 있습니다.
아이콘
아이콘 탭에는 프로토타입에서 사용할 수 있는 검색 가능한 아이콘 라이브러리가 포함되어 있습니다.
아이콘 추가 또는 교체
- 라이브러리에서 아이콘을 드래그하여 캔버스에 올려놓습니다.
- 아이콘을 선택하고 컨텍스트 메뉴에서 색상을 업데이트합니다.
- 아이콘 교체를 선택하여 위치나 크기를 변경하지 않고 다른 아이콘으로 교체합니다.
와이어프레임 (기존 버전)
와이어프레임 탭에는 기존 와이어프레임 요소가 포함되어 있습니다. 이 요소들은 기존 보드에서 계속 사용할 수 있으며, 편집 가능합니다. 새로운 프로토타입에서는 프로토타이핑 라이브러리의 화면과 UI 구성 요소를 사용해야 합니다.
연결선과 인터랙티비티 (Miro Prototypes 애드온)
커넥터 라인은 프로토타입 내의 화면들 간 내비게이션을 정의합니다. Miro Prototypes 애드온이 활성화되면, 요소와 화면 사이에 커넥터 라인을 생성하여 다단계 흐름을 구축할 수 있습니다.
커넥터 라인은 또한 인터랙티브 미리보기를 가능하게 합니다. 미리보기 모드에서는 연결된 화면들이 클릭 가능한 흐름처럼 작동하고, 화면이 뷰포트를 초과할 경우 세로로 스크롤됩니다. 애드온 없이 커넥터 라인와 인터랙티브 기능은 사용이 불가능합니다.
💡 일부 UI 요소는 화면에 추가될 때 번개 아이콘이 표시됩니다. 다중 화면 흐름에서 번개 아이콘을 끌어 화면 간에 커넥터 라인을 생성하세요.