Claude Opus 5.5에게 60만개 레퍼런스 주고 디자인을 시켜봤습니다. PRD, Mobbin 레퍼런스 활용해서 디자인부터 프로토타입까지 transcript

요즘에 오픈 AI하고 앤트로픽에서 새로운 모델이 많이 출시되고 있는데요. 이번 영상에서는 앤트로픽의 최상이 모델보다는 가성비가 좋고 한편으로는 굉장히 성능이 좋다고 평가되는 오퍼스 모델을 활용해서 모빈의 60만 개의 레퍼런스를 줬을 때 이거를 얼마나 잘 활용하는지 그리고 이거를 통해서 디자인 개선을 또 얼마나 잘하는지 살펴보도록 할게요. 그래서 테스트할 토픽은 iOS앱인데요. 어, 먼저는 기획 문서를 제공해서 클로드가 아무런 스킬이나 레퍼런스가 없을 때 어떤 결과를 만들어 낸지 보려고 하고요. 그다음에는 레퍼런스를 제공했을 때 어떻게 리서치를 하고 또 그거를 어, 디자인에 적용하는지 테스트를 해 볼 겁니다. 보고서는 어떤 근거와 레퍼런스 어,이 의사 결정이 되었는지 기존처럼 작은 텍스트들을 나열한게 아니라 핵심적인 텍스트를 중심으로 짧고 굵게 보여 준 것들이 좋았다고 생각이 들었습니다. 저는 에릭이고요. 어, 한국과 미국 태업께서 프로젝트 디자인으로 일을 해 봤습니다. 앱 UX 분야에서 아마존 베스셀러를 올렸던 책이 두 건이고요. 어 그러면가 보시죠. 테스트에 들어가기 전에 사람들이 오퍼스 5.5에 대해서 특히 UX나 앱 디자인 쪽으로 어떻게 평가하는지 한번 살펴볼게요. 어, 왜냐면 보통 새로운 모델이 나왔을 때 그까 UX나 UI 이런 쪽 얘기보다는 어, 3D 모델링이나 또 영상 작업 이런 얘기를 주로 많이 해서 어, 테스트에 들어가기 전에 사람들이 오버스 5.5에 대해서 어, 특히 UX나 앱 디자인 쪽으로 어떻게 평가하는지 살펴볼게요. 어, 일단은 X나 레디에서 사람들이 어떻게 이야기하는지 찾아봤습니다. 먼저는 긍정적인 반응인데요. 빠자라라는 분은 어 UI 슬롭은 이제 거의 해결된 거 같다. 아 이렇게 이야기를 했고요.

UX 그리고 재밌는 실험에 아주 능하다. 이렇게 말씀하신 분이 있었습니다. 또 UX에는 어퍼스 5.5가 최고의 모델이다. 이런 말씀하신 분도 있었고요. 한편으로 부정적인 의견으로는 어 UX 라이팅은 여전히 놀라울 정도로 못한다라는 말 또 개선된게 없다라고 하는 분도 있었고 스크린샷을 레퍼런스를 줘도 잘 못 하는 거다. 이런 의견도 있었어요. 어 그런데 이렇게 사람들이 말하는 의견만 듣고는 또 저희가 그대로 판단하기 어렵기 때문에 실제로 직접 운영을 했을 때 테스트를 했을 때 어떻게 얼마나 작업을 잘하는지 보는게 중요할 것 같아요. 그럼 이제 실제로 어떤지 살펴볼 건데요. 그 전에 기준을 좀 세우고 진행을 할 거예요. 어 제가 다른 영상에서도 이야기를 한 적 있지만 디자인 능력이 좋다라고 할 때 그 안에는 사실 수많은 스킬이 들어 있거든요. 시각적으로 사용자를 붙잡을 수 있고 정보가 잘 전달될 수 있도록 하는 부분도 중요하지만 사람들이 보통 시각적으로 예쁘다 그러면 바로 디자인 잘한다 이렇게 이야기도 이야기를 하지만 사실 그게 단은 아니거든요. 그래서 자료나 레퍼런스를 차는 리서치 능력이나 화면별로 어떤 것을 제공할지 또 어떤 유적 시나리오일 자지를 고민하는 기획 능력 그리고 디자인 단계의 산출물과 최종 결과를 검증하는 QA까지 사실 디자인 능력에는 여러 가지 스킬들이 있습니다. 아 그런데 오늘은 모든 걸 검증하지는 않을 거고요. 레퍼런스 리서치 능력과 시각적인 정보 전달 능력을 좀 더 중점적으로 보도록 하겠습니다. 이번에 AI 앱 아이디어로 정해 본 거는 다음 거 같아요. 요즘에 그록봇이나 채치 다치 같은 일상에 들어온 AI 에이전트가 많이 또 핫한데요. 어 거기서 좀 영감을 얻었어요. 친구 가족 카톡방에 AI를 멤버로 초대해서 일정 약속이나 여러 결정을 도와주고 기억해 주는 AI AI 채팅 앱이 있으면 어떨까 이런 생각이 들었는데요. 쉽게 말해서 AI 총무라고 보시면 됩니다. 본격적으로 들어가기 전에 일단 앱 빌딩을 하데 있어서 제가 받는 워크플로를 조금 말씀을 드릴게요. 어 그래야지 오늘 실습에서 각 단계를 왜 밟는지 이해할 수 있을까요? 제가 특히 어떤 앱을 만드는 초기 단계에서는 다음과 같은 순서를 받는 편인데요. 어, 첫 번째는 브레인스토밍, 마켓 리서치, 경쟁사 리서치 이런 것들입니다. 어떤 서비스를 만들지 만약에 이미 있는 서비스에다가 새로운 기능을 넣다면 어떤 걸 만들지 고민하는 단계라고 보시면 됩니다. 그리고 기획 단계에서는이 서비스가 어떤 기능이 필요하고 어떤 화면이 필요하고 어, 각 화면은 어떻게 구성되어야 하는지, 또 기술적인 측면에서는 뭐를 고려야 되고이 서비스는 어떤 문제를 해결하는 것인지를 구체하고 정리하는 단계라고 보시면 돼요. 그다음은 디자인인데요. 여기선 본격적으로 실제 사용자가 만지고 쓰게 될 화면을 시각적으로 구체화하는 단계라고 보시면 돼요. 어, 보통은 빈 캠퍼스에서 시작하진 않고 유사한 서비스를 살펴본다든지 의미 있는 서비스라면 디자인 시스템은 어떻게 구성이 되어 있고 어떤 규칙을 적용하고 있는지를 어, 또 살펴볼 필요가 있습니다. 디자인이 어느 정도 완성이 된다면 어, 프로토타입을 만드는데요. 프로토타입은 이게 단순히 화면 수준이 아니라 작동이 되도록 구현을 하는 겁니다. 어떤 분들은 프로토타입이 굉장히 완성도가 높은 것만 프로토타입이라고 생각하시는데 사실 와프라임 같이 최소한의 시각화 작업을 한 산출물을 가지고도 만들 수 있습니다. 여기서 중요한 거는 어 시각적인 완성도가 높냐 아니냐 그것보다는 어 프로토타입의 활용 목적에 있습니다. 시각적인 완성도가 낮더라도 사용자와 가설 검증을 하거나 내부적으로 의사 결정적으로 하는데 있어서 어 충분하다면 어 그건 그것대로 괜찮다고 보는 겁니다. 그리고 또 한편으로는 요즘에는 이제 바이브 코딩으로 어 프로토타입을 만들기 위한 장비 많이 낮아졌기 때문에 어 거의 출실 수준으로 프로토타입을 만드는 것도 어 많이 가능해졌죠. 마지막으로 검증인데요. 유저 리서치 그리고 출시를 통한 데이터 측정, AB 테스트 이런 것들입니다. 지금까지 만든 결과물 그게 프로토타입이 될 수도 있고 실제 출시된 제품이 될 수도 있어요. 근데 그거를 가지고 사용자에게 피드백을 받아서 개선 방향을 잡거나 어쩔 때는 아예 서비스를 그만두거나 뒤집대 활용할 수도 있습니다. 어 그런데 또 한편으로는 어 요즘에는 사람인 사용자만 사용자가 아니라 사람이 AI 에이전트한테 시켜서 또 웹 리서치를 하거나 어떤 테스크를 주기도 하기 때문에 어 이제는 AI 에이전트가 어떻게 활용하는지도 조금 디자인하 하는데 고려를 하기 시작해야 되는 거 같습니다. 그래서 이번 프로젝트 실습에서는 첫 번째와 두 번째 즉 브레인스토밍과 기획은 되었다고 가정을 하고 진행을 해 볼 거예요.이 AI 총무 서비스에 대해서는 기획 문서인 PRD를 이미 만들어 둔 상태에서 이제 시작을 하는 거죠. 그리고 그다음 단계인 디자인과 프로토타입을 해 볼 건데요. 어, PID의 내용은 쉽게 말씀드리자면 가상의 채팅 앱이 있다고 가정하고 거기서 내가 친구나 지지인들과의 단책 톡을 할 수 있는 상황에서 AI 총무에게 주요 의사 결정들이나 액션 아이템들을 정리해 달라고 하고 기억해 달라고 하는 거라고 보시면 됩니다.

PRD의 실제 있는 내용들은 기가 꽤 길어서 궁금하신 분들은 볼 수 있게 댓글에 링크를 달아두도록 할게요. 어, 저는 클로드 데스크톱 앱을 썼고요. 어, 클로드 앱을 다운로드 받고 앱을 켜시면 왼쪽에 어,이 클로드 코드 아이콘이 있습니다. 이걸 누르시고 자, 새로운 대화를 시작하면 폴더를 선택할 수가 있는데요. 어, 폴더를 선택하게 되면 그 폴더 안에 어떤 산출물이나 파일들이 쌓이게 되고요. 폴더를 선택하지 않더라도 작업 산출물들은 클로드의 아티팩트에 모두 저장이 됩니다. 어, 디자인이나 문서 같은 것들이요. 앞서서 만든 PRD 문서도 그렇게 해서 만들어져서 아티팩트에 저장이 됐고요. 저는 여기서 어 슬래시 디자인을 누르고 PRD에서 정의한 화면들을 만들어서 보여 줘. 어, 이렇게 프롬트를 줬어요. 참고로이 슬래시 디자인은 제가 다른 영상에서 다른 적이 있는데 클로드 코드를 사용할 때 디자인 산출물을 이렇게 아트보드 캠버스 상에서 쭉 펼쳐 놓고 볼 수 있도록 도와주는 기능이에요. 그리고 여기서는 디자인을 텍스트라든지 컬러 같은 거를 바로 변경을 할 수도 있고요. 어, 프롬트 명령 없이 그래서 어, 전 요즘에 디자인 작업을 할 때는이 슬래시 디자인을 많이 쓰는 편이고요. 모델은 여기서 5.5 선택해서 어, 진행을 했습니다. 참고로 이거는 아무런 스킬을 주지 않았고 어 레퍼런스를 주지 않은 결과를 만들어 달라고 한 거예요. 그래서 지금처럼 1차 버전을 받을 수 있었는데요. 참고로이 1차 버전이 어 그래도 무난하게 나온 편이라고 생각이 들었어요. 하지만 아쉬운 부분들도 있었는데요. 제가 어떤게 아쉽다고 지적을 하지는 않았고 어 바로 레퍼런스를 활용해서 개선을 해 보라고 했습니다. 제가 앞서서 말씀드린 것처럼 레퍼런스 리서치 능력이랑 그걸 토대로 어떤게 문제인지 문제를 파악한 능력 그리고 그걸 토대로 계산하는 능력도 보고 싶었기 때문에 그래요. 그리고이 1차 버전에 대해서 디테일한 화면들에 대해서 어 설명해 들어가기 전에 일단 제가 전체적으로 어떤 프로세스를 밟았는지 먼저 말씀을 드릴게요.이 1차 버전과 2차 버전 그리고 3차 버전까지가 있었거든요. 즉 레퍼런스를 활용해서 그 개선을 계속 했어요. 개선을 어떻게 했는지 먼저 말씀을 드리고 1차 버전, 2차 버전, 3차 버전이 어떻게 디자인 변경이 되는지 나중에 한꺼번에 같이 보여 드리도록 할게요. 그래서이 2차 버전을 만들기 위해서는 어 새로운 페이지를 만들어서 아티팩트 그 캔버스 상에 새로운 페이지를 만들어서 개선해서 만들어 달라고 했는데요. 모인 레퍼런스를 활용하라고 했고요. 그리고 여기서는 컬러나 브랜드는 따로 건드리지는 말라고 했어요. 어 왜냐면 좀 사용성 그 자체가 어떻게 개선되는지를 보고 싶었기 때문에 그래요. 그리고 어 V1과 V2를 나란히 볼 수 있게 또 배치도 해 달라고 했습니다. 왜냐면은 어 어떤게 개선되는지도 또 직관적으로 알 수 있기 때문에 그렇습니다. 참고로 모비는 앱이나 웹사이트의 레퍼런스 60만 개가 넘는 것들을 갖고 있는 곳인데요. 이곳의 장점은 여기 자료들은 단순한 화면이 아니라 실제로 출시가 된 앱들의 화면이라는 점이에요.

A에어 BMB라든지 드록스라든지 한국 같은 경우라든지 이런 유명한 앱들도 많고 업계에서 검증된 앱들이라고 보시면 됩니다. 그리고 어 출시를 하고 어 사용자에게 사용이 되었다는 거 자체가 아 그냥 실험적으로 만들어 본 디자인과는 다르게 사용자에게 검증이 되었고 또 기술적으로 구현이 가능하다는 걸 의미하기 때문에 훨씬 더 의미가 큽니다. 아무리 예쁜 화면이라도 예를 들어서 드리블 같은 곳이 그러는 건데요. 여기는 시험적인 디자인이 굉장히 많은데 이게 실제로 사용자에게 사용성에 있어서 편리하게 구현이 되어 있고 또 OS 예를 들면 iOS나 안드로이드의 룰을 잘 잘 따르고 있느냐 하면 어 그렇지 않은 경우가 많습니다. 그래서 이렇게 실험적인 디자인 같은 경우는 아무리 멋지고 예쁘다고 해도 그게 실제로 어 판매할 수 있는 어 서비스가 될 수 있는 앱이냐 하면 또 그렇지 않은 경우가 많습니다. 그래서 이렇게 출시가 된 앱은 레퍼런스로 가치가 훨씬 큰 겁니다. 아무튼 모비는 이런 어 가치가 있는 앱 웹사이트인데요. 모인을 활용해 보고 싶은 분들은 댓글에 20% 할인 쿠폰이 있으니까요. 어 그거 참고하셔서 사용해 보시면 될 것 같아요. 여기에서 검색을 하는 것도 방법이지만 한 가지 훨씬 더 추천을 드리는 거는 바로 MCP를 활용하는 겁니다.

MCP를 활용하게 되면 내가 쓰는 코덱스나 클로드 코드가 바로 모빈에 접근해서 리서치도 하고 디자인 적용에 참고를 할 수 있는 거예요. MCP는 여기에 MCP 링크를 누르시면 되고요. 그다음에 내가 쓰는 어 툴를 누르시면은 어 어떻게 하는지 방법이 나옵니다. 저 같은 경우는 api.m.com/mcp이 부분을 카피를 하고요. 클로드 설정에 가면 커넥터가 있습니다. 커넥터에 추가를 누를 때 여기에다가이 링크를 넣으면 돼요. 그리고 이름은 여러분들이 원하시는 이름 뭐 모빈이나 뭐 모빈, MCP 이런 식으로 적으셔서 어 추가를 하면은 인증을 통해서 추가를 할 수 있게 됩니다. 그리고 제가 한 가지 더 한 거는 익스필드 MCP를 붙여 준 건데요. 클로드 같은 경우는 이미지 생성 모델이 없기 때문에 예를 들어서 제가 지금 만들고 있는이 iOS앱 어 AI 총무앱 같은 경우는 이미지들이 필요해요. 내가 대화를 하고 있는 상대방의 아바타라든지 이런 이미지가 필요한데 이걸 만들려면은 클로트 자체로는 만들 수가 없어요. 그래서 익스필드에 도움을 받았고요. 익스필드 연결은 여기 커넥트 익스필드를 누르시면 되고 어 여기서 컨티뉴를 누르면은 인증을 하고 여러분들의 클로드라든지 코덱스라든지 이런 데서 활용을 할 수가 있습니다. 그렇게 해서 어 두 번째 V2가 새로운 페이지에 만들어 줬습니다. 기존 버전 대비 이제 개선을 해서 만들어 준 거죠. 그리고 제가 보고서도 써 달라고 했는데 보고서에는 어떤 근거와 레퍼런스 어이 의사 결정이 되었는지 그리고 어 저 같은 경우는 실제 레퍼런스 이미지를 여기에 첨보해 달라고 했어요. 그리고 어떤 부분을 참고했는지는 이렇게 넘버링도 달아 달라고 했습니다. 그래서 이렇게 레퍼 레퍼런스가 나왔고요. 제가 별도로 요청을 한 거는 아닌데이 문서는음 [목을 가다듬음] 아티팩트에 있는 다큐먼트 이번에 다큐먼트 기능이 새로 나왔거든요. 어, 여기에 보고서를 만들어 줬더라고요. 참고로 클로드 덕 같은 경우는 HTML이 아니라서 어, 이렇게 수정도 가능하고 어, 약간 노션을 쓰는 그런 사용자 경험하고 되게 비슷합니다. 그래서 이렇게 두 번째 버전이 나왔고요. 그리고 마지막으로 어, 한 가지를 더 하고 싶었는데 어, 색을 전체적으로 지금 그린 톤을 쓰고 있어요. 그런데이 색을 사용하는게 전체적으로 강약을 어, 준 거 즉 임팩트를 실어 줘야 되는 곳에 어, 실어 주지 못하는 그런게 좀 있었거든요. 어 쉽게 말해서 전체적으로 약간 어 컬러감이 휘발리가 없는 힘이 없게 느껴지는 디자인이었어요. 그래서 브랜딩 컬러 어 디자인 시스템 컴퍼트 이런 것들도 모인을 활용해서 업데이트를 요청을 해 봤는데요. 브랜딩 컬러 디자인 시스템 컴퍼넌트도 모인 레퍼런스를 활용해서이 앱에 어울리는 걸로 업데이트 해 줘. 어 그리고 보고서를 써 줘. 이렇게 이야기를 했습니다. 그래서 브랜딩 시안을 만들어서 이렇게 올려 줬는데요. 그리고 보고서에는 각 시안이 어떤 레퍼런스를 활용한 건지 또 왜 활용한 건지 여기다 표시를 해 줬습니다. 어 저는 이제 레퍼런스를 쓰는게 정답은 아니지만 다른 관점에서 생각을 할 수 있도록 도와준다는 점에서 어 도움이 많이 되는 거 같아요. 그래서 레퍼런스를 쓸 때는 꼭 이렇게 어떤 레퍼런스를 썼는지 그냥 무지성으로 레퍼런스를 써 줘, 적용해 줘. 이렇게 하는게 아니라 어떤 레퍼런스를 썼는지 그리고 왜 썼는지도 알아내려고 하는 편입니다. 그래서 보고서를 요청을 하고 하는 거를 여러분들에게도 추천을 드리고요. 그래서 시안을 받아봤는데 첫 번째는 가족의 따산 뭐 이런 거를 감안했대요. 그래서 이렇게 따뜻한 컬러를 사용했다고 하 하는데 저는 어이 폰트를 쓴 것도 그렇고 어 조금 올드하다 이런 느낌이 들었어요. 그래서 다른 시안을 좀 봤고요. 어이 스티커라는 컨셉은 이렇게 약간 카툰 레퍼런스를 참고하더라고요. 그런데 재밌는게이 클러드도 본인이 이거를 만들긴 했는데 부분 차용을 권한다. 좀 가족들이 쓰기에는 너무 가벼운 거 같다. 이렇게 이야기를 했어요. 어, 저도 이게 그렇게 와닿지는 않았었거든요. 그래서이이 세 가지 중에서는 그래도이 가운데 있는 거 어,이 보라색 약간 청 청브라색을 메인 컬러로 쓴 어,이 시안이 조금 더 컨트레스트가 뚜렷하고 어, 강약이 좀 잘 보여지는 어, 그런 시안이라고 생각이 들었습니다. 그래서 이걸로 일단 진행해 보자고 이야기를 했고요. 그래서 최종적으로 다음과 같이 결과가 나왔습니다. 지금 보시면 이제 첫 번째 버전 아무런 레퍼런스랑 스킬을 쓰지 않은 버전이고요. 어, 두 번째는 기존의 컬러는 유지한 상태에서 모빈 레퍼런스를 활용하고 또 핵스피드 이미지를 써서 이런 아바타 이미지라든지 이런 필요한 일러스트레이션이라든지 이런 것들을 어 활용한 케이스예요. 어, 여기서는 사용성이 중점적으로 개성이 되었다고 보시면 되고요. 세 번째는 브랜딩이랑 컬러, 컴퍼넌트 이런 거까지 같이 업데이트가 된 거라고 보시면 돼요. 그래서 몇 가지 주요 화면들에 대해서 어 어떤게 개선이 잘 되었는지 그리고 여전히 아쉽거나 오히려 잘 안 된 지점들은 어떤게 있는지 살펴보면 좋을 것 같아요. 어 전 일단 클로드에서 만든 기본 디자인이 그래도 상대적으로 아스트라나 다른 GPT 모델보다 마음에 드는 부분이 하나 있었는데요. 어 폰트를 너무 작은 걸 쓰지 않는다는 거였어요. 어 제가 다른 영상에서 언급한 적이 있지만 GPT는 꼭 읽어야 되는 중요한 정보도 어 11이라든지 12라든지 정말 작은 폰트를 쓰고 있어서 가독성이 많이 떨어지는게 있었거든요. 그런데 오퍼스는 페이블이나 그래도 주요 정보들은 최소 13 이하로는 잘 안 쓰더라고요. 어 그래서 가속성은 훨씬 낫다라는 어 인상을 받았습니다. 어 그러면 몇 가지 화면들을 살펴보죠. 여기는 동의인데요. 이거는 어 쉽게 조금 설명을 드리자면 처음에 사용자가 채팅방에 들어가기 전에 AI가 참여를 한다는 것에 대해서 동의를 구하고 이제 참여를 하는 화면인데요. 1차 버전에서는 다 텍스트 정보가 나열만 되어 있고 조금 정보의 위계나 이런 것들이 즉 정리나 이런 것들이 덜 된 느낌이 있었어요. 우리가 디자인 기획을 하면은 이런 걸 생각을 해 봐야 되거든요. 사용자가 어떤 화면에 들어갔을 때 그렇게 오랜 시간을 머물진 않아요. 그래서 가장 핵심이 된 정보는 잘 보이도록 하고 어 읽힐 수 있게 해 줘야 되는데 그게 잘 안 되면 금방 이탈를 할 수가 있거든요. 그런데 개선된 버전에서는 일단 일러스트레이션을 사용한 부분이 좋았다고 생각이 들었는데이 [목을 가다듬음] 페이지에 대해서 아 이게 어떤 페이지구나라는 걸 이해할 수 있게 도와준 부분이 좋았고요.

AI가이 방 안에서 어떤 역할을 하는지에 대해서 기존처럼 작은 텍스트들을 나열하는게 아니라 핵심적인 텍스트를 중심으로 짧고 굵게 보여 준 것들이 좋았다고 생각이 들었습니다. 그리고 서브 텍스트로 추가적인 설명을 한 부분이 있었고요. 메인의 그 타이틀 텍스트도 원래는 제주 가는 여섯 이렇게 돼 있었는데 제주 가는 여섯이 방에 참여할까요라는 식으로 해서이 화면에서 나한테 어떤 행동을 원하는지를 정확하게 제시해 주는 것도 좋았다고 생각이 들었습니다. 하지만 아쉬운 부분들도 있었는데요. 메인 CTA가 지금 최종 버전에서 빨간색을 쓰고 있는데 다른 화면에서는 보라색 CTA를 쓴 경우도 있고 검색 CTA를 쓴 경우도 있더라고요. 저는 CTA는 특히 이런 메인 CTA 제일 중요한 버튼 같은 경우는 가능하면 색을 일관되게 쓰는게 중요하다고 말씀을 드립니다.

CTA 컬러가 일관되지 않고 또 CTA가 아닌 곳에도이 컬러가 쓰이면 사용자 입장에서는 헷갈릴 수가 있거든요. 그래서 이런 점이 아쉬웠는데 만약에 이게 실전 프로젝트 하면은 CD 컬러를 다른 요소들에는 쓰지 말라고 규칙을 만들거나 디젠다 MD나 아니면 CSS 컴포넌트를 구축할 때 규칙을 만면 좋을 것 같습니다. 그다음에 여기는 리스트 화면인데요. 1차 버전에서 2차 버전으로 가면서 어 다른 거는 뭐 크게 변경이 없었는데 유약 보기 기능 이런 걸 넣어 줬더라고요. 이거는 실렉에 있는 캐치업 기능에서 연감을 받았다고 하더라고요. 저는 아무래도 어 AI의 장점 중에 하나가 흩어져 있는 정보들을 나에게 맞춤형으로 갖다 주는 부분인 거 같은데 이런 거는 좋은 기능을 기획하고 추가해 줬다는 생각이 들었어요. 그리고 브랜드 컬러를 업데이트 하는 과정에서는 확실히 어 더 색감이 또렷해지고 한 부분이 좋았다는 생각이 들었는데 추가적으로 이런 새로운 메시지에 대한 수차 칩 요소는 어 일반적으로 우리가 빨간색 같은 걸 많이 쓰는데 어 이렇게 변경한 것도 좋았다고 생각이 들었습니다. 대화창에서는 이제 내가 다른 지인들과 대화를 하는 상황 속에서 필요에 따라 AI가 등장을 하는 건데 1차 버전에서 업데이트가 되어 가면서 날짜라든지 주요 정보들 되게 중요한 정보들이 컬러나 굵기를 달리다든지 또는 아바타 이미지를 활용한다든지 하면서 어 정보 전달이 더 쉽게 될 수 있도록 도와준 부분이 있어서요. 어 그래서 좋았다는 생각이 들었는데 이렇게 대화 내용이 많아진 경우 즉 이런 시나리오에 대해서는 좀 오히려 약간 복잡도가 올라가는 느낌도 있긴 했었어요. 실제로는 어떻게 작동이 되는지 보고 싶어 가지고이 화면 같은 경우는 프로토 타입으로 만들어 달라고 했어요. 프롬트는 어떻게 줬냐면은 실제 모든 걸 가능하게는 안 하더라도 어 친구들 AI랑 대화할 때 클로드 API가 되도록 해서 내가 실제로 앱을 사용하는 것처럼 구해내 줄 수 있어 어 이런게 가능할까 이렇게 물어봤거든요. 그런데 어 아티팩트에 샘플이라는 기능이 있어서 어 API 키나 이런 거 없이도 클로드 에이전트를 프로토타입에서 쓸 수 있도록 해 준다고 하더라고요. 어, 참고로 이거는 어, 제가 의도치 않게 알아는 기능이긴 한데 어, 되게 도움이 되는 기능이라고 생각이 들었습니다. 왜냐면 우리가 앱을 만들거나 서비스를 만들 때 이제 AI도 그 서비스 안에 등장이 되도록 하는 그런 시나리오를 짤 때가 많다 말이죠. 어, 그런데 이거는 제가 의도치 않게 건진 거여 가지고 여러분들한테 공유를 드립니다. 자, 여기 보면은 예를 들어서 킨리 우리 속도 어디로 사용했지 물어보면은 AI가 거기에 대해서 이제 답을 해 주는 부분이 있고요. 안녕. 이렇게 한번 보내보죠. 어디, 우리 어디까지 이야기했지? 이렇게 물어볼게요. 지인들한테 보내는 거죠. 네. 이거는 프로토타입에서 이렇게 AI가 실제로 작동이 되도록 해서 쓸 수 있게 해 주는 건 굉장히 좋았다고 생각 드렸어요. 이거는 의도치 않게 건진 거였습니다. 어, 그 지금 일정을 정해야 되는 그런 상황에서는 이게 지금 나왔어요. 어, 저장을 해 주고 예, 저장이 된 거 이렇게 나옵니다. 약간 버그도 좀 있긴 한데 그래도 어, 이거를 어떤 식으로 활용이 된지 확인하는데 좀 도움이 되는 거 같아요. 예, 이렇게 저장이 된 거는 확정된 페이지에서 볼 수가 있고요. 두 개의 화면 정도만 더 보면은 여기는 놓친 대바들을 이제 볼 수 있는 화면인데요.가 주요 정보들을 요약을 해 주는 화면이에요. 어 그런데 여기서는 기존 버전 대비 새로운 버전으로 가면서 이렇게 그냥 블랙포인트로 정보들을 나열한 거로 끝내는게 아니라이 중에서 정해진 거랑 정해지지 않은 거를 분류를 해서 이렇게 체크마크를 주거나 어 점선 표시를 해 준 부분도 좋았다는 생각이 들었고 그리고 아바타를 적절하게 활용해서 인물에 대한 정보는 더 빠르게 직관적으로 이해할 수 있게 도와준 부분도 좋았습니다. 그리고 기획적으로도 결정이 된 거, 결정을 해야 될 거 이런 것들도 이렇게 보여 주는게 아니라 실제로 여기서 바로 어, 행동 가능할 수 있게 칩으로 버튼으로 이렇게 넣어 주는 부분도 좋 기획적으로 좋았다고 생각이 들었습니다.이 화면은 결정된 것들 예를 들면 숙소가 결정됐으면 그런 정보를 보여준 화면인데 기존 버전은 약간 어, 노션 템플릿처럼 그냥 텍스트만 나열라는 느낌이 강한 반면에 버전이 올라가면서 확실히 어 시각적인 정보의 시각적인 그 위계가 위계 질서가 좀 더 생긴 느낌이 듭니다. 어, 이런 배경을 쓴다든지 또는 아바타를 쓴다든지 도형을 쓰고 어, 한 것들로 인해서 디테일하고 작은 것처럼 보일 수 있지만 사실 이런 것들이 모여서 사용자 입장에서는 정보를 더 빠르게, 더 어, 쉽게 터득할 수 있기 때문에 긍정적이라고 생각이 들었어요. 그렇게 해서 오늘 테스트는 여기까지데요. 어, 제가 밟은 프로세스가 모두 담긴이 아티팩트 문서는 댓글을 통해서 받아보실 수 있도록 할게요. 어, 버전 1부터 버전 3가 가기까지 과정이 다 담겨 있고 또 어, 브랜딩 시안이라든지 DN 시스템 이런 과정들이 다 당긴 거니까 여러분들이이 영상을 보시고 또 참고하고 싶다면 확인하시기 바랍니다. 그래서 오늘 테스트를하고 실습을 해 본 거를 좀 생각을 정리해 보면은 오퍼스가 아, 저는 기본 디자인도 어, 제 기대치가 너무 낮았어서 그럴 수도 있겠지만 생각보다 괜찮은 결과를 만들어 줬다는 생각이 들었습니다. 어, 다만 그거를 여전히 계산할 여지는 많이 있었고 레퍼런스를 활용하면서 어, 개선을 해 나가는 걸 볼 수 있었어요. 그리고 또 한편으로는 레퍼런스를 쓴다고 해서 완벽한게 아니고 또 레퍼런스 리서치도 어, 적절한 거를 찾지 못할 때도 있었어요. 아, 그런데 저는 레퍼런스가 있다는 거는 개선을 하는 것뿐만 아니고 어, 우리가 생각하고 있는 관점을 좀 전환하고 다른 관점에서이 문제를 또 바라볼 수 있도록 어, 도와준다는 측면에서 도움이 많이 되는 거 같아요. 즉 우리에게 생각해 볼 수 있는 건덕지를 준다는게 가장 큰 장점이라고 생각 합니다. 그래서 오늘 본 영상을 통해서 여러분 여러분들이 또 모빈이라든지 레퍼런스를 활용할 때 도움이 조금이라도 될 수 있으면 좋겠고요. 제가 서비스를 하나 런칭하게 되어서 공유를 드립니다. 바로 AI 디자인이 맞는 걸 블라인드로 테스트하는 서비스인데요. 어 AI 모델이 참 많습니다. 아 저렴한 모델도 있고 가격이 높은 모델도 있는데 이게 디자인 능력이 모델마다 다르고 장단점도 다른 거 같아요. 그래서 이런 거 소비자들이 직접 테스트하고 그 통계에 대해서도 알 수 있어서 합리적인 결정을 할 수 있는 서비스가 있으면 좋겠다는 생각이 들었어요. 사용 방법은 간단한데요. 어, 여러 가지 테스트 케이스가 있어서 어, 선택을 하시고 그러면 동일한 프랑프대에서 만들어진 두 모델의 디자인을 볼 수가 있고 또 써 볼 수가 있어요. 그러면 여러분들이 마음에 드는 걸 선택하시면 그다음에 어떤 모델이 맞는 건지 알 수가 있습니다. 어, 그리고 아직 지금 단계에서는 없는데 어, 이게 어느 정도 투표가 쌓이면은 리더보드라든지 투표율이 높은 모델에도 공개를 해서 어, 소비자들이에게 좀 도움이 되는 정보를 주고자 합니다. 그래서 관심 있는 분들은 댓글에 링크를 달아줄테니까 많이 참여해 주시기 바랍니다. 어, 사이트는 bl블 blind choice. 여기에서 여러분들이 테스트를 선택하고 이런 식으로 여러분들이 써 본 다음에 어떤게 좋았는지 선택을할 수가 있는 어, 서비스입니다. 지금까지 영상 시청해 주셔서 감사합니다.