생각보다 쉽네요! 드림위버로 앱 만들기

 

생각보다 쉽네요! 드림위버로 앱 만들기

이문형 저 | 978-89-314-4264-9 | 2012년 7월 9일 | 영진닷컴

* 본문 예제파일 : 홈페이지 자료실 제공

영진닷컴 홈페이지(www.youngjin.com)의 [고객센터]-[도서자료실/CD 다운로드]

:: 책 소개(내용 요약)

드림위버로 손쉽게 앱을 만들자!

프로그래머가 아니여도 정말 쉬운 앱 만들기 

드림위버는 최강의 기능을 보유하고 있는 웹 저작 도구로 다양한 기능과 언어로 작성이 가능합니다. 때문에 디자이너부터 프로그래머까지 다양한 사용자의 요구에 맞춘 기능과 인터페이스를 확보하고 있어 웹 제작에 부족함이 없는 프로그램입니다. 이러한 드림위버에 손쉽게 웹 사이트와 앱 제작을 할 수 있는 기능이 새롭게 추가되어 더욱 강력해졌습니다. 특별한 프로그래밍 지식이 없어도 드림위버만으로 앱을 만들 수 있게 되었습니다.  

새로워진 드림위버 CS5.5는 스마트 기기, 즉 스마트폰과 태블릿 PC에 최적화된 형태로 출력할 수 있는 기능을 보강해 HTML5에 최적화된 작업이 가능합니다. HTML5와 CSS3의 지원이 가장 큰 변화로 볼 수 있는데 웹 사이트, 또는 모바일 앱 형태의 웹 앱 제작의 활용이 가능해 초보자들도 쉽게 웹 사이트와 모바일 앱을 어렵지 않게 만들 수 있습니다. 

이 책에서는 이러한 드림위버 CS5.5의 새로워진 기능을 이용하여 초보자들도 쉽게 웹 사이트와 모바일 앱, 웹 앱 제작을 할 수 있도록 도와줍니다. 웹 디자인의 기초가 되는 색상에 대한 이해를 도와 디자인적인 부분을 강화시키고 웹 문서를 디자인할 수 있는 CSS를 익힌 후 웹 사이트와 모바일 앱, 웹 앱 제작을 진행합니다. 처음부터 고급 기능으로 초보자에게 부담을 주는 진행이 아닌 기초부터 튼튼히 하는 구성으로 초보자들의 학습 집중도를 높입니다.

 

 '생각보다 쉽네요! 드림위버로 앱 만들기 '의 주요 특징은요~

- 프로그래머가 아니여도 드림위버를 이용해 나만의 웹 사이트와 모바일 앱을 만들 수 있습니다.

- ‘Lesson’에 앞서 ‘Intro’를 구성해 ‘Lesson’에서 사용되는 기능이나 설정 방법에 대해 자세히 설명하고 있습니다.

- ‘Special Page’에서 드림위버 CS5.5의 특별한 기능이나 사용 중인 기능과 메뉴를 200% 활용할 수 있는 내용으로 구성했습니다.

:: 저자 소개
 이 문 형

탑매니아 이사/그래피직스 팀장/디자인 포션의 팀장으로 재직했으며 다양한 디자인 분야 프로젝트를 진행했습니다. 현재 한양여자대학교의 교수로 재직 중이며 성균관대학교, 대진대학교, 혜천대학, 명지대학교 사회교육원에 출강 중입니다. 

 [속전속결 드림위버 CS3] , [포토샵 CS4 퀵가이드] , [포토샵 CS 디자인 스쿨]



:: 도서의 구성

Part 1. 앱 제작을 위한 새로운 드림위버 CS5.5 알아보기

드림위버 Cs5.5의 새 기능과 작업 환경에 대해 알아봅니다. 또한 웹 디자인의 기초가 되는 웹 디자인 기초에 대해 알아봅니다. 

Part 2. 드림위버 CS5.5의 기본 기능 알아보기

Part 02에서는 드림위버의 기본 기능에 대해 알아보고, 드림위버에서 가장 중요한 역할을 담당하는 HTML에 대해 알아봅니다. 드림위버를 공부하기 전에 HTML에 대한 충분한 이해가 이루어지는 것도 좋지만 드림위버를 공부하면서 HTML에 대해 이해하는 것도 좋습니다.

 

Part 3. CSS로 웹 문서 디자인하기 

Part 03에서는 CSS를 이용해 문서를 일관성 있게 유지하고 문서별로 CSS를 설정하는 방법에 대해 알아봅니다. 뿐만 아니라 Div 태그를 이용하여 문서를 장식하는 방법에 대해 알아봅니다. CSS는 문서 내에 설정하는 방법과 외부 문서에 설정하는 방법이 있으며, 지정 방식도 다양합니다. 

 

Part 4. 모바일을 위한 드림위버 CS5.5 알아보기 

Part 04에서는 HTML5에 대해 자세히 설명하며 HTML5를 활용하여 웹 사이트뿐만 아니라 웹 앱의 형태를 제작하는 방법을 알아봅니다. 또 태그를 이용하여 페이지가 자유롭게 이동하는 웹 페이지를 만드는 방법과 모바일용 페이지를 자유롭게 구성할 수 있도록 비헤이비어를 활용하는 방법에 대해 알아봅니다. 

Part 5. 모바일 웹 사이트&패키지 제작하기

Part 05에서는 HTML5를 이용하여 모바일용 페이지를 제작하는 방법에 대해 알아봅니다. HTML5를 활용하여 자유자재로 모바일용 페이지를 제작하고, 해당 페이지를 각종 멀티미디어 요소를 삽입하여 페이지를 좀 더 짜임새 있게 구성하는 방법에 대해 알아봅니다. 

Part 6. 드림위버의 기타 기능 활용하기

Part 06에서는 드림위버를 좀 더 활용할 수 있는 드림위버의 기타 기능에 대해 설명합니다. 프레임과 프레임셋, 폼 태그, AP Element, 아이프레임 등 드림위버의 기능 중 사용도가 높은 기능에 대해 설명하고 실제 작업에 활용할 수 있도록 예제를 통해 설명합니다. 

:: 목차

Part 1. 앱 제작을 위한 새로운 드림위버 CS5.5 알아보기
 Intro 01 드림위버 CS5.5의 새 기능 알아보기
 ■ 드림위버 CS5.5의 새 기능
 ■ 드림위버 CS5부터 지원되는 기능
 
 Intro 02 드림위버 CS5.5 알아보기
 ■ 드림위버 CS5.5 시작 화면
 ■ 드림위버 CS5.5 작업 환경 설정
 ■ 나만의 작업 환경 설정

 Intro 03 Insert 패널 알아보기
 ■ Insert 패널의 탭 기능

 Intro 04 웹 디자인 기초와 색상 알아보기
 ■ 웹 디자인을 위한 웹 사이트 레이아웃
 ■ 웹 사이트 포지셔닝
 ■ 웹 디자인을 위한 색채학
 ■ 웹 디자인과 색상

 Lesson 01 드림위버 CS5.5 설치하기
 ■ 드림위버 CS5.5 체험판 설치하기

 Lesson 02 웹 사이트 제작을 위한 사이트 정의하기
 ■ 사이트 정의하기

 Part 2. 드림위버 CS5.5의 기본 기능 알아보기
 Intro 01 드림위버 살펴보기
 ■ 문서 보기 영역 설정하기
 ■ 문서 설정하기

 Intro 02 문서 설정 살펴보기
 ■ 〔New Document〕 대화상자 살펴보기
 ■ 이미지 삽입하기
 ■ Target 설정하기
 ■ 상대 경로와 절대 경로 알아보기

 Lesson 01 문서 만들고 사이트 설정하기
 ■ 새 문서 만들고 사이트 설정하기
 ■ 문서 설정하기
 ■ 문서 저장하고 사이트에 문서 추가하기
 
 Lesson 02 이미지 삽입하고 활용하기
 ■ 문서에 이미지 삽입하기
 ■ 테이블에 이미지 삽입하기

 Lesson 03 동영상 삽입하기
 ■ SWF 파일 삽입하기
 ■ FLV 파일 삽입하기
 ■ 유튜브(Youtube) 동영상 삽입하기
 
 Lesson 04 문자 입력하고 문단 편집하기
 ■ 문자 입력하기
 ■ Heading 태그 적용하기
 ■ Preformatted 태그 적용하기
 ■ 소스 활용하여 문단 구성하기
 ■ CSS 적용하기

 Lesson 05 테이블 활용하기
 ■ 테이블 만들기
 ■ 테이블에 이미지 삽입하기
 ■ 테이블 조정하고 변형하기
 Lesson 06 하이퍼링크 이해하기
 ■ 텍스트에 하이퍼링크 연결하기
 ■ 이미지에 하이퍼링크 연결하기
 Lesson 07 네임앵커로 페이지 이동하기
 ■ 네임앵커 지정하기
 Lesson 08 이미지맵 적용하기
 ■ 테이블과 이미지 삽입하기
 ■ 네임앵커 지정하기
 ■ 미리 보기 웹 브라우저 추가하기

Part 3. CSS로 웹 문서 디자인하기
 Intro 01 CSS로 문서 장식하기
 ■ CSS란?
 ■ 외부 CSS 문서 설정하기
 ■ CSS 설정하고 적용하기

 Lesson 01 Class로 스타일 적용하기
 ■ 테이블 만들기
 ■ 이미지 삽입하고 스타일 적용하기

 Lesson 02 ID로 스타일 적용하기
 ■ 스타일 적용하고 확인하기

 Lesson 03 태그로 스타일 적용하기
 ■ 태그 활용하여 CSS 적용하기

 Lesson 04 외부 CSS 파일로 스타일 적용하기
 ■ 외부 문서 만들고 저장하기

 Lesson 05 Div 태그로 레이아웃 구성하기
 ■ 페이지 레이아웃 구성하기
 ■ 페이지 설정하기
 ■ 페이지 가운데 정렬하기
 ■ 페이지 헤더 설정하기
 ■ 메인 이미지 설정하기
 ■ 콘텐츠 영역 설정하기
 ■ 푸터(저작권) 영역 설정하기

 Lesson 06 Div 태그와 CSS 활용하여 스타일 적용하기
 ■ 헤더 페이지 구성하기
 ■ 메뉴(내비게이션) 만들기
 ■ CSS로 푸터(저작권) 만들기
 ■ 콘텐츠 영역 페이지 설정하기
 ■ 도메인과 호스팅 알아보기

 Part 4. 모바일을 위한 드림위버 CS5.5 알아보기
 Intro 01 비헤이비어로 인터랙티브한 페이지 만들기
 ■ 다양한 기능을 쉽게 적용하는 비헤이비어
 ■ 비헤이비어에서 적용할 수 있는 액션
 ■ 비헤이비어를 이용하여 팝업 메시지 창 만들기
 ■ 비헤이비어 이벤트 설정하기
 
 Lesson 01 모바일을 위한 문서 설정하기
 ■ 일정 시간 이후 페이지 이동하기
 ■ 접속과 동시에 페이지 이동하기
 ■ 비헤이비어 활용하기
 ■ 모바일 접속 시 특정 페이지로 이동하기
 ■ 모바일 기기 해상도 비교하기

 Lesson 02 Div 활용하여 모바일용 웹 사이트 구성하기
 ■ 페이지 전체 영역 설정하기
 ■ 로고 이미지 적용하기
 ■ 타이틀 영역 만들기
 ■ 상품 목록 만들기
 Lesson 03 목록을 활용한 모바일용 웹 사이트 구성하기
 ■ 타이틀 영역 설정하기
 ■ 상품 목록 적용하기
 ■ 목록 태그 적용하기
 ■ 저작권 적용하기
 ■ 목록 형태 자유롭게 설정하기

 Part 5. 모바일 웹 사이트 & 패키지 제작하기
 Intro 01 HTML5란?
 ■ HTML5의 특징
 ■ HTML5 문서 만들기
 ■ 템플릿을 활용하여 HTML5 문서 만들기
 ■ 모바일용 템플릿 페이지 만들기
 
 Lesson 01 모바일용 웹 응용 페이지 만들기
 ■ 모바일용 페이지 만들기
 ■ 페이지 설정하기
 ■ PhoneGap 알아보기

 Lesson 02 이미지를 활용하여 모바일용 페이지 만들기
 ■ 모바일용 페이지 만들기
 ■ 문서 설정하기
 ■ 콘텐츠 삽입하기
 ■ 페이지 확인하고 세부 설정하기

 Lesson 03 모바일용 페이지 추가하기
 ■ 페이지 추가하고 확인하기
 ■ Android SDK 설치하기
 ■ Android 패키지로 저장하기

Part 6. 드림위버의 기타 기능 활용하기
 Intro 01 드림위버의 기타 기능 알아보기
 ■ 프레임과 프레임셋 만들기
 ■ 폼 관련 태그 이해하기
 ■ 점프 메뉴 만들기

 Lesson 01 AP Element와 Behavior 활용하기
 ■ AP Element 설정하기
 ■ Behavior 설정하기

 Lesson 02 아이프레임 삽입하기
 ■ 아이프레임 활용하기

 Lesson 03 아이프레임 활용하여 메뉴 만들기
 ■ 아이프레임 적용하기
 ■ 메뉴 설정하기
 ■ 메뉴 세부 설정하고 확인하기

 Lesson 04 Behavior로 투명한 이미지 만들기
 ■ AP Element 설정하기
 ■ 문서 설정하기

 Lesson 05 AP Element로 퍼즐 효과 만들기
 ■ AP Element 설정하기