-
Using Repeater02 - Axure Deep Dive#10Prototype/Axure Deep Dive 2021. 5. 23. 14:22
Using repeater
리피터를 사용한 2번째 작업은 많은 웹사이트에서 이미지에 마우스가 진입하면 나타나는 효과를 리피터를 활용하여 작업을 진행하였습니다. 리피터를 활용하면 코딩의 중복을 막는 것 처럼, 여러 위젯에 똑같은 작업을 할 필요가 없다는 점이 큰 매력이라고 할 수 있습니다.
작업전, 해당 예시를 사용하고 있는 웹사이트를 3개정도 파악하였습니다.
1) 네이버 메인, 2) 클래스101 메인, 3) 구글 아트 & 컬쳐
해당 사이트의 이미지에 마우스를 가져다 보시면, 해당 이미지가 미세하게 확대되는 기능이 있습니다.
상당히 많은 사이트에서 사용하는 기능인 만큼 활용도가 높을것으로 생각합니다.
오늘은 간단한 작업이라, 인터랙션 부분이 간소화 되어있습니다!
1) 첫번째 리피터 자체 인터랙션 부분은 다음과 같이 진행해주시면 됩니다.
1) 두번째 리피터 안의 위젯은 다음과 같습니다.
해당 작업 진행시 다음과 같은 결과를 얻습니다.
구글 아트 앤 컬쳐 작업물 프로토타이핑 주소 : https://f772d9.axshare.com
Untitled Document
f772d9.axshare.com
파일 :
728x90'Prototype > Axure Deep Dive' 카테고리의 다른 글
Repeater-Count - Axure Deep Dive#12 (0) 2021.05.23 Rolling Banner(Auto & Click) - Axure Deep Dive#11 (0) 2021.05.23 Using Repeater - Axure Deep Dive#9 (0) 2021.05.23 Password Validation - Axure Deep Dive#8 (0) 2021.05.23 Cupang comment input form - Axure Deep Dive #7 (0) 2021.05.23