# 앱 프로필 사진 등록 및 변경하기

***

회원들이 회원가입 시 프로필 이미지를 등록하는 방법과 등록되어 있던 프로필 이미지를 수정하는 방법을 알려드리겠습니다.

{% hint style="info" %}
**+ 앱에서 회원가입을 하면 사용자들의 프로필 사진은 모두 앱 아이콘 이미지로 기본 셋팅되요.**

**+ 회원가입시 회원이 원하는 이미지로 프로필 이미지를 등록할 수도 있구요.**

**+앱 회원 프로필 사진은 회원정보 수정에서 이미지 수정하여 사용할 수 있습니다 ^^**
{% endhint %}

{% hint style="success" %}
-프로필 이미지 등록: 앱 회원가입시 등록 가능

-프로필 이미지 변경: 앱설정: 회원정보 수정에서 변경
{% endhint %}

매뉴얼을 통해서 앱 프로필 사진 등록과 변경 방법을 확인해주세요.

***

## ![](https://wp.swing2app.co.kr/wp-content/uploads/2020/04/%EB%8B%A8%EB%9D%BD1-1.png) **1. 회원가입시 프로필이미지 등록**

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80%EB%B3%80%EA%B2%BD5.png" alt=""></div>

회원가입: 상단 프로필 이미지 \[등록하기] 버튼을 선택하여 원하는 이미지를 등록할 수 있어요!

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80%EB%B3%80%EA%B2%BD6.png" alt=""></div>

해당 이미지를 터치하면 이미지를 등록 할 수 있는 창이 열립니다.&#x20;

핸드폰의 앨범에서 사진을 불러올 수도 있구요. 카메라로 바로 찍어서 올릴 수도 있어요.

**따라서 회원가입시 사용자가 프로필 이미지는 원하는 이미지로 변경하여 가입이 가능합니다.**&#x20;

![](https://wp.swing2app.co.kr/wp-content/uploads/2018/09/%ED%99%94%EC%82%B4%ED%91%9C-4.png)

회원가입은 앱제작시 기본 셋팅되는 메뉴인데요. 만약 회원가입을 제거했다면 다시 적용해주시면 됩니다.

메뉴를 앱에 적용하는 방법을 확인해주세요!

### <mark style="color:blue;">**★ 회원가입 메뉴 적용하기**</mark>&#x20;

<figure><img src="https://684031119-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmsJj00k8mj8AcVpnn9Xs%2Fuploads%2Fal7XQQiWtgUe2zKihpvG%2F%ED%9A%8C%EC%9B%90%EA%B0%80%EC%9E%85.png?alt=media&#x26;token=32341c0e-0d40-43a7-b7aa-733322300bff" alt=""><figcaption></figcaption></figure>

앱제작 화면 이동

1\)STEP3 페이지 단계로 이동합니다.

2\)새 메뉴를 만들어주세요. (+ 모양 버튼 선택하여 메뉴 추가)

3\) 메뉴 이름 입력

4\) 페이지 디자인에서 \[기본 기능] -\[페이지]를 선택해주세요.&#x20;

5\) 회원가입 페이지를 찾아서 \[적용하기] 버튼을 선택해주세요. (페이지에 마우스 커서를 가져다 대면 적용하기 버튼이 열립니다)

6\) 화면 상단 \[저장]버튼을 누르면 앱에 적용됩니다.

\*미리보기 버튼을 선택하면 해당 페이지가 어떻게 보여지는지 웹 미리보기(가상머신)으로 확인가능하구요.

\*적용 후에도 가상머신을 통해서도 해당 페이지가 어떻게 앱에 적용되는지 확인 가능합니다.

***

## ![](https://wp.swing2app.co.kr/wp-content/uploads/2020/04/%EB%8B%A8%EB%9D%BD1-1.png) **2. 프로필 이미지 변경하기**

**등록된 이미지를 변경하거나, 새로 프로필 이미지를 등록하는 방법을 알려드릴게요.**

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%B3%80%EA%B2%BD.png" alt=""></div>

1\)앱을 실행 한뒤  **\[설정]** 메뉴를 선택해주세요. \*로그인이 안되어 있다면 로그인 먼저 해주세요!

<mark style="color:red;">**\[설정]**</mark><mark style="color:red;">메뉴는  스윙에서 기본 제공하는 메뉴이구요.앱제작 시 설정 메뉴는 기본 셋팅되어서 들어가요.</mark>&#x20;

프로토타입마다 메뉴 위치는 다르게 설정할 수 있습니다.

2\)설정 메뉴에서 **\[회원정보 수정]** 을 선택합니다.&#x20;

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%B3%80%EA%B2%BD1.png" alt=""></div>

회원정보수정 창에서 상단 프로필 이미지 \[등록하기] 버튼을 선택해서 프로필 이미지를 변경할 수 있습니다.&#x20;

<mark style="color:purple;">**★ 해당 이미지를 터치하면 이미지를 등록 할 수 있는 창이 열립니다.**</mark>&#x20;

핸드폰의 앨범에서 사진을 불러올 수도 있구요. 카메라로 바로 찍어서 올릴 수도 있어요.

이미지 변경 후 \[저장] 버튼까지 선택하시면 완료됩니다.&#x20;

**\[설정] 메뉴 역시 앱에 기본셋팅되어서 제공되지만, 설정을 삭제했다면 다시 앱제작 페이지에서 설정 메뉴를 꼭 넣어서 제작해주세요.**

![](https://wp.swing2app.co.kr/wp-content/uploads/2018/09/%ED%99%94%EC%82%B4%ED%91%9C-4.png)

### <mark style="color:blue;">**★ \[설정] 메뉴 적용**</mark>

<figure><img src="https://684031119-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmsJj00k8mj8AcVpnn9Xs%2Fuploads%2FzVg45dJoTYYcDcVrsVE6%2F%EC%84%A4%EC%A0%95.png?alt=media&#x26;token=f332b868-3ef5-4063-ae04-e3188526e246" alt=""><figcaption></figcaption></figure>

앱제작 화면 이동

1\)STEP3 페이지 단계로 이동합니다.

2\)새 메뉴를 만들어주세요. (+ 모양 버튼 선택하여 메뉴 추가)

3\)메뉴 이름 입력

4\)페이지 디자인에서 \[기본 기능] -\[페이지]를 선택해주세요.&#x20;

5\)설정 페이지를 찾아서 \[적용하기] 버튼을 선택해주세요. (페이지에 마우스 커서를 가져다 대면 적용하기 버튼이 열립니다)

6\)화면 상단 \[저장]버튼을 누르면 앱에 적용됩니다.

\*미리보기 버튼을 선택하면 해당 페이지가 어떻게 보여지는지 웹 미리보기(가상머신)으로 확인가능하구요.

\*적용 후에도 가상머신을 통해서도 해당 페이지가 어떻게 앱에 적용되는지 확인 가능합니다.

**\*\*만약 설정메뉴를 다시 앱에 적용하실 때는 위의 방법대로 제작해주시면 됩니다.**

![](https://wp.swing2app.co.kr/wp-content/uploads/2018/09/%EC%BA%A1%EC%B2%98-3.png)

<mark style="color:orange;">**프로필 이미지 변경 완료**</mark>

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%B3%80%EA%B2%BD3.png" alt=""></div>

새로 등록한 이미지로 프로필 사진이 변경된 것을 확인할 수 있어요\~!!

{% hint style="danger" %}
&#x20;<mark style="color:red;">**주의사항**</mark>

프로필 사진을 등록할 때는 이미지  화질이 안좋거나, 이미지 사이즈가 작을 경우, 이미지 비율이 정사각형이 아닐 경우 프로필에 등록되는 사진이 많이 깨져서 보여질 수 있어요.
{% endhint %}

***

<mark style="color:blue;">**Q. 비회원도 프로필 이미지를 변경할 수 있나요?**</mark>

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%B3%80%EA%B2%BD5.png" alt=""></div>

비회원은 로그 기록이 없기 때문에 회원정보를 인식할 수 없어요.

따라서 **비회원은 프로필 이미지를 변경할 수 없구요.**

**프로필 외에도 다른 회원정보에 접근할 수 없어요.**

회원가입이 된 회원사용자만 이용할 수 있습니다\~!!<br>

&#x20;<mark style="color:blue;">**이 외에도 \[설정] 메뉴에는 다양한 기능을 사용할 수 있어요\~!**</mark>

<div align="left"><img src="https://wp.swing2app.co.kr/wp-content/uploads/2018/10/%ED%94%84%EB%A1%9C%ED%95%84%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%B3%80%EA%B2%BD4.png" alt=""></div>

회원정보 수정, 푸시 알림(on/off), 알림 목록 확인, 회원 탈퇴, 앱 공유, 버전 체크 등의 메뉴를 이용할 수 있습니다.

**프로필 이미지 등록 및 변경방법을 다시 정리하면요!**

{% hint style="info" %}
**1)프로필 이미지 등록 방법: 회원가입 시 바로 등록 가능**

**2)프로필 이미지 변경방법:  ‘설정-회원정보수정’ 메뉴에서 이미지 변경**
{% endhint %}

-이미지는 핸드폰 내 앨범이나 혹은 바로 카메라로 사진을 찍어서 바로 올릴 수 있습니다.&#x20;

-프로필 사진 변경은 회원가입이 된 사용자 계정에서만 이용가능합니다.(비회원은 사용 안되요\~)