블로그 이미지
엡뽀
피난(?) 오신걸 환영합니다.

calendar

 «  » 2024.5
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31

Notice

'패턴디자인'에 해당되는 글 3건

  1. 2012.11.28 Android Design [2] -Typography-
  2. 2012.11.28 Android Design [1] -Metrics and Grids-
  3. 2012.11.28 Android Design [0]
2012. 11. 28. 16:34 Programing/Android

Android Design [2] -Typography-

Design::Style > Typography (원본 : Android Developers)


Typography



안드로이드 디자인 언어는 기본 그리드와 규모, 공간, 리듬 그리고 정렬과 같은 전통적인 typography에 의존 하고있습니다. 사용자의 화면에 나타난 정보를 신속하게 이해하기 위해선 이러한 도구들의 성공적인 전개는 필수적입니다. typography의 이러한 사용을 지원하기 위해 IceSandwich는 UI 고해상도 요구를 위해 특별히 만들어진 Roboto type family를 도입하였습니다. 현재 TextView의 프레임 워크는 regular, bold, italic 과 bold italic weights를 기본적으로 지원합니다.




Default type colors

안드로이드 UI 아래와 같은 기본색들을 사용합니다.
textColorPrimary, textColorSecondary

밝은 테마의 UI는 아래와 같은 색을 사용 합니다.
textColorPrimaryInverse, textColorSecondaryInverse.

프레임워크 텍스트 컬러 스타일 또한 터치 피드벡에 대한 상태  변경을 지원합니다. 


Typographic Scale


텍스트 사이즈 비교는 이해하기 쉬운 레이아웃을 만드는 것보다 훨씬 생상적입니다. 그러나, 한 UI에 다른 사이즈가 많이 들어간다면 지저분해질 수 있습니다. 안드로이드 프레임워크는 아래와 같은 몇가지 크기들만 사용합니다.


사용자는 환경설정 앱에서 시스템 전체 텍스트 크기를 선택 할 수 있습니다. 이러한 기능을 지원하기 위해 가능한한 텍스트 크기는 scale-independent pixels(SP)단위를 사용해야 합니다. 레이아웃은 이러한 설정에 대해 크기 변경이 가능한 텍스트를 지원해야합니다.












'Programing > Android' 카테고리의 다른 글

Android UI를 만들어 보자 [1] - 기본 View 만들기-  (0) 2012.11.29
Android UI를 만들어 보자 [0]  (3) 2012.11.29
Android Design [3] -Gestures-  (0) 2012.11.28
Android Design [1] -Metrics and Grids-  (0) 2012.11.28
Android Design [0]  (0) 2012.11.28
posted by 엡뽀
2012. 11. 28. 13:45 Programing/Android

Android Design [1] -Metrics and Grids-


Design::Style > Metrics and Grid (원본 : Android Developers)


Metrics and Grids


단말기들은 다양한 실제 기기 사이즈뿐만이 아니라 다양한 화면 밀도(DIP)를 가지고있습니다.
여러 화면을 위한 디자인을 간단히 하는 방법은 각각의 장치에 대해 물리사이즈와 논리사이즈를 별도로 생각하는 것입니다. 물리 사이즈는 handset(600dp 이하)와 table(600dp 이상)입니다. 논리사이즈는 LDPI, MDPI, HDPI와 XHDPI 입니다. 당신의 앱의 UI 최적화는 서로 다른 물리사이즈를 대체하는 레이아웃 설계와 각각의 논리 사이즈에 대응하는 bitmap 이미지를 제공하는 것입니다.

(추가 의견: 앱 레이아웃은 dip/dp 단위를 사용 하여 설계 또는 wrap_content, fill_parent로 어떤 물리사이즈이든 동일 하게 적용될 수 있도록 디자인하고, 앱에서 사용하는 이미지들은 각각의 LDIP/MDIP/HDIP/XHDIP 에 맞는 크기의 이미지를 넣어두라는 것입니다. :: LDIP : 36 * 36 / MDIP : 48 * 48/ HDIP : 72 * 72) 



Space considerations

단말기들은 매우 다양한 논리적 단위(dip)로 출력될 수 있습니다.
쫌 더 많은 정보를 볼려면 클릭하여 주세요. Screen Sizes and Densities Device Dashboard. (해당 부분은 번역을 올리지 않겠습니다.)


48dp Rhythm


일반적으로 UI 구성요소들은 48dip 단위에 따라 배치 되어있습니다.


Why 48dp?

평균적으로, 48dp는 약 9mm(변경 될 수 있음)로 환산 될 수 있습니다. 이 9mm는 터치 스크린 객체의 권장 되는 객체 사이즈이며, 사용자가 안정적으로 정확하게 손가락으로 타겟팅 할수 있는 편리한 사이즈입니다.

만약 요소를 48dp 높이와 폭으로 디자인 한경우 아래와 같이 보장할수 있습니다.

  • 당신의 요소가 어떤 장치에 보여기게 되더라고 최소 권장 크기인 7mm보다 작아선 안됩니다.
  • 당신은 전체적인 정보 요약과 UI 요소의 타겟팅을 적절히 공략하여야 합니다.


Mind the gaps


UI 요소들의 간격은 8dp 입니다.

Examples






'Programing > Android' 카테고리의 다른 글

Android UI를 만들어 보자 [1] - 기본 View 만들기-  (0) 2012.11.29
Android UI를 만들어 보자 [0]  (3) 2012.11.29
Android Design [3] -Gestures-  (0) 2012.11.28
Android Design [2] -Typography-  (0) 2012.11.28
Android Design [0]  (0) 2012.11.28
posted by 엡뽀
2012. 11. 28. 10:30 Programing/Android

Android Design [0]

안녕하세요. 블로거 엡뽀라고 합니다.


Android 블로그의 첫번째 포스트!  게다가 Android 카테고리를 먼저 다 포스트 하고 차례 차례 iPhone, Web 도 포스트 할 예정이라, 프로그래밍 카테고리에서의 첫 포스트인데요. 첫 단추를 잘 끼워야 하는 것처럼 맨 첨 포스팅을 어떤 주제로 할까에 대한 고민을 많이 했습니다.


그러다 블로깅 포스트 하는 프로그래밍의 기준을 정하고, 그 기준의 시발점 부터 포스팅을 하면되겠구나 싶었습니다. 그 기준이란 Android에서 제공하는 기본 widget (Android 바탕화면에서 보이는 그 위젯이 아닙니다.) TextView, EditText, ListView 등등 기본 View를 사용가능한 정도를 말합니다.


그리하여 기본 View들을 사용하는 방법을 알았으니, 어떻게 하면 잘 꾸밀수 있을까 하는 점이 첫 시작점인것 같아 Android Developers  래퍼런트 싸이트에서 소개 하고있는 디자인 방법에 대한 번역을 올릴까 합니다.


래퍼런트 싸이트에선 많은 내용을 다루고 있지만 제가 번역할 정도면 다른 분들도 충분히 할 수있을 거라는 가정과 래퍼런트 싸이트에서 직적 보시는게 아무래도 더 좋을 것같아 제가 생각 했을때 중요한 것같은 몇 가지만 번역을 올릴까 합니다. 


Design::Style > Metrics and Grid

Design::Style > Typography

Design::Patterns > Gestures


이에 대한 상세 포스팅은 다음 포스팅으로 하도록 하겠습니다. (글 수를 늘려볼려는 얄팍한 수작)

P.S) 구글 번역기의 도움을 받아 발 번역한거라 무한 테클 환영합니다.


'Programing > Android' 카테고리의 다른 글

Android UI를 만들어 보자 [1] - 기본 View 만들기-  (0) 2012.11.29
Android UI를 만들어 보자 [0]  (3) 2012.11.29
Android Design [3] -Gestures-  (0) 2012.11.28
Android Design [2] -Typography-  (0) 2012.11.28
Android Design [1] -Metrics and Grids-  (0) 2012.11.28
posted by 엡뽀
prev 1 next

티스토리툴바