Hana의 리퀴드 글래스와 3D

Hana 열기

오늘 실시간 리퀴드 글래스, 3D 트랜스폼, 오토 레이아웃, 동영상 레이어 같은 획기적인 기능을 선보이는 Hana의 대규모 업데이트를 발표합니다.

Hana의 리퀴드 글래스

iOS 26이 공개되면서 리퀴드 글래스 효과가 디자인 커뮤니티의 관심을 사로잡았습니다. 이제 Hana의 모든 오브젝트 레이어에 이 효과를 적용할 수 있습니다.

Distortion 같은 글래스 매개변수를 편집해 굴절 정도를 조절할 수 있습니다.

하지만 iOS 스타일을 넘어 나만의 글래스 효과를 만들 수도 있습니다. 매개변수를 충분히 범용적으로 설계해, 효과의 일부 동작을 과장하고 더 인상적인 비주얼을 연출하는 등 다양한 창의적 결과를 얻을 수 있도록 했습니다.

겹쳐 쌓는 글래스

대부분의 디자인 툴에서 블러나 글래스 효과는 보통 레이어 하나에만 적용됩니다. 그래서 여러 레이어를 겹쳐도 유리의 왜곡이 누적되지 않고 평평하게 남습니다.

Hana에서는 여러 겹의 유리를 쉽게 쌓고, 실제처럼 각 유리가 뒤나 아래에 있는 요소를 어떻게 굴절시키는지 볼 수 있어 완전히 새로운 창의적 가능성이 열립니다. 글래스 효과뿐 아니라 배경 블러 효과에서도 가능합니다.

3D 트랜스폼

2D에서 3D로 넘어가는 일은 늘 어려운 과제였습니다. 이 기능을 개발하기 시작할 때, 그 사이에서 아무것도 잃지 않고 2D와 3D를 매끄럽게 오갈 수 있게 하고 싶었습니다.

이제 Hana에서는 어떤 오브젝트든 3D 오브젝트가 될 수 있으며, 3D 공간에서의 위치(Depth), 회전, 원근을 제어하는 매개변수를 갖습니다.

이 매개변수들은 모두 애니메이션을 적용할 수 있고 상태/이벤트 시스템과 호환됩니다.

프레임과 3D 포털

프레임이 3D가 되면, 프레임은 자기만의 3D 공간을 들여다보는 창이 되기도 합니다. 그 안에서 깊이를 볼 수 있는 시각 요소인 포털을 만들 때 특히 유용합니다.

방법은 간단합니다. 프레임 안에 요소를 넣고, 프레임을 3D로 만들고, 안에 있는 요소의 3D 위치나 회전을 바꾸세요. 이제 프레임의 회전이나 위치를 바꾸면 안쪽의 요소들이 여러 단계의 깊이로 렌더링되는 모습을 볼 수 있습니다.

오토 레이아웃

이제 Hana는 모든 매개변수에 애니메이션을 적용할 수 있는 레이아웃을 지원합니다. 패딩과 간격을 원하는 대로 설정해 세로 레이아웃과 가로 레이아웃을 모두 만들 수 있습니다.

레이아웃은 이벤트 및 상태와 함께 작동하며 실시간으로 업데이트되어 인터랙션을 강화합니다.

Pinterest의 열 레이아웃과 비슷한 메이슨리 레이아웃도 지원합니다.

동영상 레이어

이제 Spline Hana의 어떤 레이어에든 동영상을 쉽게 넣을 수 있습니다. 인터랙티브 프레젠테이션을 만들거나 모션을 디자인할 때 유용합니다. Fill 패널에서 Video Layer로 전환하고 동영상을 업로드하거나 끌어다 놓기만 하면 됩니다.

Spline의 3D 에디터처럼 Hana의 동영상도 원하는 이벤트로 트리거할 수 있습니다. 기본적으로 동영상은 Start 이벤트에서 재생되지만, 이를 바꿔 마우스 이벤트나 다른 이벤트로 트리거할 수 있습니다.

새로운 창의적 가능성

정말 많은 소식이었죠! 오늘 선보인 모든 새 기능을 즐기며 흥미진진한 새 디자인을 만들어 보시길 바랍니다.

— Spline 팀

Hana 열기