Oil UI
갤러리로 돌아가기

AI의 디자인 역량을온전히 끌어내세요.

뻔한 템플릿에서 벗어나 서로 다른 방향을 탐색하고 기본 습관을 제거하며 실제 브라우저에서 모든 화면을 다듬으세요.

Oil UIAI를 위한 UI 디자인 스킬

개성이 살아 있는 인터페이스를 만드세요.

Oil UI(오픈 소스) · 비용 없음GitHub
npx skills add oil-oil/oil-ui
스크롤해서 작동 방식 살펴 보기

Oil UI Pro

$9.99 · 1회 구매

오픈 소스 스킬을 넘어 사용성, 기존 프로젝트 개선, 더 엄격한 리뷰까지 제공합니다.

Oil UI Pro 설치를 위해 다음 명령을 실행해 줘: npx github:oil-oil/oil-cli install oil-ui-pro

에이전트에 보내면 결제와 설치를 도와줍니다.

Pro의 추가 기능 살펴 보기
01

기본 제공 비교 페이지에서 서로 다른 스타일 탐색

구성, 타이포그래피, 팔레트, 이미지가 다른 세 가지 방향을 비교하세요. 데스크톱과 모바일을 전환하고 하나의 뷰를 연 다음 Agent가 구현할 방향을 선택하세요.

Oil UIPRO칭야 미술관 · 물빛과 그릇

방문객이 ‘물빛과 그릇’ 가을 특별전의 일정과 전시실, 기물의 감상 포인트를 살펴 보고 방문을 예약하도록 돕습니다.

황혼의 연못가에 놓인 청자 그릇과 도자기 병
칭야 미술관가을 특별전

물빛
그릇

2026.11.14 — 2027.02.28제2 전시실
선택됨클릭해 한 장으로 보기 · 실제 크기
01

물 위의 황혼

황혼과 연못을 화면 가득 채웁니다. 기물은 어두운 영역에 두고, 세리프 대제목은 고요한 한쪽에만 배치합니다.

칭야 미술관물빛과 그릇 · 가을 특별전

아침빛저널

버드나무 그림자와 아침빛 속의 청자와 리넨

빛은 수면에,
그릇 위에도 머뭅니다.

일상의 기물과 자연광을 다루는 전시입니다.

11.14 — 02.28제2 전시실
선택됨클릭해 한 장으로 보기 · 실제 크기
02

아침빛 저널

전시 도록을 펼치듯 신문 그리드로 아침빛, 기물, 방문 정보를 정리합니다.

칭야 미술관

창에 낀 안개.
반나절의 빛.

안개 낀 창가의 청자 다기
11.14 — 02.28제2 전시실
선택됨클릭해 한 장으로 보기 · 실제 크기
03

안개 창

유화를 하나의 창에 담고, 물안개와 청자, 종이의 여백이 천천히 펼쳐지게 합니다.

02

AI 기본 템플릿에서 벗어나 불필요한 요소 제거

모델은 그대로 두면 빛나는 eyebrow pill, 왼쪽 강조 막대, 삼중 중첩 카드, 지어낸 지표를 사용합니다. Skill은 이런 기본 습관을 자동으로 감지하고 채움용 요소를 제거해 콘텐츠와 주요 행동이 돋보이게 합니다.

물가 정원의 아침빛을 받은 도예 작업대
물가 아틀리에 · 이틀 수제 워크숍

물가에서 빚는 그릇.
이틀의 손작업.

흙을 반죽하고 물레로 형태를 잡은 뒤 컵의 가장자리를 다듬습니다. 물가의 나무 작업대에서 이틀 동안 일상에서 쓸 그릇 하나를 만듭니다.

일정
11월 14–15일 · 14:00–18:00
남은 자리
2석 · 점토, 유약, 소성 포함
장소
물가 아틀리에 · 정원 작업대 02
기본 출력 / 다섯 가지 관행
01 눈썹 레이블 필✨ 손으로 만드는 창작 여정을 시작하세요

영감을 손에 잡히는 형태로, 장인의 창작에 힘을 더하다

02 한쪽 굵은 테두리

몰입형 도예 체험으로 무한한 가능성을 탐구하고 예술적 잠재력과 창조력을 발휘하세요.

03 삼중 중첩 카드
장인 정신으로 만든 표준 커리큘럼 체계

전문 강사 지도 · 엄선된 수입 재료 · 원스톱 서비스

04 같은 크기의 허구 지표
10,000+누적 수강생
100+엄선 강좌
50+인증 강사
99.9%만족도
05 묻힌 주요 작업회원 가입하고 더 많은 혜택 받기
↔
03

독립 서브에이전트로 실제 화면을 반복 개선

코드 작성은 첫 단계일 뿐입니다. Agent가 실제 브라우저 스크린샷, 200% 크롭, 텍스트를 가린 레이아웃을 캡처해 새로운 서브에이전트에 전달합니다. 블라인드 채점과 차수별 검증을 거쳐 페이지가 9/10을 넘을 때까지 진행합니다.

페이지 사이 · 독립 출판 워크스페이스제07호 · 가을호

작가 원고료 정산서

정산일 11.20
미정산 총액¥8,640.00
2건 서류 완비 · 1건 은행 정보 필요
작가와 원고세후 원고료 (¥)상태
린야오물을 따라 걷기 · 장문3,200.00정산 가능
천저우사물의 또 다른 면 · 사진2,880.00정산 가능
쉬난정원 스케치 · 일러스트2,560.00은행 정보 필요
서류가 부족한 원고는 다음 호로 자동 이월
04

기존 프로젝트를 개선하고 투박한 워크플로 간소화

기존 코드베이스에서는 Agent가 먼저 실제 작업을 수행하며 클릭, 페이지 이동, 되돌아가야 할 위험을 셉니다. 그다음 토큰 정리부터 인라인 일괄 워크플로까지 단계별 개선안을 제안합니다.

작업 완료까지 필요한 클릭 수
2단계
페이지 이동 횟수
0회
작업 점검 중 되돌아가기 위험
낮음 · 같은 화면 미리 보기 + 일괄 처리와 실행 취소
브랜치 · 고객 커뮤니케이션 북
지난주 미회신 대기열 (3)
10월 6일
10월 8일
10월 9일
고객 2명 선택됨
커뮤니케이션 맥락 미리 보기

저우위 · 샤오만 서점

가을 북페어 안내와 멤버십 카드

지난 발신
10월 6일 · 초안 제안 발송 완료
현재 상태
고객 회신 대기 중
‘가을 북페어 안내와 멤버십 카드 초안을 전달했습니다. 편하실 때 확인해 주세요. 이번 주에 확정해 주시면 다음 단계도 일정대로 진행할 수 있습니다.’

Agent에 바로 전송할 수 있는 프롬프트

긴 프롬프트는 필요 없습니다. 원하는 것을 한 문장으로 말하고 나머지는 Skill에 맡기세요.

oil-ui를 사용해 미술관의 가을 특별전 예약 페이지를 디자인해 줘.

Skill이 먼저 서로 다른 방향 세 가지를 비교 페이지에 배치하고 선택한 방향을 구현합니다.

오픈소스 / Pro

오픈소스와 Oil UI Pro 비교

단계 및 기능
Oil UI(오픈소스)무료 · MIT
Oil UI Pro$9.99 · 한 번 구매
방향 탐색, 비교 페이지, 스크롤 스토리텔링포함(카테고리 벤치마크, 톤, 서로 다른 방향, 비교 페이지, 이미지, 모션 및 패럴록스 / 연속 숏)포함하며 다각도 콘셉트 생성과 일관된 전체 페이지 시각 연속성 추가
실제 화면 캡처 및 독립 서브에이전트 리뷰데스크톱/모바일 캡처, 스크린샷 재현 비교, 문제 목록이 있는 채점형 블라인드 리뷰9/10을 목표로 반복 리뷰 및 검증(최대 3회), 방향 중복 확인, 페이지에서 실제 작업 완료
AI 기본값 탈피 및 세부 다듬기자동화된 AI 기본값 감지, 가독성 기준, 전달 전 요소 제거AI 디자인 기본값 전체 점검, 100%/200% 세부 체크리스트, 줄별 단순화
사용성: 상호작용, 폼, 반응형 레이아웃주의할 점 안내완전한 상호작용과 상태, 폼 및 오류 복구, 대화 상자와 팝오버, 데스크톱 및 모바일 레이아웃
대시보드와 도구: 워크스페이스 레이아웃 및 연속성—제품에 맞게 선택한 객체 중심 워크스페이스 레이아웃 10가지와 전체에 적용되는 일관된 스타일
기존 프로젝트: UI 개선, 흐름 수정, 새 기능필요한 접근 방식 안내주석이 달린 단일 페이지 진단, DESIGN.md 명세가 있는 3단계 UI 개선, 클릭 수를 센 흐름 수정
단일 컴포넌트 완성도, 카드 프로토타입 19가지, 효과미니게임을 위한 속도감, 조작감, 생성 에셋, 실시간 3D단일 컴포넌트 극한 다듬기, 코드와 공간 컨테이너가 있는 카드 프로토타입 19가지, 빛의 궤적 / 도트 패턴 / 흐르는 그라디언트, 전체 미니게임 점검

지금 앞에 놓인 작업으로 시도해 보세요.

어디서 시작할지 확실하지 않다면 먼저 실제 페이지에서 무료 오픈소스 버전을 실행해 보세요. 이미 Pro가 있다면 모든 기능이 포함되어 있으므로 둘 다 설치할 필요가 없습니다.

Oil UI 오픈소스

MIT 라이선스에 따라 무료입니다. 터미널에서 명령 하나로 설치되며 설정이 필요 없습니다.

npx skills add oil-oil/oil-ui

Oil UI Pro

$9.99 · 한 번 구매, 평생 업데이트

카드, Alipay, WeChat으로 결제할 수 있습니다. 아래 프롬프트를 Agent에 전송할 때 로그인, 결제, 설치 과정을 안내합니다.

Oil UI Pro를 설치해 줘: npx github:oil-oil/oil-cli install oil-ui-pro 실행