생성된 코드, 자유로운 수정 및 상세 기능 추가 가능...N스크린 환경 지원

▲ 다빈치스튜디오 결과물

[Preview] 개발자들의 최근 화두는 HTML5이다. 기존의 HTML은 표현력의 한계로 리치한 콘텐츠를 표현하기 위해서는 플러그인을 추가해야 했다. 하지만 이러한 플러그인은 표준화된 것이 없었고 이를 구현하기 위해서는 새로운 개발언어를 습득해야 됐다.

이런 문제를 개선하기 위해 W3C(World Wide Web Consortium)에선 2007년부터 현재 트랜드를 반영한 웹 표준안 수립을 위한 활동을 시작했고 2014년에 완료될 예정이다. 현재 출시되는 대부분의 데스크탑 및 모바일 브라우저는 HTML5를 지원하고 있으며 그 영역은 TV, 자동차 등에까지 확장되고 있어 주목된다.

다년간 HTML5 관련 노하우와 기술력을 집적해와 이 분야 전문가로 구성된 다빈치소프트웨어연구소는 HTML5 저작도구를 개발자가 쉽고 간편하게 제작할 수 있도록 노력해왔다. 보유한 저작도구는 다빈치스튜디오와 다빈치애니메이터 두 종류.

다빈치 저작도구의 특징은 프로젝트 관리를 위해 메타파일을 사용하지 않는다는 점이다. 이 때문에 저작도구로부터 생성된 코드의 자유로운 수정 및 세세한 기능 추가가 가능하고, 소스 상에서 수정 된 코드는 쉽게 다시 저작도구에서 불러 들일 수가 있다.

웹 애플리케이션 저작도구로 해외에 센챠(Sencha)라는 업체가 있다. 독자적으로 개발한 프레임워크를 기반으로 한 센챠아키텍트(Sencha Architect) 저작도구는 메타파일로 프로젝트가 관리가 되어서 생성된 코드를 수정하여 역으로 불러드리는 것이 불가능하다.

반면 다빈치 저작도구는 공통적으로 멀티플랫폼 대응을 위한 N스크린 저작환경을 제공하고 있으며 자주 사용되는 기능을 미리 정의하여 초심자도 쉽게 개발 할 수 있도록 지원하고 있다.

▲ 다빈치스튜디오 화면
[Review] 다빈치스튜디오는 리치 웹 애플리케이션을 저작하는 도구이다. 기본 프레임워크는 현재 전세계 웹페이지의 90%이상을 점유하고 있는 jQuery를 기반으로 했기 때문에, 이미 jQuery에 친숙한 개발자라면 쉽게 접근할 수 있으며 초보 개발자라도 공개되어 있는 많은 자료를 통해서 어렵지 않게 습득이 가능하다.

이클립스 통합 버전으로 개발된 다빈치스튜디오는 윈도우(32bit/64bit)뿐만 아니라 맥(32bit/64bit)용도 출시되어 개발자 지원 폭을 넓힌 상태다.

다빈치스튜디오는 크게 코딩 에디터 영역인 다빈치스튜디오와 UI 구성 영역인 다빈치디자이너 두 부분으로 구성되어 있다. 먼저 실행 시 가장 처음 접하는 화면은 프로젝트 기본 구성 파일 관리 및 이벤트 핸들러 또는 기타 추가 코딩 작업이 진행되는 이클립스 작업 환경이다. 앞으로 설명할 다빈치디자이너와 유기적으로 연동되며 다빈치디자이너에서 작업한 모든 내용은 바로 이 곳 코드에 바로 적용이 된다. 특히 세부 작업을 필요로 할 때 용이했다.

다빈치스튜디오는 오픈아키텍처 구조로 공개되어 있는 다양한 오픈 소스 프레임워크는 물론 개발자가 보유한 프레임워크까지 정합이 가능했다. 필요에 따라 개발된 웹 애플리케이션을 다빈치스튜디오에서 서비스 중인 다빈치 빌드서버를 통해 iOS 또는 Android로 패키지화하여 Appstore, Google Play, T store, 올레마켓 등에 배포할 수 있었다.

▲ 다빈치디자이너 화면
또한 다빈치디자이너는 앱 개발자와 디자이너가 협업이 가능하도록 만든 다빈치소프트웨여언구소의 야심작이다. 웹 애플리케이션 개발 시 필요한 요소를 다양한 위젯을 통해 제공하고 있으며 데이터 연동, N스크린 편집기, CSS 스타일 수정, 각종 이벤트 연동 등 다양한 기능이 포함 되어있다.

50여 종의 기본 위젯 제공, 용이한 확장성
애플리케이션 구현에 있어 Header, Footer, Form, Button, Listview, DataSouce 등 개발에 사용되는 50여 종의 위젯을 제공해주었다. 또한 필요에 따라 사용자 정의된 위젯이나 외부 위젯 또한 추가가 가능하여 확장성이 좋다.

다빈치디자이너는 비주얼 데이터 바인딩 기능을 제공해 어려운 서버와의 데이터 연동을 쉽게해준다. 애플리케이션 개발에 있어 손이 많이 가는 작업 중에 하나가 서버와의 데이터 연동이다. 다빈치디자이너의 비주얼 데이터 바인딩 기능은 관련 폼에 외부 데이터 형식을 입력하면 데이터를 불러오고 분석하여 트리 형태로 보여준다. 이 때문에 분석 된 트리 구조를 해당 위젯에 드래그엔드랍하는 것으로 코딩 작업 없이 데이터 연동이 가능했다.

▲ N스크린 편집기
N스크린 편집기 OSMU(One Source Multi Use) 현실화
현재도 수없이 등장하는 스마트기기들은 다양한 해상도, 화면 비율을 가지고 있다. 이런 상황을 맞춰 애플리케이션을 제작하는 것은 시간 낭비 및 개발비 상승으로 이어진다. 이 회사가 제공하는 N스크린 편집기는, 다양한 기기의 세로, 가로 모드에서 스마트폰, 테블릿은 물론 스마트TV와 같은 대형화면까지 CSS3 Media Query를 이용해 하나의 애플리케이션으로 개발할 수 있어 주목된다. 

최한기 기자
저작권자 © 데일리그리드 무단전재 및 재배포 금지