앞서 Axure 프로토타입의 장점을 설명할때 모든 디바이스의 화면을 설계할 수 있으며, 백오피스와 같은 복잡한 화면도 실제와 흡사하게 설계가 가능하다고 했습니다. 백문이 불여일견이라고 실제 현업에서는 어떻게 설계하고 있는지 작업 샘플을 첨부합니다. 대외비라 최소한으로 압축해 GIF 파일로 제작했습니다. Axure로 설계한 백오피스 화면

동국대 창업지원 강좌에서 Axure 개념을 설명하기 위해 유튜브(youtube.com) 메인과 상세 페이지를 제작해봤습니다. 이미 구현 된 사이트를 프로토타이핑 하는 작업이라 작업 난이도는 낮았구요. 아래 이미지처럼 Axure 프로토타이핑 작업을 통해 실제 모습과 흡사하게 화면을 설계 할 수 있습니다. 참고로 유튜브는 2006년 약 1.7조원에 구글에 인수되었습니다. 프로토타입을 미리볼 수 있는 URL과 작업 파일 첨부합니다. 프로토타입 URL : http://daoeyj.axshare.com/#c=2 유튜브 메인화면 유튜브 상세화면 강좌 2016년 Axure 강좌일정 및 공식 커리큘럼 안내 소개 IT 기획 연구소 운영자 소개

다섯번째 샘플. 반응형 웹 프로토타입을 구현해봤습니다. 최근에 오픈한 SK c&c 웹사이트를 프로토타입 형태로 작업했습니다. 웹 브라우저의 가로 사이즈(Width)를 확대 및 축소하면 브라우저 사이즈에 따라 웹사이트, 태블릿, 모바일 UI가 보여지고 좌측 메뉴의 모바일 화면, 태블릿 화면을 클릭하면 각 디바이스별 구동화면을 미리 볼 수 있습니다. SK c&c 사이트를 먼저 보시고 프로토타입을 보시면 좋을 것 같습니다. Axure 프로토타이핑 #5. 반응형 웹 샘플보기(클릭) 모바일에서 보시는 분은 여기를 클릭해주세요 (아이폰에 최적화되어 있습니다.) 기존에 구현 된 사이트를 본뜨는 작업이라 구현까지 약 반나절 정도 소요되었습니다. 사실, 서비스를 구상하는 기획 과정이 어렵지 화면은 누구나 금방 그려낼 수..

네번째 샘플. 워치 앱 프로토타입을 구현해봤습니다. 애플 워치 실제 해상도에 맞게 UI를 구성하고, 시계 기본 기능인 실시간 타임을 반영했습니다. 계산기가 작동되도록 구현했으며 더블터치 및 롱터치 액션을 적용해 다양한 터치 방식으로 앱을 이용할 수 있도록 설계했습니다. Axure 프로토타이핑 #4. 워치 앱과 계산기 샘플보기(클릭) 애플 워치는 처음 설계해봤는데 생각보다 잘 나온것 같습니다. 계산기 작업이 난이도가 있지만 나머지 액션은 간단히 작업할 수 있습니다. 샘플 #1 모바일 인터랙션 샘플 #2 백오피스 프레임 및 기본 게시판 샘플 #3 동적 그래프 샘플 #5 반응형 웹 강좌 2016년 Axure 강좌일정 및 공식 커리큘럼 안내 소개 IT 기획 연구소 운영자 소개

세번째 샘플. 동적 그래프 프로토타입을 구현해봤습니다. 그래프가 동적으로 로딩되고, 정렬 옵션을 이용해 오름차순/내림차순 정렬이 가능하며, 막대그래프 클릭 시 툴팁을 보여줍니다. Axure 프로토타이핑 #3. 동적 그래프 샘플보기(클릭) 동적 그래프 화면 구성은 쉽고 빠르게 할 수 있지만 동적인 효과를 넣기 위해 기본적인 개발지식이 필요합니다. 엑셀의 매크로와 같은 개념으로 생각하면 되구요. Axure 프로토타이핑에서는 최고 난이도 작업이라고 볼 수 있습니다. 이전에 만들었던 소스를 활용하여 구현까지 약 1시간 소요되었습니다. 샘플 #1 모바일 인터랙션 샘플 #2 백오피스 프레임 및 기본 게시판 샘플 #4 워치 앱과 계산기 샘플 #5 반응형 웹 강좌 2016년 Axure 강좌일정 및 공식 커리큘럼 안내 ..

지난 글에 이어 두번째 샘플. 백오피스 프로토타입을 구현해봤습니다. GNB메뉴와 Left메뉴의 이동과 게시판의 기본 기능인 리스트, 글 보기, 글 작성 화면을 구현했습니다. 리스트 화면에서는 정렬 옵션을 이용해 컬럼별 오름차순/내림차순 정렬이 가능합니다. Axure 프로토타이핑 #2. 백오피스 프레임 및 기본 게시판 샘플보기(클릭) 제작 시간은 약 2시간이 소요되었습니다. (맥에서 작업해서 일부 윈도우 브라우저에는 최적화가 안될 수 있습니다 ^^;;) 샘플 #1 모바일 인터랙션 샘플 #3 동적 그래프 샘플 #4 워치 앱과 계산기 샘플 #5 반응형 웹 강좌 2016년 Axure 강좌일정 및 공식 커리큘럼 안내 소개 IT 기획 연구소 운영자 소개