본문내용 바로가기
MD의선택 무료배송 이벤트 사은품 소득공제

사용자를 끌어들이는 UX/UI의 비밀 MAU는 높이고 이탈률은 낮추는 UX/UI 실무 패턴 80

UX insight
제니퍼 티드웰 , 찰스 브루어 , 아인 발렌시아 지음 | 박재현 옮김 | 한상택 감수 | 인사이트 | 2021년 05월 18일 출간
클로버 리뷰쓰기

이 책의 다른 상품 정보

  • 정가 : 33,000원
    판매가 : 29,700 [10%↓ 3,300원 할인]
  • 혜택 :
    [기본적립] 1650원 적립 [5% 적립] [추가적립] 5만원 이상 구매 시 2,000원 추가적립 안내 [회원혜택] 회원 등급 별, 3만원 이상 구매 시 2~4% 추가적립 안내 [리뷰적립] 리뷰 작성 시 e교환권 최대 300원 추가적립 안내
  • 추가혜택 : 포인트 안내 도서소득공제 안내 추가혜택 더보기
  • 배송비 : 무료 배송비 안내
  • 배송일정 : 서울특별시 종로구 세종대로 기준 지역변경
    당일배송 지금 주문하면 오늘(22일,금) 도착 예정 배송일정 안내
  • 바로드림 : 인터넷으로 주문하고 매장에서 직접 수령 안내 바로드림 혜택
    휴일에는 바로드림 픽업으로 더 빨리 받아 보세요. 바로드림 혜택받고 이용하기

이 책의 이벤트

해외주문/바로드림/제휴사주문/업체배송건의 경우 1+1 증정상품이 발송되지 않습니다.
  • 2022 캘린더 수록한 IT독자를 위한 readIT 노트 사은품
    2021.10.14 ~ 2021.11.30
  • 컴퓨터/IT분야 2만원 이상 구매 시 개발자 매거진 선택 가능
    2021.09.03 ~ 2021.10.22
  • 책을 통해 성장해나가는 개발자를 응원합니다.
    2017.06.22 ~ 2025.07.31
상품상세정보
ISBN 9788966262991(8966262996)
쪽수 580쪽
크기 173 * 225 * 29 mm /1222g 판형알림
이 책의 원서/번역서 Designing Interfaces: Patterns for Effective Interaction Design / Brewer, Charles

책소개

이 책이 속한 분야

이 책의 주제어

좋은 인터페이스는 유저의 삶을 더 쉽게 만들어야 한다
매력적인 인터페이스는 말이 잘 통하는 친구와 나누는 대화처럼 기분 좋은 경험을 불러오지만, 페인 포인트가 넘쳐 나는 서비스는 사용자에게 짜증과 좌절감을 안겨 준다. 로딩이 느린 화면, 어디로 가라는 건지 도무지 알 수 없는 내비게이션, 번거롭게 자꾸 열리는 모달 박스로 사용자 이탈률을 높이고 있지는 않은가? 《사용자를 끌어들이는 UX/UI의 비밀》에서 알려 주는 80가지 UX/UI 실무 패턴으로 사용자를 고민하게 하지 않는 인터페이스를 만들어 보자!

상세이미지

사용자를 끌어들이는 UX/UI의 비밀(UX insight) 도서 상세이미지

목차

제3판 서문: 인터페이스는 삶을 더 쉽게 만들어야 한다

1장 문제를 정확히 파악하고 제대로 해결하는 디자인

사용자를 둘러싼 컨텍스트 파악하기
_당신은 사용자가 아니다
_인터랙션은 대화처럼
_콘텐츠와 기능을 사용자에게 맞춰라
_숙련도에 따라 달라지는 것들
_인터페이스는 목표를 달성하는 수단일 뿐
_‘왜?’라고 묻고 또 묻기
_문제를 정확히 파악하고 제대로 해결하기
사용자를 있는 그대로 이해하는 법
_직접 관찰
_케이스 스터디
_설문조사
_퍼소나(personas)
_디자인 리서치는 마케팅 리서치가 아니다
인터페이스에서 사람들은 무슨 생각을 하고 어떻게 행동할까?
_안전한 탐색(Safe Exploration)
_즉각적 만족(Instant gratification)
_만족화(Satisficing)
_중도에 바꾸기(Changes in Midstream)
_선택 미루기(Deferred Choices)
_점진적 창조(Incremental Construction)
_습관화(Habituation)
_짬시간 활용(Microbreaks)
_공간 기억(Spatial Memory)
_미래 계획 기억(Prospective Memory)
_능률적 반복(Streamlined Repetition)
_키보드만 사용하기(Keyboard Only)
_소셜 미디어(Social Media), 소셜 프루프(Social Proof), 협업(Collaboration)
성공적인 인터랙션 디자인을 위한 필수 요소

2장 콘텐츠 구성하기: 정보 설계와 애플리케이션 구조

사용에 방해되지 않는 정보 구조 만들기
정보 구조란?
_사용자를 위한 정보 공간
접근법
_정보와 정보의 표현을 분리하라
상호 배타적이면서 전체를 포괄하기
콘텐츠를 구성하고 분류하는 방법
_위치(Location)
_가나다순(Alphabetical)
_시간(Time)
_카테고리(Category) 또는 다면 필터(Facet)
_위계(Hierarchy)
_숫자(Number)
태스크와 작업흐름 위주의 앱 디자인하기
_자주 사용하는 항목을 눈에 띄게 하라
_일련의 단계로 작업 ‘쪼개기’
_다양한 채널과 화면 크기는 우리가 직면해야 하는 현실
_정보를 카드 형태로 보여 줘라
화면 유형의 시스템 디자인
개요 보기: 목록이나 그리드 위에서 항목과 옵션 보여 주기
집중하기: 한 번에 하나만 표시하기
만들기: 창작을 위한 툴 제공하기
수행하기: 하나의 태스크를 효과적으로 완료하기
패턴
_01 추천(Feature), 검색(Search), 탐색(Browse)
_02 모바일 다이렉트 액세스(Mobile Direct Access)
_03 스트림(Streams)과 피드(Feeds)
_04 미디어 브라우저(Media Browser)
_05 대시보드(Dashboard)
_06 캔버스(Canvas)와 팔레트(Palette)
_07 마법사(Wizard)
_08 설정 편집기(Settings Editor)
_09 다양한 보기 모드(Alternative Views)
_10 작업 공간 나누기(Many Workspaces)
_11 도움말 시스템(Help Systems)
_12 태그(Tags)
유연하면서도 단단한 정보 구조를 만들자

3장 이동하기: 표지판, 길 찾기, 내비게이션

정보와 태스크 공간 이해하기
표지판
길 찾기
내비게이션
_글로벌 내비게이션(Global Navigation)
_유틸리티 내비게이션(Utility Navigation)
_연관 및 인라인 내비게이션(Associative and Inline Navigation)
_관련 콘텐츠(Related Content)
_태그(Tags)
_소셜(Social)
디자인할 때 고려할 점
_내비게이션 디자인과 시각적 표현 분리하기
_인지 부담
_이동 거리 최소화하기
내비게이션 모델
_허브 앤 스포크(Hub and Spoke)
_완전히 연결된(Fully Connected) 모델
_멀티레벨(Multilevel) 또는 트리(Tree)
_단계별 모델
_피라미드 모델
_넓고 얕은 내비게이션
패턴
_13 명확한 진입점(Clear Entry Points)
_14 메뉴 페이지(Menu Page)
_15 피라미드(Pyramid)
_16 모달 패널(Modal Panel)
_17 딥링크(Deep Link)
_18 탈출구(Escape Hatch)
_19 메가 메뉴(Fat Menu)
_20 사이트맵 푸터(Sitemap Footer)
_21 로그인 툴(Sign-In Tools)
_22 프로그레스 인디케이터(Progress Indicator)
_23 브레드크럼(Breadcrumbs)
_24 주석이 붙은 스크롤바(Annotated Scroll Bar)
_25 전환 애니메이션(Animated Transition)
변함없는 가치를 전달하는 내비게이션

4장 화면 구성 요소의 레이아웃

레이아웃의 기본
_시각적 계층 구조(Visual Hierarchy)
_시각적 계층 구조 적용하기
_물체의 중요도 가늠하기
_게슈탈트 법칙 4가지
_시선의 흐름(Visual Flow)
_동적인 디스플레이 사용하기
_반응형 활성화
_단계적 정보 공개
_사용자 인터페이스 영역
패턴
_레이아웃
_정보 분리하기
_26 시각적 프레임워크(Visual Framework)
_27 센터 스테이지(Center Stage)
_28 균등한 그리드(Grid of Equals)
_29 제목을 붙인 섹션(Titled Sections)
_30 모듈 탭(Module Tabs)
_31 아코디언(Accordion)
_32 접히는 패널(Collapsible Panels)
_33 이동식 패널(Movable Panels)

5장 비주얼 스타일과 아름다움

비주얼 디자인의 기초
_시각적 계층 구조
_구성
_색상
_타이포그래피
_가독성
_감정 불러일으키기
_이미지
기업용 애플리케이션을 위한 시각 디자인
_접근성
다양한 비주얼 스타일
_스큐어모픽(Skeuomorphic)
_일러스트
_플랫 디자인(Flat Design)
_미니멀리즘
_적응형/매개변수형 디자인
아름다움이 가진 힘을 과소평가하지 말라

6장 모바일 인터페이스

모바일 디자인의 어려움과 기회 영역
_작은 화면 크기
_다양한 화면 너비
_터치 스크린
_문자 입력하기
_물리적 환경의 제약
_위치 인식
_사회적 영향과 집중력의 한계
모바일 디자인에 접근하는 방법
_모바일 사용자에게 무엇이 필요할까?
_웹/앱을 본질에 맞게 발라내기
_모바일 기기의 하드웨어 활용하기
_콘텐츠를 선형으로 배치하기
_가장 일반적인 인터랙션 시퀀스 최적화
_소개할 만한 좋은 사례들
패턴
_34 버티컬 스택(Vertical Stack)
_35 필름스트립(Filmstrip)
_36 터치 툴(Touch Tools)
_37 하단 내비게이션(Bottom Navigation)
_38 컬렉션(Collections)과 카드(Cards)
_39 무한 리스트(Infinite List)
_40 넉넉한 터치 영역(Generous Borders)
_41 로딩(Loading) 또는 프로그레스 인디케이터(Progress Indicators)
_42 유기적인 앱 연동(Richly Connected Apps)
모바일화하기

7장 목록 만들기

목록의 유스케이스
정보 구조 떠올려 보기
무엇을 보여 줄 것인가?
_선택된 항목 세부사항 표시하기
_무거운 시각 요소 보여 주기
_아주 긴 목록 관리하기
_카테고리나 계층으로 정리된 목록 표시하기
패턴
_43 2분할 패널(Two-Panel Selector) 또는 분할 화면(Split View)
_44 단일 화면 상세 진입(One-Window Drilldown)
_45 포괄 목록(List Inlay)
_46 카드(Cards)
_47 섬네일 그리드(Thumbnail Grid)
_48 캐러셀(Carousel)
_49 페이지네이션(Pagination)
_50 항목으로 즉시 이동하기(Jump to Item)
_51 문자/숫자 스크롤바(Alpha/Numeric Scroller)
_52 신규 항목 추가 행(New-Item Row)
수많은 목록들

8장 작업하기: 동작과 명령

탭(Tap), 스와이프(Swipe), 핀치(Pinch)
회전(Rotate)과 흔들기(Shake)
버튼(Buttons)
메뉴바(Menu Bars)
팝업 메뉴(Pop-Up Menus)
드롭다운 메뉴(Drop-Down Menus)
툴바(Tool bars)
링크(Links)
조작 패널(Action Panels)
호버 툴(Hover Tools)
한 번 클릭하기 vs. 더블 클릭하기
키보드 조작(Keyboard Actions)
_단축키 370
_탭 이동(Tab Order) 370
드래그 앤 드롭(Drag-and-Drop)
텍스트 명령(Typed Commands)
어포던스(Affordance)
객체 직접 조작(Direct Manipulation of Objects)
패턴
_53 버튼 그룹(Button Groups)
_54 호버(Hover) 또는 팝업 툴(Pop-Up Tools)
_55 조작 패널(Action Panel)
_56 완료 버튼 강조(Prominent Done Button)
_57 지능형 메뉴 항목(Smart Menu Items)
_58 미리 보기(Preview)
_59 스피너(Spinner)와 로딩 인디케이터(Loading Indicator)
_60 취소 가능성(Cancelability)
_61 다단계 실행 취소(Multilevel Undo)
_62 명령 기록(Command History)
_63 매크로(Macros)
가장 중요한 동작이 제일 잘 보이게

9장 복잡한 데이터 보여 주기

인포그래픽의 기초
_데이터를 구성하는 조직 모델
_전주의적(preattentive) 변수의 힘
_데이터 탐험하기
_데이터 재배열하기
_검색과 필터링으로 필요한 데이터만 보기
_특정 데이터값이 궁금할 때
패턴
_64 데이터팁(Datatip)
_65 데이터 스포트라이트(Data Spotlight)
_66 동적 쿼리(Dynamic Queries)
_67 데이터 브러싱(Data Brushing)
_68 다중 Y축 그래프(Multi-Y Graph)
_69 스몰 멀티플즈(Small Multiples)
데이터 시각화의 힘

10장 사용자에게 입력값 받기: 폼과 컨트롤

폼 디자인의 기초
_폼 디자인은 계속 진화한다
_더 읽을거리
패턴
_70 자유도가 높은 폼(Forgiving Format)
_71 구조화된 폼(Structured Format)
_72 빈칸 채우기(Fill-in-the-Blanks)
_73 입력 힌트(Input Hints)
_74 입력 프롬프트(Input Prompt)
_75 암호 보안 수준 표시(Password Strength Meter)
_76 자동 완성(Autocompletion)
_77 드롭다운 선택창(Drop-down Chooser)
_78 목록 편집창(List Builder)
_79 적절한 기본값(Good Defaults)과 지능형 사전 입력(Smart Prefills)
_80 오류 메시지(Error Messages)
하면 할수록 어려운 폼 디자인

11장 사용자 인터페이스 시스템과 아토믹 디자인

UI 시스템 트렌드
_마이크로소프트의 플루언트 디자인 시스템
확장 가능한 일관된 인터페이스 설계하기
_아토믹 디자인 개요
_아토믹 디자인 계층 구조
UI 프레임워크는 천장이 아니라 바닥이다
_개요
_장점
_UI 프레임워크의 대두
_대표적인 UI 프레임워크 살펴보기
왜 아토믹 디자인인가?

12장 화면의 이면 그리고 화면을 넘어서

스마트 시스템의 재료
_인터넷 연결 기기(Connected Devices)
_선행 시스템(Anticipatory Systems)
_보조 시스템(Assistive Systems)
_내추럴 사용자 인터페이스(Natural User Interfaces)
변하지 않는 패턴과 원칙

찾아보기

출판사 서평

15년간 사랑받은 UX 분야 아마존 스테디셀러
기본에 충실한 영감으로 가득한 믿을 만한 패턴 북
80가지 UX/UI 패턴! 400여 개 UI 스크린 샷!

《사용자를 끌어들이는 UX/UI의 비밀》은 SNS, 이미지/영상 편집, 길 찾기를 비롯한 다양한 앱에서부터 쇼핑, 예약, 금융 웹사이트까지, 웹과 모바일을 위한 화면 기반 인터랙션에 최적화된 UX/UI 패턴을 소개한다. 원활한 사용자 흐름을 만들고 이용자의 태스크 달성을 돕는 데 효과적인 패턴들을 400여 개의 실제 서비스 스크린 샷으로 일목요연하게 보여 준다. 버즈피드... 더보기

Klover 리뷰 (0)

북로그 리뷰 (0) 쓰러가기

북로그 리뷰는 본인 인증 후 작성 가능합니다.
책이나 타인에 대해 근거 없이 비방을 하거나 타인의 명예를 훼손할 수 있는 내용은 비공개 처리 될 수 있습니다.
※ 북로그 리뷰 리워드 제공 2021. 4. 1 종료

문장수집 (0) 문장수집 쓰기 나의 독서기록 보기
※구매 후 문장수집 작성 시, 리워드를 제공합니다. 안내

스토리K

1건의 스토리K가 있습니다.

    교환/반품/품절안내

    ※ 상품 설명에 반품/교환 관련한 안내가 있는 경우 그 내용을 우선으로 합니다. (업체 사정에 따라 달라질 수 있습니다.)

    교환/반품/품절안내
    반품/교환방법 마이룸 > 주문관리 > 주문/배송내역 > 주문조회 > 반품/교환신청 ,
    [1:1상담>반품/교환/환불] 또는 고객센터 (1544-1900)

    ※ 오픈마켓, 해외배송주문, 기프트 주문시 [1:1상담>반품/교환/환불]
        또는 고객센터 (1544-1900)
    반품/교환가능 기간 변심반품의 경우 수령 후 7일 이내,
    상품의 결함 및 계약내용과 다를 경우 문제점 발견 후 30일 이내
    반품/교환비용 변심 혹은 구매착오로 인한 반품/교환은 반송료 고객 부담
    반품/교환 불가 사유
    • 소비자의 책임 있는 사유로 상품 등이 손실 또는 훼손된 경우
      (단지 확인을 위한 포장 훼손은 제외)
    • 소비자의 사용, 포장 개봉에 의해 상품 등의 가치가 현저히 감소한 경우
      예) 화장품, 식품, 가전제품(악세서리 포함) 등
    • 복제가 가능한 상품 등의 포장을 훼손한 경우
      예) 음반/DVD/비디오, 소프트웨어, 만화책, 잡지, 영상 화보집
    • 소비자의 요청에 따라 개별적으로 주문 제작되는 상품의 경우 ((1)해외주문도서)
    • 디지털 컨텐츠인 eBook, 오디오북 등을 1회 이상 다운로드를 받았을 경우
    • 시간의 경과에 의해 재판매가 곤란한 정도로 가치가 현저히 감소한 경우
    • 전자상거래 등에서의 소비자보호에 관한 법률이 정하는 소비자 청약철회 제한 내용에
      해당되는 경우
    (1) 해외주문도서 : 이용자의 요청에 의한 개인주문상품으로 단순변심 및 착오로 인한 취소/교환/반품 시 ‘해외주문 반품/취소 수수료’ 고객 부담 (해외주문 반품/취소 수수료 : ①서양도서-판매정가의 12%, ②일본도서-판매정가의 7%를 적용)
    상품 품절 공급사(출판사) 재고 사정에 의해 품절/지연될 수 있으며, 품절 시 관련 사항에 대해서는
    이메일과 문자로 안내드리겠습니다.
    소비자 피해보상
    환불지연에 따른 배상
    • 상품의 불량에 의한 교환, A/S, 환불, 품질보증 및 피해보상 등에 관한 사항은
      소비자분쟁해결 기준 (공정거래위원회 고시)에 준하여 처리됨
    • 대금 환불 및 환불지연에 따른 배상금 지급 조건, 절차 등은 전자상거래 등에서의
      소비자 보호에 관한 법률에 따라 처리함
    바로가기
    • 우측 확장형 배너 2
    • 우측 확장형 배너 2
    최근 본 상품