셀피스는, 퍼스널 브랜딩의 초기 여정에서 겪는 명확한 방향 설정이 어려운 문제를 해결하기위한 솔루션입니다.

저희 팀은 ‘나에 대한 근본적인 이해’에 대해 끊임없이 고민하고 싶은 팀원들이 모였습니다. 나를 이해하는 과정에서 치열하게 노력을 하고 있는 이들과 호흡하며 그들의 문제를 마주하다보면, 흥미로운 사업 아이템을 개발/발굴할 동인이 되리라 확신하여 아래와 같은 리서치를 진행했습니다.

팀 쿨피스는 아이디어 선정 이전, 서로의 흥미를 파악하기위해 ‘넌 어떤 사람이야? 뭘 좋아해?’ 등의 질문에 대한 답변을 하고 서로를 알아가는 온보딩을 진행했습니다. 그러던 중, 저희는 선뜻 나의 흥미, 강점, 성향 등에 대한 답을 내리지 못한다는 것을 인지했습니다. 즉, 나조차도 나에 대해 잘 알고 있지 못하다는 것이었는데요, 저희의 시작은 바로 이 지점이었습니다.

왜 나는 나에 대해 잘 알지 못할까, 사용자들에게 나를 잘 알 수 있는 경험을 주는 건 어떨까 라는 생각으로 서비스의 사용자들이 자신을 깊이 이해하며 살아가도록 돕는 것을 저희 팀의 목표로 설정했습니다. 단, 이는 팀의 내적동기와 목표에 불과했기에 관련하여 문제가 존재하는지, 서비스를 사용할만큼의 동인이 있는 문제인지에 대한 가설 실험을 진행했습니다.

해당 실험을 통해 2030세대의 자기이해에 대한 니즈 를 확인했지만, 그 니즈가 서비스를 사용할 동인을 가지는가에 대해서는 부정적이라는 결과를 도출했습니다.

이에 따라 서비스 사용의 동인을 가지는, 자기이해에 대한 강력한 니즈를 가지는, 자기이해의 과정에서 ‘문제’를 겪고 있는 집단 을 발굴하기 위해 IDI(n=26)와 성공한 퍼스널브랜더와의 전문가인터뷰를 설계/진행하며 2차 리서치를 진행했습니다.

그 결과, 나로써 새로운 가치를 창출하고자하는 집단 은 자기이해에 대한 강력한 니즈와 그 과정에서 문제를 겪고 있다는 점을 발견했습니다. 그들은 공통적으로 ‘퍼스널 브랜딩’을 목적이자 목표로 하고 있었으며 이에 따라 저희는 ‘퍼스널 브랜딩’ 의 여정을 시작한 집단이 초기 설계 단계에서 겪는 문제를 해결할 수 있는 솔루션에 대해 고민하게 되었습니다.

* 자기이해 *
def) 자신의 성향과 강점, 수익 창출로의 연결이 가능한 전문성을 인지하는 것

퍼스널 브랜딩이란, 나만의 개성과 매력, 재능을 브랜드화하여 가치를 높이는 행위로 대표적인 퍼스널브랜더로는 ‘드로우앤드류’ , ‘노마드코더’ 등이 있으며 최근 SNS를 활용하여 수익화를 하는 행위가 대표적인 퍼스널 브랜딩의 결과로 볼 수 있습니다.

나를 브랜딩하여 세상에 알리고자 하는 집단이,
퍼스널 브랜딩의 초기에 '나를 이해하는 과정' 에서 겪는 문제

✅ 퍼스널 브랜딩은 [인지-탐색-구축-확산-관리]의 과정을 거치며,
셀피스는 [인지-탐색-구축] 단계에서 겪는 어려움을 해결하고자 합니다.

퍼스널 브랜딩을 본격적으로 시작하고자 하는 사람들은, [인지-탐색-구축]의 과정에 해당되는 ‘자기이해’에 대한 강력한 동기와 문제를 가지고 있습니다. 그 중에서 저희가 해결하고자하는 문제는 다음과 같습니다.

[1] 자기이해에 대한 어려움

퍼스널 브랜딩을 시작하는 단계에서, 자신을 정의하고 강점과 적성을 파악하는 데 어려움을 겪는다.

• 나는 어떤 사람인지, 무엇을 잘하고, 무엇에 대한 열정이 있는지 파악하기 어렵다.
• 내가 어떤 브랜드를 구축해서 퍼스널 브랜딩을 성공시킬 수 있을지 모르겠다.
• 자신의 강점과 약점을 명확하게 알지 못하여 브랜드 방향 설정에 어려움을 겪는다.
• 타인과 차별화되는 자신만의 매력을 찾는데에 어려움이 있다.

[2] 자기이해와 퍼스널 브랜딩에 대한 이해 부족

퍼스널 브랜딩의 과정에서, 자기이해와 어떤 방법에 따라 나를 이해하고 퍼스널 브랜딩을 해야 실패하지 않을 수 있는지 모르겠다.

• 심층적으로 나의 전문성을 포지셔닝 하고싶은데, 그 방법을 모르겠다.
• 나와 유사한 방향성을 가진 사람들의 사례를 접하기 어렵다.
• 퍼스널브랜딩과 관련한 방대한 학습 자원이 산발적으로 존재해 한 곳에서의 탐색이 어렵다.

🔥 퍼스널 브랜딩에 대한 니즈가 있는 집단이 브랜드 구축의 초기 단계에서 나의 정체성를 파악하고 확립하는 것을 도와준다.

1️⃣ 자기이해를 기반으로 한 정체성 확립

퍼스널 브랜딩 이전에, 나의 적성과 흥미 등 나를 더 잘 이해할 수 있도록 한다.

• 간단한 과정을 통해, 자신의 흥미와 적성을 확인할 수 있다.
• 내 흥미와 적성을 살린 브랜드 방향을 설정할 수 있다.
• 타인과 차별화된 나만의 키워드를 확인하고, 정의한다.

2️⃣ 브랜드 방향성 설정 및 정보 제공

퍼스널 브랜딩과 자기이해에 대한 교육 프로그램을 제공하여, 퍼스널브랜딩에 대한 정보 및 지식을 함양할 수 있도록 한다.

• 서비스에서 다 해소하지 못한 자기이해에 대한 니즈를 교육 프로그램 수강을 통해 달성한다.
• 퍼스널 브랜딩과 관한 강의를 통해, 퍼스널 브랜딩을 더 잘할 수 있는 방법들을 학습한다.

셀피스는 퍼스널 브랜딩에 대한 여정을 시작한 집단 중에서, MVP를 통해 실제로 출시 알림 신청을 진행한 6.1% 의 전환율을 기반으로 초기 시장을 설정하였습니다. 저희는 시장 규모 및 니즈 확인을 자체 CVR 수치로 확인했으며 그 결과, 응답자 수 129명 중 21명 (6.1%)이 서비스 출시 알림을 신청했습니다.

퍼스널 브랜딩이라는 용어에해서는 아직 다양한 정의가 존재하나, 플랫폼 사회화와 일의 패러다임 변화가 가속화되면서 퍼스널 브랜딩에 대한 시장의 관심도와 규모가 증가하고 있습니다. 저희는 해당 시장에서 고객들이 겪는 보다 뾰족한 문제를 발굴하여 해결함으로써, 퍼스널 브랜딩을 위한 자기이해 솔루션으로 거듭나고자 합니다.

시장 전망 1_일의 패러다임 변화로 인한 성장가능성

커리어의 기준이 기존의 조직 중심에서 개인 중심으로 나를 위해서 일하는 시대로 변하면서 스스로 전문적 역량을 길러 지속 가능한 수익을 창출하는 것이 중요해지고 있습니다. 더불어, 평생직장의 개념이 사라지고 새로운 직업이 생겨나면서 N잡러 등 짧고 다양한 직업으로의 전환을 통해 나만의 가치와 역량을 중심으로 업을 달성하는 주체로서의 일(work)로 변화하고 있습니다.

이러한 흐름에 따라 자신의 가치관에 따라 이직을 하거나 기업/클라이언트에게 끊임없이 자신을 어필해야하는 상황에 놓이는, 즉 퍼스널 브랜딩을 해야만 하는 상황에 지속적으로 노출되는 케이스가 증가하고 있는 추세입니다.

시장 전망 2_플랫폼 시장의 성장 및 1인 기업의 등장

저희 팀은 다양한 플랫폼을 통해서 개인이 자신의 개성과 창의성을 수익으로 연결하는 게 가능해짐에 따라 앞으로는 회사에서 월급 받는 사람보다 플랫폼에서 정산받는 사람들이 더 많이 늘어날 전망을 포착했습니다. 즉, 나를 하나의 ‘브랜드 자산’으로 만들어 수익을 창출하는 케이스가 늘어나고 있습니다.

2021년 기준 1인미디어 산업의 총 매출은 약 2조 5천억원으로 집계되었으며, 그 중 광고(36%)와 영상제작 분야에서 높은 비율을 차지하고 있었습니다. 또한 디지털크리에이터의 전체의 64.5%가 자체 콘텐츠를 제작하고 있으며 부업으로 수행하고 있는 비율이 전체의 59.8%임을 확인할 수 있었습니다. 콘텐츠 장르의 경우, 라이프스타일(36.1%), 정보전달(30.7%)의 순으로 높은 비율을 차지하는 것으로 나타난 결과를 통해 1인미디어 산업이 퍼스널 브랜딩의 주 수단으로서 개인의 정체성을 드러내는데 중요하게 작용할 것임을 시사하고 있으며, 저희는 이 지점에 주목하여 퍼스널 브랜딩 시장에 진입하고자 합니다.

이 시장에서 셀피스는 ‘나를 브랜딩하여 세상에 알리고자 하는 집단이 퍼스널 브랜딩의 초기에 '나를 이해하는 과정' 에서 겪는 문제’를 ‘자기이해와 프로그램’을 통하여 해결할 것 입니다.

1️⃣ 자기이해를 기반으로 한 정체성 확립

자기이해_돌아보기, 정의하기를 통해 나의 정체성을 확립할 수 있게 돕는다.

2️⃣ 퍼스널 브랜딩을 위한 정보 및 교육 제공

프로그램을 통해, 퍼스널 브랜딩 / 자기이해와 관련된 강의를 수강하여 학습할 수 있도록 한다.

2️⃣ 브랜딩 방향성 구축 및 관리

마이페이지의 대시보드를 통해, 브랜딩의 방향성을 구축하고 관리할 수 있도록 한다. 자기이해_설계하기를 통해 방향성을 구축할 수 있다.

타겟 유형 분류

👩🏻‍🎓 대학생, 무직자

• 퍼스널 브랜딩에 관심이 많지만, 어떻게 시작해야 할지 모르는 경우
• 자신의 브랜드를 만들고 싶지만 관련 경험이나 지식이 부족한 경우
• 나를 콘텐츠, 플랫폼화하여 금전적, 비금전적 가치를 창출하고 싶은 경우

🧑🏻‍💼 직장인, 프리랜서, 실직자

• 본업을 가지고 있으며, 퇴사/이직 후 경제활동을 준비하고 싶어하는 사람
• 자신의 능력을 디지털 매체를 통해 알리고 싶은 사람
• 현재 본인의 삶에 회의를 느껴 새로운 도전을 해보고 싶은 사람

페르소나 & 유저 저니맵

a. Organization 레퍼지토리로Vercel 배포를 진행할 경우 유료 서비스를 이용해야 하기에, Fork Repository 배포용으로 활용함

b. Git Flow 전략을 사용하여 각 로컬에서 개발을 진행한 후, Organization Main Brach로 Merge 진행

c. Github Actions가 동작하여 Fork 레퍼지토리로 자동 동기화 진행

d. Vercel 동작하며 배포 완료

e. 추가적으로, Organization 레퍼지토리와 Slack을 연동하여 PR 또는 Merge가 완료되면 알림을 받을 수 있도록 함

a. Git Flow 전략을 사용하여 각 로컬에서 개발을 진행한 후, Github Develop Branch에 Merge 진행

b. Github Actions가 동작하여 build된 jar파일을 이미지화하여 NCP Container Registry에 Push

c. NCP 서버에 접속한 후 이미지를 Pull 받아 컨테이너 생성 및 실행

d. Nginx의 리버스 프록시를 새롭게 생성된 컨테이너로 변경하여 새로운 버전으로 배포 완료

e. 기존 컨테이너 실행 종료

React

• React로 UI 요소들을 컴포넌트로 분리하여 개발하여 컴포넌트의 재사용성을 용이하게 하고자 했습니다. 이를 통해, 코드 수정 및 유지보수를 효율적으로 할 수 있어 선정하게 되었습니다.
• React의 다양한 라이브러리와 플러그인을 통해 개발 생산성을 향상시킬 수 있어 선정하게 되었습니다.
• 무엇보다 빠르게 진행되어야 하는 밋업데이 프로젝트이기 때문에 프론트 개발 파트 모두가 능숙하고 빠르게 작업할 수 있는 React를 선정했습니다.

Typescript

• 타입 추가로 인해 안정적인 개발과 높은 수준의 코드 품질을 유지하여 컴파일 에러 예방, 손쉬운 디버깅을 가능하도록 하고자 선정하게 되었습니다.

Styled Components

• Styled Components를 통해 컴포넌트 스타일링을 쉽게 구현하고 동적인 스타일, 조건부 스타일을 적용할 수 있어 선정하게 되었습니다.
• CSS를 컴포넌트 기반으로 스타일을 정의하고 관리하여 컴포넌트 지향적인 스타일링 구현, 전역 스타일 충돌을 방지하고자 선정하게 되었습니다.
• 특히, 이번 프로젝트의 경우 디자인 요소가 매우 중요하게 다뤄지고 있으며, 여러 가지 variant를 포괄할 수 있는 디자인 컴포넌트 제작에 Styled Components가 용이할 것 같아 선정하게 되었습니다.

Vite

• 빠른 개발 속도와 번들링을 위해 선정하게 되었습니다.

Recoil

• Recoil은 React를 위한 상태 관리 라이브러리이기 때문에, React의 기본적인 훅(hook)과 개념을 활용하여 상태 관리를 보다 쉽고 직관적으로 할 수 있어 선정하게 되었습니다.
• 특히, 프론트 개발 파트 모두 사용할 수 있는 라이브러리였기 때문에 Recoil을 선정하게 되었습니다.

Axios

• 크로스 브라우징 최적화로 브라우저 호환성이 뛰어나며, Javascript 내장 라이브러리인 fetch와 다르게 오래된 브라우저 지원 불가에 대한 걱정이 필요하지 않아 선정하게 되었습니다.
• Promise 기반으로 만들어졌기 때문에 데이터를 다루기 편리합니다. 뿐만 아니라, 많은 기능을 제공하고 있어 요청과 응답을 보다 쉽게 다룰 수 있는 편의성이 있어 선정하게 되었습니다.

Vercel

• Vercel은 서버리스 아키텍쳐 기반으로, 사이트가 원활하게 작동하도록 모든 관리 작업을 처리합니다. 뿐만 아니라, CI/CD를 쉽게 설정할 수 있습니다. 따라서 개발자가 코드 개발 외적으로 관리해야 할 요소를 줄여줍니다.
• CDN을 통해 전 세계 여러 위치에 제공하여 빠른 로딩 속도와 확장성을 제공합니다.

Spring Boot

• 두 팀원의 주 스택인 Spring Boot 프레임워크를 사용하여 백엔드 개발을 진행했습니다.
• 설정이 간소화되어 있어 빠른 프로젝트 생성이 가능했고, 내장된 톰캣 서버로 간편한 애플리케이션 배포를 할 수 있었습니다.

Gradle

• Gradle 을 의존성 관리 및 빌드 도구로 선택하였습니다.
• 다양한 플러그인 지원 덕분에 유연하게 프로젝트를 구성할 수 있었고, 빠르게 의존성을 추가하고 변경할 수 있어 시간 효율적인 부분에서 이점이 있다 판단하였습니다.

Spring Security

• Spring Security의 다양한 인증 및 권한 부여 기능을 활용하여 보안을 강화했고, 사용자 인증 및 접근 제어를 구현하였습니다.
• 특히, OAuth2.0 프로토콜을 통해 백엔드 측에서 대부분의 소셜 로그인 동작 과정을 구현하며 빠르게 로그인 과정을 개발할 수 있었습니다.
• 또한 설정 부분에서 Spring Security와 다양한 config 파일을 통해 체계적으로 관리하였습니다.

JPA(Hibernate)

• JPA(Hibernate)는 객체와 관계형 데이터베이스 간의 매핑을 단순화하여 데이터베이스에 대한 복잡한 SQL 쿼리를 작성하지 않고도 데이터를 다룰 수 있게 도와주었습니다.
• 프로그램 필터링과 같이 조금 더 복잡한 쿼리가 필요할 때는, JPQL을 사용하여 쿼리를 직접 정의하여 사용했습니다.

MySQL

• MySQL은 안정적이고 높은 성능을 제공하는 오픈 소스 관계형 데이터베이스 관리 시스템(RDBMS)으로, 대용량 데이터 처리와 트랜잭션 처리에 효과적이라는 장점이 존재합니다.
• 백엔드 팀원 모두 주로 사용해 온 스택이었기에, 빠르고 문제 없이 DB 구축을 진행할 수 있었습니다.

Redis & JWT & Cookie

• Redis는 메모리 기반의 데이터 저장소로, 소셜 로그인 과정에서 Refresh Token을 저장하는 용도로 활용하였습니다.
• JWT토큰 기반의 인증 방식을 사용하여, Access & Register & Refresh토큰을 발행하며 사용자 인증 및 권한 부여 & 등록 절차를 수행했습니다.
• 액세스 토큰을 재발행 하는 경우에, 쿠키와 Redis에 각각 담긴 Refresh Token을 비교하여 맞는 경우에만 재발행 하였습니다.또한 토큰 탈취 시 악용을 방지하기 위해서, 재발행 이후에 Refresh Token도 새롭게 재발행 하여 저장했습니다.

Nginx

• HTTP 서버, 로드 밸런서, 리버스 프록시등 다양한 기능을 통해 트래픽을 새로운 버전의 애플리케이션으로 원활하게 전환할 수 있습니다.
• 또한 SSL 지원, 접근 제어 기능을 통해 보안 설정에 유리합니다.
• 리액트와의 연동을 위한 https 인증 및 블루그린 배포에 사용되었습니다.

Docker & Docker Compose

• CI/CD를 진행 할 때 실행 가능한 서버 애플리케이션을 Docker를 통해 컨테이너화 시켜 서버 환경에서 쉽게 실행할 수 있게 합니다.
• 따라서 개발, 테스트, 배포를 빈번하게 해야 하는 밋업데이에서 각 환경 간의 일관성을 유지하고, 자동화를 쉽게 할 수 있습니다
• 웹 서버, 데이터베이스와 같은 여러 개의 서비스를 단일 파일(docker-compose.yml)에서 관리할 수 있어, 각 서비스의 일관된 환경을 유지할 수 있습니다.

Github Actions

• Github에서 제공하는 CI/CD 프로세스입니다.
• CI/CD는 Github Actions이외에 Jenkins와 같은 도구로도 구현이 가능하지만, 서버 구축에 많은 시간을 투자할 수 없는 밋업데이 특성상 클라우드 인스턴스가 추가로 필요한 기타 툴들에 비해 강점을 가지고 있다고 판단했습니다.
• 또한 Github과의 완벽한 통합으로 설정과 관리가 쉽습니다.

NCP(Naver Cloud Platform) & Object Storage

• 확장성과 유연성을 바탕으로 다양한 인스턴스를 효율적으로 관리 및 배포할 수 있습니다.
• 체계적인 가이드라인을 제공해 빠르고 정확하게 서버 구축이 가능합니다.
• 또한 서비스에서 사용하는 Naver CLOVA Studio와 같은 Naver의 다른 서비스와의 통합이 용이합니다.
• 데이터 무결성 및 복원력을 보장하고 초대용량 데이터를 저장할 수 있기에 활용하였습니다.

링크 : https://youtu.be/jgDSXNzTFo4

• 컴포넌트명 (components)
  • 폴더명 : 컴포넌트랑 직접적인 폴더명은 PascalCase 사용
  • 파일명 : PascalCase 사용
• 함수명, 변수명, 이미지 파일명 : camelCase 사용
• 상수명 : SNAKE_CASE 사용
• 타입명 : PascalCase 사용

• 패키지명 : 한 단어 소문자 사용 Ex) service
• 클래스명 : 파스칼 케이스 사용 Ex) JwtUtil
• 메서드명 : 카멜 케이스 사용, 동사로 시작 Ex) getUserScraps
• 변수명 : 카멜 케이스 사용 Ex) jwtToken
• 상수명 : 대문자 사용 Ex) EXPIRATION_TIME
• 컬럼명 : 스네이크 케이스 사용 Ex) users_id

• 형식: 태그: 커밋 내용 (#이슈번호)

• 이슈 번호 붙여서 커밋 Ex) #4 [feat] : 로그인 기능 구현
• Body는 추가 설명 필요하면 사용

• 생성한 이슈에 따라서 브랜치 생성 Ex) feature/#4/login