안녕하세요. 위트스튜디오 코디네이터 팀입니다.

코디네이터 2.0 CBT 1차가 벌써 3주째 지나고 있네요. 다음 준비를 위해 저희도 열심히 개발하고 있습니다.

 

오늘 소개해 드릴 기능은 Shape Change 즉, 모양 변경하기 입니다.

지난 스타트업 마켓에서 공개 했을 당시 가장 많은 관심을 받았던 기능이니 두눈 크게 뜨고 보셔도 좋을 것 같습니다. :)

 

앞서 소개해 드렸듯이 코디네이터는 기본적으로 모양(Shape)과 스타일(Style)이 분리되어 있습니다.

이는 스타일을 완성해 놓았다면 모양을 변경하여도 스타일은 그대로 유지가 된다는 것을 의미합니다!

두 눈으로 직접 확인하셔야 이 기능이 가슴에 확 와 닿으실텐데 그림과 함께 설명을 드리겠습니다.

 

 

1. 다음과 같이 간단한 시계위젯 디자인이 완료되었다고 가정해 봅시다. 분명히 여기저기서 피드백이 쏟아지며 수정에 수정을 맞이할 운명에 놓여지게 되겠죠? 그 중 모양을 변경해 보자는 수정 이슈가 나타났다면? 이미 스타일링은 될대로 되어있고, 다시 모양을 새로 그린 다음에 스타일 복사를 하던지 다시 그리던지 해야 할 것입니다. 사실상 이 시계위젯 디자인은 거의 다시 작업되어야 할 운명이겠죠...

 

 

 

 2. 하지만 코디네이터의 Shape Change 기능을 사용하면 기분 좋게 다양한 디자인 실험을 할 수 있습니다. 먼저 시계 위젯을 하나 더 복사하여 옆자리에 위치한 다음 시계의 외곽 모양이 그려진 레이어를 선택합니다. 그 다음은 굉장히 쉽습니다. 그 레이어의 모든 정보를 담고 있는 우측의 Properties Dock에서 레이어의 모양(Shape)을 변경 할 수 있습니다.

 

 

 

 3. 사각형(Rectangle) 모양으로 변경한 후 라운딩 값을 한번 적용해 보았더니 스타일은 유지한채 모양만 변경된 것이 확인되었습니다.

 

 

 

4. 하지만 뭔가 어색합니다. 나머지 스타일이 적용되어 있는 레이어에도 동일한 모양이 적용되어야 할 것 같습니다. 그렇다면 모양을 복사해야 하겠죠. 방금 사각형으로 변경한 모양 정보를 '복사(Copy Shape)'한 다음에 나머지 레이어에 붙여넣기를 하면 해결 됩니다.

 

 

 

5. 보이는 것처럼 모양을 동일하게 변경하고자 하는 레이어를 선택한 후 Paste Shape을 하면 모두 동일한 모양으로 적용되고 스타일은 그대로 유지가 되어 있는 것을 확인할 수 있습니다.

 

 

 

6. 동일한 방법을 사용하면 클릭 몇 번 만으로 다양한 모양으로 변경해 볼 수 있습니다. 보시는 것처럼 스타일은 모두 유지가 되어 있습니다. 이제 모양을 변경하기 위해 작업을 다시 해야할 일이 없음은 물론, 귀찮음으로 인해 모양을 변경하지 않았던 지난날의 나의 모습도 모두 안녕입니다.  ^_^/  안녕~

 

 

 

 

저작자 표시 비영리 변경 금지
신고

 

안녕하세요. 위트스튜디오 코디네이터 팀입니다.

현재 코디네이터 2.0 CBT 1차가 2주째 지나고 있습니다. 테스터분들의 소중한 피드백 덕분에 점점 더 멋진 툴로 성장해 나가고 있습니다!

 

이제 부터 코디네이터의 기본 개념부터 기능을 서서히 하나씩 풀어 정보를 제공해 드리고자 합니다.

코디네이터가 왜 '앱 디자인(GUI) 전용 툴'인지 그 강력한 기능을 꼼꼼히 차례대로 상세히 알려 드리겠습니다.

 

그 첫번째 순서로 코디네이터에서의 디자인 작업을 하는 방법에 대해 그 개념을 알려드리고자 합니다.

코디네이터는 기본적으로 모양(Shape)과 스타일(Style)이 분리되어 있습니다. 즉 먼저 모양을 그리고 그 위에 스타일을 입혀 디자인을 완성하는 방식입니다. 스타일을 입히는 방법은 굉장히 쉬운데요, 마테리얼이라고 불리우는 '디자인 재료(Material)'를 마치 레고 조립 하듯이 추가하면 그만입니다. 그림과 함께 설명을 드리자면 다음과 같습니다.

 

 

 

1. 캔버스 위에 Shape Tool을 사용하여 사각형의 모양을 먼저 그려 보았습니다. 그러면 우측의 Properties Dock에서 Stylist 라는 그룹에 자동으로 Fill이라는 기본 디자인재료가 자동으로 추가되어 있습니다. 

 

 

2. 그 이후는 간단합니다. 그저 원하는 디자인 재료를 추가하고 조절하면 그만입니다. 여기서 한가지 놀라운 사실은 동일한 디자인 재료라도 원하는 만큼 추가할 수 있다는 점입니다. 즉, 레이어 한개로 원하는 스타일을 마음껏 구현할 수 있다는 것을 의미합니다. 

 

 

 

3. 사용자가 추가하고 싶은 모든 효과는 디자인 재료(Material)에 모두 있습니다. 기본적인 Fill, Stroke, Drop Shadow 뿐만 아니라 Blur, Level, Texture, Pattern 등 GUI 디자인 작업에 필요한 모든 재료가 준비되어 있습니다. 또한 디자인 재료(Material)을 모두 수치값을 보존하고 있기 때문에 언제든지 수정이 가능합니다. 

 

 

 

4. 이미지를 불러와 작업하는 것도 물론 가능합니다. 이미지를 불러들일 수 있는 디자인 재료(Material)를 추가하고, 지금껏 해오던 방식 그대로 스타일링을 하면 됩니다. 

 

 

 

소개된 것과 같이 코디네이터는 레고블럭 조립방식과 동일한 스타일링 방법을 갖고 있기 때문에 굉장히 직관적인 디자인 작업이 가능하며, 얼마든지 쉽게 추가하고 제거할 수 있는 유동성까지 갖추고 있습니다.

 

  

 

 

 

 

 

 

 

 

저작자 표시 비영리 변경 금지
신고

 

앱디자인 전용 툴 '코디네이터' 2.0 이 9/1 부터 약 한달간 클로즈베타 서비스를 시작합니다.

 

1.1 버전 이후로 더욱 강력하고 놀라운 기능으로 돌아온 코디네이터에 많은 관심을 부탁드립니다. ^0^

클로즈베타 테스트를 통해 중점적으로 기본 사용성을 테스트하고 테스트 결과에 따라 부분적인 기능을 추가하거나 사용성을 개선하여 오픈베타 버전을 런칭할 예정입니다.

 

전세계 디자이너들이 쾌적하고 효율적인 디자인 작업을 할 수 있도록, 그리고 누구나 열정만 있다면 손쉽게 앱디자인 작업을 할 수 있도록 좋은 툴을 만들어 가겠습니다.

 

 

 

www.codinator.net

(문의 사항은 service@codinator.net 으로 부탁 드립니다.)

 

 

 

 

 

저작자 표시 비영리 변경 금지
신고

 

 

 

저희 위트스튜디오에서 개발한 앱디자인 전용 툴 '코디네이터' 2.0이 드디어 알파테스트를 시작하였습니다!

 

내부 알파테스트를 하는 이유는 베타버전을 출시 하기 전 기본적인 사용성을 체크하기도 하고 버그도 잡아내어 더 완성도 높은

툴을 공개 하기 위함입니다. 알파테스트를 거친 후 조만간 클로즈베타 기간에 돌입하게 되니 많은 관심 부탁드립니다.

 

 

 

 

 

 

내친김에 놀라운 소식을 하나 더 전해 드립니다!

코디네이터 최신 버전인 1.1의 프로젝트 생성건이 42000건을 돌파하며 순항중입니다. 액티브 유저율도 높아요!(약 61%)

다만 국내보다는 해외에서 훨씬 높은 비율의 사용성을 보이고 있네요.
전세계 코디네이터 사용자들에게 하루 빨리 2.0을 공개하여 더 많은 사랑을 받을 수 있도록 달리겠습니다. '_')/

 

 

 

 

저작자 표시 비영리 변경 금지
신고

앱디자인 전용 툴 '코디네이터' 2.0의 알파버전이 완성 직전임을 알려드립니다.
알파버전이 완성되면 기능 동작과 작업 플로우 등의 검증을 거쳐 클로즈베타를 진행하고 베타버전을 공개할 계획입니다. 모두 연내에 이루어질 계획들이구요!

 

그리고 최종 확정된 코디네이터의 디자인화면을 공유합니다. 디자인 개선 과정에서 블랙계열로 정착이 되었는데 마침 어도비 포토샵 CS6도 블랙계열의 테마를 내놓았더라구요. 요즘 툴디자인은 어두운 계열이 트렌드인가 봅니다.

 

 

 

 

참고로 코디네이터 2.0의 개발 코드명은 '프로메테우스'입니다. (공교롭게도 이번 화제작 리들리스콧 감독의 '프로메테우스'와 겹치네요...) 코디네이터가 앱디자인 역사의 한 획을 긋고 의미 있는 툴이 되려 '프로메테우스'라는 코드명을 부여했는데 반드시 그렇게 되도록 할 생각입니다. ^_^ 사랑해 주세요~~~

 

 

 

 

 

 

 

 

 

저작자 표시 비영리 변경 금지
신고