[Design] 앱 개발 디자인 (UI)에 사용할 도구 및 안드로이드 개발 시 단위에 대한 기초 상식

 1. 체펠린 + 스케치 체펠린은 팀끼리 일할 때 사양이나 디자인이나 디자인 가이드를 볼 때 사용하는 도구. 스케치는 포토샵과 같은 것이라고 생각하면 되고 솔직히 포토샵은 디테일한 표현(예술적인)을 할 수 있는 대신 복잡하고 스케치는 UI 최적화되어 있고 UI Designer에게는 더 적합하다.

2. 크래커나인 XML로 변환 가능(안드로이드) 참고: http://cracker9.io

3. 어도비XD는 스케치표방해서 만든것


+

단위:

1. DP와 DPI는 전혀 다른 개념이다.2 . DP == DIP 3 . 즉 , DIP ( Density - independent Pixels ) 와 DPI ( Dots Per Inch ) 는 다른 거다 . 자세히 보면 I 위치가 달라.

DPI와 비슷한 예를 들면 강수량이나 인구밀도이다. 1inch 당 dot (디지털화된 이미지 점. pix-el 하나) 가 몇 개 들어가는가를 의미한다. 예를 들어 5dpi보다 10dpi가 더 선명하게 보인다. 선명도의 차이일 뿐 길이의 단위와는 좀 거리가 있다. 안드로이드 프로젝트를 보면 xdpi, hdpi 등으로 나누어서 이미지를 저장할 수 있다. 하지만 dpi에서 View의 높이 폭을 지정할 수 있다니 말도 안 돼. m당 10명의 인구밀도가 부여된다고 해서 땅의 폭이 10m가 되거나 5m가 되는 것은 아니다. 아무 의미도 없다.)

DP는 iOS와는 달리 파편화가 심한 안드로이드 기기에 의해서 생긴 단위이다. 스크린의 가로 세로 폭도 다를 뿐 아니라 비율도 다르고 심지어 픽셀들의 크기도 다르다. 상기의 DPI는 다르지만 inch와 흡사하다고 생각하면 된다. cm, m, inch 등은 고정된 단위이다.dp도 고정된 단위이다. 서로 다른 스크린 화면에서 같은 크기를 나타내기 때문에 생긴 단위다.(인구밀도에서 가로 10m, 세로 10m가 주어지는 개념과 비슷하다. 인구밀도가 주어지면 10m제곱이라는 영역에서 대략적인 인구를 산출할 수 있도록 가로 2dp, 세로 2dp로 dpi가 주어지면 픽셀 수를 산출할 수 있다.)

px = dp * 단말 DPI 기본160dp = px * 기본 160 단말기 DPI

dp가 2이고 dpi가 160(기본)이면 (두 번째 공식)2 = x * 160160 즉, 2px= 2dp가 된다.

dpi가 160이라면, 1px = 1dp임을 알 수 있다.

근데 dpi가 320이면? px 수가 많아지나? 인치당 밀도가 높다는 것을 의미하기 때문에 당연히 px의 수가 높을 것이다.계산식을 딱 봐도 dpi의 값에 px는 비례한다.한번계산을해보면첫번째계산식,두번째계산식과동일한것. x = 2 * 320160 ; x = 4 ;

즉, 2dp에 4px가 있음을 알 수 있다.

결론: DPI와 DP는 다르다. DIP랑 DP랑 똑같아, 헷갈리지 말자

px의 픽셀과 dpi의 dot도 깊이는 모르겠지만 조금 다르다. 각 화상은 픽셀과 같은 것에 관계없이 dpi를 지정할 수 있다. 예를 들어 12913dpi라고 하면 가로가 1080개의 픽셀이 있는 모니터에서 어떻게 표현될까? 우선 첫 번째 문제는 스크린에서 표현 가능한 pixel의 수보다 dot이 많다는 것이다. 두 번째 문제는 홀수라는 것이다. 모니터의 pixel 수나 크기에 관계없이(자세히 말하면 있을지도 모른다) 이미지 자체에 존재하는 것이다. 이에 맞춰 확대 및 축소도 가능하며 이미지 프로세싱 시 이미지의 pixel 단위로 처리할 수 있게 된다.

참고: https://blog.cracker9.io/2018/03/13/Android_DPI

이 블로그의 인기 게시물

비트코인 방식 :: 거래소 추천, 계좌 개설, 매도, 매수 방법 총정리

및 혜택을 알아보자 노란우산 공제 가입방법

강화도맛집 바베큐 세트포장 : 미스고기 강화점