repeater
-
Repeater-Count - Axure Deep Dive#12Prototype/Axure Deep Dive 2021. 5. 23. 14:27
Repeater-Count 리피터를 활용하다보면 행의 전체 갯수를 세리거나, 선택된 행의 갯수를 세려야 할 때가 있습니다. 이때, 기본 인터랙션을 활용하여, 손쉽게 구현이 가능합니다. 리피터에는 다음과 같이 함수를 걸어줍니다. 리피터의 값이 로드될때마다 선택된 데이터가 0이 되게 하려면 맨 아래와 같이 설정해주시면 됩니다. 두번째로 나라에 해당하는 클릭 시 토글을 적용해주고, 셀렉하거나, 언셀렉할때 해당 값이 +1 또는 -1 되게 설정해줍니다. 이렇게 적용하면 다음과 같은 결과를 얻습니다. 프로토타이핑 주소 : https://tajy5v.axshare.com Untitled Document tajy5v.axshare.com
-
Using Repeater02 - Axure Deep Dive#10Prototype/Axure Deep Dive 2021. 5. 23. 14:22
Using repeater 리피터를 사용한 2번째 작업은 많은 웹사이트에서 이미지에 마우스가 진입하면 나타나는 효과를 리피터를 활용하여 작업을 진행하였습니다. 리피터를 활용하면 코딩의 중복을 막는 것 처럼, 여러 위젯에 똑같은 작업을 할 필요가 없다는 점이 큰 매력이라고 할 수 있습니다. 작업전, 해당 예시를 사용하고 있는 웹사이트를 3개정도 파악하였습니다. 1) 네이버 메인, 2) 클래스101 메인, 3) 구글 아트 & 컬쳐 해당 사이트의 이미지에 마우스를 가져다 보시면, 해당 이미지가 미세하게 확대되는 기능이 있습니다. 상당히 많은 사이트에서 사용하는 기능인 만큼 활용도가 높을것으로 생각합니다. 오늘은 간단한 작업이라, 인터랙션 부분이 간소화 되어있습니다! 1) 첫번째 리피터 자체 인터랙션 부분은 다..
-
Using Repeater - Axure Deep Dive#9Prototype/Axure Deep Dive 2021. 5. 23. 14:21
Using repeater 교육업계에서 많이 활용하고 있는 전체 메뉴 LNB를 엑슈어의 리피터 기능을 활용하여 작업을 진행했습니다. 리피터의 기능과 pagename 이라는 기능을 활용하여, 각 페이지 진입 시 해당 버튼이 활성화 되게 만들었습니다. 리피터의 기능이 없다면, 지금과 같이 페이지가 많아 지는 경우, 각 페이지 로드시마다, 해당 위젯이 셀렉트되고, 나머지 위젯은 셀렉이 풀리게끔 작업을 진행해야 하는데, 엄청난 작업 공수가 진행됩니다. 예로, 보여드리면 1) 리피터를 사용하지 않는 경우 2) 리피터 활용시 이렇듯 엑슈어도, 많이 알면 알수록 더욱더 간결하고 효율적으로 작업을 진행할 수 있습니다. 함수에 대해 설명드리면, 리피터를 클릭한 후 아이템 로드 상태에서, 케이스를 나눠줍니다. 첫번째 케이..
-
Shopping Cart - Axure Deep Dive #3Prototype/Axure Deep Dive 2021. 5. 23. 14:18
Shopping Cart 엑슈어에서 가장 강력한 기능 중 하나인 리피터를 활용하여 쇼핑카트를 제작하였습니다. 리피터를 활용, 모달방식을 통해 보다 간편하게 구현할 수 있는 점이 장점입니다. 구현 방법이 궁금하신 분들은 댓글 또는 rp file 예제를 올려드렸으니 참고하시면 좋을 것 같습니다. 프로토타입: https://1ba0nk.axshare.com Untitled Document 1ba0nk.axshare.com rp file: