코디네이터 베타로 구현한 WPF, Silverlight UI Theme 디자인.
모든 기본 UI 콘트롤에 적용 가능합니다.


신고

안녕하세요? witstudio의 김대욱입니다. 그동안 동영상등으로만 몇번 소개드린바 있던 WPF UI테마 엔진인 Codinator(코디네이터)가 드디어 베타서비스를 시작 하였습니다. UI개발 & 디자인을 효율적으로 진행 할 수 있는 방법에 대해 많은 시간을 고민한 끝에 제작된 Codinator는 UI테마를 통해 간단한 조작만으로 다양한 Look & Feel를 선택하고 원하는 형태로 수정이 가능한 제품입니다. 현재 베타 서비스는 아래와 같이 진행되고 있으니 많은 관심 부탁드리겠습니다.


[Codinator Closed Beta 서비스 안내]

기간 : 2010년 12월 4일 ~ 2011년 1월 30일(예정)
대상 : WPF 기술을 사용하는 개발자 & 디자이너
사용환경 : Visual Studio 2010 또는 Expression Blend 4, .NetFramework 4이상
신청방법 : service@codinator.net으로 이름,소속,연락처,사용목적등을 간단하게 작성하여 참여 신청 메일을 보내주시면됩니다.


Codinator는 기존 개발자, 디자이너가 쉽게 제품에 적응 하고 사용할 수 있도록 Visual Studio와 Expression Blend에서 플러그인 형태로 동작하게 되며 현재 Codinator Beta에서 제공되고 있는 기능은 아래와 같습니다. 

테마 선택하기

테마 선택하기는 미리 제작된 테마(Style과 Template의 묶음)를 간단하게 선택해 반영 해 볼 수 있는 기능으로 현재 베타버전에서는 총 4개의 테마(BlueCity, GodFather, Aquarium, ConcreteBlock)를 제공하고 있으며 각각 테마에는 Button, ListBox, TextBox, TabControl, Panel에 대한 테마가 정의되어 있습니다. 정식버전에서는 모든 종류의 기본컨트롤을 지원할 계획에 있으며 자신이 직접 제작한 테마도 적용 할 수 있습니다.

스타일 선택하기

테마에서는 각 요소마다 한개 이상의 스타일을 가질 수 있습니다. 만약 요소에 대한 기본 스타일이 정의 되어 있는 경우에는 테마를 선택할 때 기본스타일이 반영이 되지만, 기본 스타일이 없거나 다른 스타일을 선택하고자 할때에는 직접 스타일을 선택하여 적용할 수 있습니다.

컬러 수정하기(Color Wheel)

Codinator에서는 Color Wheel을 이용해 디자이너가 아니라도 쉽게 테마의 전체적 분위기를 변경 해 볼 수 있습니다. ColorWheel을 이용하면 테마에서 사용된 색들간의 비율을 유지하면서 색을 변경해 주기 때문에 손쉽게 자연스러운 색으로 변환 할 수 있습니다. 색을 변경할때에는 반영된 결과가 Designer View에 실시간으로 보여지기 때문에 쉽게 원하는 느낌으로 찾아갈 수 있습니다.

컬러 수정하기(Detail)

ColorWheel을 이용한 컬러 수정이 간단하게 전체적인 분위기를 바꾸는 작업이었다면, 이번에는 각각 요소에 대한 색을 디테일하게 변경해 보도록 하겠습니다. 검색 영역에 수정할 요소의 이름을 입력하면 해당 요소가 사용하는 브러시의 목록이 나타나게 되며 여기서 각 요소에 대한 디테일한 수정이 가능합니다.

리소스 저장 및 불러오기

ColorWheel과 Detail Editor를 이용한 리소스는 결과를 저장하거나 불러올 수 있습니다. 이를 활용하면 다양한 리소스 목록을 이용해 한번작업해놓은 결과물을 수시로 바꿔가며 반영해 볼 수 있고, 동료 개발자/디자이너와 공유하기도 쉽습니다.

색맹/색약 시뮬레이션

세계적으로 전체 인구의 약 10%가 색맹 또는 색약을 가지고 있다고 합니다. Codinator에서는 여러분께서 선택하고 수정하신 테마가 이들에게 어떻게 보여지는지를 시뮬레이션 하고 이를 보고 색을 보정 할 수 있는 기능을 제공함으로 써 더 많은 사용자에게 편리한 UX를 제공 할 수 있도록 돕습니다.

이상으로 현재 Codinator Beta에서 제공되고 있는 기능에 대한 소개를 마치며 혹시 더 궁금하신점이나 베타 참여, 피드백, 기타 문의 사항은 언제든지 저에게 또는 service@codinator.net 으로 연락주시면 감사하겠습니다. 아직 부족한점이 많은 제품이지만 관심 가져 주셔서 감사드리며 앞으로 더 나은 제품을 만들기 위해 노력하고 끝까지 최선을 다하겠습니다. 많은 관심과 응원부탁드리겠습니다.

감사합니다!!

신고

프라이머 엔턴십 데모데이 행사에서 발표하는 김대욱 매니저의 멋진 모습입니다!

신고


S/W를 평가하는 기준에서 UI가 차지하는 비중이 높아지면서 UI개발이 S/W개발 프로젝트에있어 큰 이슈로 자리잡고 있습니다. 때문에 UI개발 관련 기술이 발달하였고 높은 퀄리티의 UI제작이 가능하게 되었지만 개발의 과정과 관리는 역시 큰 문제로 자리잡고 있습니다.




이러한 문제를 해결하기 위해 저희 wit는 UI 테마 개념을 도입하여 그 동안의 프로젝트를 통해 쌓아온 UI개발 노하우를 녹여낸 WPF기반의 UI 테마제작 엔진 Codinator를 개발하였습니다. S/W의 UI를 개발할 때 UI 테마 개념을 도입하게 되면 사후 관리가 무척 편리해 지지만 그 개발과정이 쉽지않아 대부분 WPF를 사용한 프로젝트임에도 불구하고 이미지를 자르거나 재사용이 불가능한 형태로 UI를 개발하고 있습니다.















Codinator를 사용하게 되면 쉽지 않았던 UI 테마 개발은 물론 테마의 빠르고 디테일한 컬러수정, 그리고 포토샵에서나 가능했던 퀄리티의 이펙트 조정등이 가능해 집니다. 때문에 개발자와 디자이너의 커뮤니케이션이 수월해 짐은 물론 아쉬웠던 서로의 요구사항에 적절히 대응할 수 있습니다. 또한 가장 큰 문제로 자리잡았던 유지보수 과정이 훨씬 간소해 집니다. 이 외에도 색맹, 색약을 가진 사람들을 위한 Vision기능을 가지고 있어 그들에게 현재 UI컬러가 어떻게 보이는지 시뮬레이션 해보고 교정하는 것이 가능합니다.

저희 wit는 프라이머 엔턴십 프로그램에 참여하여 그동안 교육을 받아왔고 바로 어제(8/31) Demo Day를 통해 기자들과 업계관련 사람들에게 Codinator를 처음 공개하였습니다.

공개한 동영상을 아래에 공개합니다. 많은 관심 부탁드립니다!!


신고

참관신청 접수 안내 :
http://onoffmix.com/event/1741


wit도 참가하였습니다. :D






신고