기획/프로젝트툴 분석

|  놀이터라 생각하고 마음껏 떠들어요! ^^


프로젝트 툴 네이버 프로토나우 무엇인가?

 

 

이번시간은 위젯과 인터랙션을 사용하여 프로토타입을 쉽고 빠르게 제작할수 있는 프로토타이핑 툴 <프로토나우>에 대해 알아 볼까 합니다.

 

1.jpg

           

1.주요기능

 

지난 네이버의 디자인스튜디오의 업그레이드 버전으로 생각하시면 될것같습니다. 기존 디자인스튜디오는 웹사이트에 최적화가 되었다면  프로토나우는 모바일 화면설계및 프로토타이핑에 더욱 최적화되었습니다.

 

1.jpg          2.jpg          3.jpg

 

모바일 설계서를 제작 :

모바일 바이스 가이드에서 기종을 선택하면 해상도가 설정되고 모바일 설계서를 작업 할 수 있습니다.  

 

빠른 인터렉션을 적용 :

플리킹 영역, 햄버거 메뉴 위젯을 삽입하여 자동으로 인터랙션을 적용할 수 있습니다.

 

링크를 연결 :

문서의 버튼이나 이미지, 텍스트에 링크를 설정하여 원하는 곳으로 이동할 수 있습니다.

 

4.jpg     5.jpg     6.jpg

이미지 라이브러리 사용 :

다양한 픽토그램 아이콘과 모바일 OS의 UI 컴포넌트를 활용하여 화면 설계 가능

 

URL로 업무를 공유:

URL 링크나 QR코드로 모바일과 PC에서 프로젝트 구성원들과 바로 업무를 공유.

 

다국어 지원:

한국어,영어,일본어,중국어를 지원하여 원하는 언어로 설정

 

2.설치하기

 

네이버 개발센터의 프로토나우에서   (http://dev.naver.com/projects/prtnow)

최신파일(버전 1.0)을 다운로드 받을 수 있습니다.

 

4.jpg

 

시스템 요구사항

운영체제:  Windows 7(Mac OS 지원안함)

브라우저: Internet Explorer 8.0이상 또는 Chrome  웹브라우저

.net framework 4 최신버전설치

 

2.설치 시작

 

다운로드 후 설치를 진행하시면 됩니다. 나눔글꼴을 사용을 권장하지만 사용 안 하셔도 무방합니다

 

                 5.jpg

 

 

3. 화면구성

 

화면구성은 워드와 비슷한 구조로 익숙한 레이아웃을 보여주고 있습니다. 지난번 디자인스튜디오와 거의 동일한 구조입니다.

 

6.jpg

 

1.메뉴영역 : 각각의 메뉴를 열어 상세 메뉴를 실행 할 수 있습니다.

2.사이트맵 영역: 페이지별로 사이트맵을 구성, 페이지의 depth 적용이 가능하고 폴더별 그룹핑 가능합니다.

3.위셋및 라이브러리 영역:

 화면설계에 사용되는 위젯,인터렉션 기능을 적용할 수 있는 18종 위젯과 웹 아이콘과 디바이스 아이콘등 라이브러리 제공합니다.

4.디바이스 해상도:  디바이스별 해상도 설정시 화면크기에 맞춰서 보여줍니다.

5.페이지노트: 사용중인 페이지의 설명을 입력하는 영역입니다.

6.툴바영역: 편집에 필요한 주요기능들이 노출됩니다.

7.위젯인터렉션: 화면에 사용중인 위젯에 인터렉션 효과를 적용할 수 있습니다.

8.위젯노트: 화면에 사용중인 위젯의 설명을 입력하는 영역입니다.

9.위젯속성: 위젯의 속성을 정의합니다.

10.위젯스타일: 위젯의 스타일을 편입할수 있습니다.