Pingendo라는 Bootstrap 4 기반 프로토 타이핑 도구가 좋습니다.



  • 동작환경
  • Windows(필자 환경), MacOS, Linux


  • 사내에서 앱 개발이 있어 프로토타입 작성을 위해 다양한 툴을 찾고 있었습니다만, 동료가 가르쳐 준 Bootstrap 4 베이스의 Pingendo가 좋았기 때문에 소개합니다. Pingendo의 추천 포인트는 주로 다음 세 가지입니다!
  • 드래그 앤 드롭으로 UI 부품 배치
  • Bootstrap 4 기반 풍부한 UI 부품
  • 앱 내에서 높은 사용자 정의

  • 아래의 세부 사항을 살펴 보겠습니다.

    드래그 앤 드롭으로 UI 부품 배치



    Pingendo의 화면 구성은 다음과 같습니다.



    화면 왼쪽에 UI 파트, 중앙에 미리 보기, 화면 아래에 코드(기본적으로 최소화), 화면 오른쪽은 테마라는 배치입니다. 레이아웃은 세련되고 있으므로 사용할 때는 헤매지 않을까 생각합니다.

    내가 감동한 것은 왼쪽 메뉴에서 컴포넌트를 배치 할 때의 편리함입니다. 동영상으로 보면 바로 알 수 있을까 생각합니다.



    이러한 상태에 퐁퐁과 좋아하는 컴포넌트를 배치할 수 있습니다. 무엇보다 좋은 점은 메뉴를 볼 때 축소된 샘플을 목록에서 볼 수 있다는 것입니다.

    Bootstrap 4 기반 풍부한 UI 부품



    Pingendo에는 Bootstrap 4의 CSS 클래스를 사용한 컴포넌트가 풍부하게 준비되어 있습니다.



    대략적으로 다음 카테고리로 나뉩니다.
  • SECTIONS 섹션
  • GRID 그리드
  • TEXT 텍스트
  • BUTTONS 버튼
  • NAVS 네비게이션
  • MEDIA 미디어
  • LISTS 목록
  • CARDS 카드
  • FORMS 양식
  • OTHERS 기타

  • SECTIONS를 비롯해, 각각 Bootstrap의 파트를 조합해 이미 이용하기 쉬운 템플릿으로 만들어져 있으므로, 조합하는 것만으로 랜딩 페이지등은 폭속으로 만들 수 있습니다.

    앱 내에서 높은 맞춤화



    준비된 컴퍼넌트도 풍부합니다만, Pingendo 는 컴퍼넌트를 화면에 배치한 타이밍으로 HTML도 동시에 생성해 줍니다.



    물론 여기에서 HTML을 직접 편집하고 사용자 정의 할 수 있습니다.

    그리고 Bootstrap 을 이용하고 있어 자주 말하는 「Bootstrap 냄새」입니다만, 이것은 화면 우단의 THEME 를 편집하는 것으로 스타일을 오리지날의 것으로 수정할 수도 있습니다. 아래 동영상에서 버튼 스타일이 실시간으로 변경되는 것을 확인할 수 있습니다.



    Pingendo 무료 버전 제한



    편리하고 놀라운 Pingendo이지만 무료 버전과 유료 버전이 있으며 무료 버전에는 다음 제한 사항이 있습니다.
  • 월 5 일간의 앱 이용 제한
  • Pingendo 앱에서 로고 표시

  • 실질적인 기능 제한은 현재는 거의 제로이므로, 우선 사용해 보고 마음에 들면 사 보는 것도 손입니다. 유료판은 구독으로 1라이센스 월 $12, 연불이면 월 $9.

    좋은 웹페이지 즐겨찾기