iPhone 앱 아이콘

현재 홈 스크린을 보면서, 당신은 두 가지 중 하나를 생각할 것입니다. 기본 아이콘은 배경화면과 위젯과 함께 어울리지 않거나, 앱을 개발하여 사용자가 더 깨끗하고 의도적인 방법으로 개인화할 수 있도록 해주고 싶을 것입니다.

두 가지 문제는 동일한 질문에 있습니다. iPhone에서 앱 아이콘을 변경하는 방법사용자에게는 Apple의 네이티브 홈 스크린 스타일링과 더 오래된 Shortcuts 방법을 선택하는 문제가 있습니다. 사용자에게는 전체 이미지 기반 제어를 위해, 개발자에게는 네이티브 iOS API를 통해 대체 아이콘을 노출하는지 여부를 결정하는 문제가 있습니다. 또한 Ionic 또는 Capacitor에서 작업하는 경우, 웹 기반 앱으로 이를 연결하는 방법을 결정해야 합니다.

내용 목록

iPhone 앱 아이콘 개인화에 대한 당신의 가이드
사용자용 개인화된 아이폰 앱 아이콘
사용자 정의 아이콘의 이점과 단점
- 이점과 단점을 이해하세요
- 개발자 지원 아이콘의 차이점
개발자용 아이폰 앱 아이콘의 대안 구현
개발자용 Capacitor 및 아이오닉 가이드
협력적 인 개인화의 미래는 무엇입니까.

iPhone 앱 아이콘 개인화에 대한 안내서

iPhone 홈 스크린은 오래 전부터 앱의 격자만큼이 아니었습니다. 사람들은 그것을 데스크, داش보드, 그리고 때로는 분위기 보드처럼 사용합니다. 그것은 '개인화'라는 의미를 바꾸는 것입니다. 그것은 단순히 그것이 다른 것만큼 보이게 만드는 것만이 아닙니다. 그것은 장치가 의도적으로 배열된 것처럼 느끼게 만드는 것입니다.

이 변화는 제품의 두 가지 측면 모두에 중요합니다. 사용자는 주제에 맞는 아이콘, 위젯과 일치하는 아이콘, 또는 시각적 오염을 줄이는 아이콘을 원합니다. 개발자는 그것을 지원할 수 있어야 하며, 앱의 원래 느낌을 깨뜨리지 않고 설정이 사용자가 기대하는 대로 동작하지 않는 문제를 발생시키지 않도록 해야 합니다.

iPhone에서 이제 두 가지 다른 아이콘 개인화层이 있습니다. 하나는 사용자 제어 홈 스크린 스타일링, Apple이 직접 지원하는 지원 장치에 대해 Apple이 직접 지원합니다. 다른 하나는 앱 제어 대체 아이콘, 개발자가 아이콘 변형을 앱에 포함시키고 사용자가 그 중에서 선택할 수 있도록 하는 것입니다. 그것들은 관련이 있지만 동일한 기능이 아닙니다.

실용적인 규칙: 많은 아이콘의 모양을 한 번에 변경하고 싶다면, Apple의 내장 홈 스크린 도구부터 시작하세요. 단일 앱의 이미지를 완전히 커스텀화하려면 단축 경로 또는 개발자 제공 아이콘 대체를 사용하세요.

이 distinction은 사용자 경험에도 적용됩니다. 정돈된 홈 스크린은 더 넓은 앱 경험의 일부입니다. 앱을 유지하고 정돈하는 팀은 시각적 커스텀화를 전체적인 모바일 앱 사용자 경험으로 다루며, 메뉴 내에 숨겨진 특별한 설정이 아닙니다.

사용자 개인화 iPhone 앱 아이콘

정돈된 답은 원하는 대로 달라집니다. 시스템 수준 스타일링을 유지하면서 앱이 정상적으로 작동하려면 Apple의 내장 컨트롤을 사용하세요. 단일 앱에 특정 커스텀 이미지를 원한다면 Shortcuts를 사용하세요.

Apple의 내장 iPhone 컨트롤 사용

Apple은 iOS 18에서 native milestone을 추가했습니다. 앱 아이콘의 모양을 직접 Edit > Customize에서 변경할 수 있습니다.__CAPGO_KEEP_0__ __CAPGO_KEEP_1__밑바탕을 포함하여 아이콘 크기를 larger 밑바탕을 포함하여 아이콘을 Dark, Auto, Clear, 또는 Tinted 스타일을, 투명한 아이콘 옵션을 포함하여 밝은, 어두운, 또는 자동 모드에 따라, Apple의 홈 스크린 커스텀화 가이드에 따라.

내장된 프로세스는 간단합니다:

홈 스크린 배경을 터치하고 유지하세요 __CAPGO_KEEP_0__
__CAPGO_KEEP_1__ __CAPGO_KEEP_2__.
__CAPGO_KEEP_3__ __CAPGO_KEEP_4__.
__CAPGO_KEEP_5__ __CAPGO_KEEP_6__, __CAPGO_KEEP_7__, __CAPGO_KEEP_8____CAPGO_KEEP_9__ __CAPGO_KEEP_10__.
__CAPGO_KEEP_11__
__CAPGO_KEEP_0__ 모드에서 레이아웃이 올바르게 보일 때 종료.

이 메서드는 가장 좋은 시작점입니다. native 이기 때문에 fake launcher 를 만들지 않습니다. 시스템 자체에서 지원되는 아이콘을 어떻게 표시할 것인지 변경합니다.

몇 가지 실용적인 주의 사항이 있습니다.

전체 화면 시각적 일관성을 위해 가장 좋습니다. 여러 앱에 일관적인 테마를 달성하는 것이 목표라면, 각 아이콘을 수동으로 다시 만드는 것보다 더 빠릅니다.
커스텀 아트워크에 한정된 경우. 이 메뉴에서 아이콘을 스타일링할 수 있지만, Photos 라이브러리의 임의의 이미지로 앱을 가리킬 수는 없습니다.
일상 사용 앱에 더 안전합니다. 메일, 메시지, 다른 배지가 많은 앱은 실제 앱 아이콘으로 남겨두면 더 자연스럽게 행동합니다.

아이콘 색상 조정과 배경화면, 위젯과 pair 할 때, 시각적 테마를 먼저 시작하는 것이 도움이 됩니다. 밝은 사이버 펑크나 밤 모드 레이아웃과 같은 경우, 네온 아트워크 가이드

After native 방법을 보았을 때, 더 오래된 대안이 여전히 중요합니다. 왜냐하면 그것은 다른 문제를 해결하기 때문입니다.

This visual walkthrough는 classic process를 보여줍니다:

Shortcuts 방법을 사용하여 모든 이미지를 사용하세요.

native 스타일링이 이 지점에 도달하기 전에, 완전히 커스터마이즈된 iPhone 앱 아이콘을 위한 표준 경로는 Shortcuts 앱이었습니다. Shortcuts 앱. 튜토리얼 가이드는 여전히 workflow를 설명합니다: 단축키를 만들고, Open App을 선택하고, 앱을 선택하고, Add to Home Screen 을 사용하고, 아이콘 이미지를 선택하세요. 실제로, 그게 약 5-8 단계입니다. __CAPGO_KEEP_0__에 대한 가시적인 아이콘 교체를 위해 이 Shortcuts 튜토리얼에 따라.

이것이 실제로 작동하는 버전입니다.

열기 Shortcuts.
버튼을 탭하여 새로운 단축키를 만들기 위해. + 단축키 옵션을 열고 선택하십시오.
Open App 액션을 추가하십시오. 앱을 실행할 앱을 선택하십시오.
__CAPGO_KEEP_0__ 옵션을 열고 선택하십시오.
__CAPGO_KEEP_0__ 홈 화면에 추가.
플레이스 홀더 아이콘을 탭하세요.
선택 사진을 선택하세요 또는 파일을 선택하세요.
단축키 이름을 지정한 후 홈 화면에 추가하세요.

이러한 자유를 제공합니다. Apple의 내장 스타일링이 제공하지 않는 것입니다. 단색 아이콘 패키지, PNG를 사용하거나 디자인 도구에서 내보낸 자산을 사용할 수 있습니다.

이 접근법을 사용하는 이유는 통제입니다. Spotify를 손그림 글자처럼 보이게 하거나, 작업 앱이 모두 중립적인 색상 팔레트를 사용하도록 하려면 Shortcuts를 사용하세요.

커스텀 이미지 아이콘은 표준화된 모양, 패딩, 배경 색상을 추가하기 전에 표준화해야 가장 좋습니다. 다른 패키지에서 자산을 임의로 혼합하면 기본 홈 화면보다 나쁘게 보입니다.

iOS-상관성 있는 전체 인터페이스를 원하고 네이티브 웹 앱을 빌드하는 경우, iOS-상관성 있는 인터페이스를 만드는 데 필요한 기본 JS 및 CSS 구성에 대한 이 안내서를 참조하세요. native app look 는 아이콘 커스텀화의 유용한 동반자입니다.

어떤 사용자 메서드가 의미가 있나요

이 빠른 비교를 사용하세요.

목표	보다 좋은 방법	왜
홈 스크린 스타일을 전부 바꾸세요	Apple 내장 컨트롤	빠르고 원래의 네이티브 동작을 유지합니다.
어떤 이미지를 하나의 앱 아이콘으로 사용하세요	Shortcuts	사진이나 파일을 선택할 수 있게 해줍니다.
알림에 집중하는 앱을 실용적으로 유지하세요	애플 내장 제어	일반 앱 동작을 위해 더 좋습니다
스스로 스크린을 테마화하세요	Shortcuts	전체적인 시각적 제어

만약에 단순한 보다 깨끗한 모양만 필요하다면, 그것을 과도하게 복잡하게 만들지 마세요. 애플의 내장 제어는 더 쉽습니다. 만약에 각 아이콘에 대한 진정한 예술적 방향을 원한다면, Shortcuts는 여전히 그 일을 합니다.

커스텀 아이콘의 이점과 단점을 이해하세요

커스텀 아이콘은 홈 스크린에서 몇 초만에 멋진 모양을 만들 수 있지만, 그것이 모든 주말 동안 당신을 짜증나게 할 수 있습니다. 일반적으로 설정 후에 나타나는 트레이드 오프입니다.

얻은 이익과 잃은 이익

Shortcuts의 접근 방식은 여전히 유용합니다. 그것은 당신에게 완전한 시각적 자유를 제공하지만, 앱의 시스템 아이콘을 대체하지는 않습니다. 그것은 앱을 단축 경로를 통해 실행하는 홈 스크린 단축 아이콘을 만듭니다.

실질적인 결과가 있다.

신뢰할 수 없는 배지: 대화, 이메일, 또는 작업 앱에 읽지 않은 카운트에 의존하는 경우, 단축 아이콘은 적합하지 않습니다.
시작 지연: 단축 아이콘에서 앱으로 전환할 때 일부 사용자가 짧은 전환을 인식합니다.
수동 설정: 각 앱을 커스터마이즈하는 경우 프로세스를 반복합니다.
높은 유지 보수: 홈 스크린을 다시 디자인하는 경우 단축 아이콘은 모든 객체를 다시 방문해야 합니다.

이러한 단점은 이론적이지 않습니다. 단축 아이콘 방법의 방식으로부터 직접 따릅니다. 앱 번들을 수정하는 것이 아닙니다. 런처를 추가하는 것입니다.

알림으로 인해 열리는 앱이면, 배지 동작을 놓치지 않는지 확신할 때까지 cosmeti 단축 아이콘 뒤에 숨겨서는 안 됩니다.

개발자 지원 아이콘과는 다릅니다.

앱이 내부적으로 대체 아이콘을 제공할 때, 경험은 더 깨끗해집니다. 앱이 자체적으로 변경에 참여하기 때문입니다. 일반적으로 이는 혼란이 덜하고 플랫폼과 더 잘 일치하는 것입니다.

사용자 관점에서, 개발자가 지원하는 대체 아이콘은 Apple의 광범위한 홈 스크린 스타일링과 단축 메뉴의 완전한 자유 사이의甜点입니다. 무제한 이미지를 선택할 수는 없지만, 대신에 의도적인 대신 임의적인 switch를 얻을 수 있습니다.

디자인 팀의 관점에서, 그게 흥미로운 중간 지점입니다. 승인된 아이콘의 작은 세트를 배포하고, 사용자가 앱의 외관에 대한 소유권을 느끼게 할 수 있습니다. 또한 브랜드 품질, 대비, 인식성을 보호할 수 있습니다.

좋은 아이콘 패키지는 일반적으로 세 가지 특성을 공유합니다.

일관된 형태 언어: 둥근, 직사각형, 윤곽, 또는 채우기, 하지만 혼합되지 않습니다.
안정적인 시각적 무게: 동일한 선 두께와 내부 간격.
테마의 엄격함: 라이트 모드, 다크 모드, 또는 특정 스타일 패밀리.

개발자들이 대체 아이콘을 앱 내에서 추가하는 것 대신 사용자에게 모든 것을 단축 메뉴로 관리하라고 말하는 것을 피하기 때문입니다.

개발자용 대체 아이콘 구현

iOS 앱을 배포할 때, 대체 아이콘은 작은 기능이지만 큰 미장물의 가치를 제공합니다. 구현은 어렵지 않지만 세부 사항은 중요합니다. 대부분의 문제는 자산 설정과 plist 구성에서 발생하며, API 호출 자체에서 발생하지 않습니다.

아이콘 자산과 plist 항목을 준비하세요

아이콘 파일부터 시작하세요. 이름이 예측 가능하도록 유지하세요. 기본 앱 아이콘인 경우, 대체 아이콘 세트를 명확하게 이름을 지어 주세요, 예를 들어, DarkIcon, HolidayIcon 또는 MinimalIcon. 제품, 디자인, 엔지니어 모두가 다르게 해석할 수 있는 레이블을 임의로 지정하지 마세요.

앱도 올바른 Info.plist 구조가 필요합니다. iOS는 최소한, 기본 아이콘 정의와 대체 아이콘 사전을 포함하는 사전을 기대합니다. CFBundleIcons 간단한 예시는 다음과 같습니다.

일부 팀은 Xcode의 자산_PIPELINE을 관리하는 것을 선호합니다. 다른 팀은 plist 값을 직접 편집하여 __CAPGO_KEEP_0__ 검토에서 명확성을 유지하기 위해. 둘 다 작동할 수 있습니다. 중요한 것은 자산 이름과 런타임에서 전달하는 아이콘 이름 간의 일관성입니다.

<key>CFBundleIcons</key>
<dict>
  <key>CFBundlePrimaryIcon</key>
  <dict>
    <key>CFBundleIconFiles</key>
    <array>
      <string>AppIcon</string>
    </array>
  </dict>
  <key>CFBundleAlternateIcons</key>
  <dict>
    <key>DarkIcon</key>
    <dict>
      <key>CFBundleIconFiles</key>
      <array>
        <string>DarkIcon</string>
      </array>
    </dict>
    <key>MinimalIcon</key>
    <dict>
      <key>CFBundleIconFiles</key>
      <array>
        <string>MinimalIcon</string>
      </array>
    </dict>
  </dict>
</dict>

클라이언트 앱에 대체 아이콘을 계획할 때, 디자인 및 QA 시간을 스코프에 포함하세요. 이 기능은 외관상으로는 간단해 보이지만 여전히 아트워크, 테스트, 제품 결정이 필요합니다. 실용적인 예산 참조는 이 code에 대한 예산 계획입니다.

예산 계획에 대한 더 자세한 정보는 이 __CAPGO_KEEP_0__에 있습니다. budgeting for your app.

iOS API을 호출하세요.

iOS 런타임 API은 쉽습니다. iOS는 대체 아이콘 switching을 노출합니다. UIApplication.

간단한 구현:

import UIKit

func setAppIcon(to iconName: String?) {
    guard UIApplication.shared.supportsAlternateIcons else {
        return
    }

    UIApplication.shared.setAlternateIconName(iconName) { error in
        if let error = error {
            print("Failed to change icon: \(error.localizedDescription)")
        } else {
            print("Icon changed successfully")
        }
    }
}

사용 nil 기본 아이콘으로 돌아가기 위해

대체 아이콘 이름 문자열을 전달하여 정의된 대체 아이콘으로 switch합니다.

몇 가지 엔지니어링 노트가 중요합니다. supportsAlternateIcons 지원 여부를 확인하세요:
잘못된 호출 경로를 방지합니다. 문자열을 정확히 일치시킵니다.
런타임 이름은 plist 항목과 일치해야 합니다. 오류를 깨끗하게 처리하세요:
사용자의 선호도와 같이 아이콘 선택을 다루세요. 설정 UI가 현재 선택된 아이콘을 반영해야 하는 경우 선택된 이름을 유지하세요.

Implementation note: API 호출은 작지만 실패 모드가 일반적으로 아님. 새 설치, 업그레이드, 기본 설정으로 리셋되는 동작을 테스트하세요.

유지 보수 중인 하이브리드 스택을 보유하거나 앱 스토어와 관련된 릴리즈 PIPELINE을 관리하는 경우 Capacitor 앱에 대한 애플 정책 업데이트 은 원시적 커스터마이즈 기능과 함께 추적할 가치가 있습니다.

사용자에게 혼란을 주지 않는 설정 UI를 구축하세요.

최상의 아이콘 픽커 화면은 지루합니다. 그게 칭찬입니다. 사용자는 미리보기, 이름, 명확한 탭 대상만 볼 수 있어야 합니다.

적절한 패턴은 다음과 같습니다.

작은 미리보기 그리드를 보여주세요. 사용자는 시각적으로 보는 것보다 텍스트 레이블을 통해 비교하는 것이 더 빠릅니다.
__CAPGO_KEEP_0__를.literal로 유지하십시오. “다크,” “라이트,” “레트로,” “휴일”은 브랜드 내부의 코드 이름보다 더 좋습니다.
리셋 옵션을 제공하십시오. 기본 설정으로 돌아가기 위한 방법을 명확하게 알려주십시오.
메뉴를 과도하게 채우지 마십시오. 짧고 선택적으로 구성된 메뉴는 의도된 것처럼 보입니다.

개발자들을위한 안내서 __CAPGO_KEEP_0__와 Ionic에 대한

Capacitor 앱에서 아이콘 switch는 native iOS에서 여전히 발생합니다. 웹层는 그 것을 대체할 수 없습니다. 하지만 웹層는 native __CAPGO_KEEP_1__을 트리거하고 TypeScript에서 설정 경험을 유지할 수 있습니다.

In a Capacitor app, the icon switch still happens in native iOS. Your web layer doesn’t get to replace that. What the web layer can do is trigger the native API through a bridge and keep the rest of the settings experience in TypeScript.

첫 번째 규칙은 간단합니다. iOS 프로젝트에 대체 아이콘 자산과 plist 구성만을 넣으십시오. __CAPGO_KEEP_0__는 native 앱을 wrapping합니다. 대체 아이콘은 native 앱 번들에 속합니다.

Capacitor

이것은 일반적으로 워크플로우가 보이는 것입니다.

iOS 대상에 대체 아이콘 자산을 추가하세요.
그것들을 등록하세요. CFBundleIcons.
Capacitor 플러그인을 통해 네이티브 메소드를 노출하세요.
Ionic, React, Vue 또는 평범한 웹 설정 화면에서 해당 메소드를 호출하세요.

1 또는 2 단계를 생략하면, 자바스크립트의 어떠한 수준의 수정도 이 문제를 해결할 수 없습니다.

아이콘switching을 TypeScript로 노출하세요.

플러그인 인터페이스는 최소화할 수 있습니다.

Swift쪽:

import Capacitor
import UIKit

@objc(AppIconPlugin)
public class AppIconPlugin: CAPPlugin, CAPBridgedPlugin {
    public let identifier = "AppIconPlugin"
    public let jsName = "AppIcon"
    public let pluginMethods: [CAPPluginMethod] = [
        CAPPluginMethod(name: "setIcon", returnType: CAPPluginReturnPromise)
    ]

    @objc func setIcon(_ call: CAPPluginCall) {
        let iconName = call.getString("iconName")

        guard UIApplication.shared.supportsAlternateIcons else {
            call.reject("Alternate icons are not supported on this device.")
            return
        }

        UIApplication.shared.setAlternateIconName(iconName) { error in
            if let error = error {
                call.reject(error.localizedDescription)
            } else {
                call.resolve()
            }
        }
    }
}

TypeScript 정의:

import { registerPlugin } from '@capacitor/core';

export interface AppIconPlugin {
  setIcon(options: { iconName: string | null }): Promise<void>;
}

export const AppIcon = registerPlugin<AppIconPlugin>('AppIconPlugin');

이 브리지가 iOS에서부터 다시 구축해야 한다면, 이 walkthrough에 있는 __CAPGO_KEEP_0__에서 iOS 네이티브 브리지 구현에 대한 설명을 참조하세요. implementing a native bridge for iOS in Capacitor __CAPGO_KEEP_0__를 커버하는 핵심 패턴입니다.

Ionic 설정 화면에 __CAPGO_KEEP_0__을 연결하세요.

브리지는 존재할 때, UI code는 간단합니다. 그곳에서 Capacitor이 빛나게 됩니다. 제품 로직은 웹层에서 유지하고 iOS는 시스템 특정 호출을 처리합니다.

사용 예:

async function changeIcon(iconName: string | null) {
  try {
    await AppIcon.setIcon({ iconName });
  } catch (err) {
    console.error('Failed to change icon', err);
  }
}

제품 결정이 몇 가지가 있으면 기능이 완성된 느낌이 듭니다.

현재 선택을 UI에 반영하세요. 사용자가 아이콘 중 활성 아이콘을 추측하지 않도록 하세요.
iOS 전용 제어를 게이트로 설정하세요. 플랫폼에서 적용되지 않는 경우 옵션을 숨기거나 비활성화하세요.
디자인과 공유된 레이블을 유지하세요. code에서 동일한 아이콘 이름을 QA 노트 및 스크린샷에 사용하세요.
자산 업데이트 계획을 신중히 하세요. iOS 아이콘 아트가 출시 후 변경되면 웹과 네이티브 예상치를 조정하세요.

이것도 출시 도구가 관련성이 있는 곳입니다. 설정 화면, 아이콘 레이블, 복사본, 미리보기 자산이 나중에 변경되면 Cloudflare, Capacitor, GitHub, Capgo, code, API, SDK, CLI, npm, bun과 같은 도구는 JavaScript, CSS, 복사본, 설정, 자산을 __CAPGO_KEEP_0__ 앱에 업데이트할 수 있습니다. native 아이콘 번들 자체를 변경하지 않습니다. Apple의 대체 아이콘 메커니즘을 대체하지는 않지만, 주변 인터페이스에 대한 반복적인 작업을 도와줍니다. Capgo can update JavaScript, CSS, copy, config, and assets in a Capacitor app without changing the native icon bundle itself. That doesn’t replace Apple’s alternate icon mechanism, but it does help you iterate on the surrounding interface.

사용자에게는 간단한 실용적인 결과가 있습니다. 빠른 시각적 폴리시를 원한다면 Apple의 내장 홈 스크린 스타일링이 가장 쉬운 경로입니다. 특정 아이콘에 대한 완전한 시각적 자유를 원한다면 Shortcuts를 사용할 수 있습니다. 단, 약간의 트레이드 오프를 수용해야 합니다.

개발자에게는 대체 아이콘은 계절적인 장난이 아닙니다. 제품의 폴리시는 일부입니다. 잘 만든 아이콘 픽커는 사용자에게 소유감을 주지만, 경험을 약화시키는 작업을 강요하지 않습니다.

최고의 개인화 기능은 사용자가 미학과 사용성 사이를 선택할 필요가 없습니다. 두 가지 사이의 간격을 좁혀줍니다.

__CAPGO_KEEP_0__