2014년 롤리팝이 나오면서 같이 나온 머티리얼 디자인에대해서
머티리얼 디자인은 구글용 웹사이트나 앱에 적용할 통일화된 디자인으로 레이아웃, 스타일, 애니메이션, 등 웹 디자인에 필요한 모든 요소에 대해 정의를 하고 이에 따를 것을 요구하고 있습니다.
우선영어로 써있는것을 번역하였는데 맞는 건지는 모르겠습니다,
머티리얼은 3D world이다.
머티리얼 환경은 모든 개체가 x, y 및 z 치수가 3 차원 공간을 의미한다.Z 축은 수직 양의 Z 축 뷰어를 향해 연장하여, 디스플레이의 평면에 정렬된다. 모든 재료의 시트는 Z 축을 따라 하나의 위치를 점유하고 표준 1DP 두께를 갖는다.
빛과 그림자.
머티리얼환경에서 가상 라이트는 네모난 종이를 비춥니 다. 주위의 빛이 모든 각도에서 부드러운 그림자를 만들면서 키 라이트는 방향성의 그림자를 만듭니다.
머티리얼환경에서의 그림자는이 두 광원에 의해 주조됩니다. 응용 프로그램 개발에서 그림자는 광원이 z 축을 따라 다양한 위치에 자재의 시트에 의해 차단되었을 때 발생합니다. 웹상에서 그림자는 y 축을 조작하여 표시하고 있습니다. 다음 예제에서는 6dp 높이의 카드를 보여줍니다.
※물리적 특성.
1. 머티리얼은 X 및 Y 치수 (DP 측정) 및 균일한 두께 (1DP)을 변화하고있다.
2. 머티리얼은 그림자를 캐스팅 합니다.
그림자는 머티리얼 요소 사이의 상대적인 높이 (Z-위치)에서 자연적으로 발생.
그림자는 머티리얼 요소 사이의 상대적인 높이를 묘사.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
3. 머티리얼 콘텐츠는 어떤 모양이든 색상이든 표시된다.
하지만 두꼐는 표현하지 않는다.
http://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0B6Okdz75tqQsUGtDSTgtekFORGs/whatismaterial-materialprop-physicalprop-InkDisplay_xhdpi_006.mp4
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
4. 머티리얼의 컨텐츠는 머티리얼안에서는 독립적인 동작을 할수있지만
머티리얼 범위 내로 국한된다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
5. 머티리얼은 입체(고체?)이다.
do
입력이벤트는 오직 foreground 머티리얼에만 영향을 미칩니다.
6. 여러개의 머티리얼 요소는 공간에서 동시에 동일한 점을 점유 할 수 없습니다.
대신에 머티리얼 요소를 분리하기 위한 하나의 방법은 고도를 사용하여 동시에 동일한점의 점유를 방지합니다.
7. 머티리얼은 다른 물질을 통과 할 수 없습니다.
고도를 변경하는 경우, 예를 들어, 하나의 마티리얼의 시트는 또 다른 머티리얼의 시트를 통과 할 수 없습니다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
※머티리얼 변형.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
2. 머티리얼은 평면을 따라서 증대되거나 축소됩니다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
※머티리얼의 이동(운동)
1. 머티리얼은 자발적을 생성 또는 그밖에 환경으로 소멸 될 수 잇다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
2. 머티리얼은 축 방향으로 이동할 수 있습니다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
3. Z 축 방향 운동은 전형적으로 머티리얼과 사용자의 상호 작용의 결과이다.
위에 URL은 안될수도 있습니다.
밑에 URL에서 해당그림의 동영상 참고
(무조건 봐야지 위에 써놓은 글이 이해갑니다.)
원래는 동영상이 있어야지 저 글귀들이 이해가 아주 잘가는데 설마 있겠나싶지만 저작권이 혹시 있을지도 몰라서...
아무튼 직접 해당 페이지에 들어가셔서 보시면 잘이해되실겁니다.
이글의 원본은
http://www.google.com/design/spec/what-is-material/material-properties.html#material-properties-movement-of-material
이곳에 있습니다.
'Android' 카테고리의 다른 글
머티리얼 디자인(Material Design) 관련 정리 3 (0) | 2015.06.26 |
---|---|
머티리얼 디자인(Material Design) 관련 정리 2 (0) | 2015.06.24 |
GitHub에서 소스 다운받는 방법 (0) | 2015.06.23 |
CameraCrop 예제 (0) | 2015.06.18 |
PinterestLayout 예제 (0) | 2015.06.18 |