(DAY45) AI를 활용한 디자인 프로세스 수행 (실습)

 

안녕하세요 :) 이번주부터 겨울이 찾아왔습니다.❄️

요즘 아침형 인간인데 너무 춥더라구요.. 독감도 유행이니 감기 조심하시길 바랍니다.

오늘 AI로 만든 영화 [나야, 문희]를 보는 경험을 했는데요, 충격적이었습니다.

 

 

---

 

 

 

✏️오늘의 학습

AI와 디자인 프로세스 되짚어보고 AI 활용에 대한 내 생각 정의해보기

실습 ) 디자인 프로세스 AI활용하여 결과물 뽑아보기

 

 

📖 오늘의 핵심

인간은 그리는 작업에 시간을 보내기 보다는, (그리는건 AI 역할로 변화됨)

이제는 더 좋은 UX, 확장된 UX를 고민하는데 시간을 써야 한다. 

 

 

 

🧠오늘의 마인드셋

방해를 어떻게 처리하는가, (말을 가로채는 방해, 대화주제와 관련 없는 이야기로 방해 등에 대해서)

방해에 대해 처음부터 공격적일 필요는 없다.

당신이 느끼는 감정을 먼저 인정하라. 그리고 할 말을 해라.

 

 

🤖AI 마인드셋

AI를 사용한다는게 단순히 검색엔진을 사용한다는 것이 아니라,

다양한 관점을 제시하주는 파트너로써 사용하는 것이라고 생각하자.

 

 

 

📝수업 내용 메모장 👇🏻

📝 수업 내용 메모장

 

AI와 디자인 프로세스 기업 사례 보기

디자이너 김지현

- AI 아트 디자이너

https://heypop.kr/n/66786/

AI로 만드는 또 다른 세계, 디지털 디자이너 김지현

 

 

롯데백화점

- 미드저니 활용하여 광고를 뽑아냄

 

 

랜드로버

- 광고 영상

- 미드저니, 런웨이 활용

- 자동차랑 배우 근접샷만 촬영하고 나머지는 ai를 활용한 합성이라고 한다.

https://youtu.be/KnV-OJbi0nQ?si=L3yWfFdJmXfwwIgL

 

cj영화 사례, 엠호텔

- ai로 만든 7분짜리 단편 영화

- 2024년 12월 개봉작

- 4명이서 한 달동안 작업해서 제작했다고 함

 

 

 

 

바이블 코딩 (= 바이브 코딩)

- 대화형 자연어 인터페이스를 활용하여 소프트웨어를 개발하는 새로운 방식

- 디자이너와 개발자 사이의 경계가 허물어지면서 UI를 빠르게 구현해낼 수 있는 방법

 

 

 자연어 코딩 도구의 등장

- 디자이너-개발자 경계의 변화가 이루어지고 있다.

- 요즘 개발자들 'Curcor' 툴을 많이 쓴다고 한다.

 

프롬프트 엔지니어링

자연어 코딩 도구 등장 장점

- 향상된 워크 플로우

- 빠른 출시가 가능함

- 원활한 소통

- 사용자 피드백 반영

→ 디자이너가 혼자서 작업하는 스타트업의 경우 이러한 툴을 활용하여 mvp정도는 테스트해볼 수 있는 환경이 되었다.  

 

 

 

AI를 통한 디자인 프로세스 (AI를 활용할 수 있는 부분 위주)

1) 문제 정의 및 리서치

- UX 이슈 발견과 사용자 니즈 파악을 위한 조사

2) 아이디어 도출

- AI를 활용한 창의적 솔루션 발상

3) 와이어프레임 구성

- 시각적 구조와 인터페이스 설계

4) 피드백 분석 및 개선

- 사용자 의견을 반영한 디자인 개선

5) 결과 정리

- 프로세스와 결과물의 효과적인 정리

 

 

 

 

 

 

AI에 대한 관점, 태도 포지셔닝해보기

EO 스탠포드 창의성 전문가가 알려주는 AI시대에 창의적인 인간으로 살아남는 방법

https://www.youtube.com/watch?v=wv779vmyPVY

영상 내용 요약

- ai에게 질문하기보단 ai가 내게 질문하게 만들어라.

- 내가 팀장이고 AI가 하나의 팀원이라고 생각하고 "이 문제에 대해 어떤 질문을 해야 할까?" 등으로 활용해라.

- "당신은 AI전문가시군요. AI전문가로서 제 업무의 흐름, KPI를 가르쳐주세요"

- '실현 격차' 라는 단어가 나옴 → 실제로 ai사용이 엄청 늘었지만, 막상 ai 활용하여 의미있는 생산성을 낸 사람은 ai 사용한 직장인의 10%도 안된다. 이걸 '실현 격차'라고 표현함.

= ai 활용이 창의성을 떨어뜨린다. 라고 주장함.

 

 

 

---

+ 프롬프트 엔지니어링 관련 아티클

https://yozm.wishket.com/magazine/detail/2818/

UX 디자이너를 위한 ‘프롬프트 엔지니어링’ 방법 6가지 | 요즘IT

 

 

 

 

실습 ) 디자인 프로세스 AI활용하여 결과물 뽑아보기

 

 [최종과제]
- AI 툴을 활용하여 특정 서비스/제품의 와이어프레임(Wireframe)을 제작합니다. 이번 과제는 단순 아이디어 제안 단계에서 더 나아가, 실제 사용자 경험을 고려한 구조적 설계까지 시도하는 것을 목표로 합니다.
- AI를 활용하여 아이디어 발산 및 구체화 경험하기
- 화면 단위의 정보 구조(Information Architecture)와 사용자 흐름(User Flow) 설계하기

수행 방법
1. 주제 선정
    - 본인이 관심 있는 서비스/앱을 선정하거나, 기존 프로젝트를 확장해도 무방합니다.
2. 아이디어 도출 (AI 활용)
    - ChatGPT, Perplexity, Gemini 등 AI를 활용하여 기능 아이디어를 구체화합니다.
    - “사용자가 자주 겪는 문제점 → 해결 방안 → 화면 단위 기능”으로 정리합니다.
3. 와이어프레임 제작
    - AI 이미지/디자인 툴을 활용해 와이어프레임을 생성합니다.
    - 직접 수정·보완하여 최종 와이어프레임을 완성합니다.
4. 최종 제출물
    - (1) 서비스/앱 주제 및 문제 정의
    - (2) AI를 통한 아이디어 발산 과정 캡처/정리
    - (3) 와이어프레임 결과물 (figma 링크)

 

 

 

실습 결과물 캡쳐

 

클로드 결과물 캡쳐

 

 

 

1) lovable AI로 뽑은 결과물

Hi-Fi quality로 뽑아줌...ㄷㄷ

링크 들어가면 직접 버튼 눌러볼 수 있어요👇🏻

https://tailor-ai-wardrobe.lovable.app/onboarding

08fb6361-81d8-457d-bc88-e0925b6f22d5

 

 

 

 

 

 

2) Stitch AI 활용한 결과물

 

 

 

💡 그동안 배운 프레임워크들을 활용한 프롬프트로 이만큼의 퀄리티까지 뽑아낼 수 있다는 사실이 놀라웠다.

총 40분정도 밖에 안걸렸다! 이제는 정말 개인 AI비서 하나씩은 갖고 있는 시대로 바뀌었다는 것을 체감한 날이었다.