3D Tilt (3D 틸트)

카드 위에서 포인터가 움직이면 그에 맞춰 카드가 살짝 이동하고 커집니다.

[적용할 곳]에 워블 카드(Wobble Card) 효과를 넣어 줘.
포인터가 카드 위에서 움직이면 카드는 포인터 쪽으로 살짝 움직이고, 안의 콘텐츠는 반대쪽으로 살짝 움직이며 조금 커지면서 부드럽게 따라가게 해 줘. 포인터가 벗어나면 모두 제자리로 돌아와야 해.
움직임은 작게 하고, 터치 기기와 사용자가 모션 줄이기(prefers-reduced-motion)를 켜 두었으면 꺼 줘.

밝은 하이라이트가 반사광처럼 포인터를 따라 카드 표면 위를 움직입니다.

[적용할 곳]에 글레어 / 홀로그래픽 카드(Glare / Holographic Card) 효과를 넣어 줘. 글레어 카드(glare card), 글레어 호버(glare hover)라고도 불러.
은은하고 밝은 하이라이트가 반사되는 빛처럼 포인터를 따라 카드 표면을 움직이고, 카드는 포인터 쪽으로 살짝 기울게 해 줘. 포인터가 벗어나면 둘 다 사라지게. 부드럽고 은은하게.
클릭은 빛 레이어를 통과하게 하고, 그 아래 내용은 잘 읽히게 두고, 터치 기기에서는 빛 없이 카드를 보여 줘.

포인터를 올리면 카드가 원근감 있게 뒤로 기울고, 핀과 빛이 보는 사람 쪽으로 솟아오릅니다.

[적용할 곳]에 3D 핀(3D Pin) 호버 효과를 넣어 줘. 핀 호버 3D(pin hover 3D)라고도 불러.
포인터가 카드 위에 오면 카드가 원근감 있게 뒤로 기울고, 밑동에 은은한 빛이 있는 핀이 가운데에서 솟아오르게 해 줘. 포인터가 벗어나면 모두 제자리로. 부드럽게, 튕기지 않게.
레이아웃에서 카드가 차지하는 자리는 그대로 두고, 키보드 포커스에도 같은 효과를 보여 줘.

텍스트가 마우스 위치를 따라 3D 원근감 있게 기울어집니다.

[적용할 곳]에 텍스트 틸트(Text Tilt) 효과를 넣어 줘. 원근 텍스트 틸트(perspective text tilt)라고도 불러.
텍스트가 포인터 움직임을 부드럽게 따라가며 3D로 포인터 쪽으로 살짝 기울고, 포인터가 떠나면 부드럽게 평평하게 돌아오게 해 줘.
기울기는 은은하게 해서 글이 잘 읽히게 하고, 터치 기기와 사용자가 모션 줄이기(prefers-reduced-motion)를 켜 두었으면 평평하게 둬 줘.

카드가 축을 중심으로 반 바퀴 돌아 뒷면을 보여 줍니다.

[적용할 곳]에 카드 플립(Card Flip) 효과를 넣어 줘. 플립 카드(flip card), 카드 플립 3D(card flip 3D)라고도 불러.
포인터가 카드 위에 오면 카드가 세로축을 중심으로 원근감 있게 뒤집혀 뒷면을 보여 주고, 벗어나면 다시 돌아오게 해 줘. 부드럽고 일정하게.
각 면의 뒤쪽은 숨겨서 앞뒷면이 서로 비쳐 보이지 않게 하고, 키보드 포커스와 터치 기기의 탭으로도 뒤집히게 해 줘.

카드가 조금씩 어긋나게 쌓여 있고, 맨 위 카드가 비켜나며 다음 카드를 드러냅니다.

[적용할 곳]에 카드 스택(Card Stack)을 넣어 줘. 스택드 카드(stacked cards)라고도 불러.
카드를 조금씩 어긋나게 뒤로 겹쳐 두고, 누를 때마다 맨 위 카드가 옆으로 휙 빠져 맨 뒤로 들어가면서 나머지가 한 칸씩 앞으로 나오게 해 줘. 부드럽고 가볍고 빠르게.
키보드로 조작할 수 있게 하고, 스크린 리더가 모든 카드에 순서대로 닿게 하고, 사용자가 모션 줄이기(prefers-reduced-motion)를 켜 두었으면 단순한 페이드로 바꿔 줘.

가운데 항목은 정면을 보고, 양옆 항목은 원근감 있게 비스듬히 돌아가 있습니다.

[적용할 곳]에 커버플로(Coverflow) 캐러셀을 넣어 줘. 커버 플로 캐러셀(cover flow carousel)이라고도 불러.
가운데 항목은 정면을 보고 양옆 항목은 원근감 있게 비스듬히 돌아가 있게 해 줘. 옆으로 드래그하면 줄이 밀리고, 손을 떼면 가장 가까운 항목에 부드럽게 멈추게.
드래그 말고도 방향키와 스와이프를 지원하고, 터치 기기에서 페이지 세로 스크롤이 계속 되게 해 줘.