🥸 제품 사진과 디바이스에 최적화된 AI 목업 생성 서비스!

📝 이번 주제는 '목업'이에요.

이번 주제는 디자인 과정에서 빠질 수 없는 목업(Mockup)입니다. 목업은 실제 디자인이 완성되기 전에 웹, 앱, 포스터, 제품 등 다양한 디자인 결과물이 실제로 어떻게 보일지 예측할 수 있게 하는 역할을 하죠. 디자인의 컨셉과 디테일을 생생하게 보여줄 수 있기 때문에 포트폴리오나 프레젠테이션 상황에서 효과적인 도구입니다.

하지만 목업을 제작하기 위해서는 시간과 리소스가 많이 소요되고, 디바이스별 해상도나 애니메이션을 추가할 때는 작업이 더 복잡해지기도 해요. 특히 고급 툴이나 3D 목업을 다룰 때는 학습이 필요하죠. 그래서 이번 뉴스레터에서는, 간단히 목업을 제작할 수 있는 AI 툴을 소개하려 합니다.

👀 오늘 소개할 서비스와 내용

이미지만 업로드하면, 원하는 컨셉의 제품 사진을 생성할 수 있는 Flair

제품 사진 촬영을 돕는 아르바이트를 잠깐 한 적 있어요. 뷰티 제품이었는데, 정해진 컨셉에 따라 사진을 촬영하고 편집하는 과정이 신기하기도 했지만, 정말 많은 시간을 필요로 한다는 것을 알게 되었는데요. 만약 제가 같은 업무를 한다면, 제품과 잘 맞는 배경이나 분위기를 연출하는 게 가장 까다롭고 어렵게 다가올 것 같아요.

다행히(?) 최근에는 이미지만 업로드해 원하는 분위기에 따른 배경 등을 손쉽게 생성할 수 있는 서비스를 쉽게 접할 수 있는데요. 오늘 소개할 ‘Flair’ 역시 AI(인공지능)와 템플릿을 활용해 전문적인 촬영, 편집 기술이 없어도 그럴듯한 제품 사진을 얻을 수 있도록 도와줘요.

주요 기능과 특징

(1) 제품 업로드 → 장식 적용 → 배경 적용 → 생성하기 

‘Flair’의 사용방법은 크게 네 가지 단계로 나눌 수 있어요. 첫 번째 단계는 ‘제품 선택 및 업로드’인데요. 

학습을 위해 기본 제공되는 9개의 제품 중 하나를 선택하거나, 직접 제품 이미지를 업로드할 수 있어요. (업로드 후, 위치나 크기 등은 수정 가능)

제품을 정했으면, 이제 장식을 적용할 차례예요. 장식에 해당하는 이미지를 직접 등록하거나 등록된 것을 검색 또는 선택해 추가할 수 있어요.

이대로 생성하는 것도 가능한데, 템플릿을 선택해 제품 사진을 생성하는데 필요한 레퍼런스로 활용할 수 있어요. 재밌는 건, 제품 이미지를 생성하는 단계에 따라 프롬프트가 계속 변경된다는 점인데요. 예를 들어 템플릿을 적용하기 전과 후의 프롬프트를 보면 아래와 같이 달라진 걸 알 수 있어요.

제품, 장식, 템플릿(레퍼런스)까지 선택한 뒤 생성 버튼을 눌러 최종 확인한 모습이에요. 이 정도 퀄리티의 제품 이미지를 만드는 게 걸리는 시간은 대략 2분 남짓이었어요.

이번에는 제가 직접 의자 사진을 올리고, 배경을 지운 뒤 화분을 추가해 생성한 이미지의 모습이에요. 의자 다리가 애매(?)하게 걸쳐있긴 하지만 이 모든 과정을 알아서 진행해 주니 정말 편리하고 효율적인 작업이 가능하다는 생각이 들었어요.

(2) 프롬프트 빌더의 활용

앞서, 이미지를 만드는 단계에 따라 프롬프트를 자동으로 생성한다는 이야기를 했는데요. 역으로, 최종 프롬프트를 빌더를 활용해 수정하는 기능도 제공하고 있어요. 프롬프트를 직접 수정하게 되면 일정한 규칙을 어기게 되고, 그럼 결과에도 영향을 줄 수 있기에 위치, 배경, 소품 등 제품 사진을 구성하는 요소에 따라 쉽게 수정할 수 있도록 도와주고 있어요. 게다가, 실시간 생성 기능을 제공해 변경된 프롬프트에 따른 결과는 어떤 모습인지를 빠르게 확인할 수 있다는 점 또한 매력적이에요. 

좋은 점

아쉬운 점

학습 난이도 ⭐️⭐️

가격 정책

Flair 바로가기

같은 프롬프트로, 미드저니를 활용한다면?

앞서 활용한 프롬프트를 미드저니에서 그대로 활용해 봤어요. 두 개의 이미지를 생성했는데요.

‘Flair’를 통해 확인한 프롬프트를 미드저니에서 활용하면서 '프롬프트'를 어떻게 작성하고 활용해야 하는지에 대한 이해도가 높아졌다는 걸 알게 되었는데요. 저처럼 아직 미드저니를 잘 활용하지 못하는 초보자라면, ‘Flair’의 프롬프트 빌더를 통해 생성한 내용을 적극적으로 쓰기 좋겠다는 생각도요. 아무래도 처음부터 원하는 내용을 쓰기엔 어떻게 작성해야 하는지에 대한 어려움이 있기 때문이에요. 

AI 툴, 실무 활용 방법 함께 스터디해요! (PH 클럽 2기)

PH 클럽은 ‘업무 효율을 높일 수 있는 AI 툴을 함께 스터디하는 모임’입니다. 업무에 도움을 받을 수 있는 AI 툴(생성형 AI, LLM 등)을 다양한 관점에서 비교 분석해요. AI를 활용해 업무 생산성을 높이는 방법을 함께 고민하고 탐구하는 데 중점을 두고 있어요.

‘PH’는 ‘프로덕티비티 해킹(Productivity Hacking)’의 약자예요. ’프로덕티비티 해킹’은 업무 효율을 극대화하는 전략을 말하는데요. 불필요한 작업을 줄이고, 중요한 일에 집중하기 위해 다양한 도구와 기술을 활용하는 것이 핵심이죠.

🍒 무엇을 얻을 수 있나요?

😎 이런 분들이 오시면 좋아요

PH 클럽 2기에 대해 더 궁금하시다면! 아래 링크를 통해 상세 내용을 확인 후, 신청해주세요. 신청은 11월 27일 수요일까지 진행됩니다. 

PH 클럽 2기 자세히보기

고퀄 디바이스 목업을 초스피드로! Rotato

두 번째로 소개할 툴은 Rotato입니다. Rotato를 사용하면 간단한 작업으로도 사실적인 3D 디바이스 목업을 빠르게 만들어낼 수 있어요. 랜딩 페이지나 포트폴리오를 만들 때 원하는 디바이스와 각도에 맞는 목업을 찾고 만드는데 많은 시간과 리소스를 들이는데요, Rotato를 사용하면 이 과정이 너무 쉬워집니다.

주요 기능과 특징

위 이미지는 제가 Rotato를 활용해 간단히 만든 이미지예요. 그럼 툴의 주요 기능과 특징을 알아볼까요?

Rotato는 목업에 꼭 필요한 핵심 기능만을 갖추고 있어요. 최신 디바이스 모델, 그림자와 카메라 속성, 배경 설정, 렌더링 옵션 등 같은 기본 기능을 간단히 사용할 수 있는데요. 쉽게 말해, 3D 모델링 툴의 목업 버전이라고 생각하시면 이해가 쉬울 거예요.

그럼 제작 과정을 볼까요? 먼저 Figma AI에게 'A homepage for winter travel'를 만들어달라고 요청했습니다. 그리고 Ratato의 우측 패널 중앙의 Device 섹션에서 기본 설정된 iPhone을 MacBook으로 변경했어요. 이후 생성한 이미지를 불러와 각도와 배경 색상을 세팅한 후, 최종 이미지로 추출했어요.

저에게는 특히 Rotato의 애니메이션 생성 기능이 돋보였어요.

애니메이션을 만드는 방법은 간단한데, 원하는 각도를 설정한 후 툴 하단의 +Add animation 버튼을 클릭해 포지션 키를 지정하면 돼요. (위 이미지처럼 우측 패널을 보면 설명 영상을 볼 수 있는 곳이 있어요!) 실제로 사용해보니, 간단한 조작만으로도 고퀄리티 영상을 빠르게 만들 수 있어 놀라웠어요. 여기에 모션뿐 아니라 디바이스 화면 내에서 이미지를 스크롤할 수 있는 기능도 있어 큰 히어로 이미지가 목업을 꽉 채우는 경우, 하단의 콘텐츠까지 자연스럽게 보여줄 수 있었어요.

제가 만든 영상은 👉 여기를 클릭해 확인해 보세요!

좋은 점

아쉬운 점

학습 난이도 ⭐️

After Effect 등 영상 툴과 기본적인 UX가 동일해요.

가격 정책

Rotato 바로가기

🤔 지금까지 소개된 툴 쉽게 확인하기!

디렉토리에는 뉴스레터에서 소개한 툴을 주요 내용에 따라 정리해두었으니 함께 살펴보세요!

업무 단계별 AI툴 살펴보기

✍️ 이번 뉴스레터는 어땠나요?

오늘 뉴스레터를 시작으로 앞으로도 AI를 업무에 어떻게 적용하면 좋을지? 보다 효율적으로 AI를 활용하는 방법은 무엇인지?에 대한 내용을 전해드릴게요. 남겨주신 피드백은 더 나은 뉴스레터를 위해 소중하게 활용하겠습니다! (다음 주제에 대한 제안도 가능해요!)

구독자님의 의견을 들려주세요!

팁스터 뉴스레터의 공식 오픈채팅방에 참여해보세요!

팁스터 뉴스레터에서는 프로덕트와 관련된 다양한 주제의 콘텐츠를 발행하고 있어요!

멤버십 콘텐츠 중 '캠핑'편은 무료로 체험하실 수 있어요!