UIUX 디자인 입문 프로토타이핑,프로토파이,프레이머 4-3

프로토타이핑의 종류

어떤툴을 사용하면 좋은지?

 

 

피그마 프로토타이핑 (별도 프로토타이핑 툴 내보내거나 가져오는 과정이 필요할텐데 이러한 번잡한 과정 필요)

 

피그마 안에서 사용할수 있는 로우파이 프로토타이핑툴.

인터페이스툴이기때매 하이파이기능 불가.

 

피그마 프로토타이핑의 특징.

디자인에서 프로토타입으로 바로 전환가능 탭을 눌러서! 굉장큰 장점! 간단

탭전환 프로토타입 -> 프레임화면 드래그로 연결 

클릭/간단 인터랙션 정도

페이지이동 모달노출

 

프로토파이

국내에서 만들어진툴

로우파이 하이파이 중간정도레벨 쌤왈

코딩없이 실제제품과 비슷한 수준 프로토타입만들수있고,

GUI방식으로 위즈윅?방식

화면에 보이는 클릭~ GUI로 직관적

피그마에비해 높은 기반

텍스트입력값 직접 넣을 수 있고, 높은 수준의 구현력이다.

채팅예시로 챗을 칠수 있다.

 

특정상황 이동, 색상 변화 조건을 걸 수 있는 컨디션

코드를 잘몰라도 다양한 애니메이션과 인터랙션 구현 가능.

컨디션을 사용해야하기 때문에 툴 난이도는  조금 있다.

 

피그마 프로토타이핑 < 프로토파이 < 프레이머

 

 

프레이머 

 

실제제품과 유사수준.

코드기반툴(리액트)

인터페이스 디자인 툴 기능도 함게 제공으로 프로토타이핑까지 원툴 사용

 

재사용성

리액트코드로 프로토타입했다면 엔지니어와 의사소통을 할 수 있다.

버튼 특정초수가지고 움직여야하는데 느리게해주세요가 아닌 몇초로 해주세요가 더 정확

 

컴포넌트 재사용성

코드기반으로 애니메이션이나 특정조건을 재사용

 

CMS 컨텐츠 매니지먼트 시스템

컨텐츠등록하거나 삭제 관리 CMS기능이 있다.

글관리 배포까지 가능

 

인터랙션 애니메이션, 실제 제품과 같은수준

코드를 다루는데 익숙하면서 디자인개발하고 싶다면 추천.