이경원님의 아티클

(마감) Framer 부트캠프 - 디자이너가 아니어도 3일 안에 트렌디한 랜딩페이지 제작할 수 있게 해드립니다

랜딩페이지를 잘 기획했더라도 그것을 잘 디자인하고 잘 구현해서 사람들에게 실제로 전환을 일으키는 것은 또다른 문제입니다. 프레이머(Framer)는 코딩을 배우지 않고도 빠르게 완성도있는 웹사이트를 구현할 수 있는 리액트 기반의 노코드 툴입니다.

하지만 디자이너가 아니라면 노코드로 웹사이트를 구현할 수 있는 것은 알지만 막상 ‘잘’ 만들고 싶은데 디자인의 원리를 몰라 헤메는 분도 많으실 것 같습니다. 이를 해결하기 위해 저는 대학원, 병원, 로펌, 학원, 스타트업들 등 여러 웹사이트 외주를 해오며 얻은 노하우와 비법을 아낌없이 공유하고자 합니다.

🔥 이런 분들을 기다리고 있습니다:

• 1인분 같은 3인분을 하고싶은 솔로프리너, 1인창업가

• 가설 검증을 랜딩페이지로 빠르게 시도해보고 싶은 창업가

• 노코드에 대해 관심이 많은 디자이너, 기획자

📍 일시

• 밤 8:00~10:30 실시간 온라인 (불가피한 사유로 불참시 VOD도 제공 예정입니다.)

• 8월 주말 중 3회 선택 가능합니다.

• 실시간 온라인 이외에도 추가적인 가이드, 리소스 모음 등 제공 예정

💎 금액

• 30만원

외주로 최소 300만원 기준 10분의 1도 안되는 가격으로 과외받으면서 직접 웹사이트를 만들 수 있는 기회입니다!

+템플릿과 전자책도 드립니다!

커리큘럼

1일차- 웹사이트 기획의 스키마 체득 하기 🧠

• 따라만 하면 되는 프레이머 기본 세팅법

• 전환율을 높이는 랜딩 페이지 기획 (+노션 기획 템플릿 제공)

• 카피의 중요성

2일차- 디자이너가 아니어도 있어보이는 디자인을 하는 방법 💡

• 생동감 있는 Micro-Interaction 쉽게 구현하기

• 이미 있는 리소스 효과적으로 레버리지 하기

• 대비와 일관성으로 보는 디자인의 기초 원리 (폰트 이렇게 쓰지 마세요!)

• SPLINE을 활용한 3D 웹사이트 쉽게 만들기

3일차- 만들기만 한다고 끝나나요? 이제 시작입니다 🔥

• 사용자 데이터 분석하기 - Data-Tracking 툴 연동 방법과 분석 방법

• AI 챗봇 연동해서 CS에 활용하기

• 수수료 없이 내 웹사이트에 결제 바로 연동하기 (페이앱, 스트라이프 / 토스, 페이플)

• Airtable로 이메일 자동화 시스템 만들기

• SEO (구글 / 네이버) / 마케팅 꿀팁

문의: 01085154338 이경원

토스뱅크 1000-7834-8698

프레이머 부트캠프 지원하기 👇🏻

20살이 6개월간 3천 벌면서 알게된 전환율을 높이는 랜딩페이지 기획 방법

안녕하세요 1학년 1학기 후 바로 휴학하고 6개월간 프리랜서로 활동하며 얻게 된 랜딩페이지에 대한 인사이트를 공유해보고자 합니다.

사람들을 설득하는 랜딩페이지

랜딩페이지는 단순한 간판이 아닙니다. 특정한 목적을 지닌 설득의 과정입니다. 결국 사람들을 설득하기 위해 만들어진 페이지라면, 결국 무슨 말을 하고자 하는지가 명확해야합니다.

그렇다면 랜딩페이지를 가장 단순하게 접근하는 방법은 없을까요?

랜딩페이지를 만들 때 던져야 할 7가지 질문 체크리스트 (feat. YC)

1. CTA가 직관적이고 명확한가?

CTA는 랜딩페이지를 통해 얻고자 하는 목적에 직결된 요소입니다.

직관적이고 명확하다는 것에는 언어적인 것 뿐만 아니라 시각적인 효과까지 고려해야합니다.

✅

무료 체험이라는 혜택을 강조

즉시 행동을 취하도록 유도

배경과 확실한 대비

❌

클릭 후에 무엇을 얻을 수 있는지명확하지 않음

긴급성 X

배경과의 대비가 약함

언어: 지금 구매하기(사용자가 즉시 해야할 행동 지시), 30일 무료 체험 시작하기(혜택 명시)

시각: 배경과의 충분한 대비, 페이지 내 다른 요소와의 충분한 대비 - 한마디로 멀리서 봐도 눈에 확 띄어야 합니다.

2. 이 서비스가 도대체 뭐지? (Hero)

랜딩페이지를 모두 읽은 후에도 무엇을 말하고자 하는지가 전달되지 않는다면 무용지물입니다.

랜딩페이지의 첫 섹션, 즉 Hero 섹션에서 5초 안에 이 서비스가 어떤 서비스인지 스캔이 가능해야합니다.

YC의 스타트업 웹사이트 첫인상 테스트 (with Dribble CEO)

3. 이게 나에게 맞는 서비스인가? (Problem & Solution)

사람들은 자신의 문제에만 관심이 있습니다. 따라서 이 랜딩페이지에서 나(사용자)의 모습을 대입해서 생각할 수 있는지? 내가 겪고 있는 문제가 여기에 나와있는가? 가 스캔 가능한지 확인해야합니다.

대상 타겟이 내가 해당된다고 느낄 때에만 제시하는 가치가 효용을 바랄 수 있습니다.

4. 이 사이트가 신뢰할만한가?

흔히 있어빌리티라고 하는 측면입니다. 요즘은 디자인을 할 줄 몰라도 템플릿을 잘 쓰면 짜치지 않는 디자인을 할 수 있으니 극복 가능한 부분인 것 같습니다. 랜딩페이지의 가장 밑에 있는 푸터를 귀찮을 수도 있지만 푸터의 유무는 신뢰도에 영향을 끼칩니다.

그리고 신뢰를 형성하는 측면에서는 반드시 사람들이 이 웹사이트에서 어떤 감정과 이미지를 느끼게 해야 할까?를 생각해보시길 바랍니다. 전달하고자 하는 감정에 따라 신뢰도를 결정짓는 요인이 달라질 수 있습니다.

5. 누가 실제로 사용 중인가? (Testimonials)

인간은 사회적 동물이기 때문에 사회적 확인을 통해 안정감을 느끼고자 하는 본능적인 욕구를 충족시켜주어야만 합니다.

후기 섹션이라고 생각하시면 됩니다. 이미 이용 중인 사용자가 있다는 것을 알려주는 것 만으로도 신뢰를 쌓을 수 있습니다. 우리가 원하는 이상적인 타겟 고객의 페르소나에 맞는 리뷰를 기준으로 선정합니다.

6. 그래서 내가 얻는게 무엇인가? (Benefit)

슈퍼휴먼의 사례입니다. 1000만 시간을 절약하고 있다, 2배 더 빠르게 이메일을 확인할 수 있다 등 구체적인 수치를 제시하며 시간을 아껴주는 가치를 강조하고 있습니다.

유료 서비스라면 사람들이 돈을 내는 것이 무엇이고 어떤 지점을 강조할 지 고민해보시면 좋습니다.

사람들이 돈을 내는 것들

• 돈을 아껴주는 것

• 돈을 벌게 해주는 것

• 시간을 아껴주는 것

• 리스크를 줄여주는 것

• 자기 표현

• 쾌락

• 생존

7. 어디서 도움을 받을 수 있는가?

사람들은 이 서비스 뒤에 진짜 사람이 있는지 확인해보고자 합니다. 따라서 고객 응대 채팅 서비스 등을 하단에 작게 삽입하는 것 또는 연락할 수 있는 통로를 제시하여 언제든지 우리와 연락이 가능하다는 느낌을 주어야 합니다.

랜딩페이지 상세 기획 가이드 💎

구체적으로 정리한 랜딩페이지 기획 노션 가이드입니다.
글에서는 체크 리스트 정도로 정리한 것이라 노션에서는 스텝 바이 스텝으로 각 섹션에 구체적으로 어떤 내용들이 들어가야하는지 확인할 수 있습니다!