비전공자 노코드툴 Framer (프레이머) 사용해서 브랜드 런칭하기

안녕하세요.

저는 프레이머를 사용해서 제 웹사이트를 구축해 냈습니다.

왜 프레이머냐고 하시냐면, 처음 ai로 사이트 플로우를 구성해 주길래 호기심에 시작해 봤고,

다른 카페24나 아임웹과 다른, 피그마 같은 스타일에 너무 호기심이 갔습니다.

하다보니 어렵지만 쉽더라고요. (이게 무슨 말인가 싶지만 다루기는 쉽지만 또 실제 완벽하려면 약간은 어렵습니다)

저는 디자이너도 아니고 코딩하는 사람도 아닙니다!

여러 사이트를 레퍼런스 삼아 제 스타일로 디자인을 꾸며보자라는 가벼운 마음에 시작했습니다.

근데 0에서 1을 만들어 내려니 너무 어려워서,

프레이머 템플릿 중 이커머스 쪽으로 간단히 구축되어 있는 것들을 봤고,

임베드 되어진 것이나 이펙트 적용되어 있는게 점점 눈에 띄었습니다.

여러 템플릿을 보고 그 중 좋은 소스만 빼면서 제 사이트를 만들었습니다.

중간에 하면서 포기할 뻔도 했고,

실제 프리랜서에 프레이머 사이트 만들어 달라고 요청도 해 봤는데, 예상보다 예쁘게 안 나오더라고요.

그래서 싹 갈아엎어, 제가 다시 시작했고

그 프리랜서 분께는 하면서 어려웠던 점이나

제가 시도 했음에도 적용이 안되는 궁금한 부분을 물으며 해냈습니다!

쇼핑 카트도 넣고 싶었으나 결제 구축하는 부분과 복잡하여
우선은 한 가지 상품을 런칭했고

상품이 추가되면 카트 적용하는 부분 등 더 파고들어 해낼 생각입니다!!!

저는 약 3-4개월은 디자인 수정, 플로우 등 계속 수정했습니다.

하면서 gpt 도움도 많이 받았습니다.

프레이머가 좋은 점은, 다른 웹 사이트에서 마음에 드는 디자인을 copy + paste 할 수 있다는 점입니다.

제가 전문가가 아니다 보니, 완벽하게 가져오는 방법은 몰라서 크게 유용하게 사용하지는 못했습니다.

적어도 글꼴 정도나 버튼 모양을 만들어 내는 시간과 리소스를 줄여줍니다. ㅎㅎ

또 이렇게 제품 소개란에 레이아웃에 한 번에 적어서 보여줄 수도 있습니다.

중국 배송 및 반품 - 스크린샷
한국어 텍스트 편집기의 스크린샷
Adobe Xcode의 프로젝트 스크린샷

비전공자가 이렇게까지 만들어 내다니, 저는 제 웹사이트를 보며 항상 뿌듯함을 느낍니다!

프레이머가 노코딩 툴이지만 또, 코딩을 알면 더 나은 웹을 만들 수 있어요.

두 개 옵션을 모두 해낼 수 있는 툴 인 것 같아요.

검정색 배경의 웹페이지 스크린샷

또 이렇게 footer 를 따로 만들어서 넣으면, 수정은 이 하나에 공간에서 하면

알아서 모두 적용이 되고, Large pc, pc, 태블릿, 모바일 버전 모두 한 눈에 확인 + 수정도 일괄 적용됩니다.

프레이머 너무 좋아요! 사실 쇼핑 카트나 이커머스 템플릿 기능을 더 디벨롭해 줬으면 하는 기능이 많지만 기다려봅니다ㅜ!

여러분도 도전해 보세요.

제 사이트도 와서 구경해 보세요~~

www.bezt.co.kr

4

👉 이 게시글도 읽어보세요