본문 바로가기
닫기
토픽 주제별 분류
서브토픽
필터

  • DESIGN 31 [ Photoshop #4 ] 웹디자인을 위한 포토샵 기초 #4, 툴박스 - slice, crop, stamp, brush, 이미지 보정하기

    youtube.com

    DESIGN 31 [ Photoshop #4 ] 웹디자인을 위한 포토샵 기초 #4, 툴박스 - slice, crop, stamp, brush, 이미지 보정하기

    예제 다운로드
    https://drive.google.com/file/d/1SeeCT5UCT7PaBK6hWVmAcgwjobyXAa3g/view?usp=sharing


    웹디자인을 위한 포토샵 기초 #4
    - slice tool
    - crop tool
    - eye dropper
    - 이미지 보정하기

    0:0 photoshop cs6 tool
    13:14 perspective crop tool
    15:43 crop tool

    #webdesign #photoshop

    홈페이지 : http://ezwebpub.com/
    구독하기(subscribe now) : https://bit.ly/30wbC1y

    멤버쉽 가입하기: https://www.youtube.com/channel/UCax1DP6hqZowNWF2lquKk0w/join

    오프라인 수업 문의: ezwebpub@gmail.com

    완료본 소스 구매하기(buy final source) : http://ezwebpub.com/product-category/source/

    도봉도봉

  • DESIGN 30 [ Photoshop #3 ] 웹디자인을 위한 포토샵 기초 #3, 툴박스 - 선택영역 만들기, 스마트 오프젝트, 웹디자인에서 하지 말아야 할 것.

    youtube.com

    DESIGN 30 [ Photoshop #3 ] 웹디자인을 위한 포토샵 기초 #3, 툴박스 - 선택영역 만들기, 스마트 오프젝트, 웹디자인에서 하지 말아야 할 것.

    예제 다운로드
    https://drive.google.com/file/d/1SeeCT5UCT7PaBK6hWVmAcgwjobyXAa3g/view?usp=sharing


    웹디자인을 위한 포토샵 기초 #3

    - Lasso Tool 선택영역 생성하기
    - Smart Object 스마트 오브젝트활용하기
    - 웹디자인 이미지 보정하기
    - web design Do and Don't



    #webdesign #photoshop

    멤버쉽 가입하기: https://www.youtube.com/channel/UCax1DP6hqZowNWF2lquKk0w/join

    오프라인 수업 문의: ezwebpub@gmail.com

    완료본 소스 구매하기(buy final source) : http://ezwebpub.com/product-category/source/

    도봉도봉

  • DESIGN 29 [ Photoshop #2 ] 웹디자인을 위한 포토샵 기초 #2, 툴박스 - marquee, move, 주요 단축키

    youtube.com

    DESIGN 29 [ Photoshop #2 ] 웹디자인을 위한 포토샵 기초 #2, 툴박스 - marquee, move, 주요 단축키

    웹디자인을 위한 포토샵 기초 #2 - tool box
    - marquee, move
    - 주요 단축키

    #webdesign #photoshop

    홈페이지 : http://ezwebpub.com/
    구독하기(subscribe now) : https://bit.ly/30wbC1y

    멤버쉽 가입하기: https://www.youtube.com/channel/UCax1DP6hqZowNWF2lquKk0w/join

    오프라인 수업 문의: ezwebpub@gmail.com

    완료본 소스 구매하기(buy final source) : http://ezwebpub.com/product-category/source/

    도봉도봉

  • DESIGN 28 [ Photoshop #1 ] 웹디자인을 위한 포토샵 기초 #1, 컬러, vector, bitmap, panel

    youtube.com

    DESIGN 28 [ Photoshop #1 ] 웹디자인을 위한 포토샵 기초 #1, 컬러, vector, bitmap, panel

    웹디자인을 위한 포토샵 기초 #1
    - 컬러모드
    - vector vs bitmap
    - 그래픽 포멧
    - 웹디자인을 위한 포토샵 패널 정리하기


    #webdesign #photoshop

    홈페이지 : http://ezwebpub.com/
    구독하기(subscribe now) : https://bit.ly/30wbC1y

    멤버쉽 가입하기: https://www.youtube.com/channel/UCax1DP6hqZowNWF2lquKk0w/join

    오프라인 수업 문의: ezwebpub@gmail.com

    완료본 소스 구매하기(buy final source) : http://ezwebpub.com/product-category/source/

    도봉도봉

  • The Hottest Web Design Trends 2022

    medium.muz.li

    The Hottest Web Design Trends 2022

    What’s effective today and what will we take with us into the future?

    AriRaNg

  • 시장 최고의 웹 사이트 빌더

    ecommerce-platforms.com

    시장 최고의 웹 사이트 빌더

    당신은 시장에서 최고의 웹 사이트 빌더를 찾고 있습니까? 그렇다면이 리뷰를 확인하십시오-우리는 그것을 정확하게 밝힐 것입니다. 더 많은 정보를 원하시면 여기를 클릭하십시오!

    벼랑위의파도

  • Web Design for Beginners | FREE COURSE

    youtube.com

    Web Design for Beginners | FREE COURSE

    If you're new to web design, this course on web design for beginners will teach you everything you need to know. ► Download creative digital assets with Envato Elements: https://elements.envato.com?utm_campaign=yt_tutsplus_B-ytMSuwbf8&utm_medium=referral&utm_source=youtube.com&utm_content=description

    “How do I pick typefaces, how do I pick colors, what the heck is whitespace, and how do I position and size elements correctly?” These are exactly the kinds of questions which we’ll address in this beginner web design tutorial.

    In terms of fundamentals, you’ll learn about color, typography, spacing, sizing, imagery, and responsive web design. We’ll discuss the theory, best practices, and some tools you can use to make your job easier.

    When it comes to common web design patterns, you’ll learn about the elements you can use to design a web page—things like headers, hero areas, buttons, image galleries, contact forms, and more.

    For each of these patterns, we’ll look at the definition and some use cases, and then we’ll apply that knowledge to a demo project: a three-page portfolio website designed specifically for this course.

    ► Check out this link for the project brief and course assignments: https://bit.ly/37YMk4W
    ► Read the course notes (and more!) for Web Design for Beginners on Envato Tuts+: https://webdesign.tutsplus.com/articles/web-design-for-beginners-epic-free-course--cms-41118?utm_campaign=yt_tutsplus_B-ytMSuwbf8&utm_medium=referral&utm_source=youtube.com&utm_content=description
    ► Link to wireframe portfolio website with Figma: https://www.figma.com/file/Ak0JQMv65digqiASGnoLI0/Portfolio-Website?node-id=0%3A1

    What You'll Learn:

    00:00:00 Welcome!
    00:04:31 Course brief and assignment
    00:05:48 UI design vs. UX design vs. web design
    00:14:08 Learning to work with project briefs
    00:19:59 Working with wireframes
    00:28:08 Picking the right design tool
    00:33:53 Color theory
    00:51:36 Color harmonies, psychology and tools
    01:03:11 Creating a color palette for our project
    01:20:00 Let’s talk about typography
    01:31:11 Creating the typography for our project
    01:46:01 Spacing and sizing in web design
    01:54:47 Using icons and images in web design
    02:03:33 Definition and use cases for headers
    02:11:39 Let’s design a header
    02:28:16 Definition and use cases for hero areas
    02:33:06 Let’s design a hero area
    02:39:08 Definition and use cases for buttons
    02:44:46 Let’s design some buttons
    02:57:27 Definition and use cases for image galleries
    03:01:38 Let’s design an image gallery
    03:12:34 Definition and use cases for footers
    03:17:55 Let’s design the footer
    03:26:37 Definition and use cases for testimonials
    03:31:48 Let’s design some testimonials
    03:44:15 Definition and use cases for tabs
    03:48:11 Let’s design some tabs
    03:59:47 Definition and use cases for accordions
    04:04:03 Let's design an accordion
    04:13:19 Definition and use cases for contact forms
    04:18:17 Let’s design a contact form
    04:32:49 What is a responsive website?
    04:36:55 Making layout changes for tablets and phones
    04:56:44 Making a component responsive
    05:09:52 A quick word about prototyping
    05:16:11 Next steps and key takeaways

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    Envato Tuts+
    Discover free how-to tutorials and online courses. Design a logo, create a website, build an app, or learn a new skill: https://tutsplus.com?utm_campaign=yt_tutsplus_B-ytMSuwbf8&utm_medium=referral&utm_source=youtube.com&utm_content=description

    Envato Elements
    All the creative assets you need under one subscription. Customize your project by adding unique photos, fonts, graphics, and themes.
    ► Download Unlimited Stock Photos, Fonts & Templates with Envato Elements: https://elements.envato.com?utm_campaign=yt_tutsplus_B-ytMSuwbf8&utm_medium=referral&utm_source=youtube.com&utm_content=description

    ► Subscribe to Envato Tuts+ on YouTube: https://www.youtube.com/tutsplus
    ► Follow Envato Tuts+ on Twitter: https://twitter.com/tutsplus
    ► Follow Envato Tuts+ on Facebook: https://www.facebook.com/tutsplus
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

    AriRaNg

  • Don’t use 100vh for mobile responsive

    medium.com

    Don’t use 100vh for mobile responsive

    Generally, we use height:100vh it is for fullscreen layout which is an easy hack and a convenient way to get better design. Here, the documentHeight function sets a new style property var(‘ —…

    dracure

  • Writing Cleaner CSS using BEM Methodology

    medium.com

    Writing Cleaner CSS using BEM Methodology

    Have you ever come across this syntax and assumed it was autogenerated and didn’t give it much thought? There’s a good chance you have. That’s what we’ll look at in this article, where you’ll learn…

    dracure

  • 1시간안에 쇼피파이 쇼핑몰 만들기 | 초보자 완벽가이드 제작 강의 (2021년)

    youtube.com

    1시간안에 쇼피파이 쇼핑몰 만들기 | 초보자 완벽가이드 제작 강의 (2021년)

    쇼피파이 14일 무료로 시작하기: https://guidebean.com/shopify

    쇼피파이를 통해 처음 사이트를 만드는 사람도 혼자서 쇼피파이 쇼핑몰 홈페이지를 만들 수 있을까요? 이 영상에서 쇼피파이를 처음 접하는 초보자 분들을 위해 이렇게 사이트를 제작 및 꾸미는 방법부터 쇼핑몰을 운영하기 위해 필요한 모든 개념들을 하나씩 하나씩 무료 강의를 통해 알려드리려고 합니다.

    [영상 바로가기]
    00:00 - 인트로
    00:45 - 쇼피파이 쇼핑몰 14일 무료로 시작하기
    02:15 - 쇼피파이 관리자 페이지 언어 변경하기 (한국어)
    02:55 - 쇼피파이 기본 사이트 확인하기
    03:20 - 관리자 페이지 살펴보기 (주문)
    04:00 - 관리자 페이지 살펴보기 (제품)
    04:50 - 관리자 페이지 살펴보기 (고객)
    05:00 - 관리자 페이지 살펴보기 (분석)
    05:35 - 관리자 페이지 살펴보기 (마케팅)
    05:49 - 관리자 페이지 살펴보기 (할인)
    06:10 - 관리자 페이지 살펴보기 (앱)
    06:23 - 관리자 페이지 살펴보기 (온라인 스토어: 테마)
    06:52 - 관리자 페이지 살펴보기 (온라인 스토어: 블로그 게시물)
    07:07 - 관리자 페이지 살펴보기 (온라인 스토어: 페이지)
    07:18 - 관리자 페이지 살펴보기 (온라인 스토어: 탐색)
    07:45 - 관리자 페이지 살펴보기 (온라인 스토어: 도메인)
    08:01 - 관리자 페이지 살펴보기 (온라인 스토어: 기본설정)
    08:49 - 관리자 페이지 살펴보기 (설정)
    09:15 - 컬렉션 추가하기
    11:55 - 제품 추가하기
    15:45 - 무료 새 테마를 라이브러리에 추가하기
    16:36 - 테마 메인페이지 편집하기 (헤더: 로고, 메뉴 위치, 탑 바)
    19:00 - 테마 메인페이지 편집하기 (슬라이드: 이미지, 버튼, 텍스트, 높이, 자동회전)
    21:19 - 테마 메인페이지 편집하기 (컬렉션 리스트, 컬렉션 목록)
    22:42 - 테마 메인페이지 편집하기 (새 섹션 추가하기: 특별상품)
    24:02 - 테마 메인페이지 편집하기 (바닥글)
    24:47 - 테마 설정하기 (레이아웃)
    25:16 - 테마 설정하기 (색상)
    26:28 - 테마 설정하기 (폰트, 입력체계: 본문, 제목, 버튼)
    26:45 - 테마 설정하기 (Favicon)
    27:07 - 테마 설정하기 (소셜미디어)
    27:31 - 테마 설정하기 (Checkout)
    28:27 - 편집한 새 테마를 현재 테마로 적용하기
    29:05 - 메뉴 편집하기
    30:34 - 블로그 게시물 작성하기
    32:10 - 블로그 페이지를 메뉴에 추가하기
    33:00 - 새 페이지 추가하기
    33:53 - 추가한 새 페이지를 메뉴에 추가하기
    34:52 - 쇼피파이 쇼핑몰 설정하기 (일반: 스토어 세부 정보, 주소, 표준 및 형식, 통화)
    35:35 - 쇼피파이 쇼핑몰 설정하기 (지급: 결제 서비스 공급업체 설정)
    38:06 - 쇼피파이 쇼핑몰 설정하기 (결제: 결제 과정에 대한 옵션)
    40:20 - 쇼피파이 쇼핑몰 설정하기 (배송: 배송요금 관리 및 배송관련 모든 옵션)
    43:26 - 쇼피파이 쇼핑몰 설정하기 (세금)
    44:31 - 쇼피파이 쇼핑몰 설정하기 (스토어 언어)
    46:00 - 쇼피파이 쇼핑몰 설정하기 (위치)
    46:15 - 쇼피파이 쇼핑몰 설정하기 (알림: 고객에게 보내는 이메일 템플릿)
    47:28 - 쇼피파이 쇼핑몰 설정하기 (파일)
    47:42 - 쇼피파이 쇼핑몰 설정하기 (판매채널)
    48:03 - 쇼피파이 쇼핑몰 설정하기 (청구)
    48:27 - 쇼피파이 쇼핑몰 설정하기 (법적정보: 환불정책, 개인정보처리방침, 배송정책…)
    50:27 - 쇼피파이 플랜 변경하기
    52:07 - 사이트 비공개에서 공개 상태로 변경하기
    52:40 - 새 도메인 주소 등록하고 변경하기

    DISCLOSURE: 가이드빈은 구독자분들을 통해 운영되고 있습니다. 이에 따라서 이 곳에는 제휴링크가 포함되어있을 수 있으며 링크를 통해 구매시 가이드빈에 소정의 커미션이 지급될 수 있습니다. 이에 따른 추가 비용은 없으며 오히려 해당 상품 및 서비스에 대한 프로모션이 있을 때마다 추가 할인을 받을 수 있도록 제공하며 실제로 사용해본 도구만 추천하고 있음을 알려드립니다.

    초보탈출

  • 쇼피파이 초보자 튜토리얼 2022 | 19단계의 쉬운 방법으로 쇼핑몰 만들기

    youtube.com

    쇼피파이 초보자 튜토리얼 2022 | 19단계의 쉬운 방법으로 쇼핑몰 만들기

    이번 단계별 쇼피파이 튜토리얼을 통해 프로페셔널한 온라인 쇼핑몰 만드는 법을 배울 수 있습니다
    ► 쇼피파이 (Shopify): https://makewebsites.co.kr/shopify
    00:00:00 – 1) 인트로
    00:01:10 – 2) 쇼피파이 가입하기 (혹시 앞으로의 튜토리얼 제작을 위해 저에게 도움이 되고 싶으시다면 꼭 다음 링크를 사용해주세요: 'please add your link')
    00:05:04 – 3) 쇼피파이 기초
    00:06:11 – 4) 테마 설치하기
    00:07:22 – 5) 테마/디자인 편집하기
    00:28:20 – 6) 쇼피파이 설정
    00:28:25 – 6.1) 일반 설정
    00:29:35 – 6.2) 결제 방법
    00:31:48 – 6.3) 결제 화면
    00:37:05 – 6.4) 배송
    00:42:33 – 6.5) 세금
    00:44:53 – 6.6) 장소
    00:45:05 – 6.7) 알림 설정
    00:47:24 – 6.8) 미디어
    00:47:43 – 6.9) 세일즈 채널
    00:48:27 – 6.10) 계정
    00:49:15 – 6.11) 쇼핑 언어
    00:50:51 – 6.12) 청구서
    00:51:21 – 6.13) 약관 정보
    00:54:33 – 7) 페이지 추가 + 내비게이션에 추가하기
    00:59:52 – 8) 설정
    01:04:40 – 9) 블로그 포스트
    01:05:14 – 10) 도메인 추가하기
    01:09:31 – 11) 상품 추가하기
    01:18:55 – 12) 카테고리
    01:27:02 – 13) 할인
    01:32:06 – 14) 주문 테스트하기
    01:37:55 – 15) 통계분석
    01:38:40 – 16) 마무리

    추가 정보:
    이번 영상은 2020년 초보자를 위한 한국어 쇼피파이 튜토리얼입니다.
    이 쇼피파이 튜토리얼에서 어떻게 효율적으로 쇼피파이 쇼핑몰을 만들고 상품을 판매할 수 있는지 보여드리겠습니다.
    쇼피파이 스토어를 만들기 위한 기초 내용을 배울 수 있습니다.
    먼저 14일 무료 시범 버전 가입을 합니다. 그 다음 스토어 디자인을 시작합니다. 이후 쇼피파이의 모든 설정에 대해 둘러보고, 온라인 스토어의 백엔드(backend) 역시 잘 작동하도록 할 것입니다.
    이 작업을 끝낸 후, 첫 상품들을 만들어보고 온라인 쇼핑몰 판매 목록을 작성할 것입니다. 쇼피파이 스토어 만드는 법은 어렵지 않습니다. 이번 단계별 쇼피파이 튜토리얼에서 모든 것을 보여드리겠습니다.
    저는 구매대행에 대해서는 깊이 다루지 않지만, 이 튜토리얼을 통해 구매대행 쇼피파이 스토어 또한 구축할 수 있습니다.
    온라인 쇼핑몰을 만드는 것은 매우 유용한 기술입니다. 이커머스는 앞으로 더욱 커지기만 할 것입니다. 쇼피파이 스토어를 만들 줄 알게 됨으로써 제 커리어에 여러 번 도움을 받았고 제가 어떻게 만드는지 그 방법을 이 쇼피파이 튜토리얼에서 보여드리겠습니다.
    만들어진 쇼피파이 스토어는 필요한 모든 기능(결제 방법, 배송, 세금 등)을 포함할 것입니다.
    즐겁게 시청하세요!

    초보탈출

  • 06 웹디자인기능사 실기 (2019) 실전편 - 푸터영역 무삭제판

    youtube.com

    06 웹디자인기능사 실기 (2019) 실전편 - 푸터영역 무삭제판

    #웹디자인기능사 #푸터 #float
    웹디자인기능사 실기 푸터영역 무삭제판 레이아웃 및 패밀리사이트 셀렉트태그 관련 영상입니다.
    60점 이상이 목표인 자격증 시험을 위한 강의이며,
    마이크가 강의용 마의크라 녹음 상태가 좋지 않은 점 양해 바랍니다.
    강의자료가 필요하신 분은 yulssem_nim@naver.com 으로 메일주시면 보내드리겠습니다.
    감사합니다.

    yuli_kim

  • 05 웹디자인기능사 실기 (2019) 실전편 - 레이어팝업(모달) 10분컷

    youtube.com

    05 웹디자인기능사 실기 (2019) 실전편 - 레이어팝업(모달) 10분컷

    #웹디자인기능사 #모달 #레이어팝업
    웹디자인기능사 실기 레이어팝업(모달창) 만들기와
    공지사항의 첫번째 컨텐츠 클릭시 팝업창 노출
    엑스버튼 클릭시 팝업창 비노출 관련 영상입니다.
    60점 이상이 목표인 자격증 시험을 위한 강의이며,
    마이크가 강의용 마의크라 녹음 상태가 좋지 않은 점 양해 바랍니다.
    강의자료가 필요하신 분은 yulssem_nim@naver.com 으로 메일주시면 보내드리겠습니다.
    감사합니다.

    yuli_kim

  • 04 웹디자인기능사 실기 (2019) 실전편 - 공지사항/갤러리 탭메뉴

    youtube.com

    04 웹디자인기능사 실기 (2019) 실전편 - 공지사항/갤러리 탭메뉴

    #웹디자인기능사 #탭메뉴 #공지사항탭
    웹디자인기능사 실기 컨텐츠 영역 중
    1. 공지사항/갤러리 탭메뉴 ,배너,바로가기 유형
    2. 공지사항, 갤러리, 배너 유형
    두가지 유형을 html css로 짠 후
    탭메뉴를 제이쿼리로 구성하는 내용입니다.
    60점 이상이 목표인 자격증 시험을 위한 강의이며,
    마이크가 강의용 마의크라 녹음 상태가 좋지 않은 점 양해 바랍니다.
    강의자료가 필요하신 분은 yulssem_nim@naver.com 으로 메일주시면 보내드리겠습니다.
    감사합니다.

    yuli_kim

  • 03 웹디자인기능사 실기 (2019) 실전편 - 메인슬라이더 통합 제이쿼리

    youtube.com

    03 웹디자인기능사 실기 (2019) 실전편 - 메인슬라이더 통합 제이쿼리

    #웹디자인기능사 #슬라이드 #slide
    웹디자인기능사 실기 메인슬라이더 (왼쪽이동/위쪽이동/페이드인 페이드아웃) 세가지 유형을 한번에 적용할 수 있는 족보입니다.
    60점 이상이 목표인 자격증 시험을 위한 강의이며,
    마이크가 강의용 마의크라 녹음 상태가 좋지 않은 점 양해 바랍니다.
    강의자료가 필요하신 분은 yulssem_nim@naver.com 으로 메일주시면 보내드리겠습니다.
    감사합니다.

    yuli_kim

  • 02 웹디자인기능사 실기 (2019) 실전편 - 네비게이션 완벽정리 (header영역 포함)

    youtube.com

    02 웹디자인기능사 실기 (2019) 실전편 - 네비게이션 완벽정리 (header영역 포함)

    #웹디자인기능사 #네비게이션 #gnb
    웹디자인기능사 실기 네비게이션 메뉴 html css jquery 정리본 입니다. (header영역 포함)
    60점 이상이 목표인 자격증 시험을 위한 강의이며,
    마이크가 강의용 마의크라 녹음 상태가 좋지 않은 점 양해 바랍니다.
    강의자료가 필요하신 분은 yulssem_nim@naver.com 으로 메일주시면 보내드리겠습니다.
    감사합니다.

    yuli_kim

라이브러리에 저장

좋아하는 강좌들을 수집하고 관리하고 공유하세요

닫기