profile
interactive front-end artist

mediapipe holistic 새로고침 하기

mediapipe holistic을 이용해서 수화앱을 만들고 있는데, 모바일에서 카메라를 선택할때 반응이 느려지는 현상이 있어 살펴보니 holistic 객체가 새로고침되지 않아서 문제가 발생되었다.api를 살펴보니 reset()이라는것이 있어 사용해 보았지만, 왜 안되

2023년 11월 15일
·
0개의 댓글
·
post-thumbnail

text wrap balance

css의 text-wrap은 줄바꿈을 할때 텍스트를 어떻게 할건지를 결정한다.text-wrap의 속성을 balance로 지정하면 균형있게 줄바꿈 할 수 있다.오른쪽 끝을 보면 좀 더 균형이 있는것을 볼 수 있다.

2023년 10월 31일
·
0개의 댓글
·

빌드 도구 없이 패키지 사용하기 (feat. importmap)

위와 같이 three라는 패키지를 사용하려면 import하기 전에 npm으로 해당 패키지를 인스톨해야 되는데 인터넷이 연결되어 있지 않은 폐쇄환경이라면 사용하기가 곤란할 것이다. 물론 yarn의 offline 옵션이 있긴 하지만... 어쨌든, 패키지를 오프라인 파일로

2023년 10월 31일
·
0개의 댓글
·

flex vs grid

Flexbox: 주로 단일 축(행 또는 열)을 따라 아이템을 배치하는 데 사용됩니다. 주로 리스트, 메뉴, 사이드바와 같은 요소들을 정렬할 때 유용합니다.Grid: 2차원 그리드로 요소를 배치할 수 있으며, 행과 열을 모두 제어할 수 있습니다. 레이아웃을 더 복잡하게

2023년 10월 30일
·
0개의 댓글
·

install mediapipe on python

python에서 mediapip를 사용해야해서 install했더니 에러가 났다. 이리저리 방법을 찾아보다가 공식홈까지 가게 되었는데...그곳에 설정 환경이 적혀 있었다. 또르르OS:Desktop: Windows, Mac, LinuxIoT: Raspberry OS 64-

2023년 10월 17일
·
0개의 댓글
·

Anaconda 명령어

패키지 'a'를 패키지 'b'로 바꾸겠다. 단, 현재 가상환경의 이름을 바꾸려면 다른 가상환경으로 activate를 진행한 후 이름을 변경해야 한다.

2023년 10월 16일
·
0개의 댓글
·

svh, lvh, dvh

small viewport주소바 UI가 축소되지 않은 상태의 뷰포트 높이.large viewport주소바 UI가 축소된 상태의 뷰포트 높이.dynamic viewport주소 표시줄의 유무에 따라 동적으로 변하는 높이.출처: https://blanche-toil

2023년 8월 23일
·
0개의 댓글
·

git 저장소 옮기기(feat. git push error)

유튜브 영상을 보다가 따라해보고 싶어서 공개된 github 주소에서 clone을 한 다음에 작업을 하고 내 github에 push를 하려고 했는데 에러가 발생했다.저장소의 현재 버전과 내 로컬에 있는 버전이 맞지 않아서 이걸 해결해줘야 한다는 내용이다. 신규로 만든 프

2023년 7월 17일
·
0개의 댓글
·

WGSL Syntax

파라미터와 리턴값이 없는 경우.파라미터가 있을 경우 타입을 명시해준다.파라미터와 리턴값이 있을 경우 리턴값의 타입을 명시해준다.

2023년 5월 19일
·
0개의 댓글
·
post-thumbnail

msdf font

webgl작업을 하다보면 만나는 msdf폰트에 대해 알아보자.우선 왜 이런 기술이 나왔을까? 우선 glsl에서는 그냥 쌩으로 폰트를 읽어 올 수 없다. 그래서 폰트를 이미지화 해서 가져와야 하는데, 이럴경우 각각의 크기별로 폰트의 이미지를 만들어야 하는데 이러면 비 효

2023년 4월 18일
·
0개의 댓글
·

glb vs gltf

glb와 gltf는 3d 데이터를 webgl로 불러오는데 많이 사용되는 포맷이다.데이터가 바이너리로 되어 있다.모션 데이터가 같이 묶여있다.데이터가 json형태로 되어 있다.이런차이 때문에 둘 사이에는 용량차이가 발생한다. 사람이 보는거 아니면 glb포맷이 나을것이다.

2023년 4월 9일
·
0개의 댓글
·

vertex shader

2023년 3월 28일
·
0개의 댓글
·
post-thumbnail

post processing

three.js에서 post processing을 사용하면 하나의 pass를 통해서 효과가 부여된 이미지가 전달된다.위와 같이 pass를 통해 다음 pass로 전달이 되는데 이때 사용되는 이름이 'tDiffuse'이다.tDiffuse의 값을 null로 한다는 것은 이전

2023년 3월 27일
·
0개의 댓글
·

svg filter에 대한 이해

canvas에서 svg필터를 사용하여 여러가지 효과를 낼때가 있는데 필터에 대해서 알아둘 필요가 있어서 정리한다.필터는 defs 태그안에 정의해서 사용하는데 filter태그를 만들어 주고 그 안에 fe로 시작되는 적용하고자 하는 필터의 이름을 적어준다.feSpotLig

2023년 3월 1일
·
0개의 댓글
·

File Watchers SCSS

다른사람이 하던 프로젝트를 이어 받아서 하게 되었는데, vscode를 사용해서 작업을 하셨고, scss를 사용하면서 css가 만들어질때 source map을 사용하지 않게 세팅을 하셨다.(source map파일은 있는게 더 좋은데 왜 그런지 모르겠다)나는 intelli

2023년 2월 17일
·
0개의 댓글
·

3d 용어

폴리곤이 실제로 화면에 그려지는 크기에 맞추어 텍스처를 교체하는 기법. 다른 해상도의 텍스처를 공통된 uv좌표로 다룰 수 있게 하려고 실제 텍스처 이미지 크기를 따르지 않고 좌표로 지정한다.

2023년 2월 1일
·
0개의 댓글
·

벡터의 내적과 외적의 응용

벡터의 내적을 이용해서 두 벡터 사이의 각도를 구할 수 있다. 각도가 90도일때 내적이 0이 되므로 직교하는지 판정할 수 있고, $a{x}b{x}+a{y}b{y}+a{z}b{z}=0$ 이 되도록 성분을 조정해 특정 벡터 a에 직교하는 벡터를 만들 수도 있다.$a \\c

2023년 1월 28일
·
0개의 댓글
·

드 모르간의 법칙

전체의 부정은 개개의 부정으로 분해할 수 있다. 단, 그 때 조건 AND는 OR이 되고, OR은 AND가 된다조금만 생각하면 상식적으로 이해하기 쉽다. 하지만, 그냥 외워 버리면 생각하는 시간을 절약할 수 있다.

2023년 1월 22일
·
0개의 댓글
·

shift 연산자

시프트 연산자는 비트단위에서 연산이 이루어 진다.왼쪽 시프트 연산자는 곱하기를 한 효과가 있고, 오른쪽 시프트 연산자는 나누기를 한 효과가 있다.위 식에서 CHIPSIZE를 64라고 하면..이렇게 하는 이유는 십진수를 이진수로 변환해서 계산하고 다시 십진수르 표현하는

2023년 1월 20일
·
0개의 댓글
·

다중 스크롤

화면의 너비를 wv기준 이미지의 너비를 w표시 위치를 결정할 이미지의 너비를 w2기준이 되는 이미지의 위치를 x표시 위치를 결정할 이미지의 위치를 x2라고 하면x2 = (w2 - wv)/(w1 - wv)\*x1

2023년 1월 20일
·
0개의 댓글
·