스윙투앱에서 제공하는 프로토타입 UI 스타일 소개
스윙에서는[슬라이드, 탑, 푸터, 드롭다운 리스트, 드롭다운 박스, 푸시, 웹뷰 ]메뉴 총 7가지 디자인 스타일을 제공하고 있습니다.
매뉴얼을 통해서 각각의 프로토타입 디자인 설명과 함께 프로토타입 적용 앱 화면을 함께 확인해주세요.
*프로토타입 특이사항 1
프로토타입 메뉴 스타일을 변경하게 되면, 앱을 다시 제작해서 새 버전으로 확인해야 수정사항이 반영됩니다.
예)처음에 슬라이드 메뉴로 만들었는데, 푸터 스타일로 프로토타입을 바꾸고 싶어요.
=프로토타입은 실시간으로 수정사항이 반영되는 항목이 아니기 때문에 앱제작요청을 통해서 앱을 다시 제작해야만 수정사항이 반영되요!
앱제작요청 버튼을 누른 후 소프트업데이트=[앱재실행]으로 업데이트 하시면 재설치 번거로움 없이 업데이트가 가능합니다.
*프로토타입 특이사항 2
일반 프로토타입(슬라이드, 탑, 푸터, 드롭다운 리스트, 드롭다운 박스) 으로 앱 제작 후 → 웹뷰 기반 (푸시, 웹뷰) 프로토타입으로 변경할 수 없습니다.
*프로토타입을 웹뷰 기반으로 변경해야 할 경우는 앱을 새로 제작해서 만들어주셔야 합니다.
+[앱 추가 제작] 버튼 눌러서 진행
반대의 경우도 동일해요!
*웹뷰 기반 (푸시, 웹뷰) 프로토타입으로 제작 후 → 일반 프로토타입(슬라이드, 탑, 푸터, 드롭다운 리스트, 드롭다운 박스)으로 변경할 수 없습니다.
+일반 프로토타입(슬라이드, 탑, 푸터, 드롭다운 리스트, 드롭다운 박스)은 자유롭게 변경 가능합니다.
* 웹뷰, 푸시 프로토타입 특이사항 3
프로토타입은 어디서 만들 수 있나요?
앱제작 마법사 페이지 → 2단계 디자인테마 → 프로토타입 선택에서 이용 할 수 있습니다.
앱제작페이지 – 디자인테마에서 프로토타입을 적용할 때는 오른쪽의 가상머신에 디자인이 바로 적용이 됩니다.
웹 가상머신(미리보기)을 통해서 프로토타입이 앱에 반영되는 모습을 실시간으로 확인할 수 있어요.
1. 슬라이드 메뉴
슬라이드 메뉴는 앱을 구성하는 카테고리의 내용이 처음부터 노출되지 않구요.
슬라이딩 아이콘을 터치했을 때 화면이 넘어가면서 카테고리 내용을 확인할 수 있도록 디자인 되어 있습니다
▶앱 실행화면 – 슬라이드UI 적용
▶ 앱 실행 화면 – 푸터 UI 적용
‘드롭다운 박스’는 기존의 ‘드롭다운 리스트’ 프로토타입와 동일하게 홈 화면 상단에만 최상위 메뉴 하나만 보이구요.
웹뷰는 웹사이트 자체를 앱에 그대로 옯겨놓았기 때문에 앱 디자인 자체가 굉장히 깔끔하고 제작하는데 큰 어려움이 없습니다.
모바일 전용 사이트를 가지고 있다면 모바일에 최적화된 앱을 만들 수 있습니다.
프로토타입 이용 주의사항