inflearn logo
강의

講義

知識共有

Figmaを始める

화면전화효과 질문드려요

81

gangsugi

投稿した質問数 71

0

스트링베리어블로 이미지전환 인터렉션 만들기에서 다음버튼 처럼 이전버튼 만들려고 하면 이전버튼에 인터렉션을 동일하게 주면 되는건지요?

이미지3 -> 이미지2-> 이미지1

음....그렇게 했을때는 안되어서요

 

20251023_161825.jpg

 

웹-디자인 모바일-디자인 figma ui ux

回答 2

0

lucymygirl

안녕하세요 gangsugi님
이전 버튼도 마찬가지로 set variable 로 인터랙션 설정합니다.

혹시 잘 안되시면 파일을 lucymygirl@naver.com으로 공유해주시면 파일을 살펴본 후에 답변드리겠습니다.

감사합니다.

루씨드림

1

gangsugi

이전 버튼도 마찬가지로 set variable 로 인터랙션 설정하고, 순서를 3->2->

이렇게 설정을 했는데 전혀 움직이는 않습니다. 위에 그림 첨부한것처럼 설정하는게 맞는지요?

0

lucymygirl

네 인터랙션 설정은 맞게 되었습니다.

베리어블 만들고 적용한 부분 다시 네이밍 체크해주세요.

그래도 안되시면 파일을 lucymygirl@naver.com으로 공유해주시면 파일을 살펴본 후에 답변드리겠습니다.

감사합니다.

루씨드림

0

gangsugi

아래 질문까지 메일로 보냈습니다.

0

communityai8509

안녕하세요, 인프런 AI 인턴입니다. 강수기님, 질문 주셔서 감사합니다.

스트링 변수로 이미지 전환 인터랙션을 만들 때 이전 이미지로 돌아가는 기능을 구현하려면, 다음 버튼에 설정한 것과 유사한 방식으로 이전 버튼에도 인터랙션을 적용하시면 됩니다. 하지만, 이전 버튼의 경우에는 이미지를 ‘뒤로’ 이동해야 하기 때문에 변수 또는 동작이 역방향으로 이루어질 수 있도록 설정해야 합니다.

  1. 변수 설정 확인하기: 이미지가 바뀔 때 어떤 방식으로 변수(예: photo1, photo2, photo3)가 변경되는지를 점검하세요. 각 버튼 클릭 시 어떤 변수에 어떤 값이 할당되는지 확인하는 것이 중요합니다.

  2. 이전 버튼 동작 설정하기: 다음 버튼이 각 클릭에서 photo1 -> photo2 -> photo3으로 변경되었다면, 이전 버튼은 photo3 -> photo2 -> photo1로 돌아가도록 설정해야 합니다. 이를 위해 각 버튼에 할당된 변수 변화와 행동을 검사하고, 이전 버튼 클릭 시 그 반대 순서로 진행되도록 설정합니다.

  3. 사진 인덱스 조정하기: 만약 이미지 리스트를 인덱스로 관리하고 있다면, 현재 이미지 인덱스를 감소시키는 로직을 추가해야 합니다.

이미지 전환과 관련된 인터랙션 구현은 피그마에서 자주 사용되는 기능입니다. 위의 방법대로 하셨는데도 잘 되지 않는다면, 설정 내역을 재확인하시는 것도 좋은 방법입니다.

이와 비슷한 피그마 이미지 전환 구현 사례나 질문이 기존에 있을 가능성이 있습니다. 검색을 통해 확인하거나, 관련된 예제들을 찾아보시면 도움이 될 수 있습니다.

관련 질문이나 가이드를 찾기 어려우시면, 다음 링크를 참조해보세요:
- 피그마 인터랙션에서 이미지 전환 구현하기

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

HTML2Design 플러그인 시, 클로드에서 코딩해서 만든 UI 예시 이미지 가져오기 오류

0

6

0

Json 플러그인 사용시 variable collection 없음

0

14

1

배리어블 목록 없음

0

22

3

Token 등록 방법 문의

0

20

1

인스턴스스왑

0

17

2

borderTransparent를 라이트/다크모드에 이중등록

0

24

1

해결되었습니다.

0

20

1

채팅 UI 추가 속성 설정 질문

0

24

1

배리어블 Value에 관해 질문있습니다.

0

35

0

Body>font weight 에서 semibold에 짝대기가 생기는 이유?

0

39

1

실습파일

0

25

2

6번강의 샘플예제

0

56

2

각 강의별 샘플

0

74

1

화면확대 인터렉션 질문이요

1

81

2

30번 강의질문

0

60

2

지금 강의하실 때 사용하시는 피그마 예제??

0

91

1

prototype-overflow 탭 문의

0

156

2

피그마 활용 클래스 > 4 컴포넌트 boolean

0

833

1

그룹에 대한 질문입니다

0

123

2

6- 디자인시스템 구축을 위한 스타일 만들기 > 그레이 선정

0

261

2

6-디자인시스템 구축을 위한 스타일 만들기 > 그레이 뒷 숫자의미

0

178

2

공유 주신 피그마 url 404에러 뜹니다

0

192

1

7-상품확대 인터랙션 만들기 에서 이미지 배치 질문입니다.

0

183

2

태그부분이 아래로 안떨어집니다

0

205

2