어안 렌즈 확대Fisheye Lens

Fisheye Lens

어안 렌즈 확대

다른 이름Also known as · Fisheye chart lens · 차트 어안 렌즈

308

렌더 추가 예정CLIP COMING어안 렌즈 확대Fisheye Lens정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 308. 어안 렌즈 확대 · Fisheye Lens · power1.inOut

초점 주변의 점과 눈금 간격이 벌어지고 주변부는 압축되며 전체 범위는 화면에 남는다.Expand marks and tick spacing near a focus while compressing nearby context within the same extent.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

전체 맥락을 유지하면서 밀집한 구간의 세부를 읽게 한다.Reveals dense detail while retaining the overall context.

언제 쓰나Use whenUSE WHEN

밀집한 점의 세부를 읽힐 때
전체 범위를 유지하며 한 구간을 설명할 때

Inspect details in a dense cluster of marks.
Explain one region while retaining the full extent.

과용 주의AvoidAVOID

왜곡 중 거리로 수치를 비교하지 않는다.

분류TagsTAGS

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

초점 반경 120px 안의 점과 눈금을 함께 벌려 원래 범위를 유지한다.

과용 · 나쁜 사례OVERUSE

점만 벌리고 눈금은 그대로 두어 값 해석이 틀어진다.

파라미터Parameters

기본값은 클립에 쓴 값Defaults are the values used in the clip

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
지속	800ms	500~1200ms	마크와 눈금 동기화
반경	120px	80~180px	초점 영향 범위
왜곡 강도	2	1~3	초점 가까이 확대
이징	power1.inOut	power1.inOut~power2.inOut	부드러운 좌표 전환

GSAP

const tl = gsap.timeline({paused:true}), s = {p:0};
const focus = 960, radius = 120, strength = 2;
const lens = x=>{const d=x-focus,a=Math.abs(d); return a>=radius?x:focus+Math.sign(d)*radius*(strength+1)*a/(strength*a+radius);};
tl.to(s, {p:1, duration:0.8, ease:'power1.inOut', onUpdate:()=>{
  marksAndTicks.forEach(m=>m.el.setAttribute('transform',`translate(${m.x+s.p*(lens(m.x)-m.x)} ${m.y})`));
}});

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<파일>의 <대상>에 어안 렌즈 확대를 적용해. SVG에서 초점 거리별 비선형 좌표 변환을 원래 좌표와 혼합해 마크와 눈금을 함께 이동한다. 지속 800ms; 반경 120px; 왜곡 강도 2; 이징 power1.inOut. 이징은 power1.inOut로 하고 GSAP 코어 paused 타임라인으로 역방향 seek도 같은 상태를 만들게 해.

Apply Fisheye Lens to <target> in <file>. Blend original SVG coordinates with a bounded fisheye mapping over 800ms, using a 120px radius and strength 2; transform marks and ticks together. Use power1.inOut and a paused GSAP core timeline that produces identical states when seeking backward.

Codex

<파일>의 대상 장면에 어안 렌즈 확대를 적용해. SVG에서 초점 거리별 비선형 좌표 변환을 원래 좌표와 혼합해 마크와 눈금을 함께 이동한다. 지속 800ms; 반경 120px; 왜곡 강도 2; 이징 power1.inOut. 이징은 power1.inOut를 사용해. 0초·0.4초·0.8초 시점을 캡처하고 시작 상태, 중간 변화, 끝 상태가 정의와 일치하는지 확인해. 같은 시점을 역방향 seek해서도 같은 화면인지 검증해.

Apply Fisheye Lens to the target scene in <file>. Blend original SVG coordinates with a bounded fisheye mapping over 800ms, using a 120px radius and strength 2; transform marks and ticks together. Use power1.inOut. Capture at 0, 0.4, and 0.8 seconds to verify the initial state, the defining intermediate change, and the final state. Seek backward to the same times and compare the images.