소개
ChatGPT+클로드+리드젠으로 랜딩페이지 만들기 (만들면서 학습하기)
진행 방법
[과정]
유저 페르소나, 유저 저니맵, 랜딩페이지 문구 작성
사용 도구: GPTs - STP Analysis Assistant
랜딩페이지 문구 -> html 코드로 변환
사용 도구 1: ChatGPT 4o with canvas
사용 도구 2: Claude
html 코드 -> 랜딩페이지 변환
사용 도구: 리드젠
[진행 과정]
STP GPTs로 러닝 크루 비즈니스에 대한 페르소나 도출을 요청했어요.
최종적으로 러닝 크루 랜딩 페이지 문구를 도출했어요.
GPT canvas에 [랜딩 페이지 문구]를 붙여넣고, 랜딩페이지 코딩을 요청했어요.
GPT에서 추출한 html 코드를 리드젠으로 가져와 삽입했어요.
처음 시도는 퀄리티가 좋지 않았어요... 그래서 gpt canvas로 돌아와 코드를 여러 번 수정했지만 더 나은 결과를 얻기가 어려웠어요.
저는 GPT만 많이 사용해보고 클로드는 자주 사용하지 않았어요. 그런데 gpt에서 원하는 퀄리티의 랜딩페이지 코드를 추출하기 어려워 동일한 [랜딩페이지 문구]를 클로드에 붙여넣고 코딩을 요청했어요. 결과는 GPT 1차 output보다 훨씬 좋았습니다~~
프롬프트로만 요청해서 랜딩페이지 디자인을 도출해야 했기 때문에 그 과정이 쉽지 않았어요. 복잡한 요청 사항은 반영이 되지 않아 최대한 심플한 스타일로 요청했어요.
이 과정에서 일부 이모지가 노출되지 않는 이슈가 발생해 노출 가능한 이모지로 다시 편집했어요.
결과와 배운 점
유저 페르소나와 비즈니스에 맞게 랜딩페이지 문구를 작성하고 이를 html 코드로 변환한 후, 리드젠을 활용해 개발 없이 랜딩페이지를 구축할 수 있다는 점이 흥미로웠어요!
다음에는 디자인적인 실험보다는 실제로 실험 가능한 아이템을 선정해 마케팅 퍼널을 구축해 보는 것을 목표로 하겠습니다.
랜딩페이지 링크: https://jykim.leadgen.kr/lpo.php?seq=4d6a67794e7a5533&cache=1731492269
