Figma 디자인부터 퍼블리싱까지

타입스크립트의 핵심 개념을 기초부터 실습까지 한 번에! 프로젝트를 통해 실무 활용까지

AI 활용과 컴포넌트 중심 UI 제작으로 배우는 실무형 웹 UI 개발, 디자이너+개발자 필수 코스!

나만의 풀스택 애플리케이션 개발에서 프로그래시브 웹앱(PWA)까지!

체계적인 단계의 프로젝트 실습과 배포, 빌트인 store 활용, SvelteKit와 Supabase로 풀스택 애플리케이션까지 한방에!

디자인을 공부해본 적이 없는 비전공자 분들, 이제 막 UX디자인을 공부하기 시작한 학생들, UX 및 UI 디자인 취준생 분들을 위해 준비한 "피그마로 UI디자인하기 A to Z" 수업입니다. 포토샵 등 다른 툴을 전혀 모르는 분도 피그마만 활용해 UI디자인 전문가가 될 수 있도록 기초부터 고급 기능까지 알려드립니다.

맛있는 족발이에요~ 요즘 족발 장난 아니던데...꿀꺽

퍼블리셔 취업과 퍼블리셔 실무에서 가장 경쟁력이 있는 모바일 웹 제작 능력을 향상할 수 있습니다. 퍼블리셔로서 모바일 웹을 제작하기 위한 거의 모든 제작 방법과 노하우를 다질 수 있습니다. 특히 요즘 퍼블리셔와 개발자에게 요구되는 디자인 능력을 피그마(Figma) 학습으로 많은 부분 커버할 수 있도록 피그마(Figma)로 모바일 웹 UI 디자인 작업을 하는 과정도 상세하게 설명하였습니다. 모바일 웹 퍼블리싱 수업에서 가장 강점인 부분인 HTML 와이어프레임 상세한 작성법을 모든 페이지 하나하나 상세하게 설명합니다. 강의를 통해 HTML 와이어프레임 제작 능력이 크게 향상될 것입니다. 모바일 웹 퍼블리싱은 CSS 변수(Var) 활용한 모바일과 태블릿에 맞춘 레이아웃을 완벽하게 맞추는 학습을 통해서 실무 작업과 대동소이한 정도의 작업 능력을 갖추게 됩니다. Flex 레이아웃을 중심으로 중상급 CSS 실전 능력을 충분히 갖추시게 됩니다.

단순히 특정 사이트를 따라 만드는 강의가 아니라 지식공유자가 공유하는 스크롤 인터렉션 노하우, 핵심요소를 기초부터 탄탄히 배워 애플 등 국내 기업에서 많이 사용하는 UI 스크롤 인터렉션의 다양한 기법들과 모션 등을 배우고 만들어 봅니다.

'호텔 현대라한_목포점' 사이트 제작으로, 실제 웹사이트 메인페이지를 그대로 제작·구현해보는 강의입니다. html/css기초 지식이 있는 분들을 대상으로 html Markup과 Layout제작에 대한 이해는 물론 Fixheader, Image Slider, MenuOpen Bar, Scroll Animation 제작까지의 웹에서 꼭 필요로한 skill을 배울 수 있는 웹페이지 제작 실전! 강의입니다.

웹디자인기능사 출제기준 2023년 버전에 맞추어 누구나 합격할 수 있도록 제작하였습니다. 5가지 유형을 배우고 빠르게 합격합시다!

전국 합격률 60%중에 우리반 합격률은 90%! 시험요구사항을 파악하면 가능합니다. 실기 책 사지마요 어려워요

퍼블리셔 취업을 위한 진짜 가이드 전자책(PDF)으로 효율적인 퍼블리싱 학습방법, 좋은 퍼블리싱 강의 잘 가르치는 퍼블리싱 강사 고르는 안목, 신입이지만 경력자처럼 퍼블리싱하는 요령, 바람직한 코딩 습관과 원칙, 개인 포트폴리오 홈페이지 제작 방법, 디자이너 개발자와의 협업 요령, 퍼블리셔로 알아야 할 필수 사이트, 포토샵 UI 디자인 실력키우기 등 퍼블리셔 취업을 위해 반드시 알아야 하는 HTML+CSS+JQUERY 퍼블리싱 기본기를 상세하게 알려드립니다. 또한, 국비지원 퍼블리셔 과정에 대해 상세히 설명합니다.

지금까지 200여명의 오프라인 학원 학생들 신입 퍼블리셔 취업 포트폴리오 지도한 경험을 통해 코딩웍스가 심혈을 기울여 만들었습니다. 면접과 취업을 부르는 퍼블리셔 '개인 포트폴리오 홈페이지' 제작 강의는 퍼블리셔 취업을 위해 필수로 준비해야 하는 개인 포트폴리오 홈페이지를 어떻게 어디서부터 준비하는지 알려드리는 충실한 가이드입니다. 강의는 총 19시간 이상의 강의 내용이 담겨 있습니다. 개인 포트폴리오 홈페이지 제작 전 퍼블리싱 관련 필수사항, 취업과 실무에서 최고로 중요한 퍼블리싱 기본기, 취업을 위한 제이쿼리와 자바스크립트 & 코딩 미션, 개인 포트폴리오 홈페이지에 넣을 포트폴리오 결과물 제작 방법, 개인 포트폴리오 홈페이지 섹션 별 콘텐츠 레이아웃 및 상세내용, 지원할 기업 구분하기 & 퍼블리셔 실전 면접 요령 등 신입 퍼블리셔로서 알아야 할 모든 내용을 담고 있습니다.

SCSS(SASS)와 FLEX Layout을 실전에 완벽하게 활용합니다! 피그마로 전체 웹사이트의 메인 페이지 및 핵심 서브 페이지 UI를 디자인하고, 일관성 있는 클래스네임과 함께 HTML 와이어프레임 구조를 만들어 퍼블리싱까지 완료하는 체계적인 반응형 웹 사이트 프로젝트 제작 과정입니다. 총 41시간 이상의 과정 속에서 핵심 이론 및 실무 활용 능력을 충분히 익히고, PC - 모바일 - 태블릿 대응 반응형 레이아웃을 설계 및 제작하면서 반응형 웹 프로젝트에 대한 경험과 노하우는 물론 제이쿼리(jQuery) 핵심 이론 및 실무 활용 능력까지 대폭 향상시키게 됩니다.

돕다 사이트 제작 Application Course로, 실제 웹사이트 메인페이지를 그대로 제작·구현해보는 강의입니다. 무료 강의로 오픈한 돕다 사이트 Basic Course의 Layout과 Animation 위주의 단순한 구조의 코딩에서 Fixed header, Image Slider, Mobile navigation, Scroll Animation, 반응형 등을 추가하며 코딩 하나하나를 수정보완하며 완성해가는 웹페이지 제작 실전! 강의입니다. (본강의는 돕다-Basic Course를 들으시고 수강하셔야 학습 효과가 크다고 볼 수 있습니다.)

예쁜 화면 100개보다 움직이는 프로토타입 1개! 피그마에서 조건부 로직으로 실제처럼 작동하는 프로토타입을 만들고, AI 시대에도 흔들리지 않는 디자인 사고력을 기르세요.

웹디자인기능사 실기를 준비하기 위한 기초 내용을 공개 문제를 통해 학습하는 강의입니다. 실무에서 웹 코딩을 활용하고자 하는 웹디자이너에게도 유익한 강의에요.

입문편에서 연습으로 만들어봤던 VD 사이트 메인페이지를 실전으로 만들어볼거에요~

이제 AI의 힘으로 누구나 쉽게 앱을 기획하고 UI를 그릴 수 있습니다! 코딩 몰라도, UI 경험 없어도 괜찮아요. Claude, ChatGPT 같은 AI 도구가 여러분의 아이디어를 현실로 만들어 드립니다. 단 몇 번의 질문만으로 타겟 고객을 분석하고, 앱 구조를 설계하고, 심지어 UI 화면까지 자동으로 생성할 수 있어요. 이 강의에서는 피그마를 처음 만져보는 분도 따라할 수 있도록 기초부터 차근차근 알려드립니다. 직접 손으로 그리지 않아도 HTML to Design 플러그인으로 기존 웹사이트 UI를 한 번에 가져올 수 있고, 구글 스티치나 readdy.ai 같은 AI 도구로 몇 초 만에 완성도 높은 화면을 만들 수 있어요. 창업을 꿈꾸는 분, 기획자로 전직하고 싶은 분, 개발자와 소통하고 싶은 분 모두에게 딱 맞는 강의입니다. 복잡한 이론 대신 바로 써먹을 수 있는 실전 노하우만 쏙쏙 뽑아서 알려드릴게요. 이제 아이디어만 있으면 누구나 앱 서비스를 기획할 수 있습니다!

구현하고 싶은 앱/웹 아이디어는 있지만, 앱 서비스 기획 경험이 없어 어떻게 시작해야 될지 막막한 스타트업 대표, 단기간에 기획을 체계적으로 배우고 싶은 실무자, 경력자의 기획 업무 프로세스와 노하우를 배우고 싶은 주니어 기획자 모두 전문가가 될 수 있도록 Figma를 활용한 새로운 기획 방식 및 PM 17년차의 업무 스킬을 기초부터 차근차근 알려드립니다.

하나의 웹 페이지를 구성하려면, 부분부분 각 컴포넌트들을 만들 수 있어야 합니다. 순수코딩만으로 UI component를 만들어 봅니다. html,css,javascript를 사용하실 줄 아는 분께 추천드립니다.

실전! 웹사이트제작 Step By Step! 입문 강좌로, 다양한 기초 레이아웃을 제작해 보면서 HTML과 CSS의 개념을 확실하게 배울 수 있는 강의입니다.

취업을 위해 면접을 자주 봐야 합니다. 면접을 자주 보기 위해서는 괜찮은 퍼블리셔 개인 포트폴리오 홈페이지가 반드시 있어야 합니다. 코딩웍스가 심혈을 기울여 만든 괜찮은 개인 포트폴리오 홈페이지 제작 가이드 교재(PDF)입니다. 해당 교재는 인터넷에서 구글링 해서 구할 수 있는 내용이 아닙니다. 코딩웍스가 수년간 현장에서 300여 명의 학생에게 퍼블리싱 이론, 실전, 개인 포트폴리오 홈페이지 제작 강의하고 학생들이 빨리 원하는 회사에 취업할 수 있도록 개인 포트폴리오 홈페이지 제작 방법을 상세하게 담은 세상에 하나뿐인 퍼블리셔 취업 개인 포트폴리오 홈페이지 제작 가이드(PDF) 입니다.

웹디자인개발기능사(구 웹디자인기능사) 출제기준(2025.1.1 ~ 2027.12.31)까지 시행되는 출제기준에 정확히 맞춘 웹디자인 기능사 실기 시험 내용에 최적화 되어 있는 실기시험 전문 강의로서, HTML+CSS+JQUERY 퍼블리싱, 코딩웍스 웹디자인개발기능사 실기시험 강의는 다릅니다. 2026년 웹디자인개발기능사 모든 시험 유형(A,B,C,D,E,F 유형) 완벽 제작 수업영상이 모두 반영되어 있습니다.