Android app (디자인참고)

2021. 2. 19. 17:55Android

     

     

    8 point grid system

    화면의 마진이나 간격, 버튼크기 등을 9배수 단위로 구성하는 방법 (16,24,40,48등)

     

     

    디바이스가 그래픽을 랜더링하는데 홀수일경우 오프셋 되는 등 어려움이 있기때문에 짝수로 처리해야한다.

    8의 경우 1.5배 등과 같이 0.5배일때도 짝수의 값이 유지된다.

    일반적으로 많은 화면의 해상도가 8의 배수이다. (320, 480, 640, 1280, 1920 등)=대응이 편리해진다.

    폰트 시스템이나 더 정교한 디자인의 경우 4point system을 적용하기도 한다. (너무 조밀하며 일관성 맞추기가 조금 힘들다)

     

     

     


     

     

     

    버튼 크기

     

     

     

     

     

    42px 미만 / 72px 이상의 버튼에서 터치 정확도가 낮다.

    72px버튼의 터치 정확도,사용자의 선호도가 가장 높고

    버튼의 우선순위 따라 크기를 배열하는것이 좋다.

    (빠른 반응시간과 더 높은 정확도)

     

     

    높은 우선 순위 버튼 = 72px  |  중간 우선 순위 버튼 = 60px  |  낮은 우선순위 버튼 = 42px

     

     

     

     


     

     

     

    버튼간격

     

     

    너무 가까우면 터치 정확도가 낮아진다.

     

     

     12에서 48 픽셀의 범위가 최적의 단추 간격이라고 결론

     

    큰 버튼  12-24px  |  중간 단추  24-36px  |  작은 버튼 36-48px

     

     

     

     


     

     

     

    텍스트단추

     

     

    최소한 12픽셀의 간격은 시각적 분리에 좋다.

     

     

     

     


     

     

     

     

    layout grid system

     

    화면 전체의 균형을 맞추기 위한 목적

    다양한 모니터 해상도에 대응해야하는 웹디자인에 많이 활용

     

     

    12컬럼/16컬럼을 갖는 960-grid기준 화면구성이 일반적인 기준이었으나

    화면 해상도가 점점 증가하면서 기준으로 적용하는 크기 및 컬럼이 변화하고있음

     

    960 Grid / 12columns

     

    구글 material breakpoints

     

    레이아웃 그리드를 정하기 위해서는

    여백을 고려한 전체가로 해상도 / 컬럼의 개수 / 컬럼과 컬럼 사이의 공간 (gutter)의 크기가 필요하다.

     

     

     

    모바일의 경우 pc보다 해상도가 작기 때문에 그리드가 크게 중요하지않지만

    협업등의 목적으로 내부기준을 정하는것도 좋다.

     

    (참고)

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    'Android' 카테고리의 다른 글

    PX/DP/DPI  (0) 2021.02.26
    맨 위로