블로그에 글은 쌓이고 있는데, 정작 블로그 모습은 마음에 들지 않았다. 특히 Yulchive가 그랬다. 기능은 있지만, 다시 들어와 둘러보고 싶은 공간이라는 느낌은 부족했다.
그래서 Threads에서 발견한 웹 디자인 도구들을 Aside에게 차례로 보여줬다. 좋은 디자인을 모아 놓은 사이트부터 AI가 직접 디자인하고 검사하게 만드는 스킬까지 있었다.
처음에는 모두 ‘웹사이트를 예쁘게 만드는 도구’처럼 보였다. 하지만 비교해 보니 역할이 달랐다. 참고할 디자인을 찾는 도구, 만드는 절차를 잡아주는 도구, 여러 시안 중 취향을 고르게 하는 도구로 나눌 수 있었다.
이번 글은 설치·사용 후기가 아니다. 소개 글과 일부 공식 자료를 읽고, 내 블로그에 어떻게 활용할지 생각해 본 탐색 기록이다. 공식 자료의 내용은 2026년 10월 27일에 다시 확인한 기준이다.
1. 먼저, AI에게 보여줄 좋은 사례를 찾는다
처음 본 Threads 글은 디자인 참고 사이트 일곱 곳을 소개했다. 게시글에서 설명한 용도를 정리하면 이렇다. 일곱 곳의 기능을 공식 자료로 모두 확인한 것은 아니다.
- Kombai Gallery: 로그인·대시보드 등 화면별 디자인 사례와 AI에 전달할 프롬프트.
- Taste: 마음에 드는 디자인을 모아 AI에게 취향을 전달하는 서비스.
- Inspo: 실제 웹사이트와 색상·글꼴·간격 등의 디자인 규칙을 살펴보는 자료실.
- A1 Gallery: 스타일·글꼴·색상을 기준으로 웹사이트를 찾는 곳.
- Screenshots – Design Inspiration: 실제 제품의 웹·모바일 화면을 참고하는 오픈소스 프로젝트.
- Gummble: 앱 화면뿐 아니라 로그인·결제 같은 이용 흐름을 살펴보는 라이브러리.
- Collect UI: 화면 종류별로 디자이너들의 작업물을 찾아보는 아카이브.
이 중 두 곳은 공식 사이트를 다시 확인했다. Inspo는 실제 운영 중인 사이트 832곳을 모은 자료실이라고 소개하고, 코딩 AI에 MCP로 연결하는 방법도 안내한다. Taste는 1,700개 이상의 실제 앱·웹 디자인을 둘러보고 저장하면 AI 도구가 내 취향대로 디자인하게 된다고 설명하며, 무료로 시작할 수 있다고 안내한다.
여기서 중요한 것은 사이트 개수보다 사용법이었다.
“깔끔하고 세련되게 만들어 줘”라는 말만으로는 내가 원하는 모습이 잘 전달되지 않는다. 대신 “이 사이트의 사진 배치가 좋고, 저 사이트의 제목과 여백이 좋다”고 보여주면 기준이 구체적이 된다.
일부 서비스가 지원한다는 MCP도 같은 맥락에서 이해했다. AI가 외부 디자인 자료를 직접 찾아 쓰도록 연결하는 통로다. 연결만 하면 좋은 디자인이 완성되는 마법은 아니다.
이름이 헷갈리기 쉬운 점도 있다. 여기서 말하는 Taste 서비스와 다음에 나오는 Taste Skill은 별개다.
2. Taste Skill: 만드는 과정과 검사 절차를 정한다
두 번째로 본 것은 Threads에서 소개된 GitHub의 Taste Skill이었다. 참고 자료를 모아 놓은 서비스가 아니라, 코딩 AI에게 디자인 작업 방식을 알려주는 스킬이다.
공식 README는 247개 사이트 연구를 바탕으로 디자인 방향을 제안하고, 공개 아카이브의 실제 사진과 영상으로 제작한 뒤, 실제 브라우저에서 세 가지 화면 너비로 검사하고 스크린샷을 보며 고치는 절차를 설명한다.
앞선 도구가 “무엇을 참고할까?”에 가깝다면, 이것은 “어떤 순서로 만들고 확인할까?”에 가깝다.
특히 눈에 들어온 부분은 결과물을 실제 브라우저에서 확인한다는 점이었다. 코드가 정상이라고 해서 화면까지 좋은 것은 아니다. 제목이 어색하게 줄바꿈되거나, 모바일에서 사진이 잘리거나, 쓸데없는 여백이 크게 남을 수 있다.
다만 자동 검사가 내 취향까지 판단해 주는 것은 아니다. 글자가 넘치지 않는 화면과 마음에 드는 화면은 다른 문제다.
비용도 고려해야 한다. README는 한 번 제작하는 데 약 30~45분과 수십만 토큰이 든다고 안내한다. 이는 제작자 설명이며, 직접 실행해 측정한 결과는 아니다. 스킬 자체는 MIT 라이선스로 공개돼 있지만, AI 실행 비용까지 없어지는 것은 아니다.
3. Oil UI: 한 가지 시안을 계속 고치기 전에 비교한다
세 번째로 Threads에서 본 Oil UI에서 가장 마음에 든 것은 비교 방식이었다.
AI에게 디자인을 맡기면 시안 하나가 나오고, 그 뒤로 “좀 더 깔끔하게”, “사진을 크게”, “이건 아닌데”를 반복하기 쉽다. Oil UI는 처음부터 서로 다른 방향을 펼쳐 놓고 고르게 한다.
공식 README에 따르면 레이아웃·글꼴·색상·주요 이미지 중 두 시안이 공유하는 요소를 최대 하나로 제한하고, 비슷해 보이면 색만 바꾸는 대신 레이아웃을 바꾼다. 기존 화면도 비교 페이지 맨 앞에 넣고 데스크톱·모바일 크기로 살펴볼 수 있다.
이 방식은 내 상황에 잘 맞아 보였다. 지금 블로그가 마음에 들지 않는다는 것은 확실하지만, 원하는 모습을 디자인 용어로 정확히 설명하기는 어렵기 때문이다.
서로 다른 전체 화면을 보면 “이쪽이 더 좋다”는 판단은 할 수 있다. 먼저 방향을 고른 뒤 세부적인 문제를 다듬는 편이, 시안 하나를 끝없이 수정하는 것보다 낫겠다는 생각이 들었다.
무료판과 유료판의 범위는 구분해야 한다. README는 오픈소스판을 새 페이지를 처음부터 디자인하는 용도로, 기존 프로젝트 개선·사용성 점검·더 엄격한 검토는 Oil UI Pro 기능으로 구분한다. 확인 시점의 Pro 가격은 9.99달러 일회성 구매로 안내돼 있었다. 기존 블로그를 고치려는 내 목적에는 무료판만으로 부족할 수 있다는 뜻이다.
4. 그래서 Yulchive는 무엇을 바꾸면 좋을까
Aside와 당시 Yulchive 홈과 글 화면을 살펴보면서 나온 판단은, 색상보다 구조를 먼저 바꿔야 한다는 것이었다. 아래 평가는 그때 본 화면 기준이다.
홈에는 비슷한 글 카드가 반복됐다. 카테고리와 태그는 많았지만, 정작 글과 사진의 개성이 먼저 드러나지는 않았다. 텃밭, 일상, 영화, AI 실험처럼 서로 다른 기록이 같은 모양으로 나열돼 있었다.
참고 사례로는 Inspo에 보관된 Google Design, The Bitter Southerner, Wallpaper의 화면을 살펴봤다. 그대로 복제하려는 것은 아니다. 사진과 제목을 어떻게 배치하는지, 여러 주제를 어떻게 구분하는지 참고하기 위해서였다.
처음에는 ‘개인 매거진형 아카이브’가 괜찮겠다고 생각했다. 하지만 Oil UI의 방식을 보고 나니, 그것도 정답으로 확정하기 전에 비교해 보는 편이 좋겠다.
같은 실제 글과 사진을 사용해 다음 세 방향을 나란히 보는 것이다.
- 사진 중심 생활 매거진: 텃밭과 여행 사진이 먼저 눈에 들어오는 구성.
- 차분한 개인 저널: 제목과 본문 읽기에 집중하고 사진은 필요한 곳에 배치.
- 주제별 기록 아카이브: 텃밭 성장 기록이나 AI 실험을 연재별로 따라가는 구성.
이미지가 없는 글마다 장식용 AI 그림을 만들 필요도 없겠다. 사진이 있는 글은 사진을 살리고, 없는 글은 제목과 짧은 설명만으로도 보기 좋게 구성하는 편이 기록의 성격에 맞는다.
5. 도구를 모두 설치하는 것이 답은 아니다
이번에 살펴본 도구들은 경쟁 관계라기보다 서로 다른 단계에 놓여 있었다.
레퍼런스 자료실에서 재료를 찾고, Oil UI식으로 방향을 비교하고, Taste Skill에서 강조하는 실제 화면 검수로 다듬는다.
그렇다고 세 종류를 모두 설치해야 한다는 뜻은 아니다. 각 도구에서 유용한 원칙을 가져오는 것부터 시작할 수 있다.
내가 이번에 얻은 것은 새로운 설치 명령어보다 작업 순서였다.
자료를 찾고 → 다른 방향을 비교하고 → 하나를 고르고 → 실제 화면에서 확인한다.
아직 Yulchive의 디자인을 바꾸거나, 이 스킬들을 설치해 성능을 시험한 것은 아니다. 이번 단계는 무엇을 참고하고 어떻게 판단할지 정리한 데까지다.
그래도 “AI에게 예쁘게 만들어 달라고 하면 되겠지”라는 생각에서는 한 걸음 벗어났다. 내 블로그를 보기 좋게 만드는 데 필요한 것은 더 강한 형용사가 아니라, 구체적인 사례와 비교할 선택지, 그리고 실제 화면을 보는 과정이었다.