본문바로가기

웹 퍼블리셔 & UI 개발 프로페셔널

기초에서 실무까지 포트폴리오 제작 12주/24강

html, css 기초부터 자바스크립트제이쿼리 기초 및 활용, 반응형 웹, 동적 UI 구현, 최종 포트폴리오 사이트 구성까지 학습하는 과정입니다.

수강신청
웹 디자인 포트폴리오
교육일정
2020.10.13 - 2021.01.07
교육시간
화, 목 / 19:00 - 21:50
교육장소
아카데미정글 (강남 신사)
수 강 료
총 135만원 / 월 45만원
(3개월 월별납부,
4개월 후불제 가능)
준 비 물
개인 노트북(권장)

포트폴리오 제작과정

html & css 기초부터
실무 프론트 UI까지 학습하여
나만의 포트폴리오를 제작하는 과정!

  • 개념이 탄탄한 웹퍼블리셔

    기초부터 시작하는 스타트업 과정으로, HTML과 CSS에 대한 기본적인 이해와 다양한 예제를 통해서 개념을 확실 하게 만드는 능력을 키웁니다.

  • 고급 효과를 이용한 사이트 제작

    jQuery/javascript의 기본 원리부터 학습하여 json & xml, ajax를 활용한 실무 프론트 UI를 학습하여 포트폴리오 구축을 위한 스킬을 향상시킵니다.

  • 실무 프로젝트 방식 포트폴리오 제작

    HTML, CSS, Javascript까지 학습하며 UI를 제어하게 되며, 실무 프로젝트 방식 으로 진행하는 포트폴리오를 만들면서 구성 및 피드백을 진행합니다.

실무프로젝트 진행

기본 개념의
체계적인 훈련으로
실무 프로젝트를 진행할 수 있는
웹 퍼블리셔로의
첫 발을 내딛을 수 있습니다.

웹 퍼블리싱 실무 워크샵 Ⅰ : HTML, CSS, 반응형 웹웹 퍼블리싱 실무 워크샵 Ⅱ: 제이쿼리, 자바스크립트, UI 개발 포트폴리오

  • PART 01

    HTML/CSS 파운데이션

  • PART 02

    반응형 레이아웃 응용 실습

  • PART 03

    Jquery & JavaScript

  • PART 05

    실무 프론트
    UI

  • PART 05

    포트폴리오
    구축

"웹 퍼블리셔 & UI 개발 프로페셔널" 과정은 "웹 퍼블리싱 실무 워크샵 Ⅰ : HTML, CSS, 반응형 웹" 워크샵 과정과
"웹 퍼블리싱 실무 워크샵 Ⅱ: 제이쿼리, 자바스크립트, UI 개발 포트폴리오" 워크샵 과정으로 구성되어 있어 나누어 수강할 수 있습니다.

다음과 같은
포트폴리오를 제작합니다.

포트폴리오 레퍼런스 사이트

  • 포트폴리오 레퍼런스 사이트1

    A타입 샘플 포트폴리오 - ajax를 활용한 No reflesh 사이트 구현

  • 포트폴리오 레퍼런스 사이트2

    B타입 샘플 포트폴리오 - fullpage & Parallax를 활용한 원페이지 사이트 구현

수강생 포트폴리오

이런분이
수강하기에 좋습니다.

  • HTML5, 웹 접근성을 포함한
    기술을 습득하고 싶은 분

    HTML, CSS 고유 특성과 작동 원리를
    이해하고 스킬을 습득할 수 있습니다.

  • 디자인에서 퍼블리싱까지
    영역을 확장하고 싶은 분

    디자인된 작업물을 어떻게 코드로 설계
    할지 생각하는 훈련을 합니다.

  • 웹 UI 개발을
    배우고자 하는 디자이너

    웹 클라이언트(서버)에 대한 이해를 통한
    스킬을 향상 시킬 수 있습니다.

  • 웹 퍼블리셔 & UI 개발
    포트폴리오를 제작하고 싶은 분

    1:1 크리틱을 통한 웹 퍼블리셔 &
    UI 개발 포트폴리오를 제작합니다.

CURRICULUM

HTML, CSS, 반응형 웹

  • PART01_
    HTML/CSS 파운데이션
    01강
    • html/css 기초(1)
    • - 강의목표
    • - 웹표준/웹접근성 개요
    • - 구조적 마크업/논리적 마크업
    • - HTML 기초
    • - CSS 기초 문법
      → 선택자
      → text/font 속성
    02강
    • html/css 기초(2)
    • - html 구조적 마크업
      → Block Elements
      / Inline Elements
    • - CSS 기초문법
      → 우선순위
      → 선택자 종류
    03강
    • html/css 기초(3)
    • - form 태그
      → form 요소 다루기
      → form 요소 크로스브라우징
    • - table 다루기
      → 웹 접근성을 고려한 테이블 레이아웃
    04강
    • Layout(1)
    • - 박스모델의 이해
    • - 배경속성
    • - 시멘틱 구조
    05강
    • Layout(2)
    • - UI 영역별 배치
    • - display 속성
    • - float 속성
    • - oveflow 속성
    06강
    • Layout(3)
    • - Navigation 영역별 UI 구조 실습
    • - position 속성
    • - 문서 흐름별 레이아웃 구조 실습
    07강
    • Layout(4)
    • - 콘텐츠별 UI 분석과 제작 실습
    • - transform과 애니메이션 속성
  • PART02_
    응용 실습
    08강
    • 탬플릿으로 구조설계(1)
    • - 상용 사이트콘텐츠 페이지 실습
    • - 효율적인 CSS 스타일링 연습
      → 네이밍/선택자/멀티클래스/
      재사용을 위한 css 분석
    09강
    • 탬플릿으로 구조설계(2)
    • - 상용 사이트콘텐츠 페이지 실습
    • - 효율적인 CSS 스타일링 연습
      → 네이밍/선택자/멀티클래스/
      재사용을 위한 css 분석
    10강
    • 탬플릿으로 구조설계(3)
    • - 상용 사이트콘텐츠 페이지 실습
    • - 효율적인 CSS 스타일링 연습
      → 네이밍/선택자/멀티클래스/
      재사용을 위한 css 분석
    11강
    • 반응형 레이아웃(1)
    • - 반응형 기본 개념
    • - 미디어쿼리와 뷰포트
    • - 반응형 구조
    • - 반응형 페이지 마크업
    12강
    • 반응형 레이아웃(2)
    • - 작업 사이트 반응형 마크업&CSS
    • - jQuery&CSS3 인터렉션 UI 제작

jQuery, JavaScript,
UI 개발 포트폴리오

  • PART03_
    jQuery & JavaScript 기초
    13강
    • 오리엔테이션 및 html 정리
    • - 강의목표
    • - html 기초정리
    • - 개발자도구 활용법
    • - 실습환경 및 에디터 소개
      (vscode, git, github)
    14강
    • css 중급
    • - CSS 기초 정리
    • - display 중급
    • - 선택자 중급
    15강
    • 반응형 웹
    • - 미디어 쿼리
    • - 반응형웹 구현
    16강
    • JavaScript & jQuery 정리(1)
    • - 프로그래밍 기초
    • - UI구현에 필요한 자바스크립트 기본 문법
    • - jquery 메소드
    17강
    • JavaScript & jQuery 정리(2)
    • - jquery 활용
    • - jquery 플러그인
    • - json & xml 활용한 ajax 구현
  • PART04_
    실무 프론트 UI
    18강
    • 자리예약시스템 구현
    • - json을 이용한 비동기 페이지 만들기
    19강
    • 카카오톡 채팅 프론트엔드 구현
    • - keyboard event & append 활용
    20강
    • 클론코딩
    • - 상용사이트 메인 & 서브 페이지 구현
    21강
    • psd to html 코딩
    • - 웹디자인 파일 컷팅과 사이트 구조 잡기
  • PART05_
    포트폴리오 구축
    22강
    • 샘플 포트폴리오 구현1
    • - fullpage & Parallax를 활용한 원페이지
      사이트 구현
    23강
    • 샘플 포트폴리오 구현2
    • - fullpage & Parallax를 활용한 원페이지
      사이트 구현
    24강
    • 샘플 포트폴리오 구현3
    • - fullpage & Parallax를 활용한 원페이지
      사이트 구현

강사 소개

강사
김혜영

현) 엔게디캠퍼스 대표 홍익대학교 영상대학원 인터랙션디자인과 수료

  • 계원예술대학교, 홍익대학교(세종캠퍼스), 공주대학교,
    건국대학교, 서울대학교 출강
  • 아카데미정글 강의
  • 한국디자인진흥원 강의
  • LG 유플러스 어도비 세미나 특강

프로젝트 힐링잼 모바일 UI 디자인

강사
강석희

현) **은행 인터넷뱅킹, 모바일뱅킹 운영 퍼블리싱 PL (전) (주)타란유엑스디
(전) ㈜ 위더스교육(해커스어학원)
(전) (주)기분좋은커뮤니케이션
(전) 라이트브레인

  • 프로젝트
  • KB국민은행 부동산PF 업무시스템 구축
  • 금호건설 전사ERP 재구축
  • 한국예탁결제원 전자증권 구축
  • 국방부 군수시스템 통합구축
  • 신한은행 모바일 브랜치 사이트 구축
  • KB손해보험 카다이렉트 리뉴얼
  • **전자 타이젠 TV 내부보고용 프로토타입

수강후기

  • 수강생 전O선 님

    웹표준과 반응형의 체계적이고도 실무에 적용하기 쉽게 교육이 짜여 있습니다.
    전반적인 웹표준과 반응형 웹도 체계적인 개념을 잡을 수 있고 ,
    이 기반으로 실무에 적용하기 쉽도록 노하우도 많이 얻을 수 있습니다.
    빠르게 습득하고 실무에서 실력 발휘하고 싶으신 분들에게 강추하는 수업입니다!

  • 수강생 현O경 님

    빈틈없이 알차게 실무 위주로 배울 수 있습니다.
    모호했던 html내용에 대해 쉽게 정리하고 정의하며 다시금 재정비하기에 탁월합니다.
    HTML 입문자인 저에게도 느껴질 만큼 선생님의 강의가 잘 정리되어 있고 이해하기 쉽도록 설명해 주시려 노력하는 것이 느껴졌습니다. 실무 위주의 내용이여서 실질적으로 도움이 되었습니다.

  • 수강생 이O정 님

    강의 시간 대비 정말 유익한 수업입니다.
    양보다 질이란 표현이 딱입니다! 그전에 공부할 때 애매했던 부분들을 확실하게 이해하고 정리할 수 있게 되어 많이 도움이 되고, 자바스크립트까지 흥미가 생겨 체계적으로 공부하고 싶어졌습니다.
    기본적인 이해부터 어려운 단계까지 설명이 제대로 된 수업 이었습니다.

  • 수강생 문O은 님

    책으로는 이해할 수 없어 뱅뱅 그 주변만 맴돌았었는데, 강의를 듣고 나니.. 선생님들께서 왠지 가려운 부분을 말하지 않아도 긁어주는 느낌이었어요.
    정말 한 시간도 유익하지 않았던 시간이 없었어요.
    과정 하나 하나에 실무에서 어떻게 사용되는지 잘 알려주셔서 많은 도움이 되었습니다.

결제 방법은 일반결제와 후불제 중 선택할수 있습니다

수강신청 후
결제 방법
일반결제후불제
선택할 수 있어요. 후불제란? > 후불제란? > 후불제 신청 >

01. 일반 결제
  1. 01. 온라인 수강신청

    과정 선택 후 수강 신청을 하시면, 결제 방법과 관련하여 선택하실 수 있어요.

  2. 02. 일반 결제
    • 일반 결제와 관련한 수강료 결제 방법은 다음과 같아요.
    • - 온라인 카드 결제 시 할부 선택이 가능해요. 할부 관련 정보는 아카데미정글 홈페이지에서 확인 가능해요.
    • - 무통장 입금(계좌 이체), 방문 결제(내사 카드)는 분할 납부가 가능해요. 이와 관련해서는 아카데미 정글로 개별 연락 주시면 도와드릴게요.
    • - 결제는 바로 하지 않으셔도 괜찮아요. 마이스터디 페이지에서 이어서 진행할 수 있어요.
  3. 03. 교육

    개강일에 맞추어 문자로 개별 연락이 갈 거예요.
    수강 신청한 강의를 일정에 맞추어 수강하시면 됩니다.

02. 후불제

아카데미정글학생독립만세

  1. 01. 온라인 수강신청

    과정 선택 후 수강 신청을 하시면, 결제 방법과 관련하여 선택하실 수 있어요.
    아카데미정글은 교육비 후불제 솔루션 '학생독립만세'와 함께 교육 종료 후, 교육비를 후불, 분할 납부 하는 후불제 교육을 진행하고 있어요.

  2. 02. 후불제 인증 &계약

    수강료 결제 방법에서 후불제를 선택하시면 후불제 인증 신청을 할 수 있어요.후불제 인증 심사를 통해 후불제 인증 획득 후 학생독립만세에서 후불제 계약과 인증료(교육비의 5% 별도 선납)를 납부해야 해요. 이 과정은 온라인으로 진행돼요.

  3. 03. 교육

    개강일에 맞추어 문자로 개별 연락이 갈 거예요.
    수강 신청한 강의를 일정에 맞추어 수강하시면 됩니다.

  4. 04. 결제

    후불제는 교육이 종료된 후, 계약 기간 내에 교육비를 납부 해야 해요.

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

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

이 과정은 강사님이 실무에 계시기 때문에
정확한 다음 기수 강의 일정을 사전에 공지해 드리기 어려워요.

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

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

오시는 길

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

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

웹퍼블리셔 & UI 개발
프로페셔널(39기)

  • 디지털 캐릭터 일러스트레이션 아카데미
  • 교육일정
    2020.10.13 - 2021.01.07
    교육시간
    화, 목 / 19:00 - 21:50
    교육장소
    아카데미정글 (강남 신사)
    수 강 료
    총 135만원 / 월 45만원
    • - 온라인 카드 결제시 2~6개월 무이자 할부 가능
    • - 월 45만원씩 3개월 분할 납부 가능: 계좌이체, 방문(내사카드)결제
    • - 월 337,500원씩 4개월 후불제 가능: 교육 종료 후 4개월 분납(학생독립만세)
    준 비 물
    개인 노트북(권장)
    휴강일자
    12/24(목), 12/31(목)