코드 없이 피그마 디자인 그대로! Bubble.io로 웹사이트 만들기
황상은
무료
입문 / bubble.io, Figma, No-code, 반응형 웹
4.8
(25)
개발? 디자인? 몰라도 괜찮아요! 강의에서 하나하나 세세하게 알려드리니까, 따라오기만 하면 개발과 관련 없는 분들도 생애 첫 웹사이트를 완성할 수 있어요!
입문
bubble.io, Figma, No-code

비싼 홈페이지 제작 없이, 네이버 블로그를 홈페이지처럼 바꿔보세요. Google Stitch와 피그마 템플릿을 활용해 홈페이지형 블로그 스킨을 직접 만들고, 투명 위젯으로 메뉴, 상담, 예약, 스토어 링크를 연결하는 방법까지 배웁니다. 디자인이나 코딩을 몰라도 강의 순서대로 따라오면, 내 블로그 첫 화면을 전문적인 소개 페이지처럼 구성하고 직접 수정, 관리할 수 있습니다.
1명 이 수강하고 있어요.
난이도 입문
수강기한 무제한


피그마 템플릿을 활용해 네이버 블로그 스킨 직접 제작
구글 스티치로 원하는 분위기의 블로그 스킨 시안 만들기
투명 위젯으로 메뉴, 버튼, 이미지 영역에 링크 연결
카카오톡 상담, 예약, 스마트스토어, 인스타그램 등 원하는 페이지로 연결
제공되는 홈페이지형 블로그 스킨 3종 활용 및 직접 수정
블로그는 운영하고 있는데,
첫 화면이 평범해서 아쉽게 느껴진 적 있으신가요?
업체에 맡기자니 비용이 부담스럽고,
직접 만들자니 디자인도 어렵고 코드도 몰라서
어디서부터 시작해야 할지 막막했다면
이번 강의에서 홈페이지형 블로그를 직접 만들어보세요.
이 강의는 디자인이나 코드를 잘 모르는 분들도
차근차근 따라 하며 네이버 블로그를 홈페이지처럼 꾸밀 수 있도록 구성된 강의입니다.
피그마 템플릿을 수정하고, 구글 스티치로 원하는 분위기의 스킨 이미지를 만들고, 투명 위젯을 활용해 메뉴와 버튼에 링크를 연결하는 방법까지 배웁니다.
단순히 예쁘게 꾸미는 것에서 끝나는 것이 아니라, 방문자가 상담, 예약, 구매, 문의 페이지로 쉽게 이동할 수 있도록 블로그 첫 화면을 하나의 안내 페이지처럼 만드는 것이 목표입니다.
홈페이지형 블로그는 일반 네이버 블로그를 홈페이지처럼 보이도록 꾸민 블로그입니다. 보통 블로그라고 하면 글이 위에서 아래로 쌓이는 형태를 많이 떠올리실 텐데요.
홈페이지형 블로그는 단순히 글만 모아둔 블로그가 아니라, 첫 화면에 브랜드 소개, 메뉴, 서비스 안내, 문의 버튼처럼 홈페이지에 들어갈 법한 요소들을 배치해서 방문자가 필요한 정보를 쉽게 찾을 수 있도록 만드는 방식입니다.
예를 들어 학원 블로그라면 학원 소개, 수업 안내, 시간표, 상담 문의 메뉴를 넣을 수 있고, 공방 블로그라면 클래스 안내, 작품 사진, 예약 문의 버튼을 넣을 수 있습니다. 쇼핑몰이나 개인 브랜드 블로그라면 스마트스토어, 인스타그램, 카카오톡 상담, 포트폴리오 페이지로 연결해 블로그를 하나의 소개 페이지처럼 활용할 수 있습니다.
홈페이지를 만들려면 도메인 비용, 서버 비용, 제작 비용처럼 여러 가지 비용이 들어갈 수 있습니다. 물론 목적에 따라 별도 홈페이지가 꼭 필요한 경우도 있지만, 처음 시작하는 단계에서는 비용과 관리 부담이 크게 느껴질 수 있습니다.
홈페이지형 블로그는 기존 네이버 블로그를 활용하기 때문에 별도의 서버나 도메인을 준비하지 않아도 전문성 있는 첫 화면을 만들 수 있습니다. 또한, 블로그 글 발행과 정보 안내를 함께 할 수 있어 홍보, 문의, 예약, 신청으로 이어지는 연결 페이지처럼 활용할 수 있습니다.
일반 네이버 블로그 첫 화면을 홈페이지처럼 보이는 스킨으로 바꿀 수 있습니다.
상단 메뉴, 이미지 버튼, 상담 버튼처럼 클릭 가능한 영역을 직접 만들 수 있습니다.
카카오톡 상담, 네이버 예약, 스마트스토어, 인스타그램, 외부 페이지 등 원하는 링크로 방문자를 연결할 수 있습니다.
제공되는 템플릿을 수정해서 내 업종과 분위기에 맞는 블로그 스킨을 만들 수 있습니다.
구글 스티치를 활용해 원하는 스타일의 스킨 이미지를 직접 제작해볼 수 있습니다.
이벤트, 시즌, 새로운 수업이나 상품이 생겼을 때 업체에 요청하지 않고 직접 수정할 수 있습니다.
업체에 맡기면 처음 제작은 편할 수 있지만, 나중에 문구 하나를 바꾸거나 이미지 하나를 교체하고 싶을 때도 매번 요청해야 하는 경우가 많습니다. 하지만 직접 만들 수 있게 되면 필요한 순간에 바로 수정할 수 있습니다. 이벤트 기간에는 이벤트 배너를 넣고, 계절에 맞춰 스킨 분위기를 바꾸고, 새로운 상품이나 수업이 생기면 메뉴와 이미지를 직접 교체할 수 있습니다. 처음 한 번만 방법을 익혀두면 블로그를 더 오래, 더 유연하게 관리할 수 있습니다.
네이버 블로그를 운영하고 있지만 첫 화면을 더 전문적으로 꾸미고 싶은 분
학원, 공방, 병원, 스튜디오, 쇼핑몰, 개인 브랜드 블로그를 홈페이지처럼 활용하고 싶은 분
업체에 맡기기에는 비용이 부담스럽고 간단한 수정은 직접 하고 싶은 분
디자인이나 코드를 잘 몰라도 차근차근 따라 하면서 결과물을 만들고 싶은 분
상담, 예약, 구매, 문의로 이어지는 링크를 블로그 첫 화면에 보기 좋게 정리하고 싶은 분
이벤트나 시즌에 맞춰 블로그 스킨을 직접 바꿔보고 싶은 분
이 강의는 전문 디자이너나 개발자를 위한 강의가 아닙니다. 처음 홈페이지형 블로그를 만들어보는 분들도
순서대로 따라올 수 있도록 필요한 프로그램 설치부터 차근차근 진행합니다. 피그마가 처음이어도 괜찮습니다. 구글 스티치를 처음 들어봤어도 괜찮습니다. 투명 위젯이나 링크 설정이 낯설어도 괜찮습니다.
강의에서는 필요한 부분만 쉽게 설명하고,
실제 작업 순서에 맞춰 하나씩 따라 할 수 있도록 안내합니다.
먼저 홈페이지형 블로그가 무엇인지, 왜 필요한지부터 쉽게 알아봅니다. 그다음 강의에 필요한 프로그램과 폰트를 설치하고, 수업 자료를 불러오는 방법을 배웁니다. 이후 제공되는 템플릿을 직접 수정하면서 블로그 스킨을 만드는 방법을 익힙니다. 그리고 투명 위젯을 활용해 메뉴와 버튼에 링크를 연결하는 방법을 배웁니다. 마지막으로 구글 스티치를 활용해 내가 원하는 분위기의 블로그 스킨 이미지를 제작하는 방법까지 배워봅니다.
전문 디자이너처럼 모든 것을 완벽하게 만드는 것이 아니라, 내 블로그에 필요한 화면을 직접 만들고 필요할 때 직접 수정할 수 있게 되는 것입니다.
블로그를 단순히 글을 올리는 공간으로만 두는 것이 아니라, 내 브랜드를 소개하고 방문자를 문의, 예약, 구매로 안내할 수 있는 공간으로 만들어보세요.
처음에는 어렵게 느껴질 수 있지만, 강의 순서대로 따라오시면 기본 템플릿을 수정하는 것부터 나만의 분위기가 담긴 블로그 스킨을 만드는 것까지 충분히 해볼 수 있습니다.
이제 네이버 블로그도 조금 더 전문적이고, 조금 더 보기 좋고, 조금 더 활용도 높은 공간으로 바꿔보세요. 홈페이지형 블로그 제작 강의에서 처음부터 차근차근 함께 만들어보겠습니다.
업체에 맡기기 전, 비싼 홈페이지를 만들기 전, 먼저 내 네이버 블로그를 홈페이지처럼 바꿔보세요. 강의를 보며 직접 따라 하다 보면 내 블로그에 어울리는 스킨을 만들고, 필요한 링크를 연결하고, 앞으로도 직접 관리할 수 있는 방법을 익히게 됩니다. 지금 바로 홈페이지형 블로그 제작을 시작해보세요.
투명 위젯에 한 개의 링크를 거는 방법을 배웁니다.
투명 위젯에 다중 링크를 거는 방법을 배웁니다.
실습 위주로 제작된 강의로, 완강 시 바로 사용할 수 있는 결과물을 얻게 됩니다.
섹션 (1) 홈페이지형 블로그 이해
완성된 홈페이지형 블로그를 보면서 홈페이지형 블로그는 어떻게 만드는건지 이해합니다.
섹션 (2) 따라 만들기
투명위젯 등 홈페이지형 블로그를 위한 설정을 하고 강의에서 제공되는 템플릿을 이용해 링크 연결하는 방법을 이해합니다.
섹션 (3) 나만의 스킨 제작하기
레퍼런스를 찾고 AI 디자인 도구인 Google Stitch를 이용해 레퍼런스 같은 초안을 제작하여 Figma에서 디테일하게 수정합니다.
섹션 (4) 디자인 리소스
무료 이미지, 폰트 사이트들을 공유하여 스킨 제작 시 더욱 다채롭게 제작할 수 있게합니다.
편집 가능한 Figma 파일을 제공합니다.
텍스트 수정, 이미지 교체, 색상 변경만으로 바로 블로그 스킨을 완성할 수 있습니다.
학습 대상은
누구일까요?
네이버 블로그를 홈페이지처럼 전문적으로 꾸미고 싶은 분
업체 제작 비용 없이 블로그 첫 화면을 직접 바꾸고 싶은 분
학원, 공방, 병원, 스튜디오, 쇼핑몰, 개인 브랜드 블로그를 운영하는 분
상담, 예약, 구매, 인스타그램 등으로 연결되는 메뉴형 블로그를 만들고 싶은 분
디자인이나 코딩을 몰라도 따라 할 수 있는 블로그 제작 강의를 찾는 분
이벤트, 시즌, 상품 변경에 맞춰 블로그 스킨을 직접 수정하고 싶은 분
AI 디자인 도구와 피그마 템플릿을 활용해 빠르게 결과물을 만들고 싶은 분
선수 지식,
필요할까요?
디자인 경험이나 코딩 지식이 없어도 수강할 수 있습니다.
피그마를 처음 사용해도 강의에서 필요한 부분만 따라 할 수 있도록 안내합니다.
네이버 블로그를 운영 중이거나 새로 만들 예정이면 충분합니다.
복사, 붙여넣기, 파일 열기 정도의 기본 PC 사용만 가능하면 됩니다.
514
명
수강생
25
개
수강평
4
개
답변
4.8
점
강의 평점
2
개
강의
전체
11개 ∙ (1시간 2분)
해당 강의에서 제공:
1. 홈페이지형 블로그란?
04:13
4. 투명 위젯 만들기
04:31
5. 클릭 영역 가이드라인 만들기
04:48
6. 제공 스킨 수정하기
10:57
7. 기본형 스킨 적용 및 링크 설정
09:35
9. 레퍼런스 찾는 방법
03:00
11. 디자인 수정 및 최종 적용하기
09:19
지식공유자님의 다른 강의를 만나보세요!
같은 분야의 다른 강의를 만나보세요!
얼리버드 할인 중
₩31
28%
₩55,000