코드 없이 소상공인 브랜드 웹페이지 만들기 — 폰 사진에서 실제 도메인까지

개발자를 고용하거나 월 구독형 빌더를 결제하지 않고도, 자영업 매장의 브랜드 소개 페이지를 하나 만들어 공개 주소로 띄울 수 있습니다. 필요한 건 대화형 AI 하나와 매장을 직접 찍은 사진 몇 장입니다. 이 글은 실제로 가상의 안경 매장 페이지를 처음부터 만들어 공개하기까지 걸린 과정을, 도구 조합과 소요 시간, 막혔던 지점까지 그대로 정리한 기록입니다.

필요한 도구 세 가지와 각각의 역할

전체 과정은 무료 구간만으로 끝납니다. 도구는 역할이 겹치지 않게 셋으로 나뉩니다.

도구	역할	비용
Claude	대화로 기획·문구·페이지 코드를 생성	무료 구간
Canva	매장 사진을 밝고 균일하게 보정	무료 구간
Netlify Drop	완성 폴더를 공개 URL로 게시	무료 구간

Claude는 "말로 시키면 파일을 대신 만들어 주는" 역할을 합니다. 사용자는 코드를 읽거나 쓰지 않고, 원하는 바를 문장으로 설명합니다. 결과 파일을 Netlify Drop에 올리면 이름.netlify.app 형태의 실제 접속 가능한 주소가 발급됩니다.

전체 흐름은 여섯 단계로 나뉜다

각 단계는 앞 단계의 결과물을 입력으로 받습니다. 순서를 지키는 것이 완성도를 좌우합니다.

브랜드 인터뷰 — AI가 매장에 관해 되묻게 해서 정체성과 이름 후보를 끌어냅니다.
이름·로고 확정 — 배경이 바뀌어도 깨지지 않는 형태로 만듭니다.
디자인 시트 — 색상과 서체 규칙을 먼저 정의합니다. 이 단계의 밀도가 결과 품질과 직결됩니다.
사진 보정 — 간판·매장·제품 컷을 균일한 톤으로 다듬습니다.
페이지 조립 — 이후 소식을 계속 추가할 수 있는 구조로 한 장을 구성합니다.
배포 — 폴더 전체를 Netlify Drop에 올려 공개 주소를 받습니다.

실측 소요 시간과 결과물

가상의 안경 매장으로 여섯 단계를 처음부터 끝까지 실행했습니다. 대화 입력과 사진 준비를 포함해 약 20분이 걸렸고, 코드는 한 줄도 직접 작성하지 않았습니다. 최종 산출물은 브랜드 색이 적용된 소개 페이지와 .netlify.app 공개 주소였습니다. 외주 제작이 통상 수 주와 수백만 원대인 것과 비교하면, 같은 결과물의 진입 비용이 크게 낮아진 셈입니다.

실제로 막혔던 두 지점

과정 대부분은 순조로웠지만, 몰라서 겪은 실패가 두 번 있었습니다.

첫째, 배포 직후 받은 주소가 한 시간 뒤 접속 불가 상태로 바뀌었고 비밀번호 잠금까지 붙었습니다. 로그인 없이 올린 배포에는 임시 보관 정책이 적용되는 탓입니다. 배포 화면에서 무료 회원가입 절차를 마치면 주소가 영구 상태로 전환되고 외부에서 자유롭게 접속됩니다.

둘째, 대표 페이지 파일 단독으로 업로드하자 삽입한 이미지가 전부 표시되지 않았습니다. 사진 파일이 페이지와 상대 경로로 연결된 별도 자산이기 때문입니다. 페이지와 이미지 자산을 한 폴더에 담아 통째로 올려야 원래대로 렌더됩니다. 두 실패 모두 도구 결함이 아니라 배포 규칙을 몰라 생긴 일이었습니다.

이 방식으로 되지 않는 것

정직하게 짚으면, 이 과정의 결과물은 브랜드 소개 페이지 한 장입니다. 온라인 결제나 예약 시스템은 포함되지 않습니다. 또한 새로 게시한 페이지는 검색 결과에 즉시 노출되지 않습니다. 검색엔진에 페이지 존재를 알리는 색인 등록은 별도 절차이며, 이 글의 범위 밖입니다. 소개 페이지의 목적은 잠재 고객이 매장을 검색해 확인했을 때 신뢰를 주는 것에 있습니다.

정리

코드 없이 매장 브랜드 페이지를 만드는 일은 이제 도구 셋과 20분의 문제에 가깝습니다. 관건은 기술이 아니라 순서를 아는 것과, 배포 단계의 두 규칙을 놓치지 않는 것입니다. 매장을 운영하신다면 어떤 사진을 첫 화면에 두시겠습니까. 전체 과정의 화면 시연은 방구석컴퍼니 유튜브에서 확인하실 수 있습니다.