뚝딱lab's Portfolio

Let's Build
Something
Great.

홈페이지가 필요한 모든 분들과 함께 작업했습니다.
아래 작업물을 직접 클릭해서 확인해보세요.

🔨
Brand · Web Studio
뚝딱lab 공식 사이트
Visit Site →
🚗
렌터카 · 모빌리티
쑈카 렌트카
Visit Site →
🦷
의료 · 치과
밝은미소 치과
Visit Site →
F&B · 카페
온하루 카페
Visit Site →
🏋️
피트니스
IRONFORE GYM
Visit Site →
⚖️
전문직 · 법률
법무법인 그린
Visit Site →
📚
교육 · 입시
하나 입시학원
Visit Site →
🎮
게임 · 서비스
헤븐팀
Visit Site →
🌿
공공기관 · 연구 플랫폼 · Classic ver.
동의보감 소재은행
Visit Site →
🔬
공공기관 · Modern ver.
동의보감 소재은행
Visit Site →
Technical Stack
사용 기술
Design

UI · 화면 설계

와이어프레임부터 최종 디자인까지 직접 제작합니다. 업종에 맞는 색채, 타이포그래피, 레이아웃을 결정하고 모든 해상도에서 일관된 경험을 만듭니다.

Figma 반응형 설계 컴포넌트 시스템
Development

HTML · CSS · JS

디자인을 실제 브라우저에서 동작하는 코드로 구현합니다. 별도의 프레임워크 없이 순수 웹 표준 코드로 제작해 어떤 서버 환경에도 올릴 수 있습니다.

HTML5 CSS3 Vanilla JS 반응형 웹
SEO · Analytics

검색 최적화 · 분석

네이버·구글 검색에 잘 노출되도록 페이지 제목, 설명, 구조를 세팅합니다. GA(구글 애널리틱스)를 연결해 방문자가 어디서 오고 어디서 이탈하는지 측정합니다.

Meta 태그 구조화 데이터 Google Analytics
Integration

카카오·외부 서비스 연동

카카오톡 채널 상담 버튼, 네이버 예약, 구글 지도 등 필요한 외부 서비스를 홈페이지에 연결합니다. 방문자가 바로 행동할 수 있는 구조를 만듭니다.

카카오채널 Google Maps 네이버 예약
How It Works
납품 프로세스
01
방향 합의
원하는 분위기, 레퍼런스, 필요한 기능을 파악합니다. 이 단계에서 전체 구조(메뉴 수, 페이지 구성)를 함께 정합니다.
약 1~2일
02
레이아웃 초안 확인
색상·이미지 없이 배치만 잡은 와이어프레임을 먼저 공유합니다. 나중에 "이건 다르게 생각했는데요"를 막기 위한 단계입니다.
약 2~3일
03
디자인 완성
실제 색상·폰트·이미지가 모두 들어간 최종 디자인을 제작합니다. 만족할 때까지 수정합니다.
약 3~7일
04
코딩 · 납품
디자인을 HTML·CSS 코드로 구현합니다. PC·모바일 모두 확인 후 소스 파일과 수정 가이드 문서를 함께 전달합니다.
약 3~5일
After Delivery
납품 후 안내

홈페이지를 전달받은 이후에도 스스로 관리할 수 있도록 수정 방법과 주의사항을 문서로 함께 드립니다.

📁

납품 파일 구성

  • index.html — 홈페이지 메인 파일. 브라우저에서 직접 열리는 파일입니다.
  • css / style.css — 색상, 폰트, 레이아웃 등 디자인 정보가 담긴 파일입니다.
  • images 폴더 — 사이트에 사용된 사진·아이콘이 모두 들어있습니다.
  • 가이드.pdf — 텍스트·색상·사진 교체 방법을 정리한 설명서입니다.
✏️

직접 수정할 수 있는 것들

  • 텍스트 변경 — 메모장(Notepad)으로 html 파일을 열어 원하는 글자로 바꾸면 됩니다.
  • 사진 교체 — images 폴더의 기존 사진을 같은 이름으로 덮어쓰면 자동 교체됩니다.
  • 전화번호·주소 — html 파일에서 Ctrl+F로 검색 후 바로 수정 가능합니다.
  • 색상 변경 — css 파일 상단의 색상 코드(예: #ff0000)만 바꾸면 전체 적용됩니다.
🌐

서버에 올리는 방법

  • 호스팅 서비스에 파일을 업로드합니다. 카페24, 가비아, Netlify 등을 많이 씁니다.
  • 폴더째로 업로드하되, 파일 구조가 깨지지 않게 그대로 올려야 합니다.
  • 도메인(주소)을 연결하면 www.내도메인.com으로 접속이 가능해집니다.
  • 모르시면 그냥 연락 주세요. 업로드·도메인 연결 대행도 가능합니다.
🔧

납품 후 AS 정책

  • 납품일로부터 2주 이내 오류 및 단순 수정은 무상으로 처리합니다.
  • 글자 깨짐, 모바일 레이아웃 틀어짐 등 기술적 오류는 즉시 수정합니다.
  • 2주 이후 추가 수정·기능 추가는 별도 견적으로 진행합니다.
  • 언제든 카카오톡이나 이메일로 문의 주시면 빠르게 답변드립니다.
FAQ
자주 묻는 질문

코딩을 전혀 몰라도 수정할 수 있나요?

+
네. 납품 시 수정 가이드 문서를 함께 드립니다. 텍스트 수정은 메모장으로, 사진 교체는 파일 덮어쓰기로 가능하게 설명해드립니다. 처음 해보셔도 따라할 수 있도록 단계별로 작성합니다.

홈페이지를 만들고 나서 서버에 어떻게 올리나요?

+
만들어드린 파일을 카페24·가비아·Netlify 같은 호스팅 서비스에 업로드하면 됩니다. 도메인 연결까지 직접 하기 어려우시면 업로드·연결 대행도 해드립니다. 별도로 문의 주세요.

완성된 홈페이지의 저작권은 누구 것인가요?

+
잔금 완납 시점에 모든 소스 파일과 저작권이 의뢰인에게 귀속됩니다. 납품 이후에는 자유롭게 수정·활용하실 수 있습니다.

모바일에서도 잘 보이나요?

+
모든 작업물은 반응형 웹으로 제작됩니다. PC·태블릿·모바일 화면 크기에 맞게 자동으로 레이아웃이 조정되며, 크롬·사파리·엣지 등 주요 브라우저에서 납품 전 직접 확인 후 전달드립니다.

기존에 사용하던 서버·도메인이 있어요. 그대로 쓸 수 있나요?

+
네. 기존 도메인은 그대로 유지하면서 화면만 교체하는 것도 가능합니다. 다만 서버 구성에 따라 추가 확인이 필요할 수 있어 미리 말씀해주시면 검토 후 안내드립니다.

Ready to
Start?

Any industry, any size.
Let's build something together.