Codex용 앱 설정 화면 디자인 프롬프트

표준 그룹 목록, 행마다 현재 값, 필요한 곳의 토글, 빨간색 위험 동작을 갖춘 앱 설정 화면을 디자인합니다.

표준 [iOS] 그룹 목록으로 설정 화면을 디자인해 줘: [계정, 하루 목표, 알림, 화면 스타일, 데이터 및 개인정보, 도움말]. 각 행의 오른쪽에 현재 값을 보여 주고, [알림]에는 토글을 쓰고, [계정 삭제] 같은 위험한 동작은 맨 아래에 빨간색으로 넣어 줘.

지원 도구

Codex, ChatGPT

프롬프트 모음

모바일 앱

이 프롬프트 소개

Codex가 플랫폼 고유의 스타일로 설정 화면을 디자인합니다. 내가 정한 섹션 이름 아래의 그룹 목록, 행마다 오른쪽의 현재 값, 켜고 끄는 설정에는 토글, 계정 삭제 같은 위험한 동작은 맨 아래에 빨간색으로 놓입니다.

첫 번째 대괄호의 플랫폼과 여섯 개의 그룹을 화면 목록에서 나온 것으로 바꾸세요. 토글이어야 할 설정은 모두 이름을 적으세요. 나머지는 다른 화면으로 이어지는 행이 됩니다. 설정은 사용자가 독창성이 아니라 관례를 기대하는 곳이므로 표준 그룹 목록을 요청한 것은 의도적입니다. 브랜드 색상은 구조가 아니라 토글과 링크에 쓰세요.

하루 목표의 “20분”이나 알림의 “오후 8:30”처럼 실제 같은 현재 값을 채워서 긴 값이 라벨을 두 줄로 밀어내는지 확인하세요. Android에도 출시한다면 이 화면의 Material 3 버전을 요청하세요. 그룹 목록은 거기서 모양과 동작이 다릅니다.

이 모음의 다른 프롬프트

• Codex용 빈 상태·로딩·오류 상태 디자인 프롬프트앱 화면의 빈 상태, 로딩, 오류 상태를 일반 화면과 같은 내비게이션과 헤더로 별도 파일에 디자인합니다.
• Codex용 앱 다크 모드 디자인 프롬프트색조가 있는 어두운 배경, 채도를 낮춘 포인트 색상, WCAG AA 텍스트 대비로 다크 모드를 만들고 바꾼 색상을 정리합니다.
• Codex용 Android Material 3 적용 프롬프트iOS 앱 화면을 Material 3로 Android에 맞게 바꿉니다. 상단 앱 바, 내비게이션 바, FAB을 쓰고 브랜드 색상은 유지합니다.
• Codex용 모바일 앱 목업을 SwiftUI 코드로 바꾸는 프롬프트승인된 HTML 화면을 내 SwiftUI 앱에 구현하게 합니다. 레이아웃과 간격을 맞추고, 테마 색상을 쓰고, Dynamic Type을 지원합니다.
• Codex용 모바일 앱 브리프와 화면 목록 프롬프트앱의 사용자, 핵심 루프, 플랫폼을 설명하고 첫 버전의 모든 화면을 묶음별로, 화면마다 목적과 함께 나열하게 합니다.
• Codex용 앱 온보딩 흐름 디자인 프롬프트환영, 목표 선택, 첫 홈 화면으로 이어지는 390×844 온보딩 화면 3개를 CSS 일러스트와 공통 스타일로 디자인합니다.