책 이미지
책 정보
· 분류 : 국내도서 > 컴퓨터/모바일 > 웹디자인/홈페이지 > 웹디자인 기타
· ISBN : 9788960770980
· 쪽수 : 448쪽
책 소개
목차
1부. RIA 기초 다지기
1장. 리치 인터넷 애플리케이션
사용자
컨텐츠
사용자 인터랙션
시각적인 영역
색상
모션
타이포그래피
아이콘
레이어링과 심도
추가적인 요소
정리
2장. 어도비 플렉스와 에어
플렉스 3.0 프레임워크
동적인 레이아웃
확장 가능한 시각적인 컴포넌트
시각적 효과
모션 기능 활용
플렉스 애플리케이션 개발
플렉스 3 SDK와 MXML 컴파일러
어도비 크리에이티브 스위트
플렉스 애플리케이션 배포
정리
2부. 플렉스 3 프레임워크
3장. 동적인 레이아웃
플렉스 레이아웃의 이해
자리배치 자동화
선형 레이아웃
다차원 레이아웃
여백과 간격
자동 레이아웃에서 제외되는 컴포넌트
Spacer 컨트롤 활용
절대좌표
직각좌표계로 컴포넌트의 좌표 지정
제약기반 레이아웃에서 컴포넌트 좌표값 지정
컴포넌트의 크기 지정
픽셀로 지정
백분율로 지정
컴포넌트 자체적인 크기 연산
제약기반에서의 크기 설정
스크롤 관리
정리
4장. 스타일
스타일 속성의 이해
상속
데이터 타입과 형식
코드 내에 스타일 지정
CSS로 적용하는 스타일
외부 스타일시트
CSS 선택자
HTML과 플렉스 CSS
스타일의 우선순위
액션스크립트를 이용한 스타일 적용
위젯에 적용하는 스타일
스타일 관리자
디자인 뷰에서의 스타일 적용
CSS 디자인 뷰
테마
정리
5장. 그래픽 스킨
비트맵과 벡터의 차이
플렉스 3에 삽입된 그래픽
9-슬라이스 안내선
9-슬라이스 안내선 설정
스킨 가져오기를 위한 명명규칙
일반적인 규칙
클래스 선택자를 위한 명명
부속 컴포넌트를 위한 명명
스킨 가져오기 마법사
CSS 디자인 뷰에서의 스킨 작업
스킨 템플릿
통합된 도구의 사용
정리
6장. 프로그램 스킨
드로잉 API 소개
선은 어떻게 그려질까
프로그램 스킨 생성
기본 클래스 선택
인터페이스 구현
메소드 재정의
측정과 프로그램 스킨의 이해
정리
7장. 리스트와 네비게이션 컴포넌트
리스트 기반 컴포넌트
List, HorizontalList, TileList
Tree
DataGrid
Menu
아이템 렌더러와 에디터
드롭인 아이템 렌더러/에디터의 사용
인라인에서의 아이템 렌더러/에디터 구현
분리된 컴포넌트로 아이템 렌더러 구현
트리나 메뉴를 위한 아이템 렌더러 구현
네비게이션 컨트롤
버튼바
토글버튼바
탭바
링크바
네비게이션 컨테이너
라벨과 아이콘
네비게이션을 위한 리스트 기반 컴포넌트
정리
8장. 지시자와 커서
예제에 대한 이해
아이콘
아이콘 구현
아이콘 위치 지정
포커스 테두리
툴팁
툴팁 생성하기
에러팁
데이터팁
스크롤팁
툴팁에 스타일과 스킨 적용
툴팁 매니저
프로그램으로 툴팁 생성하기
툴팁의 타이밍과 움직임
커서
커서 매니저
정리
9장. 글꼴과 텍스트
관심을 끄는 텍스트
글꼴 커스터마이징
디바이스 글꼴
시스템 글꼴
삽입된 글꼴
로컬 글꼴 적용
TTF 파일 삽입
SWF에 포함된 글꼴 사용
안티앨리어스 속성의 기능 향상
문자 범위 지정
@font-face 구문에서 문자열 범위 지정
플래시에서 문자열 범위 지정
CSS 디자인 뷰에서 글꼴 다루기
일관성을 위한 텍스트 스타일 적용
텍스트 작업
텍스트 위치 지정
HTML 텍스트 작업
HTML 텍스트 지정하기
HTML 텍스트 내에서 캐릭터 스타일 지정하기
HTML 텍스트용 스타일시트
정리
10장. 필터와 블렌드
필터
필터 작업
필터 속성
필터 적용
filters 태그 사용
filters 속성 사용
액션스크립트를 통한 필터 적용
블렌드
블렌드 적용
정리
11장. 효과와 전환
효과와 전환 사용
생각해야 할 부분
현실세계에서의 시나리오
효과
효과 적용
적용할 컴포넌트 정하기
효과 발생
이벤트의 시작과 끝
효과 커스터마이징
타이밍 조정
실행 조정
여러 효과를 같이 사용
가속함수
가속함수 사용
커스텀 가속함수 생성
커스텀 가속함수 사용
효과를 같이 사용
데이터 효과
기본 데이터 효과
데이터 효과 이벤트
기본 데이터 효과 사용
커스텀 데이터 효과
커스텀 데이터 효과 적용
액션 효과
필터 속성
그 밖의 트위닝 선택항목
트위너
부스트워씨 AS3 애니메이션 시스템
키친씽크
전환
뷰 스테이트
뷰 스테이트 생성
오버라이드 클래스
전환 추가
전환의 생성
오버라이드 액션
전환과 레이아웃
정리
3부. 다채롭게 활용하는 플렉스
12장. 플렉스와 플래시의 협업
플렉스 컴포넌트 키트
프레임 라벨 사용
경계선 지정
커스텀 컴포넌트 통째로 만들기
모션 XML
정리
13장. 에어 애플리케이션의 커스터마이징
시작하기
윈도우 크롬 다루기
플렉스 크롬 커스터마이징
커스텀 윈도우 크롬
커스텀 애플리케이션 아이콘
정리
4부. 실습
4.1. 실행 중에 스타일 불러오기
정리
5.1. 플래시에서 그래픽 스킨 만들기
시작하기
이미지 만들기
이미지를 심볼로 변경하기
9-슬라이스 크기조절 안내선 설정하기
플래시 이미지를 플렉스로 가져오기
최종 결과
예제의 활용
플래시에서의 비트맵 이미지 사용
플래시용 스킨 템플릿
정리
5.2. 일러스트레이터에서 그래픽 스킨 만들기
시작하기
이미지 만들기
스킨 이미지를 플렉스로 가져가기
최종 결과
예제의 활용
이미지 만들기
스킨 템플릿의 사용
정리
5.3. 파이어웍스에서 그래픽 스킨 만들기
시작하기
이미지 만들기
스킨을 플렉스로 가져가기
최종 결과
예제의 활용
이미지 만들기
스킨 템플릿의 사용
정리
5.4. 포토샵에서 그래픽 스킨 만들기
시작하기
이미지 만들기
스킨 이미지를 플렉스로 가져가기
최종 결과
예제의 활용
이미지 만들기
스킨 템플릿의 사용
정리
6.1. 프로그램 스킨 만들기
테스트 하네스 설정하기
스킨 클래스 만들기
버튼에 스킨 적용하기
이미지 그리기
updateDisplayList 재정의하기
경계선 그리기
버튼 상태에 따라 채우기
스타일 적용하기
최종 결과
예제의 활용
정리
7.1. 리스트를 이용해 메신저 대화창 만들기
시작하기
애플리케이션 테스트
정리
7.2. 타일리스트를 사용해 사진갤러리 만들기
정리
9.1. 플래시를 이용해 SWF 파일에 글꼴 삽입하기
정리
9.2. 글꼴을 포함한 CSS 파일을 SWF로 만들기
정리
9.3. HTML 텍스트용 스타일시트 만들기
정리
11.1. 커스텀 효과 적용하기
정리
11.2. 뷰 스테이트 사이에서 전환 만들기
정리
12.1. 플렉스 컴포넌트 키트를 사용해 그래픽 스킨 만들기
스킨 기본 구조 만들기
스킨 이미지 만들기
전환 효과 만들기
9-슬라이스 안내선 설정하기
플래시 스킨을 플렉스로 가져가기
최종 결과
이미지 만들기
정리
12.2. 플래시 스킨 템플릿 사용하기
정리
12.3. 플렉스 컴포넌트 키트를 이용해 커스텀 컨테이너 만들기
플래시에서 기본 컨테이너 만들기
커스텀 컨테이너를 플렉스로 가져가기
정리
12.4. 모션 XML 사용하기
플렉스에서 준비할 것
정리
5부. 부록
A. 스킨과 스타일 도표
B. 필터 속성 정리
C. 유용하고 참고할 만한 정보
사용자 경험 디자인
플렉스 스킨과 테마
플렉스 컴포넌트 키트
플렉스 예제
플렉스 컴포넌트 커뮤니티
플렉스 라이브러리와 프레임워크
도움말
다운로드
커뮤니티
어도비 블로그
기타 블로그
플렉스/에어 샘플
아이콘
글꼴
그래픽
책속에서
지난 몇 년 동안 웹을 다루는 디자이너와 개발자의 범위는 점점 더 방대해져 왔습니다. 웹사이트는 좀 더 고품질의 디자인과 비디오, 애니메이션 그리고 재미있고 유용하며 다채로운 경험을 만들기 위해 사용자 인터랙션과 통합돼가고 있습니다. 많은 사이트가 어도비 플래시 플랫폼으로 제작되고 있으며, 많은 플래시 사이트 또한 어도비 플렉스를 활용해 만들어지고 있습니다.
플렉스에 대한 많은 오해 중 하나가 플렉스는 플래시와 다르다는 것입니다. 물론 아닙니다. 플렉스는 플래시입니다. 플렉스 애플리케이션은 플래시 플레이어 위에서 동작합니다. 플렉스는 플래시 파일 형식으로 프로그램 언어, API를 사용합니다. 플렉스는 이전 개발에 사용하던 도구들과 플래시 플레이어의 다채로운 기능을 사용할 수 있습니다
몇 년 전 플렉스 애플리케이션을 봤다면 믿어지지 않는 사건일 겁니다. 플렉스로 만든 애플리케이션은 딱 정말 플렉스 애플리케이션처럼 보였습니다. 몇 번 조작만으로도 멋지게 보이는 애플리케이션을 만들었고, 처음 보더라도 다른 것들과 충분히 구분되는 것이었습니다.
왜일까요? 플렉스 초기 버전은 플래시 플랫폼을 전통적인 소프트웨어 개발자들이 접근할 수 있게 했고, 제품을 구입하면 멋진 애플리케이션을 바로 만들 수 있었습니다. 기업에서 사용할 수 있는 애플리케이션을 만들기 시작할 때 플래시를 전혀 다루지 못하는 사람들도 쉽게 다가갈 수 있었습니다. 다채로운 애플리케이션을 개발하기 위한 장벽을 플렉스가 사라지게 만들었습니다.
하지만 플렉스 1.0을 공개했을 때 우리는 다채로운 애플리케이션을 디자인하는 방법에 대해서는 정리할 시간이 없었습니다. 플렉스에 포함된 컴포넌트 스킨을 유연하게 만들려고 했고 컴포넌트의 시각적인 부분을 조절할 수 있도록 방대한 스타일 속성을 제공했습니다. 하지만 디자이너가 플렉스와 함께하기 위해서는 좀 더 많은 것이 필요하다는 사실을 깨달았습니다.
그래서 플렉스 2와 3를 공개할 때는 이미지와 모션 디자인을 플렉스 애플리케이션으로 쉽게 구현할 수 있게 했습니다. 플렉스 2에서는 스테이트와 전환을 추가해 디자이너와 개발자가 복잡하고 역동적인 애플리케이션의 움직임과 모습을 구성할 수 있도록 지원했습니다. 또 제약기반 레이아웃 메커니즘은 세밀한 이미지를 크기가 변하는 애플리케이션에 쉽게 적용할 수 있게 했습니다. 플렉스 3에서는 매크로미디어가 어도비로 합병되면서 어도비 CS 도구와 플렉스 빌더 사이의 스킨 작업을 간결하게 만들어 기본으로 제공되는 컴포넌트의 모습을 다양하게 적용할 수 있게 했습니다.
앤디 매킨토시와 후안 산체즈는 플렉스의 시각적 디자인 기능을 배우는 데 있어 완벽한 안내자입니다. 디자이너로서 개발분야까지 이펙티브UI(EffectiveUI)를 비롯한 기타 RIA 개발 경험은 플렉스의 세계로 깊이 몰입하게 만들 겁니다. 이 책에서는 멋진 플렉스 애플리케이션에 대해 디자이너와 개발자가 알아야 할 기본 이론과, 좀 더 심화된 주제로서 복잡한 애플리케이션의 룩앤필을 만드는 실용적인 예제를 보여줍니다.
이 책에서는 프로그래밍에 관심이 있는 디자이너거나 디자인 감각을 지닌 개발자가 멋진 플렉스 인터페이스를 만들 수 있는 방법을 알려줍니다. 코드를 전혀 다뤄보지 못했지만 플렉스 개발자와 어떻게 의사소통해야 하는지 이해하길 원하는 디자이너나, 디자인 팀에서 받은 멋진 시안을 어떻게 구현할 수 있는지 배우고 싶은 순수 개발자에게 이 책은 좀 더 효과적으로 디자인/개발 협업 관계를 유지하는 비법을 알려줄 것입니다.
물론 어도비는 여기서 멈추지 않을 것이고 플렉스 4부터는 굉장히 멋지고 풍부한 기능을 통해, 디자이너와 개발자들은 함께 한층 더 풍부한 경험을 만들어갈 수 있을 것입니다. 매력적인 애플리케이션을 디자인하고 만드는 방법, 이 책과 함께 한번 시작해보시죠!
- 본문 중에서
