웹 형식의 포트폴리오를 만들자(4)

지난 번에는 드디어 포트폴리오를 완성했습니다!

https://yoomyum.tistory.com/9

 

이 모든 영광을 '클로드'에게 바치겠습니다(?)

---

 

무튼 이제는 정말 웹 형식으로 변경할 차례입니다.

저는 공대 출신이긴 하지만... 코딩에 대해 문외한이기 때문에...^^

AI에게 또 모든 것을 맡겨 볼 생각입니다.

 

이번에 사용할 AI는 Lovable입니다.

실무에서도 [PRD → 프로로토타입 생성 → 개발자와 소통] 과정에서 용이하게 사용한 AI입니다.

 

PRD가 아닌 ppt 형식의 figma를 입력하고,

자연어로 인터렉션을 추가해달라고 말할 예정입니다.

(잘 될지 안 될지는 몰?루...?)

 

일단 해보겠습니다!!

---

https://lovable.dev/dashboard

 

러버블에 들어가서 아래와 같이 요청했습니다.

(정말 다 모르겠고 가능해? 해줘. 느낌 ㅋㅋㅋ)

 

 

 

이후에는 pdf와 제가 참고한 웹사이트 디자인 (지원하고자 하는 회사 홈페이지)를 레퍼런스로 제출했습니다.

 

 

 

 

그러면 요렇게... 대화창과 결과물을 확인할 수 있는 화면으로 변경됩니다.

좌측 사이드 바에서는 요청을 하고, 요청 내용을 어떻게 처리하고 있는지 진행사항을 확인할 수 있습니다.

그리고 큰 화면에서는 요청한 내용에 맞게 프로토타입을 만들어 줄거예요.

 

 

 

 

기다리니까 요로콤 결과를 만들어줬습니다.

인터렉션도 자동으로 추가해줬네요.

여기서 제가 마음에 들도록 조금씩 요청을 추가하도록 하겠습니다.

 

 

...

 

자연어로 요청하면 알잘딱깔센으로 알아듣고 처리하기 때문에,

작업은 굉장히 편합니다.

다만 토큰 이슈로 이틀에 걸쳐서 완성하게 되었습니다.

(하루에 5토큰 제공. 한 달 최대 30토큰)

 

 

 

Preview 를 웹 형식으로 출시할 때는,

우측 상단의 Pubilsh 버튼을 이용하면 됩니다.

 

유로 버전에서는 도메인 주소 변경과 Lovable 로고 삭제가 가능하다고 알 고 있는데,

저는 그냥 무료 버전을 이용했어요!

 

그렇게 완성된 제 포트폴리오 입니다!!

 

https://web-folio-shine.lovable.app/

Portfolio

 

개인정보가 그대로 있어서 공개할까 말까 망설였는데...

뭐 어때? 싶은 생각이 들어서 공개합니다~

(나중에 지울수도?)

 

---

 

이렇게... 총 4회에 걸쳐 포트폴리오가 완성되었습니다.

 

처음 기획한 것과는 조금 다르게 진행된 감도 있고...

상세 텍스트는 계속 디벨롭 해야겠지만,

최종 목적인 웹 형식의 포트폴리오가 완성되었다는 것이 기쁩니다^_^

 

혹시 조금 색다른 포트폴리오를 만들고 싶다. 하시는 분은

저와 같이 AI활용으로 간단하게 웹페이지 제작하는 것 강추드립니다!

 

궁금한 내용은 댓글로 달아주시면 최대한 답변해드리겠습니당.

 

그럼 저는 다음 포스팅으로 돌아오겠습니다!