by
May 05. 2021
인스타그램 필터, 개발자 가이드 #5
셰이더를 사용해서 물결 효과를 구현해봅시다.
개요
안녕하세요, 인스타그램 AR 필터 스튜디오 위에이알(WE-AR)의 개발자 딘입니다.
여기저기서 많이 사용하는 물결 효과를 이번 글을통해서 배워봅시다.
1. Render Pass Pipeline을 생성합니다.
좌측 상단의 하이라키에서 Device를 선택하고
우측에 Render Pass탭의 Create 버튼을 눌러주시면 생성하실 수 있습니다.
2. Shader Code Asset을 생성합니다.
3. 먼저 코드를 작성해볼까요?
텍스쳐를 받을 수 있도록 아래와 같이 작성해줍니다.
4. 셰이더와 렌더패스를 연결합니다.
5. 물결 효과를 만들어봅시다.
5번 줄을 보면 uv.y를 sin 값을 더해주었습니다.
이런 식으로 물결 효과가 적용되는 것을 확인할 수 있습니다.
6. 개선 해봅시다.
시간에 흐름에 따라 물결이 움직이도록 변경해봅시다.
time 변수를 만들고 sin 함수 안에 20을 곱해서 더해주었습니다.
이런식으로 물결 효과를 만들수있습니다.
꼭 이번 물결 효과 개발 방법을 숙지하세요!
앞으로 다양한 콘텐츠에서 활용할 예정입니다 :)
더 많은 AR필터 사례들이 궁금하다면? 위에이알 포트폴리오(클릭)
AR필터 사용법부터 카테고리, 사용 데이터, 광고 세팅 등 모든 것을 알고 싶다면? AR필터백서(클릭)
텍스트 말고 따스한 휴먼의 목소리로 자세히 설명 듣고 싶다면? 문의하기(클릭)
현재 WE-AR에서 인스타그램 필터 개발자를 모집하고있습니다.
여기에 채용 공고가 있으니 많은 지원 부탁드립니다.
