본문바로가기

오픈예정

웹 디자인 & 웹 퍼블리싱
스페셜리스트

  • 디자인 프로젝트 실습
  • 반응형 웹 제작
  • 주 2회 - 4회 /36강

웹 디자인을 하는 방법론을 배우고 실제로 디자인을 하는 실무 과정으로, 디자인 포트폴리오를 만들고 퍼블리싱 포트폴리오를 웹에 올려 서비스까지 진행하는, 디자인과 퍼블리싱을 함께 배우는 과정입니다.

반갑습니다,
아카데미정글입니다 😃
웹 디자인 & 웹 퍼블리싱 스페셜리스트 공지사항을 확인해주세요!

교육일정

강의 준비중입니다.

교육시간

주 4회 9주

교육장소

아카데미정글 (강남 신사)

수 강 료

총 180만원 / 월 60만원 (3개월 월별 납부 가능)

결제방법
  • 1. 온라인 카드 : 2 ~ 6개월 무이자 할부 가능
    (👉무이자카드 할부 안내)     2. 내사카드(방문결제)
    : 월 60만원씩 3개월 분할 납부 가능     3. 무통장 입금(계좌이체)
    : 월 60만원씩 3개월 분할 납부 가능
준 비 물

개인 노트북(권장)

🔊 강의 관련 공지사항

  • 오프라인 현장 교육

    아카데미정글 강의는 오프라인 대면 수업으로 진행됩니다.

  • 영상과 수업 자료 공유

    수업 복습 및 결석 대비 수업 관련 영상과 자료를 제공해 드립니다.

  • 1:1 크리틱 진행

    1:1 크리틱을 통해 완성도 높은 개인 포트폴리오를 제작해요.

🎁 강의 수료자 특별 커리어 코칭

강의 수료자에게 다음과 같이 아카데미정글만의 취업 지원을 해드립니다.
  • 1. 이력서 첨삭 및 자기소개서 첨삭, 면접 준비 지원

    강의 수료 후 취업을 원하는 경우, 작성한 이력서 및 자소서를 제출해 주시면 첨삭해 드리며, 면접 준비 지원 요청시 모의 면접을 진행합니다.

  • 2. 개인별 커리어 코칭

    강의 수료 후 커리어 코칭을 요청하시면, 상담을 통해 수료자에게 맞는 UX/UI 기획 분야, UX/UI 디자인 분야, 프론트엔드 개발 분야에 대한 커리어 코칭을 진행합니다.

  • 3. 직무 능력에 맞는 1:1 취업 지원

    취업을 위한 역량 및 포트폴리오가 준비되어 구인 의뢰 기업에 맞는 직무 능력 수료자에게는 1:1 취업 지원을 해 드립니다.

디자인과 퍼블리싱, 처음 배우는 분이라면?
웹 디자인과 웹 퍼블리싱을 함께 배우는 웹 디자인 & 웹 퍼블리싱 스페셜리스트 과정을 소개합니다👏

  • 웹 디자인 프로젝트
  • 웹 퍼블리싱 프로젝트
  • 디자인, 퍼블리싱 포트폴리오 제작

웹 디자인 트렌드와 웹 퍼블리싱 기술을 학습하는 과정으로, 처음 배우는 분들도 배울 수 있는 기초 과정이에요.
비즈니스 목표에 따른, 프로젝트 중심의 실습을 통해 중급 이상의 실력을 키워 실무 웹 사이트를 제작할 수 있는 능력을 키워 디자인, 퍼블리싱 포트폴리오를 제작해요.

디자인과 퍼블리싱을 함께 배우는 과정,
왜 아카데미정글일까요?

  • 디자인 실습물과 코딩까지

    웹 사이트 기획부터 시작하여 디자인 하는 방법을 배워 디자인 기본 원리를 베이스로 디자인을 진행하고 퍼블리싱 실무 기술로 포트폴리오 코딩까지 진행하여 웹에 올려 서비스까지 해보는 실제적인 과정으로, 베이스부터 차근차근 배울 수 있어요.

  • 실무를 반영한 프로젝트 실습

    실무 경험 다수의 강사님들이 이론적인 디자인, 퍼블리싱 스킬 뿐 아니라 실무에서 유용하게 사용할 수 있는 다양한 실무 팁과 실무에서 어떻게 응용할 수 있는지 알려드려요. 실무를 반영한 실습을 바탕으로 실무에서 빠르게 적용할 수 있어요.

  • 강사 크리틱을 통한 포트폴리오 제작

    디자인은 사용성에 기반을 두고 있으며, 실제적인 기술력을 바탕으로 디자인 되어야 해요. 내가 기획하고 디자인 한 디자인 시안물을 바탕으로 코딩을 거쳐 웹의 동적 구현까지, 강사님의 크리틱을 통해 디자인, 퍼블리싱 포트폴리오를 제작해요.

완성도 높은 반응형 웹 디자인 & 퍼블리싱,
실무자에게 배워 실무에 바로 적용 가능한 실무 스킬을 습득할 수 있습니다.

  • 😮 디자인과 퍼블리싱을 함께 배워야 하는 이유가 있나요?

    👉 디자이너가 퍼블리싱에 대한 개념이 없다면 각각 따로 놀게 됩니다. 이는 퍼블리싱 제작에도 큰 어려움이 있으며, 효율성이 상당 부분 떨어집니다. 특히나 반응형 사이트를 제작함에 있어서는 디자이너는 퍼블리싱의 기술적 베이스를 가지고 있어야 기기별 대응하는 반응형 디자인을 제작할 수 있어요.

  • 🤔 트렌드에 어울리는 스킬을 습득할 수 있을까요?

    👉 시간이 갈수록 css3나 최신 기술들의 장벽이였던 비웹표준을 지향했던 브라우저들의 퇴장이나 None-activeX 정부정책과 모바일 시장의 활성화 등의 이슈로 인해 웹의 동적구현을 위한 트렌드와 시장의 요구가 커져가며 그에 맞는 스킬을 현업 실무에 계신 강사님들께 배울 수 있어요.

  • 😶 수업은 어떻게 진행되고 어떤 포트폴리오를 제작하나요?

    👉 퍼블리싱이 어떻게 구현되는지 개념이 있으면 실제적인 사이트를 제작할 때 이를 베이스로 디자인을 정확히 할 수 있어요.
    이 과정에서는 포트폴리오 사이트라는 구체적인 방향을 제시해 드리면서 과정에서 배우는 부분들을 실무에서도 활용할 수 있도록 도와 드릴거예요.

강의를 이끌어주실 김혜영, 황선수 강사님을 소개합니다 ✋

강사
김혜영

현) 엔게디캠퍼스 대표 전) 계원예술대학교 디지털미디어디자인 전임교수
전) 서울대학교, 홍익대학교, 건국대학교, 경희대학교 출강
홍익대학교 인터랙션디자인(석사)

  • 프로젝트
  • 산업인력공단 웹사이트 리뉴얼
  • 힐링잼 모바일 UI 디자인
  • 한국사이버대학교 이러닝 콘텐츠 디자인 & 개발
  • 프라임정보통신(테크노마트) 이벤트 게임 개발
  • KOREA 2007 FIFA U-17 World Cup Korea 개발
  • 한국 산업안전공단 E-러닝 교육 컨텐츠 디자인 & 개발
  • 존슨앤존슨 의료콘텐츠 개발
강사
황선수

(전) (주)위메프 W마인드실 추천서비스 개발팀
(전) 엔에이치엔테크놀로지서비스(주) UIT개발실 UI개발4팀
(전) (주)블루웨이브컨설팅 웹표준화그룹
(전) (주)인실리코젠 지식관리사업부

  • 프로젝트
  • 위메프 W우체통, W추천, 톡상담
  • NAVER 스마트스토어, 블로그, 부동산, 지식iN, SmartEditor 3.0

👨‍🏫 강사님이 이야기하는 "웹 디자인 & 웹 퍼블리싱 스페셜리스트를 꼭 수강해야 하는 이유"

  • 👉 첫번째, 스스로 할 수 있도록 가이드하고 훈련하는 과정

    디자인과 퍼블리싱을 처음 배우는 분들이라면 두 가지를 함께 배워야 디자인을 할 때, 퍼블리싱을 할 때 각각의 개념을 정확히 이해하고 실무에서 적용할 수 있어요. 이 과정은 본인이 웹 사이트를 실무와 동일한 방식으로 기획부터 디자인을 진행하여 디자인 포트폴리오를 완성합니다. 디자인 및 퍼블리싱 실무 방법론을 통해 다양하게 응용할 수 있는 방법을 배웁니다.

  • 👉 두번째, 실무 위주의 실습을 바탕으로 포트폴리오 제작

    수업에서 진행되는 예제는 단순히 학습을 위한 예제가 아닌 실무에서 쓰이는 실무 예제 위주의 실습을 진행하기 때문에 실무 프로세스를 경험할 수 있어요. 실제 사이트를 디자인 해 보고, 이를 바탕으로 포트폴리오 사이트를 구축함에 있어 실무에 필요한 내용들을 이론적으로 정리하고 실무 예제 실습을 통해 직접 경험해 볼 수 있어요.

디자인과 퍼블리싱을 함께 배우는 웹 디자인 & 웹 퍼블리싱 스페셜리스트 과정에서는
다음과 같은 내용을 배우고 프로젝트를 수행합니다.

과정을 통해 웹 디자인과 웹 퍼블리싱 결과물을 제작합니다.

  • 웹 디자인

    좋은 디자인을 하기 위해 컬러, 그리드, 타이포그래피, 레이아웃, 아이콘 등 기본적 시각 요소와 관련된 이론적 베이스를 바탕으로 실무 디자인을 해요.
    디자인은 어도비 포토샵이나 일러스트레이터의 툴을 활용하여 비주얼 작업을 하고, XD를 활용하여 화면을 설계하고 디자인을 완료하여 프로토타입을 제작하게 됩니다.
    이때 기본적인 웹 가이드라인과 사용성을 바탕으로한 사용자 중심 디자인에 대한 이론을 바탕으로 디자인해요.
    그리드에 대한 기본적인 이해, 레이아웃의 이해, 타이포의 이해, 컬러에 대한 이해를 실제 사례를 통해 이해하고 레퍼런스를 분석하는 방법을 통해 자신의 디자인의 퀄리티를 높이도록 학습해요.

  • 웹 퍼블리싱

    실제로 서비스 되고 있는 사이트의 기술 분석을 하고, 각각 필요한 실무 기술을 학습해요.
    Html, CSS의 개념을 정확히 이해하고, 웹표준, 웹 접근성에 맞추어 마크업하는 방법을 배워요.
    또한 인터랙티브 영역을 담당하는 Javascript의 기본 개념 및 문법을 이해하고 실무에서 많이 활용되는 것을 중심으로 실습하여 최종으로 웹 사이트를 제작 완료합니다.
    반응형 레이아웃의 기본 개념을 익히고 반응형 페이지의 구조,마크업을 바탕으로 웹 사이트 클론코딩 및 포트폴리오를 진행해요. 실무 사례를 기반으로 제작하며 호스팅을 통해 서버에 올려 실제적인 사이트 운영하는 방법에 대한 가이드를 학습해요.

수강생들이 제작한 포트폴리오를 소개합니다.

  • 권O민 수강생 포트폴리오
    샤넬 반응형 웹사이트 리디자인 권O민 수강생 포트폴리오
    닫기
  • 이O석 수강생 포트폴리오
    한국 오피셜 웹사이트 리디자인 이O석 수강생 포트폴리오
    닫기
  • 윤O원 수강생 포트폴리오
    닥터마틴 웹사이트 리디자인 윤O원 수강생 포트폴리오
    닫기
  • 배O희 수강생 포트폴리오
    YBN 전화·화상 웹사이트 리디자인 배O희 수강생 포트폴리오
    닫기
  • 마O영 수강생 포트폴리오
    니베아 웹사이트 리디자인 마O영 수강생 포트폴리오
    닫기

황선수 강사님이 참여하신 프로젝트를 소개합니다.

이런 분들을 위한 강의로,
완강 후 여러분은
다음과 같이 성장할 수 있어요👍

  • 디자이너 & 퍼블리셔가
    되고 싶은 분

    기초부터 차근차근히 웹 디자인의 기본 개념과 트렌드, 퍼블리싱의 기본과 실무에서 활용되는 주요 기술을 꼼꼼하고 제대로 학습 할 수있어요.

  • 논리적인 디자인 커뮤니케이션을
    하고 싶은 분

    웹 디자인과 웹 퍼블리싱을 함께 배워 실무에서 발생하는 다양한 사례를 바탕으로 문제 정의를 통해 논리적인 디자인 방법론을 통한 디자인법을 학습해요.

  • 실무형 반응형 웹 사이트를
    만들고 싶은 분

    실제로 서비스 되고있는 사이트의 기술 분석을 배우고, 검색 엔진 최적화, 도메인 및 호스팅까지 진행하여 실제적인 사이트 운영을 배울 수 있어요.

  • 웹 기술 및 트렌드 학습을
    원하는 분

    다양한 웹 트렌드를 살펴보고 기본적인 웹 가이드 라인과 사용성을 바탕으로 사용자 중심에 대해 학습하고, 실무적인 퍼블리싱 방법을 배워요.

🤚 잠깐, 이 과정이 나에게 맞는 과정인지 아직 고민중이신가요?
아카데미정글 커리큘럼 로드맵을 통해 나에게 맞는 과정인지 확인해보세요! 커리큘럼 로드맵 보러가기

초급 중급 고급
UI/UX 기획 라이트브레인 UX 기획 아카데미
UI/UX School
UI/UX 디자인 UI/UX 모바일 앱
디자인 포트폴리오		 UI/UX 디자이너
취업 아카데미
타잔스쿨
UI/UX 웹
디자인 포트폴리오
웹 디자인 & 웹 퍼블리싱 스페셜리스트

웹 디자인 파트

웹 퍼블리싱 파트

👇 4개의 파트로 구성된 36강의 커리큘럼을 확인해보세요.

  1. 상세히보기

    PART 01 WEB DESIGN

    • 01강
      • 프로젝트 Overview
      • 1. 추천 사이트 및 레퍼런스 가이드
      • 2. 프로젝트 Brief 작성 : Project Overview
      • 3. 프로젝트 목표 및 문제 발견 : Project Goal
      • 4. Research 방법 & 실습 _ 사용자, 경쟁사, 콘텐츠
      • 5. 1차 Reference 조사 분석
    • 02강
      • IDEATION
      • 1. 기초데이터 수집 및 콘텐츠 구성
      • 2. 콘텐츠 수집 및 내용 분석
      • 3. 기초 정보 구성 설계 - 콘텐츠 분석 및 적용
      • 4. 차별화 전략 수립 - 차별화 전략과 아이덴티티 수립
      • 5. 2차 Reference 조사 분석
        - 차별화 전략을 통한 2차 레퍼런스 조사
      • 6. Ideation & 아이디어 스케치
      • 7. 마인드맵, 어피티니 다이어그램, 강제 연결법 등
    • 03강
      • 컨셉 도출
      • 1. 제작 및 컨셉방향 수립
        - Ideation을 통한 컨셉 방향 수립
      • 2. 컨셉 도출(무드보드) - 레퍼런스를 통한 컨셉 시각화
      • 3. Tone & Mannnner
        - 컬러 이미지맵(형용사) 등을 통한 컬러 가이드
      • 4. 정보구조설계(IA Information Architecture)
        - 사이트맵 작성
      • 5. 와이어프레임 & UI 개발(인터랙션 설계)
    • 04강
      • 프로토타입 제작
      • - 프로토타입 제작(UI설계&인터랙션)
    • 05강
      • 디자인과 레이아웃 1
      • 1. 웹사이트 서체 운영 이해
        - 자간, 행간, 타이포 시스템의 이해
        - 시스템 폰트, 이미지 폰트, 웹폰트
      • 2. 비주얼요소 디자인 제작
        - 메인 이미지, 배너 제작
      • 3. 디자인 구성 요소의 이해와 제작
        - 노리적 분석을 통한 콘텐츠 구조화 디자인 하기
        - 그룹화 요소의 이해, 레이아웃의 이해
      • 4. 여백과 그리드, 아이콘 소스 활용 및 제작
    • 06강
      • 디자인과 레이아웃 2
      • 1. 웹 화면과 반응형 사이트의 레이아웃 이해
      • 2. 사용자와 레이아웃의 이해
      • 3. F레이아웃과 Z레이아웃의 이해(아이트래킹)
      • 4. 스크롤 이벤트와 패럴렉스의 이해
      • 5. 반응형 & 모바일 디자인
        - 가변크기와 고정크기의 이해
      • 6. 미디어쿼리에 의한 레이아웃의 변화 이해
      • 7. 디바이스별 해상도 이해
    • 07강
      • 디자인과 레이아웃 3
      • 1. 논리 픽셀과 물리 픽셀의 이해
      • 2. 배율 디자인과 반응형 레이아웃의 이해
      • 3. 마이크로 인터랙션의 이해
      • 4. 디자인 스타일 가이드(style-tiles),
        가이드의 개념과 필요성
      • 5. 컬러, 타이포그라피, 이미지, 패턴 시스템
      • 6. 디자인 스타일 가이드(style-tiles) 작성
  2. 상세히보기

    PART 02WEB DESIGN PROJECT

    • 08강
      • 반응형 웹사이트 개인 포트폴리오 디자인 제작 1
    • 09강
      • 반응형 웹사이트 개인 포트폴리오 디자인 제작 2
    • 10강
      • 반응형 웹사이트 개인 포트폴리오 디자인 제작 3
    • 11강
      • 반응형 웹사이트 개인 포트폴리오 디자인 제작 4
    • 12강
      • 반응형 웹사이트 개인 포트폴리오 디자인 제작 5
  3. 상세히보기

    PART 03WEB PUBLISHING

    • 13강
      • 오리엔테이션
      • 1. 강의 소개
      • 2. 직무소개
      • 3. 크롬 개발자 도구 활용
      • 4. VS Code 활용
    • 14강
      • HTML 기초
      • 1. Html 기본 구조
      • 2. HTML 주요 태그
      • 3. block, inline, inline-block
    • 15강
      • CSS 기초 (1)
      • 1. 스타일적용방법
      • 2. 선택자
      • 3. 박스모델
      • 4. 웹폰트
    • 16강
      • CSS 기초 (2)
      • 1. 레이아웃
      • 2. display, float, position, z-index
    • 17강
      • 반응형 레이아웃
      • 1. 반응형 기본 개념
      • 2. 반응형 적용 (미디어쿼리)
    • 18강
      • HTML & CSS 활용
      • 1. 레이아웃, UI요소 커스텀 제작 실습
    • 19강
      • CSS 심화
      • 1. flex
      • 2. transform
      • 3. transition
      • 4. animation
    • 20강
      • UI 요소 포트폴리오
      • 1. table
      • 2. form
      • 3. list
    • 21강
      • 프로모션 포트폴리오
      • 1. 프로모션 페이지 제작 실습
    • 22강
      • 반응형 웹사이트 포트폴리오 (1)
      • 1. Main 페이지 제작 실습
    • 23강
      • 반응형 웹사이트 포트폴리오 (2)
      • 1. Detail 페이지 제작 실습
    • 24강
      • JQuery 기초
      • 1. 기본 설명 및 적용 방법
      • 2. 인터렉션 기능 추가
      • 3. 플러그인 적용
  4. 상세히보기

    PART 04 포트폴리오 구축 및 UI개발

    • 25강
      • 오리엔테이션 및 포트폴리오 준비
      • 1. 강의소개
      • 2. 개인 포트폴리오 기획
      • 3. 일정 수립 및 화면 설계
      • 4. 벤치마킹 사이트 선정
    • 26강
      • 포트폴리오 제작
      • 1. 인트로 사이트 제작
      • 2. Notion 활용
      • 3. fullPage.js 활용
      • 4. Mockup 템플릿 활용
    • 27강
      • JavaScript & jQuery 기초
      • 1. 기본 설명 및 적용 방법
      • 2. 자료형
      • 3. 변수
      • 4. 함수
      • 5. 연산자
      • 6. 조건문/반복문
      • 7. 선택자
      • 8. 클래스 추가/삭제
    • 28강
      • JavaScript & jQuery 주요 API (1)
      • 1. Click Event
      • 2. Mouseenter, Mouseleave
      • 3. Mouseover, Mouseout
    • 29강
      • JavaScript & jQuery 주요 API (2)
      • 1. Animate
      • 2. Prepend, PrependTo
      • 3. Append, AppendTo
    • 30강
      • JavaScript & jQuery 주요 API (3)
      • 1. Resize
      • 2. Scroll
      • 3. SetTimeout, SetInterval
    • 31강
      • 실전 UI 활용 (1)
      • 1. CSS Animation 활용
      • 2. 패럴렉스 UI
    • 32강
      • 실전 UI 활용 (2)
      • 1. 스와이퍼 캐러셀
      • 2. 캐러셀 옵션 활용
    • 33강
      • 실전 UI 활용 (3)
      • 1. 스크롤 이벤트 애니메이션
      • 2. 마우스 커서 이벤트 애니메이션
    • 34강
      • 브랜드형 원스크롤 홈페이지 구축 실습 (1)
      • 1. 레이아웃 분석
      • 2. 마크업 & CSS
    • 35강
      • 브랜드형 원스크롤 홈페이지 구축 실습 (2)
      • 1. 리팩토링 및 실전 UI 활용 적용
    • 36강
      • Git 기초
      • 1. Git 기초
      • 2. Github Desktop 활용
      • 3. Github Pages로 포트폴리오 호스팅하기

수강생들이 직접 작성한 수강후기를 통해 전반적인 수업 분위기를 확인해보세요.

수강 신청하기 전, 예비 수강생 여러분께 전합니다.

  • 01

    난이도는 처음부터 시작합니다. 과정의 끝은 중급 이상을 위해 달려갑니다. 초급자를 대상으로 하여 실무 웹사이트를 제작할 수 있도록 하는 과정입니다. 성실 하게 공부한다면 기대 이상의 결과물을 얻을 수 있을 것입니다.

  • 02

    이 과정은 스스로 할 수 있도록 가이드 하고 훈련하는 과정입니다. 정말로 사이트를 제대로 디자인해보고 싶은 분, 본인이 스스로 코딩해서 사이트를 제작하고 싶은 분들이 꼭 들어야 하는 과정입니다.

  • 03

    강사님이 가지고 있는 지식을 전수하며, 가르침에 있어서는 친절하게 성심껏, 아낌없이 가르쳐 드릴 거예요. 그래서 학생들이 강사님과 수업하고나면 많은 것을 얻어가게 됩니다.

  • 04

    강의장에 공용 PC가 준비되어 있지만, 가급적 노트북을 가져오길 권장합니다. 강의장 PC에는 Adobe CS6 프로그램이 준비되어 있어, 과정을 수강하는데 불편할 수 있어요.

다음기수 개강 알림문자 신청, 뉴스레터 신청

🙋 이번 기수는 듣지 못해
아쉬워하는 분들을 위해
준비했어요.

해당 강의의 정확한 다음 기수 강의 일정을 사전에 공지해 드리기 어려워요.

👉 대신, 다음 기수 개강 알림 문자를 신청하시면 새로운 기수 개강일과 관련한 문자를 보내 드릴게요. 👉 아카데미정글의 보다 다양한 강의 개강 일정이 궁금하시다면, 뉴스레터를 신청해주세요.
매주 발행되는 뉴스레터를 통해 아카데미정글의 강의 개강 일정을 메일로 보다 편리하게 확인하실 수 있어요.

다음 기수 개강 알림 문자 신청하기아카데미정글 뉴스레터 신청하기

🔎 오시는 길은 다음과 같아요.

아카데미정글은 3호선 신사역 5번출구에서 도보 약 3분 거리입니다.
신사역 5번 출구에서 뒤에 GS주유소를 오른편에 두고 큰 도로를 직진하셔서 본스타트레이닝센터(연기학원)가 있는 건물(원능프라자) 2층으로 오시면 됩니다.
수강생 분들은 주차장 이용이 불가하오니 대중교통을 이용해주시길 바랍니다.

수강신청 전, 꼭 확인해주세요. 더보기

웹 디자인 & 웹 퍼블리싱
스페셜리스트 오픈예정

  • 웹 디자인 & 웹 퍼블리싱 스페셜리스트

    아카데미정글은 코로나19 바이러스에 대응한 철저한 예방조치로 학원 방역을 확대해 수강생들이 안전한 환경에서 학습할 수 있도록 노력하고 있습니다.

  • [웹 디자인 & 웹 퍼블리싱 스페셜리스트: 29기]
    교육일정
    강의 준비중입니다.
    교육시간
    주 4회 9주
    수 강 료
    총 180만원 / 월 60만원 3개월 분할 납부 가능

TOP