Webflow 웹사이트에 곡선 배경을 포함하세요

운형자 동적 3D 설정을 만드는 소프트웨어입니다. 스플라인 연결을 사용하면 스플라인 배경과 그 발생을 Webflow에 직접 포함할 수 있습니다. 또한 Webflow의 기본 상호 작용을 통해 Webflow의 스플라인 엔터티에 생명을 불어넣을 수도 있습니다.

이 가이드 전체에서 다음 내용을 이해하게 됩니다.

1. 스플라인 배경을 형성하는 과정
2. Webflow 웹사이트에 스플라인 배경을 부착하는 방법
3. Webflow에서 스플라인 배경 애니메이션 적용

스플라인 배경 구성 및 내보내기

처음에는 반드시 설립하다 스플라인의 배경. 시작하려면 다음을 방문하세요. 운형자, 계정을 만들고 디자인을 시작하세요! 인용하다 스플라인 매뉴얼 또는 디자인에 대한 추가 통찰력을 제공하는 교육용 비디오.

배경화면이 준비되면 내보낼 수 있습니다.

1. 누르다 내보내다 스플라인 편집기 도구 모음에서
2. 입장 코드 내보내기
3. 헤더에 있는 링크를 복사하세요. 개요 탭(링크는 ".splinecode" 확장자로 끝남)

Webflow 웹사이트에 스플라인 배경 추가하기

스플라인 배경을 만들고 내보낼 때 배경을 Webflow 웹사이트에 삽입할 수 있습니다. Webflow에는 내장형이 제공됩니다. 스플라인 배경 다른 요소처럼 사용자 정의할 수 있는 구성요소(예: 위치 지정, 크기 조정 등)

Webflow 사이트에 스플라인 배경화면을 삽입하려면:

1. 로 이동 패널 추가 > 미디어 
2. 드래그 스플라인 배경 디자인 영역에 구성 요소
3. 로 진행 요소 설정 패널 > 스플라인 배경화면 설정
4. 스플라인 배경화면 링크(예: ".splinecode" 확장자로 끝나는 링크)를 URL 필드

Webflow에서 스플라인 배경 애니메이션 적용

이제 배경화면이 Webflow 웹사이트에 원활하게 통합되었으므로 Webflow 고유의 상호 작용을 사용하여 배경화면에 애니메이션을 적용할 수 있는 유연성을 갖게 되었습니다.

스플라인 배경에서 개체에 애니메이션을 적용하려면:

1. 다음을 선택하세요. 스플라인 배경 디자인 영역에
2. 액세스 상호 작용 패널
3. 선택 요소 트리거 또는 페이지 트리거
4. 지침에 따라 6단계까지 사용자 정의 애니메이션을 구성하십시오.
5. 작업 드롭다운에서 스플라인 애니메이션을 선택합니다.
6. 다음에서 엔터티를 선택하세요. 운형자 > 물체 쓰러지 다 

그런 다음 원하는 대로 스플라인 배경을 미세 조정할 수 있습니다. 애니메이션 타임라인에서 개체의 위치, 회전 및 배율(모든 X, Y, Z축)을 조작합니다. 애니메이션의 영향을 받는 요소나 트리거를 결정하기 위해 작업 타겟을 맞춤화할 수도 있습니다.