TechUnion

AI × 디자인 대표 글

AI 시대의 웹 디자인 - 생성형 도구와 디자인 시스템

시안을 몇 초 만에 뽑아 주는 AI 시대에 왜 디자인은 더 어려워졌는가. 자사 홈페이지를 직접 만들며 정리한 디자인 시스템의 역할과 사람의 몫.

테크유니온 5분 읽기

시안 하나 뽑는 데 디자이너가 하루를 쓰던 시절이 있었습니다. 지금은 프롬프트 한 줄이면 몇 초 만에 그럴듯한 화면이 나옵니다. 그렇다면 디자인은 쉬워졌을까요?

저희 경험으로는 정반대입니다. 시안이 공짜가 되면서, 디자인에서 정말 어려웠던 부분이 무엇이었는지가 오히려 선명해졌습니다.

시안의 가격이 0원이 되었을 때 생기는 일

생성형 AI로 웹 디자인 시안을 뽑아 보면 두 가지를 느끼게 됩니다. 첫째, 놀랍도록 그럴듯하다. 둘째, 어딘가에서 본 것 같다.

당연한 결과입니다. AI는 세상에 이미 존재하는 디자인의 평균을 학습했으니까요. 그래서 AI 시안에는 공통의 냄새가 있습니다. 유행하는 폰트, 흰 배경 위 보라색 그라디언트, 어디서나 본 카드 레이아웃. 하나만 보면 세련됐는데, 열 개를 나란히 놓으면 구분이 안 됩니다.

시안 생산이 공짜가 된 세상에서 "그럴듯한 화면"은 더 이상 경쟁력이 아닙니다. 모두가 그럴듯하기 때문입니다. 경쟁력은 다른 곳으로 이동했습니다.

어려운 건 화면이 아니라 '체계'였다

저희가 자사 홈페이지를 만들 때의 이야기입니다. 개별 화면을 만드는 일은 어렵지 않았습니다. 어려웠던 것은 그 전에 내려야 했던 결정들이었습니다.

색은 흑백과 회색만 쓰기로 했습니다. 로고에 브랜드 색이 있음에도 화면에서는 절제하기로 한 결정입니다. 본문 글자 크기는 18픽셀로 고정했습니다. 보기 좋은 크기가 아니라 읽기 편한 크기를 기준으로 삼은 것입니다. 제목용 대형 타이포는 화면 크기에 따라 부드럽게 줄어들도록 규칙을 정했고, 버튼·입력창·카드 같은 부품은 한 벌의 컴포넌트로 통일했습니다.

이런 결정의 묶음을 디자인 시스템이라고 부릅니다. 그리고 이것이 AI 시대에 더 중요해진 이유는 단순합니다. AI는 화면을 만들어 주지만, 결정을 내려 주지는 않기 때문입니다.

디자인 시스템이 있으면 AI는 좋은 도구가 된다

디자인 시스템이 없는 상태에서 AI에게 화면을 맡기면, 페이지마다 조금씩 다른 사이트가 만들어집니다. 버튼 모서리가 페이지마다 다르고, 회색이 세 종류쯤 섞여 있고, 어떤 페이지는 명조체 감성인데 어떤 페이지는 고딕체 감성인 사이트. 하나하나는 문제가 아닌데 합쳐 놓으면 신뢰가 무너집니다. 방문자는 이유를 설명하지 못한 채 "뭔가 어설프다"고 느끼고 떠납니다.

반대로 시스템이 먼저 서 있으면 이야기가 달라집니다. 색상 토큰, 타이포 규칙, 컴포넌트 규격이 정해져 있으면 AI에게 "이 규칙 안에서" 만들게 할 수 있습니다. 그 순간 AI는 일관성을 해치는 도구에서 일관성을 지키며 속도를 올려 주는 도구로 바뀝니다. 저희가 내린 결론은 이렇습니다. AI 시대의 디자인 작업 순서는 "화면을 뽑고 규칙을 찾는" 것이 아니라 "규칙을 세우고 화면을 뽑는" 것이어야 한다는 것.

사람에게 남는 일 - 취향이 아니라 판단

그럼 디자이너는 무엇을 하게 될까요. 저희는 세 가지가 남는다고 봅니다.

첫째, 정체성의 결정. 우리 회사가 어떻게 보여야 하는가는 데이터의 평균으로 답할 수 없는 질문입니다. 저희가 모노크롬을 택한 것은 그것이 유행이어서가 아니라, 기술 회사로서 "요란함 없이 정확한" 인상을 주고 싶었기 때문입니다. 이런 결정은 회사의 방향을 아는 사람만 내릴 수 있습니다.

둘째, 읽는 사람에 대한 책임. 글자가 충분히 큰가, 색 대비가 충분해서 밝은 야외에서도 읽히는가, 애니메이션이 멀미를 유발하지 않는가. 접근성이라 불리는 이 영역은 화려함과 자주 충돌하는데, AI는 화려한 쪽으로 기울어져 있습니다. 사용자 편에 서서 브레이크를 밟는 것은 사람의 일입니다.

셋째, 덜어내는 판단. AI는 채우는 데 능하고 비우는 데 서툽니다. 섹션을 하나 더 추가하는 제안은 잘하지만, "이 페이지에서 이 요소를 빼야 메시지가 산다"는 판단은 잘 못합니다. 좋은 디자인의 절반은 무엇을 넣지 않을지 결정하는 일입니다.

정리

AI는 웹 디자인에서 '그리기'의 비용을 없앴습니다. 남은 것은 정체성을 정하고, 체계를 세우고, 사용자를 대변하고, 덜어내는 일 - 원래 디자인의 핵심이었던 판단의 영역입니다. 시안이 공짜가 될수록 판단은 비싸집니다.

웹사이트 구축이나 리뉴얼을 앞두고 있다면, "어떤 화면을 만들까"보다 "우리의 규칙은 무엇인가"부터 정리해 보시길 권합니다. 그 정리가 어렵다면 저희가 함께할 수 있습니다.

자주 묻는 질문

AI 디자인 도구만으로 회사 홈페이지를 만들어도 되나요?

소규모 사이트라면 가능합니다. 다만 페이지가 늘어날수록 일관성 문제가 드러나고, 브랜드 정체성과 접근성은 도구가 챙겨 주지 않습니다. 도구로 시작하더라도 색·타이포·컴포넌트 규칙을 먼저 한 장으로 정리해 두면 결과가 크게 달라집니다.

디자인 시스템은 대기업에나 필요한 것 아닌가요?

반대입니다. 디자인 인력이 부족한 회사일수록 규칙의 힘이 큽니다. 결정을 매번 새로 내리지 않아도 되기 때문입니다. 색상 몇 개, 글자 크기 두세 단계, 버튼 한 벌만 정해도 훌륭한 출발점입니다.

AI 시안을 그대로 개발에 넘기면 왜 문제가 되나요?

AI 시안은 '그림'이고 실제 웹은 '동작하는 구조'입니다. 반응형 동작, 로딩 상태, 에러 화면, 키보드 조작 같은 상태들이 시안에는 없습니다. 이 간극을 메우는 설계 없이 개발로 넘어가면 비용이 뒤에서 터집니다. 자세한 내용은 이 클러스터의 "AI가 만든 시안, 그대로 써도 될까" 편에서 다룹니다.

접근성을 지키면 디자인이 밋밋해지지 않나요?

제약은 오히려 스타일을 만듭니다. 저희 홈페이지의 모노크롬·큰 본문 디자인도 접근성 제약을 출발점으로 삼은 결과입니다. 밋밋함은 접근성 때문이 아니라 정체성 부재에서 옵니다.

비슷한 고민을 하고 계신가요?

기획부터 개발·운영까지, 어느 단계에서든 함께할 수 있습니다.

문의하기