엑슈어
-
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) 리피터 활용시 이렇듯 엑슈어도, 많이 알면 알수록 더욱더 간결하고 효율적으로 작업을 진행할 수 있습니다. 함수에 대해 설명드리면, 리피터를 클릭한 후 아이템 로드 상태에서, 케이스를 나눠줍니다. 첫번째 케이..
-
Tab Slider - Axure Deep Dive #5Prototype/Axure Deep Dive 2021. 5. 23. 14:18
Tab Slider 효과적으로 이벤트를 노출시키기 위해서, 배너 상단에 조그만한 탭 슬라이더를 작업하게 되었습니다. 기존의 텍스트 문구만 있던것에 비해, 이벤트들이 효과적으로 눈에 더 잘띄고 GA로 확인결과 클릭율 및 이벤트 전환율이 높아지게 되었습니다. 해당 영역 기획을 하면서 놓친 부분 기록 상단의 영역 공부서점 주간 베스트 셀러부터 총 8개이 이벤트를 버튼을 통해서 노출시킬 수 있습니다. 현재 작업은 6개 이벤트가 있다고 가정한 상황이고, 첫 기획에서 놓친 부분이 있어서 기록하고자 합니다. 놓친 부분 > 버튼을 클릭 한 후에 6번째의 이벤트 탭을 클릭 하여 화면이 이동해도 탭스라이드 영역은 이동된 화면에서도 5번째 위치에 정확히 있어야 합니다. 이와 비슷한 기획 고민을 하시는 분들께 도움..
-
토스#2Prototype/BenchMarking 2020. 12. 25. 16:43
토스 앱 서비스의 주요 기능들을 하나씩 엑슈어로 벤치마킹을 하여, 엑슈어의 기능성에 대해 공유하고자 합니다. 두번째로 토스 앱의 첫 화면하단에 있는 홈 편집 금액 숨기기 기능을 살펴보고자 합니다. 구현해야할 기능 list - 홈 편집 금액 숨기기 기능 클릭 시, 생체 정보 인증 팝업 생성 - 각 list 별 드래그 & 드롭 기능 - 드래그 & 드롭 완료 시 하단 바텀 enable - 저장 버튼 클릭 시 위치 값 저장 후 메인 위치 값 변경 - 저장 버튼 클릭 시 로딩 바 구현 * 프로토타입 특성상 첫번째 List 만 구현한 점 참고 바랍니다. * 위치가 변동된 후 다시 편집 진행 시 변경된 위치로 가는 것은 구현하지 않았습니다. 프로토 타이핑 주소 : sf6l5u.axshare.com