Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
신부설
2015.03.16
안드로이드 머터리얼 디자인 기반의
앱 레이아웃 가이드 (1)
구글 디자인 스펙을 참고 하였습니다.
http://www.google.
com/design/spec/layout/principles.html
의역이 많습니다.
원칙
기본 개념
위젯 레이아웃 가이드
원칙
어떤 플랫폼, 어떤 크기의 화면에서도
경험의 연속성이 유지되어야 합니다.
외관과 느낌(룩앤필)이 유지되어야 합니다.
이러한 노력은 사용자에게 편안함을 제공합니다.
원칙
기본 개념
위젯 레이아웃 가이드
높이 우선 순위
모든 요소는 상대적인 높이의 우선순위를 가집니다.
요소들은 상태에 따라 마이너, 메이저 스탭을 가집니다.
특수한 높이 우선 순위
일부 시스템 요소는 모든 앱 컨테이너 상하에 독립된 공간에
위치합니다. (ex 상태바, 다이알로그, 네비게이션바)
Seams
Seam(나누는 선)은 두 종이시트가 외곽선의 길이를 함께 공
유할 때 생성됩니다. 두 시트는 함께 움직입니다.
Step(그림자가 드리우는)은 두 종이시트가 중첩될 때 생성됩
니다. 두 시트는 각자 움직입니다.
Steps
베이스 그리드 라인(base grid lines)이란
요소들이 정렬되기 위해 기준이 되는 그리드 선입니다.
모든 요소는 8dp를 기준으로 정렬됩니다.
글자는 4dp를 기준으로 정렬됩니다.
툴바 안에 있는 아이콘은 4dp...
키 라인
키 라인(key lines)이란
모바일, 태블릿, 데스크탑에서 가장자리로부터 얼마의 간격이 있어야 하
는지, 요소 간의 간격은 얼마여야 하는지 등을 제시하는 선입니다.
기본형 : 정해진 크기를 요소들의 크기에 ...
기본형 키라인
비율형 키라인
증가형 키라인
원칙
기본 개념
위젯 레이아웃 가이드
원칙
기본 개념
위젯 레이아웃 가이드
(Touch target size)
터치 타겟의 사이즈
최소한의 터치 타겟 사이즈는 48dp입니다.
(2)편에서 계속
신부설 c9coco@gmail.com
안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)
안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)
Upcoming SlideShare
Loading in …5
×

안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)

5,297 views

Published on

안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)

Published in: Technology
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)

  1. 1. 신부설 2015.03.16 안드로이드 머터리얼 디자인 기반의 앱 레이아웃 가이드 (1)
  2. 2. 구글 디자인 스펙을 참고 하였습니다. http://www.google. com/design/spec/layout/principles.html 의역이 많습니다.
  3. 3. 원칙 기본 개념 위젯 레이아웃 가이드
  4. 4. 원칙 어떤 플랫폼, 어떤 크기의 화면에서도 경험의 연속성이 유지되어야 합니다. 외관과 느낌(룩앤필)이 유지되어야 합니다. 이러한 노력은 사용자에게 편안함을 제공합니다.
  5. 5. 원칙 기본 개념 위젯 레이아웃 가이드
  6. 6. 높이 우선 순위 모든 요소는 상대적인 높이의 우선순위를 가집니다. 요소들은 상태에 따라 마이너, 메이저 스탭을 가집니다.
  7. 7. 특수한 높이 우선 순위 일부 시스템 요소는 모든 앱 컨테이너 상하에 독립된 공간에 위치합니다. (ex 상태바, 다이알로그, 네비게이션바)
  8. 8. Seams Seam(나누는 선)은 두 종이시트가 외곽선의 길이를 함께 공 유할 때 생성됩니다. 두 시트는 함께 움직입니다.
  9. 9. Step(그림자가 드리우는)은 두 종이시트가 중첩될 때 생성됩 니다. 두 시트는 각자 움직입니다. Steps
  10. 10. 베이스 그리드 라인(base grid lines)이란 요소들이 정렬되기 위해 기준이 되는 그리드 선입니다. 모든 요소는 8dp를 기준으로 정렬됩니다. 글자는 4dp를 기준으로 정렬됩니다. 툴바 안에 있는 아이콘은 4dp를 기준으로 정렬됩니다. 베이스 그리드 라인
  11. 11. 키 라인 키 라인(key lines)이란 모바일, 태블릿, 데스크탑에서 가장자리로부터 얼마의 간격이 있어야 하 는지, 요소 간의 간격은 얼마여야 하는지 등을 제시하는 선입니다. 기본형 : 정해진 크기를 요소들의 크기에 적용 비율형 : 화면의 크기를 비율로 계산하여 요소들의 크기에 적용 증가형 : 기준 크기를 곱하기 하여 요소들의 크기에 적용
  12. 12. 기본형 키라인
  13. 13. 비율형 키라인
  14. 14. 증가형 키라인
  15. 15. 원칙 기본 개념 위젯 레이아웃 가이드
  16. 16. 원칙 기본 개념 위젯 레이아웃 가이드 (Touch target size)
  17. 17. 터치 타겟의 사이즈 최소한의 터치 타겟 사이즈는 48dp입니다.
  18. 18. (2)편에서 계속 신부설 c9coco@gmail.com

×