ㅅㅈㅍ ㅈㅂㅈㅇ (신제품 정보좀요)

디자인 시스템 소개 | FlutterFlow University

1. FlutterFlow에서 디자인 시스템 구축의 중요성

• FlutterFlow에서는 두 가지 방법으로 빌드를 할 수 있다. 첫 번째는 그냥 뛰어들어서 놀면 되는 방식이다.
• 하지만 실제 앱을 만들 준비가 되었다면 디자인 시스템부터 설정하는 것이 좋다. 디자인 시스템은 앱에서 사용할 모든 요소를 미리 설정하는 것이다.
• 디자인 시스템을 먼저 설정하는 이유는 속도와 확장성을 제공하기 때문이다. 버튼을 디자인할 때 앱 전체에 있는 모든 버튼을 다시 디자인할 필요 없이 한 번 디자인하고 여러 곳에서 사용할 수 있다.
• 또한, FlutterFlow는 디자인 시스템 중심의 접근 방식으로 구축되었기 때문에 효율적으로 작업할 수 있다. 여러 디자인 시스템을 구축하고 프로젝트에 적용할 수 있다.
• 빌드 과정에서도 디자인 시스템을 참조하거나 값에 바인딩할 수 있다. 더 많은 디자이너와 개발자가 플러터플로우를 사용함에 따라 디자인 시스템 기능도 함께 성장한다.

FlutterFlow에서 디자인 시스템 구축이 왜 중요한가요?

FlutterFlow에서는 두 가지 방법으로 빌드할 수 있어요.

첫 번째는 그냥 뛰어들어서 놀면 되는 방식이에요.

하지만 실제 앱을 만들 준비가 되었다면 디자인 시스템부터 설정하는 것이 좋아요.

디자인 시스템은 앱에서 사용할 모든 요소를 미리 설정하는 거예요.

디자인 시스템을 먼저 설정하는 이유는 속도와 확장성을 제공하기 때문이에요.

버튼을 디자인할 때 앱 전체에 있는 모든 버튼을 다시 디자인할 필요 없이 한 번 디자인하고 여러 곳에서 사용할 수 있어요.

또한, FlutterFlow는 디자인 시스템 중심의 접근 방식으로 구축되어 있어서 효율적으로 작업할 수 있어요.

여러 디자인 시스템을 구축하고 프로젝트에 적용할 수도 있어요.

빌드 과정에서도 디자인 시스템을 참조하거나 값에 바인딩할 수도 있어요.

더 많은 디자이너와 개발자가 플러터플로우를 사용함에 따라 디자인 시스템 기능도 함께 성장해나갈 거예요.

디자인 시스템 소개 | FlutterFlow University

There are two ways to build in FlutterFlow. First is just jumping in and playing around and that's great. I do it all the time.
But when you're ready to start building a real app, you should start by setting up your design system. And you do that by coming into your theme settings on the bottom left here. Now, a design system is just setting up or pre-making everything that you're going to use in your app. Basically, anything that you will repeatedly use, you should set up in your design system first. And this covers everything from the smallest things like color and typography to larger elements like components like a form or header sections.
And the reason you want to set up your design system first is because this will give you two things: speed and scalability. It will give you speed because instead of having to redesign a button everywhere in your app where a button occurs, you can design it once and then just drop it in. In real practical terms, this means that instead of having to click 20 times to set up a that button every time, you can click once. And second, it gives you scalability. That is, when your app grows and you need another page, you already have the colors, the types, the components designed and built. Creating that new page is not like building a house brick by brick, but simply putting together a few rooms that were already pre-made. FlutterFlow was built with a design system-centric approach, and I mean two things by this..
First, the design system is integrated into every step of building your app.  Nothing is siloed or hidden, so you can work efficiently. That's why you'll see this set from variable symbol everywhere, because you can reference or bind values to your design system anywhere where you see it. So for instance, if you have a custom function in your design system that adds a prefix to a string, you could use it here with a simple text in an action or a back-end call, never having to rewrite it.
And second, as your team scales with more designers and developers building on FlutterFlow, our design system capabilities grow as well. Multiple design systems can be built and live in your organization that you can pull into different projects. And these design systems don't just include visual elements like colors, type, and components but whole API and code libraries. Alright, so let's jump in and start setting up our design system...