메뉴 바로가기 검색 및 카테고리 바로가기 본문 바로가기

한빛출판네트워크

맛있는 디자인 어도비 XD CC

웹디자이너를 위한 UX/UI 디자인 기초

한빛미디어

집필서

판매중

  • 저자 : 임선주
  • 출간 : 2021-04-30
  • 페이지 : 364 쪽
  • ISBN : 9791162243756
  • 물류코드 :10375
  • 초급 초중급 중급 중고급 고급
4.7점 (6명)
좋아요 : 2

UX/UI 디자인 기초 이론부터 XD를 활용한 프로토타입 제작까지,

웹디자이너를 위한 가장 완벽한 레시피!

 

웹디자인에 꼭 필요한 UX/UI 디자인 기초 이론부터 프로토타입 제작 도구인 XD 활용법까지 제대로 배울 수 있습니다. UX/UI 디자인 기획과 웹디자인 워크플로우를 먼저 이해한 후 XD의 기본&핵심 기능을 익혀 다양한 실무 활용 예제로 프로토타입을 직접 제작해봅니다. XD 최신 버전에 완벽히 대응하였으며, 기본 기능과 활용법을 완벽하게 마스터할 수 있는 3단계 학습 방법인 [기능 실습] - [한눈에 실습] - [실무 실습]의 구성은 누구나 XD를 제대로 배워 바로 써먹을 수 있도록 도와줍니다. 이 책 한 권이면 예비 웹디자이너가 필요한 것을 모두 학습할 수 있습니다.

 

 

어떤 독자를 위한 책인가?

  • 예비 웹디자이너 또는 실무에 막 입문한 신입 웹디자이너
  • XD를 활용해 업무 효율을 높이고 싶은 1~3년 차 웹디자이너
  • 워크플로우를 이해해 웹디자이너와 원활한 소통을 하고 싶은 기획자, 개발자, 디자이너
  • 프로토타입을 직접 만들고 싶은 기획자, 개발자, 디자이너

 

이 책의 특징 (출판사 리뷰)

3년 연속 그래픽 분야 1위!

50만 독자가 선택한 믿고 보는 ‘맛있는 디자인’ 시리즈

* 교보문고, 알라딘, 예스24, 인터파크_IT/컴퓨터/그래픽 분야 1위(2018~2020년 집계 기준)

 

① 풍부한 실무 예제로 XD의 기초부터 활용까지 완전 정복!

가장 완벽한 디자인 레시피를 알려주는 ‘맛있는 디자인’ 시리즈는 50만 독자에게 검증받은 시리즈입니다. 특히 프로토타입 제작을 제대로 하기 위해 반드시 알아야 할 XD의 기초 기능부터 실전 웹디자인 감각을 길러주는 실무 실습까지 한번에 익히고 제대로 써먹을 수 있도록 도와줍니다. [기초가 튼튼해지는 XD 기본편]에서는 웹디자인에 꼭 필요한 UX/UI 디자인 기초 이론과 웹디자인 워크플로우를 먼저 이해한 후 XD의 기본&핵심 기능을 익힙니다. [UX/UI 디자인을 위한 XD 활용편]에서는 다양한 실무 활용 예제를 통해 아이콘 등 프로토타입에 필요한 다양한 디자인 요소를 제작하고 모바일 앱 UI도 디자인해보며 XD를 활용한 프로토타입 제작법을 효과적으로 익힙니다.

 

② 업데이트가 잦은 XD CC의 최신 버전 완벽 대응!

이 책은 XD CC의 최신 버전에 완벽히 대응했습니다. 3D 변형 기능, 애니메이션을 적용하는 인터랙션 기능, 반응형 웹&앱을 만드는 내용 인식 레이아웃, 협업이 쉬워지는 디자인 사양 공유 및 공동 편집 등 XD를 더 효율적으로 다룰 수 있는 신기능을 쉽고 빠르게 학습할 수 있으며, 신기능을 활용한 예제도 실습할 수 있습니다. 어도비 크리에이티브 클라우드 시스템은 안정성 향상이나 사용자 편의를 위해 프로그램을 지속적으로 업데이트하고 있습니다. 특히 XD CC는 업데이트가 잦은데, 수시로 변경되는 인터페이스나 기능에도 유연하게 대처할 수 있도록 자세한 설명을 수록했습니다.

 

③ 가장 완벽한 학습 방법인 3단계 구성으로 학습!

왕초보도 알기 쉬운 [간단 실습]부터 눈으로만 봐도 쏙쏙 이해되는 [한눈에 실습], 지금 당장 써먹을 수 있는 [실무 실습]까지, 가장 완벽한 3단계 학습 구성으로 XD를 제대로 배울 수 있습니다. [간단 실습]에서는 꼭 알아야 하는 UX/UI 디자인 기초 지식, XD의 화면 구성 및 패널과 도구 등을 살펴보고, 예제 실습 전 필요한 기본 조작과 설정 방법을 익힙니다. [한눈에 실습]에서는 기능별 예제로 XD의 핵심 기능을 익힙니다. 주요 기능의 사용법과 활용 과정을 한눈에 살펴보며 결과를 바로 확인할 수 있어서 기능이 쏙쏙 이해됩니다. [실무 실습]에서는 여러 개의 기능을 조합하여 하나의 완성된 예제를 만들어보며 실무 감각을 익힙니다.


④ 맛있는 디자인 스터디 공식 카페와 함께하는 학습!

맛있는 디자인 스터디 공식 카페(https://cafe.naver.com/matdistudy)에서는 학습하다가 막히는 부분이 있다면 [Q&A 게시판]을 이용해 질문할 수 있고, 학습 멘토가 빠르고 친절하게 답변해드립니다. 혼자 학습하기 막막한 분, XD를 제대로 학습하고 싶은 분, 어도비 신기능이나 업데이트 내역을 빠르게 확인하고 싶은 분이라면 맛있는 디자인 스터디 공식 카페를 활용해보세요. 맛있는 디자인 스터디 공식 카페에서는 스터디 그룹도 운영합니다. ‘맛있는 디자인 스터디 그룹’은 포토샵, 일러스트레이터, 프리미어 프로, 애프터 이펙트를 쉽고 빠르게 학습할 수 있도록 도와주며, 6주 커리큘럼에 맞춰 학습 분량을 가이드하고 미션을 제공하며 스터디 완주 시 리워드까지 제공합니다.

* 맛있는 디자인 스터디 공식 카페를 활용해 학습한 분들의 실제 후기입니다!

“혼자였다면 작심삼일에서 끝났을 텐데 스터디 덕분에 책 한 권과 왕초보 딱지를 뗄 수 있었어요!” _이로미 님

“처음 공부하는 분들께 강력 추천합니다. 기초부터 실무에 적용할 수 있는 내용까지 뭐 한 가지 부족한 것이 없습니다.” _박해인 님

 

맛디 어도비 XD CC_상세페이지 최종_700px.jpg

임선주 저자

임선주

중앙입시교육연구원, 신문사, IT 벤처 회사 등에서 온라인 개발부의 웹디자이너로 일하며 관련 업무를 익혀왔습니다. 유럽의 풍부한 감성적 토양을 내 것으로 만들고자 스위스 남부 루가노에 위치한 USI(Università della Svizzera Italiana)에 편입하여 Communication Arts를 전공하며 기호학, 미디어, 디지털 문화기획에 대한 지식 습득의 즐거움을 누렸고, 대학원에서는 디자인공예를 전공하며 디자인 소양을 갖추고자 했습니다. 현재는 협회 및 학원 등에서 UX/UI 디자인을 강의하고 있습니다.

PART 01. 기초가 튼튼해지는 XD 기본편


CHAPTER 01. UX/UI 디자인을 기획하다


LESSON 01. UX/UI 디자인 알아보기 : UX/UI 개념과 프로세스 이해하기

UX 개념과 과정 이해하기

UI 개념과 설계 지침 이해하기

앱과 웹, 반응형 웹 이해하기

UX/UI 개발 프로세스 한눈에 살펴보기

 

LESSON 02. 벤치마킹 : 사용자의 요구와 콘텐츠 내용 분석하기

벤치마킹 이해하기

다양한 벤치마킹 사례 살펴보기

 

LESSON 03. 아이디어 도출 : 주제에 맞는 아이디어 정리하기

아이디어 도출 이해하기


LESSON 04. 구조 전략 설계 : 콘셉트를 시각화하기

콘셉트 시각화 이해하기

콘셉트 시각화 한눈에 살펴보기

 

LESSON 05. 기술적 구현 : 스토리보드 작성하기

스토리보드 이해하기

와이어프레임 작성하기

스토리보드 작성하기

 

LESSON 06. 목업 : 개발 전 디자인 결과물 만들어보기

목업 이해하기

 

LESSON 07. 비주얼 디자인 프로토타이핑 : 프로토타입 이해하고 만들기

프로토타이핑 이해하기

프로토타이핑 도구 알아보기

 

CHAPTER 02. UX/UI 디자인을 제작하다


LESSON 01. XD, 어떻게 생겼지 : XD 실행 화면 살펴보기

XD 워크플로우 이해하기

XD 시작/기본 화면 알아보기

도구 이름과 기능 살펴보기

속성 관리자 살펴보기

 

LESSON 02. XD 기본 도구 다루기 : 아트보드와 레이어 조작하기

아트보드 다루기

[간단 실습] 아트보드 만들고 이름 변경하기

[간단 실습] 아트보드 추가하고 삭제하기

[간단 실습] 아트보드 정렬하고 옮기기

[간단 실습] 아트보드에 색 적용하기

[간단 실습] 아트보드 확대/축소하기

[간단 실습] 단축키로 아트보드 보기 설정하기

레이어 다루기

[간단 실습] 레이어 정렬하고 그룹 만들기

[간단 실습] 레이어 이름 변경하기

[간단 실습] 레이어 복제하기

[간단 실습] 레이어 순서 바꾸기

[간단 실습] 레이어 잠그기, 숨기기, 삭제하기

[간단 실습] 레이어 내보내기

[간단 실습] 포토샵에서 이미지 편집해 XD로 불러오기

 

LESSON 03. XD 기본 오브젝트 다루기 : 도형과 선 그리고 색 적용하기

오브젝트 다루기

[간단 실습] 사각형 그리고 색 적용하기

[간단 실습] 사각형 모서리 수정하기

[간단 실습] 사각형 테두리 수정하기

[간단 실습] 원, 다각형 그리기

[간단 실습] 선 그리고 수정하기

펜 도구 다루기

[간단 실습] 펜 도구로 그리기

[한눈에 실습] 펜 도구로 열린 도형(직선) 그리기

[한눈에 실습] 펜 도구로 닫힌 도형(직선) 그리기

[간단 실습] 펜 도구로 열린 도형(곡선) 그리기

[간단 실습] 펜 도구로 닫힌 도형(곡선) 그리기

[한눈에 실습] 베지어 게임 사이트 활용해 패스 그리기

[간단 실습] 도형 오브젝트 이동하고 복제하기

[한눈에 실습] 오브젝트에 불투명도, 그림자, 배경 흐림 효과 적용하기

오브젝트 정렬 알아보기

[간단 실습] 오브젝트 상단, 하단 정렬하기

[간단 실습] 오브젝트 왼쪽, 오른쪽 정렬하기

오브젝트 순서 알아보기

[간단 실습] 오브젝트 순서 바꾸기

그레이디언트 알아보기

[간단 실습] 오브젝트에 그레이디언트 적용하기

[간단 실습] 그레이디언트 수정하기

[간단 실습] 그레이디언트 추가하고 삭제하기

오브젝트 병합 알아보기

[간단 실습] 오브젝트 병합하기

[한눈에 실습] 오브젝트 병합하여 톱니바퀴 만들기

3D 변형 기능 알아보기

3D 캔버스 컨트롤 살펴보기

[간단 실습] 캔버스 컨트롤로 오브젝트 3D 변형하기

[간단 실습] 회전 수치를 입력해 오브젝트 3D 변형하기

[한눈에 실습] X축 변형하기

[한눈에 실습] Y축 변형하기

[한눈에 실습] Z축 변형하기

[한눈에 실습] X, Y축 함께 변형하기

[간단 실습] 3D 변형 기능으로 오브젝트에 원근감 표현하기

 

LESSON 04. XD 기본 도구 활용하기 : 문자 입력하고 그리드 활용하기

문자 도구 다루기

[간단 실습] 문자 입력하기

[간단 실습] 문자에 다양한 속성 적용하기

[간단 실습] 플러그인 설치해 더미 텍스트 입력하기

그리드 다루기

[간단 실습] 레이아웃 그리드 만들기

[간단 실습] 반복 그리드(행) 활용하기

[간단 실습] 반복 그리드(오브젝트) 활용하기


LESSON 05. XD 이미지 편집하기 : 이미지 삽입하고 마스크 적용하기

[간단 실습] 이미지 삽입하기

[간단 실습] 영역 지정하여 이미지 삽입하기

[간단 실습] 이미지 영역의 모양 변경하고 삽입한 이미지 교체하기

[간단 실습] 삽입한 이미지를 포토샵에서 편집하기

[간단 실습] 벡터 이미지를 가져와 편집하기

이미지 혼합 모드 알아보기

[간단 실습] 혼합 모드 실행하기

혼합 모드 미리 보기

마스크 알아보기

[간단 실습] 마스크 적용하여 부채꼴 모양 만들기

[간단 실습] 마스크 해제하기

[한눈에 실습] 마스크 적용해 도트 패턴 하트 만들기

 

LESSON 06. XD 애니메이션 적용하기 : 프로토타입을 위한 인터랙션 화면 전환 효과 적용하기

[간단 실습] 자동 애니메이션 적용하기

[간단 실습] 슬라이드 애니메이션 적용하기

[한눈에 실습] 대시보드 애니메이션 적용하기

 

LESSON 07. 플러그인 활용하기 : 제플린과 다양한 플러그인 설치하기

제플린 알아보기

[간단 실습] 제플린 설치하고 연동하기

제플린 기본 구성 살펴보기

[간단 실습] 제플린 프로젝트 작업하기

[간단 실습] 이미지 요소 확인하기

[간단 실습] 텍스트 요소 확인하기

[간단 실습] 스타일 가이드에 요소 추가하기

[간단 실습] 노트 기능으로 팀과 협업하기

[간단 실습] 버전 관리 기능으로 협업하기

다양한 플러그인 알아보기

[간단 실습] 플러그인 설치하기

유용한 플러그인 한눈에 살펴보기

 

PART 02. UX/UI 디자인을 위한 XD 활용편


CHAPTER 01. 다양한 프로토타입을 만들며 자유자재로 XD 활용하기


LESSON 01. 라인 아이콘 세트 제작하기 : 도형 도구와 병합을 활용해 아이콘 만들기

디자인 모드에서 기본 아트보드 준비하기

홈 아이콘 만들기

프로필 아이콘 만들기

종 아이콘 만들기

아이디 카드 아이콘 만들기

 

LESSON 02. 마우스 오버 버튼 제작하기 : 구성 요소 활용해 마우스 오버 상태 추가하기

기본 아트보드 준비하고 아이콘 테두리 만들기

ON/OFF 입력해 마스크 적용하기

구성 요소 만들기 기능으로 마우스 오버 상태 만들기

마우스 오버 상태 동작 확인하기

메뉴 아이콘 테두리 만들기

MENU 입력해 마스크 적용하기

구성 요소 만들기 기능으로 마우스 오버 상태 만들기

마우스 오버 상태 동작 확인하기

 

LESSON 03. 마우스 오버 가로 메뉴바 제작하기 : 구성 요소 활용해 마우스 오버 상태 추가하기

아이콘에 마스크 적용하기

아이콘을 구성 요소로 만들기

각 아이콘에 마스크 적용하고 구성 요소로 만들기

구성 요소 활용해 마우스 오버 상태 만들기

마우스 오버 상태 동작 확인하기

 

LESSON 04. 마우스 오버 세로 메뉴바 제작하기 : 구성 요소 활용해 마우스 오버 상태 추가하기

아트보드 만들고 플러그인 설치하기

아이콘을 에셋으로 추가하기

기본 상태의 세로 메뉴 만들기

메뉴의 디테일한 요소 만들기

마우스 오버 상태의 긴 메뉴 만들기

에셋으로 추가한 아이콘 배치하기

마우스 오버 상태의 문자 입력하고 마스크 적용하기

구성 요소 활용해 마우스 오버 상태 만들기

마우스 오버 상태의 문자 입력하고 마스크 적용하기

구성 요소 활용해 마우스 오버 상태 만들기


LESSON 05. 뮤직 플레이어 UI 제작하기 : 이미지 드래그 슬라이더 제작하기

준비 파일 불러와 호버 버튼 만들기

다운로드 리스트 만들기

인터랙션 적용할 아트보드 만들기

인터랙션으로 드래그 애니메이트 적용하기

헤더 영역(타이틀 및 앨범 리스트 영역) 만들기

레이아웃에 맞춰 앨범 리스트 만들기

인터랙션 적용할 아트보드 복사하기

인터랙션으로 드래그 애니메이트 적용하기

 

LESSON 06. 뉴모피즘 스타일의 스마트홈 UI 제작하기 : 다이얼 드래그 제작하기

준비 파일 불러와 드래그 오브젝트 만들기

드래그 다이얼 버튼 만들기

온도 표시 문구 만들기

룸 넘버 영역 만들기

하단 영역 구분선 만들기

아이콘을 배치할 버튼 영역 만들기

버튼 영역에 아이콘 배치해 마무리하기

인터랙션 적용할 아트보드 복사하기

인터랙션으로 드래그 애니메이트 적용하기

 

CHAPTER 02. 모바일 앱 프로토타입으로 실무 UX/UI 디자인 익히기


LESSON 01. 날씨 앱 UI 디자인하기 : 모바일용 프로토타입 만들기

새 아트보드 만들고 배경 지정하기

구성 요소 불러와 메인 페이지 만들기

반복 그리드로 세부 요소 배치하기

오늘의 날씨 페이지 만들기

세계 날씨 페이지 만들기

접속 시간에 맞는 개별 페이지 구성하기

인터랙션으로 탭 애니메이트 적용하기

 

LESSON 02. 카페 앱 UI 디자인하기 : 모바일용 프로토타입 만들기

준비 파일 불러와 메인 페이지 만들기

메인 페이지의 터치 버튼 영역 만들기

메뉴 선택 페이지 만들기

스탬프 적립 페이지 만들기

매장 찾기 페이지 만들기

게시판 페이지 만들기

인터랙션으로 탭 애니메이트 적용하기


LESSON 03. 여행 소개 앱 UI 디자인하기 : 모바일용 프로토타입 만들기

새 아트보드 만들고 로그인 페이지 만들기

아트보드 추가해 메인 페이지 만들기

여행지 카테고리 페이지 만들기

여행지 사진을 배치할 본문 영역 만들기

사각형 영역에 여행지 사진 배치하기

여행지 세부 페이지 만들기

여행지 세부 스크롤 페이지 만들기

인터랙션으로 탭 애니메이트 적용하기

맛있는 디자인 시리즈를 좋아하기도 하고

요즘은 디자인 프로그램으로 노는 데 푹 빠지다 보니,

어도비 XD CC까지 공부해 보게 되네요. 전 맛있는 디자인 시리즈를 좋아하는데 사실 XD가

뭔지는 잘 몰랐어요.

대충 홈페이지나 앱등에 들어가는 디자인을 할 수 있는 프로그램이라는 정도만 알았거든요.

"나는 리뷰어다" 통해서 궁금했던 XD프로그램에 대해서 책을 읽고 배워보았습니다.

전 아도비프로그램을 매달 정기결제로 사용해서, XD 프로그램을 직접 깔고 책을 따라 사용해 보았어요.

생각보다 재미있네요.

책만 따라하면, 기초일러스트를 사용해본 분들이라면 '어라 생각보다는 쉬운데 ' 하는 생각을 하실수도 있어요.

이번 어도비XD책은 실무만을 알려주는 책은 아니라서 처음에는 좀 어렵게 다가왔는데요.

UX.UI 디자인과 기획에 대해서 먼저 알려줍니다.

UX.UI 디자인은 홈페이지나 전자책, 웹드라마, 앱등의 다양한 분야에 디자인등을 하는 건데요.

사용자 경험에 중심이라네요.

누가 사용하느냐? 어디에 사용하느냐?에 따라 완전히 디자인이 달라지네요.

포토샵이나 일러스트로 실기연습만 할때는 재미 있었는 데,

기획이라니?

디자인 제작이라~~ 뭔가 굉장한 것 같아요.

책 초입을 읽으면서 조금은 어렵게 다가오는 것 같아서 쬐금 부담스러웠는데, 음 이론이라

읽다보니 생각이 조금씩 달라지는 것 같아요.

막연히 디자인만 뽑는건 그때그땐 필요에 의한 건데.

내가 기획하고 거기에 맞게 디자인한다라 완전 다른느낌이자나요.

콘셉을 시각화하기위해서 스토리보드를 만들도 기술적으로 구현하는 것까지 자세히 알려줍니다

물론 실무에 투입되어도 좋다까지는 아니지만 ^^ 대략적인 아우트라인만 알아도

실무 대화를 들으면 이해는 할수 있자나요.

디자인툴들을 배우신다면 한번 쯤 읽어보시면 좋을 것 같아요

물론 UX.UI 디자인을 하시려고 생각하신다면 당연히 많은 도움이 될것 같아요.

기초과정은 쉬운것 같은데

활용쪽으로 가면 생각도 많이하고 디자인 해봐야 할것 같아요.

맛있는 디자인책은 가장 강점중 하나는 맛있는 디자인 까페에서 같이 공부하거예요.

이번에 5기에 참여했었는데요. 처음으로 책을 처음부터 끝갖지 완독만 한게 아니라 실습도 다해보았습니다.

혼자서 공부하는게 용두사미로 끝나기 마련인데,

같이 하니 해내게 되네요.

공부도 열심히라게 되지만 질문할곳이 있다는게 까페 공부에서 가장 큰 강점인것 같아요.

6기에는 XD를 같이 공부하는 기수가 생ㄱ긴다면 꼭 다시 참여하고 싶습니다.

책을 읽다보니 앞에서는 쉽지만 활용으로 갈수록 조금은 힘들어서요.^^

혼자하다보면 아무래도 조금씩 건너뛰기도 하자요

XD도 생각보다 재미있어요.

포토샵과 일러스트를 배우시거나 공부하신분들이라 읽어보시면 새로운 디자인의 세계에 입문하실 수 있어요.

이책의 가장 좋은점을 꼽으라면 기초가 쉽고 이론을 이해하기 쉽게 설명해준다는 점이구요.

따라하기만 해도 책처럼 만들어 볼 수있다는 거예요.

음 단점은 아니고 아무래도 활용은 따라하기만 해서 쉽지는 않지만 도전해 볼만합니다.

20210619_163434.jpg

 

 

IT 기술이 발전되면서 세상의 발전 속도는 이전보다 더 높은 가속도를 가지고 있습니다.

수많은 IT 기술이 접목된 제품들이 나오면서 사람들은 넘쳐나는 제품들 중에서 어떤 제품을 골라야 하는지 고민할 정도입니다.

그리고 이제는 기술의 평준화가 이루어지면서 점점 디자인에 대한 갈망이 더 높아지고 있습니다.

제품 광고를 보면 기술보다는 감성이나 디자인적인 측면을 부각하는 광고가 많아지고 사용자의 니즈를 먼저 알고 제시하고 있습니다.

UX(User eXperience) Design, 일명 사용자 경험 중심의 디자인과 UI(User Interface) Design에 대한 영향이 제품 완성에 있어서 중요하게 인식되고 있습니다.

특히 웹이나 앱 생태계에서는 UX와 UI에 대한 기획이 점점 중요하게 자리 잡고 있습니다.

웹사이트나 스마트폰 앱을 접속할 때 그냥 이쁜 디자인이 아닌 사용자가 경험하기에 좋은 디자인 조작하기 좋은 디자인을 얼마나 잘 구현하는지가 

성공의 중요한 위치에 있습니다.

오늘은 웹디자이너를 위한 어도비 XD 기본편+활용편을 공부한 리뷰를 올립니다.

 

00.jpg

항상 맛있는 디자인 시리즈를 개인적으로 좋아합니다.

제목은 웹디자이너를 위한 UX/UI 디자인 기초 어도비 XD CC 기본편+활용편 입니다.

뭐~ 한마디로 어도비 XD CC 입니다^^;

 

02.jpeg

초반에는 이 책의 구성에 대한 설명이 있습니다.

이 부분은 그냥 지나치는 분들이 계시는데, 저는 초반 부분을 좀 더 정독합니다. 

 

03.jpeg

전체적인 공부 단계에 대한 설명부터 시작해서 이 책을 어떻게 공부하라는 작가의 생각이 담겨있기에 그냥 지나치지 말고 꼭 정독하시길 바랍니다.

 

04.jpeg

전체적인 목차를 보면 크게 2가지로 나누어집니다.

기본편활용편입니다.

 

05.jpeg

LESSON의 제목을 꼭 확인하고 이번 LESSON에 내가 무엇을 배워야 하는지 숙지하시고 각 LESSON을 시작하면 됩니다.

 

06.jpeg

책의 오른쪽 면에는 각 chapter를 구분할 수 있는 인덱스 디자인으로 표시되어 있습니다.

공부하면서 내가 지금 보고 있는 chapter를 항상 확인할 수 있습니다.

 

07.jpeg

이론적인 내용보다는 간단 실습을 통해서 XD의 기능들을 공부할 수 있습니다.

 

08.jpeg

그리고 한눈에 실습을 통해서 주요 기능의 사용과 활용법을 한눈에 확인할 수 있고 전체적인 결과들을 보면서 학습할 수 있습니다.

 

09.jpeg

중간에 분홍색 박스에는 참고할 내용이나 실수할 수 있는 부분을 설명하고 있습니다.

 

10-1.jpeg

각 LESSON 시작 부분에는 준비 파일완성 파일호환되는 버전을 알려줍니다.

준비 파일을 실행하여 공부를 시작하시면 됩니다.

 

10-2.jpeg

또한 완성된 디자인을 먼저 확인하고 내가 어떤 디자인을 목표로 공부를 시작하는지 알려줍니다.

 

11.jpeg

그리고 활용편에서는 공부하는 예제를 따라 하면 내가 무엇을 공부하고 어떤 능력이 생기는지 설명합니다.

 

12.jpeg

기능 꼼꼼 익히기를 통해서 작가의 노하우를 공부할 수 있습니다.

책의 제목을 보면 웹디자이너를 위한 책으로 나와있지만 저는 웹디자인 말고도 편집 디자인이나 앱 디자인, 제품 운영 UI 작업할 때도 많이 사용하고 있습니다.

특히 편집 디자인 같은 경우에도 빠른 초안 작업이 가능하기에 인디자인으로 작업하기 전에 XD로 초안을 잡아서 기획 회의를 진행합니다.

앱 디자인도 마찬가지로 작업하기 까다로운 일러스트레이터보다는 XD로 진행하면 엄청 편하고 빠른 작업 속도가 가능하기에 활용도가 아주 높은 디자인 프로그램입니다.

저는 어도비 유료 사용자이지만 XD 스타터 설치하면(책의 내용 포함되어 있음) 무료로 (일부) 사용 가능하기 때문에 사용해 보시길 바랍니다.

 

​이 책을 읽고 난 후에 느낀 점

1. 내용이 쉽고 초보자가 쉽게 공부 가능

2. 활용편에 있는 예제는 일반 실무에도 사용 가능할 정도의 완성도가 높음

3. 바로 운영하는 방법을 알려주는 것이 아니라 기획부터 UX, UI에 대한 설명이 도움이 많이 됨.

4. 초안 작업을 이제는 XD를 많이 활용하게 됨. (원래는 상황에 따라 포토샵, 일러스트, 인디자인을 활용)

 

"한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다."

 

 

#앱디자인 은 #스케치 #sketch 라는 프로그램이 이미 외국에서 인지가 컸었습니다.  

어도비사의 #포토샵 이 지배했던 #웹디자인 도 가능했던 스케치인지라 대적할만한 툴이 없었죠. 

하지만 가장 크고 치명적인 단점이 하나 있었으니 바로 애플의 맥os에서만 동작한다는것입니다.  

이 프로그램 하나때문에 고각의 맥장비를 살 필요는 없지만 먹고 살기위한 직업이 있는 분들이라면 울며 겨자먹기로 어쩔 수가 없었죠. 

 

디자인뿐만 아니라 영상 편집까지 아우루는 그래픽 프로그램의 거대 공룡인 #어도비 가 가만 있을 수 없었겠죠? 
그래서 #어도비XD 라는 유사한 프로그램을 발표하고 베타 기간을 꽤나 많이 가졌습니다. 
그 테스트 기간을 통해 사용자들의 피드백을 챙겨서 계속해서 업그레이드해왔죠. 
상당한 시간이 걸려 공식 버전을 발표했지만 이네 계속해서 버전업을 시도했습니다.
 
그도 그럴것이 #포토샵 #일러스트레이터 #인디자인 #프리미어 #애프터이펙트 같은 굴직굴직하게 자리잡힌 프로그램과는 달리...
기존의 스케치 유저들을 대체하기에는 많이 부족했습니다. 
저도 그당시 써보긴 했지만 뭔가 맹한 느낌이였죠. 
더군다나 많은 유저층이 있어서 템플릿과 각종 플러그인 지원이 좋았던 스케치에 비해 #어도비XD 는 지원환경도 부족했어요.
어도비 라는 백그라운만을 등지고 출사표를 던지기에는 부족했던게 사실입니다.  
 

 

하지만 최근 1~2년새에 어도비XD 는 완성도 있는 기능 구현에 심열을 기울인 모습을 보여주고 있네요.
너무 빈번한 기능 업그레이드때문에 사실상 출판사의 책을 기다하는게 여간 까다로운 프로그램이 아닙니다.
 
이번에 나온 #맛있는디자인어도비XD 책은 기본편 과 활용편 두가지 파트가 합쳐져서 어느정도 수준의 학습이 가능합니다.
왠만치 이런 기술서들의 구성은 뻔하긴 하지만 국민 프로그램이라고 일컬어질정도로 많은 분들이 알고 있는 포토샵과는 달리
어도비XD 는 인터페이스가 기존 어도비 계열 프로그램과는 다르기때문에 기본기가 없으면 헤매게 됩니다.

 

 

그래서인지 PART1 에 해당되는 기본편 CHAPTER01에서는 UX UI 디자인 기획부터 다루고 있습니다.
UX UI 개념과 제작 과정을 이해 못하면 그냥 툴만 잘 다루는 사람밖에 안되니까요.
 
이 책이 단순히 어도비XD 프로그램 사용법에 국한되지 않다는 것을 인지할 수 있는게 바로 첫장부터입니다.
따로 UX UI 디자인 기획 같은 내용만 다뤄도 책 한권이 모자를 정도긴하지만
그렇다고 맛있는디자인어도비XD 에서 주객이 바뀌면 안되겠죠?

 

 

#맛있는디자인어도비XD 의 활용편을 다루고 있는데요.
마지막 CHAPTER에서는 실제 모바일용 프로토타입을 디자인하면서 제작하는 내용을 다룹니다.
 
저도 기상하면 매일 확인하는 날씨앱, 아주 익숙한 화면이지만 또 앱마다 조금씩 차이점이 있습니다.
오늘의 날씨, 주간 날씨, 한달 단위 등 크게 나뉘기도 하지만
하루 단위에서는 시간/분 단위와 날씨외에도 미세먼지, 강수, 바람 등 관련 요소가 적잖게 있죠.
 
 
디자인 관련 책들이 하나같이 갖고 있는 단점은 예제입니다.
우리들이 배우려고 하는건 각종 미디어에 노출되어 있는 상업용 콘텐츠들입니다.
그런데 꼭 교육이나 학습 및 강의용 예제들이 하나같이 구립니다.
 
반면에서 이번 #맛있는디자인어도비XD 책의 예제들은
어도비XD 가 앱디자인과 웹디자인 용으로 대두되는 프로그램이서인지 조금 더 신경쓴 것 같네요.
사실 이런 디자인 관련 서적에서의 예제는
기본이든 활용이든간에 해당 프로그램의 기능들을 적용시키는거잖아요.
예제라고 해서 촌스러울 필요가 없다는거죠.
짜투리 질답 시간에 간단하게 보여주는 내용도 아니고 본편의 학습인데 말입니다.
 
그래서 #맛있는디자인 #어도비XD 는 3단계 구성으로 학습내용 따라하기를 유도합니다.
 
1단계: 기능소개와 함께 간단실습
2단계: 설명보다는 실제 작업 화면을 토대로 바로 실습과정에 대한 이해
3단계: 누구나 원하는 바로 바로 써먹을 수 있는 실무 작업의 예제를 통해서 실습
 
이런 점들이 이번 어도비XD 책에서 좀 더 부각시킨 차별점이라는 생각이 드네요.
포토샵에 비해서는 범용성이 떨어지지만 앞으로 대세는 모바일앱처럼
제작 프로그램도 작업자 입장에서도 좀 더 스마트한 인터페이스 환경을 추구하고 있다고 봅니다.

 

14년동안 웹디자인으로 일했던 나는 XD가 없었던 시절에 웹디자인을 했던터라 포토샵으로 디자인을 했었다.

그런데 이 책을 보고 XD를 알고보니 웹디자인하는데에 사용했다면 너무 유용하고 좋았을것 같다는 생각이 든다.

그런데 지금 이 책을 보는 이유는 프로그램을 전공한 내가 전공한걸 못써먹는게 아쉬워서 꼭 죽기전에 앱을 하나 개발해보고 싶은데

그때 앱을 디자인할때 쓸수 있는 프로그램이 어도비 XD이다.

그래서 언젠가는 꼭 배워야겠다 싶은 프로그램이 XD이기에 이 책을 통해 기초부더 실습하며 하나하나 공부했다.

 

첫번째 챕터에서는 모바일 시대가 되면서 핫한 디자인 영역인 UX/UI 디자인에 대해 이론적인 설명이 있다.

기획하고 전반적인 UX디자인에 대한 설명으로 XD를 사용하기 전에 알아야할 기본적인 이론이 있다. 

길게 지루한 설명이 아니라 짧고 굵게 배울수 있다.

 

이 책의 가장 많은 부분의 내용이 있는 두번째 챕터에는 어도비 XD 툴에 대한 전반적인 설명이 있다.

나 또한 XD를 처음 접하기 때문에 이부분도 쉽게 넘어갈수 없었다. 

하나하나 툴에 대해 어떤 기능이 있는지, 각 기능별로 상세한 실습을 해보며 익힐수 있도록 되어있다.

플러그인을 설치해서 더 효율적인 작업을 할 수 있는 단계까지 설명이 되어있어 실제적으로도 도움이 되는 책인것 같다.

 

기본편에서는 정말 기본적인 이론과 XD 툴에 대한 기능을 공부하는 부분이었다면

활용편에서는 실제적인 주제로 실습을 해가며 기능들을 사용해보는 방법들이 잘 설명이 되어있다.

한빛미디어 디자인툴 관련 책들과 마찬가지로 툴의 화면과 설명글의 번호를 잘 매치해서 순서대로 따라하기 쉽게 되어있다.

개인적으로 한빛미디어의 이런 방식의 편집이 참 맘에 든다.. ㅎㅎㅎ

 

마지막 활용 두번째 챕터에서는 진짜 앱을 디자인해보며 실습하는 시간이라 가장 재미있었다.

정말 이제 나의 앱을 디자인한다면 이 책을 통해 배운 XD를 사용해 앱을 디자인할 수 있을것 같다.

어도비 XD의 특징이 다른 어도비 디자인 툴을 사용한다면 쉽게 익힐수 있고 또한 호환도 잘 되어서 작업에 효율적인것 같다.

 

​역시나 마지막에는 맛있는 디자인 시리즈의 특징인 단축키 모음 카드가 있다.

디자이너에게 단축키란 칼퇴의 무기가 되기에 ㅋㅋㅋㅋ

어도비 XD에 대해 배우고 싶지만, 다른 툴들에 비해 공부할 수 있는 책이 많이 나와있지 않다.

맛있는 디자인에서 XD에 대해 공부할 수 있는 책을 내준것이 개인적으로도 참 감사하다. ^^

우리가 주로 사용하는 인터넷 웹사이트의 멋진 움직임과 디자인을 개발하는 디자이너의 도구는 포토샵과 일러스트레이터라는 것을 모두 잘 알고 계실 것입니다. 각기 다른 도구를 사용하는 디자이너들이 협업하여 효율적으로 업무를 함께 할 수 있도록 해주는 웹디자인 워크플로우 저작도구, 어도비 XD입니다.

 

 

2021-06-02-001.jpg

 

맛있는 디자인 어도비 XD CC 기본편 + 활용편

 

웹디자이너를 위한 UX/UI 디자인 기초

내용 소개

기초가 튼튼해지는 XD기본편은 알기쉬운 [간단 실습]부터 쏙쏙 이해되는 [한눈에 실습]에서 바로 사용할 수 있는 [실무 실습]까지 3단계 학습 구성으로 제대로 배우는 과정으로 되어 있어 주요 기능 사용법과 활용과정을 살펴보며 결과를 확인할 수 있습니다.

여러개의 기능을 조합하여 완성된 예제를 만들 수 있어 큰 도움이 됩니다.

기본편

- UX / UI 디자인 기획

- 웹디자인 워크플로우

- XD 기본 오브젝트 다루기

- 정렬, 병합, 3D 변형, 그리드

 

- 이미지 편집, 마스크, 인터랙션

 

2021-06-02-010.jpg

 

2021-06-02-017.jpg

활용편

 

- 플러그인 설치해 활용하기

- 라인 아이콘 세트 만듥

- 마우스 오버 버튼/메뉴 만들기

- 이미지 드래그 슬라이더 만들기

- 모바일용 프로토타입 (날씨앱, 카페앱, 여행소개 앱 UI)

 

UX/UI 디자인 실무 활용 예제가 들어있는 2번째 부분은 아이콘 등 프로토 타입에 필요한 디자인 요소를 직접 제작하고 모바일 앱 UI 실제 디자인을 해보는 과정으로 어도비 XD를 활용한 프로토 타입 제작방법을 효과적으로 익힐 수 있습니다.

 

 

2021-06-02-014.jpg

 

2021-06-02-015.jpg

 

2021-06-02-016.jpg

 

맛있는 디자인 어도비 XD CC 기본편 + 활용편

 

웹디자이너를 위한 UX/UI 디자인 기초

정리

어도비XD 최신버전에 대응한 3D변형기능, 인터랙션 기능, 반응형 웹 앱을 내용인식 레이아웃, 협업을 위한 디자인 사양 공유, 공동편집을 효율적으로 만들어주는 방법을 쉽게 익힐 수 있습니다.

맛있는 디자인 어도비 XD는 웹 디자이너 뿐만 아니라, 의뢰나 기획, 프로토 타입을 직접 만들어 보고 싶은 기획자와 개발자까지도 추천할 수 있는 책입니다.

 

2021-06-02-018.jpg

맛있는 디자인 어도비 XD CC 기본편 + 활용편

 

웹디자이너를 위한 UX/UI 디자인 기초

장점

- 클라우드 시스템으로 지속적인 업데이트를 하는 어도비 XD CC 최신 버전에 대처하여 새로운 기능과 변경되는 인터페이스에 대처할 수 있도록 내용을 전달합니다.

3D변형기능 / 애니매이션 인터랙션 기능 / 반응형 웹 앱 (내용인식 레이아웃) / 디자인 공유 / 공동편집

- 디자인을 이해하기 쉽도록 간단한 실습 - 전체 상황을 알게하는 한눈에 실습 - 실제 조작과 설정을 배우는 실무실습까지 3단계 학습 구성으로 제대로 배울 수 있습니다.

- 맛있는 디자인 시리즈의 정점인 스터디 카페에서 멘토와 함께 공부할 수 있는 방법은 이미 한빛미디어 독자라면 알고 계시리라 생각합니다.

한빛미디어의 맛있는 디자인 시리즈는 풍부한 실무예제를 스터디 카페에서 함께하는 것으로 유명합니다.

맛있는 디자인 스터디 공식 카페(https://cafe.naver.com/matdistudy)에서는 학습하다가 막히는 부분이 있다면 [Q&A 게시판]을 이용해 질문할 수 있고, 학습 멘토가 빠르고 친절하게 답변해주는 장점이 있습니다.

 

2021-06-02-020.jpg

 

 

 

"한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다."

책을 읽기 전에

평소 어도비 계열의 다양한 디자인 툴을 사용해왔지만 XD의 경우 사용해 본 적이 없었고, 또한 XD로 작성한 프로토타입이나 디자인의 경우 대체로 트렌디하지 못하다는 고정관념을 가지고 있기도 했습니다. 따라서 책에서 다루고 있는 툴도 중요하지만, 사용된 디자인들의 트렌드 혹은 구성에도 관심을 두고 독서를 시작했습니다.

디자인 트렌드 보다는 툴에 집중

책에 사용된 디자인 예제 등이 기대한 것 만큼 트렌디하거나 2021년 스럽지는 않았지만, 디자인 그 자체에 대해 다루는 책이 아닌 툴에 대해 다루는 책인 것을 감안했을 때 큰 불편을 주지는 않았습니다.

자세한 학습 과정와 이미지 위주의 설명

반면 디자인이 아닌 어도비 XD의 사용법을 학습하는 것만을 목표로 두고 읽기에는 아주 적합한 책이라는 생각이 들었습니다. 여러 프로젝트나 작은 요소들을 작성하는 법까지 번호를 매겨 그 과정을 차례차례 안내하고 있으며, 이를 이미지 위주로 보기 쉽게 설명하고 있습니다.

관련 전공자가 아니더라도 읽어보면 좋을 책

UI 디자인과 관련된 전공이나 직무를 가지지 않았더라도, 관련 분야의 사람들과 협업하거나 프로덕트를 생산하는 일을 하는 사람들이 읽어보면 좋을 책이라고 생각합니다.

 

부록/예제소스
자료명 등록일 다운로드
DOWNLOAD 예제소스(From CDN) 2021-06-28 다운로드
Google Drive 예제소스(From Google Drive) 2021-06-28 다운로드
결제하기
• 문화비 소득공제 가능
• 배송료 : 2,000원배송료란?

배송료 안내

  • 20,000원 이상 구매시 도서 배송 무료
  • 브론즈, 실버, 골드회원이 주문하신 경우 무료배송

무료배송 상품을 포함하여 주문하신 경우에는 구매금액에 관계없이 무료로 배송해 드립니다.

닫기

리뷰쓰기

닫기
* 도서명 :
맛있는 디자인 어도비 XD CC
* 제목 :
* 별점평가
* 내용 :

* 리뷰 작성시 유의사항

글이나 이미지/사진 저작권 등 다른 사람의 권리를 침해하거나 명예를 훼손하는 게시물은 이용약관 및 관련법률에 의해 제재를 받을 수 있습니다.

1. 특히 뉴스/언론사 기사를 전문 또는 부분적으로 '허락없이' 갖고 와서는 안됩니다 (출처를 밝히는 경우에도 안됨).
2. 저작권자의 허락을 받지 않은 콘텐츠의 무단 사용은 저작권자의 권리를 침해하는 행위로, 이에 대한 법적 책임을 지게 될 수 있습니다.

오탈자 등록

닫기
* 도서명 :
맛있는 디자인 어도비 XD CC
* 구분 :
* 상품 버전
종이책 PDF ePub
* 페이지 :
* 위치정보 :
* 내용 :

도서 인증

닫기
도서명*
맛있는 디자인 어도비 XD CC
구입처*
구입일*
부가기호*
부가기호 안내

* 온라인 또는 오프라인 서점에서 구입한 도서를 인증하면 마일리지 500점을 드립니다.

* 도서인증은 일 3권, 월 10권, 년 50권으로 제한되며 절판도서, eBook 등 일부 도서는 인증이 제한됩니다.

* 구입하지 않고, 허위로 도서 인증을 한 것으로 판단되면 웹사이트 이용이 제한될 수 있습니다.

닫기

해당 상품을 장바구니에 담았습니다.이미 장바구니에 추가된 상품입니다.
장바구니로 이동하시겠습니까?

자료실