Skip to main content
디자인 도구를 사용해본 경험이 없거나, 서체와 글꼴의 차이를 알 필요가 없으며, 그리드 시스템을 이해할 필요도 없습니다. Flowstep은 레이아웃, 타이포그래피, 색상, 간격 및 시각적 계층 구조를 자동으로 처리합니다. 당신의 역할은 단순히 원하는 것을 설명하는 것입니다.

디자인 스킬 없이 작동하는 방식

프롬프트를 입력하면 Flowstep은 당신의 설명을 해석하고 디자이너가 일반적으로 하는 모든 시각적 결정을 내립니다. 화면에서 요소를 배치하는 방법, 어떤 글꼴을 사용할지, 얼마나 많은 공백을 추가할지, 시선을 유도하는 시각적 계층 구조를 어떻게 구축할지 결정합니다. 당신은 목적과 내용을 설명하고, Flowstep은 전문가가 디자인한 것처럼 보이는 화면을 생성합니다.
Flowstep에 프롬프트를 입력하는 방식을 디자이너에게 지시하는 것과 같이 생각합니다. 디자이너에게 글꼴 크기를 사용하도록 지시하지 않습니다. 대신 화면이 무엇을 위한 것인지, 무엇을 전달해야 하는지를 설명합니다. Flowstep도 같은 방식으로 작동합니다.

좋은 프롬프트를 작성하기 위한 팁

세 가지 사항에 집중합니다. 화면의 목적, 표시해야 할 핵심 정보, 그리고 제품의 유형 또는 대상 사용자입니다. 화면의 목적으로 시작합니다 화면이 해야 할 일로 시작합니다. “식사 계획 앱의 가입 화면”은 UI 요소 목록보다 Flowstep에 훨씬 더 많은 정보를 제공합니다. 핵심 콘텐츠 또는 작업을 언급합니다 사용자가 보거나 수행해야 할 가장 중요한 사항을 포함합니다. 모든 것을 나열할 필요는 없습니다. 경험에 가장 중요한 요소만 포함하면 됩니다. 도움이 되면 제품 유형이나 대상 사용자를 언급합니다 제품의 종류(예: 소비자 모바일 앱, B2B 대시보드, 전자상거래 결제)를 언급하면 Flowstep이 올바른 시각적 톤과 관례를 맞추는 데 도움이 됩니다.
첫 번째 결과가 정확하지 않으면 다시 시작하지 마세요. 후속 프롬프트를 입력하면 됩니다. “레이아웃을 더 미니멀하게 만들기” 또는 “더 어두운 색 구성표 사용”이라고 말하는 것으로도 디자인을 새로운 방향으로 유도할 수 있습니다.

시도해볼 예시 프롬프트

다음은 디자인 용어를 사용하지 않고 일반 영어로 작성된 잘 작동하는 몇 가지 프롬프트입니다. 피트니스 앱의 온보딩 흐름
“피트니스 추적 앱의 온보딩 흐름의 첫 번째 화면입니다. 사용자를 환영하고, 앱이 하는 일을 간단히 설명하며, 시작할 수 있는 버튼이 있어야 합니다.”
SaaS 제품의 설정 페이지
“B2B 프로젝트 관리 도구의 설정 페이지입니다. 프로필, 알림, 청구 및 연결된 계정에 대한 섹션을 포함합니다. 깔끔하고 전문적인 모양을 사용합니다.”
모바일 결제 화면
“모바일 쇼핑 앱의 결제 화면입니다. 주문 요약, 프로모션 코드 입력 필드, 그리고 구매를 완료할 수 있는 눈에 띄는 버튼을 표시합니다.”
이 프롬프트는 디자인 언어를 사용하기 때문에 작동하는 것이 아니라, 화면의 목적, 내용 및 컨텍스트를 명확하게 설명하기 때문에 작동합니다. 이것이 필요한 모든 것입니다.