[ETC] [자작앱] 어플리케이션 디자이너와 개발자를 위한 투명값 변환기를 만들었습니다.

[열받은디자이너]

 안녕하세요 자작/없만갤에 글을 처음 올리는 공업디자인을 전공하고 있는 대학생 입니다.

 우연찮게 창업동아리 활동을 통해 의료기기전자제품 개발 및 어플리케이션 개발 양산금형 전까지

 경험하였고 (법적문제로 망한건비밀) 제품디자인, 어플리케이션 디자인 경험을 통해

 이제는 자체적으로 어플리케이션을 만들고 싶은 욕심이 생겨 개발까지 건들게 되었습니다.

 현재 복습어플리케이션 창업팀에 들어가 디자이너로 활동 하고 있습니다.

 어플리케이션 디자인 도중 개발자 친구와 일하던 도중 투명도 값을 전달 하는 일이 생겼는데 디자이너의 언어와 개발자의

 언어는 다른것을 느끼게 되었습니다.

 디자이너는 투명도 값을 일러스트레이터나 포토샵을 통해 0~100까지 표시를 하나 개발프로그램에서는

 16진수값을 사용하는 것을 알게 되었습니다.

 그래서 항상 디자인 색상값을 전달 할때 개발자가 알아 들을 수 있는 언어로의 변환이 필요 한데 수시로

 계산을 해야되는 불편한 문제가 있었습니다.

 그래서 디자이너가 디자인 후 투명색상값 전달 시 바로 변환해주는 프로그램이 필요하다고 생각 하였습니다.

 그렇게 하여 자체 개발을 통해 탄생한 것이 디자이너와 개발자가 사용하는 협업툴'알파요(ALPHAYO)'입니다.

 로딩페이지 화면입니다.

앱을 실행하게 되면 투명도 값을 입력하는 값과 변환된 값이 나오는 창이 있습니다.

일러스트 or 포토샵 투명도 값을 입력하여 엔터 버튼 또는 '=' 버튼을 클릭 시 변환이 됩니다.

공유 버튼을 통해 어플리케이션을 공유 할 수 있도록 하였습니다.

(페이스북 공유시 링크가 생기지 않는 문제가 있는데 아시는분이 계시다면 조언을 듣고 싶습니다.)

현재 디자인 컨셉은 봄에 맞추어 'Cherry Blossom'입니다
어플 실행시 지루하지 않도록 예쁜 벛꽃이 휘날리도록 하였습니다. 

* 업데이트 예정
- 계절별 컨셉 배경 디자인 ex(Cherry Blossom, summer, Fall, winter등)
- 인앱 결제 배경화면

- 색상값 선택하여 투명도+색상값 까지 전달

- 자주쓰는 색상 저장 등

       

'알파요(ALPHAYO)'소개동영상 입니다.

구글플레이 : https://play.google.com/store/apps/details?id=com.idh.songk.alpha 

현재는 제가 개발자 출신이 아니기 때문에 구현할 수 있는 기능은 한계가 있어 위와 같은 예정 기능은

언제 구현이 완료될지 모르겠습니다. 

현재앱은 사용성을 높이기 위해 밤낮을 새가며 다른 사용자가 만족성을 느끼게 하고싶고

내가 사용자라도 만족 할 수 있는 개발을 하게되었습니다.

많은 디자이너들이 '알파요(ALPHAYO)' 사용하여 저처럼 망?하지 않고 성공하는 프로젝트가 많이 나왔으면 좋겠습니다.

긴글 읽어 주셔서 감사합니다!

아직 직장에서 개발 디자인을 담당한적은 없습니다. 

현업자 분이 있으시다면 현장 사용성에 대해 피드백 주시면 감사하겠습니다!

[EKUTZ]

고생하셨습니다...! 저는 아직 학생인데, 투명도도 중요하지만 나머지 부분도 16진수로 쓰다보니 RGB도 추가하면 좋을 것 같아요!

[열받은디자이너]

감사합니다 ㅎㅎ 디자인을 하시나요? 저도 RGB값까지 추가하면서 동시에 상대방한테 값을 보낼 수 있으면 좋을것 같다고 느꼈는데 말씀해주셔서 감사합니다! 가능한대로 다음 버전 업데이트시 추가해보도록 할게요 ^^

[EKUTZ]

안드로이드 공부중입니다 ㅎㅎ

[열받은디자이너]

아 ㅎㅎ 저도요즘 그래서 JAVA 부터 시작하고 있습니다 ㅎㅎ

[VivianProj]

고생하셨어요~ 디자인이 예쁘네요

[열받은디자이너]

댓글 남겨주셔서 감사합니다 ㅎㅎ 주변에 디자이너분 있으시면 알려주세요 ㅎㅎ
기능이 전공 특화 되어 그런가 아무도 다운을 받지않네요 ㅋㅋ
대중성있는 앱을 더 연구 해 보아야겟어요
디자인 칭찬 해주셔서 감사합니다~ 디자이너에게 힘이됩니다 ㅎㅎ

[앙증마]

현업 개발자 입니다.
개발환경에 따라 다르긴 합니다만, 색 값은 보통 (r, g, b, a) 이렇게 사용합니다.
0~1까지의 소수를 사용하기도 하고, 0~255 까지의 값을 사용하기도 하고, 위 툴처럼 16진수를 사용하기도 합니다.
현제 제가 자주 사용하는 Unity의 경우 0~1까지의 값을 사용합니다.
그런데 UI용 으로 쓰는 플러그인 NGUI의 경우 Label에 사용하는 Text의 색 값을 16진수를 사용하죠.

타입을 나누어서 위 3가지 타입으로 변환하는 기능도 추가하면 좋을것 같네요.

[열받은디자이너]

현업에서 일하시는 분이시군요!
답변 정말 감사드립니다. 처음 접하는 내용이라 제가 바로 이해하고 있는지 알고싶습니다.
ALPHAYO(1타입) : 포토샵or일러스트 (0~100)값 투명도25% → #40(변환된값) FFFFFF
Unity용(2타입) : 포토샵or일러스트 (0~100)값 투명도25% → (r, g, b, 0.25)로 변환
?(3타입) : (r, g, b, 포토샵or일러스트 (25%)값 ) → (r, g, b, 0.25)로 변환
으로 제가 이해 한것이 맞는지 모르겠습니다.
툴마다 색상값을 다르게 사용하는 것을 이번에 처음 알게되었네요 ㅎㅎ
좋은 의견주셔서 감사합니다!

[앙증마]

(1f, 1f, 1f, 0.25f) = 포토샵(100, 100, 100, 25%) = (ff, ff, ff, ff)
이런 식이라는 거죠.

[열받은디자이너]

아 넵 감사합니다 ㅎㅎ 한번 적용 해보도록 하겠습니다!
친절하게 답글 달아주셔서 감사합니다.
개발 힘내시길 바랍니다!