어도비, HTML5 기반 '포토샵 UI' 오픈소스로 메이저 사이트

어도비가 포토샵을 다루는 웹 및 애플리케이션 디자인 전문가를 위해 만든 HTML5 기반 사용자인터페이스(UI)를 오픈소스로 메이저 사이트했다. 여기에 '포토샵 디자인 스페이스'라는 이름을 붙였다.

포토샵 디자인 스페이스는 어도비가 포토샵 프로그램의 기본 UI와 별개로 쓸 수 있도록 구성한 HTML5 기반 UI다. 어도비 포토샵 CC 최신판에서 써볼 수 있다. 애플리케이션과 웹을 디자인하는 데 필요한 도구를 중심으로 맞춰져 있어 해당 업무 담당자들이 쓰기 좋다는 설명이다.

포토샵 디자인 스페이스의 HTML5 기반 UI를 체험해 보려면 최신 어도비 포토샵 CC 버전의 설정(Preferences) 항목에서 'Technology Previews' 옵션 중 'Enable Design Space'를 켜거나 툴바에서 해당 아이콘을 누르면 된다.

포토샵 디자인 스페이스는 일반 포토샵 UI와 뭐가 다를까? IT미디어 아스테크니카가 지난 23일자 보도를 통해 주요 특징을 3가지 정도로 요약해 전했다. (☞링크)

어도비 HTML5 기반 포토샵UI 프로젝트 '포토샵디자인스페이스' 공식사이트

우선 이미지를 편집하는 영역을 직접 지정하는 대신 '아이폰6'니 '안드로이드1080p'니 '마이크로소프트 서피스3'니 하는 식으로, 모바일기기 명칭을 지정해 일반적으로 통용되고 있는 화면 해상도로 간편하게 선택할 수 있다.

선택 도구를 쓰기도 쉽다. 캔버스에 있는 항목을 더블클릭하면 그 레이어를 드릴다운할 수 있다. 문자열에 화살표를 놓고 더블클릭하면 텍스트 편집도구로 전환된다. 패스 요소에 대고 더블클릭을 하면 패스 편집도구로 전환된다. 두가지 항목을 동시에 선택할 수 있으며 버튼을 눌러 그 위치를 맞바꿀 수 있다. 즉 UI 모형을 구성할 때 빠르게 재배열하기가 쉽다.

속성을 입력하는 문자 입력칸은 색상값을 RGB, 헥사코드, CSS정의 색상 등을 모두 알아듣고 모든 숫자 입력칸은 수학 연산자를 이해한다.

포토샵 디자인 스페이스 공식페이지(☞링크)에 이를 소개한 어도비 측은 프로젝트를 통해 "정제된 인터페이스와 워크플로를 만들기 위해 추려진 핵심 기능을 쓸 수 있도록 해주는 아키텍처를 실험 중"이라며 "첫 결과물은 간명한 경험으로 화면 디자이너의 입맛에 맞췄다"고 설명했다.

이 프로젝트가 암시하는 것은 사실 어도비가 자사 포토샵 프로그램의 UI를 HTML5 기반으로 재구성할 수 있도록 했고, 그 아이디어를 회사 밖에서 얻는 방향에도 기대를 걸고 있다는 점일 것이다.

같은 디자인 담당자라 하더라도 업무 영역이나 성격에 따라 포토샵 안에서 제공하는 것 가운데 자주 쓰는 기능과 유용한 도구는 제각각일 수 있다. 이런 사람들이 포토샵 디자인 스페이스라는 프로젝트를 통해 표준 UI보다 나은 생산성을 얻을 수 있다는 점이 입증되면, 어도비 포토샵은 더 많은 업무 영역의 전문가를 지원하는 툴로 발전할 수 있게 된다.

어도비는 온라인 소스코드 공유 및 개발자 협업 사이트인 기트허브(GitHub)에 포토샵 디자인 스페이스를 위한 오픈소스 프로젝트 페이지를 개설했다. 여기에 포토샵 디자인 스페이스의 소스코드를 메이저 사이트하고 다른 사람들이 그걸 가져다 고쳐 쓸 수 있도록 만들었다. (☞링크)