이제는 대화창 하나로 웹사이트를 만들어 봅시다.

안녕하세요. 디자이너 제나입니다. 
오늘의 커피챗에서 소개할 프로덕트는 대화형 인공지능 웹 빌더 'Wegic' 입니다.

그 많고 많은 AI 웹 빌더 중에 'Wegic'을 선택한 이유는 가장 단순하고 친근한 형태의 채팅형태의 웹 빌더 프로덕트이기 때문입니다. 지금도 인공지능을 활용한 웹 빌더 프로덕트는 계속 쏟아지고 있습니다. AI 웹 빌더 프로덕트는 공통적으로 프롬프트를 입력하고 조금만 기다리면 빠르게 웹사이트를 만들어줍니다. 

예를 들면 Galileo나 Dora, Butternut 같은 명령을 입력하면 웹사이트를 생성해주는 프로덕트가 있습니다. 또한 제가 좋아하는 Framer ai 는 다양한 기능을 여러가지 제공하고 있는 꽤 훌륭한 인공지능 웹 빌더입니다. 다 각자의 장점을 갖고 있는 프로덕트입니다. 하지만 그 중에서 가장 먼저 Wegic을 소개하는 이유와 이 프로덕트가 가지고 있는 특별함이 무엇인지 자세히 봅시다.

코어밸류: 대화형 AI 웹 빌더

다양한 인공지능 웹 빌더를 사용해보고 오늘 제가 Wegic을 콕 집어온 이유는 프롬프트로 명령하기 어려워하는 사용자에게 가장 쉽고 특별한 경험을 제공하는 프로덕트라고 생각했기 때문입니다. Wegic의 첫 화면을 보면 어디서 많이 보던 형태를 띄고 있습니다. 바로 대부분 사용자에게 익숙한 Chatgpt 같은 채팅형 구조입니다.

이 프로덕트의 최대 장점은 처음부터 완벽한 웹사이트에 관한 지식을 갖고 프롬프트를 입력하지 않아도 결과를 찾아갈 수 있습니다. 일방적인 명령어를 입력하는 것이 아니라 챗봇과 함께 하나씩 웹사이트에 관한 기본정보를 물어보면서 상호간의 대화를 통해 내 웹사이트의 목적성을 찾습니다. 그리고 연속적으로 이어지는 AI 챗봇의 질문을 통해 어떤 결과값을 입력해야 내가 원하는 웹사이트가 만들 수 있을지 유추할 수 있습니다.

다른 AI 웹 빌더와 차이점 : 완벽하지 않아도 되는 프롬프트

하나의 예시를 보면 대체적으로 다른 AI 웹 빌더의 구조를 보면 보통 명령어를 바로 입력하는 형태입니다. 프롬프트를 바로 입력하게 되어 있어 어느정도 웹사이트에 대한 명확한 계획이 정리된 상태로 명령을 시작해야 합니다. 어디에도 해답지가 없기 때문에 완벽한 형태의 프롬프트를 입력해야할 것 같은 부담을 느끼는 구조입니다.

또한 Wegic의 단순해보이는 채팅창과 비교했을 때 기능이 많아 보이고 패널이 복잡합니다. 패널이 복잡하면 제공하는 기능 또한 더 디테일하다는 장점이 있지만 툴을 습득하는 시간 자체가 많이 소요되고 버튼이 많아서 AI 관련 기능 외에도 지식이 필요합니다. 또한 일반적인 AI 웹 빌더의 경우, 대부분 디자이너에게 익숙한 UI로 만들어졌기 때문에 피그마의 레이아웃을 그대로 차용하거나 기존의 노코드 웹 빌더의 화면과 유사합니다. 이런 툴을 자주 다뤄본 경험이 있을 경우 배움이 빠를 수도 있겠지만 웹사이트에 관한 전문 지식이 부족할 경우, 오히려 프로덕트를 잘 다루기 어렵습니다. 대화 패널만으로 웹페이지를 만들 수 있는 첫 화면은 툴에 대한 난이도를 대폭 감소합니다.

웹사이트에 대한 정확한 계획이 없어도 목적수립 가능

먼저 Wegic에게 질문을 해보겠습니다. 무엇을 만들 것인지 묻자 스튜디오 공식 웹사이트를 만들고 싶으며, 비즈니스 팀 멤버의 정보를 포함하고 싶다는 선택지를 골랐습니다. 최하단의 대화창에 원하는 대화를 입력하고 보내면 귀여운 AI 친구, Jimmy가 친절하게 답변합니다. 대체적으로 캐릭터를 내세울 경우, 사용자가 새로운 정보를 습득할 때 느끼는 어려움을 더욱 극복하기 쉽기 때문에 프로덕트 컨셉에 적절합니다. 듀오링고처럼 친근한 부엉이 캐릭터를 내세워 언어공부의 어려움을 감소시킨 프로덕트가 비슷한 경우입니다. 

제가 물어본 프롬프트에 따라서 비즈니스 웹사이트, 포트폴리오 웹사이트와 블로그 웹사이트까지 세 가지 기본 옵션을 제공합니다. 그 외에 다른 목적이 있다면 자유롭게 프롬프트를 입력할 수 있습니다. 벌써 여기부터 어떤 큰 틀을 갖고 명령을 해야할지 감이 잡힙니다.

어떤 이름으로 프로덕트를 제작할지 물어보는데 저는 생각해둔 이름이 없기에 여기에서 추천해준 이름을 골랐습니다. 그리고 마지막으로 어떤 언어로 웹사이트를 만들지 물어봅니다. 우선 가장 기본적인 영어로 생성해봅시다. 웹사이트가 자동생성되기까지 꽤 시간이 걸리는 편이긴 했지만 약 5분 내외로 충분히 기다릴 만한 정도의 시간이였습니다.

웹사이트 수정도 채팅창으로 명령

제가 방금 챗봇과 나눈 대화를 바탕으로 제작된 홈페이지입니다. 좌측 패널은 만들어진 웹사이트가 보이는데 일반적인 노코드 툴처럼 선택한 후에 직접 입력해서 바꿀 수 있는 형태입니다. 그러나 이 프로덕트에서 주목할만한 포인트는 우측에 있는 채팅창입니다. 여기에서 다양한 명령을 통해 한번에 웹사이트에 영향을 줄 수 있습니다.

전반적인 웹사이트 형태를 보면 화려한 디자인이 들어가진 않았지만 조금만 수정하면 바로 웹사이트로 사용할 수 있습니다. 총 세 페이지를 순식간에 만들어 줬는데 각각 메인페이지, 팀소개 페이지, 상품설명 페이지까지 위에 입력한 값을 제외하고 별다른 명령을 하지 않았음에도 5분도 안되서 만들어졌습니다. 아무리 노코드 툴이 편하고 빠르다고 하더라도 최소 1-3시간 정도 소요하는 걸 감안하면 엄청납니다.

수정모드 채팅창에도 몇가지 수정사항을 옵션으로 제공하고 있습니다. 이미지를 더하거나, 텍스트에 효과를 줘보라는 등 웹사이트에 대한 지식이 없는 사용자를 위해 기본적인 질문을 선택할 수 있도록 하고 있습니다.

입력값에 따른 다양한 옵션제공

Wegic 채팅창의 매력은 질문에 따라 총 3가지의 옵션을 선택할 수 있게 합니다. 처음으로 생성된 A 이미지의 경우, 화면창에 맞지 않은 크기의 이미지를 제공해서 결과물이 만족스럽지 않았습니다. 그래서 B와 C의 옵션을 선택했더니 분위기와 크기에 맞는 AI가 랜덤추천해준 이미지로 고를 수 있었습니다. 그외에도 이미지를 직접 클릭하면 계속 AI가 원하는만큼 어울리는 이미지를 생성해줍니다.

채팅창 입력 한번에 디자인 전체 적용

윗쪽의 초록색 바탕화면이 전체적인 분위기를 어둡게 만드는 것 같아서 흰색으로 바꿔보고자 했습니다. 채팅창에 배경색을 바꿔달라고 입력하고 혹시 몰라서 색상코드까지 명확히 입력했더니 바로 바탕을 흰색으로 변경해줬습니다. 하나씩 배경을 클릭해서 바꿀 필요없이 한번에 모든 페이지가 흰색으로 수정됐습니다.

폰트도 좀 딱딱해보이는 것 같아서 제목과 본문 모두 변경하고 싶다고 입력했습니다. 그러자 챗봇이 알아서 세가지 옵션의 폰트 스타일을 추천해 줍니다. 재미있는 건 모던하고 전문적으로 보이는 스타일, 부티나고 세련된 스타일과 볼드하고 클래식한 스타일까지 알아서 폰트를 골라줍니다. 사용자가 나서서 직접 정확한 폰트명을 입력하지 않더라도 원하는 느낌에 따라 알아서 디자이너가 자주 사용하는 조합을 적용해줬습니다.

마지막으로...디테일하고 글로벌한 언어설정까지 가능

맨 처음 웹사이트를 생성할 때 영어 외에도 다양한 언어로 제작할 수 있는 옵션이 있었습니다. 대부분 가장 많이 사용하는 언어인 영어에 맞춰서 프로덕트가 개발되기 때문에 각 국적에 맞는 웹사이트를 만들 수 있을지도 굉장히 중요한 사안입니다.

처음에는 이미 제작된 프로젝트의 채팅창에서 언어를 한국어로 바꿔달라고 명령하자 웹사이트는 바뀌지 않고 언어설정만 한국어로 바뀌었습니다. 두 번째 시도로 초기 화면으로 돌아가 아예 새롭게 한국어를 설정해서 웹사이트를 생성해달라고 부탁하자 꽤 상세하게 전체적인 설정을 브리핑합니다. 스타일, 키워드, 언어적인 표현, 아이콘 라이브러리, 테마 색상, 폰트 그리고 페이지 구성까지 선택할 수 있는 걸 봐서 적절하게 대화를 잘 입력하면 더욱 원하는 값을 적용한 웹사이트를 만들 수 있을 것 같습니다. 이런 웹사이트를 잘 만들어낼 수 있는 프롬프트에 관한 단서를 제공하는 것 자체가 큰 메리트인 것 같습니다.

특히 말투 표현까지 설정할 수 있다는 점에서 UX writing을 브랜드 컨셉과 페르소나에 적절하게 생성해준다는 포인트가 굉장한 장점이라고 생각합니다.

한국어로 만든 웹사이트 결과물입니다. 조금은 번역체같은 어투이긴 하지만 넓게 봤을 때 크게 문제가 없습니다. 오히려 기존 노코드 툴에서 제공하던 언어 전환 프로덕트보다 번역능력이 더 좋은 것 같기도 합니다. 특히 지금 예시로 만들어낸 한 페이지짜리 이벤트 페이지 같은 노력이 적게 투입될수록 효율적인 웹페이지에 특히 유용하게 사용할 수 있습니다.

가장 웹사이트를 만들기 쉽다는 노션보다도 더 빠르게, 심지어 CTA(행동유도버튼)도 여러개를 넣어서 화면을 다채롭게 구성할 수 있다니 꽤나 혁신적인 프로덕트라고 생각합니다.

📍오늘의 개인적인 견해

아직은 완벽하지 않지만 안 쓸 이유도 없다.

물론 인공지능이 만들어주는 웹사이트 빌더를 사용하다 보면 아직은 한계점을 느낍니다. 원하는 만큼 한번에 만들어 주지 않기도 하고 특히 웹사이트에 자동으로 삽입되는 이미지는 사람이 직접 제작하고 넣는 것보다 퀄리티가 떨어져서 디자인적으로 아름답지 않기도 합니다. 그러나 웹사이트의 본질은 프로덕트를 잘 보여주는 것입니다. 좋은 프로덕트를 홍보하고 판매하면 사실 웹사이트가 어떻게 생겼든 크게 문제가 없다는 걸 그동안 수많은 사례를 통해 검증해왔습니다. 저 역시 디자인이 아름다운 웹사이트를 굉장히 좋아하지만 미적인 부분은 다른 논의의 영역이라고 생각합니다. 멋진 디자인을 원한다면 AI를 사용하기 보다는 필요에 따라 디자이너에게 직접 의뢰하거나 더 다양한 기능을 제공하는 툴을 활용해야겠죠?

사용성과 mvp를 빠르게 실험하고자 할 때 더욱 빛나는 가능성을 제공하는 툴이라고 생각합니다. 특히 인공지능을 활용한 웹 빌더를 처음 진입할 때 프롬프트에 대한 힌트를 많이 얻을 수 있을 것 같습니다. 아직 Wegic은 출시한지 얼마 되지 않은 프로덕트이기 때문에 기능이 업데이트 되고 있는 중입니다. 좀 더 원하는 완벽한 결과값을 만들어주는 인공지능 웹 빌더를 사용하고 싶다면 Wegic의 챗봇과 대화를 통해 인사이트를 수집하고 이를 바탕으로 프롬프트를 작성해보는 것도 현명한 방법입니다.

한 가지 인공지능 툴로 완벽한 결과를 도출하면 정말 좋겠지만 아직은 발전하는 과정의 중간에 있다고 생각합니다. 조금씩 다른 영역에 강점이 있는 AI 툴을 기존의 디자인 툴과 조합해서 사용해본다면 더욱 생산속도를 이끌어 올릴 수 있는 또 다른 기회라고 생각합니다.

웹 디자이너, 걱정할 필요 없습니다.

마지막으로 이렇게 알아서 모든 걸 만들어주는 인공지능 웹 빌더가 등장해서 불안에 떨고 있는 웹 디자이너들도 있을 거라고 생각합니다. 하지만 이런 툴을 쓸 때마다 드는 생각은 디자이너이기 때문에 이런 툴을 더 빠르게, 효과적으로 잘 다룰 수 있다는 사실을 증명받습니다. 디자이너가 아닌 일반 사용자들은 러프하고 저렴하게 웹사이트를 만들 수 있다는 장점이 있습니다. 하지만 여전히 완성도 높은 웹사이트는 디자이너의 힘이 필요합니다. 멋진 기획과 홈페이지의 완성도를 결정짓는 비주얼 자료들은 고를 수 있는 미감을 가진 디자이너는 AI 툴을 더 고급 영역까지 이끌어서 사용할 수 있는 사용자들입니다.

디자이너가 인공지능 프로덕트를 적극 활용한다면 기획에 보다 집중할 수 있는 훌륭한 컨트롤 타워가 될 수 있습니다. 그리고 초기단계의 프로덕트는 mvp를 증명하는 것에 더 힘써야하기 때문에 못생긴 웹사이트로도 충분히 해결이 가능하지만 많은 사용자가 모이고 사용성의 퀄리티를 높여야 하는 단계에 도달한 프로덕트의 경우 전문적인 디자이너의 영역이 반드시 필요하다는 사실을 더욱 느끼게 했습니다. 앞으로 인공지능을 활용한 웹 빌더 프로덕트가 어디까지 성장할 수 있을까요?

여러분도 Wegic이 앞으로 더욱 사용자의 의도와 명확히 일치하는 웹사이트를 만들어낼 수 있다고 생각하나요?

저의 글이 오늘의 커피타임에 도움이 되었길 바랍니다. ☕️🙇‍♂️

Threads 를 만들었습니다! 여기에서는 뉴스레터에 소개하기엔 애매하고 분량이 짧지만 다양하고 재미있는 프로덕트를 더 자주 캐주얼하게 소개해볼까 합니다.

궁금하신 분들은 찾아와주세요.

@coffechat__