UI/UX 레퍼런스

앱·웹 화면, 유저 플로우, 랜딩페이지 인스피레이션

실제 앱·웹 화면과 유저 플로우, 랜딩페이지를 볼 수 있는 UI/UX 레퍼런스 사이트를 모았습니다.

UI/UX 레퍼런스를 찾는 이유는 대개 둘 중 하나입니다. 지금 만드는 화면을 남들은 어떻게 풀었는지 보고 싶거나, 막연한 '느낌'을 잡을 시안 몇 장이 필요하거나. 이 둘은 찾아야 하는 곳이 다릅니다.

마지막으로 고친 날 2026. 10. 15 · 업데이트 기록 · 이 분야 안내

앱 화면 · 플로우 11

유아이볼 (UIBowl)uibowl.io
국내 앱·웹 화면을 로그인·결제·마이페이지 같은 UI 패턴과 업종별로 모은 레퍼런스. MAU 필터와 피그마 내보내기를 지원합니다.
What Was ITwwit.design
국내 모바일 앱의 화면을 업종별·화면 패턴별·컴포넌트별로 모은 한국어 UI/UX 레퍼런스. 온보딩, 로그인, 결제 같은 화면을 앱마다 볼 수 있습니다.
Mobbinmobbin.com
실제 서비스 앱·웹 화면과 플로우를 통째로 모아둔 UI 아카이브. 화면 단위 검색이 강력합니다.
Referorefero.design
실제 프로덕트의 UI 패턴을 컴포넌트·페이지 유형별로 검색할 수 있는 레퍼런스 툴.
Page Flowspageflows.com
온보딩, 결제 등 유저 플로우를 영상으로 기록해 둔 사이트.
UX Archiveuxarchive.com
모바일 앱 유저 플로우를 단계별 스크린샷으로 정리.
Pttrnspttrns.com
모바일 앱 UI 패턴 레퍼런스의 고전.
ScreensDesignscreensdesign.com
앱스토어 스크린샷과 실제 앱 UI 플로우를 모아둔 사이트.
Nicelydonenicelydone.club
SaaS 프로덕트의 UI 패턴·플로우를 모아둔 레퍼런스.
Really Good UXgoodux.appcues.com
온보딩·엠프티 스테이트 등 잘 만든 UX 사례 모음.
Collect UIcollectui.com
Dribbble 샷을 UI 요소(로그인, 404, 대시보드 등)별로 분류한 갤러리.

웹 · 랜딩 12

Nooknook.ai.kr
국내·해외 웹사이트를 화장품·패션·IT 같은 업종과 쇼핑몰·랜딩 같은 목적별로 모은 레퍼런스. 색상·국가 필터와 북마크·팀 폴더가 있습니다.
Land-bookland-book.com
랜딩페이지 갤러리. 산업·스타일·컬러별 필터가 잘 되어 있습니다.
Lapa Ninjalapa.ninja
랜딩페이지 인스피레이션 모음. 무료 UI 킷·북도 함께 제공합니다.
SaaS Landing Pagesaaslandingpage.com
SaaS 랜딩페이지 예시를 섹션·유형별로 정리한 사이트.
Supaherosupahero.io
웹사이트 첫 화면(히어로 섹션)만 골라 모은 갤러리. 랜딩페이지의 첫인상을 잡을 때 좋습니다.
One Page Loveonepagelove.com
원페이지 웹사이트 갤러리와 템플릿.
Landingfoliolandingfolio.com
랜딩페이지·컴포넌트 인스피레이션. 섹션별 검색.
Minimal Galleryminimal.gallery
미니멀한 웹사이트만 모아둔 갤러리.
Dark Mode Designdarkmodedesign.com
다크 모드 웹사이트 레퍼런스만 모아둔 사이트.
Httpsterhttpster.net
트렌디하고 실험적인 웹사이트를 모아둔 갤러리.
Curated Designcurated.design
트렌디한 웹 디자인 큐레이션. 타입·스타일별 필터 제공.
Muzlimuz.li
디자인 인스피레이션 피드. 크롬 확장 프로그램으로 새 탭에서 바로 볼 수 있습니다.

어워드 · 큐레이션 7

지디웹 (GDWEB)gdweb.co.kr
국내 웹·앱 디자인 어워드. 한국 기업 사이트 레퍼런스를 찾을 때 유용합니다.
디비컷 (DBCUT)dbcut.com
국내 웹디자인 레퍼런스 모음. 업종별·스타일별로 한국 사이트를 살펴볼 수 있습니다.
Awwwardsawwwards.com
세계적인 웹 디자인 어워드. 인터랙션이 뛰어난 사이트를 매일 선정합니다.
CSS Design Awardscssdesignawards.com
Awwwards와 함께 대표적인 웹 디자인 어워드.
FWAthefwa.com
2000년부터 이어진 인터랙티브 웹 어워드.
Recent (구 Godly)recent.design
감각적인 웹사이트만 엄선한 큐레이션. Godly에서 이름을 바꿨습니다.
Siteinspiresiteinspire.com
깔끔하고 세련된 웹사이트 쇼케이스. 스타일·타입·주제별 필터 제공.

디테일 · 인터랙션 5

Footer.designfooter.design
웹사이트 푸터 디자인만 모아둔 레퍼런스.
Navbar Gallerynavbar.gallery
내비게이션 바 디자인 레퍼런스 모음.
Design Spellsdesignspells.com
사용자를 미소 짓게 하는 UI 디테일·인터랙션 모음.
Ripplixripplix.com
실제 앱·웹에서 모은 UI 애니메이션과 마이크로 인터랙션 7,000여 개. 요소·업종·서비스별로 찾아볼 수 있습니다.
Bento Gridsbentogrids.com
벤토 그리드 레이아웃 레퍼런스 모음.

UX 이론 5

Laws of UXlawsofux.com
힉의 법칙, 피츠의 법칙 등 UX 심리학 법칙을 카드로 정리.
Nielsen Norman Groupnngroup.com
UX 리서치의 권위 있는 기관. 휴리스틱, 리서치 아티클이 풍부합니다.
Growth.designgrowth.design
유명 서비스의 UX를 만화 형식으로 분석한 케이스 스터디.
UI Patternsui-patterns.com
UI 패턴을 문제·해결 관점에서 정리한 패턴 라이브러리.
Checklist Designchecklist.design
페이지·컴포넌트별 디자인 체크리스트.

UI/UX 레퍼런스, 이렇게 고릅니다

화면 하나를 풀어야 할 때

로그인, 결제, 마이페이지처럼 정해진 화면을 만들고 있다면 '앱 화면 · 플로우'부터 보세요. 국내 서비스라면 유아이볼과 What Was IT가 먼저입니다. 해외 앱 화면만 보고 만들면 본인인증, 간편결제, 약관 동의처럼 한국 서비스에만 있는 단계가 빠지기 쉽거든요. 해외 사례까지 넓게 보려면 Mobbin이 가장 방대하고, 무료로 시작하려면 UX Archive나 Pttrns가 있습니다.

한 장짜리 화면보다 흐름이 궁금하다면 Page Flows처럼 단계를 순서대로 보여 주는 곳이 낫습니다. 버튼 위치보다 "몇 번 만에 끝나는가"가 더 중요한 경우가 많습니다.

분위기를 잡아야 할 때

랜딩페이지나 브랜드 사이트라면 '웹 · 랜딩'과 '어워드 · 큐레이션'을 보세요. Land-book과 Lapa Ninja는 업종별로 거르기 좋고, Supahero는 첫 화면만 모아 둬서 시안 첫 장을 잡을 때 빠릅니다. 국내 기업 사이트 톤을 봐야 한다면 Nook, 지디웹, 디비컷이 맞습니다.

어워드 사이트(Awwwards, FWA)는 영감용으로 보세요. 실험적인 인터랙션이 많아서 그대로 실무에 옮기면 느리고 쓰기 어려운 사이트가 되기 쉽습니다.

근거가 필요할 때

"왜 이렇게 했어요?"라는 질문에 답해야 한다면 'UX 이론'의 Laws of UX와 Nielsen Norman Group이 도움이 됩니다. 레퍼런스 스크린샷 열 장보다 원칙 한 줄이 설득력 있을 때가 있습니다.