본문 바로가기

분류 전체보기33

디자인 시스템 실무! 디자인 토큰이란? 안녕하세요, 게으른 사부작이입니다! 오늘은 디자인 시스템의 조금 더 심화된 개념, 바로 디자인 토큰에 대해 이야기해보려고 해요. 디자인 토큰은 처음 들었을 때 좀 어렵게 느껴졌지만, 알고 나니 디자이너와 개발자 모두에게 정말 유용한 도구라는 걸 알게 됐어요. 저도 처음엔 이 개념 때문에 머리가 아팠던 경험이 있어서, 오늘은 그 이야기를 공유하면서 쉽게 풀어볼게요. 그럼 저와 함께 디자인 토큰의 세계로 들어가 볼까요? 개발자가 '토큰' 얘기할 때마다 머리가 아팠어요제가 디자인 공부를 시작하고 처음 팀 프로젝트를 할 때의 일이에요. UI 디자인을 열심히 만들고 개발자에게 넘겼는데, 개발자가 "이 버튼 색상은 토큰으로 정의했나요?"라고 물어보더라고요. 저는 "토큰이 뭐지?" 하면서 당황했죠. 개발자는 또 "색.. 2025. 4. 10.
디자인 시스템 실무! 아이콘과 이미지 활용법 안녕하세요, 게으른 사부작이입니다! 오늘은 디자인 시스템에서 빠질 수 없는 요소, 바로 아이콘과 이미지 활용법에 대해 이야기해보려고 해요. 아이콘과 이미지는 UI에서 정보를 빠르게 전달하고, 디자인을 더 돋보이게 하는 데 큰 역할을 하죠. 하지만 잘못 사용하면 오히려 디자인이 망가지기 쉽더라고요. 저도 시행착오를 겪으면서 배운 게 많아서, 오늘 그 경험을 공유해 볼게요. 그럼 저와 함께 아이콘과 이미지를 효과적으로 활용하는 법을 알아볼까요? 아이콘이 너무 커서 망한 디자인을 본 적이 있어요제가 처음 앱 UI를 만들 때의 일이에요. "좋아요" 버튼에 하트 아이콘을 넣으려고 무료 아이콘을 다운로드하여서 추가했는데, 아이콘이 너무 커서 버튼이 터질 것 같았어요. 심지어 다른 화면에서는 "설정" 아이콘이 너무 .. 2025. 4. 10.
디자인 시스템 실무! 컴포넌트 기반 디자인의 이해 안녕하세요, 게으른 사부작이입니다! 오늘은 디자인 시스템의 실무에서 정말 유용한 개념, 바로 컴포넌트 기반 디자인에 대해 이야기해보려고 해요. 저는 디자인 공부를 시작하면서 반복 작업에 지칠 때가 많았는데, 컴포넌트라는 개념을 알고 나니 작업이 훨씬 효율적이 됐어요. 여러분도 반복적인 디자인 작업에 지친 적 있지 않나요? 그럼 저와 함께 컴포넌트 기반 디자인의 세계로 들어가 볼까요? 버튼 하나를 10번 그리기 귀찮았던 적, 저만 그런가요?제가 처음 앱 UI를 만들 때의 일이에요. 로그인 화면, 회원가입 화면, 설정 화면 등 여러 페이지에 "확인" 버튼이 필요했는데, 매번 버튼을 새로 그렸어요. 크기, 색상, 모서리 둥글기를 일일이 맞추다 보니 시간이 너무 오래 걸리더라고요. 심지어 한 페이지에서 버튼 색.. 2025. 4. 10.
디자인 시스템 실무! 타이포그래피 시스템 구축하기 안녕하세요, 게으른 사부작이입니다! 오늘은 디자인 시스템의 중요한 요소 중 하나인 타이포그래피 시스템을 어떻게 구축하는지 알아보려고 해요. 타이포그래피, 즉 글씨체는 디자인에서 정보를 전달하는 데 정말 큰 역할을 하죠. 저도 처음엔 글씨체의 중요성을 잘 몰랐는데, 한 번 경험해보고 나니 완전히 달라지더라고요. 그럼 저와 함께 타이포그래피 시스템을 구축하는 법을 배워볼까요? 폰트 하나 바꿨을 뿐인데 디자인이 달라 보이더라고요제가 디자인 공부를 시작하고 처음 개인 프로젝트를 할 때의 일이에요. 앱 UI를 만들면서 기본 폰트를 Arial로 설정했는데, 뭔가 밋밋한 느낌이 들더라고요. 그래서 "폰트를 바꿔볼까?" 하고 무료 폰트인 Noto Sans로 바꿨더니, 와! 디자인이 완전히 달라 보였어요. 같은 내용인데.. 2025. 4. 9.
디자인 시스템 실무! 컬러 팔레트 설계하기 안녕하세요, 게으른 사부작이입니다! 오늘은 디자인 시스템의 실무적인 첫걸음, 바로 컬러 팔레트 설계에 대해 이야기해보려고 해요. 색상은 디자인에서 가장 먼저 눈에 띄는 요소라 정말 중요하죠. 저도 처음 디자인을 배울 때 색깔 때문에 고생한 적이 많아서, 오늘 주제가 더 와닿네요. 그럼 저와 함께 컬러 팔레트를 설계하는 법을 알아볼까요?색깔 하나 잘못 골랐다가 상사한테 혼난 적이 있어요. 여러분은요?제가 디자인 공부를 시작하고 처음 팀 프로젝트를 했을 때의 일이에요. 앱 UI를 만들면서 "이 버튼은 빨간색으로 하면 눈에 띄겠지!" 하고 자신 있게 제안했는데, 상사한테 혼났어요. 이유는 빨간색이 "경고"나 "삭제" 같은 부정적인 느낌을 주는데, 저는 "확인" 버튼에 썼던 거예요. 사용자 입장에서는 "이 버튼.. 2025. 4. 9.
디자인 시스템 구글과 애플 사례 분석 안녕하세요, 초보 블로거입니다! 지금까지 디자인 시스템의 기본 개념부터 핵심 구성 요소까지 차근차근 알아봤어요. 이제는 이론을 넘어 실제 사례를 통해 더 깊이 이해해 볼 차례예요. 여러분, 구글과 애플의 앱을 보면 뭔가 다르다는 느낌 안 드시나요? 저는 처음엔 "왜 이렇게 느낌이 다를까?" 궁금했는데, 그 비밀을 풀어보니 바로 디자인 시스템 때문이더라고요. 오늘은 구글의 Material Design과 애플의 Human Interface Guidelines를 비교하면서 그 차이와 특징을 알아볼게요. 준비되셨나요? 구글과 애플의 앱을 보면 뭔가 다르죠? 그 비밀을 풀어봤어요저는 평소 구글 앱(예: Gmail)과 애플 앱(예: 노트)을 자주 쓰는데, 항상 미묘한 차이를 느꼈어요. 구글 앱은 뭔가 따뜻하고 입체.. 2025. 4. 9.