인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
로드맵 썸네일

디자인만 하기엔 내 월급은 작고, 귀여우니까🐥

작성자 프로필 이미지

인프런

Photoshop
HTML/CSS
JavaScript

입문 대상

로드맵 참여중인 유저 프로필 사진
로드맵 참여중인 유저 프로필 사진

191명 참여중

15% 할인

8개 남음전체 구매 적용
쿠폰 받기

로드맵 코스

내 생각.
내 디자인. 
내 코드.

이 순서 어떠세요?

포토샵 👉 일러스트레이터 👉 어도비 XD 👉 HTML, CSS 👉 JavaScript 👉 jQuery

1. 디자이너의 필수 프로그램 포토샵!
저는 포토샵은 주로 웹 사이트에 사용할 이미지 작업에 사용하고 있어요! 사이트 배너를 만들거나, 이미지 형태나 색 보정등을 쉽게 할 수 있죠 :D 
2. 본격적으로 웹,앱 디자인에 필요한 수업을 배워볼까요?
아이콘, 로고, 캐릭터 등 웹, 앱디자인에 필요한 디자인 소스들을 작업할 때 많이 사용해요! 
3. 버튼을 누르면 어느 페이지로 이동해야할까요?
프로토타이핑은 서비스를 개발할 때 꼭 필요한 과정입니다. 포토샵, 일러스트레이터와 호환이 가능한 XD로 학습해보세요 :)
4. 프론트엔드 개발자의 첫 걸음! Html, CSS
HTML은 웹 문서를 만들기 위한 기본적인 웹 언어죠! 동영상, 링크, 표 지도 등 다양한 요소들을 넣을 수 있어요.그 후, CSS코드를 작성하여 디자인 된 화면을 나타내죠 :D
5. 웹페이지의 동작을 담당하는 자바스크립트
예를 들어 해당 버튼을 클릭하면 메시지 발송과 같은 명령을 내릴 수 있어요!
6. 자바스크립트 라이브러리 jQuery 
라이브러리는 자주 사용되는 기능이나 구현하기 어려운 기능들을 하나로 묶어서 만들어 놓은 코드 창고죠. 쉽고 빠르게 구현할 수 있도록 도와줍니다.
 

 

포토샵과 일러스트레이터는 무슨 차이가 있나요?

 
비트맵 방식과 벡터 방식
포토샵은 비트맵 방식으로 사각형 pixel 단위로 이루어진 그래픽 형식으로 강제로 사이즈를 키우면 픽셀이 보여 깨져보입니다.

반면 벡터 방식인 일러스트레이터는 수학적 공식으로 이루어진 그래픽형식으로 사이즈를 키워도 깨지지 않아 여러 매체에 활용되고 있습니다.

프로토타이핑은 뭔가요?

 
프로토타이핑은 서비스를 개발할 때 꼭 필요한 과정입니다. 

개발 초기에 시스템의 모형을 간단히 만들어 사용자에게 보여주고, 사용자가 기기나 시스템을 직접 사용해 보게 한 뒤, 기능의 추가, 변경 및 삭제 등을 요구하면 이를 즉각 반영해 시스템을 개선시켜 나갑니다 :D 

이런 분들께 추천드려요!

 

왕초보

디자인 기본 스킬부터 차근차근 익히고픈 분

웹디 새내기

웹코딩 배워야 하는 웹 디자이너 지망생

자바스크립트?

반응형 웹 디자인에 관심있는 분

jQuery?

실무에서 jQuery 제대로 써먹고픈 웹 디자이너

로드맵 상세보기

7개 코스

로드맵에 포함된 강의 썸네일
비전공자도 쉽게 배우는 포토샵 기초 강좌입니다. 빠르게 포토샵 툴을 배워야하는 디자인과 1,2학년 분들, 포토샵으로 부업하고 싶은 분들, 본인의 사업을 꾸미고 싶은 분들, 유튜브 크리에이터나 블로그와 인스타그램을 운영하시는 분들이 배우면 아주 도움됩니다! 시작이 반입니다 여러분... 겁먹지 마세요.

무료

로드맵에 포함된 강의 썸네일
포토샵 기초 강좌와는 다른 스킬 UP 실전 강좌입니다! 다양한 예제를 따라하며 익힌 후에는 여러분의 머리속에 있는 디자인을 비주얼적으로 충분히 표현 할 수 있어요.

무료

로드맵에 포함된 강의 썸네일
강력한 디자인 툴인 'Illustrator CC'를 배우고 다양한 디자인 소스를 만들어봅니다. 웹이나 앱디자인에서 바로 활용할 수 있는 기능과 예제 중심으로 작업해보며 입문에서 활용까지 빠르게 익히실 수 있습니다. Illustrator는 온, 오프라인의 다양한 작업물에 활용할 수 있고 생각보다 다루기 어렵지 않아 배워두면 유용하게 사용할 수 있습니다.

55,000

로드맵에 포함된 강의 썸네일
UX/UI 디자인에 가장 적합한 툴이자, 디자인과 프로토타이핑 툴인 어도비 XD CC의 기초를 배울 수 있는 강좌입니다. 웹 사이트, 모바일 앱 등의 경험디자인과 프로토타이핑을 공유할 수 있고, 다른 디자인 툴에 비해 간단한 UI 구조로 빠르게 툴을 익히실 수 있습니다.

22,000

로드맵에 포함된 강의 썸네일
학원에서 실제 강의하는 내용을 정리했습니다. html과 css의 기초를 다지고, 다양한 실습을 진행하도록 준비했습니다. 취업을 위해 웹 표준의 기초를 다지고 싶다면 이 기회를 잡으세요. 또, 학원을 다니고 싶지만 시간의 여유가 없으신 분에게도 좋은 기회가 되리라 믿습니다.

33,000

44,000

로드맵에 포함된 강의 썸네일
이 수업은 https://opentutorials.org 를 만들어가면서 JavaScript에 대한 지식과 경험을 동시에 채워드리기 위한 목적으로 만들어진 수업입니다. 생활코딩의 Web2시리즈 중에 하나입니다 .

무료

로드맵에 포함된 강의 썸네일
혹시 남이 만들어 둔  jQuery 코드를 이해안하고 자동적 Ctrl + C/V를 하고 있진 않나요? 실무에서 가장 빈번하게 사용되는 jQuery 여러 함수들과 이벤트들을 알아보고, 직접 사용해 보면서 상황에 따라 어떤 함수들을 써야하는지  의미를 알고 더 나아가 직접 수정하고 만들 수 있도록 도와주는 실무형 jQuery 강좌입니다. 

기본 강의 말고도 실무에 자주 사용되는 jQuery 플러그인을 사용하여 실무에 필요한 기능들을 알아보도록 합니다.

비공개

15% 할인

8개 남음전체 구매 적용
쿠폰 받기

로드맵 코스 7