🧸 Daily UI 002
Prompt : Credit Card Checkout (신용카드 결제 화면)
신용카드 결제 양식 또는 결제 페이지를 디자인하세요.
카드 번호, 유효 기간, 보안 번호(CVC) 등 중요한 요소들을 잊지 마세요.
신용카드 결제 폼에 포함되어야 할 주요 요소들
| 항목 | 설명 |
|---|---|
| Card Number (카드 번호) | 16자리 숫자 (보통 4자리씩 구분) |
| Cardholder Name (카드 소유자 이름) | 카드에 적힌 영문 이름 |
| Expiration Date (유효 기간) | MM/YY 형식으로 월/연도 입력 |
| CVC / CVV (보안 번호) | 보통 카드 뒷면의 3자리 숫자 |
| Billing Address (청구지 주소) | 필요 시 입력 (특히 해외 결제) |
| ZIP/Postal Code (우편번호) | 주소 인증용 보조 정보 |
디자인할 때 고려해야 할 UX 요소
| UX 요소 | 설명 |
|---|---|
| 입력 포맷 가이드 | 예) 카드 번호 입력 시 자동으로 4자리마다 띄어쓰기 |
| 에러 처리 | 유효하지 않은 카드 번호나 만료된 날짜 입력 시 경고 메시지 |
| 보안 강화 | CVC는 마스킹 처리(****), HTTPS 보장 등 |
| 모바일 반응형 | 작은 화면에서도 편리하게 입력 가능하게 |
| 신뢰성 강조 요소 | 예) ‘안전한 결제’, 보안 배지 표시 등 |
🧸 결과물
 |  |  |
|---|
- Daily 001의 커리룸의 UI를 이어서 만들어봤다.
- 코레일의 결제 UI를 참고했다.
- 역시 흰배경이 좋으려나..?
- 브랜드 이미지를 넣으려고 컬러를 강조했는데 좀 답답해 보인다.
