채널톡 아이콘

실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)

실전! 웹사이트제작 Step By Step! 크루알라모드(https://crewalamode.com/) 메인페이지를 그대로 제작해 보는 과정입니다. 사이트에서 담고 있는 화려한 인터렉티브 웹을 그대로 제작, 구현해 보는 과정으로 복잡한 레이아웃도 쉽고 빠르게 제작하는 실무 핵심 노하우를 그대로 알려드립니다.

초급자를 위해 준비한
[프론트엔드, 웹 퍼블리싱] 강의입니다.

이런 걸 배울 수 있어요

  • 실무에 적합한 레이아웃 제작 방법!

  • 풀사이즈 동영상이 들어간 반응형 웹사이트 제작 방법!

  • 스크롤 애니메이션 적용 방법!

  • 스크롤시 디자인이 변경되는 헤더와 이미지 애니메이션!

  • 글자별 텍스트 애니메이션!

  • GNB 오픈메뉴 제작 방법!

직접 따라 만들며 배우는 웹 사이트!
J.영과 함께 클론 코딩에 도전해보세요.

HTML/CSS만 알아도
인터랙티브 웹 제작 OK!

이 강의는 HTML과 CSS에 대한 기본 지식을 갖춘 분들을 대상으로 실제 웹페이지를 그대로 구현하며 진행됩니다. 


Step By Step!
지금 바로 시작하세요.

웹페이지 제작에 필요한 jQuery의 기초부터 활용까지 배울 수 있으며, 다양한 라이브러리와 플러그인을 활용하여 단시간에 멋있고 화려한 웹페이지를 제작할 수 있도록 여러분을 도와드립니다.

 

실무에서 꼭 필요로 하는 인터렉티브 요소들로 구성된 웹페이지 강의를 통해 업무 스킬과 실무 핵심 노하우를 한번에 얻을 수 있습니다.

실무는! 속도전이며, 확장성입니다.
작업시간 내에 빠르게, 고퀄리티의 프로젝트를 완료하시는 분만이 실력있는 디자이너, 퍼블리셔로 인정받고 대우받을 수 있습니다.

포메인 사이트를 함께 만들어 보면서, 화려한 웹사이트도 빠르게 제작해나갈 수 있는 노하우를 익혀보세요!


 

  1. HTML/CSS를 통한 초간단 레이아웃 작성법
  2. Transform을 활용한 다양한 호버(Hover) 효과
  3. 스크롤에 따라 디자인이 변경되는 헤더
  4. 플러그인을 활용한 텍스트 애니메이션
  5. 스크롤에 따라 진행되는 애니메이션
PC/Tablet/Mobile 기기별 반응형 페이지뷰
개발자도구 활용법


20년 경력의 실무+강의 노하우
J.young

안녕하세요? J.young입니다.

20여년간 웹 디자인 & 앱 개발 회사에서 디자인팀 총괄로 팀을 운영하며, 틈틈히 대학과 학교 및 직업훈련기관에서 UIUX디자인, 웹디자인, 웹퍼블리셔, 프론트엔드 개발 강의를 하고 있습니다. 디자인이나 코딩에 대한 기초가 전혀 없는 학생들을 대상으로 웹디자이너/퍼블리셔 등 전문가 양성을 위해

  • 기초부터 실무까지!
  • 실무에서 원하는!
  • 실무에서 바로 써 먹을 수 있는 포트폴리오 제작!

강의를 진행하며 전문가로써 당당히 실무에 진출할 수 있도록 지도하고 있습니다. 그런 만큼 많은 제자들이 현직 디자이너로, 퍼블리셔로 그 역량을 발휘하고 있습니다.

  • 웹디자이너나 퍼블리셔가 되고 싶어도 어디서부터 어떻게 시작할지 막막하신 분들
  • 이직을 위한 정규코스 학원을 다니고 싶어도 직장생활로 인해 엄두도 못 내시는 분들
  • 코딩의 ‘코’자도 모르시는 분들
  • 학원이나 유튜브 등으로 HTML/CSS 기초는 배웠지만 도통 웹사이트제작이 남의 이야기이신 분들

오픈채팅방운영

보다 원활한 학습을 위해, J.young이 운영하는 잘난웹디 오픈채팅방에 가입하시면,
피그마, UI.UX, 코딩, 포트폴리오제작 관련 핵꿀팁과 무료웨비나 링크 등을 공유해드립니다.

오픈채팅방명 : 잘난웹디
코드 : jyoung

실무 경력

  • 2015~2017 (주)엘리에셀 총괄이사
  • 2003~2015 (주)어뮤징웨어 총괄이사
  • ~2003 서우씨앤디 디자인실장

강의 및 기타 경력

  • 잘난웹디 유튜브 운영 중
  • 인천문예전문학교 (멀티미디어 웹 강의) 
  • 서울현대직업전문학교 (스마트 웹/앱 강의) 
  • 폴리텍대학 (디자인강의)
  • 한국IT전문학교 (멀티미디어 디자인 강의)
  • 두드림직업전문학교 (디자인 강의)
  • 광명시여성비전센터 (웹디자인 강의) 
  • 이젠컴퓨터학원강의 분당점 (디자인 강의)
  • 더조은컴퓨터아카데미 서초점 ([웹디자인기능사]디지털 웹 & 앱 디자인 - 과정평가형자격-A)
  • 이젠 DX아카데미(강남점) (피그마, UIUX, 프론트엔드강의)  

 

 

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • HTML/CSS 기초는 있으나 웹페이지 제작이 두려우신 분

  • 웹디자이너, 퍼블리셔로 취업을 위해 빠르게 포트폴리오를 제작하고 싶으신 분

  • 웹에서 필요로 하는 jQuery 소스를 익히고 싶으신 분

  • JavaScript 기초 없이 실무에서 필요로 하는 인터랙티브 웹을 손쉽게 구현하고 싶으신 분

  • 현재 그래픽 디자이너로 프론트엔드 개발자나 퍼블리셔로 전향하고 싶으신 분

  • 웹디자이너로서 업무 스킬을 향상시키고 싶으신 분

  • 확장성을 고려한 인터랙티브 웹을 빠르게 구현하고 싶으신 분

선수 지식,
필요할까요?

  • HTML / CSS 기초

안녕하세요
J.영입니다.

6,226

수강생

233

수강평

211

답변

4.9

강의 평점

14

강의

 안녕하세요? J.young 임자영입니다.

20여년간의 웹디자인 & 앱개발회사를 운영하며, 대학과 전문학교 및 직업훈련기관에서 UI.UX디자인,웹디자인, 웹퍼블리셔, 프론트엔드개발 강의를 하고 있습니다.

디자인이나 코딩에 대한 기초가 전혀 없는 학생들을 대상으로, 전문가(UI.UX디자이너/ 퍼블리셔/코딩하는 디자이너) 양성을 위해!!
- 기초부터 실무까지!
- 실무에서 원하는!
- 실무에서 바로 써 먹을 수 있는 포트폴리오 제작! 강의로 전문가로써 당당히 실무에 진출할 수 있도록 지도하고 있습니다.

그런 만큼... 많은 제자들이 실무자로써의 그 역량을 발휘하고 있습니다.

-UI/UX디자이너, 퍼블리셔, 프론트엔드개발자가 되고 싶어도 어디서 부터
어떻게 시작할지 막막하신 분들..
- 이직을 위한 정규 코스 학원을 다니고 싶어도 직장 생활로 인해 엄두도 못 내시는 분들..
- 코딩에 '코'자도 모르시는 분! 학원이나 유튜브 등으로 HTML/CSS기초는 배웠지만 -
도통...웹 퍼블리싱 개발 구현이란 남의 이야기이신 분들....

J.young이 도와드리겠습니다.!!
또한!! 학습하시다 궁금하신 점 있으시면 댓글 남겨주시면
도움이 드릴 수 있는 답을 드리도록 최선을 다하겠습니다.

* 오픈채팅방운영

보다 원활한 학습을 위해, J.young이 운영하는 잘난웹디 오픈채팅방에 가입하시면,
피그마, UI.UX, 코딩, 포트폴리오제작 관련 핵꿀팁과 무료웨비나 링크 등을 공유해드립니다.

오픈채팅방명 : 잘난웹디
코드 : jyoung

 

실무경력

- 2017~현) 웹개발 Director
- 2015년~2017년(주)엘리에셀 총괄 이사
- 2003년~2015년 (주)어뮤징웨어 총괄 이사
- 2003년: 서우씨앤디 디자인실장


- 현) UIUX & 웹포트폴리오 강의 진행 중(실무 진출 90프로 이상)

 

감사합니다^^ 


운영중인유튜브

잘난웹디
https://www.youtube.com/channel/UCISuuIbv_SnkE6d4oDgrBWQ

더보기

커리큘럼

전체

19개 ∙ (3시간 5분)

해당 강의에서 제공:

수업자료
강의 게시일: 
마지막 업데이트일: 

수강평

전체

4개

5.0

4개의 수강평

  • 초록

    수강평 6

    평균 평점 5.0

    5

    84% 수강 후 작성

    깔끔한 진행과 자세한 설명으로 따라가기 수월했습니다. 좋은 강의 잘 듣고 갑니다!

    • J.영
      지식공유자

      chfhdvlcl님 높은 수강평 감사드립니다. 본강의를 활용하여 웹사이트제작에 많은 도움이 되셨으면 합니다. 대방사이트와 뮤자인사이트 강의도 실무 활용에 많은 도움이 되리라 생각됩니다. 다시한번 응원드립니다. 감사합니다. J.young드림

  • 박조홍

    수강평 3

    평균 평점 5.0

    5

    100% 수강 후 작성

    j영님 강의만 두개들었는데 두개 전부 매우 만족했습니다! 강사님이 차분하게 알려주셔서 쉽게 따라할 수 있고 배운걸 바탕으로 바로 실전에 응용할 수 있어서 좋았습니다! 덕분에 실력이 정말 많이 늘었어요.

    • J.영
      지식공유자

      예리님 수강평 감사드립니다. 제 강의를 2개나 들어주셨는데 실력향상에 많은 도움이 되었으면 합니다. 정말 감사드리구요~~ 항상 좋은강의로 찾아뵙도록 하겠습니다. 감사합니다^^ J.young드림

  • 루피

    수강평 2

    평균 평점 5.0

    5

    68% 수강 후 작성

    설명도 꼼꼼하게 해주시고 알기 쉽게 설명해주셔서 넘 좋아요 ~

    • J.영
      지식공유자

      루피님~ 제가 더 감사드립니다. 지속적으로 좋은 강의로 찾아뵙도록 하겠습니다 감사합니다^^

  • ciel0727

    수강평 7

    평균 평점 4.7

    5

    100% 수강 후 작성

    천천히 잘 알려주십니다!!

    • J.영
      지식공유자

      ciel0727님 수강평 감사드립니다~~ 더 좋은 강의로 찾아뵙도록 하겠습니다~ 감사합니다^^ 지속적 열공 부탁드려요~ J.young드림

J.영님의 다른 강의

지식공유자님의 다른 강의를 만나보세요!

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

₩30,800