본문 바로가기
감정일기(가칭)

🚀 iOS에서 앱 로고를 보여주는 두 가지 방식 — LaunchScreen vs SplashViewController 완전 정리

by 밤새는 탐험가89 2025. 10. 15.
728x90
SMALL

앱을 실행하면 제일 먼저 보이는 화면,
바로 앱 로고 화면이죠.
인스타그램, 당근마켓, 카카오뱅크 같은 앱을 실행하면
로고가 잠깐 등장하고 자연스럽게 메인 화면으로 넘어가는 걸 볼 수 있습니다.

그런데 여기서 초보 개발자들이 많이 헷갈리는 포인트가 있어요 👇

 

바로 이 “로고만 잠깐 보여주는 인스타그램/당근마켓 스타일”이
많은 초보 개발자들이 헷갈리는 LaunchScreen vs SplashViewController의 경계선 사례입니다.


🧩 1. LaunchScreen이란?

LaunchScreen.storyboard
앱이 실행될 때 iOS 시스템이 자동으로 보여주는 정적 화면이에요.

즉, 앱 코드가 실행되기도 전에 표시되는 placeholder입니다.

 

✅ 특징

- 정적인 화면만 가능 (애니메이션 불가)

- 시스템이 자동으로 표시 (앱 실행 전)

- Swift 코드로 접근 불가

- 앱이 로드될 때 “빈 화면 대신 브랜드 로고를 보여주는 목적”

 

🔹 Apple의 공식 문서에서도 LaunchScreen
앱 로드 중 사용자에게 브랜드 일관성을 유지하는 placeholder”라고 명시돼 있습니다.


🎬 2. SplashViewController란?

LaunchScreen은 정적인 화면이라
로고를 살짝 움직이거나, 페이드인 효과를 주거나,
초기 데이터를 불러오는 동안 잠시 로딩을 표시할 순 없습니다.

그래서 등장하는 게 바로 SplashViewController예요.

 

✅ 특징

- 앱 코드 실행 후 표시 (즉, 우리가 제어 가능)

-애니메이션 가능

- 초기 로직 수행 가능 (Core Data, Firebase, UserDefaults 등)

- 메인 화면으로 넘어가기 전 준비 구간

 

즉, SplashViewController
앱이 완전히 실행된 후 “로고를 조금 더 보여주거나 초기화 시간을 벌기 위한” 용도로 사용됩니다.


⚖️ 3. LaunchScreen vs SplashViewController 비교

구분 LaunchScreen SplashViewController
표시 시점 앱 코드 실행 전 앱 코드 실행 후
제어 가능 여부 ❌ 불가능 ✅ 가능
애니메이션 ❌ 정적 화면만 ✅ 자유롭게 가능
목적 UX적으로 빈 화면 방지 브랜드 연출 + 초기화 시간 확보
예시 인스타그램, 유튜브 쿠팡, 당근마켓, 카카오뱅크

 


🌈 4. 실제 앱들은 어떻게 할까?

앱 이름 구현 방식 특징
인스타그램 LaunchScreen만 사용 로고만 빠르게 표시 후 바로 피드 진입
유튜브 LaunchScreen만 사용 실행 속도가 빨라 별도 Splash 불필요
쿠팡 / 당근마켓 / 카카오뱅크 LaunchScreen + SplashViewController 로고 유지하면서 초기화 시간 확보 및 브랜드 노출 강화

 

로고를 살짝 보여주고 바로 진입하는 앱은 LaunchScreen만,
조금 더 브랜드를 강조하거나 초기 데이터를 불러와야 하는 앱은 SplashViewController도 함께 사용합니다.


⚙️ 5. 우리가 선택한 구조

우리 앱은 LaunchScreen + SplashViewController를 조합해서 사용했습니다.

 

1️⃣ LaunchScreen.storyboard

- 로고를 화면 중앙에 정적으로 배치

- 앱 실행 직후 시스템이 자동으로 표시

 

2️⃣ SplashViewController

- LaunchScreen과 동일한 로고를 코드로 배치

-UIView.animate로 페이드인 효과 추가

- 내부 초기화(Core Data 준비, 설정값 로드 등) 수행

- 일정 시간 후 메인 화면으로 자연스럽게 전환

UIView.animate(withDuration: 0.75, animations: {
    self.logoImageView.alpha = 1.0
}) { _ in
    DispatchQueue.main.asyncAfter(deadline: .now() + 0.8) {
        self.moveToMain()
    }
}

🕰 6. DispatchQueue.main.asyncAfter — 왜 사용하는가?

여기서 핵심 포인트입니다 👇
DispatchQueue.main.asyncAfter는 단순한 딜레이 코드가 아닙니다.

 

🎯 UX적으로 화면 전환 타이밍을 조절하기 위한 장치입니다.

 

📍 ① 안 쓴 경우

UIView.animate(withDuration: 0.75) {
    self.logoImageView.alpha = 1.0
} completion: { _ in
    self.moveToMain()
}
0.00s  앱 실행
0.10s  로고 페이드인 시작
0.75s  로고 완전히 표시됨
0.76s  바로 메인 화면 전환 시작

 

👁‍🗨 사용자 입장

“로고가 다 보이기도 전에 화면이 바뀌네?”

→ 빠르긴 하지만 급한 느낌.

 

📍 ② asyncAfter 쓴 경우

UIView.animate(withDuration: 0.75) {
    self.logoImageView.alpha = 1.0
} completion: { _ in
    DispatchQueue.main.asyncAfter(deadline: .now() + 0.8) {
        self.moveToMain()
    }
}
0.00s  앱 실행
0.10s  로고 페이드인 시작
0.75s  로고 완전히 표시됨
1.55s  (0.8초 유지) 후 메인 전환

👁‍🗨 사용자 입장

“로고가 잠시 머물다 자연스럽게 넘어간다.”

→ 더 부드럽고 완성도 있는 느낌.


💡 정리하자면

목적 추천 구현
앱을 빠르게 띄우고 싶다 LaunchScreen만 사용
로고를 강조하거나 초기 로딩 필요 LaunchScreen + SplashViewController
전환을 부드럽게 만들고 싶다 DispatchQueue.main.asyncAfter로 0.5~1초 정도 텀 주기

🧠 결론

LaunchScreen은 정적인 “프리뷰”,

SplashViewController브랜딩과 초기화 로직을 위한 “무대”입니다.

 

우리는 이 두 가지를 조합해서


✅ 앱 실행 직후 로고를 자연스럽게 표시하고,
✅ DispatchQueue.main.asyncAfter로 화면 전환 타이밍을 조절해


사용자에게 완성도 높은 첫 인상을 줄 수 있게 만들었습니다.

728x90
LIST