강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

nhs0912님의 프로필 이미지
nhs0912

작성한 질문수

애플 웹사이트 인터랙션 클론!

비디오 인터랙션 적용 2

이미지 배경 문의

작성

·

9

0

- 질문에 대한 답변은 강의자가 하는 경우도 있고, 수강생 여러분들이 해주시는 경우도 있습니다. 같이 도와가며 공부해요! :)
- 작성하신 소스코드 자체의 오류보다는, 개념이나 원리가 이해되지 않는 부분을 질문해주시는게 좋습니다. 그대로 따라했는데 소스코드에서 버그가 나는 경우는 99%가 오타에 의한거라서, 완성된 소스랑 찬찬히 비교해보시면 직접 찾으실 수 있을 거예요. 개발자도구 console에 오류로 표시된 부분만 완성 코드에서 복사->붙여넣기를 해보시는 것도 방법입니다.
- 먼저 유사한 질문이 있었는지 검색해보세요.

 

안녕하세요. 제가 스스로 영상을 찍어서 해보려고 하니 웹페이지 배경이 하얀색이라 영상 찍을때도 하얀색 바탕으로 하면 좋을거 같다고 생각이 들었는데요. 샘플 예제 동영상도 혹시 하얀색 배경에서 영상 촬영을 하신건지 아니면 프레임 추출해서 이미지를 배경제거를 해서 한건지 궁금해서요!

그리고 또 하나 요즘 애플에서는 스크롤이 아니라 부분적으로 영상처럼 작동하던데 그 기술도 인터랙티브 기술일까요?

 

(아직 완강은 못해서 질문한 것일수도 있습니다)

 

답변 1

0

안녕하세요, 인프런 AI 인턴입니다. nhs0912님.

질문해주신 웹페이지 배경과 관련된 사항에 대해 답변 드리겠습니다. 동영상 촬영 시 배경을 하얀색으로 설정하는 것은 여러모로 유리합니다. 실제로 배경이 하얗다면 후속 이미지 처리나 이미지 배경 제거 과정에서도 훨씬 수월하게 작업할 수 있습니다. 기존 1분코딩님의 코멘트에 따르면, 실제로 집 안에서 밝은 벽을 배경으로 촬영 후 영상 편집을 통해 배경을 조정하는 방식을 사용한 것으로 보입니다. 기술 사용 사례의 자세한 설명은 다음과 같은 페이지에서 확인하실 수 있습니다:

또한, 애플의 최신 스크롤과 영상 기술은 자바스크립트와 CSS를 활용한 인터랙티브 웹 기술의 일종으로 구현할 수 있는 가능성이 있습니다. 애플 사이트에서 사용하는 특정 기술은 복합적인 고급 기술을 활용한 것으로 보이며, 이러한 기술들은 Web Animations API나 JavaScript 라이브러리 등을 활용하여 구현됩니다. 이에 대한 더 구체적인 구현 방법은 강의의 후반부나 추가적인 리소스를 통해 배울 수 있습니다.

궁금했던 추가적인 기술 관련 정보는 다음의 답변에서 참조하실 수 있습니다:
- “web animation api를 통한 apple page”
여기에서 Web Animations API를 활용한 애니메이션 구현에 대한 설명을 얻을 수 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

nhs0912님의 프로필 이미지
nhs0912

작성한 질문수

질문하기