Codex용 Android Material 3 적용 프롬프트
iOS 앱 화면을 Material 3로 Android에 맞게 바꿉니다. 상단 앱 바, 내비게이션 바, FAB을 쓰고 브랜드 색상은 유지합니다.
프롬프트
[홈] 화면을 Material 3 규칙에 맞춰 Android용으로 바꿔 줘: 상단 앱 바, 내비게이션 바, 어울린다면 [세션 시작]용 플로팅 액션 버튼. 브랜드 색상과 타이포그래피는 유지해 줘. iOS 버전과 달라진 점을 정리해 줘.
- 지원 도구
- Codex, ChatGPT
- 프롬프트 모음
- 모바일 앱
이 프롬프트 소개
Codex가 기존 iOS 화면을 가져와 Material 3 패턴으로 다시 만듭니다. 상단 앱 바, iOS 탭 바 대신 내비게이션 바, 화면에 어울린다면 주요 행동을 위한 플로팅 액션 버튼이 들어갑니다. 브랜드 색상과 서체는 그대로 두고, iOS 버전과 달라진 점은 Codex가 모두 나열합니다.
화면 이름과 플로팅 버튼이 될 수 있는 행동을 적으세요. 프롬프트의 “어울린다면”은 의도적입니다. FAB은 세션 시작처럼 자주 하는 단일 행동에 맞고, 주된 역할이 읽기인 화면에는 맞지 않습니다. Codex가 iPhone 크기를 유지한다면 일반적인 Android 휴대폰 크기인 412×915를 요청하세요. 반대로 가려면 Android와 Material 3를 iOS와 Apple의 Human Interface Guidelines로 바꾸면 됩니다.
달라진 점의 목록은 이 화면 하나를 넘어 쓸모가 있습니다. 나머지 화면을 옮길 때의 규칙집이나 마찬가지입니다. 먼저 홈 화면에 프롬프트를 실행해 목록을 확인한 뒤, Android와 iOS의 차이가 가장 큰 설정 화면에서 재사용하세요.
이 모음의 다른 프롬프트
- Codex용 모바일 앱 목업을 SwiftUI 코드로 바꾸는 프롬프트승인된 HTML 화면을 내 SwiftUI 앱에 구현하게 합니다. 레이아웃과 간격을 맞추고, 테마 색상을 쓰고, Dynamic Type을 지원합니다.
- Codex용 모바일 앱 브리프와 화면 목록 프롬프트앱의 사용자, 핵심 루프, 플랫폼을 설명하고 첫 버전의 모든 화면을 묶음별로, 화면마다 목적과 함께 나열하게 합니다.
- Codex용 앱 온보딩 흐름 디자인 프롬프트환영, 목표 선택, 첫 홈 화면으로 이어지는 390×844 온보딩 화면 3개를 CSS 일러스트와 공통 스타일로 디자인합니다.
- Codex용 모바일 앱 홈 화면 디자인 프롬프트내가 가장 중요하다고 정한 요소를 중심으로, 하단 탭 바와 실제 같은 통계를 갖춘 재방문 사용자용 앱 홈 화면을 디자인합니다.
- Codex용 목록·상세 화면 디자인 프롬프트검색창과 필터 칩이 있는 목록 화면과 항목을 열었을 때의 상세 화면을, 실제 같은 제목과 숫자로 파일 두 개에 디자인합니다.
- Codex용 앱 설정 화면 디자인 프롬프트표준 그룹 목록, 행마다 현재 값, 필요한 곳의 토글, 빨간색 위험 동작을 갖춘 앱 설정 화면을 디자인합니다.