이 아이디어는 흔히 그렇듯 시작되었습니다. 전혀 다른 프로젝트 '라는 예술가의 작품을 우연히 발견한 후 길을 벗어났을 때 카탈리나 빌레가스 소셜 미디어에서. 그녀는 스티커로 판매하는 일러스트레이션에 생기를 불어넣는 Instagram AR 필터를 만듭니다. AR은 새로운 것이 아닙니다. 저는 2012년에 저의 새로운 Sony 스마트폰에 그런 종류의 효과를 보여주는 앱을 가지고 있었습니다. 하지만 AR 효과를 쉽게 만들고 이를 Instagram과 같은 유비쿼터스 플랫폼에 게시할 수 있는 도구가 있다는 사실을 알게 되자 정말 마음에 들었습니다.
그런 다음 나는 개인적, 직업적 활동을 고려하여 그러한 기술을 어떤 용도로 사용할 수 있는지 생각하기 시작했습니다. 만들 수 있었으면 좋겠어요 아름다운 디지털 일러스트레이션 대화식으로 만들어 새로운 차원을 제공하지만 현재로서는 이것이 내 기술 범위와 너무 거리가 멀습니다. 그래서 나는 나에게 의미가 있는 간단한 프로젝트를 만들기로 결정했습니다. 카메라가 내 명함 중 하나를 가리킬 때 3D 애니메이션을 재생하는 필터를 만드는 것입니다. 나는 작은 etsy 매장을 운영하고 있는데 고객이 내 명함과 함께 주문을 받은 후 이 AR 필터를 사용해 보고 싶어할 수 있기 때문에 고객이 소셜 네트워크에 이에 대해 게시하도록 유도하는 것이 재미있는 방법이 될 수 있다고 생각했습니다.
디자인이 만족스러우면 인쇄하고 카드 사진을 찍어보세요. 실제로, 디지털 대응물 대신 추적하려는 실제 물체의 그림을 사용하면 표적 추적이 더 잘 작동한다는 것을 알았습니다.
AR 애니메이션 Mockup 및 시각적 요소 준비
다음으로 AR 애니메이션을 위에서 본 것처럼 구상하는 방법에 대한 모형을 디자인합니다. Spark AR Studio에서 장면의 다양한 요소를 구성하고 배치하는 데 도움이 됩니다.
벡터 편집기에서 주요 요소를 다양한 레이어로 구성하고 다음 형식으로 내보냅니다. .png 배경이 투명한 이미지.
애니메이션 텍스트: 알고보니 이 부분이 프로젝트에서 가장 골치 아픈 부분 중 하나였습니다. 간단히 말해서, 프레임 단위 애니메이션을 생성하기 위해 Inkscape에서 텍스트의 획을 디자인하고 Blender에 로드했습니다. 해당 프로세스에 대해 더 자세한 내용을 원하는 사람이 있으면 댓글로 알려주시기 바랍니다. 이에 대한 간단한 튜토리얼을 작성하게 될 수도 있습니다.
Spark AR Studio를 실행하고 로그인한 후, 새로 만들기 -> 새 프로젝트 -> 표적 추적.
이 소프트웨어는 버그가 많고 불안정하므로 프로젝트를 즉시 저장하고 상당한 진전을 이룬 후에는 주기적으로 저장하는 것을 잊지 마십시오.
텍스처를 프로젝트로 가져오기
앞서 .png로 저장한 장면 요소를 기억하시나요? 우리는 그것들을 다음과 같이 로드해야 합니다. 텍스처 프로젝트 내에서 사용할 수 있도록 말이죠.
소프트웨어 문서를 인용하려면:
텍스처는 장면에서 객체의 모양을 정의하는 데 사용되는 이미지 파일입니다. 하나 이상의 텍스처를 재료에 적용한 다음 해당 재료를 개체에 적용할 수 있습니다.
에서 자산 패널 창 왼쪽 하단에서 컴퓨터에서 가져오기 그리고 모든 파일을 로드합니다. 텍스처 /Text 애니메이션 프레임의 콘텐츠를 제외하고(현재는) Google 드라이브 저장소의 폴더입니다.
그런 다음 선택 새로 가져온 모든 텍스처 배경 및 Business_card_target_image를 제외하고. 에 텍스처 패널 당신 오른쪽에 압축 하위 패널, 세 가지 압축 옵션을 모두 다음으로 설정합니다. 없음. 이미지가 이미 충분히 가벼우며 프로그램의 압축 모듈이 명확한 이유 없이 너무 많은 CPU 및 GPU 리소스를 사용하여 영원히 멈추는 경향이 있기 때문에 이렇게 합니다.
이제 텍스트 애니메이션의 프레임을 가져옵니다. 다시 한 번 압축 모듈이 작업을 수행하지 않을 때까지 영원히 기다리지 않도록 해결 방법을 사용해야 합니다. 오른쪽 하단에는 자산 패널, 클릭 + 자산 추가 -> 수입 -> 컴퓨터에서. 모든 이미지를 로드합니다. /텍스트 애니메이션 프레임 폴더를 한 번에 절반씩. 프로그램 충돌을 피하기 위해 이 작업을 수행해야 합니다. 텍스처 애니메이션 가져오기 옵션이 있는데, 그렇지 않은 경우 사용하기 더 편리할 것입니다... 프로그램이 충돌합니다.
50개의 프레임을 가져온 후에는 모두 선택하고 유형 에게 텍스처 시퀀스 맨 위에 텍스처 패널.
압축을 다음으로 설정하세요. 없음 다른 텍스처와 마찬가지로 세 가지 압축 옵션 모두에 대해.
마지막으로 애니메이션에 사용할 다른 유형의 개체를 만들어야 합니다. 에서 + 자산 추가 메뉴, 선택 애니메이션 시퀀스. 오른쪽에 열린 패널에서 드롭다운 화살표 앞에 조직 그리고 텍스처 시퀀스 우리가 방금 만든 것입니다.
재료 만들기
필요한 자료를 생성하려면 다음을 클릭하세요. + 자산 추가 -> 재료. 그 중 7개가 필요하므로 계속해서 복제하세요. 6 시간 CTRL + D.
모든 자료에 더 의미 있는 이름을 지정하십시오. 이제 각각에 몇 가지 매개변수를 설정해야 합니다.
배경을 제외한 모든 재질을 선택합니다.
에 재료 패널 오른쪽 선택 양면의 에서 렌더링 옵션 하위 패널. 이는 아래에서 볼 때도 텍스처를 볼 수 있도록 하기 위한 것입니다. 날개와 나방의 몸체가 공중에 떠 있기 때문에 특히 관련이 있습니다.
에서 고급 렌더링 옵션 하위 패널, 선택 취소 깊이 있게 쓰기. 이렇게 하면 나중에 평면 작업을 할 때 텍스처의 투명한 배경이 실제로 사라지고 서로 간섭하지 않게 됩니다.
그런 다음 관련 항목을 선택하세요. 조직 각 재료에 대해 셰이더 속성 하위 패널.
대상 추적기에 텍스처 추가
이제 애니메이션을 트리거하고 애니메이션이 지향되어야 하는 평면에 대한 정보를 제공하는 실제 개체를 찾는 작업을 담당하는 프로그램 모듈인 Target Tracker에 대상을 제공해야 합니다.
선택하다 고정대상 추적기0 에서 장면 패널 왼쪽 상단과 표적 추적기 오른쪽 메뉴 선택 Business_card_target_image 으로 조직.
장면 요소에 대한 평면 만들기
가장 먼저 할 일은 장면을 3D에서 2D로 전환하는 것입니다. 방법.
다음 마우스 오른쪽 버튼으로 클릭 ~에 고정대상 추적기0 에게 추가하다 새로운 비행기 현장으로.
사용 CTRL + D 에게 복제하다 이 비행기 6회 7개의 비행기로 끝나기 위해서요.
장면에 포함될 모든 요소를 반영하는 평면의 이름을 바꿉니다.
에서 평면 패널 오른쪽에 관련 항목을 추가하세요. 재료 비행기마다.
평면 크기 조정 및 위치 지정
이제 평면에 텍스처가 적용되었으므로 장면의 요소에 적절한 크기와 위치를 제공하도록 평면을 조정해야 합니다. 이를 위해 우리는 한 번에 한 평면씩 작업할 것입니다.
따라서 작업할 첫 번째 평면(이 경우 별)을 제외한 모든 평면을 선택하여 시작하세요. 숨겨진 선택을 취소하여 보이는.
대상 이미지를 참조로 사용하십시오. 규모 그리고 정복 별들이 어떻게든 배경과 일치할 때까지. 완료되면 Stars 평면의 가시성을 숨김으로 설정하고 다른 평면으로 이동합니다. Background 및 TextAnimation을 제외한 모든 평면에 대해 이 작업을 반복합니다.
만족스러우면 작업 중인 모든 평면과 배경을 공개합니다. 선택 배경 비행기와 규모 원하는 크기로 조정합니다. 이상적으로는 대상 이미지를 완전히 덮고 싶을 것입니다.
그런 다음 텍스트애니메이션 표시하고 다시 한 번 원래 비율로 크기를 조정하고 적절하게 배치합니다.
이제 나방은 배경에 비해 조금 작아 보입니다. 실제로 대상 이미지를 참고하여 나방의 크기를 조정했지만 배경은 명함보다 크게 만들었습니다. 따라서 우리의 비율은 더 이상 모형에 맞지 않습니다.
이 문제를 해결하기 위해 우리는 배경을 제외한 모든 항목의 크기를 일관된 방식으로 조정하려고 합니다. 우리는 이러한 모든 요소를 널 컨테이너, 그리고 스케일링 모든 개별 평면 대신 이 컨테이너를 사용합니다.
텍스트에 애니메이션 적용
마우스 오른쪽 버튼으로 클릭 ~에 고정대상 추적기0 그리고 선택 패치 생성. 이렇게 하면 패치 편집기.
마우스 오른쪽 버튼으로 클릭 패치 편집기에서 생기 반점. 연결하다 그만큼 설립하다 커넥터의 고정 타겟 추적기 패치를 놀다 커넥터의 생기 반점. 이렇게 하면 대상 이미지를 찾았기 때문에 AR 필터가 활성화되면 텍스트 애니메이션이 재생되기 시작합니다.
그렇게 하면 그 사이에 Pulse 패치가 자동으로 추가됩니다. 연결하다 껐다 커넥터의 맥박 패치를 초기화 커넥터의 생기 반점. 이는 카메라가 대상 이미지를 벗어나면 텍스트 애니메이션이 재설정되고 대상을 새로 발견하면 다시 재생할 수 있도록 하기 위한 것입니다.
추가 프레임 전환 패치하고 연결하세요 진전 커넥터를 해당 장치에 연결합니다. 생기 반점. 설정 프레임 수 = 51.
선택 텍스트 애니메이션 시퀀스 을 열다 애니메이션 시퀀스 패널 너의 오른쪽에. 다음을 클릭하세요. 화살 선행 현재 프레임 장면에 표시되는 프레임과 상호 작용할 수 있는 새 패치를 추가합니다. 연결하다 이 패치를 사용 가능한 커넥터에 프레임 전환 반점.
애니메이션 패치의 Duration 매개변수를 조정하여 애니메이션 속도를 제어할 수 있습니다.
날개 애니메이션
각 날개를 연속적으로 선택하고 해당 날개가 위치 에 Z축 ~이다 0.
날개 플랩을 만드는 것은 어렵지 않습니다. 두 날개 개체 모두의 Y축에 회전 애니메이션을 추가하기만 하면 됩니다. 그러나 이러한 효과를 날개 오브젝트에 직접 적용하면 작동하지 않습니다. 실제로 물체의 질량 중심은 날개의 중앙에 위치하므로 회전시키면 중심에서 회전하게 됩니다. 우리에게 필요한 것은 날개의 가장자리 부분, 즉 몸체와 접촉하는 부분에서 회전하는 것입니다. 나는 여기서 어느 정도 이해가 되기를 바랍니다…
따라서 우리는 날개 물체의 질량 중심을 어떻게든 이동시킬 수 있는 방법을 찾아야 합니다. 이를 위해 장면 중앙을 중심으로 질량 중심이 자동으로 생성되는 Null Object를 사용하겠습니다. 이러한 Null 개체는 날개 개체를 보유하고 회전은 Null 개체 자체에 적용됩니다. 해보자!
마우스 오른쪽 버튼으로 클릭 에 컨테이너 그리고 추가하다 ㅏ 널 객체 그 안에. 이름을 RightWingContainer로 바꾸고 복제하다 그것으로 CTRL + D. 중복 LeftWingContainer의 이름을 바꿉니다. 선택 날개 개체 그리고 드래그 앤 드롭 그들을 각자의 것으로 Null 개체 컨테이너.
에서 패치 에디터, 마우스 오른쪽 버튼으로 클릭 그리고 루프 애니메이션 반점. 설정 기간 = 2 그리고 미러링됨 확인란(이는 애니메이션이 원활하게 반복되고 날개 플랩의 끝에서 처음부터 다시 시작되지 않도록 하기 위한 것입니다. 미러링을 켜면 날개가 위로 플랩의 상한에 도달한 후 뒤로 플랩하기 시작합니다).
다음으로 이행 패치와 복제하다 그것. 링크 진전 커넥터의 루프 애니메이션 양쪽 모두에 대응하는 패치를 적용합니다. 이행 패치.
다음과 같이 전환 패치의 매개변수를 입력합니다.
[0, -40, 0,
0, 35, 0]
[0, 40, 0,
0, -35, 0]
선택 RightWing컨테이너 그리고 에 Null 개체 패널 왼쪽에서 화살 선행 회전. 그러면 해당 값과 상호 작용할 수 있도록 패치 편집기에 패치가 추가됩니다. 연결하다 값 가장 위쪽에 있는 커넥터 이행 커넥터에 패치를 붙이세요. RightWing컨테이너 패치가 새로 생성되었습니다.
다음을 사용하여 작업을 반복합니다. LeftWing컨테이너 그리고 가장 아래쪽에 있는 전환 패치입니다.
그 시점에서 양쪽 날개가 펄럭이기 시작하는 것을 볼 수 있습니다! 이제 나방을 Z축을 따라 더 적합한 위치로 이동하면 됩니다. 땜질하다 위치 에 Z축 ~의 RightWing컨테이너, LeftWing컨테이너 그리고 몸 당신이 만족하는 결과에 도달할 때까지 반대하십시오.
결과 미리보기
다음을 다운로드해야 합니다. 스파크 AR 플레이어 먼저 휴대폰에 앱을 설치하세요.
휴대폰이 컴퓨터에 연결되면 Spar AR Studio 왼쪽 하단의 휴대폰 아이콘에 작은 파란색 점이 추가된 것을 볼 수 있습니다. 그것을 클릭하고 선택하세요. 보내다 당신의 장치에.
아까 인쇄한 명함에 카메라를 대고 즐겨보세요!
그 시점에서 다음 단계에 필요하므로 휴대폰의 앱을 사용하여 효과 비디오를 촬영하세요.
AR 필터를 Facebook 또는 Instagram에 게시
다음을 클릭하세요. 게시 왼쪽 하단에 있는 미리보기 아이콘 아래에 있는 화살표 아이콘입니다. 그러면 프로젝트가 패키징되어 업로드되고 리디렉션됩니다. 스파크 AR 허브의 웹페이지입니다.
필터를 성공적으로 게시하려면 다음 단계를 따르세요.
선택하세요 이름 필터를 위해.
Instagram 및/또는 Facebook 중 게시하려는 플랫폼을 선택하세요.
사람들이 필터 검색 엔진에서 쉽게 찾을 수 있도록 하려면 필터 카테고리를 선택하고 키워드를 추가하세요.
마지막 단계에서 저장한 비디오가 유용한 곳입니다. 업로드 데모 비디오 당신의 필터.
선택하세요 상 당신의 필터를 위해.
빨리 써라 설명 필터에서 일어나는 일과 이를 사용하여 검토 과정에 도움을 주는 방법을 설명합니다.
때리다 제출하다 오른쪽 상단에 있습니다.
기다려라 검토 완료되는 프로세스입니다.
당신은 확인하고 싶을 수도 있습니다 스파크 AR 정책 검토를 위해 제출하기 전에. 내 웹사이트 주소가 데모 비디오에 표시되었기 때문에 첫 번째 시도가 거부되었습니다.
최종 결과
지금까지 제가 사용해왔던 필터의 데모를 보여드리겠습니다.
첫 번째는 내 명함용으로 만든 것이고, 두 번째는 다음 중 하나를 사용하여 만든 첫 번째 테스트입니다. 말린 꽃잎으로 만드는 엽서 세 번째는 이 튜토리얼을 위해 생성된 필터입니다.
이 튜토리얼을 따라가면서 즐거운 시간을 보내셨기를 바랍니다.
언제나 그렇듯, 이 튜토리얼에 대한 피드백이나 여기에 게시하고 싶은 프로젝트 아이디어를 자유롭게 공유해 주세요.
각주
다음 온라인 콘텐츠는 이 프로젝트를 만드는 동안 약간의 도움 및/또는 영감을 제공했습니다.
, merci beaucoup pour toutes ces explications très claires! c'est vraiment top! en revanche, j'ai un petit soucis, lorsque j'exporte il semble que mon fichier ne peut être importé que sur Facebook et n'est pas Compatible avec Instagram… je ne sais pas pourquoi… et une fois que l'effet est accepté et annoncé comme publié du coup je ne sais pas ou le retrouver pour le montrer!!! ce qui est un problème! pouvez-vous m'aider? je vous souhaite une Excellente journée.
Il semblerait que depuis que j'ai écrit ce tutoriali l'option pour Poster et Retrouver des effets tel que celui-ci sur instagram ait été suprimée ou en tout caslargement modifié.
지도 시간
명함용 AR 인스타그램 필터 만들기
30 분
쉬운
자유 소프트웨어
이 아이디어는 흔히 그렇듯 시작되었습니다. 전혀 다른 프로젝트 '라는 예술가의 작품을 우연히 발견한 후 길을 벗어났을 때 카탈리나 빌레가스 소셜 미디어에서. 그녀는 스티커로 판매하는 일러스트레이션에 생기를 불어넣는 Instagram AR 필터를 만듭니다. AR은 새로운 것이 아닙니다. 저는 2012년에 저의 새로운 Sony 스마트폰에 그런 종류의 효과를 보여주는 앱을 가지고 있었습니다. 하지만 AR 효과를 쉽게 만들고 이를 Instagram과 같은 유비쿼터스 플랫폼에 게시할 수 있는 도구가 있다는 사실을 알게 되자 정말 마음에 들었습니다.
그런 다음 나는 개인적, 직업적 활동을 고려하여 그러한 기술을 어떤 용도로 사용할 수 있는지 생각하기 시작했습니다. 만들 수 있었으면 좋겠어요 아름다운 디지털 일러스트레이션 대화식으로 만들어 새로운 차원을 제공하지만 현재로서는 이것이 내 기술 범위와 너무 거리가 멀습니다. 그래서 나는 나에게 의미가 있는 간단한 프로젝트를 만들기로 결정했습니다. 카메라가 내 명함 중 하나를 가리킬 때 3D 애니메이션을 재생하는 필터를 만드는 것입니다. 나는 작은 etsy 매장을 운영하고 있는데 고객이 내 명함과 함께 주문을 받은 후 이 AR 필터를 사용해 보고 싶어할 수 있기 때문에 고객이 소셜 네트워크에 이에 대해 게시하도록 유도하는 것이 재미있는 방법이 될 수 있다고 생각했습니다.
요구사항
소프트웨어
이 프로젝트를 생성하는 데 다음 소프트웨어가 사용되었습니다.
파일
모든 프로젝트 파일을 Google 드라이브에 업로드했습니다.
프로젝트 파일 저장소의 구조:
연습
AR 애니메이션을 위한 명함 및 목업 디자인
명함
완료해야 할 첫 번째 작업은 자신만의 명함 디자인을 만드는 것입니다.
이 튜토리얼에서는 다음이 디자인한 나방 일러스트레이션을 사용합니다. 내 재능있는 친구 Hui Chen. 귀하의 작업을 사용하도록 허락해 주신 Hui에게 감사드립니다!
이 기사를 살펴보십시오. Spark AR Studio의 표적 추적 모범 사례 필터에서 쉽게 인식할 수 있도록 명함 디자인이 어떤 모습이어야 하는지 잘 이해합니다.
디자인이 만족스러우면 인쇄하고 카드 사진을 찍어보세요. 실제로, 디지털 대응물 대신 추적하려는 실제 물체의 그림을 사용하면 표적 추적이 더 잘 작동한다는 것을 알았습니다.
AR 애니메이션 Mockup 및 시각적 요소 준비
다음으로 AR 애니메이션을 위에서 본 것처럼 구상하는 방법에 대한 모형을 디자인합니다. Spark AR Studio에서 장면의 다양한 요소를 구성하고 배치하는 데 도움이 됩니다.
벡터 편집기에서 주요 요소를 다양한 레이어로 구성하고 다음 형식으로 내보냅니다. .png 배경이 투명한 이미지.
애니메이션 텍스트: 알고보니 이 부분이 프로젝트에서 가장 골치 아픈 부분 중 하나였습니다. 간단히 말해서, 프레임 단위 애니메이션을 생성하기 위해 Inkscape에서 텍스트의 획을 디자인하고 Blender에 로드했습니다. 해당 프로세스에 대해 더 자세한 내용을 원하는 사람이 있으면 댓글로 알려주시기 바랍니다. 이에 대한 간단한 튜토리얼을 작성하게 될 수도 있습니다.
스파크 AR 스튜디오 설치
다음으로 향하세요. Spark AR Studio 다운로드 페이지, 설치 파일을 다운로드하고 지침에 따라 프로그램을 설치하십시오.
이 프로그램을 사용하려면 Facebook 계정이 필요합니다.
새 프로젝트 만들기
Spark AR Studio를 실행하고 로그인한 후, 새로 만들기 -> 새 프로젝트 -> 표적 추적.
이 소프트웨어는 버그가 많고 불안정하므로 프로젝트를 즉시 저장하고 상당한 진전을 이룬 후에는 주기적으로 저장하는 것을 잊지 마십시오.
텍스처를 프로젝트로 가져오기
앞서 .png로 저장한 장면 요소를 기억하시나요? 우리는 그것들을 다음과 같이 로드해야 합니다. 텍스처 프로젝트 내에서 사용할 수 있도록 말이죠.
소프트웨어 문서를 인용하려면:
에서 자산 패널 창 왼쪽 하단에서 컴퓨터에서 가져오기 그리고 모든 파일을 로드합니다. 텍스처 /Text 애니메이션 프레임의 콘텐츠를 제외하고(현재는) Google 드라이브 저장소의 폴더입니다.
그런 다음 선택 새로 가져온 모든 텍스처 배경 및 Business_card_target_image를 제외하고. 에 텍스처 패널 당신 오른쪽에 압축 하위 패널, 세 가지 압축 옵션을 모두 다음으로 설정합니다. 없음. 이미지가 이미 충분히 가벼우며 프로그램의 압축 모듈이 명확한 이유 없이 너무 많은 CPU 및 GPU 리소스를 사용하여 영원히 멈추는 경향이 있기 때문에 이렇게 합니다.
이제 텍스트 애니메이션의 프레임을 가져옵니다. 다시 한 번 압축 모듈이 작업을 수행하지 않을 때까지 영원히 기다리지 않도록 해결 방법을 사용해야 합니다. 오른쪽 하단에는 자산 패널, 클릭 + 자산 추가 -> 수입 -> 컴퓨터에서. 모든 이미지를 로드합니다. /텍스트 애니메이션 프레임 폴더를 한 번에 절반씩. 프로그램 충돌을 피하기 위해 이 작업을 수행해야 합니다. 텍스처 애니메이션 가져오기 옵션이 있는데, 그렇지 않은 경우 사용하기 더 편리할 것입니다... 프로그램이 충돌합니다.
50개의 프레임을 가져온 후에는 모두 선택하고 유형 에게 텍스처 시퀀스 맨 위에 텍스처 패널.
압축을 다음으로 설정하세요. 없음 다른 텍스처와 마찬가지로 세 가지 압축 옵션 모두에 대해.
마지막으로 애니메이션에 사용할 다른 유형의 개체를 만들어야 합니다. 에서 + 자산 추가 메뉴, 선택 애니메이션 시퀀스. 오른쪽에 열린 패널에서 드롭다운 화살표 앞에 조직 그리고 텍스처 시퀀스 우리가 방금 만든 것입니다.
재료 만들기
필요한 자료를 생성하려면 다음을 클릭하세요. + 자산 추가 -> 재료. 그 중 7개가 필요하므로 계속해서 복제하세요. 6 시간 CTRL + D.
모든 자료에 더 의미 있는 이름을 지정하십시오. 이제 각각에 몇 가지 매개변수를 설정해야 합니다.
배경을 제외한 모든 재질을 선택합니다.
에 재료 패널 오른쪽 선택 양면의 에서 렌더링 옵션 하위 패널. 이는 아래에서 볼 때도 텍스처를 볼 수 있도록 하기 위한 것입니다. 날개와 나방의 몸체가 공중에 떠 있기 때문에 특히 관련이 있습니다.
에서 고급 렌더링 옵션 하위 패널, 선택 취소 깊이 있게 쓰기. 이렇게 하면 나중에 평면 작업을 할 때 텍스처의 투명한 배경이 실제로 사라지고 서로 간섭하지 않게 됩니다.
그런 다음 관련 항목을 선택하세요. 조직 각 재료에 대해 셰이더 속성 하위 패널.
대상 추적기에 텍스처 추가
이제 애니메이션을 트리거하고 애니메이션이 지향되어야 하는 평면에 대한 정보를 제공하는 실제 개체를 찾는 작업을 담당하는 프로그램 모듈인 Target Tracker에 대상을 제공해야 합니다.
선택하다 고정대상 추적기0 에서 장면 패널 왼쪽 상단과 표적 추적기 오른쪽 메뉴 선택 Business_card_target_image 으로 조직.
장면 요소에 대한 평면 만들기
가장 먼저 할 일은 장면을 3D에서 2D로 전환하는 것입니다. 방법.
다음 마우스 오른쪽 버튼으로 클릭 ~에 고정대상 추적기0 에게 추가하다 새로운 비행기 현장으로.
사용 CTRL + D 에게 복제하다 이 비행기 6회 7개의 비행기로 끝나기 위해서요.
장면에 포함될 모든 요소를 반영하는 평면의 이름을 바꿉니다.
에서 평면 패널 오른쪽에 관련 항목을 추가하세요. 재료 비행기마다.
평면 크기 조정 및 위치 지정
이제 평면에 텍스처가 적용되었으므로 장면의 요소에 적절한 크기와 위치를 제공하도록 평면을 조정해야 합니다. 이를 위해 우리는 한 번에 한 평면씩 작업할 것입니다.
따라서 작업할 첫 번째 평면(이 경우 별)을 제외한 모든 평면을 선택하여 시작하세요. 숨겨진 선택을 취소하여 보이는.
대상 이미지를 참조로 사용하십시오. 규모 그리고 정복 별들이 어떻게든 배경과 일치할 때까지. 완료되면 Stars 평면의 가시성을 숨김으로 설정하고 다른 평면으로 이동합니다. Background 및 TextAnimation을 제외한 모든 평면에 대해 이 작업을 반복합니다.
만족스러우면 작업 중인 모든 평면과 배경을 공개합니다. 선택 배경 비행기와 규모 원하는 크기로 조정합니다. 이상적으로는 대상 이미지를 완전히 덮고 싶을 것입니다.
그런 다음 텍스트애니메이션 표시하고 다시 한 번 원래 비율로 크기를 조정하고 적절하게 배치합니다.
이제 나방은 배경에 비해 조금 작아 보입니다. 실제로 대상 이미지를 참고하여 나방의 크기를 조정했지만 배경은 명함보다 크게 만들었습니다. 따라서 우리의 비율은 더 이상 모형에 맞지 않습니다.
이 문제를 해결하기 위해 우리는 배경을 제외한 모든 항목의 크기를 일관된 방식으로 조정하려고 합니다. 우리는 이러한 모든 요소를 널 컨테이너, 그리고 스케일링 모든 개별 평면 대신 이 컨테이너를 사용합니다.
텍스트에 애니메이션 적용
마우스 오른쪽 버튼으로 클릭 ~에 고정대상 추적기0 그리고 선택 패치 생성. 이렇게 하면 패치 편집기.
마우스 오른쪽 버튼으로 클릭 패치 편집기에서 생기 반점. 연결하다 그만큼 설립하다 커넥터의 고정 타겟 추적기 패치를 놀다 커넥터의 생기 반점. 이렇게 하면 대상 이미지를 찾았기 때문에 AR 필터가 활성화되면 텍스트 애니메이션이 재생되기 시작합니다.
그렇게 하면 그 사이에 Pulse 패치가 자동으로 추가됩니다. 연결하다 껐다 커넥터의 맥박 패치를 초기화 커넥터의 생기 반점. 이는 카메라가 대상 이미지를 벗어나면 텍스트 애니메이션이 재설정되고 대상을 새로 발견하면 다시 재생할 수 있도록 하기 위한 것입니다.
추가 프레임 전환 패치하고 연결하세요 진전 커넥터를 해당 장치에 연결합니다. 생기 반점. 설정 프레임 수 = 51.
선택 텍스트 애니메이션 시퀀스 을 열다 애니메이션 시퀀스 패널 너의 오른쪽에. 다음을 클릭하세요. 화살 선행 현재 프레임 장면에 표시되는 프레임과 상호 작용할 수 있는 새 패치를 추가합니다. 연결하다 이 패치를 사용 가능한 커넥터에 프레임 전환 반점.
애니메이션 패치의 Duration 매개변수를 조정하여 애니메이션 속도를 제어할 수 있습니다.
날개 애니메이션
각 날개를 연속적으로 선택하고 해당 날개가 위치 에 Z축 ~이다 0.
날개 플랩을 만드는 것은 어렵지 않습니다. 두 날개 개체 모두의 Y축에 회전 애니메이션을 추가하기만 하면 됩니다. 그러나 이러한 효과를 날개 오브젝트에 직접 적용하면 작동하지 않습니다. 실제로 물체의 질량 중심은 날개의 중앙에 위치하므로 회전시키면 중심에서 회전하게 됩니다. 우리에게 필요한 것은 날개의 가장자리 부분, 즉 몸체와 접촉하는 부분에서 회전하는 것입니다. 나는 여기서 어느 정도 이해가 되기를 바랍니다…
따라서 우리는 날개 물체의 질량 중심을 어떻게든 이동시킬 수 있는 방법을 찾아야 합니다. 이를 위해 장면 중앙을 중심으로 질량 중심이 자동으로 생성되는 Null Object를 사용하겠습니다. 이러한 Null 개체는 날개 개체를 보유하고 회전은 Null 개체 자체에 적용됩니다. 해보자!
마우스 오른쪽 버튼으로 클릭 에 컨테이너 그리고 추가하다 ㅏ 널 객체 그 안에. 이름을 RightWingContainer로 바꾸고 복제하다 그것으로 CTRL + D. 중복 LeftWingContainer의 이름을 바꿉니다. 선택 날개 개체 그리고 드래그 앤 드롭 그들을 각자의 것으로 Null 개체 컨테이너.
에서 패치 에디터, 마우스 오른쪽 버튼으로 클릭 그리고 루프 애니메이션 반점. 설정 기간 = 2 그리고 미러링됨 확인란(이는 애니메이션이 원활하게 반복되고 날개 플랩의 끝에서 처음부터 다시 시작되지 않도록 하기 위한 것입니다. 미러링을 켜면 날개가 위로 플랩의 상한에 도달한 후 뒤로 플랩하기 시작합니다).
다음으로 이행 패치와 복제하다 그것. 링크 진전 커넥터의 루프 애니메이션 양쪽 모두에 대응하는 패치를 적용합니다. 이행 패치.
다음과 같이 전환 패치의 매개변수를 입력합니다.
[0, -40, 0,
0, 35, 0]
[0, 40, 0,
0, -35, 0]
선택 RightWing컨테이너 그리고 에 Null 개체 패널 왼쪽에서 화살 선행 회전. 그러면 해당 값과 상호 작용할 수 있도록 패치 편집기에 패치가 추가됩니다. 연결하다 값 가장 위쪽에 있는 커넥터 이행 커넥터에 패치를 붙이세요. RightWing컨테이너 패치가 새로 생성되었습니다.
다음을 사용하여 작업을 반복합니다. LeftWing컨테이너 그리고 가장 아래쪽에 있는 전환 패치입니다.
그 시점에서 양쪽 날개가 펄럭이기 시작하는 것을 볼 수 있습니다! 이제 나방을 Z축을 따라 더 적합한 위치로 이동하면 됩니다. 땜질하다 위치 에 Z축 ~의 RightWing컨테이너, LeftWing컨테이너 그리고 몸 당신이 만족하는 결과에 도달할 때까지 반대하십시오.
결과 미리보기
다음을 다운로드해야 합니다. 스파크 AR 플레이어 먼저 휴대폰에 앱을 설치하세요.
휴대폰이 컴퓨터에 연결되면 Spar AR Studio 왼쪽 하단의 휴대폰 아이콘에 작은 파란색 점이 추가된 것을 볼 수 있습니다. 그것을 클릭하고 선택하세요. 보내다 당신의 장치에.
아까 인쇄한 명함에 카메라를 대고 즐겨보세요!
그 시점에서 다음 단계에 필요하므로 휴대폰의 앱을 사용하여 효과 비디오를 촬영하세요.
AR 필터를 Facebook 또는 Instagram에 게시
다음을 클릭하세요. 게시 왼쪽 하단에 있는 미리보기 아이콘 아래에 있는 화살표 아이콘입니다. 그러면 프로젝트가 패키징되어 업로드되고 리디렉션됩니다. 스파크 AR 허브의 웹페이지입니다.
필터를 성공적으로 게시하려면 다음 단계를 따르세요.
당신은 확인하고 싶을 수도 있습니다 스파크 AR 정책 검토를 위해 제출하기 전에. 내 웹사이트 주소가 데모 비디오에 표시되었기 때문에 첫 번째 시도가 거부되었습니다.
최종 결과
지금까지 제가 사용해왔던 필터의 데모를 보여드리겠습니다.
첫 번째는 내 명함용으로 만든 것이고, 두 번째는 다음 중 하나를 사용하여 만든 첫 번째 테스트입니다. 말린 꽃잎으로 만드는 엽서 세 번째는 이 튜토리얼을 위해 생성된 필터입니다.
이 튜토리얼을 따라가면서 즐거운 시간을 보내셨기를 바랍니다.
언제나 그렇듯, 이 튜토리얼에 대한 피드백이나 여기에 게시하고 싶은 프로젝트 아이디어를 자유롭게 공유해 주세요.
각주
다음 온라인 콘텐츠는 이 프로젝트를 만드는 동안 약간의 도움 및/또는 영감을 제공했습니다.
, merci beaucoup pour toutes ces explications très claires! c'est vraiment top! en revanche, j'ai un petit soucis, lorsque j'exporte il semble que mon fichier ne peut être importé que sur Facebook et n'est pas Compatible avec Instagram… je ne sais pas pourquoi… et une fois que l'effet est accepté et annoncé comme publié du coup je ne sais pas ou le retrouver pour le montrer!!! ce qui est un problème! pouvez-vous m'aider? je vous souhaite une Excellente journée.
봉쥬르 노에미,
Il semblerait que depuis que j'ai écrit ce tutoriali l'option pour Poster et Retrouver des effets tel que celui-ci sur instagram ait été suprimée ou en tout caslargement modifié.
Une bonne journée à vous aussi!