커스터마이징이란?
고객이 제공된 디자인 레이아웃 UI/UX 코드를 자신의 기호에 맞게 직접 수정하고 업데이트할 수 있는 맞춤 제작 서비스입니다.
UI/UX 커스터마이징
텍스트만 수정하는 것은 비교적 간단하지만, 전문가가 아니라면 스타트업풀이 제공하는 UI/UX 코드에서 텍스트 크기, 색상, 배경 색, 레이아웃 배치, 크기 등을 수정하는 것은 어려운 과정일 수 있습니다.
이를 위해 초보자도 쉽게 수정 및 업데이트할 수 있도록, 고객이 원하는 스타일에 맞춰 커스터마이징할 수 있는 가이드를 제공하고 지원합니다.
Tailwind CSS
스타트업풀에서 제공하는 모든 디자인 리소스(이메일 템플릿 제외)는 Tailwind CSS 라이브러리를 사용하여 제작되었습니다. Tailwind CSS는 유연한 유틸리티 기반의 CSS 프레임워크로, 클래스명을 활용해 코드에 손쉽게 디자인을 적용할 수 있습니다.
이메일 템플릿의 경우, 인라인 스타일을 적용해야 하므로 Tailwind CSS를 사용하지 않고 인라인 스타일로 작성되었습니다. 이는 이메일 클라이언트의 호환성을 보장하기 위한 조치입니다.
<div class="max-w-7xl w-full mx-auto p-4 bg-white dark:bg-[#1E2028]">
코드에 나타난 클래스 속성들은 해당 요소의 디자인 또는 레이아웃에 적용되는 스타일을 의미합니다. 예를 들어, w는 width(넓이)를 나타내며 w-full은 요소가 부모 요소의 전체 넓이를 차지하도록 설정된 것입니다. 또한, max-w-7xl(1280px)은 요소의 최대 넓이를 7xl로 제한하는 설정입니다.
작업을 진행하다 보면 자연스럽게 각 클래스가 어떤 스타일을 적용하는지 파악할 수 있지만, 처음에는 이를 외우거나 학습할 필요는 없습니다. 커스터마이징 문서에서 각 클래스에 대한 설명을 제공하여, 처음 접하시는 분들도 쉽게 수정 및 업데이트할 수 있도록 지원할 예정입니다. 이를 통해 고객님이 원하는 스타일을 빠르고 간편하게 조정할 수 있기를 바랍니다.