-
국내도서
-
전공도서/대학교재
-
공학계열
-
컴퓨터공학
모바일 앱 프로토타이핑 : Framer를 활용한 인터랙션 디자인
2013년 9월 9일 이후 누적수치입니다.
| 정가 |
22,000원 |
|---|
-
19,800원 (10%할인)
1,100P (5%적립)
| 할인혜택 | |
|---|---|
| 적립혜택 |
|
|
|
| 추가혜택 |
|
-
이벤트/기획전
-
연관도서(4)
-
상품권
책소개
디자이너가 머릿속에서 완성한 인터랙션을 개발자에게 정확하게 전달하기는 생각보다 쉽지 않다. 자신이 생각한 디자인을 완벽하게 구현할 수 있는 사람은 디자이너 본인뿐이다. 디자이너가 움직이는 프로토타입을 직접 만들 수 있다면 완제품과 디자인 사이의 괴리를 스스로 줄여 나갈 수 있다.
이 책은 실제 네이버 앱에 적용된 다양한 인터랙션을 대표적인 프로토타이핑 도구인 Framer를 이용해 만드는 방법을 설명한다. 이 책의 예제를 하나씩 따라 하다 보면 어느새 새로운 인터랙션 디자인의 세계에 눈뜨게 될 것이다.
출판사 서평
이 책에서는 다음과 같은 내용을 다룬다.
◎ 프로토타이핑은 무엇이며 왜 필요한지 설명하고, 다양한 프로토타이핑 도구 중에서 Framer를 선정한 이유를 소개한다.
◎ Framer를 사용할 때 필요한 커피스크립트의 기초 개념을 소개한다.
◎ 네이버 앱에 적용된 다양한 인터랙션을 만들어 본다.
ㆍ 이벤트와 애니메이션을 이용한 인터랙션 만들기
ㆍ 사이드 메뉴가 있는 인터페이스 만들기
ㆍ 퀵 메뉴 만들기
ㆍ 브라우저 스크롤 인터랙션 만들기
ㆍ 좌우 페이지 인터랙션 만들기
ㆍ 스크롤하면 크기가 변하는 헤더 만들기
ㆍ 스티키 헤더 인터랙션 만들기
ㆍ 슬라이더로 미디어 플레이어 조정하기
[추천사]
"This book gives you an insight into how NAVER uses Framer in their product design cycle. It's a great read for product designers looking to expand their skillset. Learn how to bring your ideas to life."
"이 책은 네이버에서 제품을 디자인할 때 Framer를 어떻게 활용하는지 심도 있게 다룬다. 제품 디자이너로서 자신의 스킬을 넓히고 싶다면 좋은 자료가 될 것이다. 머릿속 아이디어를 실제로 구현하는 방법을 배워보자."
- Benjamin den Boer, Framer Product Designer
목차
▣ 1장: 왜 프로토타이핑인가
프로토타이핑이란
- 인터페이스, UX 디자인에서의 프로토타이핑
- 하이피델리티 프로토타이핑
하이피델리티 프로토타이핑 도구의 등장
- 인터페이스 디자인 도구의 혁신
- 나에게 맞는 프로토타이핑 도구 선택하기
Framer를 이용한 프로토타이핑
- 왜 Framer인가
- 디자이너가 Framer를 배워야 하는가
- 네이버에서는 Framer를 어떻게 활용하는가
▣ 2장: 프로토타이핑 시작하기
프로토타이핑 도구 준비
커피스크립트 이해하기
- 코드 기본 문법
- 오류 찾기
- 변수
- 조건문
- 배열과 반복문
- 함수
- 객체
- 유효범위
이미지 리소스 준비하기
- 디자인 파일 불러오기
- 불러온 레이어에 이름 붙이기
- 뷰어 설정하기
- 기기/브라우저로 확인하기
레이어 개념 이해하기
- Framer의 레이어 개념 이해
- 속성
- 위치와 크기
- 계층 관계
정리
▣ 3장: 이벤트와 애니메이션을 이용한 인터랙션 만들기
애니메이션
이벤트
머티리얼 디자인 인터랙션 만들기
플로팅 액션 버튼 인터랙션 만들기
애니메이션 저장하기
정리
▣ 4장: 사이드 메뉴가 있는 인터페이스 만들기
상태
- 상태 추가
- 상태 전환
- 상태 삭제 및 덮어쓰기
좌우 사이드 메뉴가 있는 네이버 앱 구조 만들기
정리
▣ 5장: 퀵 메뉴 만들기
드래그
- 제한 범위
- 오버드래그, 바운스, 모멘텀
- 드래그 이벤트
- 드래그 애니메이션
네이버 앱 퀵 메뉴 만들기
편집 모드의 순서 편집 기능 만들기
정리
▣ 6장: 브라우저 스크롤 인터랙션 만들기
스크롤
- 스크롤 컴포넌트
- 콘텐츠인셋
- 래핑
- 스크롤 이벤트
- 스크롤 애니메이션 이벤트
스크롤해서 바 숨기기 인터랙션 만들기
스크롤해서 내비게이션 디자인 바꾸기
정리
▣ 7장: 좌우 페이지 인터랙션 만들기
페이지
- 페이지 컴포넌트
- 페이지 추가하기
- 래핑
- 포커스와 페이지 순서
- 페이지 인디케이터
네이버 앱 페이지 구조 만들기
워크스루 만들기
정리
▣ 8장: 스크롤하면 크기가 변하는 헤더 만들기
모듈레이트
스크롤 위치에 따라 요소가 변하는 헤더 만들기
정리
▣ 9장: 스티키 헤더 인터랙션 만들기
체인지 이벤트
스티키 헤더 만들기
정리
▣ 10장: 슬라이더로 미디어 플레이어 조정하기
슬라이더 컴포넌트
비디오 플레이어 만들기
정리
▣ 11장: 스틸컷 디자인에서 인터랙션까지
네이버 앱 콘셉트 디자인
네이버 앱 콘셉트 프로토타입 만들기
▣ 12장: 마치며
관련이미지
저자소개
| 생년월일 | - |
|---|
김정민은 네이버와 SK커뮤니케이션즈에서 여러 디지털 제품을 만들었다. 2017년 현재 네이버 앱 프로덕트 디자이너로 일하고 있다. 디지털 제품, 인터랙티브 디자인과 관련된 커뮤니티에서 종종 활동한다.
| 생년월일 | - |
|---|
오경식은 2008년부터 네이버에서 여러 가지 웹 서비스를 만들었다. 2017년 현재 네이버 PC/모바일 메인 개발자로 일하고 있으며 프로토타이핑을 비롯한 새로운 기술에 관심이 많다.
| 생년월일 | - |
|---|
해당작가에 대한 소개가 없습니다.
주간랭킹
더보기상품정보제공고시
이벤트 기획전
판매자정보
상호 |
(주)교보문고 |
|---|---|
대표자명 |
안병현 |
사업자등록번호 |
102-81-11670 |
연락처 |
1544-1900 |
전자우편주소 |
callcenter@kyobobook.co.kr |
통신판매업신고번호 |
01-0653 |
영업소재지 |
서울특별시 종로구 종로 1(종로1가,교보빌딩) |
교환/환불
반품/교환 방법 |
‘마이페이지 > 취소/반품/교환/환불’ 에서 신청 또는 1:1 문의 게시판 및 고객센터(1577-2555)에서 신청 가능 |
|---|---|
반품/교환가능 기간 |
변심 반품의 경우 출고완료 후 6일(영업일 기준) 이내까지만 가능 |
반품/교환 비용 |
변심 혹은 구매착오로 인한 반품/교환은 반송료 고객 부담 |
반품/교환 불가 사유 |
·소비자의 책임 있는 사유로 상품 등이 손실 또는 훼손된 경우 ·소비자의 사용, 포장 개봉에 의해 상품 등의 가치가 현저히 감소한 경우 ·복제가 가능한 상품 등의 포장을 훼손한 경우 ·시간의 경과에 의해 재판매가 곤란한 정도로 가치가 현저히 감소한 경우 ·전자상거래 등에서의 소비자보호에 관한 법률이 정하는 소비자 청약철회 제한 내용에 해당되는 경우 |
상품 품절 |
공급사(출판사) 재고 사정에 의해 품절/지연될 수 있음 |
소비자 피해보상 |
·상품의 불량에 의한 교환, A/S, 환불, 품질보증 및 피해보상 등에 관한 사항은 소비자분쟁해결 기준 (공정거래위원회 고시)에 준하여 처리됨 ·대금 환불 및 환불지연에 따른 배상금 지급 조건, 절차 등은 전자상거래 등에서의 소비자 보호에 관한 법률에 따라 처리함 |
(주)KG이니시스 구매안전서비스
(주)인터파크커머스는 회원님들의 안전거래를 위해 구매금액, 결제수단에 상관없이 (주)인터파크커머스를 통한 모든 거래에 대하여
(주)KG이니시스가 제공하는 구매안전서비스를 적용하고 있습니다.
배송안내
교보문고 상품은 택배로 배송되며, 출고완료 1~2일내 상품을 받아 보실 수 있습니다.
출고가능 시간이 서로 다른 상품을 함께 주문할 경우 출고가능 시간이 가장 긴 상품을 기준으로 배송됩니다.
군부대, 교도소 등 특정기관은 우체국 택배만 배송가능합니다.
배송비는 업체 배송비 정책에 따릅니다.
- 도서 구매 시 15,000원 이상 무료배송, 15,000원 미만 2,500원
- 상품별 배송비가 있는 경우, 상품별 배송비 정책 적용